@apexcura/ui-components 0.0.12-Beta7 → 0.0.12-Beta70

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/dist/index.css ADDED
@@ -0,0 +1,485 @@
1
+ /* src/styles/index.css */
2
+ *,
3
+ ::before,
4
+ ::after {
5
+ box-sizing: border-box;
6
+ border-width: 0;
7
+ border-style: solid;
8
+ border-color: #e5e7eb;
9
+ }
10
+ ::before,
11
+ ::after {
12
+ --tw-content: "";
13
+ }
14
+ html,
15
+ :host {
16
+ line-height: 1.5;
17
+ -webkit-text-size-adjust: 100%;
18
+ -moz-tab-size: 4;
19
+ -o-tab-size: 4;
20
+ tab-size: 4;
21
+ font-family:
22
+ ui-sans-serif,
23
+ system-ui,
24
+ sans-serif,
25
+ "Apple Color Emoji",
26
+ "Segoe UI Emoji",
27
+ "Segoe UI Symbol",
28
+ "Noto Color Emoji";
29
+ font-feature-settings: normal;
30
+ font-variation-settings: normal;
31
+ -webkit-tap-highlight-color: transparent;
32
+ }
33
+ body {
34
+ margin: 0;
35
+ line-height: inherit;
36
+ }
37
+ hr {
38
+ height: 0;
39
+ color: inherit;
40
+ border-top-width: 1px;
41
+ }
42
+ abbr:where([title]) {
43
+ -webkit-text-decoration: underline dotted;
44
+ text-decoration: underline dotted;
45
+ }
46
+ h1,
47
+ h2,
48
+ h3,
49
+ h4,
50
+ h5,
51
+ h6 {
52
+ font-size: inherit;
53
+ font-weight: inherit;
54
+ }
55
+ a {
56
+ color: inherit;
57
+ text-decoration: inherit;
58
+ }
59
+ b,
60
+ strong {
61
+ font-weight: bolder;
62
+ }
63
+ code,
64
+ kbd,
65
+ samp,
66
+ pre {
67
+ font-family:
68
+ ui-monospace,
69
+ SFMono-Regular,
70
+ Menlo,
71
+ Monaco,
72
+ Consolas,
73
+ "Liberation Mono",
74
+ "Courier New",
75
+ monospace;
76
+ font-feature-settings: normal;
77
+ font-variation-settings: normal;
78
+ font-size: 1em;
79
+ }
80
+ small {
81
+ font-size: 80%;
82
+ }
83
+ sub,
84
+ sup {
85
+ font-size: 75%;
86
+ line-height: 0;
87
+ position: relative;
88
+ vertical-align: baseline;
89
+ }
90
+ sub {
91
+ bottom: -0.25em;
92
+ }
93
+ sup {
94
+ top: -0.5em;
95
+ }
96
+ table {
97
+ text-indent: 0;
98
+ border-color: inherit;
99
+ border-collapse: collapse;
100
+ }
101
+ button,
102
+ input,
103
+ optgroup,
104
+ select,
105
+ textarea {
106
+ font-family: inherit;
107
+ font-feature-settings: inherit;
108
+ font-variation-settings: inherit;
109
+ font-size: 100%;
110
+ font-weight: inherit;
111
+ line-height: inherit;
112
+ letter-spacing: inherit;
113
+ color: inherit;
114
+ margin: 0;
115
+ padding: 0;
116
+ }
117
+ button,
118
+ select {
119
+ text-transform: none;
120
+ }
121
+ button,
122
+ input:where([type=button]),
123
+ input:where([type=reset]),
124
+ input:where([type=submit]) {
125
+ -webkit-appearance: button;
126
+ background-color: transparent;
127
+ background-image: none;
128
+ }
129
+ :-moz-focusring {
130
+ outline: auto;
131
+ }
132
+ :-moz-ui-invalid {
133
+ box-shadow: none;
134
+ }
135
+ progress {
136
+ vertical-align: baseline;
137
+ }
138
+ ::-webkit-inner-spin-button,
139
+ ::-webkit-outer-spin-button {
140
+ height: auto;
141
+ }
142
+ [type=search] {
143
+ -webkit-appearance: textfield;
144
+ outline-offset: -2px;
145
+ }
146
+ ::-webkit-search-decoration {
147
+ -webkit-appearance: none;
148
+ }
149
+ ::-webkit-file-upload-button {
150
+ -webkit-appearance: button;
151
+ font: inherit;
152
+ }
153
+ summary {
154
+ display: list-item;
155
+ }
156
+ blockquote,
157
+ dl,
158
+ dd,
159
+ h1,
160
+ h2,
161
+ h3,
162
+ h4,
163
+ h5,
164
+ h6,
165
+ hr,
166
+ figure,
167
+ p,
168
+ pre {
169
+ margin: 0;
170
+ }
171
+ fieldset {
172
+ margin: 0;
173
+ padding: 0;
174
+ }
175
+ legend {
176
+ padding: 0;
177
+ }
178
+ ol,
179
+ ul,
180
+ menu {
181
+ list-style: none;
182
+ margin: 0;
183
+ padding: 0;
184
+ }
185
+ dialog {
186
+ padding: 0;
187
+ }
188
+ textarea {
189
+ resize: vertical;
190
+ }
191
+ input::-moz-placeholder,
192
+ textarea::-moz-placeholder {
193
+ opacity: 1;
194
+ color: #9ca3af;
195
+ }
196
+ input::placeholder,
197
+ textarea::placeholder {
198
+ opacity: 1;
199
+ color: #9ca3af;
200
+ }
201
+ button,
202
+ [role=button] {
203
+ cursor: pointer;
204
+ }
205
+ :disabled {
206
+ cursor: default;
207
+ }
208
+ img,
209
+ svg,
210
+ video,
211
+ canvas,
212
+ audio,
213
+ iframe,
214
+ embed,
215
+ object {
216
+ display: block;
217
+ vertical-align: middle;
218
+ }
219
+ img,
220
+ video {
221
+ max-width: 100%;
222
+ height: auto;
223
+ }
224
+ [hidden] {
225
+ display: none;
226
+ }
227
+ *,
228
+ ::before,
229
+ ::after {
230
+ --tw-border-spacing-x: 0;
231
+ --tw-border-spacing-y: 0;
232
+ --tw-translate-x: 0;
233
+ --tw-translate-y: 0;
234
+ --tw-rotate: 0;
235
+ --tw-skew-x: 0;
236
+ --tw-skew-y: 0;
237
+ --tw-scale-x: 1;
238
+ --tw-scale-y: 1;
239
+ --tw-pan-x: ;
240
+ --tw-pan-y: ;
241
+ --tw-pinch-zoom: ;
242
+ --tw-scroll-snap-strictness: proximity;
243
+ --tw-gradient-from-position: ;
244
+ --tw-gradient-via-position: ;
245
+ --tw-gradient-to-position: ;
246
+ --tw-ordinal: ;
247
+ --tw-slashed-zero: ;
248
+ --tw-numeric-figure: ;
249
+ --tw-numeric-spacing: ;
250
+ --tw-numeric-fraction: ;
251
+ --tw-ring-inset: ;
252
+ --tw-ring-offset-width: 0px;
253
+ --tw-ring-offset-color: #fff;
254
+ --tw-ring-color: rgb(59 130 246 / 0.5);
255
+ --tw-ring-offset-shadow: 0 0 #0000;
256
+ --tw-ring-shadow: 0 0 #0000;
257
+ --tw-shadow: 0 0 #0000;
258
+ --tw-shadow-colored: 0 0 #0000;
259
+ --tw-blur: ;
260
+ --tw-brightness: ;
261
+ --tw-contrast: ;
262
+ --tw-grayscale: ;
263
+ --tw-hue-rotate: ;
264
+ --tw-invert: ;
265
+ --tw-saturate: ;
266
+ --tw-sepia: ;
267
+ --tw-drop-shadow: ;
268
+ --tw-backdrop-blur: ;
269
+ --tw-backdrop-brightness: ;
270
+ --tw-backdrop-contrast: ;
271
+ --tw-backdrop-grayscale: ;
272
+ --tw-backdrop-hue-rotate: ;
273
+ --tw-backdrop-invert: ;
274
+ --tw-backdrop-opacity: ;
275
+ --tw-backdrop-saturate: ;
276
+ --tw-backdrop-sepia: ;
277
+ --tw-contain-size: ;
278
+ --tw-contain-layout: ;
279
+ --tw-contain-paint: ;
280
+ --tw-contain-style: ;
281
+ }
282
+ ::backdrop {
283
+ --tw-border-spacing-x: 0;
284
+ --tw-border-spacing-y: 0;
285
+ --tw-translate-x: 0;
286
+ --tw-translate-y: 0;
287
+ --tw-rotate: 0;
288
+ --tw-skew-x: 0;
289
+ --tw-skew-y: 0;
290
+ --tw-scale-x: 1;
291
+ --tw-scale-y: 1;
292
+ --tw-pan-x: ;
293
+ --tw-pan-y: ;
294
+ --tw-pinch-zoom: ;
295
+ --tw-scroll-snap-strictness: proximity;
296
+ --tw-gradient-from-position: ;
297
+ --tw-gradient-via-position: ;
298
+ --tw-gradient-to-position: ;
299
+ --tw-ordinal: ;
300
+ --tw-slashed-zero: ;
301
+ --tw-numeric-figure: ;
302
+ --tw-numeric-spacing: ;
303
+ --tw-numeric-fraction: ;
304
+ --tw-ring-inset: ;
305
+ --tw-ring-offset-width: 0px;
306
+ --tw-ring-offset-color: #fff;
307
+ --tw-ring-color: rgb(59 130 246 / 0.5);
308
+ --tw-ring-offset-shadow: 0 0 #0000;
309
+ --tw-ring-shadow: 0 0 #0000;
310
+ --tw-shadow: 0 0 #0000;
311
+ --tw-shadow-colored: 0 0 #0000;
312
+ --tw-blur: ;
313
+ --tw-brightness: ;
314
+ --tw-contrast: ;
315
+ --tw-grayscale: ;
316
+ --tw-hue-rotate: ;
317
+ --tw-invert: ;
318
+ --tw-saturate: ;
319
+ --tw-sepia: ;
320
+ --tw-drop-shadow: ;
321
+ --tw-backdrop-blur: ;
322
+ --tw-backdrop-brightness: ;
323
+ --tw-backdrop-contrast: ;
324
+ --tw-backdrop-grayscale: ;
325
+ --tw-backdrop-hue-rotate: ;
326
+ --tw-backdrop-invert: ;
327
+ --tw-backdrop-opacity: ;
328
+ --tw-backdrop-saturate: ;
329
+ --tw-backdrop-sepia: ;
330
+ --tw-contain-size: ;
331
+ --tw-contain-layout: ;
332
+ --tw-contain-paint: ;
333
+ --tw-contain-style: ;
334
+ }
335
+ .visible {
336
+ visibility: visible;
337
+ }
338
+ .\!m-\[10px\] {
339
+ margin: 10px !important;
340
+ }
341
+ .m-\[10px\] {
342
+ margin: 10px;
343
+ }
344
+ .table {
345
+ display: table;
346
+ }
347
+ .h-\[40px\] {
348
+ height: 40px;
349
+ }
350
+ .w-\[126px\] {
351
+ width: 126px;
352
+ }
353
+ .\!rounded-\[8px\] {
354
+ border-radius: 8px !important;
355
+ }
356
+ .rounded-\[8px\] {
357
+ border-radius: 8px;
358
+ }
359
+ .rounded-full {
360
+ border-radius: 9999px;
361
+ }
362
+ .\!border {
363
+ border-width: 1px !important;
364
+ }
365
+ .border {
366
+ border-width: 1px;
367
+ }
368
+ .border-none {
369
+ border-style: none;
370
+ }
371
+ .\!border-\[\#B8A4DE\] {
372
+ --tw-border-opacity: 1 !important;
373
+ border-color: rgb(184 164 222 / var(--tw-border-opacity)) !important;
374
+ }
375
+ .border-\[\#919191\] {
376
+ --tw-border-opacity: 1;
377
+ border-color: rgb(145 145 145 / var(--tw-border-opacity));
378
+ }
379
+ .\!bg-\[\#E2D6F8\] {
380
+ --tw-bg-opacity: 1 !important;
381
+ background-color: rgb(226 214 248 / var(--tw-bg-opacity)) !important;
382
+ }
383
+ .bg-\[\#F2F2F2\] {
384
+ --tw-bg-opacity: 1;
385
+ background-color: rgb(242 242 242 / var(--tw-bg-opacity));
386
+ }
387
+ .bg-purple-800 {
388
+ --tw-bg-opacity: 1;
389
+ background-color: rgb(107 33 168 / var(--tw-bg-opacity));
390
+ }
391
+ .p-\[6px\] {
392
+ padding: 6px;
393
+ }
394
+ .\!text-center {
395
+ text-align: center !important;
396
+ }
397
+ .text-center {
398
+ text-align: center;
399
+ }
400
+ .italic {
401
+ font-style: italic;
402
+ }
403
+ .\!text-black {
404
+ --tw-text-opacity: 1 !important;
405
+ color: rgb(0 0 0 / var(--tw-text-opacity)) !important;
406
+ }
407
+ .text-white {
408
+ --tw-text-opacity: 1;
409
+ color: rgb(255 255 255 / var(--tw-text-opacity));
410
+ }
411
+ .\!shadow-\[0px_0px_1px_1px_\#919191\] {
412
+ --tw-shadow: 0px 0px 1px 1px #919191 !important;
413
+ --tw-shadow-colored: 0px 0px 1px 1px var(--tw-shadow-color) !important;
414
+ box-shadow:
415
+ var(--tw-ring-offset-shadow, 0 0 #0000),
416
+ var(--tw-ring-shadow, 0 0 #0000),
417
+ var(--tw-shadow) !important;
418
+ }
419
+ .shadow-\[0px_0px_1px_1px_\#919191\] {
420
+ --tw-shadow: 0px 0px 1px 1px #919191;
421
+ --tw-shadow-colored: 0px 0px 1px 1px var(--tw-shadow-color);
422
+ box-shadow:
423
+ var(--tw-ring-offset-shadow, 0 0 #0000),
424
+ var(--tw-ring-shadow, 0 0 #0000),
425
+ var(--tw-shadow);
426
+ }
427
+ .shadow-\[0px_0px_1px_1px_\#B8A4DE\] {
428
+ --tw-shadow: 0px 0px 1px 1px #B8A4DE;
429
+ --tw-shadow-colored: 0px 0px 1px 1px var(--tw-shadow-color);
430
+ box-shadow:
431
+ var(--tw-ring-offset-shadow, 0 0 #0000),
432
+ var(--tw-ring-shadow, 0 0 #0000),
433
+ var(--tw-shadow);
434
+ }
435
+ .shadow-lg {
436
+ --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
437
+ --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
438
+ box-shadow:
439
+ var(--tw-ring-offset-shadow, 0 0 #0000),
440
+ var(--tw-ring-shadow, 0 0 #0000),
441
+ var(--tw-shadow);
442
+ }
443
+ .filter {
444
+ filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
445
+ }
446
+ .submit:where(.css-dev-only-do-not-override-1r287do).ant-btn-default:not(:disabled):not(.ant-btn-disabled):hover {
447
+ color: #472D7A;
448
+ background-color: white;
449
+ border: solid 1px #472D7A;
450
+ }
451
+ :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper {
452
+ border: 1px solid #919191;
453
+ }
454
+ :where(.css-dev-only-do-not-override-1r287do).ant-input-affix-wrapper {
455
+ border: solid 1px #919191;
456
+ width: 275px;
457
+ height: 16px;
458
+ padding: 16px;
459
+ gap: 10px;
460
+ }
461
+ :where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:hover {
462
+ border: solid 1px #919191;
463
+ }
464
+ :where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:focus {
465
+ border: solid 1px #919191;
466
+ }
467
+ :where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:focus-within {
468
+ border: solid 1px #919191;
469
+ }
470
+ :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
471
+ display: none;
472
+ }
473
+ :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::after {
474
+ display: none;
475
+ }
476
+ :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper:not(:first-child)::before {
477
+ width: 0;
478
+ }
479
+ :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper:first-child {
480
+ border-inline-start: 1px solid rgb(145 145 145);
481
+ }
482
+ .hover\:bg-\[\#F2F2F2\]:hover {
483
+ --tw-bg-opacity: 1;
484
+ background-color: rgb(242 242 242 / var(--tw-bg-opacity));
485
+ }
package/dist/index.d.mts CHANGED
@@ -1,28 +1,38 @@
1
1
  import React$1 from 'react';
2
2
 
3
3
  type ElementType = {
4
+ selectedStyle: boolean;
5
+ style: boolean;
6
+ className: string | undefined;
4
7
  placeholder?: string;
5
8
  addonBefore?: React.ReactNode;
6
9
  defaultValue?: string;
7
10
  disabled?: boolean;
8
11
  prefix?: React.ReactNode;
9
12
  type?: string;
10
- value?: string | number | boolean | any[];
13
+ value?: string | number | boolean | any[] | null;
11
14
  status?: "error" | "warning";
12
15
  styles?: React.CSSProperties;
13
- classNames?: string;
14
16
  variant?: "outlined" | "borderless" | "filled";
15
17
  label?: string;
16
18
  name?: string;
17
19
  suffix?: React.ReactNode;
18
20
  maxLength?: number;
19
21
  fieldNames?: any[];
22
+ options?: any[];
20
23
  onChange?: (value: string | number | boolean | any[]) => void;
21
24
  dropDownOptions?: any[];
22
25
  id?: number;
23
26
  thead?: any[];
24
27
  tbody?: any[];
25
28
  variable_data?: any[];
29
+ optionType?: string;
30
+ selectedClassName?: string;
31
+ action?: React.MouseEventHandler<HTMLElement> | string;
32
+ listClassName?: string;
33
+ listItemClassName?: string;
34
+ img?: string;
35
+ items?: any[];
26
36
  };
27
37
 
28
38
  interface ElementExecuterProps$3 extends ElementType {
@@ -67,8 +77,10 @@ declare const SingleSelectElement: (props: ElementType) => React$1.JSX.Element;
67
77
 
68
78
  declare const MultipleSelectElement: (props: ElementType) => React$1.JSX.Element;
69
79
 
70
- declare const ButtonElement: () => React$1.JSX.Element;
80
+ declare const ButtonElement: React$1.FC<ElementType>;
71
81
 
72
82
  declare const AddMoreTable: (props: ElementType) => React$1.JSX.Element;
73
83
 
74
- export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, NumberElement, PasswordElement, RadioElement, SelectElement, SingleSelectElement, TextElement, TextareaElement };
84
+ declare const Sidebar: (props: ElementType) => React$1.JSX.Element;
85
+
86
+ export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TextElement, TextareaElement };
package/dist/index.d.ts CHANGED
@@ -1,28 +1,38 @@
1
1
  import React$1 from 'react';
2
2
 
3
3
  type ElementType = {
4
+ selectedStyle: boolean;
5
+ style: boolean;
6
+ className: string | undefined;
4
7
  placeholder?: string;
5
8
  addonBefore?: React.ReactNode;
6
9
  defaultValue?: string;
7
10
  disabled?: boolean;
8
11
  prefix?: React.ReactNode;
9
12
  type?: string;
10
- value?: string | number | boolean | any[];
13
+ value?: string | number | boolean | any[] | null;
11
14
  status?: "error" | "warning";
12
15
  styles?: React.CSSProperties;
13
- classNames?: string;
14
16
  variant?: "outlined" | "borderless" | "filled";
15
17
  label?: string;
16
18
  name?: string;
17
19
  suffix?: React.ReactNode;
18
20
  maxLength?: number;
19
21
  fieldNames?: any[];
22
+ options?: any[];
20
23
  onChange?: (value: string | number | boolean | any[]) => void;
21
24
  dropDownOptions?: any[];
22
25
  id?: number;
23
26
  thead?: any[];
24
27
  tbody?: any[];
25
28
  variable_data?: any[];
29
+ optionType?: string;
30
+ selectedClassName?: string;
31
+ action?: React.MouseEventHandler<HTMLElement> | string;
32
+ listClassName?: string;
33
+ listItemClassName?: string;
34
+ img?: string;
35
+ items?: any[];
26
36
  };
27
37
 
28
38
  interface ElementExecuterProps$3 extends ElementType {
@@ -67,8 +77,10 @@ declare const SingleSelectElement: (props: ElementType) => React$1.JSX.Element;
67
77
 
68
78
  declare const MultipleSelectElement: (props: ElementType) => React$1.JSX.Element;
69
79
 
70
- declare const ButtonElement: () => React$1.JSX.Element;
80
+ declare const ButtonElement: React$1.FC<ElementType>;
71
81
 
72
82
  declare const AddMoreTable: (props: ElementType) => React$1.JSX.Element;
73
83
 
74
- export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, NumberElement, PasswordElement, RadioElement, SelectElement, SingleSelectElement, TextElement, TextareaElement };
84
+ declare const Sidebar: (props: ElementType) => React$1.JSX.Element;
85
+
86
+ export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TextElement, TextareaElement };
package/dist/index.js CHANGED
@@ -39,6 +39,7 @@ __export(src_exports, {
39
39
  PasswordElement: () => PasswordElement,
40
40
  RadioElement: () => RadioElement,
41
41
  SelectElement: () => SelectElement,
42
+ Sidebar: () => Sidebar,
42
43
  SingleSelectElement: () => SingleSelectElement,
43
44
  TextElement: () => TextElement,
44
45
  TextareaElement: () => TextareaElement
@@ -62,7 +63,7 @@ var TextElement = (props) => {
62
63
  type: props.type,
63
64
  status: props.status,
64
65
  style: props.styles,
65
- className: props.classNames,
66
+ className: props.className,
66
67
  variant: props.variant,
67
68
  name: props.name,
68
69
  onChange: (e) => props.onChange(e.target.value)
@@ -103,7 +104,7 @@ var NumberElement = (props) => {
103
104
  const newValue = e.target.value.replace(/[^0-9]/g, "");
104
105
  props.onChange(newValue);
105
106
  };
106
- return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, /* @__PURE__ */ import_react3.default.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ import_react3.default.createElement(
107
+ return /* @__PURE__ */ import_react3.default.createElement(
107
108
  import_antd3.Input,
108
109
  {
109
110
  placeholder: props.placeholder,
@@ -115,13 +116,12 @@ var NumberElement = (props) => {
115
116
  prefix: props.prefix,
116
117
  type: props.type,
117
118
  status: props.status,
118
- style: props.styles,
119
- className: props.classNames,
119
+ className: props.className,
120
120
  variant: props.variant,
121
121
  name: props.name,
122
122
  onChange: handleInputChange
123
123
  }
124
- ));
124
+ );
125
125
  };
126
126
 
127
127
  // src/Components/TextareaElement.tsx
@@ -129,7 +129,7 @@ var import_react4 = __toESM(require("react"));
129
129
  var import_antd4 = require("antd");
130
130
  var { TextArea } = import_antd4.Input;
131
131
  var TextareaElement = (props) => {
132
- return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex, { vertical: true, gap: 32 }, /* @__PURE__ */ import_react4.default.createElement(
132
+ return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex, null, /* @__PURE__ */ import_react4.default.createElement(
133
133
  TextArea,
134
134
  {
135
135
  placeholder: props.placeholder,
@@ -138,8 +138,7 @@ var TextareaElement = (props) => {
138
138
  disabled: props.disabled,
139
139
  id: props.name,
140
140
  status: props.status,
141
- style: props.styles,
142
- className: props.classNames,
141
+ className: props.className,
143
142
  variant: props.variant,
144
143
  name: props.name,
145
144
  showCount: true,
@@ -177,7 +176,7 @@ var SelectElement = (props) => {
177
176
  id: props.name,
178
177
  status: props.status,
179
178
  style: props.styles,
180
- className: props.classNames,
179
+ className: props.className,
181
180
  variant: props.variant,
182
181
  onChange: handleChange
183
182
  }
@@ -187,15 +186,45 @@ var SelectElement = (props) => {
187
186
  // src/Components/RadioElement.tsx
188
187
  var import_react6 = __toESM(require("react"));
189
188
  var import_antd6 = require("antd");
189
+ var containerClassName = " ";
190
+ var className = "bg-[#F2F2F2] border border-[#919191] !rounded-[8px] !m-[10px] hover:bg-[#F2F2F2] !text-center !text-black !shadow-[0px_0px_1px_1px_#919191]";
191
+ var selectedClassName = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
190
192
  var RadioElement = (props) => {
193
+ const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
194
+ const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
195
+ const optionType = props.optionType === "button" ? "button" : void 0;
191
196
  const handleChange = (e) => {
197
+ const selectedVal = e.target.value;
198
+ const selectedOptions = [{ id: selectedVal, value: selectedVal }];
199
+ setSelectedValue(selectedVal);
200
+ setIsDisabled(true);
192
201
  if (props.onChange) {
193
- const selectedVal = e.target.value;
194
- const selectedOptions = [{ id: selectedVal, value: selectedVal }];
195
202
  props.onChange(selectedOptions);
196
203
  }
197
204
  };
198
- return /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio.Group, { name: "radiogroup", defaultValue: 1 }, /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 1, onChange: handleChange }, "A"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 2, onChange: handleChange }, "B"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 3, onChange: handleChange }, "C"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 4, onChange: handleChange }, "D"));
205
+ const getButtonStyle = (option) => {
206
+ return selectedValue === option.value ? `${selectedClassName} ${option.selectedClassName}` : `${className} ${option.className}`;
207
+ };
208
+ return /* @__PURE__ */ import_react6.default.createElement("div", { className: containerClassName }, /* @__PURE__ */ import_react6.default.createElement(
209
+ import_antd6.Radio.Group,
210
+ {
211
+ onChange: handleChange,
212
+ optionType,
213
+ className: props.className,
214
+ value: selectedValue
215
+ },
216
+ props.options && props.options.map((option) => /* @__PURE__ */ import_react6.default.createElement(
217
+ import_antd6.Radio,
218
+ {
219
+ key: option.value,
220
+ value: option.value,
221
+ disabled: isDisabled && selectedValue !== option.value,
222
+ className: getButtonStyle(option),
223
+ style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
224
+ },
225
+ option.label
226
+ ))
227
+ ));
199
228
  };
200
229
 
201
230
  // src/Components/Checkbox.tsx
@@ -229,7 +258,7 @@ var CheckboxElement = (props) => {
229
258
  disabled: props.disabled,
230
259
  id: props.name,
231
260
  style: props.styles,
232
- className: props.classNames,
261
+ className: props.className,
233
262
  onChange: onHandleAllChanges,
234
263
  checked: checkAll
235
264
  },
@@ -239,7 +268,7 @@ var CheckboxElement = (props) => {
239
268
  {
240
269
  disabled: props.disabled,
241
270
  style: props.styles,
242
- className: props.classNames,
271
+ className: props.className,
243
272
  options: plainOptions,
244
273
  value: checkedList,
245
274
  onChange: handleChange
@@ -356,7 +385,20 @@ var MultipleSelectElement = (props) => {
356
385
  // src/Components/Button.tsx
357
386
  var import_react12 = __toESM(require("react"));
358
387
  var import_antd10 = require("antd");
359
- var ButtonElement = () => /* @__PURE__ */ import_react12.default.createElement(import_antd10.Flex, { gap: "small" }, /* @__PURE__ */ import_react12.default.createElement(import_antd10.Button, { type: "primary" }, "Primary Button"));
388
+ var defaultClassName = "w-[126px] h-[40px] bg-purple-800 text-white rounded-full shadow-lg submit border-none";
389
+ var ButtonElement = (props) => {
390
+ const handleClick = typeof props.action === "string" ? () => {
391
+ console.log("Performing action:", props.action);
392
+ } : props.action;
393
+ return /* @__PURE__ */ import_react12.default.createElement(
394
+ import_antd10.Button,
395
+ {
396
+ onClick: handleClick,
397
+ className: `${defaultClassName} ${props.className ? props.className : ""}`
398
+ },
399
+ props.label
400
+ );
401
+ };
360
402
 
361
403
  // src/Components/AddMoreTable.tsx
362
404
  var import_react13 = __toESM(require("react"));
@@ -364,81 +406,138 @@ var import_antd11 = require("antd");
364
406
  var import_icons2 = require("@ant-design/icons");
365
407
  var AddMoreTable = (props) => {
366
408
  const { thead, tbody } = props;
367
- const [tableData, setTableData] = (0, import_react13.useState)({});
368
409
  const [rows, setRows] = (0, import_react13.useState)(tbody || []);
369
- function isColumnType(column) {
370
- return column.dataIndex !== void 0;
371
- }
372
- const onHandleChange = (name, value) => {
373
- setTableData((prev) => ({ ...prev, [name]: value }));
374
- console.log(tableData);
375
- };
376
410
  const onHandleRows = () => {
377
- const lastRow = rows[rows.length - 1];
378
- const newId = lastRow ? lastRow.id + 1 : lastRow.id;
379
- const newRow = {
380
- ...lastRow,
381
- id: newId
411
+ const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
412
+ let newRow = {
413
+ id: newId,
414
+ label: "Medicine",
415
+ name: "Medicine",
416
+ type: "text",
417
+ element: "single-select",
418
+ variable_data: [
419
+ {
420
+ id: 1,
421
+ Route: { label: "Route", element: "single-select", type: "text" },
422
+ Dose: { label: "Dose", element: "single-select", type: "text" },
423
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
424
+ When: { label: "When", element: "textarea", type: "text" },
425
+ Duration: { label: "Duration", element: "textarea", type: "text" },
426
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
427
+ SubRows: { delete: "delete", add: "plus" }
428
+ }
429
+ ]
382
430
  };
383
431
  setRows((prevData) => [...prevData, newRow]);
384
432
  };
385
- const onHandleDelete = (index) => {
386
- const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
387
- setRows(remainingRows);
433
+ const onHandleDelete = (id) => {
434
+ setRows((prevRows) => prevRows.filter((row) => row.id !== id));
388
435
  };
389
- const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
390
- title: eachHeadEl.label,
391
- dataIndex: eachHeadEl.name,
392
- key: eachHeadEl.id
393
- })) : [];
394
- const renderInputElement = (element) => {
436
+ const onHandleSubRowsAdd = (rowIndex) => {
437
+ setRows((prevRows) => {
438
+ return prevRows.map((row, index) => {
439
+ if (index === rowIndex) {
440
+ const newSubRow = {
441
+ id: row.variable_data.length + 1,
442
+ Route: { label: "Route", element: "single-select", type: "text" },
443
+ Dose: { label: "Dose", element: "single-select", type: "text" },
444
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
445
+ When: { label: "When", element: "textarea", type: "text" },
446
+ Duration: { label: "Duration", element: "textarea", type: "text" },
447
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
448
+ SubRows: { delete: "delete", add: "plus" }
449
+ };
450
+ const updatedVariableData = [...row.variable_data, newSubRow];
451
+ return {
452
+ ...row,
453
+ variable_data: updatedVariableData
454
+ };
455
+ }
456
+ return row;
457
+ });
458
+ });
459
+ };
460
+ const onHandleSubRowsDelete = (rowIndex, subIndex) => {
461
+ setRows((prevRows) => {
462
+ return prevRows.map((row, index) => {
463
+ if (index === rowIndex) {
464
+ const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
465
+ return {
466
+ ...row,
467
+ variable_data: updatedVariableData
468
+ };
469
+ }
470
+ return row;
471
+ });
472
+ });
473
+ };
474
+ (0, import_react13.useEffect)(() => {
475
+ console.log(rows);
476
+ }, [rows]);
477
+ const renderInputElement = (element, value) => {
478
+ if (!element)
479
+ return null;
395
480
  const { element: type, label } = element;
396
- console.log("type....", type);
397
481
  if (type === "single-select") {
398
- return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value) => onHandleChange(label, value) });
482
+ return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
399
483
  } else if (type === "textarea") {
400
- return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value) => onHandleChange(label, value) });
484
+ return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
401
485
  } else {
402
486
  return null;
403
487
  }
404
488
  };
405
- const dataSource = rows.map((eachRow, index) => {
406
- const rowElements = {};
407
- if (eachRow.element && eachRow.label) {
408
- rowElements[eachRow.label] = renderInputElement(eachRow);
409
- }
410
- const variableData = eachRow.variable_data && Array.isArray(eachRow.variable_data) ? eachRow.variable_data.reduce((acc, curr) => {
411
- if (!curr.label || !curr.element) {
412
- console.error(`Invalid element in row ${index}:`, curr);
413
- return acc;
414
- }
415
- acc[curr.label] = renderInputElement(curr);
416
- return acc;
417
- }, {}) : {};
418
- return {
419
- key: index.toString(),
420
- "#": index + 1,
421
- ...eachRow,
422
- ...rowElements,
423
- ...variableData,
424
- actions: /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement("button", { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), index === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)))
489
+ const dataSource = rows.map((eachRow, rowIndex) => {
490
+ const rowData = {
491
+ key: eachRow.id,
492
+ "#": rowIndex + 1,
493
+ "Medicine": renderInputElement({
494
+ element: eachRow.element,
495
+ label: eachRow.label
496
+ })
425
497
  };
498
+ eachRow.variable_data.forEach((variable, subIndex) => {
499
+ Object.keys(variable).forEach((key) => {
500
+ if (key === "SubRows") {
501
+ rowData[`${key}`] = /* @__PURE__ */ import_react13.default.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleSubRowsDelete(rowIndex, subIndex) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), subIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
502
+ } else {
503
+ rowData[`${key}`] = renderInputElement(variable[key]);
504
+ }
505
+ });
506
+ });
507
+ rowData.actions = /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
508
+ console.log("=====rowdata", rowData);
509
+ return rowData;
426
510
  });
427
- if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
511
+ const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
512
+ title: eachHeadEl.label,
513
+ dataIndex: eachHeadEl.name,
514
+ key: eachHeadEl.id
515
+ })) : [];
516
+ if (!columns.some((col) => col.dataIndex === "actions")) {
428
517
  columns.push({
429
518
  title: "Actions",
430
519
  dataIndex: "actions",
431
520
  key: "actions"
432
521
  });
433
522
  }
434
- return /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
523
+ return /* @__PURE__ */ import_react13.default.createElement(
435
524
  import_antd11.Table,
436
525
  {
437
526
  columns,
438
- expandable: { defaultExpandedRowKeys: ["0"] },
439
- dataSource
527
+ dataSource,
528
+ pagination: false,
529
+ bordered: true
440
530
  }
441
- ));
531
+ );
532
+ };
533
+
534
+ // src/Components/Sidebar.tsx
535
+ var import_react14 = __toESM(require("react"));
536
+ var Sidebar = (props) => {
537
+ return /* @__PURE__ */ import_react14.default.createElement("div", { className: props.className }, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: props.img, alt: "logo" }), /* @__PURE__ */ import_react14.default.createElement("p", null, props.name)), /* @__PURE__ */ import_react14.default.createElement("ul", { className: props.listClassName }), props.items?.map((item) => {
538
+ console.log("item------", item);
539
+ return /* @__PURE__ */ import_react14.default.createElement("div", { className: props.listItemClassName }, /* @__PURE__ */ import_react14.default.createElement("span", null, item.icon), /* @__PURE__ */ import_react14.default.createElement("span", null, item.label));
540
+ }));
442
541
  };
