@esic-lab/data-core-ui 0.0.34 → 0.0.36
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.mjs → index.cjs} +648 -587
- package/dist/index.js +587 -648
- package/package.json +6 -5
- /package/dist/{index.d.mts → index.d.cts} +0 -0
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -7,6 +8,10 @@ var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
|
7
8
|
var __commonJS = (cb, mod) => function __require() {
|
|
8
9
|
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
9
10
|
};
|
|
11
|
+
var __export = (target, all) => {
|
|
12
|
+
for (var name in all)
|
|
13
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
14
|
+
};
|
|
10
15
|
var __copyProps = (to, from, except, desc) => {
|
|
11
16
|
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
17
|
for (let key of __getOwnPropNames(from))
|
|
@@ -23,14 +28,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
23
28
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
24
29
|
mod
|
|
25
30
|
));
|
|
31
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
26
32
|
|
|
27
33
|
// node_modules/dayjs/dayjs.min.js
|
|
28
34
|
var require_dayjs_min = __commonJS({
|
|
29
|
-
"node_modules/dayjs/dayjs.min.js"(
|
|
35
|
+
"node_modules/dayjs/dayjs.min.js"(exports2, module2) {
|
|
30
36
|
"use strict";
|
|
31
37
|
!(function(t, e) {
|
|
32
|
-
"object" == typeof
|
|
33
|
-
})(
|
|
38
|
+
"object" == typeof exports2 && "undefined" != typeof module2 ? module2.exports = e() : "function" == typeof define && define.amd ? define(e) : (t = "undefined" != typeof globalThis ? globalThis : t || self).dayjs = e();
|
|
39
|
+
})(exports2, (function() {
|
|
34
40
|
"use strict";
|
|
35
41
|
var t = 1e3, e = 6e4, n = 36e5, r = "millisecond", i = "second", s = "minute", u = "hour", a = "day", o = "week", c = "month", f = "quarter", h = "year", d = "date", l = "Invalid Date", $ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, M = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(t2) {
|
|
36
42
|
var e2 = ["th", "st", "nd", "rd"], n2 = t2 % 100;
|
|
@@ -307,11 +313,11 @@ var require_dayjs_min = __commonJS({
|
|
|
307
313
|
|
|
308
314
|
// node_modules/dayjs/locale/th.js
|
|
309
315
|
var require_th = __commonJS({
|
|
310
|
-
"node_modules/dayjs/locale/th.js"(
|
|
316
|
+
"node_modules/dayjs/locale/th.js"(exports2, module2) {
|
|
311
317
|
"use strict";
|
|
312
318
|
!(function(_, e) {
|
|
313
|
-
"object" == typeof
|
|
314
|
-
})(
|
|
319
|
+
"object" == typeof exports2 && "undefined" != typeof module2 ? module2.exports = e(require_dayjs_min()) : "function" == typeof define && define.amd ? define(["dayjs"], e) : (_ = "undefined" != typeof globalThis ? globalThis : _ || self).dayjs_locale_th = e(_.dayjs);
|
|
320
|
+
})(exports2, (function(_) {
|
|
315
321
|
"use strict";
|
|
316
322
|
function e(_2) {
|
|
317
323
|
return _2 && "object" == typeof _2 && "default" in _2 ? _2 : { default: _2 };
|
|
@@ -326,11 +332,11 @@ var require_th = __commonJS({
|
|
|
326
332
|
|
|
327
333
|
// node_modules/dayjs/plugin/buddhistEra.js
|
|
328
334
|
var require_buddhistEra = __commonJS({
|
|
329
|
-
"node_modules/dayjs/plugin/buddhistEra.js"(
|
|
335
|
+
"node_modules/dayjs/plugin/buddhistEra.js"(exports2, module2) {
|
|
330
336
|
"use strict";
|
|
331
337
|
!(function(t, e) {
|
|
332
|
-
"object" == typeof
|
|
333
|
-
})(
|
|
338
|
+
"object" == typeof exports2 && "undefined" != typeof module2 ? module2.exports = e() : "function" == typeof define && define.amd ? define(e) : (t = "undefined" != typeof globalThis ? globalThis : t || self).dayjs_plugin_buddhistEra = e();
|
|
339
|
+
})(exports2, (function() {
|
|
334
340
|
"use strict";
|
|
335
341
|
return function(t, e) {
|
|
336
342
|
var n = e.prototype, i = n.format;
|
|
@@ -348,11 +354,11 @@ var require_buddhistEra = __commonJS({
|
|
|
348
354
|
|
|
349
355
|
// node_modules/dayjs/plugin/customParseFormat.js
|
|
350
356
|
var require_customParseFormat = __commonJS({
|
|
351
|
-
"node_modules/dayjs/plugin/customParseFormat.js"(
|
|
357
|
+
"node_modules/dayjs/plugin/customParseFormat.js"(exports2, module2) {
|
|
352
358
|
"use strict";
|
|
353
359
|
!(function(e, t) {
|
|
354
|
-
"object" == typeof
|
|
355
|
-
})(
|
|
360
|
+
"object" == typeof exports2 && "undefined" != typeof module2 ? module2.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_customParseFormat = t();
|
|
361
|
+
})(exports2, (function() {
|
|
356
362
|
"use strict";
|
|
357
363
|
var e = { LTS: "h:mm:ss A", LT: "h:mm A", L: "MM/DD/YYYY", LL: "MMMM D, YYYY", LLL: "MMMM D, YYYY h:mm A", LLLL: "dddd, MMMM D, YYYY h:mm A" }, t = /(\[[^[]*\])|([-_:/.,()\s]+)|(A|a|Q|YYYY|YY?|ww?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g, n = /\d/, r = /\d\d/, i = /\d\d?/, o = /\d*[^-_:/,()\s\d]+/, s = {}, a = function(e2) {
|
|
358
364
|
return (e2 = +e2) + (e2 > 68 ? 1900 : 2e3);
|
|
@@ -474,8 +480,62 @@ var require_customParseFormat = __commonJS({
|
|
|
474
480
|
}
|
|
475
481
|
});
|
|
476
482
|
|
|
483
|
+
// src/index.ts
|
|
484
|
+
var index_exports = {};
|
|
485
|
+
__export(index_exports, {
|
|
486
|
+
AntDModal: () => AntDModal,
|
|
487
|
+
AntDataTable: () => AntDataTable,
|
|
488
|
+
Breadcrumbs: () => Breadcrumbs,
|
|
489
|
+
Calendar: () => Calendar,
|
|
490
|
+
Checkbox: () => Checkbox,
|
|
491
|
+
CheckboxGroup: () => CheckboxGroup,
|
|
492
|
+
ColorPalettePickerBasic: () => ColorPalettePickerBasic,
|
|
493
|
+
ColorPickerBasic: () => ColorPickerBasic,
|
|
494
|
+
DataTable: () => DataTable,
|
|
495
|
+
DatePickerBasic: () => DatePickerBasic,
|
|
496
|
+
DatePickerRangePicker: () => DatePickerRangePicker,
|
|
497
|
+
FileUploader: () => FileUploader,
|
|
498
|
+
FilterPopUp: () => FilterPopUp,
|
|
499
|
+
GhostButton: () => GhostButton,
|
|
500
|
+
HeadingPage: () => HeadingPage,
|
|
501
|
+
Indicator: () => Indicator,
|
|
502
|
+
InputField: () => InputField,
|
|
503
|
+
InputFieldNumber: () => InputFieldNumber,
|
|
504
|
+
KpiSection: () => KpiSection,
|
|
505
|
+
Loader: () => Loader,
|
|
506
|
+
MenuNavBar: () => MenuNavBar,
|
|
507
|
+
PrimaryButton: () => PrimaryButton,
|
|
508
|
+
ProgressBar: () => ProgressBar,
|
|
509
|
+
Radio: () => Radio,
|
|
510
|
+
RadioGroup: () => RadioGroup,
|
|
511
|
+
SecondaryButton: () => SecondaryButton,
|
|
512
|
+
SelectCustom: () => SelectCustom,
|
|
513
|
+
SelectField: () => SelectField,
|
|
514
|
+
SelectFieldGroup: () => SelectFieldGroup,
|
|
515
|
+
SelectFieldStatus: () => SelectFieldStatus,
|
|
516
|
+
SelectFieldStatusReport: () => SelectFieldStatusReport,
|
|
517
|
+
SelectFieldTag: () => SelectFieldTag,
|
|
518
|
+
Sidebar: () => Sidebar,
|
|
519
|
+
SortFilter: () => SortFilter,
|
|
520
|
+
Switch: () => Switch,
|
|
521
|
+
SwitchSelect: () => SwitchSelect,
|
|
522
|
+
TabSelectionButton: () => TabSelectionButton,
|
|
523
|
+
TextAreaInput: () => TextAreaInput,
|
|
524
|
+
TextInput: () => TextInput,
|
|
525
|
+
TimePickerBasic: () => TimePickerBasic,
|
|
526
|
+
TimePickerRangePicker: () => TimePickerRangePicker,
|
|
527
|
+
TopNavBar: () => TopNavBar,
|
|
528
|
+
messageError: () => messageError,
|
|
529
|
+
messageInfo: () => messageInfo,
|
|
530
|
+
messageLoading: () => messageLoading,
|
|
531
|
+
messageSuccess: () => messageSuccess,
|
|
532
|
+
messageWarning: () => messageWarning,
|
|
533
|
+
setMessageApi: () => setMessageApi
|
|
534
|
+
});
|
|
535
|
+
module.exports = __toCommonJS(index_exports);
|
|
536
|
+
|
|
477
537
|
// src/Button/PrimaryButton/PrimaryButton.tsx
|
|
478
|
-
|
|
538
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
479
539
|
function PrimaryButton({
|
|
480
540
|
title,
|
|
481
541
|
onClick,
|
|
@@ -485,7 +545,7 @@ function PrimaryButton({
|
|
|
485
545
|
textColor = "black",
|
|
486
546
|
disabled
|
|
487
547
|
}) {
|
|
488
|
-
return /* @__PURE__ */ jsx(
|
|
548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
489
549
|
"button",
|
|
490
550
|
{
|
|
491
551
|
onClick,
|
|
@@ -493,57 +553,57 @@ function PrimaryButton({
|
|
|
493
553
|
className: `flex justify-center w-full h-[42px] rounded-[6px] p-[10px] body-1 transition
|
|
494
554
|
${disabled ? "text-gray-400 bg-gray-100 cursor-not-allowed" : `${bgColor} text-${textColor} cursor-pointer
|
|
495
555
|
hover:brightness-95 active:brightness-90`}`,
|
|
496
|
-
children: /* @__PURE__ */ jsxs("div", { className: "flex justify-center items-center gap-[10px]", children: [
|
|
497
|
-
iconLeft && /* @__PURE__ */ jsx("div", { children: iconLeft }),
|
|
556
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-center items-center gap-[10px]", children: [
|
|
557
|
+
iconLeft && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: iconLeft }),
|
|
498
558
|
title,
|
|
499
|
-
iconRight && /* @__PURE__ */ jsx("div", { children: iconRight })
|
|
559
|
+
iconRight && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: iconRight })
|
|
500
560
|
] })
|
|
501
561
|
}
|
|
502
562
|
);
|
|
503
563
|
}
|
|
504
564
|
|
|
505
565
|
// src/Button/SecondaryButton/SecondaryButton.tsx
|
|
506
|
-
|
|
566
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
507
567
|
function SecondaryButton({ title, onClick, iconLeft, iconRight, disabled }) {
|
|
508
|
-
return /* @__PURE__ */
|
|
568
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
509
569
|
"button",
|
|
510
570
|
{
|
|
511
571
|
onClick,
|
|
512
572
|
disabled,
|
|
513
573
|
className: `flex justify-center w-full h-[42px] rounded-[6px] p-[10px] border-[1px] body-1 transition ${disabled ? "text-gray-400 border-gray-400 bg-gray-100 cursor-not-allowed" : "cursor-pointer bg-white border-black text-black hover:bg-gray-100 active:bg-gray-200"}`,
|
|
514
|
-
children: /* @__PURE__ */
|
|
515
|
-
iconLeft && /* @__PURE__ */
|
|
574
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex justify-center items-center gap-[10px]", children: [
|
|
575
|
+
iconLeft && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { children: iconLeft }),
|
|
516
576
|
title,
|
|
517
|
-
iconRight && /* @__PURE__ */
|
|
577
|
+
iconRight && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { children: iconRight })
|
|
518
578
|
] })
|
|
519
579
|
}
|
|
520
580
|
);
|
|
521
581
|
}
|
|
522
582
|
|
|
523
583
|
// src/Button/GhostButton/GhostButton.tsx
|
|
524
|
-
|
|
584
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
525
585
|
function GhostButton({ title, onClick, iconLeft, iconRight, disabled }) {
|
|
526
|
-
return /* @__PURE__ */
|
|
586
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
527
587
|
"button",
|
|
528
588
|
{
|
|
529
589
|
onClick,
|
|
530
590
|
disabled,
|
|
531
591
|
className: `flex justify-center w-full h-[42px] rounded-[6px] p-[10px] body-1 transition
|
|
532
592
|
${disabled ? "text-gray-400 bg-gray-100 cursor-not-allowed" : "bg-[#E9E9E9] cursor-pointer hover:bg-[#d6d6d6] active:bg-[#c4c4c4]"}`,
|
|
533
|
-
children: /* @__PURE__ */
|
|
534
|
-
iconLeft && /* @__PURE__ */
|
|
593
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex justify-center items-center gap-[10px]", children: [
|
|
594
|
+
iconLeft && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { children: iconLeft }),
|
|
535
595
|
title,
|
|
536
|
-
iconRight && /* @__PURE__ */
|
|
596
|
+
iconRight && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { children: iconRight })
|
|
537
597
|
] })
|
|
538
598
|
}
|
|
539
599
|
);
|
|
540
600
|
}
|
|
541
601
|
|
|
542
602
|
// src/Button/TabSelectionButton/TabSelectionButton.tsx
|
|
543
|
-
|
|
603
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
544
604
|
var TabSelectionButton = ({ title, now, onClickGoto }) => {
|
|
545
|
-
return /* @__PURE__ */
|
|
546
|
-
title.map((text) => /* @__PURE__ */
|
|
605
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex subtitle-2", children: [
|
|
606
|
+
title.map((text) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
547
607
|
"button",
|
|
548
608
|
{
|
|
549
609
|
onClick: () => onClickGoto(text.path),
|
|
@@ -551,14 +611,14 @@ var TabSelectionButton = ({ title, now, onClickGoto }) => {
|
|
|
551
611
|
children: text.name
|
|
552
612
|
}
|
|
553
613
|
)),
|
|
554
|
-
/* @__PURE__ */
|
|
614
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "border-b-gray-200 border-b-2 w-full" })
|
|
555
615
|
] });
|
|
556
616
|
};
|
|
557
617
|
|
|
558
618
|
// src/Loader/Loader/Loader.tsx
|
|
559
|
-
|
|
619
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
560
620
|
function Loader({ size = 25, color = "#000000" }) {
|
|
561
|
-
return /* @__PURE__ */
|
|
621
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
562
622
|
"div",
|
|
563
623
|
{
|
|
564
624
|
style: {
|
|
@@ -575,15 +635,15 @@ function Loader({ size = 25, color = "#000000" }) {
|
|
|
575
635
|
}
|
|
576
636
|
|
|
577
637
|
// src/Checkbox/Checkbox/Checkbox.tsx
|
|
578
|
-
|
|
579
|
-
|
|
638
|
+
var import_icons_react = require("@tabler/icons-react");
|
|
639
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
580
640
|
function Checkbox({ label, checked, onChange, disabled }) {
|
|
581
641
|
const handleClick = () => {
|
|
582
642
|
if (!disabled) {
|
|
583
643
|
onChange(!checked);
|
|
584
644
|
}
|
|
585
645
|
};
|
|
586
|
-
return /* @__PURE__ */
|
|
646
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
587
647
|
"div",
|
|
588
648
|
{
|
|
589
649
|
className: `flex gap-[10px] items-center
|
|
@@ -591,32 +651,32 @@ function Checkbox({ label, checked, onChange, disabled }) {
|
|
|
591
651
|
"aria-disabled": disabled,
|
|
592
652
|
onClick: handleClick,
|
|
593
653
|
children: [
|
|
594
|
-
/* @__PURE__ */
|
|
654
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
595
655
|
"div",
|
|
596
656
|
{
|
|
597
657
|
className: `flex justify-center items-center border-[1px] border-black w-[24px] h-[24px] rounded-[8px] transition-colors duration-100
|
|
598
658
|
${checked ? "bg-black text-white" : "bg-white text-black"}
|
|
599
659
|
${disabled ? "pointer-events-none" : ""}`,
|
|
600
|
-
children: /* @__PURE__ */
|
|
660
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
601
661
|
"span",
|
|
602
662
|
{
|
|
603
663
|
className: `flex justify-center items-center transition-transform duration-150
|
|
604
664
|
${checked ? "scale-100 opacity-100" : "scale-0 opacity-0"}`,
|
|
605
|
-
children: /* @__PURE__ */
|
|
665
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons_react.IconCheck, { size: 20 })
|
|
606
666
|
}
|
|
607
667
|
)
|
|
608
668
|
}
|
|
609
669
|
),
|
|
610
|
-
label && /* @__PURE__ */
|
|
670
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "body-1 select-none", children: label })
|
|
611
671
|
]
|
|
612
672
|
}
|
|
613
673
|
);
|
|
614
674
|
}
|
|
615
675
|
|
|
616
676
|
// src/Checkbox/CheckboxGroup/CheckboxGroup.tsx
|
|
617
|
-
|
|
677
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
618
678
|
function CheckboxGroup({ options, onChange, alignment = "vertical" }) {
|
|
619
|
-
return /* @__PURE__ */
|
|
679
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `flex gap-4 ${alignment === "vertical" ? "flex-col" : ""}`, children: options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
620
680
|
Checkbox,
|
|
621
681
|
{
|
|
622
682
|
checked: opt.checked,
|
|
@@ -629,14 +689,14 @@ function CheckboxGroup({ options, onChange, alignment = "vertical" }) {
|
|
|
629
689
|
}
|
|
630
690
|
|
|
631
691
|
// src/Radio/Radio/Radio.tsx
|
|
632
|
-
|
|
692
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
633
693
|
function Radio({ selected, onChange, disabled }) {
|
|
634
694
|
const handleClick = () => {
|
|
635
695
|
if (!disabled) {
|
|
636
696
|
onChange(!selected);
|
|
637
697
|
}
|
|
638
698
|
};
|
|
639
|
-
return /* @__PURE__ */
|
|
699
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
640
700
|
"div",
|
|
641
701
|
{
|
|
642
702
|
className: `
|
|
@@ -645,31 +705,31 @@ function Radio({ selected, onChange, disabled }) {
|
|
|
645
705
|
`,
|
|
646
706
|
onClick: handleClick,
|
|
647
707
|
"aria-disabled": disabled,
|
|
648
|
-
children: selected && /* @__PURE__ */
|
|
708
|
+
children: selected && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `bg-black w-[10px] h-[10px] rounded-full transition-all duration-300` })
|
|
649
709
|
}
|
|
650
710
|
);
|
|
651
711
|
}
|
|
652
712
|
|
|
653
713
|
// src/Radio/RadioGroup/RadioGroup.tsx
|
|
654
|
-
|
|
714
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
655
715
|
function RadioGroup({ options, value, onChange, alignment = "horizontal" }) {
|
|
656
|
-
return /* @__PURE__ */
|
|
657
|
-
/* @__PURE__ */
|
|
658
|
-
/* @__PURE__ */
|
|
716
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: `flex gap-2 ${alignment === "vertical" ? "flex-col" : ""}`, children: options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "flex items-center gap-2 cursor-pointer", children: [
|
|
717
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Radio, { selected: value === opt.value, onChange: () => onChange(opt.value), disabled: opt.disabled }),
|
|
718
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: `body-1 ${opt.disabled ? "text-gray-400 cursor-not-allowed" : ""}`, children: opt.label })
|
|
659
719
|
] }, opt.value)) });
|
|
660
720
|
}
|
|
661
721
|
|
|
662
722
|
// src/Switch/Switch/Switch.tsx
|
|
663
|
-
|
|
723
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
664
724
|
function Switch({ label, checked, onChange, disabled }) {
|
|
665
725
|
const handleClick = () => {
|
|
666
726
|
if (!disabled) {
|
|
667
727
|
onChange(!checked);
|
|
668
728
|
}
|
|
669
729
|
};
|
|
670
|
-
return /* @__PURE__ */
|
|
671
|
-
label && /* @__PURE__ */
|
|
672
|
-
/* @__PURE__ */
|
|
730
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-[10px]", children: [
|
|
731
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: `body-1 ${disabled ? "opacity-50 select-none" : ""}`, children: label }),
|
|
732
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
673
733
|
"button",
|
|
674
734
|
{
|
|
675
735
|
type: "button",
|
|
@@ -681,7 +741,7 @@ function Switch({ label, checked, onChange, disabled }) {
|
|
|
681
741
|
${checked ? "bg-blue-500" : "bg-gray-300"}
|
|
682
742
|
${disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"}
|
|
683
743
|
`,
|
|
684
|
-
children: /* @__PURE__ */
|
|
744
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
685
745
|
"div",
|
|
686
746
|
{
|
|
687
747
|
className: `bg-white w-5 h-5 rounded-full shadow-md transform transition-transform duration-300
|
|
@@ -694,7 +754,7 @@ function Switch({ label, checked, onChange, disabled }) {
|
|
|
694
754
|
}
|
|
695
755
|
|
|
696
756
|
// src/Switch/SwitchSelect/SwitchSelect.tsx
|
|
697
|
-
|
|
757
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
698
758
|
function SwitchSelect({
|
|
699
759
|
option,
|
|
700
760
|
onClick,
|
|
@@ -703,13 +763,13 @@ function SwitchSelect({
|
|
|
703
763
|
required,
|
|
704
764
|
color
|
|
705
765
|
}) {
|
|
706
|
-
return /* @__PURE__ */
|
|
707
|
-
label && /* @__PURE__ */
|
|
766
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col container-input", children: [
|
|
767
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("p", { className: `body-1`, children: [
|
|
708
768
|
label,
|
|
709
769
|
" ",
|
|
710
|
-
required && /* @__PURE__ */
|
|
770
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-red-500", children: "*" })
|
|
711
771
|
] }),
|
|
712
|
-
/* @__PURE__ */
|
|
772
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex", children: option.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
713
773
|
"button",
|
|
714
774
|
{
|
|
715
775
|
onClick: () => onClick(item.value),
|
|
@@ -726,22 +786,22 @@ function SwitchSelect({
|
|
|
726
786
|
}
|
|
727
787
|
|
|
728
788
|
// src/NavBar/MenuNavBar/MenuNavBar.tsx
|
|
729
|
-
|
|
789
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
730
790
|
function MenuNavBar({ menus, onClick }) {
|
|
731
|
-
return /* @__PURE__ */
|
|
732
|
-
/* @__PURE__ */
|
|
733
|
-
menu?.subMenus.map((subMenu) => /* @__PURE__ */
|
|
791
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "w-full h-full p-[10px] bg-white", children: menus?.map((menu, index) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: `p-[10px] ${index !== 0 ? "mt-[10px]" : ""}`, children: [
|
|
792
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "p-[10px] w-[202px] h-[47px] subtitle-1", children: menu.title }),
|
|
793
|
+
menu?.subMenus.map((subMenu) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
734
794
|
"div",
|
|
735
795
|
{
|
|
736
796
|
className: "group flex justify-center items-center gap-[10px] p-[10px] w-[202px] h-[47px] rounded-[6px] subtitle-2 cursor-pointer hover:bg-red-100 active:bg-primary-500 hover:text-white active:text-white",
|
|
737
797
|
onClick: () => onClick(subMenu.path),
|
|
738
798
|
children: [
|
|
739
|
-
/* @__PURE__ */
|
|
740
|
-
subMenu.icon && /* @__PURE__ */
|
|
741
|
-
subMenu.iconActive && /* @__PURE__ */
|
|
799
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("span", { className: "flex justify-center items-center w-[24px] h-[24px] text-[20px]", children: [
|
|
800
|
+
subMenu.icon && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `block ${subMenu.iconActive ? "group-active:hidden" : ""}`, children: subMenu.icon }),
|
|
801
|
+
subMenu.iconActive && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "hidden group-active:block", children: subMenu.iconActive })
|
|
742
802
|
] }),
|
|
743
803
|
subMenu.title,
|
|
744
|
-
/* @__PURE__ */
|
|
804
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex ml-auto", children: subMenu.customNode && subMenu.customNode })
|
|
745
805
|
]
|
|
746
806
|
},
|
|
747
807
|
`sub_${subMenu.title}`
|
|
@@ -750,56 +810,56 @@ function MenuNavBar({ menus, onClick }) {
|
|
|
750
810
|
}
|
|
751
811
|
|
|
752
812
|
// src/NavBar/MenuNavBar/Sidebar.tsx
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
var SidebarContext = createContext({ expanded: false });
|
|
813
|
+
var import_icons_react2 = require("@tabler/icons-react");
|
|
814
|
+
var import_react = require("react");
|
|
815
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
816
|
+
var SidebarContext = (0, import_react.createContext)({ expanded: false });
|
|
757
817
|
function Sidebar({ children, logo }) {
|
|
758
|
-
const [expanded, setExpanded] = useState(true);
|
|
759
|
-
return /* @__PURE__ */
|
|
760
|
-
/* @__PURE__ */
|
|
761
|
-
expanded && logo && /* @__PURE__ */
|
|
762
|
-
/* @__PURE__ */
|
|
818
|
+
const [expanded, setExpanded] = (0, import_react.useState)(true);
|
|
819
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("aside", { className: "h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("nav", { className: `h-full flex flex-col bg-white border-r shadow-sm duration-150 ${expanded ? "w-64" : "w-16"}`, children: [
|
|
820
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "p-4 pb-2 flex justify-center items-center", children: [
|
|
821
|
+
expanded && logo && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("img", { src: logo, width: 120, className: "ml-auto" }),
|
|
822
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
763
823
|
"button",
|
|
764
824
|
{
|
|
765
825
|
className: "p-1.5 rounded-lg bg-gray-50 hover:bg-gray-100 cursor-pointer ml-auto",
|
|
766
826
|
onClick: () => setExpanded((curr) => !curr),
|
|
767
|
-
children: expanded ? /* @__PURE__ */
|
|
827
|
+
children: expanded ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_icons_react2.IconChevronLeftPipe, {}) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_icons_react2.IconChevronRightPipe, {})
|
|
768
828
|
}
|
|
769
829
|
)
|
|
770
830
|
] }),
|
|
771
|
-
/* @__PURE__ */
|
|
831
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SidebarContext.Provider, { value: { expanded }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { className: "flex-1 px-3", children }) })
|
|
772
832
|
] }) });
|
|
773
833
|
}
|
|
774
834
|
|
|
775
835
|
// src/NavBar/TopNavBar/TopNavBar.tsx
|
|
776
|
-
|
|
777
|
-
|
|
836
|
+
var import_icons_react3 = require("@tabler/icons-react");
|
|
837
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
778
838
|
function TopNavBar({ onClickNoti, logo }) {
|
|
779
|
-
return /* @__PURE__ */
|
|
780
|
-
/* @__PURE__ */
|
|
839
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "w-full h-full flex", children: [
|
|
840
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-[20px] p-[10px]", children: [
|
|
781
841
|
logo,
|
|
782
|
-
/* @__PURE__ */
|
|
842
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "subtitle-1", children: "Project Management" })
|
|
783
843
|
] }),
|
|
784
|
-
/* @__PURE__ */
|
|
785
|
-
/* @__PURE__ */
|
|
786
|
-
/* @__PURE__ */
|
|
787
|
-
/* @__PURE__ */
|
|
844
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center ml-auto gap-[20px] p-[10px]", children: [
|
|
845
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: "Search" }),
|
|
846
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons_react3.IconBellRinging, { onClick: onClickNoti, className: "cursor-pointer" }) }),
|
|
847
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "w-[40px] h-[40px] bg-gray-400 rounded-full cursor-pointer" })
|
|
788
848
|
] })
|
|
789
849
|
] });
|
|
790
850
|
}
|
|
791
851
|
|
|
792
852
|
// src/Table/DataTable/DataTable.tsx
|
|
793
|
-
|
|
794
|
-
|
|
853
|
+
var import_icons_react5 = require("@tabler/icons-react");
|
|
854
|
+
var import_react3 = require("react");
|
|
795
855
|
|
|
796
856
|
// src/Table/Pagination/Pagination.tsx
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
857
|
+
var import_icons_react4 = require("@tabler/icons-react");
|
|
858
|
+
var import_react2 = require("react");
|
|
859
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
800
860
|
function Pagination({ totalItems, itemsPerPage, currentPage, onPageChange }) {
|
|
801
861
|
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
|
802
|
-
const getPages = useMemo(() => {
|
|
862
|
+
const getPages = (0, import_react2.useMemo)(() => {
|
|
803
863
|
if (totalPages <= 7) {
|
|
804
864
|
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
805
865
|
}
|
|
@@ -820,21 +880,21 @@ function Pagination({ totalItems, itemsPerPage, currentPage, onPageChange }) {
|
|
|
820
880
|
return pages;
|
|
821
881
|
}, [totalPages, currentPage]);
|
|
822
882
|
if (totalPages <= 1) return null;
|
|
823
|
-
return /* @__PURE__ */
|
|
824
|
-
/* @__PURE__ */
|
|
883
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center justify-center gap-2 mt-4 body-1", children: [
|
|
884
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
825
885
|
"button",
|
|
826
886
|
{
|
|
827
887
|
className: "px-3 py-1 disabled:opacity-50 flex gap-[8px] cursor-pointer",
|
|
828
888
|
disabled: currentPage === 1,
|
|
829
889
|
onClick: () => onPageChange(currentPage - 1),
|
|
830
890
|
children: [
|
|
831
|
-
/* @__PURE__ */
|
|
891
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react4.IconArrowLeft, {}),
|
|
832
892
|
"\u0E22\u0E49\u0E2D\u0E19\u0E01\u0E25\u0E31\u0E1A"
|
|
833
893
|
]
|
|
834
894
|
}
|
|
835
895
|
),
|
|
836
896
|
getPages.map(
|
|
837
|
-
(page, i) => typeof page === "string" ? /* @__PURE__ */
|
|
897
|
+
(page, i) => typeof page === "string" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "px-2", children: page }, i) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
838
898
|
"button",
|
|
839
899
|
{
|
|
840
900
|
className: `w-[32px] h-[32px] rounded-[8px] px-3 py-1 cursor-pointer
|
|
@@ -845,7 +905,7 @@ function Pagination({ totalItems, itemsPerPage, currentPage, onPageChange }) {
|
|
|
845
905
|
i
|
|
846
906
|
)
|
|
847
907
|
),
|
|
848
|
-
/* @__PURE__ */
|
|
908
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
849
909
|
"button",
|
|
850
910
|
{
|
|
851
911
|
className: "px-3 py-1 disabled:opacity-50 flex gap-[8px] cursor-pointer",
|
|
@@ -853,7 +913,7 @@ function Pagination({ totalItems, itemsPerPage, currentPage, onPageChange }) {
|
|
|
853
913
|
onClick: () => onPageChange(currentPage + 1),
|
|
854
914
|
children: [
|
|
855
915
|
"\u0E16\u0E31\u0E14\u0E44\u0E1B",
|
|
856
|
-
/* @__PURE__ */
|
|
916
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react4.IconArrowRight, {})
|
|
857
917
|
]
|
|
858
918
|
}
|
|
859
919
|
)
|
|
@@ -861,43 +921,43 @@ function Pagination({ totalItems, itemsPerPage, currentPage, onPageChange }) {
|
|
|
861
921
|
}
|
|
862
922
|
|
|
863
923
|
// src/Table/DataTable/DataTable.tsx
|
|
864
|
-
|
|
924
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
865
925
|
function DataTable({ columns, data, onSort, isLoading }) {
|
|
866
926
|
const cols = Math.max(1, columns.length);
|
|
867
927
|
const gridClass = "grid [grid-template-columns:repeat(var(--cols),minmax(0,1fr))]";
|
|
868
|
-
const [sortConfig, setSortConfig] =
|
|
869
|
-
const [page, setPage] =
|
|
928
|
+
const [sortConfig, setSortConfig] = (0, import_react3.useState)(null);
|
|
929
|
+
const [page, setPage] = (0, import_react3.useState)(1);
|
|
870
930
|
const onSorting = (config) => {
|
|
871
931
|
if (config) {
|
|
872
932
|
setSortConfig({ key: config?.key, direction: config?.direction });
|
|
873
933
|
onSort();
|
|
874
934
|
}
|
|
875
935
|
};
|
|
876
|
-
return /* @__PURE__ */
|
|
877
|
-
/* @__PURE__ */
|
|
936
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "border rounded-md w-full h-full", children: [
|
|
937
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: `${gridClass} font-semibold border-b border-gray-200`, style: { ["--cols"]: cols }, children: columns.map((col, i) => {
|
|
878
938
|
const isActive = sortConfig?.key === col.accessor;
|
|
879
939
|
const direction = isActive ? sortConfig?.direction : null;
|
|
880
|
-
return /* @__PURE__ */
|
|
940
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-[8px] py-[8px] px-[16px] body-4 truncate", children: [
|
|
881
941
|
col.header,
|
|
882
|
-
col.sortable && /* @__PURE__ */
|
|
883
|
-
direction === null && /* @__PURE__ */
|
|
884
|
-
IconSelector,
|
|
942
|
+
col.sortable && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
943
|
+
direction === null && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
944
|
+
import_icons_react5.IconSelector,
|
|
885
945
|
{
|
|
886
946
|
size: 15,
|
|
887
947
|
className: "hover:text-red-400 cursor-pointer",
|
|
888
948
|
onClick: () => onSorting({ key: col.accessor, direction: "asc" })
|
|
889
949
|
}
|
|
890
950
|
),
|
|
891
|
-
direction === "asc" && /* @__PURE__ */
|
|
892
|
-
IconSortAscending,
|
|
951
|
+
direction === "asc" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
952
|
+
import_icons_react5.IconSortAscending,
|
|
893
953
|
{
|
|
894
954
|
size: 15,
|
|
895
955
|
className: "cursor-pointer text-red-500",
|
|
896
956
|
onClick: () => onSorting({ key: col.accessor, direction: "desc" })
|
|
897
957
|
}
|
|
898
958
|
),
|
|
899
|
-
direction === "desc" && /* @__PURE__ */
|
|
900
|
-
IconSortDescending,
|
|
959
|
+
direction === "desc" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
960
|
+
import_icons_react5.IconSortDescending,
|
|
901
961
|
{
|
|
902
962
|
size: 15,
|
|
903
963
|
className: "cursor-pointer text-red-500",
|
|
@@ -907,23 +967,23 @@ function DataTable({ columns, data, onSort, isLoading }) {
|
|
|
907
967
|
] })
|
|
908
968
|
] }, i);
|
|
909
969
|
}) }),
|
|
910
|
-
isLoading ? /* @__PURE__ */
|
|
970
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex justify-center items-center w-full h-full", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Loader, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: data.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
911
971
|
"div",
|
|
912
972
|
{
|
|
913
973
|
className: `${gridClass} ${data.length - 1 !== i ? "border-b border-gray-200" : ""} items-center`,
|
|
914
974
|
style: { ["--cols"]: cols },
|
|
915
|
-
children: columns.map((col, c) => /* @__PURE__ */
|
|
975
|
+
children: columns.map((col, c) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "py-[8px] px-[16px] body-3 truncate", children: typeof col.accessor === "function" ? col.accessor(row) : String(row[col.accessor]) }, c))
|
|
916
976
|
},
|
|
917
977
|
i
|
|
918
978
|
)) }),
|
|
919
|
-
/* @__PURE__ */
|
|
979
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Pagination, { currentPage: page, itemsPerPage: 5, totalItems: 10, onPageChange: setPage }) })
|
|
920
980
|
] });
|
|
921
981
|
}
|
|
922
982
|
|
|
923
983
|
// src/Table/DataTable/AntDataTable.tsx
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
984
|
+
var import_antd = require("antd");
|
|
985
|
+
var import_react4 = require("react");
|
|
986
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
927
987
|
function AntDataTable({
|
|
928
988
|
dataSource,
|
|
929
989
|
columns,
|
|
@@ -937,7 +997,7 @@ function AntDataTable({
|
|
|
937
997
|
height,
|
|
938
998
|
pagination
|
|
939
999
|
}) {
|
|
940
|
-
const [selectedRowKeys, setSelectedRowKeys] =
|
|
1000
|
+
const [selectedRowKeys, setSelectedRowKeys] = (0, import_react4.useState)([]);
|
|
941
1001
|
const rowSelection = {
|
|
942
1002
|
selectedRowKeys,
|
|
943
1003
|
onChange: (newSelectedRowKeys) => {
|
|
@@ -949,8 +1009,8 @@ function AntDataTable({
|
|
|
949
1009
|
onChange?.(paginationArgs, filters, sorter, extra);
|
|
950
1010
|
onFilter(filters);
|
|
951
1011
|
};
|
|
952
|
-
return /* @__PURE__ */
|
|
953
|
-
ConfigProvider,
|
|
1012
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1013
|
+
import_antd.ConfigProvider,
|
|
954
1014
|
{
|
|
955
1015
|
theme: {
|
|
956
1016
|
components: {},
|
|
@@ -959,8 +1019,8 @@ function AntDataTable({
|
|
|
959
1019
|
fontSize: 14
|
|
960
1020
|
}
|
|
961
1021
|
},
|
|
962
|
-
children: /* @__PURE__ */
|
|
963
|
-
Table,
|
|
1022
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1023
|
+
import_antd.Table,
|
|
964
1024
|
{
|
|
965
1025
|
dataSource,
|
|
966
1026
|
columns,
|
|
@@ -976,19 +1036,19 @@ function AntDataTable({
|
|
|
976
1036
|
}
|
|
977
1037
|
|
|
978
1038
|
// src/Calendar/Calendar/Calendar.tsx
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
1039
|
+
var import_react5 = require("react");
|
|
1040
|
+
var import_react6 = __toESM(require("@fullcalendar/react"), 1);
|
|
1041
|
+
var import_daygrid = __toESM(require("@fullcalendar/daygrid"), 1);
|
|
1042
|
+
var import_timegrid = __toESM(require("@fullcalendar/timegrid"), 1);
|
|
1043
|
+
var import_interaction = __toESM(require("@fullcalendar/interaction"), 1);
|
|
1044
|
+
var import_th = __toESM(require("@fullcalendar/core/locales/th"), 1);
|
|
1045
|
+
var import_icons_react6 = require("@tabler/icons-react");
|
|
1046
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
987
1047
|
function Calendar({ events }) {
|
|
988
|
-
const calendarRef = useRef(null);
|
|
989
|
-
const [monthTitle, setMonthTitle] =
|
|
990
|
-
const [openPopup, setOpenPopup] =
|
|
991
|
-
const [selectedEvent, setSelectedEvent] =
|
|
1048
|
+
const calendarRef = (0, import_react5.useRef)(null);
|
|
1049
|
+
const [monthTitle, setMonthTitle] = (0, import_react5.useState)("");
|
|
1050
|
+
const [openPopup, setOpenPopup] = (0, import_react5.useState)(false);
|
|
1051
|
+
const [selectedEvent, setSelectedEvent] = (0, import_react5.useState)(null);
|
|
992
1052
|
const updateTitle = () => {
|
|
993
1053
|
const calendarApi = calendarRef.current?.getApi();
|
|
994
1054
|
if (calendarApi) {
|
|
@@ -999,14 +1059,14 @@ function Calendar({ events }) {
|
|
|
999
1059
|
const calendarApi = calendarRef.current?.getApi();
|
|
1000
1060
|
calendarApi?.changeView(viewName);
|
|
1001
1061
|
};
|
|
1002
|
-
useEffect(() => {
|
|
1062
|
+
(0, import_react5.useEffect)(() => {
|
|
1003
1063
|
updateTitle();
|
|
1004
1064
|
}, []);
|
|
1005
|
-
return /* @__PURE__ */
|
|
1006
|
-
/* @__PURE__ */
|
|
1007
|
-
/* @__PURE__ */
|
|
1008
|
-
/* @__PURE__ */
|
|
1009
|
-
/* @__PURE__ */
|
|
1065
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "fc w-full h-full relative z-10", children: [
|
|
1066
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex mb-[8px]", children: [
|
|
1067
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "headline-5", children: monthTitle }),
|
|
1068
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex gap-[10px] ml-auto", children: [
|
|
1069
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1010
1070
|
"p",
|
|
1011
1071
|
{
|
|
1012
1072
|
className: "w-[80px] h-[35px] border-[1px] flex justify-center items-center rounded-[2px] body-3 cursor-pointer",
|
|
@@ -1017,7 +1077,7 @@ function Calendar({ events }) {
|
|
|
1017
1077
|
children: "\u0E27\u0E31\u0E19\u0E19\u0E35\u0E49"
|
|
1018
1078
|
}
|
|
1019
1079
|
),
|
|
1020
|
-
/* @__PURE__ */
|
|
1080
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1021
1081
|
"p",
|
|
1022
1082
|
{
|
|
1023
1083
|
className: "w-[80px] h-[35px] border-[1px] flex justify-center items-center rounded-[2px] body-3 cursor-pointer",
|
|
@@ -1028,7 +1088,7 @@ function Calendar({ events }) {
|
|
|
1028
1088
|
children: "Month"
|
|
1029
1089
|
}
|
|
1030
1090
|
),
|
|
1031
|
-
/* @__PURE__ */
|
|
1091
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1032
1092
|
"p",
|
|
1033
1093
|
{
|
|
1034
1094
|
className: "w-[80px] h-[35px] border-[1px] flex justify-center items-center rounded-[2px] body-3 cursor-pointer",
|
|
@@ -1039,7 +1099,7 @@ function Calendar({ events }) {
|
|
|
1039
1099
|
children: "Week"
|
|
1040
1100
|
}
|
|
1041
1101
|
),
|
|
1042
|
-
/* @__PURE__ */
|
|
1102
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1043
1103
|
"p",
|
|
1044
1104
|
{
|
|
1045
1105
|
className: "w-[80px] h-[35px] border-[1px] flex justify-center items-center rounded-[2px] body-3 cursor-pointer",
|
|
@@ -1050,7 +1110,7 @@ function Calendar({ events }) {
|
|
|
1050
1110
|
children: "Day"
|
|
1051
1111
|
}
|
|
1052
1112
|
),
|
|
1053
|
-
/* @__PURE__ */
|
|
1113
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1054
1114
|
"button",
|
|
1055
1115
|
{
|
|
1056
1116
|
className: "cursor-pointer",
|
|
@@ -1058,10 +1118,10 @@ function Calendar({ events }) {
|
|
|
1058
1118
|
calendarRef.current?.getApi().prev();
|
|
1059
1119
|
updateTitle();
|
|
1060
1120
|
},
|
|
1061
|
-
children: /* @__PURE__ */
|
|
1121
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_icons_react6.IconChevronLeft, {})
|
|
1062
1122
|
}
|
|
1063
1123
|
),
|
|
1064
|
-
/* @__PURE__ */
|
|
1124
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1065
1125
|
"button",
|
|
1066
1126
|
{
|
|
1067
1127
|
className: "cursor-pointer",
|
|
@@ -1069,18 +1129,18 @@ function Calendar({ events }) {
|
|
|
1069
1129
|
calendarRef.current?.getApi().next();
|
|
1070
1130
|
updateTitle();
|
|
1071
1131
|
},
|
|
1072
|
-
children: /* @__PURE__ */
|
|
1132
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_icons_react6.IconChevronRight, {})
|
|
1073
1133
|
}
|
|
1074
1134
|
)
|
|
1075
1135
|
] })
|
|
1076
1136
|
] }),
|
|
1077
|
-
/* @__PURE__ */
|
|
1078
|
-
|
|
1137
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "relative z-10", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1138
|
+
import_react6.default,
|
|
1079
1139
|
{
|
|
1080
1140
|
ref: calendarRef,
|
|
1081
|
-
plugins: [
|
|
1141
|
+
plugins: [import_daygrid.default, import_timegrid.default, import_interaction.default],
|
|
1082
1142
|
events,
|
|
1083
|
-
locale:
|
|
1143
|
+
locale: import_th.default,
|
|
1084
1144
|
slotLabelFormat: {
|
|
1085
1145
|
hour: "numeric",
|
|
1086
1146
|
minute: "2-digit"
|
|
@@ -1103,36 +1163,36 @@ function Calendar({ events }) {
|
|
|
1103
1163
|
});
|
|
1104
1164
|
},
|
|
1105
1165
|
eventContent: (arg) => {
|
|
1106
|
-
return /* @__PURE__ */
|
|
1166
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex items-center h-[28px] p-[4px] border-green-500 border-l-[10px] bg-red-400 rounded text-left text-white caption-1", children: arg.event.title }) });
|
|
1107
1167
|
},
|
|
1108
1168
|
moreLinkContent: (arg) => `+${arg.num} \u0E23\u0E32\u0E22\u0E01\u0E32\u0E23`
|
|
1109
1169
|
}
|
|
1110
1170
|
) }),
|
|
1111
|
-
openPopup && /* @__PURE__ */
|
|
1171
|
+
openPopup && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "fixed inset-0 flex justify-center items-center bg-black/50 z-50", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(EventPopUp, { event: selectedEvent, onClose: () => setOpenPopup(false) }) })
|
|
1112
1172
|
] });
|
|
1113
1173
|
}
|
|
1114
1174
|
function EventPopUp({ event, onClose }) {
|
|
1115
|
-
return /* @__PURE__ */
|
|
1116
|
-
/* @__PURE__ */
|
|
1117
|
-
/* @__PURE__ */
|
|
1118
|
-
/* @__PURE__ */
|
|
1119
|
-
/* @__PURE__ */
|
|
1120
|
-
/* @__PURE__ */
|
|
1175
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "w-[500px] h-auto rounded-2xl bg-white relative z-50 shadow-2xl overflow-hidden", children: [
|
|
1176
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { className: "absolute top-3 right-3 rounded-full p-1 hover:bg-gray-200 transition", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_icons_react6.IconX, { className: "w-6 h-6 text-gray-600" }) }),
|
|
1177
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "bg-red-400 text-left text-white px-6 py-4 headline-5", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h2", { className: "text-lg font-semibold", children: event.title }) }),
|
|
1178
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col w-full p-6 gap-3 text-gray-700 body-3", children: [
|
|
1179
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("p", { children: [
|
|
1180
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "font-medium", children: "\u0E40\u0E23\u0E34\u0E48\u0E21: " }),
|
|
1121
1181
|
event?.start?.toLocaleString?.() || String(event?.start)
|
|
1122
1182
|
] }),
|
|
1123
|
-
/* @__PURE__ */
|
|
1124
|
-
/* @__PURE__ */
|
|
1183
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("p", { children: [
|
|
1184
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "font-medium", children: "\u0E2A\u0E34\u0E49\u0E19\u0E2A\u0E38\u0E14: " }),
|
|
1125
1185
|
event?.end?.toLocaleString?.() || String(event?.end)
|
|
1126
1186
|
] }),
|
|
1127
|
-
/* @__PURE__ */
|
|
1187
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h3", { className: "text-sm font-semibold text-gray-500 uppercase mb-2 hover:underline cursor-pointer", children: "\u0E23\u0E32\u0E22\u0E25\u0E30\u0E40\u0E2D\u0E35\u0E22\u0E14\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E40\u0E15\u0E34\u0E21" })
|
|
1128
1188
|
] })
|
|
1129
1189
|
] });
|
|
1130
1190
|
}
|
|
1131
1191
|
|
|
1132
1192
|
// src/Input/TextInput/TextInput.tsx
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1193
|
+
var import_icons_react7 = require("@tabler/icons-react");
|
|
1194
|
+
var import_react7 = require("react");
|
|
1195
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1136
1196
|
function TextInput({
|
|
1137
1197
|
label,
|
|
1138
1198
|
placeholder,
|
|
@@ -1144,23 +1204,23 @@ function TextInput({
|
|
|
1144
1204
|
onChange,
|
|
1145
1205
|
disabled
|
|
1146
1206
|
}) {
|
|
1147
|
-
const [showPassword, setShowPassword] =
|
|
1207
|
+
const [showPassword, setShowPassword] = (0, import_react7.useState)(false);
|
|
1148
1208
|
const onShowPassword = () => {
|
|
1149
1209
|
setShowPassword(!showPassword);
|
|
1150
1210
|
};
|
|
1151
1211
|
const inputType = type === "password" ? showPassword ? "text" : "password" : "text";
|
|
1152
|
-
return /* @__PURE__ */
|
|
1153
|
-
label && /* @__PURE__ */
|
|
1212
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
|
|
1213
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("p", { className: "body-1 mb-[8px]", children: [
|
|
1154
1214
|
label,
|
|
1155
|
-
required && /* @__PURE__ */
|
|
1215
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-red-500", children: "\xA0*" })
|
|
1156
1216
|
] }),
|
|
1157
|
-
/* @__PURE__ */
|
|
1217
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
1158
1218
|
"div",
|
|
1159
1219
|
{
|
|
1160
1220
|
className: `border-[1px] rounded-[8px] w-full h-[40px] flex justify-center items-center
|
|
1161
1221
|
${disabled ? "bg-gray-100 text-gray-400" : error ? "border-red-500" : ""}`,
|
|
1162
1222
|
children: [
|
|
1163
|
-
/* @__PURE__ */
|
|
1223
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
1164
1224
|
"input",
|
|
1165
1225
|
{
|
|
1166
1226
|
className: `w-full h-full px-[16px] ${disabled ? "cursor-not-allowed" : ""}`,
|
|
@@ -1173,18 +1233,18 @@ function TextInput({
|
|
|
1173
1233
|
disabled
|
|
1174
1234
|
}
|
|
1175
1235
|
),
|
|
1176
|
-
type === "password" && (showPassword ? /* @__PURE__ */
|
|
1236
|
+
type === "password" && (showPassword ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_icons_react7.IconEye, { className: "text-gray-600 mr-[8px] cursor-pointer", onClick: onShowPassword }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_icons_react7.IconEyeOff, { className: "text-gray-600 mr-[8px] cursor-pointer", onClick: onShowPassword }))
|
|
1177
1237
|
]
|
|
1178
1238
|
}
|
|
1179
1239
|
),
|
|
1180
|
-
error && /* @__PURE__ */
|
|
1240
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-red-500 body-1", children: error })
|
|
1181
1241
|
] });
|
|
1182
1242
|
}
|
|
1183
1243
|
|
|
1184
1244
|
// src/Input/TextArea/TextArea.tsx
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
var { TextArea } = Input;
|
|
1245
|
+
var import_antd2 = require("antd");
|
|
1246
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1247
|
+
var { TextArea } = import_antd2.Input;
|
|
1188
1248
|
function TextAreaInput({
|
|
1189
1249
|
label,
|
|
1190
1250
|
height = 4,
|
|
@@ -1198,8 +1258,8 @@ function TextAreaInput({
|
|
|
1198
1258
|
error,
|
|
1199
1259
|
disabled
|
|
1200
1260
|
}) {
|
|
1201
|
-
return /* @__PURE__ */
|
|
1202
|
-
|
|
1261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1262
|
+
import_antd2.ConfigProvider,
|
|
1203
1263
|
{
|
|
1204
1264
|
theme: {
|
|
1205
1265
|
components: {},
|
|
@@ -1208,13 +1268,13 @@ function TextAreaInput({
|
|
|
1208
1268
|
fontSize: 16
|
|
1209
1269
|
}
|
|
1210
1270
|
},
|
|
1211
|
-
children: /* @__PURE__ */
|
|
1212
|
-
label && /* @__PURE__ */
|
|
1271
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
|
|
1272
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("p", { className: "body-1 mb-[8px]", children: [
|
|
1213
1273
|
label,
|
|
1214
1274
|
" ",
|
|
1215
|
-
required && /* @__PURE__ */
|
|
1275
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-red-500", children: "\xA0*" })
|
|
1216
1276
|
] }),
|
|
1217
|
-
/* @__PURE__ */
|
|
1277
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1218
1278
|
TextArea,
|
|
1219
1279
|
{
|
|
1220
1280
|
value,
|
|
@@ -1230,15 +1290,15 @@ function TextAreaInput({
|
|
|
1230
1290
|
disabled
|
|
1231
1291
|
}
|
|
1232
1292
|
),
|
|
1233
|
-
error && /* @__PURE__ */
|
|
1293
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-red-500 body-1", children: error })
|
|
1234
1294
|
] })
|
|
1235
1295
|
}
|
|
1236
1296
|
) });
|
|
1237
1297
|
}
|
|
1238
1298
|
|
|
1239
1299
|
// src/Input/InputField/InputField.tsx
|
|
1240
|
-
|
|
1241
|
-
|
|
1300
|
+
var import_antd3 = require("antd");
|
|
1301
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1242
1302
|
function InputField({
|
|
1243
1303
|
value,
|
|
1244
1304
|
onChange,
|
|
@@ -1254,24 +1314,24 @@ function InputField({
|
|
|
1254
1314
|
onClear,
|
|
1255
1315
|
statickey
|
|
1256
1316
|
}) {
|
|
1257
|
-
return /* @__PURE__ */
|
|
1258
|
-
|
|
1317
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1318
|
+
import_antd3.ConfigProvider,
|
|
1259
1319
|
{
|
|
1260
1320
|
theme: {
|
|
1261
1321
|
token: {
|
|
1262
1322
|
fontFamily: "Kanit"
|
|
1263
1323
|
}
|
|
1264
1324
|
},
|
|
1265
|
-
children: /* @__PURE__ */
|
|
1266
|
-
/* @__PURE__ */
|
|
1267
|
-
/* @__PURE__ */
|
|
1325
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "container-input", children: [
|
|
1326
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
|
|
1327
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "body-1", children: label }),
|
|
1268
1328
|
" ",
|
|
1269
|
-
required && /* @__PURE__ */
|
|
1329
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1270
1330
|
] }),
|
|
1271
|
-
/* @__PURE__ */
|
|
1272
|
-
statickey && /* @__PURE__ */
|
|
1273
|
-
/* @__PURE__ */
|
|
1274
|
-
|
|
1331
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_antd3.Space.Compact, { children: [
|
|
1332
|
+
statickey && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "items-center flex px-2 bg-gray-300 rounded-l-md body-1", children: statickey }),
|
|
1333
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1334
|
+
import_antd3.Input,
|
|
1275
1335
|
{
|
|
1276
1336
|
value,
|
|
1277
1337
|
placeholder,
|
|
@@ -1286,15 +1346,15 @@ function InputField({
|
|
|
1286
1346
|
}
|
|
1287
1347
|
)
|
|
1288
1348
|
] }),
|
|
1289
|
-
error && /* @__PURE__ */
|
|
1349
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1290
1350
|
] })
|
|
1291
1351
|
}
|
|
1292
1352
|
);
|
|
1293
1353
|
}
|
|
1294
1354
|
|
|
1295
1355
|
// src/Input/InputFieldNumber/InputFieldNumber.tsx
|
|
1296
|
-
|
|
1297
|
-
|
|
1356
|
+
var import_antd4 = require("antd");
|
|
1357
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1298
1358
|
function InputFieldNumber({
|
|
1299
1359
|
value,
|
|
1300
1360
|
onChange,
|
|
@@ -1315,22 +1375,22 @@ function InputFieldNumber({
|
|
|
1315
1375
|
formatter,
|
|
1316
1376
|
parser
|
|
1317
1377
|
}) {
|
|
1318
|
-
return /* @__PURE__ */
|
|
1319
|
-
|
|
1378
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1379
|
+
import_antd4.ConfigProvider,
|
|
1320
1380
|
{
|
|
1321
1381
|
theme: {
|
|
1322
1382
|
token: {
|
|
1323
1383
|
fontFamily: "Kanit"
|
|
1324
1384
|
}
|
|
1325
1385
|
},
|
|
1326
|
-
children: /* @__PURE__ */
|
|
1327
|
-
/* @__PURE__ */
|
|
1328
|
-
/* @__PURE__ */
|
|
1386
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "container-input", children: [
|
|
1387
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
|
|
1388
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "body-1", children: label }),
|
|
1329
1389
|
" ",
|
|
1330
|
-
required && /* @__PURE__ */
|
|
1390
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1331
1391
|
] }),
|
|
1332
|
-
/* @__PURE__ */
|
|
1333
|
-
InputNumber,
|
|
1392
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1393
|
+
import_antd4.InputNumber,
|
|
1334
1394
|
{
|
|
1335
1395
|
value: value ?? void 0,
|
|
1336
1396
|
onChange: (val) => onChange(val),
|
|
@@ -1349,22 +1409,22 @@ function InputFieldNumber({
|
|
|
1349
1409
|
parser
|
|
1350
1410
|
}
|
|
1351
1411
|
),
|
|
1352
|
-
error && /* @__PURE__ */
|
|
1412
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1353
1413
|
] })
|
|
1354
1414
|
}
|
|
1355
1415
|
);
|
|
1356
1416
|
}
|
|
1357
1417
|
|
|
1358
1418
|
// src/DatePicker/DatePickerBasic/DatePickerBasic.tsx
|
|
1359
|
-
var
|
|
1360
|
-
var
|
|
1361
|
-
var
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1419
|
+
var import_antd5 = require("antd");
|
|
1420
|
+
var import_dayjs = __toESM(require_dayjs_min(), 1);
|
|
1421
|
+
var import_th_TH = __toESM(require("antd/es/date-picker/locale/th_TH.js"), 1);
|
|
1422
|
+
var import_th_TH2 = __toESM(require("antd/locale/th_TH.js"), 1);
|
|
1423
|
+
var import_th2 = __toESM(require_th(), 1);
|
|
1424
|
+
var import_locale = require("date-fns/locale");
|
|
1425
|
+
var import_date_fns = require("date-fns");
|
|
1426
|
+
var import_buddhistEra = __toESM(require_buddhistEra(), 1);
|
|
1427
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1368
1428
|
import_dayjs.default.extend(import_buddhistEra.default);
|
|
1369
1429
|
function DatePickerBasic({
|
|
1370
1430
|
value,
|
|
@@ -1384,33 +1444,33 @@ function DatePickerBasic({
|
|
|
1384
1444
|
const dateFormat = "DD/MM/YYYY";
|
|
1385
1445
|
import_dayjs.default.locale("th_TH");
|
|
1386
1446
|
const buddhistLocale = {
|
|
1387
|
-
...
|
|
1447
|
+
...import_th_TH.default,
|
|
1388
1448
|
lang: {
|
|
1389
|
-
...
|
|
1449
|
+
...import_th_TH.default.lang,
|
|
1390
1450
|
fieldDateFormat: "BBBB-MM-DD",
|
|
1391
1451
|
fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
|
|
1392
1452
|
yearFormat: "BBBB",
|
|
1393
1453
|
cellYearFormat: "BBBB"
|
|
1394
1454
|
}
|
|
1395
1455
|
};
|
|
1396
|
-
return /* @__PURE__ */
|
|
1397
|
-
|
|
1456
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1457
|
+
import_antd5.ConfigProvider,
|
|
1398
1458
|
{
|
|
1399
|
-
locale:
|
|
1459
|
+
locale: import_th_TH2.default,
|
|
1400
1460
|
theme: {
|
|
1401
1461
|
token: {
|
|
1402
1462
|
fontFamily: "Kanit",
|
|
1403
1463
|
fontSize: 16
|
|
1404
1464
|
}
|
|
1405
1465
|
},
|
|
1406
|
-
children: /* @__PURE__ */
|
|
1407
|
-
/* @__PURE__ */
|
|
1408
|
-
/* @__PURE__ */
|
|
1466
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "container-input", children: [
|
|
1467
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
|
|
1468
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "body-1", children: label }),
|
|
1409
1469
|
" ",
|
|
1410
|
-
required && /* @__PURE__ */
|
|
1470
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1411
1471
|
] }),
|
|
1412
|
-
/* @__PURE__ */
|
|
1413
|
-
DatePicker,
|
|
1472
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1473
|
+
import_antd5.DatePicker,
|
|
1414
1474
|
{
|
|
1415
1475
|
className: `body-1 w-full ${className ?? ""}`,
|
|
1416
1476
|
value,
|
|
@@ -1418,7 +1478,7 @@ function DatePickerBasic({
|
|
|
1418
1478
|
onChange,
|
|
1419
1479
|
allowClear: true,
|
|
1420
1480
|
disabled,
|
|
1421
|
-
format: (date) => date ? format(date.toDate(), "dd/MM/yyyy", { locale:
|
|
1481
|
+
format: (date) => date ? (0, import_date_fns.format)(date.toDate(), "dd/MM/yyyy", { locale: import_locale.th }).replace(
|
|
1422
1482
|
/\d{4}$/,
|
|
1423
1483
|
(y) => String(parseInt(y) + 543)
|
|
1424
1484
|
) : "",
|
|
@@ -1430,22 +1490,22 @@ function DatePickerBasic({
|
|
|
1430
1490
|
locale: buddhistLocale
|
|
1431
1491
|
}
|
|
1432
1492
|
),
|
|
1433
|
-
error && /* @__PURE__ */
|
|
1493
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1434
1494
|
] })
|
|
1435
1495
|
}
|
|
1436
1496
|
);
|
|
1437
1497
|
}
|
|
1438
1498
|
|
|
1439
1499
|
// src/DatePicker/DatePickerRangePicker/DatePickerRangePicker.tsx
|
|
1440
|
-
var
|
|
1441
|
-
var
|
|
1442
|
-
var
|
|
1443
|
-
|
|
1444
|
-
|
|
1445
|
-
|
|
1446
|
-
|
|
1447
|
-
|
|
1448
|
-
|
|
1500
|
+
var import_antd6 = require("antd");
|
|
1501
|
+
var import_th_TH3 = __toESM(require("antd/locale/th_TH.js"), 1);
|
|
1502
|
+
var import_th3 = __toESM(require_th(), 1);
|
|
1503
|
+
var import_th_TH4 = __toESM(require("antd/es/date-picker/locale/th_TH.js"), 1);
|
|
1504
|
+
var import_customParseFormat = __toESM(require_customParseFormat(), 1);
|
|
1505
|
+
var import_dayjs2 = __toESM(require_dayjs_min(), 1);
|
|
1506
|
+
var import_date_fns2 = require("date-fns");
|
|
1507
|
+
var import_locale2 = require("date-fns/locale");
|
|
1508
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1449
1509
|
import_dayjs2.default.extend(import_customParseFormat.default);
|
|
1450
1510
|
function DatePickerRangePicker({
|
|
1451
1511
|
value,
|
|
@@ -1466,35 +1526,35 @@ function DatePickerRangePicker({
|
|
|
1466
1526
|
const dateFormat = "DD/MM/YYYY";
|
|
1467
1527
|
import_dayjs2.default.locale("th_TH");
|
|
1468
1528
|
const buddhistLocale = {
|
|
1469
|
-
...
|
|
1529
|
+
...import_th_TH4.default,
|
|
1470
1530
|
lang: {
|
|
1471
|
-
...
|
|
1531
|
+
...import_th_TH4.default.lang,
|
|
1472
1532
|
fieldDateFormat: "BBBB-MM-DD",
|
|
1473
1533
|
fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
|
|
1474
1534
|
yearFormat: "BBBB",
|
|
1475
1535
|
cellYearFormat: "BBBB"
|
|
1476
1536
|
}
|
|
1477
1537
|
};
|
|
1478
|
-
return /* @__PURE__ */
|
|
1479
|
-
|
|
1538
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1539
|
+
import_antd6.ConfigProvider,
|
|
1480
1540
|
{
|
|
1481
|
-
locale:
|
|
1541
|
+
locale: import_th_TH3.default,
|
|
1482
1542
|
theme: {
|
|
1483
1543
|
token: {
|
|
1484
1544
|
fontFamily: "Kanit",
|
|
1485
1545
|
fontSize: 16
|
|
1486
1546
|
}
|
|
1487
1547
|
},
|
|
1488
|
-
children: /* @__PURE__ */
|
|
1489
|
-
/* @__PURE__ */
|
|
1490
|
-
/* @__PURE__ */
|
|
1548
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "container-input", children: [
|
|
1549
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { children: [
|
|
1550
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "body-1", children: label }),
|
|
1491
1551
|
" ",
|
|
1492
|
-
required && /* @__PURE__ */
|
|
1552
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1493
1553
|
] }),
|
|
1494
|
-
/* @__PURE__ */
|
|
1495
|
-
|
|
1554
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1555
|
+
import_antd6.DatePicker.RangePicker,
|
|
1496
1556
|
{
|
|
1497
|
-
format: (date) => date ?
|
|
1557
|
+
format: (date) => date ? (0, import_date_fns2.format)(date.toDate(), "dd/MM/yyyy", { locale: import_locale2.th }).replace(
|
|
1498
1558
|
/\d{4}$/,
|
|
1499
1559
|
(y) => String(parseInt(y) + 543)
|
|
1500
1560
|
) : "",
|
|
@@ -1529,17 +1589,17 @@ function DatePickerRangePicker({
|
|
|
1529
1589
|
locale: buddhistLocale
|
|
1530
1590
|
}
|
|
1531
1591
|
),
|
|
1532
|
-
error && /* @__PURE__ */
|
|
1592
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1533
1593
|
] })
|
|
1534
1594
|
}
|
|
1535
1595
|
);
|
|
1536
1596
|
}
|
|
1537
1597
|
|
|
1538
1598
|
// src/TimePicker/TimePickerBasic/TimePickerBasic.tsx
|
|
1539
|
-
var
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1599
|
+
var import_antd7 = require("antd");
|
|
1600
|
+
var import_dayjs3 = __toESM(require_dayjs_min(), 1);
|
|
1601
|
+
var import_th_TH5 = __toESM(require("antd/locale/th_TH.js"), 1);
|
|
1602
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1543
1603
|
function TimePickerBasic({
|
|
1544
1604
|
value,
|
|
1545
1605
|
onChange,
|
|
@@ -1550,23 +1610,23 @@ function TimePickerBasic({
|
|
|
1550
1610
|
disabled,
|
|
1551
1611
|
className
|
|
1552
1612
|
}) {
|
|
1553
|
-
return /* @__PURE__ */
|
|
1554
|
-
|
|
1613
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1614
|
+
import_antd7.ConfigProvider,
|
|
1555
1615
|
{
|
|
1556
|
-
locale:
|
|
1616
|
+
locale: import_th_TH5.default,
|
|
1557
1617
|
theme: {
|
|
1558
1618
|
token: {
|
|
1559
1619
|
fontFamily: "Kanit"
|
|
1560
1620
|
}
|
|
1561
1621
|
},
|
|
1562
|
-
children: /* @__PURE__ */
|
|
1563
|
-
/* @__PURE__ */
|
|
1564
|
-
/* @__PURE__ */
|
|
1622
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "container-input", children: [
|
|
1623
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { children: [
|
|
1624
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "body-1", children: label }),
|
|
1565
1625
|
" ",
|
|
1566
|
-
required && /* @__PURE__ */
|
|
1626
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1567
1627
|
] }),
|
|
1568
|
-
/* @__PURE__ */
|
|
1569
|
-
TimePicker,
|
|
1628
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1629
|
+
import_antd7.TimePicker,
|
|
1570
1630
|
{
|
|
1571
1631
|
format: "HH:mm",
|
|
1572
1632
|
className: `body-1 w-full ${className ?? ""}`,
|
|
@@ -1579,17 +1639,17 @@ function TimePickerBasic({
|
|
|
1579
1639
|
disabled
|
|
1580
1640
|
}
|
|
1581
1641
|
),
|
|
1582
|
-
error && /* @__PURE__ */
|
|
1642
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1583
1643
|
] })
|
|
1584
1644
|
}
|
|
1585
1645
|
);
|
|
1586
1646
|
}
|
|
1587
1647
|
|
|
1588
1648
|
// src/TimePicker/TimePickerRangePicker/TimerPickerRangePicker.tsx
|
|
1589
|
-
var
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1649
|
+
var import_antd8 = require("antd");
|
|
1650
|
+
var import_dayjs4 = __toESM(require_dayjs_min(), 1);
|
|
1651
|
+
var import_th_TH6 = __toESM(require("antd/locale/th_TH.js"), 1);
|
|
1652
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1593
1653
|
function TimePickerRangePicker({
|
|
1594
1654
|
value,
|
|
1595
1655
|
onChange,
|
|
@@ -1600,23 +1660,23 @@ function TimePickerRangePicker({
|
|
|
1600
1660
|
disabled,
|
|
1601
1661
|
className
|
|
1602
1662
|
}) {
|
|
1603
|
-
return /* @__PURE__ */
|
|
1604
|
-
|
|
1663
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1664
|
+
import_antd8.ConfigProvider,
|
|
1605
1665
|
{
|
|
1606
|
-
locale:
|
|
1666
|
+
locale: import_th_TH6.default,
|
|
1607
1667
|
theme: {
|
|
1608
1668
|
token: {
|
|
1609
1669
|
fontFamily: "Kanit"
|
|
1610
1670
|
}
|
|
1611
1671
|
},
|
|
1612
|
-
children: /* @__PURE__ */
|
|
1613
|
-
/* @__PURE__ */
|
|
1614
|
-
/* @__PURE__ */
|
|
1672
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "container-input", children: [
|
|
1673
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
1674
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "body-1", children: label }),
|
|
1615
1675
|
" ",
|
|
1616
|
-
required && /* @__PURE__ */
|
|
1676
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1617
1677
|
] }),
|
|
1618
|
-
/* @__PURE__ */
|
|
1619
|
-
|
|
1678
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1679
|
+
import_antd8.TimePicker.RangePicker,
|
|
1620
1680
|
{
|
|
1621
1681
|
format: "HH:mm",
|
|
1622
1682
|
value: value ? [value[0] ? (0, import_dayjs4.default)(value[0]) : null, value[1] ? (0, import_dayjs4.default)(value[1]) : null] : null,
|
|
@@ -1634,15 +1694,15 @@ function TimePickerRangePicker({
|
|
|
1634
1694
|
showNow: true
|
|
1635
1695
|
}
|
|
1636
1696
|
),
|
|
1637
|
-
error && /* @__PURE__ */
|
|
1697
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1638
1698
|
] })
|
|
1639
1699
|
}
|
|
1640
1700
|
);
|
|
1641
1701
|
}
|
|
1642
1702
|
|
|
1643
1703
|
// src/ColorPicker/ColorPickerBasic/ColorPicker.tsx
|
|
1644
|
-
|
|
1645
|
-
|
|
1704
|
+
var import_antd9 = require("antd");
|
|
1705
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1646
1706
|
function ColorPickerBasic({
|
|
1647
1707
|
value,
|
|
1648
1708
|
onChange,
|
|
@@ -1655,8 +1715,8 @@ function ColorPickerBasic({
|
|
|
1655
1715
|
className,
|
|
1656
1716
|
placeholder = "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2A\u0E35"
|
|
1657
1717
|
}) {
|
|
1658
|
-
return /* @__PURE__ */
|
|
1659
|
-
|
|
1718
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1719
|
+
import_antd9.ConfigProvider,
|
|
1660
1720
|
{
|
|
1661
1721
|
theme: {
|
|
1662
1722
|
token: {
|
|
@@ -1664,14 +1724,14 @@ function ColorPickerBasic({
|
|
|
1664
1724
|
fontSize: 16
|
|
1665
1725
|
}
|
|
1666
1726
|
},
|
|
1667
|
-
children: /* @__PURE__ */
|
|
1668
|
-
/* @__PURE__ */
|
|
1669
|
-
/* @__PURE__ */
|
|
1727
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "container-input", children: [
|
|
1728
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { children: [
|
|
1729
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "body-1", children: label }),
|
|
1670
1730
|
" ",
|
|
1671
|
-
required && /* @__PURE__ */
|
|
1731
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-red-500", children: "*" })
|
|
1672
1732
|
] }),
|
|
1673
|
-
/* @__PURE__ */
|
|
1674
|
-
ColorPicker,
|
|
1733
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1734
|
+
import_antd9.ColorPicker,
|
|
1675
1735
|
{
|
|
1676
1736
|
defaultFormat,
|
|
1677
1737
|
className: `body-1 w-full ${className ?? ""}`,
|
|
@@ -1682,9 +1742,9 @@ function ColorPickerBasic({
|
|
|
1682
1742
|
showText: (color) => {
|
|
1683
1743
|
const hex = color.toHexString();
|
|
1684
1744
|
if (!value) {
|
|
1685
|
-
return /* @__PURE__ */
|
|
1745
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { children: placeholder });
|
|
1686
1746
|
}
|
|
1687
|
-
return /* @__PURE__ */
|
|
1747
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("span", { children: [
|
|
1688
1748
|
"(",
|
|
1689
1749
|
hex,
|
|
1690
1750
|
")"
|
|
@@ -1693,14 +1753,14 @@ function ColorPickerBasic({
|
|
|
1693
1753
|
disabled
|
|
1694
1754
|
}
|
|
1695
1755
|
),
|
|
1696
|
-
error && /* @__PURE__ */
|
|
1756
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
1697
1757
|
] })
|
|
1698
1758
|
}
|
|
1699
1759
|
);
|
|
1700
1760
|
}
|
|
1701
1761
|
|
|
1702
1762
|
// src/ColorPicker/ColorPalettePickerBasic/ColorPalettePickerBasic.tsx
|
|
1703
|
-
|
|
1763
|
+
var import_antd10 = require("antd");
|
|
1704
1764
|
|
|
1705
1765
|
// node_modules/@babel/runtime/helpers/esm/typeof.js
|
|
1706
1766
|
function _typeof(o) {
|
|
@@ -2402,7 +2462,7 @@ var greyDark = ["#151515", "#1f1f1f", "#2d2d2d", "#393939", "#494949", "#5a5a5a"
|
|
|
2402
2462
|
greyDark.primary = greyDark[5];
|
|
2403
2463
|
|
|
2404
2464
|
// src/ColorPicker/ColorPalettePickerBasic/ColorPalettePickerBasic.tsx
|
|
2405
|
-
|
|
2465
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
2406
2466
|
function genPresets(presets = presetPalettes) {
|
|
2407
2467
|
return Object.entries(presets).map(([label, colors]) => ({
|
|
2408
2468
|
label,
|
|
@@ -2423,14 +2483,14 @@ function ColorPalettePickerBasic({
|
|
|
2423
2483
|
placeholder = "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2A\u0E35",
|
|
2424
2484
|
onClear
|
|
2425
2485
|
}) {
|
|
2426
|
-
const { token } = theme.useToken();
|
|
2486
|
+
const { token } = import_antd10.theme.useToken();
|
|
2427
2487
|
const presets = genPresets({
|
|
2428
2488
|
primary: generate(token.colorPrimary),
|
|
2429
2489
|
red,
|
|
2430
2490
|
green
|
|
2431
2491
|
});
|
|
2432
|
-
return /* @__PURE__ */
|
|
2433
|
-
|
|
2492
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
2493
|
+
import_antd10.ConfigProvider,
|
|
2434
2494
|
{
|
|
2435
2495
|
theme: {
|
|
2436
2496
|
token: {
|
|
@@ -2438,14 +2498,14 @@ function ColorPalettePickerBasic({
|
|
|
2438
2498
|
fontSize: 16
|
|
2439
2499
|
}
|
|
2440
2500
|
},
|
|
2441
|
-
children: /* @__PURE__ */
|
|
2442
|
-
/* @__PURE__ */
|
|
2443
|
-
/* @__PURE__ */
|
|
2501
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "container-input", children: [
|
|
2502
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { children: [
|
|
2503
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "body-1", children: label }),
|
|
2444
2504
|
" ",
|
|
2445
|
-
required && /* @__PURE__ */
|
|
2505
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2446
2506
|
] }),
|
|
2447
|
-
/* @__PURE__ */
|
|
2448
|
-
|
|
2507
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
2508
|
+
import_antd10.ColorPicker,
|
|
2449
2509
|
{
|
|
2450
2510
|
defaultFormat,
|
|
2451
2511
|
className: `body-1 w-full ${className ?? ""}`,
|
|
@@ -2457,9 +2517,9 @@ function ColorPalettePickerBasic({
|
|
|
2457
2517
|
showText: (color) => {
|
|
2458
2518
|
const hex = color.toHexString();
|
|
2459
2519
|
if (!value) {
|
|
2460
|
-
return /* @__PURE__ */
|
|
2520
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: placeholder });
|
|
2461
2521
|
}
|
|
2462
|
-
return /* @__PURE__ */
|
|
2522
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
|
|
2463
2523
|
"(",
|
|
2464
2524
|
hex,
|
|
2465
2525
|
")"
|
|
@@ -2469,15 +2529,15 @@ function ColorPalettePickerBasic({
|
|
|
2469
2529
|
onClear
|
|
2470
2530
|
}
|
|
2471
2531
|
),
|
|
2472
|
-
error && /* @__PURE__ */
|
|
2532
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2473
2533
|
] })
|
|
2474
2534
|
}
|
|
2475
2535
|
);
|
|
2476
2536
|
}
|
|
2477
2537
|
|
|
2478
2538
|
// src/Select/SelectField/SelectField.tsx
|
|
2479
|
-
|
|
2480
|
-
|
|
2539
|
+
var import_antd11 = require("antd");
|
|
2540
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
2481
2541
|
function SelectField({
|
|
2482
2542
|
value,
|
|
2483
2543
|
onChange,
|
|
@@ -2495,8 +2555,8 @@ function SelectField({
|
|
|
2495
2555
|
className,
|
|
2496
2556
|
onClear
|
|
2497
2557
|
}) {
|
|
2498
|
-
return /* @__PURE__ */
|
|
2499
|
-
|
|
2558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
2559
|
+
import_antd11.ConfigProvider,
|
|
2500
2560
|
{
|
|
2501
2561
|
theme: {
|
|
2502
2562
|
token: {
|
|
@@ -2504,14 +2564,14 @@ function SelectField({
|
|
|
2504
2564
|
fontSize: 16
|
|
2505
2565
|
}
|
|
2506
2566
|
},
|
|
2507
|
-
children: /* @__PURE__ */
|
|
2508
|
-
/* @__PURE__ */
|
|
2509
|
-
/* @__PURE__ */
|
|
2567
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "container-input", children: [
|
|
2568
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
|
|
2569
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "body-1", children: label }),
|
|
2510
2570
|
" ",
|
|
2511
|
-
required && /* @__PURE__ */
|
|
2571
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2512
2572
|
] }),
|
|
2513
|
-
/* @__PURE__ */
|
|
2514
|
-
Select,
|
|
2573
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
2574
|
+
import_antd11.Select,
|
|
2515
2575
|
{
|
|
2516
2576
|
showSearch: true,
|
|
2517
2577
|
value,
|
|
@@ -2525,7 +2585,7 @@ function SelectField({
|
|
|
2525
2585
|
options,
|
|
2526
2586
|
mode,
|
|
2527
2587
|
onSearch: handleSearch,
|
|
2528
|
-
prefix: prefix ? /* @__PURE__ */
|
|
2588
|
+
prefix: prefix ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
2529
2589
|
"span",
|
|
2530
2590
|
{
|
|
2531
2591
|
style: {
|
|
@@ -2542,15 +2602,15 @@ function SelectField({
|
|
|
2542
2602
|
onClear
|
|
2543
2603
|
}
|
|
2544
2604
|
),
|
|
2545
|
-
error && /* @__PURE__ */
|
|
2605
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2546
2606
|
] })
|
|
2547
2607
|
}
|
|
2548
2608
|
);
|
|
2549
2609
|
}
|
|
2550
2610
|
|
|
2551
2611
|
// src/Select/SelectFieldGroup/SelectFieldGroup.tsx
|
|
2552
|
-
|
|
2553
|
-
|
|
2612
|
+
var import_antd12 = require("antd");
|
|
2613
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
2554
2614
|
function SelectFieldGroup({
|
|
2555
2615
|
value,
|
|
2556
2616
|
onChange,
|
|
@@ -2567,22 +2627,22 @@ function SelectFieldGroup({
|
|
|
2567
2627
|
handleSearch,
|
|
2568
2628
|
className
|
|
2569
2629
|
}) {
|
|
2570
|
-
return /* @__PURE__ */
|
|
2571
|
-
|
|
2630
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
2631
|
+
import_antd12.ConfigProvider,
|
|
2572
2632
|
{
|
|
2573
2633
|
theme: {
|
|
2574
2634
|
token: {
|
|
2575
2635
|
fontFamily: "Kanit"
|
|
2576
2636
|
}
|
|
2577
2637
|
},
|
|
2578
|
-
children: /* @__PURE__ */
|
|
2579
|
-
/* @__PURE__ */
|
|
2580
|
-
/* @__PURE__ */
|
|
2638
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "container-input", children: [
|
|
2639
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { children: [
|
|
2640
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "body-1", children: label }),
|
|
2581
2641
|
" ",
|
|
2582
|
-
required && /* @__PURE__ */
|
|
2642
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2583
2643
|
] }),
|
|
2584
|
-
/* @__PURE__ */
|
|
2585
|
-
|
|
2644
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
2645
|
+
import_antd12.Select,
|
|
2586
2646
|
{
|
|
2587
2647
|
showSearch: true,
|
|
2588
2648
|
value,
|
|
@@ -2596,7 +2656,7 @@ function SelectFieldGroup({
|
|
|
2596
2656
|
options,
|
|
2597
2657
|
mode,
|
|
2598
2658
|
onSearch: handleSearch,
|
|
2599
|
-
prefix: prefix ? /* @__PURE__ */
|
|
2659
|
+
prefix: prefix ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
2600
2660
|
"span",
|
|
2601
2661
|
{
|
|
2602
2662
|
style: {
|
|
@@ -2612,14 +2672,14 @@ function SelectFieldGroup({
|
|
|
2612
2672
|
allowClear: true
|
|
2613
2673
|
}
|
|
2614
2674
|
),
|
|
2615
|
-
error && /* @__PURE__ */
|
|
2675
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2616
2676
|
] })
|
|
2617
2677
|
}
|
|
2618
2678
|
);
|
|
2619
2679
|
}
|
|
2620
2680
|
|
|
2621
2681
|
// src/Select/SelectFieldStatus/SelectFieldStatus.tsx
|
|
2622
|
-
|
|
2682
|
+
var import_antd13 = require("antd");
|
|
2623
2683
|
|
|
2624
2684
|
// src/Select/SelectFieldStatus/StatusMockup.ts
|
|
2625
2685
|
var status = [
|
|
@@ -2631,8 +2691,8 @@ var status = [
|
|
|
2631
2691
|
];
|
|
2632
2692
|
|
|
2633
2693
|
// src/Select/SelectFieldStatus/SelectFieldStatus.tsx
|
|
2634
|
-
|
|
2635
|
-
|
|
2694
|
+
var import_icons = require("@ant-design/icons");
|
|
2695
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
2636
2696
|
function SelectFieldStatus({
|
|
2637
2697
|
value,
|
|
2638
2698
|
onChange,
|
|
@@ -2645,8 +2705,8 @@ function SelectFieldStatus({
|
|
|
2645
2705
|
className
|
|
2646
2706
|
}) {
|
|
2647
2707
|
const selectedItem = status.find((s) => s.value === value);
|
|
2648
|
-
return /* @__PURE__ */
|
|
2649
|
-
|
|
2708
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
2709
|
+
import_antd13.ConfigProvider,
|
|
2650
2710
|
{
|
|
2651
2711
|
theme: {
|
|
2652
2712
|
components: {
|
|
@@ -2661,17 +2721,17 @@ function SelectFieldStatus({
|
|
|
2661
2721
|
fontFamily: "Kanit"
|
|
2662
2722
|
}
|
|
2663
2723
|
},
|
|
2664
|
-
children: /* @__PURE__ */
|
|
2665
|
-
/* @__PURE__ */
|
|
2666
|
-
/* @__PURE__ */
|
|
2724
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "container-input", children: [
|
|
2725
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { children: [
|
|
2726
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "body-1", children: label }),
|
|
2667
2727
|
" ",
|
|
2668
|
-
required && /* @__PURE__ */
|
|
2728
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2669
2729
|
] }),
|
|
2670
|
-
/* @__PURE__ */
|
|
2671
|
-
|
|
2730
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
2731
|
+
import_antd13.Select,
|
|
2672
2732
|
{
|
|
2673
2733
|
disabled,
|
|
2674
|
-
suffixIcon: /* @__PURE__ */
|
|
2734
|
+
suffixIcon: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_icons.DownOutlined, { style: { color: value ? "#fff" : "#D9D9D9" } }),
|
|
2675
2735
|
value,
|
|
2676
2736
|
onChange,
|
|
2677
2737
|
className: `body-3 custom-select flex justify-center w-full ${className ?? ""}`,
|
|
@@ -2682,14 +2742,14 @@ function SelectFieldStatus({
|
|
|
2682
2742
|
showSearch: true
|
|
2683
2743
|
}
|
|
2684
2744
|
),
|
|
2685
|
-
error && /* @__PURE__ */
|
|
2745
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2686
2746
|
] })
|
|
2687
2747
|
}
|
|
2688
2748
|
);
|
|
2689
2749
|
}
|
|
2690
2750
|
|
|
2691
2751
|
// src/Select/SelectFieldStatusReport/SelectFieldStatusReport.tsx
|
|
2692
|
-
|
|
2752
|
+
var import_antd14 = require("antd");
|
|
2693
2753
|
|
|
2694
2754
|
// src/Select/SelectFieldStatusReport/StatusReportMockup.ts
|
|
2695
2755
|
var status2 = [
|
|
@@ -2698,8 +2758,8 @@ var status2 = [
|
|
|
2698
2758
|
];
|
|
2699
2759
|
|
|
2700
2760
|
// src/Select/SelectFieldStatusReport/SelectFieldStatusReport.tsx
|
|
2701
|
-
|
|
2702
|
-
|
|
2761
|
+
var import_icons2 = require("@ant-design/icons");
|
|
2762
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
2703
2763
|
function SelectFieldStatusReport({
|
|
2704
2764
|
value,
|
|
2705
2765
|
onChange,
|
|
@@ -2712,8 +2772,8 @@ function SelectFieldStatusReport({
|
|
|
2712
2772
|
options
|
|
2713
2773
|
}) {
|
|
2714
2774
|
const selectedItem = status2.find((s) => s.value === value);
|
|
2715
|
-
return /* @__PURE__ */
|
|
2716
|
-
|
|
2775
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
2776
|
+
import_antd14.ConfigProvider,
|
|
2717
2777
|
{
|
|
2718
2778
|
theme: {
|
|
2719
2779
|
components: {
|
|
@@ -2728,17 +2788,17 @@ function SelectFieldStatusReport({
|
|
|
2728
2788
|
fontFamily: "Kanit"
|
|
2729
2789
|
}
|
|
2730
2790
|
},
|
|
2731
|
-
children: /* @__PURE__ */
|
|
2732
|
-
/* @__PURE__ */
|
|
2733
|
-
/* @__PURE__ */
|
|
2791
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "container-input", children: [
|
|
2792
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { children: [
|
|
2793
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "body-1", children: label }),
|
|
2734
2794
|
" ",
|
|
2735
|
-
required && /* @__PURE__ */
|
|
2795
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2736
2796
|
] }),
|
|
2737
|
-
/* @__PURE__ */
|
|
2738
|
-
|
|
2797
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
2798
|
+
import_antd14.Select,
|
|
2739
2799
|
{
|
|
2740
2800
|
disabled,
|
|
2741
|
-
suffixIcon: /* @__PURE__ */
|
|
2801
|
+
suffixIcon: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_icons2.DownOutlined, { style: { color: value ? "#fff" : "#D9D9D9" } }),
|
|
2742
2802
|
value,
|
|
2743
2803
|
onChange,
|
|
2744
2804
|
className: `body-3 custom-select flex justify-center w-full ${className ?? ""}`,
|
|
@@ -2749,16 +2809,16 @@ function SelectFieldStatusReport({
|
|
|
2749
2809
|
showSearch: true
|
|
2750
2810
|
}
|
|
2751
2811
|
),
|
|
2752
|
-
error && /* @__PURE__ */
|
|
2812
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2753
2813
|
] })
|
|
2754
2814
|
}
|
|
2755
2815
|
);
|
|
2756
2816
|
}
|
|
2757
2817
|
|
|
2758
2818
|
// src/Select/SelectFieldTag/SelectFieldTag.tsx
|
|
2759
|
-
|
|
2760
|
-
|
|
2761
|
-
|
|
2819
|
+
var import_antd15 = require("antd");
|
|
2820
|
+
var import_react8 = require("react");
|
|
2821
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
2762
2822
|
function SelectFieldTag({
|
|
2763
2823
|
label,
|
|
2764
2824
|
required,
|
|
@@ -2770,10 +2830,10 @@ function SelectFieldTag({
|
|
|
2770
2830
|
onChange,
|
|
2771
2831
|
onClear
|
|
2772
2832
|
}) {
|
|
2773
|
-
const [internalValue, setInternalValue] =
|
|
2833
|
+
const [internalValue, setInternalValue] = (0, import_react8.useState)([]);
|
|
2774
2834
|
const isControlled = controlledValue !== void 0;
|
|
2775
2835
|
const value = isControlled ? controlledValue : internalValue;
|
|
2776
|
-
const [searchWord, setSearchWord] =
|
|
2836
|
+
const [searchWord, setSearchWord] = (0, import_react8.useState)("");
|
|
2777
2837
|
const handleChange = (val) => {
|
|
2778
2838
|
const trimValue = val.map((v) => v.trim());
|
|
2779
2839
|
const filtered = trimValue.filter((v) => v.trim() !== "");
|
|
@@ -2791,22 +2851,22 @@ function SelectFieldTag({
|
|
|
2791
2851
|
}
|
|
2792
2852
|
onChange?.([]);
|
|
2793
2853
|
};
|
|
2794
|
-
return /* @__PURE__ */
|
|
2795
|
-
|
|
2854
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
2855
|
+
import_antd15.ConfigProvider,
|
|
2796
2856
|
{
|
|
2797
2857
|
theme: {
|
|
2798
2858
|
token: {
|
|
2799
2859
|
fontFamily: "Kanit"
|
|
2800
2860
|
}
|
|
2801
2861
|
},
|
|
2802
|
-
children: /* @__PURE__ */
|
|
2803
|
-
/* @__PURE__ */
|
|
2804
|
-
/* @__PURE__ */
|
|
2862
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "container-input", children: [
|
|
2863
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { children: [
|
|
2864
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "body-1", children: label }),
|
|
2805
2865
|
" ",
|
|
2806
|
-
required && /* @__PURE__ */
|
|
2866
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2807
2867
|
] }),
|
|
2808
|
-
/* @__PURE__ */
|
|
2809
|
-
|
|
2868
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
2869
|
+
import_antd15.Select,
|
|
2810
2870
|
{
|
|
2811
2871
|
mode: "tags",
|
|
2812
2872
|
className: `body-1 flex justify-center w-full ${className ?? ""}`,
|
|
@@ -2824,17 +2884,17 @@ function SelectFieldTag({
|
|
|
2824
2884
|
onClear
|
|
2825
2885
|
}
|
|
2826
2886
|
),
|
|
2827
|
-
error && /* @__PURE__ */
|
|
2887
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-red-500 caption-1", children: error })
|
|
2828
2888
|
] })
|
|
2829
2889
|
}
|
|
2830
2890
|
);
|
|
2831
2891
|
}
|
|
2832
2892
|
|
|
2833
2893
|
// src/Select/SelectCustom/SelectCustom.tsx
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2894
|
+
var import_icons_react8 = require("@tabler/icons-react");
|
|
2895
|
+
var import_antd16 = require("antd");
|
|
2896
|
+
var import_react9 = require("react");
|
|
2897
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
2838
2898
|
function SelectCustom({
|
|
2839
2899
|
label = "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E42\u0E04\u0E23\u0E07\u0E01\u0E32\u0E23",
|
|
2840
2900
|
placeholder = "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E40\u0E25\u0E37\u0E2D\u0E01",
|
|
@@ -2844,8 +2904,8 @@ function SelectCustom({
|
|
|
2844
2904
|
error,
|
|
2845
2905
|
onClear
|
|
2846
2906
|
}) {
|
|
2847
|
-
const [value, setValue] =
|
|
2848
|
-
const [valueList, setValueList] =
|
|
2907
|
+
const [value, setValue] = (0, import_react9.useState)([]);
|
|
2908
|
+
const [valueList, setValueList] = (0, import_react9.useState)([]);
|
|
2849
2909
|
const handleChange = (selectedValues) => {
|
|
2850
2910
|
const newValues = selectedValues.filter((v) => !valueList.includes(v));
|
|
2851
2911
|
setValueList((prev) => {
|
|
@@ -2863,8 +2923,8 @@ function SelectCustom({
|
|
|
2863
2923
|
});
|
|
2864
2924
|
};
|
|
2865
2925
|
const filteredOptions = options.filter((opt) => !valueList.includes(opt.value)).map((opt) => ({ value: opt.value, label: opt.label }));
|
|
2866
|
-
return /* @__PURE__ */
|
|
2867
|
-
|
|
2926
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2927
|
+
import_antd16.ConfigProvider,
|
|
2868
2928
|
{
|
|
2869
2929
|
theme: {
|
|
2870
2930
|
token: {
|
|
@@ -2872,14 +2932,14 @@ function SelectCustom({
|
|
|
2872
2932
|
fontSize: 16
|
|
2873
2933
|
}
|
|
2874
2934
|
},
|
|
2875
|
-
children: /* @__PURE__ */
|
|
2876
|
-
/* @__PURE__ */
|
|
2877
|
-
/* @__PURE__ */
|
|
2935
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "container-input", children: [
|
|
2936
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { children: [
|
|
2937
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "body-1", children: label }),
|
|
2878
2938
|
" ",
|
|
2879
|
-
required && /* @__PURE__ */
|
|
2939
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-red-500", children: "*" })
|
|
2880
2940
|
] }),
|
|
2881
|
-
/* @__PURE__ */
|
|
2882
|
-
|
|
2941
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2942
|
+
import_antd16.Select,
|
|
2883
2943
|
{
|
|
2884
2944
|
value,
|
|
2885
2945
|
onChange: handleChange,
|
|
@@ -2889,16 +2949,16 @@ function SelectCustom({
|
|
|
2889
2949
|
onClear
|
|
2890
2950
|
}
|
|
2891
2951
|
),
|
|
2892
|
-
error && /* @__PURE__ */
|
|
2893
|
-
/* @__PURE__ */
|
|
2894
|
-
/* @__PURE__ */
|
|
2895
|
-
/* @__PURE__ */
|
|
2952
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-red-500 caption-1", children: error }),
|
|
2953
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "w-full p-[2px] overflow-y-auto", children: valueList.map((v, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex justify-between items-center py-[2px] body-1", children: [
|
|
2954
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-row gap-[8px]", children: [
|
|
2955
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("p", { children: [
|
|
2896
2956
|
index + 1,
|
|
2897
2957
|
"."
|
|
2898
2958
|
] }),
|
|
2899
|
-
/* @__PURE__ */
|
|
2959
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { children: v })
|
|
2900
2960
|
] }),
|
|
2901
|
-
/* @__PURE__ */
|
|
2961
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons_react8.IconTrash, { className: "cursor-pointer", onClick: () => handleDelete(v) })
|
|
2902
2962
|
] }, index)) })
|
|
2903
2963
|
] })
|
|
2904
2964
|
}
|
|
@@ -2906,8 +2966,8 @@ function SelectCustom({
|
|
|
2906
2966
|
}
|
|
2907
2967
|
|
|
2908
2968
|
// src/SortFilter/SortFilter.tsx
|
|
2909
|
-
|
|
2910
|
-
|
|
2969
|
+
var import_antd17 = require("antd");
|
|
2970
|
+
var import_icons3 = require("@ant-design/icons");
|
|
2911
2971
|
|
|
2912
2972
|
// src/SortFilter/DataMockSortFilter.ts
|
|
2913
2973
|
var years = [
|
|
@@ -2937,9 +2997,9 @@ var quarters = [
|
|
|
2937
2997
|
];
|
|
2938
2998
|
|
|
2939
2999
|
// src/SortFilter/SortFilter.tsx
|
|
2940
|
-
|
|
2941
|
-
|
|
2942
|
-
|
|
3000
|
+
var import_react10 = require("react");
|
|
3001
|
+
var import_icons_react9 = require("@tabler/icons-react");
|
|
3002
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
2943
3003
|
function SortFilter({
|
|
2944
3004
|
showYear = true,
|
|
2945
3005
|
showQuarter = true,
|
|
@@ -2947,23 +3007,23 @@ function SortFilter({
|
|
|
2947
3007
|
onSortClick,
|
|
2948
3008
|
onFilterClick
|
|
2949
3009
|
}) {
|
|
2950
|
-
const [yearValue, setYearValue] =
|
|
2951
|
-
const [monthValue, setMonthValue] =
|
|
2952
|
-
const [quarterValue, setQuartersValue] =
|
|
2953
|
-
return /* @__PURE__ */
|
|
2954
|
-
|
|
3010
|
+
const [yearValue, setYearValue] = (0, import_react10.useState)();
|
|
3011
|
+
const [monthValue, setMonthValue] = (0, import_react10.useState)();
|
|
3012
|
+
const [quarterValue, setQuartersValue] = (0, import_react10.useState)();
|
|
3013
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3014
|
+
import_antd17.ConfigProvider,
|
|
2955
3015
|
{
|
|
2956
3016
|
theme: {
|
|
2957
3017
|
token: {
|
|
2958
3018
|
fontFamily: "Kanit"
|
|
2959
3019
|
}
|
|
2960
3020
|
},
|
|
2961
|
-
children: /* @__PURE__ */
|
|
2962
|
-
/* @__PURE__ */
|
|
2963
|
-
showYear && /* @__PURE__ */
|
|
3021
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "w-full flex items-center justify-between", children: [
|
|
3022
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "w-full flex gap-[10px]", children: [
|
|
3023
|
+
showYear && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-[200px]", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2964
3024
|
SelectField,
|
|
2965
3025
|
{
|
|
2966
|
-
prefix: /* @__PURE__ */
|
|
3026
|
+
prefix: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_icons3.CalendarOutlined, {}),
|
|
2967
3027
|
onChange: setYearValue,
|
|
2968
3028
|
options: years.map((s) => ({
|
|
2969
3029
|
value: s.value,
|
|
@@ -2973,10 +3033,10 @@ function SortFilter({
|
|
|
2973
3033
|
value: yearValue
|
|
2974
3034
|
}
|
|
2975
3035
|
) }),
|
|
2976
|
-
showMonth && /* @__PURE__ */
|
|
3036
|
+
showMonth && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-[200px]", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2977
3037
|
SelectField,
|
|
2978
3038
|
{
|
|
2979
|
-
prefix: /* @__PURE__ */
|
|
3039
|
+
prefix: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_icons3.CalendarOutlined, {}),
|
|
2980
3040
|
onChange: setMonthValue,
|
|
2981
3041
|
options: months.map((s) => ({
|
|
2982
3042
|
value: s.value,
|
|
@@ -2986,10 +3046,10 @@ function SortFilter({
|
|
|
2986
3046
|
placeholder: "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E40\u0E14\u0E37\u0E2D\u0E19"
|
|
2987
3047
|
}
|
|
2988
3048
|
) }),
|
|
2989
|
-
showQuarter && /* @__PURE__ */
|
|
3049
|
+
showQuarter && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-[200px]", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2990
3050
|
SelectField,
|
|
2991
3051
|
{
|
|
2992
|
-
prefix: /* @__PURE__ */
|
|
3052
|
+
prefix: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_icons3.CalendarOutlined, {}),
|
|
2993
3053
|
onChange: setQuartersValue,
|
|
2994
3054
|
options: quarters.map((s) => ({
|
|
2995
3055
|
value: s.value,
|
|
@@ -3000,17 +3060,17 @@ function SortFilter({
|
|
|
3000
3060
|
}
|
|
3001
3061
|
) })
|
|
3002
3062
|
] }),
|
|
3003
|
-
/* @__PURE__ */
|
|
3004
|
-
/* @__PURE__ */
|
|
3005
|
-
|
|
3063
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex gap-[10px]", children: [
|
|
3064
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3065
|
+
import_icons_react9.IconSortDescending,
|
|
3006
3066
|
{
|
|
3007
3067
|
size: 24,
|
|
3008
3068
|
className: "cursor-pointer",
|
|
3009
3069
|
onClick: onSortClick
|
|
3010
3070
|
}
|
|
3011
3071
|
),
|
|
3012
|
-
/* @__PURE__ */
|
|
3013
|
-
IconFilter,
|
|
3072
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
3073
|
+
import_icons_react9.IconFilter,
|
|
3014
3074
|
{
|
|
3015
3075
|
size: 24,
|
|
3016
3076
|
className: "cursor-pointer",
|
|
@@ -3024,9 +3084,9 @@ function SortFilter({
|
|
|
3024
3084
|
}
|
|
3025
3085
|
|
|
3026
3086
|
// src/Upload/FileUploader/FileUploader.tsx
|
|
3027
|
-
|
|
3028
|
-
|
|
3029
|
-
|
|
3087
|
+
var import_icons_react10 = require("@tabler/icons-react");
|
|
3088
|
+
var import_react11 = require("react");
|
|
3089
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
3030
3090
|
function FileUploader({
|
|
3031
3091
|
onUpload,
|
|
3032
3092
|
onError,
|
|
@@ -3038,10 +3098,10 @@ function FileUploader({
|
|
|
3038
3098
|
description,
|
|
3039
3099
|
label
|
|
3040
3100
|
}) {
|
|
3041
|
-
const [fileList, setFileList] =
|
|
3042
|
-
const [uploading, setUploading] =
|
|
3043
|
-
const [dragActive, setDragActive] =
|
|
3044
|
-
const inputRef =
|
|
3101
|
+
const [fileList, setFileList] = (0, import_react11.useState)([]);
|
|
3102
|
+
const [uploading, setUploading] = (0, import_react11.useState)(false);
|
|
3103
|
+
const [dragActive, setDragActive] = (0, import_react11.useState)(false);
|
|
3104
|
+
const inputRef = (0, import_react11.useRef)(null);
|
|
3045
3105
|
const validateFile = (file) => {
|
|
3046
3106
|
if (accept && !accept.includes(file.type)) {
|
|
3047
3107
|
onError?.(`Invalid file type. file: ${file.name}`);
|
|
@@ -3097,10 +3157,10 @@ function FileUploader({
|
|
|
3097
3157
|
}
|
|
3098
3158
|
if (inputRef.current) inputRef.current.value = "";
|
|
3099
3159
|
};
|
|
3100
|
-
return /* @__PURE__ */
|
|
3101
|
-
label && /* @__PURE__ */
|
|
3102
|
-
/* @__PURE__ */
|
|
3103
|
-
mode === "upload" ? /* @__PURE__ */
|
|
3160
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "w-full", children: [
|
|
3161
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "body-1", children: label }),
|
|
3162
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
|
|
3163
|
+
mode === "upload" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3104
3164
|
"button",
|
|
3105
3165
|
{
|
|
3106
3166
|
type: "button",
|
|
@@ -3108,15 +3168,15 @@ function FileUploader({
|
|
|
3108
3168
|
className: `h-[34px] flex justify-center items-center gap-2 w-full rounded-[2px] border border-gray-200 body-1
|
|
3109
3169
|
${disabled ? "cursor-not-allowed text-gray-400 bg-gray-100" : "cursor-pointer hover:text-primary-400 hover:border-primary-200 duration-300"}`,
|
|
3110
3170
|
disabled: disabled ? disabled : uploading,
|
|
3111
|
-
children: uploading ? /* @__PURE__ */
|
|
3112
|
-
/* @__PURE__ */
|
|
3171
|
+
children: uploading ? /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
|
|
3172
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Loader, { size: 15 }),
|
|
3113
3173
|
" \u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E31\u0E1B\u0E42\u0E2B\u0E25\u0E14"
|
|
3114
|
-
] }) : /* @__PURE__ */
|
|
3115
|
-
/* @__PURE__ */
|
|
3174
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
|
|
3175
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_icons_react10.IconUpload, { size: 15, className: "text-gray-400" }),
|
|
3116
3176
|
" \u0E41\u0E19\u0E1A\u0E44\u0E1F\u0E25\u0E4C"
|
|
3117
3177
|
] })
|
|
3118
3178
|
}
|
|
3119
|
-
) : /* @__PURE__ */
|
|
3179
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3120
3180
|
"div",
|
|
3121
3181
|
{
|
|
3122
3182
|
className: `min-w-[400px] min-h-[120px] flex justify-center items-center border-2 border-dashed rounded-md p-4 transition-colors body-1
|
|
@@ -3130,17 +3190,17 @@ function FileUploader({
|
|
|
3130
3190
|
},
|
|
3131
3191
|
onDragLeave: () => setDragActive(false),
|
|
3132
3192
|
onDrop: handleDrop,
|
|
3133
|
-
children: uploading ? /* @__PURE__ */
|
|
3134
|
-
/* @__PURE__ */
|
|
3193
|
+
children: uploading ? /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex justify-center items-center gap-2", children: [
|
|
3194
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Loader, { size: 15 }),
|
|
3135
3195
|
" \u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E31\u0E1B\u0E42\u0E2B\u0E25\u0E14"
|
|
3136
|
-
] }) : /* @__PURE__ */
|
|
3137
|
-
/* @__PURE__ */
|
|
3138
|
-
/* @__PURE__ */
|
|
3139
|
-
/* @__PURE__ */
|
|
3196
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col items-center gap-2", children: [
|
|
3197
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_icons_react10.IconUpload, { size: 20 }),
|
|
3198
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "body-1", children: "\u0E04\u0E25\u0E34\u0E01\u0E2B\u0E23\u0E37\u0E2D\u0E25\u0E32\u0E01\u0E44\u0E1F\u0E25\u0E4C\u0E21\u0E32\u0E17\u0E35\u0E48\u0E1A\u0E23\u0E34\u0E40\u0E27\u0E13\u0E19\u0E35\u0E49\u0E40\u0E1E\u0E37\u0E48\u0E2D\u0E2D\u0E31\u0E1B\u0E42\u0E2B\u0E25\u0E14" }),
|
|
3199
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-gray-400 body-3", children: "\u0E23\u0E2D\u0E07\u0E23\u0E31\u0E1A\u0E01\u0E32\u0E23\u0E2D\u0E31\u0E1B\u0E42\u0E2B\u0E25\u0E14\u0E41\u0E1A\u0E1A\u0E40\u0E14\u0E35\u0E48\u0E22\u0E27\u0E2B\u0E23\u0E37\u0E2D\u0E2B\u0E25\u0E32\u0E22\u0E44\u0E1F\u0E25\u0E4C" })
|
|
3140
3200
|
] })
|
|
3141
3201
|
}
|
|
3142
3202
|
),
|
|
3143
|
-
/* @__PURE__ */
|
|
3203
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3144
3204
|
"input",
|
|
3145
3205
|
{
|
|
3146
3206
|
type: "file",
|
|
@@ -3153,14 +3213,14 @@ function FileUploader({
|
|
|
3153
3213
|
}
|
|
3154
3214
|
)
|
|
3155
3215
|
] }),
|
|
3156
|
-
description && /* @__PURE__ */
|
|
3157
|
-
/* @__PURE__ */
|
|
3158
|
-
/* @__PURE__ */
|
|
3159
|
-
/* @__PURE__ */
|
|
3160
|
-
/* @__PURE__ */
|
|
3216
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "text-gray-400 body-4", children: description }),
|
|
3217
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "mt-[8px]", children: fileList.length !== 0 && fileList.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex items-center gap-2 rounded-[4px] px-[8px] py-[4px] body-1", children: [
|
|
3218
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex items-center gap-2 w-[75%] overflow-hidden", children: [
|
|
3219
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "w-[15px] h-[15px]", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_icons_react10.IconPaperclip, { size: 15 }) }),
|
|
3220
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "truncate", children: file.name })
|
|
3161
3221
|
] }),
|
|
3162
|
-
/* @__PURE__ */
|
|
3163
|
-
|
|
3222
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3223
|
+
import_icons_react10.IconTrash,
|
|
3164
3224
|
{
|
|
3165
3225
|
size: 20,
|
|
3166
3226
|
className: "ml-auto hover:text-red-500 cursor-pointer",
|
|
@@ -3193,9 +3253,9 @@ function messageLoading(content, duration) {
|
|
|
3193
3253
|
}
|
|
3194
3254
|
|
|
3195
3255
|
// src/Breadcrumb/Breadcrumb.tsx
|
|
3196
|
-
|
|
3197
|
-
|
|
3198
|
-
|
|
3256
|
+
var import_antd18 = require("antd");
|
|
3257
|
+
var import_antd19 = require("antd");
|
|
3258
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
3199
3259
|
function Breadcrumbs({
|
|
3200
3260
|
items,
|
|
3201
3261
|
separator,
|
|
@@ -3203,16 +3263,16 @@ function Breadcrumbs({
|
|
|
3203
3263
|
classname,
|
|
3204
3264
|
params
|
|
3205
3265
|
}) {
|
|
3206
|
-
return /* @__PURE__ */
|
|
3207
|
-
|
|
3266
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3267
|
+
import_antd18.ConfigProvider,
|
|
3208
3268
|
{
|
|
3209
3269
|
theme: {
|
|
3210
3270
|
token: {
|
|
3211
3271
|
fontFamily: "Kanit"
|
|
3212
3272
|
}
|
|
3213
3273
|
},
|
|
3214
|
-
children: /* @__PURE__ */
|
|
3215
|
-
Breadcrumb,
|
|
3274
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3275
|
+
import_antd19.Breadcrumb,
|
|
3216
3276
|
{
|
|
3217
3277
|
items,
|
|
3218
3278
|
separator,
|
|
@@ -3226,8 +3286,8 @@ function Breadcrumbs({
|
|
|
3226
3286
|
}
|
|
3227
3287
|
|
|
3228
3288
|
// src/HeadingPage/HeadingPage.tsx
|
|
3229
|
-
|
|
3230
|
-
|
|
3289
|
+
var import_antd20 = require("antd");
|
|
3290
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
3231
3291
|
function HeadingPage({ Heading }) {
|
|
3232
3292
|
const today = (/* @__PURE__ */ new Date()).toLocaleDateString("th-TH", {
|
|
3233
3293
|
weekday: "long",
|
|
@@ -3235,17 +3295,17 @@ function HeadingPage({ Heading }) {
|
|
|
3235
3295
|
month: "long",
|
|
3236
3296
|
year: "numeric"
|
|
3237
3297
|
});
|
|
3238
|
-
return /* @__PURE__ */
|
|
3239
|
-
|
|
3298
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3299
|
+
import_antd20.ConfigProvider,
|
|
3240
3300
|
{
|
|
3241
3301
|
theme: {
|
|
3242
3302
|
token: {
|
|
3243
3303
|
fontFamily: "Kanit"
|
|
3244
3304
|
}
|
|
3245
3305
|
},
|
|
3246
|
-
children: /* @__PURE__ */
|
|
3247
|
-
/* @__PURE__ */
|
|
3248
|
-
/* @__PURE__ */
|
|
3306
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-[10px] px-[20px] py-[10px]", children: [
|
|
3307
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "headline-5", children: Heading }),
|
|
3308
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("p", { className: "body-1", children: [
|
|
3249
3309
|
" \u0E27\u0E31\u0E19\u0E19\u0E35\u0E49 ",
|
|
3250
3310
|
today
|
|
3251
3311
|
] })
|
|
@@ -3255,9 +3315,9 @@ function HeadingPage({ Heading }) {
|
|
|
3255
3315
|
}
|
|
3256
3316
|
|
|
3257
3317
|
// src/Progress/ProgressBar.tsx
|
|
3258
|
-
|
|
3259
|
-
|
|
3260
|
-
|
|
3318
|
+
var import_antd21 = require("antd");
|
|
3319
|
+
var import_react12 = require("react");
|
|
3320
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
3261
3321
|
function ProgressBar({
|
|
3262
3322
|
percent = 0,
|
|
3263
3323
|
size = "default",
|
|
@@ -3270,8 +3330,8 @@ function ProgressBar({
|
|
|
3270
3330
|
steps,
|
|
3271
3331
|
isCheckPoints
|
|
3272
3332
|
}) {
|
|
3273
|
-
const [barWidth, setBarWidth] =
|
|
3274
|
-
const progressRef =
|
|
3333
|
+
const [barWidth, setBarWidth] = (0, import_react12.useState)(0);
|
|
3334
|
+
const progressRef = (0, import_react12.useRef)(null);
|
|
3275
3335
|
let strokeColor = "--color-green-500";
|
|
3276
3336
|
const defaultStrokeWidth = type === "circle" ? 13 : strokeWidth ?? 8;
|
|
3277
3337
|
const defaultSize = type === "circle" ? 43 : size;
|
|
@@ -3279,7 +3339,7 @@ function ProgressBar({
|
|
|
3279
3339
|
const minCheckpoint = Math.min(...checkpoints);
|
|
3280
3340
|
strokeColor = percent >= minCheckpoint ? "var(--color-green-500)" : "var(--color-red-500)";
|
|
3281
3341
|
}
|
|
3282
|
-
|
|
3342
|
+
(0, import_react12.useEffect)(() => {
|
|
3283
3343
|
const inner = progressRef.current?.querySelector(".ant-progress-inner");
|
|
3284
3344
|
if (!inner) return;
|
|
3285
3345
|
const observer = new ResizeObserver(() => {
|
|
@@ -3288,17 +3348,17 @@ function ProgressBar({
|
|
|
3288
3348
|
observer.observe(inner);
|
|
3289
3349
|
return () => observer.disconnect();
|
|
3290
3350
|
}, []);
|
|
3291
|
-
return /* @__PURE__ */
|
|
3292
|
-
|
|
3351
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
3352
|
+
import_antd21.ConfigProvider,
|
|
3293
3353
|
{
|
|
3294
3354
|
theme: {
|
|
3295
3355
|
token: {
|
|
3296
3356
|
fontFamily: "Kanit"
|
|
3297
3357
|
}
|
|
3298
3358
|
},
|
|
3299
|
-
children: /* @__PURE__ */
|
|
3300
|
-
/* @__PURE__ */
|
|
3301
|
-
Progress,
|
|
3359
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "relative w-full", ref: progressRef, children: [
|
|
3360
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
3361
|
+
import_antd21.Progress,
|
|
3302
3362
|
{
|
|
3303
3363
|
className: "w-full",
|
|
3304
3364
|
percent,
|
|
@@ -3313,7 +3373,7 @@ function ProgressBar({
|
|
|
3313
3373
|
strokeColor
|
|
3314
3374
|
}
|
|
3315
3375
|
),
|
|
3316
|
-
barWidth > 0 && isCheckPoints && type !== "circle" && checkpoints.map((cp) => /* @__PURE__ */
|
|
3376
|
+
barWidth > 0 && isCheckPoints && type !== "circle" && checkpoints.map((cp) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
3317
3377
|
"div",
|
|
3318
3378
|
{
|
|
3319
3379
|
className: "checkpoint absolute top-0",
|
|
@@ -3335,25 +3395,25 @@ function ProgressBar({
|
|
|
3335
3395
|
}
|
|
3336
3396
|
|
|
3337
3397
|
// src/KpiSection/KpiSection.tsx
|
|
3338
|
-
|
|
3339
|
-
|
|
3398
|
+
var import_antd22 = require("antd");
|
|
3399
|
+
var import_react14 = require("react");
|
|
3340
3400
|
|
|
3341
3401
|
// src/KpiSection/hooks/useGetKpiSection.ts
|
|
3342
|
-
|
|
3343
|
-
|
|
3402
|
+
var import_react13 = require("react");
|
|
3403
|
+
var import_cuid = __toESM(require("cuid"), 1);
|
|
3344
3404
|
function useGetKpiSection() {
|
|
3345
|
-
const [nameKpi, setNameKpi] =
|
|
3346
|
-
const [kpiValue, setKpiValue] =
|
|
3347
|
-
const [unitValue, setUnitValue] =
|
|
3348
|
-
const [kpiList, setKpiList] =
|
|
3349
|
-
const [editingBackup, setEditingBackup] =
|
|
3350
|
-
const [selected, setSelected] =
|
|
3351
|
-
const [errors, setErrors] =
|
|
3405
|
+
const [nameKpi, setNameKpi] = (0, import_react13.useState)("");
|
|
3406
|
+
const [kpiValue, setKpiValue] = (0, import_react13.useState)("");
|
|
3407
|
+
const [unitValue, setUnitValue] = (0, import_react13.useState)("");
|
|
3408
|
+
const [kpiList, setKpiList] = (0, import_react13.useState)([]);
|
|
3409
|
+
const [editingBackup, setEditingBackup] = (0, import_react13.useState)({});
|
|
3410
|
+
const [selected, setSelected] = (0, import_react13.useState)("2");
|
|
3411
|
+
const [errors, setErrors] = (0, import_react13.useState)({
|
|
3352
3412
|
nameKpi: "",
|
|
3353
3413
|
kpiValue: "",
|
|
3354
3414
|
unitValue: ""
|
|
3355
3415
|
});
|
|
3356
|
-
const [itemErrors, setItemErrors] =
|
|
3416
|
+
const [itemErrors, setItemErrors] = (0, import_react13.useState)({});
|
|
3357
3417
|
const options = [
|
|
3358
3418
|
{ value: "1", label: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" },
|
|
3359
3419
|
{ value: "2", label: "\u0E15\u0E31\u0E27\u0E40\u0E25\u0E02" }
|
|
@@ -3378,7 +3438,7 @@ function useGetKpiSection() {
|
|
|
3378
3438
|
setErrors(newErrors);
|
|
3379
3439
|
if (hasError) return;
|
|
3380
3440
|
const newKpi = {
|
|
3381
|
-
id:
|
|
3441
|
+
id: (0, import_cuid.default)(),
|
|
3382
3442
|
name: nameKpi,
|
|
3383
3443
|
value: kpiValue,
|
|
3384
3444
|
unit: unitValue,
|
|
@@ -3485,8 +3545,8 @@ function useGetKpiSection() {
|
|
|
3485
3545
|
}
|
|
3486
3546
|
|
|
3487
3547
|
// src/KpiSection/KpiSection.tsx
|
|
3488
|
-
|
|
3489
|
-
|
|
3548
|
+
var import_icons_react11 = require("@tabler/icons-react");
|
|
3549
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
3490
3550
|
function KpiSection({ type, onChangeKpiList }) {
|
|
3491
3551
|
const {
|
|
3492
3552
|
handleAddKpi,
|
|
@@ -3506,18 +3566,18 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3506
3566
|
itemErrors,
|
|
3507
3567
|
setItemErrors
|
|
3508
3568
|
} = useGetKpiSection();
|
|
3509
|
-
const [messageApi2, messageContainer] = message.useMessage();
|
|
3510
|
-
const [hasShownError, setHasShownError] =
|
|
3511
|
-
|
|
3569
|
+
const [messageApi2, messageContainer] = import_antd22.message.useMessage();
|
|
3570
|
+
const [hasShownError, setHasShownError] = (0, import_react14.useState)(false);
|
|
3571
|
+
(0, import_react14.useEffect)(() => {
|
|
3512
3572
|
setMessageApi(messageApi2);
|
|
3513
3573
|
}, [messageApi2]);
|
|
3514
|
-
|
|
3574
|
+
(0, import_react14.useEffect)(() => {
|
|
3515
3575
|
if (onChangeKpiList) {
|
|
3516
3576
|
onChangeKpiList(kpiList);
|
|
3517
3577
|
}
|
|
3518
3578
|
}, [kpiList]);
|
|
3519
|
-
return /* @__PURE__ */
|
|
3520
|
-
|
|
3579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3580
|
+
import_antd22.ConfigProvider,
|
|
3521
3581
|
{
|
|
3522
3582
|
theme: {
|
|
3523
3583
|
token: {
|
|
@@ -3525,11 +3585,11 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3525
3585
|
fontSize: 16
|
|
3526
3586
|
}
|
|
3527
3587
|
},
|
|
3528
|
-
children: /* @__PURE__ */
|
|
3588
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "container-input", children: [
|
|
3529
3589
|
messageContainer,
|
|
3530
|
-
type === "number" && /* @__PURE__ */
|
|
3531
|
-
/* @__PURE__ */
|
|
3532
|
-
/* @__PURE__ */
|
|
3590
|
+
type === "number" && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "space-y-4", children: [
|
|
3591
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "grid grid-cols-[1fr_200px_200px_50px] w-full gap-[24px] items-start", children: [
|
|
3592
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3533
3593
|
InputField,
|
|
3534
3594
|
{
|
|
3535
3595
|
value: nameKpi,
|
|
@@ -3541,7 +3601,7 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3541
3601
|
error: errors.nameKpi
|
|
3542
3602
|
}
|
|
3543
3603
|
),
|
|
3544
|
-
/* @__PURE__ */
|
|
3604
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3545
3605
|
InputField,
|
|
3546
3606
|
{
|
|
3547
3607
|
value: kpiValue,
|
|
@@ -3565,7 +3625,7 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3565
3625
|
error: errors.kpiValue
|
|
3566
3626
|
}
|
|
3567
3627
|
),
|
|
3568
|
-
/* @__PURE__ */
|
|
3628
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3569
3629
|
InputField,
|
|
3570
3630
|
{
|
|
3571
3631
|
value: unitValue,
|
|
@@ -3577,8 +3637,8 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3577
3637
|
error: errors.unitValue
|
|
3578
3638
|
}
|
|
3579
3639
|
),
|
|
3580
|
-
/* @__PURE__ */
|
|
3581
|
-
IconCirclePlus,
|
|
3640
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: `flex justify-end mt-[28px]`, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3641
|
+
import_icons_react11.IconCirclePlus,
|
|
3582
3642
|
{
|
|
3583
3643
|
className: "w-[40px] h-[40px] cursor-pointer hover:scale-110 transition",
|
|
3584
3644
|
stroke: 1,
|
|
@@ -3586,17 +3646,17 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3586
3646
|
}
|
|
3587
3647
|
) })
|
|
3588
3648
|
] }),
|
|
3589
|
-
/* @__PURE__ */
|
|
3649
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: kpiList.map((kpi, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
3590
3650
|
"div",
|
|
3591
3651
|
{
|
|
3592
3652
|
className: "grid grid-cols-[30px_1fr_100px_120px_80px] items-start py-2 body-1 gap-[8px]",
|
|
3593
3653
|
children: [
|
|
3594
|
-
/* @__PURE__ */
|
|
3654
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("p", { className: `body-1 ${kpi.isEditing ? "mt-[12px]" : ""}`, children: [
|
|
3595
3655
|
index + 1,
|
|
3596
3656
|
"."
|
|
3597
3657
|
] }),
|
|
3598
|
-
kpi.isEditing ? /* @__PURE__ */
|
|
3599
|
-
/* @__PURE__ */
|
|
3658
|
+
kpi.isEditing ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
3659
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3600
3660
|
InputField,
|
|
3601
3661
|
{
|
|
3602
3662
|
value: kpi.name,
|
|
@@ -3606,7 +3666,7 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3606
3666
|
error: itemErrors[kpi.id]?.name
|
|
3607
3667
|
}
|
|
3608
3668
|
),
|
|
3609
|
-
/* @__PURE__ */
|
|
3669
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3610
3670
|
InputField,
|
|
3611
3671
|
{
|
|
3612
3672
|
value: kpi.value?.toString(),
|
|
@@ -3631,7 +3691,7 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3631
3691
|
error: itemErrors[kpi.id]?.value
|
|
3632
3692
|
}
|
|
3633
3693
|
),
|
|
3634
|
-
/* @__PURE__ */
|
|
3694
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3635
3695
|
InputField,
|
|
3636
3696
|
{
|
|
3637
3697
|
value: kpi.unit,
|
|
@@ -3641,29 +3701,29 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3641
3701
|
error: itemErrors[kpi.id]?.unit
|
|
3642
3702
|
}
|
|
3643
3703
|
),
|
|
3644
|
-
/* @__PURE__ */
|
|
3704
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
3645
3705
|
"div",
|
|
3646
3706
|
{
|
|
3647
3707
|
className: `flex gap-2 justify-end self-center ${!!itemErrors[kpi.id]?.value || !!itemErrors[kpi.id]?.unit || !!itemErrors[kpi.id]?.name ? "mt-[-12px]" : ""}`,
|
|
3648
3708
|
children: [
|
|
3649
|
-
/* @__PURE__ */
|
|
3650
|
-
|
|
3709
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3710
|
+
import_icons_react11.IconCheck,
|
|
3651
3711
|
{
|
|
3652
3712
|
className: "w-[30px] h-[30px] cursor-pointer",
|
|
3653
3713
|
onClick: () => handleSave(kpi.id, type)
|
|
3654
3714
|
}
|
|
3655
3715
|
),
|
|
3656
|
-
/* @__PURE__ */
|
|
3716
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconX, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleCancel(kpi.id) })
|
|
3657
3717
|
]
|
|
3658
3718
|
}
|
|
3659
3719
|
)
|
|
3660
|
-
] }) : /* @__PURE__ */
|
|
3661
|
-
/* @__PURE__ */
|
|
3662
|
-
/* @__PURE__ */
|
|
3663
|
-
/* @__PURE__ */
|
|
3664
|
-
/* @__PURE__ */
|
|
3665
|
-
/* @__PURE__ */
|
|
3666
|
-
/* @__PURE__ */
|
|
3720
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
3721
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "body-1", children: kpi.name }),
|
|
3722
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "body-1", children: kpi.value }),
|
|
3723
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "body-1", children: kpi.unit }),
|
|
3724
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex gap-3 justify-end", children: [
|
|
3725
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconPencil, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleEdit(kpi.id) }),
|
|
3726
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconTrash, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleDelete(kpi.id) })
|
|
3667
3727
|
] })
|
|
3668
3728
|
] })
|
|
3669
3729
|
]
|
|
@@ -3671,9 +3731,9 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3671
3731
|
kpi.id
|
|
3672
3732
|
)) })
|
|
3673
3733
|
] }),
|
|
3674
|
-
type === "text" && /* @__PURE__ */
|
|
3675
|
-
/* @__PURE__ */
|
|
3676
|
-
/* @__PURE__ */
|
|
3734
|
+
type === "text" && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "space-y-4", children: [
|
|
3735
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "grid grid-cols-[1fr_50px] w-full gap-[24px] items-start", children: [
|
|
3736
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3677
3737
|
InputField,
|
|
3678
3738
|
{
|
|
3679
3739
|
value: nameKpi,
|
|
@@ -3685,8 +3745,8 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3685
3745
|
error: errors.nameKpi
|
|
3686
3746
|
}
|
|
3687
3747
|
),
|
|
3688
|
-
/* @__PURE__ */
|
|
3689
|
-
IconCirclePlus,
|
|
3748
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: `flex justify-end mt-[28px]`, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3749
|
+
import_icons_react11.IconCirclePlus,
|
|
3690
3750
|
{
|
|
3691
3751
|
className: "w-[40px] h-[40px] cursor-pointer hover:scale-110 transition",
|
|
3692
3752
|
stroke: 1,
|
|
@@ -3694,13 +3754,13 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3694
3754
|
}
|
|
3695
3755
|
) })
|
|
3696
3756
|
] }),
|
|
3697
|
-
/* @__PURE__ */
|
|
3698
|
-
/* @__PURE__ */
|
|
3757
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: kpiList.map((kpi, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "grid grid-cols-[30px_1fr_80px] items-start py-2 body-1 gap-[8px]", children: [
|
|
3758
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("p", { className: `body-1 ${kpi.isEditing ? "mt-[12px]" : ""}`, children: [
|
|
3699
3759
|
index + 1,
|
|
3700
3760
|
"."
|
|
3701
3761
|
] }),
|
|
3702
|
-
kpi.isEditing ? /* @__PURE__ */
|
|
3703
|
-
/* @__PURE__ */
|
|
3762
|
+
kpi.isEditing ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
3763
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3704
3764
|
InputField,
|
|
3705
3765
|
{
|
|
3706
3766
|
value: kpi.name,
|
|
@@ -3710,27 +3770,27 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3710
3770
|
error: itemErrors[kpi.id]?.name
|
|
3711
3771
|
}
|
|
3712
3772
|
),
|
|
3713
|
-
/* @__PURE__ */
|
|
3773
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
3714
3774
|
"div",
|
|
3715
3775
|
{
|
|
3716
3776
|
className: `flex gap-2 justify-end self-center ${!!itemErrors[kpi.id]?.name ? "mt-[-12px]" : ""}`,
|
|
3717
3777
|
children: [
|
|
3718
|
-
/* @__PURE__ */
|
|
3719
|
-
|
|
3778
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
3779
|
+
import_icons_react11.IconCheck,
|
|
3720
3780
|
{
|
|
3721
3781
|
className: "w-[30px] h-[30px] cursor-pointer",
|
|
3722
3782
|
onClick: () => handleSave(kpi.id, type)
|
|
3723
3783
|
}
|
|
3724
3784
|
),
|
|
3725
|
-
/* @__PURE__ */
|
|
3785
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconX, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleCancel(kpi.id) })
|
|
3726
3786
|
]
|
|
3727
3787
|
}
|
|
3728
3788
|
)
|
|
3729
|
-
] }) : /* @__PURE__ */
|
|
3730
|
-
/* @__PURE__ */
|
|
3731
|
-
/* @__PURE__ */
|
|
3732
|
-
/* @__PURE__ */
|
|
3733
|
-
/* @__PURE__ */
|
|
3789
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
3790
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "body-1", children: kpi.name }),
|
|
3791
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex gap-3 justify-end", children: [
|
|
3792
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconPencil, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleEdit(kpi.id) }),
|
|
3793
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons_react11.IconTrash, { className: "w-[30px] h-[30px] cursor-pointer", onClick: () => handleDelete(kpi.id) })
|
|
3734
3794
|
] })
|
|
3735
3795
|
] })
|
|
3736
3796
|
] }, kpi.id)) })
|
|
@@ -3741,17 +3801,17 @@ function KpiSection({ type, onChangeKpiList }) {
|
|
|
3741
3801
|
}
|
|
3742
3802
|
|
|
3743
3803
|
// src/Modal/Modal/Modal.tsx
|
|
3744
|
-
|
|
3745
|
-
|
|
3804
|
+
var import_antd23 = require("antd");
|
|
3805
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
3746
3806
|
function AntDModal({ children, isOpen, width, onCancel }) {
|
|
3747
|
-
return /* @__PURE__ */
|
|
3807
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_antd23.Modal, { open: isOpen, onCancel, width, centered: true, footer: null, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { children }) }) });
|
|
3748
3808
|
}
|
|
3749
3809
|
|
|
3750
3810
|
// src/Indicator/Indicator/Indicator.tsx
|
|
3751
|
-
|
|
3752
|
-
|
|
3753
|
-
|
|
3754
|
-
|
|
3811
|
+
var import_icons_react12 = require("@tabler/icons-react");
|
|
3812
|
+
var import_react15 = require("react");
|
|
3813
|
+
var import_antd24 = require("antd");
|
|
3814
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
3755
3815
|
function Indicator({
|
|
3756
3816
|
option = [
|
|
3757
3817
|
{ value: "TEXT", label: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" },
|
|
@@ -3761,22 +3821,22 @@ function Indicator({
|
|
|
3761
3821
|
arrayData,
|
|
3762
3822
|
setArrayData
|
|
3763
3823
|
}) {
|
|
3764
|
-
const [valueSwitch, setValueSwitch] =
|
|
3765
|
-
const [cacheData, setCacheData] =
|
|
3824
|
+
const [valueSwitch, setValueSwitch] = (0, import_react15.useState)("TEXT");
|
|
3825
|
+
const [cacheData, setCacheData] = (0, import_react15.useState)({
|
|
3766
3826
|
indicatorType: type,
|
|
3767
3827
|
inputType: valueSwitch,
|
|
3768
3828
|
textValue: "",
|
|
3769
3829
|
numberValue: "",
|
|
3770
3830
|
unit: ""
|
|
3771
3831
|
});
|
|
3772
|
-
const [cacheEditData, setCacheEditData] =
|
|
3832
|
+
const [cacheEditData, setCacheEditData] = (0, import_react15.useState)({
|
|
3773
3833
|
indicatorType: type,
|
|
3774
3834
|
inputType: valueSwitch,
|
|
3775
3835
|
textValue: "",
|
|
3776
3836
|
numberValue: "",
|
|
3777
3837
|
unit: ""
|
|
3778
3838
|
});
|
|
3779
|
-
const [editIndex, setEditIndex] =
|
|
3839
|
+
const [editIndex, setEditIndex] = (0, import_react15.useState)(null);
|
|
3780
3840
|
const handleAddIndicator = () => {
|
|
3781
3841
|
if (cacheData.textValue.trim() === "") return;
|
|
3782
3842
|
setArrayData([
|
|
@@ -3833,14 +3893,14 @@ function Indicator({
|
|
|
3833
3893
|
}));
|
|
3834
3894
|
console.log(cacheEditData);
|
|
3835
3895
|
};
|
|
3836
|
-
return /* @__PURE__ */
|
|
3837
|
-
/* @__PURE__ */
|
|
3896
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "w-full", children: [
|
|
3897
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
3838
3898
|
"div",
|
|
3839
3899
|
{
|
|
3840
3900
|
className: `space-x-2 grid ${valueSwitch === "TEXT" ? `grid-cols-[140px_1fr_50px]` : `grid-cols-[140px_1fr_200px_200px_50px]`} items-start`,
|
|
3841
3901
|
children: [
|
|
3842
|
-
/* @__PURE__ */
|
|
3843
|
-
/* @__PURE__ */
|
|
3902
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SwitchSelect, { option, onClick: handleClick, value: valueSwitch, label: "\u0E1B\u0E23\u0E30\u0E40\u0E20\u0E17", required: true }),
|
|
3903
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3844
3904
|
InputField,
|
|
3845
3905
|
{
|
|
3846
3906
|
label: `\u0E0A\u0E37\u0E48\u0E2D\u0E15\u0E31\u0E27\u0E0A\u0E35\u0E49\u0E27\u0E31\u0E14${type === "OUTPUT" ? "\u0E1C\u0E25\u0E1C\u0E25\u0E34\u0E15" : "\u0E1C\u0E25\u0E25\u0E31\u0E1E\u0E18\u0E4C"}`,
|
|
@@ -3851,8 +3911,8 @@ function Indicator({
|
|
|
3851
3911
|
required: true
|
|
3852
3912
|
}
|
|
3853
3913
|
),
|
|
3854
|
-
valueSwitch === "NUMBER" && /* @__PURE__ */
|
|
3855
|
-
/* @__PURE__ */
|
|
3914
|
+
valueSwitch === "NUMBER" && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
3915
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3856
3916
|
InputFieldNumber,
|
|
3857
3917
|
{
|
|
3858
3918
|
label: `\u0E04\u0E48\u0E32\u0E40\u0E1B\u0E49\u0E32\u0E2B\u0E21\u0E32\u0E22${type === "OUTPUT" ? "\u0E1C\u0E25\u0E1C\u0E25\u0E34\u0E15" : "\u0E1C\u0E25\u0E25\u0E31\u0E1E\u0E18\u0E4C"}`,
|
|
@@ -3863,7 +3923,7 @@ function Indicator({
|
|
|
3863
3923
|
required: true
|
|
3864
3924
|
}
|
|
3865
3925
|
),
|
|
3866
|
-
/* @__PURE__ */
|
|
3926
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3867
3927
|
InputField,
|
|
3868
3928
|
{
|
|
3869
3929
|
label: `\u0E2B\u0E19\u0E48\u0E27\u0E22`,
|
|
@@ -3875,18 +3935,18 @@ function Indicator({
|
|
|
3875
3935
|
}
|
|
3876
3936
|
)
|
|
3877
3937
|
] }),
|
|
3878
|
-
/* @__PURE__ */
|
|
3938
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons_react12.IconCirclePlus, { onClick: handleAddIndicator, className: "mt-7 cursor-pointer", size: 32 })
|
|
3879
3939
|
]
|
|
3880
3940
|
}
|
|
3881
3941
|
),
|
|
3882
|
-
/* @__PURE__ */
|
|
3942
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: arrayData.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
3883
3943
|
"div",
|
|
3884
3944
|
{
|
|
3885
3945
|
className: `space-y-4 grid ${item.inputType === "TEXT" ? `grid-cols-[140px_1fr_50px_50px]` : `grid-cols-[140px_1fr_200px_150px_50px_50px]`} items-start`,
|
|
3886
3946
|
children: [
|
|
3887
|
-
/* @__PURE__ */
|
|
3888
|
-
index === editIndex ? /* @__PURE__ */
|
|
3889
|
-
|
|
3947
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2", children: item.inputType === "TEXT" ? "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" : "\u0E15\u0E31\u0E27\u0E40\u0E25\u0E02" }),
|
|
3948
|
+
index === editIndex ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3949
|
+
import_antd24.Input,
|
|
3890
3950
|
{
|
|
3891
3951
|
className: "body-1 mt-2",
|
|
3892
3952
|
variant: "underlined",
|
|
@@ -3894,10 +3954,10 @@ function Indicator({
|
|
|
3894
3954
|
name: "textValue",
|
|
3895
3955
|
onChange: (e) => handleChangeEditCashData(e)
|
|
3896
3956
|
}
|
|
3897
|
-
) : /* @__PURE__ */
|
|
3898
|
-
item.inputType === "NUMBER" && /* @__PURE__ */
|
|
3899
|
-
index === editIndex ? /* @__PURE__ */
|
|
3900
|
-
|
|
3957
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2", children: item.textValue }),
|
|
3958
|
+
item.inputType === "NUMBER" && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
3959
|
+
index === editIndex ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3960
|
+
import_antd24.Input,
|
|
3901
3961
|
{
|
|
3902
3962
|
className: "body-1 mt-2",
|
|
3903
3963
|
variant: "underlined",
|
|
@@ -3905,9 +3965,9 @@ function Indicator({
|
|
|
3905
3965
|
name: "numberValue",
|
|
3906
3966
|
onChange: (e) => handleChangeEditCashData(e)
|
|
3907
3967
|
}
|
|
3908
|
-
) : /* @__PURE__ */
|
|
3909
|
-
index === editIndex ? /* @__PURE__ */
|
|
3910
|
-
|
|
3968
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2", children: item.numberValue }),
|
|
3969
|
+
index === editIndex ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3970
|
+
import_antd24.Input,
|
|
3911
3971
|
{
|
|
3912
3972
|
className: "body-1 mt-2",
|
|
3913
3973
|
variant: "underlined",
|
|
@@ -3915,19 +3975,19 @@ function Indicator({
|
|
|
3915
3975
|
name: "unit",
|
|
3916
3976
|
onChange: (e) => handleChangeEditCashData(e)
|
|
3917
3977
|
}
|
|
3918
|
-
) : /* @__PURE__ */
|
|
3978
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2", children: item.unit })
|
|
3919
3979
|
] }),
|
|
3920
|
-
/* @__PURE__ */
|
|
3921
|
-
/* @__PURE__ */
|
|
3922
|
-
|
|
3980
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2 flex", children: editIndex !== null ? editIndex === index ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex", children: [
|
|
3981
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
3982
|
+
import_icons_react12.IconCheck,
|
|
3923
3983
|
{
|
|
3924
3984
|
className: "cursor-pointer text-green-600",
|
|
3925
3985
|
onClick: () => handleConfirmEditIndicator(index)
|
|
3926
3986
|
}
|
|
3927
3987
|
),
|
|
3928
|
-
/* @__PURE__ */
|
|
3929
|
-
] }) : void 0 : /* @__PURE__ */
|
|
3930
|
-
/* @__PURE__ */
|
|
3988
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons_react12.IconX, { className: "cursor-pointer text-red-600", onClick: handleCancelEditIndicator })
|
|
3989
|
+
] }) : void 0 : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons_react12.IconPencil, { className: "cursor-pointer", onClick: () => handleEditIndicator(index) }) }),
|
|
3990
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "body-1 mt-2 cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_icons_react12.IconTrash, { onClick: () => handleDeleteIndicator(index) }) })
|
|
3931
3991
|
]
|
|
3932
3992
|
}
|
|
3933
3993
|
)) })
|
|
@@ -3935,32 +3995,32 @@ function Indicator({
|
|
|
3935
3995
|
}
|
|
3936
3996
|
|
|
3937
3997
|
// src/FilterPopUp/FilterPopUp.tsx
|
|
3938
|
-
|
|
3939
|
-
|
|
3940
|
-
|
|
3998
|
+
var import_icons_react13 = require("@tabler/icons-react");
|
|
3999
|
+
var import_react16 = require("react");
|
|
4000
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
3941
4001
|
var FilterPopUp = (filter) => {
|
|
3942
|
-
const [isAction, setIsAction] =
|
|
3943
|
-
const [filterArray, setFilterArray] =
|
|
4002
|
+
const [isAction, setIsAction] = (0, import_react16.useState)(true);
|
|
4003
|
+
const [filterArray, setFilterArray] = (0, import_react16.useState)([""]);
|
|
3944
4004
|
const handleClearFilter = () => {
|
|
3945
4005
|
setFilterArray([]);
|
|
3946
4006
|
};
|
|
3947
4007
|
const handleSubmitFilter = () => {
|
|
3948
4008
|
filter.handleSearch(filterArray);
|
|
3949
4009
|
};
|
|
3950
|
-
return /* @__PURE__ */
|
|
3951
|
-
/* @__PURE__ */
|
|
3952
|
-
/* @__PURE__ */
|
|
4010
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "relative", children: [
|
|
4011
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("button", { className: "flex px-2 py-1 rounded-lg border-1", onClick: () => setIsAction(!isAction), children: [
|
|
4012
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons_react13.IconFilter, {}),
|
|
3953
4013
|
"filter"
|
|
3954
4014
|
] }),
|
|
3955
|
-
isAction ? /* @__PURE__ */
|
|
3956
|
-
/* @__PURE__ */
|
|
3957
|
-
/* @__PURE__ */
|
|
3958
|
-
/* @__PURE__ */
|
|
3959
|
-
/* @__PURE__ */
|
|
4015
|
+
isAction ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "absolute bg-white p-5 rounded-lg shadow-2xl w-[600px]", children: [
|
|
4016
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex justify-end", children: [
|
|
4017
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex justify-end text-nowrap gap-2", children: [
|
|
4018
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(GhostButton, { title: "\u0E43\u0E0A\u0E49\u0E1F\u0E34\u0E25\u0E40\u0E15\u0E2D\u0E23\u0E4C", onClick: handleSubmitFilter, iconLeft: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons_react13.IconCheck, {}) }),
|
|
4019
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(GhostButton, { title: "\u0E25\u0E49\u0E32\u0E07\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14", onClick: handleClearFilter, iconLeft: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_icons_react13.IconTrash, {}) })
|
|
3960
4020
|
] }),
|
|
3961
4021
|
""
|
|
3962
4022
|
] }),
|
|
3963
|
-
/* @__PURE__ */
|
|
4023
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
3964
4024
|
SelectCustom,
|
|
3965
4025
|
{
|
|
3966
4026
|
options: filter.selectionFilter,
|
|
@@ -3971,7 +4031,8 @@ var FilterPopUp = (filter) => {
|
|
|
3971
4031
|
] }) : void 0
|
|
3972
4032
|
] });
|
|
3973
4033
|
};
|
|
3974
|
-
export
|
|
4034
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
4035
|
+
0 && (module.exports = {
|
|
3975
4036
|
AntDModal,
|
|
3976
4037
|
AntDataTable,
|
|
3977
4038
|
Breadcrumbs,
|
|
@@ -4020,4 +4081,4 @@ export {
|
|
|
4020
4081
|
messageSuccess,
|
|
4021
4082
|
messageWarning,
|
|
4022
4083
|
setMessageApi
|
|
4023
|
-
};
|
|
4084
|
+
});
|