react-restyle-components 0.2.5 → 0.2.7
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.
- package/lib/package.json +8 -2
- package/lib/src/App.css +1 -1
- package/lib/src/App.js +4 -547
- package/lib/src/core-components/index.d.ts +1 -0
- package/lib/src/core-components/index.js +1 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.component.d.ts +6 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.component.js +14 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.css +23 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.spec.d.ts +1 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.spec.js +9 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.stories.d.ts +6 -0
- package/lib/src/core-components/molecules/color-picker/color-picker.stories.js +18 -0
- package/lib/src/hooks/index.d.ts +1 -0
- package/lib/src/hooks/index.js +1 -0
- package/lib/src/hooks/outside.hook.d.ts +1 -0
- package/lib/src/hooks/outside.hook.js +28 -0
- package/lib/src/index.css +12 -12
- package/lib/src/tc.css +944 -1
- package/package.json +8 -2
package/lib/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-restyle-components",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.6",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Easy use restyle components",
|
|
6
6
|
"author": {
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
],
|
|
17
17
|
"scripts": {
|
|
18
18
|
"start": "serve -s ./build",
|
|
19
|
-
"dev": "craco start",
|
|
19
|
+
"dev": "DISABLE_ESLINT_PLUGIN=true craco start",
|
|
20
20
|
"serve-webapp": "craco build && craco start",
|
|
21
21
|
"build": "rm -rf ./lib && tsc && chmod +x npm-publish.sh && sh ./npm-publish.sh",
|
|
22
22
|
"test": "jest",
|
|
@@ -25,7 +25,10 @@
|
|
|
25
25
|
"storybook": "storybook dev -p 6006",
|
|
26
26
|
"build-storybook": "rm -rf docs-build && storybook build -o docs-build",
|
|
27
27
|
"deploy-storybook": "gh-pages -d docs-build",
|
|
28
|
+
"lint": "eslint .",
|
|
29
|
+
"lint:fix": "eslint --fix .",
|
|
28
30
|
"prettier": "prettier --write '**/*.{js,jsx}'",
|
|
31
|
+
"format": "prettier --write \"**/*.+(js|jsx|json|css|md)\"",
|
|
29
32
|
"go": "npm run build && npm publish"
|
|
30
33
|
},
|
|
31
34
|
"dependencies": {
|
|
@@ -41,6 +44,7 @@
|
|
|
41
44
|
"@types/react-dom": "^18.3.0",
|
|
42
45
|
"dayjs": "^1.11.1",
|
|
43
46
|
"jest-environment-jsdom": "^29.7.0",
|
|
47
|
+
"react-colorful": "^5.6.1",
|
|
44
48
|
"react-datepicker": "^4.7.0",
|
|
45
49
|
"react-icons": "^5.2.1",
|
|
46
50
|
"react-scripts": "5.0.1",
|
|
@@ -71,12 +75,14 @@
|
|
|
71
75
|
"copyfiles": "^2.4.1",
|
|
72
76
|
"craco-alias": "^3.0.1",
|
|
73
77
|
"css-loader": "^7.1.2",
|
|
78
|
+
"eslint": "^9.14.0",
|
|
74
79
|
"eslint-plugin-storybook": "^0.8.0",
|
|
75
80
|
"gh-pages": "^3.2.3",
|
|
76
81
|
"husky": "^7.0.4",
|
|
77
82
|
"jest": "^29.7.0",
|
|
78
83
|
"lint-staged": "^12.4.0",
|
|
79
84
|
"postcss-loader": "^8.1.1",
|
|
85
|
+
"prettier": "^3.3.3",
|
|
80
86
|
"sass": "^1.77.5",
|
|
81
87
|
"sass-loader": "^14.2.1",
|
|
82
88
|
"storybook": "^8.0.6",
|
package/lib/src/App.css
CHANGED
package/lib/src/App.js
CHANGED
|
@@ -1,553 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
2
|
import './App.css';
|
|
3
|
-
import {
|
|
3
|
+
import { ColorPicker, } from './core-components';
|
|
4
4
|
function App() {
|
|
5
|
+
const [color, setColor] = useState('#aabbcc');
|
|
5
6
|
return (React.createElement("div", { className: "flex flex-col gap-4 p-4" },
|
|
6
7
|
React.createElement("p", { style: { margin: '0 0 10px 0' } }, "Autocomplete Comp."),
|
|
7
|
-
React.createElement(
|
|
8
|
-
console.log({ item });
|
|
9
|
-
} }),
|
|
10
|
-
React.createElement(AutocompleteGroupBy, { data: [
|
|
11
|
-
{
|
|
12
|
-
path: '/registration',
|
|
13
|
-
name: 'Registration',
|
|
14
|
-
title: 'REGISTRATION',
|
|
15
|
-
order: 1,
|
|
16
|
-
icon: 'RiUserAddLine',
|
|
17
|
-
children: [
|
|
18
|
-
{
|
|
19
|
-
path: '/registration/patient',
|
|
20
|
-
name: 'Patient Registration',
|
|
21
|
-
icon: 'FaAddressCard',
|
|
22
|
-
title: 'Patient Registration',
|
|
23
|
-
},
|
|
24
|
-
{
|
|
25
|
-
path: '/registration/client',
|
|
26
|
-
name: 'Client Registration',
|
|
27
|
-
icon: 'FaRegUser',
|
|
28
|
-
title: 'Client Registration',
|
|
29
|
-
},
|
|
30
|
-
],
|
|
31
|
-
},
|
|
32
|
-
{
|
|
33
|
-
path: '/home-collection',
|
|
34
|
-
name: 'Home Collection',
|
|
35
|
-
title: 'HOME COLLECTION',
|
|
36
|
-
order: 7,
|
|
37
|
-
icon: 'BsFillCollectionFill',
|
|
38
|
-
badgeColor: '#ffffff',
|
|
39
|
-
children: [
|
|
40
|
-
{
|
|
41
|
-
path: '/home-collection/booking-chart',
|
|
42
|
-
name: 'Booking Chart',
|
|
43
|
-
icon: 'BiCommentDetail',
|
|
44
|
-
title: 'Booking Chart',
|
|
45
|
-
},
|
|
46
|
-
{
|
|
47
|
-
path: '/home-collection/collection-location',
|
|
48
|
-
name: 'Collection Location',
|
|
49
|
-
icon: 'BiCommentDetail',
|
|
50
|
-
title: 'Collection Location',
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
path: '/home-collection/field-executive',
|
|
54
|
-
name: 'Field Executive',
|
|
55
|
-
icon: 'BiCommentDetail',
|
|
56
|
-
title: 'Field Executive',
|
|
57
|
-
},
|
|
58
|
-
{
|
|
59
|
-
path: '/home-collection/field-executive',
|
|
60
|
-
name: 'Field Executive',
|
|
61
|
-
icon: 'BiCommentDetail',
|
|
62
|
-
title: 'Field Executive',
|
|
63
|
-
},
|
|
64
|
-
{
|
|
65
|
-
path: '/home-collection/route',
|
|
66
|
-
name: 'Route',
|
|
67
|
-
icon: 'BiCommentDetail',
|
|
68
|
-
title: 'Route',
|
|
69
|
-
},
|
|
70
|
-
{
|
|
71
|
-
path: '/home-collection/fe-allocation',
|
|
72
|
-
name: 'FE Allocation',
|
|
73
|
-
icon: 'BiCommentDetail',
|
|
74
|
-
title: 'FE Allocation',
|
|
75
|
-
},
|
|
76
|
-
{
|
|
77
|
-
path: '/home-collection/contact-information',
|
|
78
|
-
name: 'Contact Information',
|
|
79
|
-
icon: 'BiCommentDetail',
|
|
80
|
-
title: 'Contact Information',
|
|
81
|
-
},
|
|
82
|
-
{
|
|
83
|
-
path: '/home-collection/time-slot',
|
|
84
|
-
name: 'Time Slot',
|
|
85
|
-
icon: 'BiCommentDetail',
|
|
86
|
-
title: 'Time Slot',
|
|
87
|
-
},
|
|
88
|
-
],
|
|
89
|
-
},
|
|
90
|
-
{
|
|
91
|
-
path: '/account-receivable',
|
|
92
|
-
name: 'Account Receivable',
|
|
93
|
-
title: 'ACCOUNT RECEIVABLE',
|
|
94
|
-
order: 2,
|
|
95
|
-
icon: 'MdAccountBalance',
|
|
96
|
-
children: [
|
|
97
|
-
{
|
|
98
|
-
path: '/account-receivable/transaction-details',
|
|
99
|
-
name: 'Transaction Details',
|
|
100
|
-
icon: 'RiCouponLine',
|
|
101
|
-
title: 'Transaction Details',
|
|
102
|
-
},
|
|
103
|
-
{
|
|
104
|
-
path: '/account-receivable/payment',
|
|
105
|
-
name: 'Payment',
|
|
106
|
-
icon: 'BsPiggyBank',
|
|
107
|
-
title: 'Payment',
|
|
108
|
-
},
|
|
109
|
-
{
|
|
110
|
-
path: '/account-receivable/open-batch',
|
|
111
|
-
name: 'Open Batch',
|
|
112
|
-
icon: 'MdOutlineBatchPrediction',
|
|
113
|
-
title: 'Open Batch',
|
|
114
|
-
},
|
|
115
|
-
{
|
|
116
|
-
path: '/account-receivable/receipt',
|
|
117
|
-
name: 'Receipt',
|
|
118
|
-
icon: 'BsReceipt',
|
|
119
|
-
title: 'Receipt',
|
|
120
|
-
},
|
|
121
|
-
{
|
|
122
|
-
path: '/account-receivable/bill-summary',
|
|
123
|
-
name: 'Bill Summary',
|
|
124
|
-
icon: 'IoReceiptOutline',
|
|
125
|
-
title: 'Bill Summary',
|
|
126
|
-
},
|
|
127
|
-
],
|
|
128
|
-
},
|
|
129
|
-
{
|
|
130
|
-
path: '/sample-management',
|
|
131
|
-
name: 'Sample Management',
|
|
132
|
-
title: 'SAMPLE MANAGEMENT',
|
|
133
|
-
order: 12,
|
|
134
|
-
icon: 'TbTopologyStar3',
|
|
135
|
-
children: [
|
|
136
|
-
{
|
|
137
|
-
path: '/sample-management/phlebotomy',
|
|
138
|
-
name: 'Phlebotomy',
|
|
139
|
-
icon: 'BiCommentDetail',
|
|
140
|
-
title: 'Phlebotomy',
|
|
141
|
-
},
|
|
142
|
-
],
|
|
143
|
-
},
|
|
144
|
-
{
|
|
145
|
-
path: '/result-entry',
|
|
146
|
-
name: 'Result Entry',
|
|
147
|
-
title: 'RESULT ENTRY',
|
|
148
|
-
order: 3,
|
|
149
|
-
icon: 'SiSentry',
|
|
150
|
-
children: [
|
|
151
|
-
{
|
|
152
|
-
path: '/result-entry/general',
|
|
153
|
-
name: 'General Result Entry',
|
|
154
|
-
icon: 'BiCategory',
|
|
155
|
-
title: 'General Result Entry',
|
|
156
|
-
},
|
|
157
|
-
{
|
|
158
|
-
path: '/result-entry/micro',
|
|
159
|
-
name: 'Micro Result Entry',
|
|
160
|
-
icon: 'GiMicroscope',
|
|
161
|
-
title: 'Micro Result Entry',
|
|
162
|
-
},
|
|
163
|
-
{
|
|
164
|
-
path: '/result-entry/histo',
|
|
165
|
-
name: 'Histo Result Entry',
|
|
166
|
-
icon: 'MdHistoryToggleOff',
|
|
167
|
-
title: 'Histo Result Entry',
|
|
168
|
-
},
|
|
169
|
-
],
|
|
170
|
-
},
|
|
171
|
-
{
|
|
172
|
-
path: '/validation',
|
|
173
|
-
name: 'Validation',
|
|
174
|
-
title: 'PANEL APPROVAL',
|
|
175
|
-
order: 4,
|
|
176
|
-
icon: 'MdOutlineRule',
|
|
177
|
-
children: [
|
|
178
|
-
{
|
|
179
|
-
path: '/validation/panel-approval',
|
|
180
|
-
name: 'Panel Approval',
|
|
181
|
-
icon: 'MdOutlineApproval',
|
|
182
|
-
title: 'Panel Approval',
|
|
183
|
-
},
|
|
184
|
-
],
|
|
185
|
-
},
|
|
186
|
-
{
|
|
187
|
-
path: '/patient-reports',
|
|
188
|
-
name: 'Patient Reports',
|
|
189
|
-
title: 'PATIENT REPORTS',
|
|
190
|
-
order: 5,
|
|
191
|
-
icon: 'MdOutlineLibraryBooks',
|
|
192
|
-
children: [
|
|
193
|
-
{
|
|
194
|
-
path: '/patient-reports/generate-report',
|
|
195
|
-
name: 'Generate Report',
|
|
196
|
-
icon: 'GiRegeneration',
|
|
197
|
-
title: 'Generate Report',
|
|
198
|
-
},
|
|
199
|
-
{
|
|
200
|
-
path: '/patient-reports/delivery-queue',
|
|
201
|
-
name: 'Delivery Queue',
|
|
202
|
-
icon: 'MdOutlineDeliveryDining',
|
|
203
|
-
title: 'Delivery Queue',
|
|
204
|
-
},
|
|
205
|
-
],
|
|
206
|
-
},
|
|
207
|
-
{
|
|
208
|
-
path: '/communication',
|
|
209
|
-
name: 'Communication',
|
|
210
|
-
title: 'EDI ENGINE',
|
|
211
|
-
order: 6,
|
|
212
|
-
icon: 'FaCommentDots',
|
|
213
|
-
children: [
|
|
214
|
-
{
|
|
215
|
-
path: '/communication/interface-manager',
|
|
216
|
-
name: 'Interface Manager',
|
|
217
|
-
icon: 'CgCommunity',
|
|
218
|
-
title: 'Interface Manager',
|
|
219
|
-
},
|
|
220
|
-
{
|
|
221
|
-
path: '/communication/mapping/conversation-mapping',
|
|
222
|
-
name: 'Conversation Mapping',
|
|
223
|
-
icon: 'GiConversation',
|
|
224
|
-
title: 'Conversation Mapping',
|
|
225
|
-
},
|
|
226
|
-
{
|
|
227
|
-
path: '/communication/host-communication',
|
|
228
|
-
name: 'Host Communication',
|
|
229
|
-
icon: 'RiGhostSmileLine',
|
|
230
|
-
title: 'Host Communication',
|
|
231
|
-
},
|
|
232
|
-
{
|
|
233
|
-
path: '/communication/mapping/segment-mapping',
|
|
234
|
-
name: 'Data Segment Mapping',
|
|
235
|
-
icon: 'GiDatabase',
|
|
236
|
-
title: 'Data Segment Mapping',
|
|
237
|
-
},
|
|
238
|
-
{
|
|
239
|
-
path: '/communication/instrument-result-mapping',
|
|
240
|
-
name: 'Instrument Result Mapping',
|
|
241
|
-
icon: 'VscOutput',
|
|
242
|
-
title: 'Instrument Result Mapping',
|
|
243
|
-
},
|
|
244
|
-
{
|
|
245
|
-
path: '/communication/transmitted-message',
|
|
246
|
-
name: 'Transmitted Message',
|
|
247
|
-
icon: 'AiOutlineMessage',
|
|
248
|
-
title: 'Transmitted Message',
|
|
249
|
-
},
|
|
250
|
-
],
|
|
251
|
-
},
|
|
252
|
-
{
|
|
253
|
-
path: '/collection',
|
|
254
|
-
name: 'Collection',
|
|
255
|
-
title: 'MASTER SETUP',
|
|
256
|
-
order: 7,
|
|
257
|
-
icon: 'BsFillCollectionFill',
|
|
258
|
-
badgeColor: '#ffffff',
|
|
259
|
-
children: [
|
|
260
|
-
{
|
|
261
|
-
path: '/collection/banner',
|
|
262
|
-
name: 'Banner',
|
|
263
|
-
icon: 'ImImages',
|
|
264
|
-
title: 'Banner',
|
|
265
|
-
},
|
|
266
|
-
{
|
|
267
|
-
path: '/collection/lab',
|
|
268
|
-
name: 'Lab',
|
|
269
|
-
icon: 'ImLab',
|
|
270
|
-
title: 'Lab',
|
|
271
|
-
},
|
|
272
|
-
{
|
|
273
|
-
path: '/collection/deginisation',
|
|
274
|
-
name: 'Deginisation',
|
|
275
|
-
icon: 'FaUserMd',
|
|
276
|
-
title: 'Deginisation',
|
|
277
|
-
},
|
|
278
|
-
{
|
|
279
|
-
path: '/collection/department',
|
|
280
|
-
name: 'Department',
|
|
281
|
-
icon: 'FcDepartment',
|
|
282
|
-
title: 'Department',
|
|
283
|
-
},
|
|
284
|
-
{
|
|
285
|
-
path: '/collection/master-analyte',
|
|
286
|
-
name: 'Analyte Master',
|
|
287
|
-
icon: 'IoMdAnalytics',
|
|
288
|
-
title: 'Analyte Master',
|
|
289
|
-
},
|
|
290
|
-
{
|
|
291
|
-
path: '/collection/test-analyte-mapping',
|
|
292
|
-
name: 'Test Analyte Mapping',
|
|
293
|
-
icon: 'IoIosAnalytics',
|
|
294
|
-
title: 'Test Analyte Mapping',
|
|
295
|
-
},
|
|
296
|
-
{
|
|
297
|
-
path: '/collection/master-panel',
|
|
298
|
-
name: 'Panel Master',
|
|
299
|
-
icon: 'FaSolarPanel',
|
|
300
|
-
title: 'Panel Master',
|
|
301
|
-
},
|
|
302
|
-
{
|
|
303
|
-
path: '/collection/test-panel-mapping',
|
|
304
|
-
name: 'Test Panel Mapping',
|
|
305
|
-
icon: 'FaLayerGroup',
|
|
306
|
-
title: 'Test Panel Mapping',
|
|
307
|
-
},
|
|
308
|
-
{
|
|
309
|
-
path: '/collection/master-package',
|
|
310
|
-
name: 'Package Master',
|
|
311
|
-
icon: 'FiPackage',
|
|
312
|
-
title: 'Package Master',
|
|
313
|
-
},
|
|
314
|
-
{
|
|
315
|
-
path: '/collection/test-master',
|
|
316
|
-
name: 'Test Master',
|
|
317
|
-
icon: 'SiMinetest',
|
|
318
|
-
title: 'Test Master',
|
|
319
|
-
},
|
|
320
|
-
{
|
|
321
|
-
path: '/collection/section',
|
|
322
|
-
name: 'Section',
|
|
323
|
-
icon: 'BsGrid3X3',
|
|
324
|
-
title: 'Section',
|
|
325
|
-
},
|
|
326
|
-
{
|
|
327
|
-
path: '/collection/sample-container',
|
|
328
|
-
name: 'Sample Container',
|
|
329
|
-
icon: 'AiOutlineContainer',
|
|
330
|
-
title: 'Sample Container',
|
|
331
|
-
},
|
|
332
|
-
{
|
|
333
|
-
path: '/collection/sample-type',
|
|
334
|
-
name: 'Sample Type',
|
|
335
|
-
icon: 'FaBuromobelexperte',
|
|
336
|
-
title: 'Sample Type',
|
|
337
|
-
},
|
|
338
|
-
{
|
|
339
|
-
path: '/collection/test-sample-mapping',
|
|
340
|
-
name: 'Test Sample Mapping',
|
|
341
|
-
icon: 'IoIosGitCompare',
|
|
342
|
-
title: 'Test Sample Mapping',
|
|
343
|
-
},
|
|
344
|
-
{
|
|
345
|
-
path: '/collection/methods',
|
|
346
|
-
name: 'Methods',
|
|
347
|
-
icon: 'VscSymbolMethod',
|
|
348
|
-
title: 'Methods',
|
|
349
|
-
},
|
|
350
|
-
{
|
|
351
|
-
path: '/collection/doctors',
|
|
352
|
-
name: 'Doctors',
|
|
353
|
-
icon: 'GiHospitalCross',
|
|
354
|
-
title: 'Doctors',
|
|
355
|
-
},
|
|
356
|
-
{
|
|
357
|
-
path: '/collection/registration-locations',
|
|
358
|
-
name: 'Registartion Locations',
|
|
359
|
-
icon: 'RiMap2Line',
|
|
360
|
-
title: 'Registartion Locations',
|
|
361
|
-
},
|
|
362
|
-
{
|
|
363
|
-
path: '/collection/corporate-clients',
|
|
364
|
-
name: 'Corporate Clients',
|
|
365
|
-
icon: 'FiUsers',
|
|
366
|
-
title: 'Corporate Clients',
|
|
367
|
-
},
|
|
368
|
-
{
|
|
369
|
-
path: '/collection/delivery-schedule',
|
|
370
|
-
name: 'Delivery Schedule',
|
|
371
|
-
icon: 'AiOutlineSchedule',
|
|
372
|
-
title: 'Delivery Schedule',
|
|
373
|
-
},
|
|
374
|
-
{
|
|
375
|
-
path: '/collection/administrative-divisions',
|
|
376
|
-
name: 'Administrative Divisions',
|
|
377
|
-
icon: 'FaAddressCard',
|
|
378
|
-
title: 'Administrative Divisions',
|
|
379
|
-
},
|
|
380
|
-
{
|
|
381
|
-
path: '/collection/sales-team',
|
|
382
|
-
name: 'Sales Team',
|
|
383
|
-
icon: 'RiTeamLine',
|
|
384
|
-
title: 'Sales Team',
|
|
385
|
-
},
|
|
386
|
-
{
|
|
387
|
-
path: '/collection/possible-results',
|
|
388
|
-
name: 'Possible Results',
|
|
389
|
-
icon: 'AiOutlineSolution',
|
|
390
|
-
title: 'Possible Results',
|
|
391
|
-
},
|
|
392
|
-
{
|
|
393
|
-
path: '/collection/library',
|
|
394
|
-
name: 'Library',
|
|
395
|
-
icon: 'HiLibrary',
|
|
396
|
-
title: 'Library',
|
|
397
|
-
},
|
|
398
|
-
{
|
|
399
|
-
path: '/collection/price-list',
|
|
400
|
-
name: 'PriceList',
|
|
401
|
-
icon: 'GiPriceTag',
|
|
402
|
-
title: 'PriceList',
|
|
403
|
-
},
|
|
404
|
-
{
|
|
405
|
-
path: '/collection/reference-ranges',
|
|
406
|
-
name: 'ReferenceRanges',
|
|
407
|
-
icon: 'VscReferences',
|
|
408
|
-
title: 'ReferenceRanges',
|
|
409
|
-
},
|
|
410
|
-
{
|
|
411
|
-
path: '/collection/comment-manager',
|
|
412
|
-
name: 'Comment Manager',
|
|
413
|
-
icon: 'BiCommentDetail',
|
|
414
|
-
title: 'Comment Manager',
|
|
415
|
-
},
|
|
416
|
-
{
|
|
417
|
-
path: '/collection/tat-master',
|
|
418
|
-
name: 'TAT Settings',
|
|
419
|
-
icon: 'BiCommentDetail',
|
|
420
|
-
title: 'TAT Settings',
|
|
421
|
-
},
|
|
422
|
-
{
|
|
423
|
-
path: '/collection/holiday-master',
|
|
424
|
-
name: 'Holiday Master',
|
|
425
|
-
icon: 'BiCommentDetail',
|
|
426
|
-
title: 'Holiday Master',
|
|
427
|
-
},
|
|
428
|
-
],
|
|
429
|
-
},
|
|
430
|
-
{
|
|
431
|
-
path: '/workflow-manager',
|
|
432
|
-
name: 'Workflow Manager',
|
|
433
|
-
title: 'WORKFLOW MANAGER',
|
|
434
|
-
order: 11,
|
|
435
|
-
icon: 'TbTopologyStar3',
|
|
436
|
-
children: [
|
|
437
|
-
{
|
|
438
|
-
path: '/workflow-manager/sample-workflow',
|
|
439
|
-
name: 'Sample Workflow',
|
|
440
|
-
icon: 'BiCommentDetail',
|
|
441
|
-
title: 'Sample Workflow',
|
|
442
|
-
},
|
|
443
|
-
],
|
|
444
|
-
},
|
|
445
|
-
{
|
|
446
|
-
path: '/settings',
|
|
447
|
-
name: 'Settings',
|
|
448
|
-
title: 'APPLICATION SETTING',
|
|
449
|
-
order: 8,
|
|
450
|
-
icon: 'RiSettings5Fill',
|
|
451
|
-
children: [
|
|
452
|
-
{
|
|
453
|
-
path: '/settings/role',
|
|
454
|
-
name: 'Role',
|
|
455
|
-
icon: 'GiKeyring',
|
|
456
|
-
title: 'Role',
|
|
457
|
-
},
|
|
458
|
-
{
|
|
459
|
-
path: '/settings/users',
|
|
460
|
-
name: 'User',
|
|
461
|
-
icon: 'FaUsersCog',
|
|
462
|
-
title: 'User',
|
|
463
|
-
},
|
|
464
|
-
{
|
|
465
|
-
path: '/settings/login-activity',
|
|
466
|
-
name: 'Login Activity',
|
|
467
|
-
icon: 'FiActivity',
|
|
468
|
-
title: 'Login Activity',
|
|
469
|
-
},
|
|
470
|
-
{
|
|
471
|
-
path: '/settings/mapping/role-mapping',
|
|
472
|
-
name: 'Role Mapping',
|
|
473
|
-
icon: 'RiShieldKeyholeFill',
|
|
474
|
-
title: 'Role Mapping',
|
|
475
|
-
},
|
|
476
|
-
{
|
|
477
|
-
path: '/settings/shortcut-menu',
|
|
478
|
-
name: 'Shortcut Menu',
|
|
479
|
-
icon: 'CgShortcut',
|
|
480
|
-
title: 'Shortcut Menu',
|
|
481
|
-
},
|
|
482
|
-
{
|
|
483
|
-
path: '/settings/environment',
|
|
484
|
-
name: 'Environment',
|
|
485
|
-
icon: 'MdSettingsInputComponent',
|
|
486
|
-
title: 'Environment',
|
|
487
|
-
},
|
|
488
|
-
{
|
|
489
|
-
path: '/settings/notice-boards',
|
|
490
|
-
name: 'Notice Boards',
|
|
491
|
-
icon: 'FaClipboardList',
|
|
492
|
-
title: 'Notice Boards',
|
|
493
|
-
},
|
|
494
|
-
{
|
|
495
|
-
path: '/settings/company',
|
|
496
|
-
name: 'Company',
|
|
497
|
-
icon: 'HiOutlineOfficeBuilding',
|
|
498
|
-
title: 'Company',
|
|
499
|
-
},
|
|
500
|
-
{
|
|
501
|
-
path: '/settings/lookup',
|
|
502
|
-
name: 'Lookup',
|
|
503
|
-
icon: 'MdLooks',
|
|
504
|
-
title: 'Lookup',
|
|
505
|
-
},
|
|
506
|
-
{
|
|
507
|
-
path: '/settings/field-wise-control',
|
|
508
|
-
name: 'Field Wise Control',
|
|
509
|
-
icon: 'MdLooks',
|
|
510
|
-
title: 'Field Wise Control',
|
|
511
|
-
},
|
|
512
|
-
],
|
|
513
|
-
},
|
|
514
|
-
{
|
|
515
|
-
path: '/report-builder',
|
|
516
|
-
name: 'Report Builder',
|
|
517
|
-
title: 'REPORT BUILDER',
|
|
518
|
-
order: 9,
|
|
519
|
-
icon: 'HiDocumentReport',
|
|
520
|
-
children: [
|
|
521
|
-
{
|
|
522
|
-
path: '/report-builder/report-settings',
|
|
523
|
-
name: 'Report Settings',
|
|
524
|
-
icon: 'RiListSettingsFill',
|
|
525
|
-
title: 'Report Settings',
|
|
526
|
-
},
|
|
527
|
-
{
|
|
528
|
-
path: '/report-builder/report-template',
|
|
529
|
-
name: 'Report Template',
|
|
530
|
-
icon: 'ImInsertTemplate',
|
|
531
|
-
title: 'Report Template',
|
|
532
|
-
},
|
|
533
|
-
],
|
|
534
|
-
},
|
|
535
|
-
{
|
|
536
|
-
path: '/enquiry',
|
|
537
|
-
name: 'Enquiry',
|
|
538
|
-
title: 'ENQUIRY',
|
|
539
|
-
order: 10,
|
|
540
|
-
icon: 'TbTopologyStar3',
|
|
541
|
-
children: [
|
|
542
|
-
{
|
|
543
|
-
path: '/enquiry/event-log',
|
|
544
|
-
name: 'Event Log',
|
|
545
|
-
icon: 'MdOutlineEventNote',
|
|
546
|
-
title: 'Event Log',
|
|
547
|
-
},
|
|
548
|
-
],
|
|
549
|
-
},
|
|
550
|
-
] }),
|
|
551
|
-
React.createElement(Autocomplete, { value: "", onValueChange: () => { }, options: ['One', 'Two', 'Three', 'Four', 'Five', 'Six'] })));
|
|
8
|
+
React.createElement(ColorPicker, { color: color, onChange: setColor })));
|
|
552
9
|
}
|
|
553
10
|
export default App;
|
|
@@ -22,4 +22,5 @@ export * from './molecules/multi-select-with-field/multi-select-with-field.compo
|
|
|
22
22
|
export * from './molecules/modal-confirm/modal-confirm.component';
|
|
23
23
|
export * from './molecules/autocomplete/autocomplete';
|
|
24
24
|
export * from './molecules/auto-complete-group-by/auto-complete-group-by.component';
|
|
25
|
+
export * from './molecules/color-picker/color-picker.component';
|
|
25
26
|
export { Form };
|
|
@@ -22,4 +22,5 @@ export * from './molecules/multi-select-with-field/multi-select-with-field.compo
|
|
|
22
22
|
export * from './molecules/modal-confirm/modal-confirm.component';
|
|
23
23
|
export * from './molecules/autocomplete/autocomplete';
|
|
24
24
|
export * from './molecules/auto-complete-group-by/auto-complete-group-by.component';
|
|
25
|
+
export * from './molecules/color-picker/color-picker.component';
|
|
25
26
|
export { Form };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React, { useCallback, useRef, useState } from 'react';
|
|
2
|
+
import { HexColorPicker } from 'react-colorful';
|
|
3
|
+
import { useClickOutside } from '../../../hooks';
|
|
4
|
+
import './color-picker.css';
|
|
5
|
+
export const ColorPicker = ({ color, onChange }) => {
|
|
6
|
+
const popover = useRef();
|
|
7
|
+
const [isOpen, toggle] = useState(false);
|
|
8
|
+
const close = useCallback(() => toggle(false), []);
|
|
9
|
+
useClickOutside(popover, close);
|
|
10
|
+
return (React.createElement("div", { className: "picker" },
|
|
11
|
+
React.createElement("div", { className: "swatch", style: { backgroundColor: color }, onClick: () => toggle(true) }),
|
|
12
|
+
isOpen && (React.createElement("div", { className: "popover", ref: popover },
|
|
13
|
+
React.createElement(HexColorPicker, { color: color, onChange: onChange })))));
|
|
14
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
.picker {
|
|
2
|
+
position: relative;
|
|
3
|
+
z-index: 999;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.swatch {
|
|
7
|
+
width: 28px;
|
|
8
|
+
height: 28px;
|
|
9
|
+
border-radius: 8px;
|
|
10
|
+
border: 3px solid #fff;
|
|
11
|
+
box-shadow:
|
|
12
|
+
0 0 0 1px rgba(0, 0, 0, 0.1),
|
|
13
|
+
inset 0 0 0 1px rgba(0, 0, 0, 0.1);
|
|
14
|
+
cursor: pointer;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.popover {
|
|
18
|
+
position: absolute;
|
|
19
|
+
top: calc(100% + 2px);
|
|
20
|
+
left: 0;
|
|
21
|
+
border-radius: 9px;
|
|
22
|
+
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
|
|
23
|
+
}
|