443
542
  // Annotate the CommonJS export names for ESM import in node:
444
543
  0 && (module.exports = {
@@ -451,6 +550,7 @@ var AddMoreTable = (props) => {
451
550
  PasswordElement,
452
551
  RadioElement,
453
552
  SelectElement,
553
+ Sidebar,
454
554
  SingleSelectElement,
455
555
  TextElement,
456
556
  TextareaElement
package/dist/index.mjs CHANGED
@@ -15,7 +15,7 @@ var TextElement = (props) => {
15
15
  type: props.type,
16
16
  status: props.status,
17
17
  style: props.styles,
18
- className: props.classNames,
18
+ className: props.className,
19
19
  variant: props.variant,
20
20
  name: props.name,
21
21
  onChange: (e) => props.onChange(e.target.value)
@@ -56,7 +56,7 @@ var NumberElement = (props) => {
56
56
  const newValue = e.target.value.replace(/[^0-9]/g, "");
57
57
  props.onChange(newValue);
58
58
  };
59
- return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ React3.createElement(
59
+ return /* @__PURE__ */ React3.createElement(
60
60
  AntInput2,
61
61
  {
62
62
  placeholder: props.placeholder,
@@ -68,13 +68,12 @@ var NumberElement = (props) => {
68
68
  prefix: props.prefix,
69
69
  type: props.type,
70
70
  status: props.status,
71
- style: props.styles,
72
- className: props.classNames,
71
+ className: props.className,
73
72
  variant: props.variant,
74
73
  name: props.name,
75
74
  onChange: handleInputChange
76
75
  }
77
- ));
76
+ );
78
77
  };
79
78
 
80
79
  // src/Components/TextareaElement.tsx
@@ -82,7 +81,7 @@ import React4 from "react";
82
81
  import { Flex, Input as Input2 } from "antd";
83
82
  var { TextArea } = Input2;
84
83
  var TextareaElement = (props) => {
85
- return /* @__PURE__ */ React4.createElement(Flex, { vertical: true, gap: 32 }, /* @__PURE__ */ React4.createElement(
84
+ return /* @__PURE__ */ React4.createElement(Flex, null, /* @__PURE__ */ React4.createElement(
86
85
  TextArea,
87
86
  {
88
87
  placeholder: props.placeholder,
@@ -91,8 +90,7 @@ var TextareaElement = (props) => {
91
90
  disabled: props.disabled,
92
91
  id: props.name,
93
92
  status: props.status,
94
- style: props.styles,
95
- className: props.classNames,
93
+ className: props.className,
96
94
  variant: props.variant,
97
95
  name: props.name,
98
96
  showCount: true,
@@ -130,7 +128,7 @@ var SelectElement = (props) => {
130
128
  id: props.name,
131
129
  status: props.status,
132
130
  style: props.styles,
133
- className: props.classNames,
131
+ className: props.className,
134
132
  variant: props.variant,
135
133
  onChange: handleChange
136
134
  }
@@ -138,27 +136,57 @@ var SelectElement = (props) => {
138
136
  };
139
137
 
140
138
  // src/Components/RadioElement.tsx
141
- import React6 from "react";
139
+ import React6, { useState as useState2 } from "react";
142
140
  import { Radio } from "antd";
141
+ var containerClassName = " ";
142
+ var className = "bg-[#F2F2F2] border border-[#919191] !rounded-[8px] !m-[10px] hover:bg-[#F2F2F2] !text-center !text-black !shadow-[0px_0px_1px_1px_#919191]";
143
+ var selectedClassName = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
143
144
  var RadioElement = (props) => {
145
+ const [isDisabled, setIsDisabled] = useState2(props.disabled);
146
+ const [selectedValue, setSelectedValue] = useState2(props.value);
147
+ const optionType = props.optionType === "button" ? "button" : void 0;
144
148
  const handleChange = (e) => {
149
+ const selectedVal = e.target.value;
150
+ const selectedOptions = [{ id: selectedVal, value: selectedVal }];
151
+ setSelectedValue(selectedVal);
152
+ setIsDisabled(true);
145
153
  if (props.onChange) {
146
- const selectedVal = e.target.value;
147
- const selectedOptions = [{ id: selectedVal, value: selectedVal }];
148
154
  props.onChange(selectedOptions);
149
155
  }
150
156
  };
151
- return /* @__PURE__ */ React6.createElement(Radio.Group, { name: "radiogroup", defaultValue: 1 }, /* @__PURE__ */ React6.createElement(Radio, { value: 1, onChange: handleChange }, "A"), /* @__PURE__ */ React6.createElement(Radio, { value: 2, onChange: handleChange }, "B"), /* @__PURE__ */ React6.createElement(Radio, { value: 3, onChange: handleChange }, "C"), /* @__PURE__ */ React6.createElement(Radio, { value: 4, onChange: handleChange }, "D"));
157
+ const getButtonStyle = (option) => {
158
+ return selectedValue === option.value ? `${selectedClassName} ${option.selectedClassName}` : `${className} ${option.className}`;
159
+ };
160
+ return /* @__PURE__ */ React6.createElement("div", { className: containerClassName }, /* @__PURE__ */ React6.createElement(
161
+ Radio.Group,
162
+ {
163
+ onChange: handleChange,
164
+ optionType,
165
+ className: props.className,
166
+ value: selectedValue
167
+ },
168
+ props.options && props.options.map((option) => /* @__PURE__ */ React6.createElement(
169
+ Radio,
170
+ {
171
+ key: option.value,
172
+ value: option.value,
173
+ disabled: isDisabled && selectedValue !== option.value,
174
+ className: getButtonStyle(option),
175
+ style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
176
+ },
177
+ option.label
178
+ ))
179
+ ));
152
180
  };
153
181
 
154
182
  // src/Components/Checkbox.tsx
155
- import React7, { useState as useState2 } from "react";
183
+ import React7, { useState as useState3 } from "react";
156
184
  import { Checkbox, Divider } from "antd";
157
185
  var CheckboxGroup = Checkbox.Group;
158
186
  var plainOptions = ["Apple", "Pear", "Orange"];
159
187
  var defaultCheckedList = [];
160
188
  var CheckboxElement = (props) => {
161
- const [checkedList, setCheckedList] = useState2(defaultCheckedList);
189
+ const [checkedList, setCheckedList] = useState3(defaultCheckedList);
162
190
  const checkAll = plainOptions.length === checkedList.length;
163
191
  const handleChange = (list) => {
164
192
  setCheckedList(list);
@@ -182,7 +210,7 @@ var CheckboxElement = (props) => {
182
210
  disabled: props.disabled,
183
211
  id: props.name,
184
212
  style: props.styles,
185
- className: props.classNames,
213
+ className: props.className,
186
214
  onChange: onHandleAllChanges,
187
215
  checked: checkAll
188
216
  },
@@ -192,7 +220,7 @@ var CheckboxElement = (props) => {
192
220
  {
193
221
  disabled: props.disabled,
194
222
  style: props.styles,
195
- className: props.classNames,
223
+ className: props.className,
196
224
  options: plainOptions,
197
225
  value: checkedList,
198
226
  onChange: handleChange
@@ -308,90 +336,160 @@ var MultipleSelectElement = (props) => {
308
336
 
309
337
  // src/Components/Button.tsx
310
338
  import React11 from "react";
311
- import { Button as Button2, Flex as Flex2 } from "antd";
312
- var ButtonElement = () => /* @__PURE__ */ React11.createElement(Flex2, { gap: "small" }, /* @__PURE__ */ React11.createElement(Button2, { type: "primary" }, "Primary Button"));
339
+ import { Button as Button2 } from "antd";
340
+ var defaultClassName = "w-[126px] h-[40px] bg-purple-800 text-white rounded-full shadow-lg submit border-none";
341
+ var ButtonElement = (props) => {
342
+ const handleClick = typeof props.action === "string" ? () => {
343
+ console.log("Performing action:", props.action);
344
+ } : props.action;
345
+ return /* @__PURE__ */ React11.createElement(
346
+ Button2,
347
+ {
348
+ onClick: handleClick,
349
+ className: `${defaultClassName} ${props.className ? props.className : ""}`
350
+ },
351
+ props.label
352
+ );
353
+ };
313
354
 
314
355
  // src/Components/AddMoreTable.tsx
315
- import React12, { useState as useState3 } from "react";
316
- import { Table } from "antd";
356
+ import React12, { useEffect, useState as useState4 } from "react";
357
+ import { Table, Button as Button3 } from "antd";
317
358
  import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
318
359
  var AddMoreTable = (props) => {
319
360
  const { thead, tbody } = props;
320
- const [tableData, setTableData] = useState3({});
321
- const [rows, setRows] = useState3(tbody || []);
322
- function isColumnType(column) {
323
- return column.dataIndex !== void 0;
324
- }
325
- const onHandleChange = (name, value) => {
326
- setTableData((prev) => ({ ...prev, [name]: value }));
327
- console.log(tableData);
328
- };
361
+ const [rows, setRows] = useState4(tbody || []);
329
362
  const onHandleRows = () => {
330
- const lastRow = rows[rows.length - 1];
331
- const newId = lastRow ? lastRow.id + 1 : lastRow.id;
332
- const newRow = {
333
- ...lastRow,
334
- id: newId
363
+ const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
364
+ let newRow = {
365
+ id: newId,
366
+ label: "Medicine",
367
+ name: "Medicine",
368
+ type: "text",
369
+ element: "single-select",
370
+ variable_data: [
371
+ {
372
+ id: 1,
373
+ Route: { label: "Route", element: "single-select", type: "text" },
374
+ Dose: { label: "Dose", element: "single-select", type: "text" },
375
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
376
+ When: { label: "When", element: "textarea", type: "text" },
377
+ Duration: { label: "Duration", element: "textarea", type: "text" },
378
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
379
+ SubRows: { delete: "delete", add: "plus" }
380
+ }
381
+ ]
335
382
  };
336
383
  setRows((prevData) => [...prevData, newRow]);
337
384
  };
338
- const onHandleDelete = (index) => {
339
- const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
340
- setRows(remainingRows);
385
+ const onHandleDelete = (id) => {
386
+ setRows((prevRows) => prevRows.filter((row) => row.id !== id));
341
387
  };
342
- const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
343
- title: eachHeadEl.label,
344
- dataIndex: eachHeadEl.name,
345
- key: eachHeadEl.id
346
- })) : [];
347
- const renderInputElement = (element) => {
388
+ const onHandleSubRowsAdd = (rowIndex) => {
389
+ setRows((prevRows) => {
390
+ return prevRows.map((row, index) => {
391
+ if (index === rowIndex) {
392
+ const newSubRow = {
393
+ id: row.variable_data.length + 1,
394
+ Route: { label: "Route", element: "single-select", type: "text" },
395
+ Dose: { label: "Dose", element: "single-select", type: "text" },
396
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
397
+ When: { label: "When", element: "textarea", type: "text" },
398
+ Duration: { label: "Duration", element: "textarea", type: "text" },
399
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
400
+ SubRows: { delete: "delete", add: "plus" }
401
+ };
402
+ const updatedVariableData = [...row.variable_data, newSubRow];
403
+ return {
404
+ ...row,
405
+ variable_data: updatedVariableData
406
+ };
407
+ }
408
+ return row;
409
+ });
410
+ });
411
+ };
412
+ const onHandleSubRowsDelete = (rowIndex, subIndex) => {
413
+ setRows((prevRows) => {
414
+ return prevRows.map((row, index) => {
415
+ if (index === rowIndex) {
416
+ const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
417
+ return {
418
+ ...row,
419
+ variable_data: updatedVariableData
420
+ };
421
+ }
422
+ return row;
423
+ });
424
+ });
425
+ };
426
+ useEffect(() => {
427
+ console.log(rows);
428
+ }, [rows]);
429
+ const renderInputElement = (element, value) => {
430
+ if (!element)
431
+ return null;
348
432
  const { element: type, label } = element;
349
- console.log("type....", type);
350
433
  if (type === "single-select") {
351
- return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (value) => onHandleChange(label, value) });
434
+ return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
352
435
  } else if (type === "textarea") {
353
- return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (value) => onHandleChange(label, value) });
436
+ return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
354
437
  } else {
355
438
  return null;
356
439
  }
357
440
  };
358
- const dataSource = rows.map((eachRow, index) => {
359
- const rowElements = {};
360
- if (eachRow.element && eachRow.label) {
361
- rowElements[eachRow.label] = renderInputElement(eachRow);
362
- }
363
- const variableData = eachRow.variable_data && Array.isArray(eachRow.variable_data) ? eachRow.variable_data.reduce((acc, curr) => {
364
- if (!curr.label || !curr.element) {
365
- console.error(`Invalid element in row ${index}:`, curr);
366
- return acc;
367
- }
368
- acc[curr.label] = renderInputElement(curr);
369
- return acc;
370
- }, {}) : {};
371
- return {
372
- key: index.toString(),
373
- "#": index + 1,
374
- ...eachRow,
375
- ...rowElements,
376
- ...variableData,
377
- actions: /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("button", { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), index === rows.length - 1 && /* @__PURE__ */ React12.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)))
441
+ const dataSource = rows.map((eachRow, rowIndex) => {
442
+ const rowData = {
443
+ key: eachRow.id,
444
+ "#": rowIndex + 1,
445
+ "Medicine": renderInputElement({
446
+ element: eachRow.element,
447
+ label: eachRow.label
448
+ })
378
449
  };
450
+ eachRow.variable_data.forEach((variable, subIndex) => {
451
+ Object.keys(variable).forEach((key) => {
452
+ if (key === "SubRows") {
453
+ rowData[`${key}`] = /* @__PURE__ */ React12.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleSubRowsDelete(rowIndex, subIndex) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), subIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
454
+ } else {
455
+ rowData[`${key}`] = renderInputElement(variable[key]);
456
+ }
457
+ });
458
+ });
459
+ rowData.actions = /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
460
+ console.log("=====rowdata", rowData);
461
+ return rowData;
379
462
  });
380
- if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
463
+ const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
464
+ title: eachHeadEl.label,
465
+ dataIndex: eachHeadEl.name,
466
+ key: eachHeadEl.id
467
+ })) : [];
468
+ if (!columns.some((col) => col.dataIndex === "actions")) {
381
469
  columns.push({
382
470
  title: "Actions",
383
471
  dataIndex: "actions",
384
472
  key: "actions"
385
473
  });
386
474
  }
387
- return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
475
+ return /* @__PURE__ */ React12.createElement(
388
476
  Table,
389
477
  {
390
478
  columns,
391
- expandable: { defaultExpandedRowKeys: ["0"] },
392
- dataSource
479
+ dataSource,
480
+ pagination: false,
481
+ bordered: true
393
482
  }
394
- ));
483
+ );
484
+ };
485
+
486
+ // src/Components/Sidebar.tsx
487
+ import React13 from "react";
488
+ var Sidebar = (props) => {
489
+ return /* @__PURE__ */ React13.createElement("div", { className: props.className }, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: props.img, alt: "logo" }), /* @__PURE__ */ React13.createElement("p", null, props.name)), /* @__PURE__ */ React13.createElement("ul", { className: props.listClassName }), props.items?.map((item) => {
490
+ console.log("item------", item);
491
+ return /* @__PURE__ */ React13.createElement("div", { className: props.listItemClassName }, /* @__PURE__ */ React13.createElement("span", null, item.icon), /* @__PURE__ */ React13.createElement("span", null, item.label));
492
+ }));
395
493
  };
396
494
  export {
397
495
  AddMoreTable,
@@ -403,6 +501,7 @@ export {
403
501
  PasswordElement,
404
502
  RadioElement,
405
503
  SelectElement,
504
+ Sidebar,
406
505
  SingleSelectElement,
407
506
  TextElement,
408
507
  TextareaElement
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@apexcura/ui-components",
3
- "version": "0.0.12-Beta7",
3
+ "version": "0.0.12-Beta70",
4
4
  "description": "Apex cura React components library",
5
5
  "keywords": [
6
6
  "apex cura",
@@ -36,10 +36,13 @@
36
36
  "@types/react-global-configuration": "^1.3.3",
37
37
  "@types/testing-library__react": "^10.2.0",
38
38
  "antd": "^5.16.5",
39
+ "autoprefixer": "^10.4.19",
39
40
  "jest": "^29.7.0",
40
41
  "jest-environment-jsdom": "^29.7.0",
42
+ "postcss": "^8.4.38",
41
43
  "react": "^18.3.1",
42
44
  "react-dom": "^18.3.1",
45
+ "tailwindcss": "^3.4.3",
43
46
  "ts-jest": "^29.1.2",
44
47
  "tsup": "^8.0.2",
45
48
  "typescript": "^5.4.5"
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ plugins: [
3
+ require('tailwindcss'),
4
+ require('autoprefixer'),
5
+ ]
6
+ }
@@ -0,0 +1,9 @@
1
+ module.exports = {
2
+ content: [
3
+ "./src/**/*.{js,jsx,ts,tsx}", // Adjust this path according to your project structure
4
+ ],
5
+ theme: {
6
+ extend: {},
7
+ },
8
+ plugins: [],
9
+ };