@esic-lab/data-core-ui 0.0.39 → 0.0.41

package/dist/index.d.mts

@@ -265,7 +265,6 @@ interface DatePickerBasicProps {
     placeholder?: string;
     disabled?: boolean;
     defaultValue?: Date | null;
-    mode?: "time" | "date" | "month";
     minDate?: Date;
     maxDate?: Date;
     disabledDate?: (currentDate: Date) => boolean;

package/dist/index.d.ts

@@ -265,7 +265,6 @@ interface DatePickerBasicProps {
     placeholder?: string;
     disabled?: boolean;
     defaultValue?: Date | null;
-    mode?: "time" | "date" | "month";
     minDate?: Date;
     maxDate?: Date;
     disabledDate?: (currentDate: Date) => boolean;

package/dist/index.js

@@ -1287,14 +1287,23 @@ function InputFieldNumber({
 // src/DatePicker/DatePickerBasic/DatePickerBasic.tsx
 var import_antd5 = require("antd");
 var import_dayjs = __toESM(require_dayjs_min());
-var import_th_TH = __toESM(require("antd/es/date-picker/locale/th_TH"));
-var import_th_TH2 = __toESM(require("antd/locale/th_TH"));
 var import_th2 = __toESM(require_th());
-var import_buddhistEra = __toESM(require_buddhistEra());
-var import_locale = require("date-fns/locale");
 var import_date_fns = require("date-fns");
+var import_locale = require("date-fns/locale");
+var import_th_TH = __toESM(require("antd/es/date-picker/locale/th_TH"));
+var import_buddhistEra = __toESM(require_buddhistEra());
 var import_jsx_runtime23 = require("react/jsx-runtime");
 import_dayjs.default.extend(import_buddhistEra.default);
+var buddhistLocale = {
+  ...import_th_TH.default,
+  lang: {
+    ...import_th_TH.default.lang,
+    fieldDateFormat: "BBBB-MM-DD",
+    fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
+    yearFormat: "BBBB",
+    cellYearFormat: "BBBB"
+  }
+};
 function DatePickerBasic({
   value,
   onChange,
@@ -1308,61 +1317,40 @@ function DatePickerBasic({
   maxDate,
   disabledDate,
   className,
-  size
+  size = "middle"
 }) {
-  const dateFormat = "DD/MM/YYYY";
-  import_dayjs.default.locale("th_TH");
-  const buddhistLocale = {
-    ...import_th_TH.default,
-    lang: {
-      ...import_th_TH.default.lang,
-      fieldDateFormat: "BBBB-MM-DD",
-      fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
-      yearFormat: "BBBB",
-      cellYearFormat: "BBBB"
-    }
+  const formatToThaiBE = (date) => {
+    const formatted = (0, import_date_fns.format)(date, "dd MMMM yyyy", { locale: import_locale.th });
+    const year = parseInt((0, import_date_fns.format)(date, "yyyy"));
+    const yearBE = year + 543;
+    return formatted.replace(/\d{4}$/, String(yearBE));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-    import_antd5.ConfigProvider,
-    {
-      locale: import_th_TH2.default,
-      theme: {
-        token: {
-          fontFamily: "Kanit",
-          fontSize: 16
-        }
-      },
-      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "container-input", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "body-1", children: label }),
-          " ",
-          required && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-red-500", children: "*" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-          import_antd5.DatePicker,
-          {
-            className: `body-1 w-full ${className ?? ""}`,
-            value,
-            placeholder,
-            onChange,
-            allowClear: true,
-            disabled,
-            format: (date) => date ? (0, import_date_fns.format)(date.toDate(), "dd/MM/yyyy", { locale: import_locale.th }).replace(
-              /\d{4}$/,
-              (y) => String(parseInt(y) + 543)
-            ) : "",
-            defaultValue,
-            disabledDate: (d) => disabledDate ? disabledDate(d.toDate()) : false,
-            minDate: minDate ? (0, import_dayjs.default)(minDate) : void 0,
-            maxDate: maxDate ? (0, import_dayjs.default)(maxDate) : void 0,
-            size,
-            locale: buddhistLocale
-          }
-        ),
-        error && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-red-500 caption-1", children: error })
-      ] })
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "container-input", style: { fontFamily: "Kanit", fontSize: 16 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "body-1", children: label }),
+      required && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-red-500", children: "*" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      import_antd5.DatePicker,
+      {
+        className: `body-1 w-full ${className ?? ""}`,
+        placeholder,
+        disabled,
+        allowClear: true,
+        size,
+        value: value ? (0, import_dayjs.default)(value) : null,
+        defaultValue: defaultValue ? (0, import_dayjs.default)(defaultValue) : void 0,
+        minDate: minDate ? (0, import_dayjs.default)(minDate) : void 0,
+        maxDate: maxDate ? (0, import_dayjs.default)(maxDate) : void 0,
+        disabledDate: (d) => disabledDate ? disabledDate(d.toDate()) : false,
+        onChange: (d) => onChange(d ? d.toDate() : null),
+        format: (d) => d ? formatToThaiBE(d.toDate()) : "",
+        locale: buddhistLocale,
+        style: { fontFamily: "Kanit", fontSize: 16 }
+      }
+    ),
+    error && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-red-500 caption-1", children: error })
+  ] });
 }
 
 // src/ColorPicker/ColorPickerBasic/ColorPicker.tsx

package/dist/index.mjs

@@ -1231,13 +1231,22 @@ function InputFieldNumber({
 var import_dayjs = __toESM(require_dayjs_min());
 var import_th2 = __toESM(require_th());
 var import_buddhistEra = __toESM(require_buddhistEra());
-import { ConfigProvider as ConfigProvider5, DatePicker } from "antd";
-import th from "antd/es/date-picker/locale/th_TH";
-import thTH from "antd/locale/th_TH";
-import { th as thFns } from "date-fns/locale";
+import { DatePicker } from "antd";
 import { format } from "date-fns";
+import { th as thFns } from "date-fns/locale";
+import th from "antd/es/date-picker/locale/th_TH";
 import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
 import_dayjs.default.extend(import_buddhistEra.default);
+var buddhistLocale = {
+  ...th,
+  lang: {
+    ...th.lang,
+    fieldDateFormat: "BBBB-MM-DD",
+    fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
+    yearFormat: "BBBB",
+    cellYearFormat: "BBBB"
+  }
+};
 function DatePickerBasic({
   value,
   onChange,
@@ -1251,65 +1260,44 @@ function DatePickerBasic({
   maxDate,
   disabledDate,
   className,
-  size
+  size = "middle"
 }) {
-  const dateFormat = "DD/MM/YYYY";
-  import_dayjs.default.locale("th_TH");
-  const buddhistLocale = {
-    ...th,
-    lang: {
-      ...th.lang,
-      fieldDateFormat: "BBBB-MM-DD",
-      fieldDateTimeFormat: "BBBB-MM-DD HH:mm:ss",
-      yearFormat: "BBBB",
-      cellYearFormat: "BBBB"
-    }
+  const formatToThaiBE = (date) => {
+    const formatted = format(date, "dd MMMM yyyy", { locale: thFns });
+    const year = parseInt(format(date, "yyyy"));
+    const yearBE = year + 543;
+    return formatted.replace(/\d{4}$/, String(yearBE));
   };
-  return /* @__PURE__ */ jsx23(
-    ConfigProvider5,
-    {
-      locale: thTH,
-      theme: {
-        token: {
-          fontFamily: "Kanit",
-          fontSize: 16
-        }
-      },
-      children: /* @__PURE__ */ jsxs19("div", { className: "container-input", children: [
-        /* @__PURE__ */ jsxs19("div", { children: [
-          /* @__PURE__ */ jsx23("span", { className: "body-1", children: label }),
-          " ",
-          required && /* @__PURE__ */ jsx23("span", { className: "text-red-500", children: "*" })
-        ] }),
-        /* @__PURE__ */ jsx23(
-          DatePicker,
-          {
-            className: `body-1 w-full ${className ?? ""}`,
-            value,
-            placeholder,
-            onChange,
-            allowClear: true,
-            disabled,
-            format: (date) => date ? format(date.toDate(), "dd/MM/yyyy", { locale: thFns }).replace(
-              /\d{4}$/,
-              (y) => String(parseInt(y) + 543)
-            ) : "",
-            defaultValue,
-            disabledDate: (d) => disabledDate ? disabledDate(d.toDate()) : false,
-            minDate: minDate ? (0, import_dayjs.default)(minDate) : void 0,
-            maxDate: maxDate ? (0, import_dayjs.default)(maxDate) : void 0,
-            size,
-            locale: buddhistLocale
-          }
-        ),
-        error && /* @__PURE__ */ jsx23("p", { className: "text-red-500 caption-1", children: error })
-      ] })
-    }
-  );
+  return /* @__PURE__ */ jsxs19("div", { className: "container-input", style: { fontFamily: "Kanit", fontSize: 16 }, children: [
+    /* @__PURE__ */ jsxs19("div", { children: [
+      /* @__PURE__ */ jsx23("span", { className: "body-1", children: label }),
+      required && /* @__PURE__ */ jsx23("span", { className: "text-red-500", children: "*" })
+    ] }),
+    /* @__PURE__ */ jsx23(
+      DatePicker,
+      {
+        className: `body-1 w-full ${className ?? ""}`,
+        placeholder,
+        disabled,
+        allowClear: true,
+        size,
+        value: value ? (0, import_dayjs.default)(value) : null,
+        defaultValue: defaultValue ? (0, import_dayjs.default)(defaultValue) : void 0,
+        minDate: minDate ? (0, import_dayjs.default)(minDate) : void 0,
+        maxDate: maxDate ? (0, import_dayjs.default)(maxDate) : void 0,
+        disabledDate: (d) => disabledDate ? disabledDate(d.toDate()) : false,
+        onChange: (d) => onChange(d ? d.toDate() : null),
+        format: (d) => d ? formatToThaiBE(d.toDate()) : "",
+        locale: buddhistLocale,
+        style: { fontFamily: "Kanit", fontSize: 16 }
+      }
+    ),
+    error && /* @__PURE__ */ jsx23("p", { className: "text-red-500 caption-1", children: error })
+  ] });
 }
 
 // src/ColorPicker/ColorPickerBasic/ColorPicker.tsx
-import { ConfigProvider as ConfigProvider6, ColorPicker } from "antd";
+import { ConfigProvider as ConfigProvider5, ColorPicker } from "antd";
 import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
 function ColorPickerBasic({
   value,
@@ -1324,7 +1312,7 @@ function ColorPickerBasic({
   placeholder = "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2A\u0E35"
 }) {
   return /* @__PURE__ */ jsx24(
-    ConfigProvider6,
+    ConfigProvider5,
     {
       theme: {
         token: {
@@ -1368,7 +1356,7 @@ function ColorPickerBasic({
 }
 
 // src/ColorPicker/ColorPalettePickerBasic/ColorPalettePickerBasic.tsx
-import { ConfigProvider as ConfigProvider7, ColorPicker as ColorPicker2, theme } from "antd";
+import { ConfigProvider as ConfigProvider6, ColorPicker as ColorPicker2, theme } from "antd";
 
 // node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
@@ -2098,7 +2086,7 @@ function ColorPalettePickerBasic({
     green
   });
   return /* @__PURE__ */ jsx25(
-    ConfigProvider7,
+    ConfigProvider6,
     {
       theme: {
         token: {
@@ -2144,7 +2132,7 @@ function ColorPalettePickerBasic({
 }
 
 // src/Select/SelectField/SelectField.tsx
-import { Select, ConfigProvider as ConfigProvider8 } from "antd";
+import { Select, ConfigProvider as ConfigProvider7 } from "antd";
 import { jsx as jsx26, jsxs as jsxs22 } from "react/jsx-runtime";
 function SelectField({
   value,
@@ -2164,7 +2152,7 @@ function SelectField({
   onClear
 }) {
   return /* @__PURE__ */ jsx26(
-    ConfigProvider8,
+    ConfigProvider7,
     {
       theme: {
         token: {
@@ -2217,7 +2205,7 @@ function SelectField({
 }
 
 // src/Select/SelectFieldGroup/SelectFieldGroup.tsx
-import { Select as Select2, ConfigProvider as ConfigProvider9 } from "antd";
+import { Select as Select2, ConfigProvider as ConfigProvider8 } from "antd";
 import { jsx as jsx27, jsxs as jsxs23 } from "react/jsx-runtime";
 function SelectFieldGroup({
   value,
@@ -2236,7 +2224,7 @@ function SelectFieldGroup({
   className
 }) {
   return /* @__PURE__ */ jsx27(
-    ConfigProvider9,
+    ConfigProvider8,
     {
       theme: {
         token: {
@@ -2287,7 +2275,7 @@ function SelectFieldGroup({
 }
 
 // src/Select/SelectFieldStatus/SelectFieldStatus.tsx
-import { Select as Select3, ConfigProvider as ConfigProvider10 } from "antd";
+import { Select as Select3, ConfigProvider as ConfigProvider9 } from "antd";
 
 // src/Select/SelectFieldStatus/StatusMockup.ts
 var status = [
@@ -2314,7 +2302,7 @@ function SelectFieldStatus({
 }) {
   const selectedItem = status.find((s) => s.value === value);
   return /* @__PURE__ */ jsx28(
-    ConfigProvider10,
+    ConfigProvider9,
     {
       theme: {
         components: {
@@ -2357,7 +2345,7 @@ function SelectFieldStatus({
 }
 
 // src/Select/SelectFieldStatusReport/SelectFieldStatusReport.tsx
-import { Select as Select4, ConfigProvider as ConfigProvider11 } from "antd";
+import { Select as Select4, ConfigProvider as ConfigProvider10 } from "antd";
 
 // src/Select/SelectFieldStatusReport/StatusReportMockup.ts
 var status2 = [
@@ -2381,7 +2369,7 @@ function SelectFieldStatusReport({
 }) {
   const selectedItem = status2.find((s) => s.value === value);
   return /* @__PURE__ */ jsx29(
-    ConfigProvider11,
+    ConfigProvider10,
     {
       theme: {
         components: {
@@ -2424,7 +2412,7 @@ function SelectFieldStatusReport({
 }
 
 // src/Select/SelectFieldTag/SelectFieldTag.tsx
-import { Select as Select5, ConfigProvider as ConfigProvider12 } from "antd";
+import { Select as Select5, ConfigProvider as ConfigProvider11 } from "antd";
 import { useState as useState6 } from "react";
 import { jsx as jsx30, jsxs as jsxs26 } from "react/jsx-runtime";
 function SelectFieldTag({
@@ -2460,7 +2448,7 @@ function SelectFieldTag({
     onChange?.([]);
   };
   return /* @__PURE__ */ jsx30(
-    ConfigProvider12,
+    ConfigProvider11,
     {
       theme: {
         token: {
@@ -2500,7 +2488,7 @@ function SelectFieldTag({
 
 // src/Select/SelectCustom/SelectCustom.tsx
 import { IconTrash } from "@tabler/icons-react";
-import { Select as Select6, ConfigProvider as ConfigProvider13 } from "antd";
+import { Select as Select6, ConfigProvider as ConfigProvider12 } from "antd";
 import { useState as useState7 } from "react";
 import { jsx as jsx31, jsxs as jsxs27 } from "react/jsx-runtime";
 function SelectCustom({
@@ -2532,7 +2520,7 @@ function SelectCustom({
   };
   const filteredOptions = options.filter((opt) => !valueList.includes(opt.value)).map((opt) => ({ value: opt.value, label: opt.label }));
   return /* @__PURE__ */ jsx31(
-    ConfigProvider13,
+    ConfigProvider12,
     {
       theme: {
         token: {
@@ -2574,7 +2562,7 @@ function SelectCustom({
 }
 
 // src/SortFilter/SortFilter.tsx
-import { ConfigProvider as ConfigProvider14 } from "antd";
+import { ConfigProvider as ConfigProvider13 } from "antd";
 import { CalendarOutlined } from "@ant-design/icons";
 
 // src/SortFilter/DataMockSortFilter.ts
@@ -2619,7 +2607,7 @@ function SortFilter({
   const [monthValue, setMonthValue] = useState8();
   const [quarterValue, setQuartersValue] = useState8();
   return /* @__PURE__ */ jsx32(
-    ConfigProvider14,
+    ConfigProvider13,
     {
       theme: {
         token: {
@@ -2861,7 +2849,7 @@ function messageLoading(content, duration) {
 }
 
 // src/Breadcrumb/Breadcrumb.tsx
-import { ConfigProvider as ConfigProvider15 } from "antd";
+import { ConfigProvider as ConfigProvider14 } from "antd";
 import { Breadcrumb } from "antd";
 import { jsx as jsx34 } from "react/jsx-runtime";
 function Breadcrumbs({
@@ -2872,7 +2860,7 @@ function Breadcrumbs({
   params
 }) {
   return /* @__PURE__ */ jsx34(
-    ConfigProvider15,
+    ConfigProvider14,
     {
       theme: {
         token: {
@@ -2894,7 +2882,7 @@ function Breadcrumbs({
 }
 
 // src/HeadingPage/HeadingPage.tsx
-import { ConfigProvider as ConfigProvider16 } from "antd";
+import { ConfigProvider as ConfigProvider15 } from "antd";
 import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
 function HeadingPage({ Heading }) {
   const today = (/* @__PURE__ */ new Date()).toLocaleDateString("th-TH", {
@@ -2904,7 +2892,7 @@ function HeadingPage({ Heading }) {
     year: "numeric"
   });
   return /* @__PURE__ */ jsx35(
-    ConfigProvider16,
+    ConfigProvider15,
     {
       theme: {
         token: {
@@ -2923,7 +2911,7 @@ function HeadingPage({ Heading }) {
 }
 
 // src/Progress/ProgressBar.tsx
-import { ConfigProvider as ConfigProvider17, Progress } from "antd";
+import { ConfigProvider as ConfigProvider16, Progress } from "antd";
 import { useEffect as useEffect2, useRef as useRef3, useState as useState10 } from "react";
 import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
 function ProgressBar({
@@ -2957,7 +2945,7 @@ function ProgressBar({
     return () => observer.disconnect();
   }, []);
   return /* @__PURE__ */ jsx36(
-    ConfigProvider17,
+    ConfigProvider16,
     {
       theme: {
         token: {
@@ -3003,7 +2991,7 @@ function ProgressBar({
 }
 
 // src/KpiSection/KpiSection.tsx
-import { ConfigProvider as ConfigProvider18, message } from "antd";
+import { ConfigProvider as ConfigProvider17, message } from "antd";
 import { useEffect as useEffect3, useState as useState12 } from "react";
 
 // src/KpiSection/hooks/useGetKpiSection.ts
@@ -3185,7 +3173,7 @@ function KpiSection({ type, onChangeKpiList }) {
     }
   }, [kpiList]);
   return /* @__PURE__ */ jsx37(
-    ConfigProvider18,
+    ConfigProvider17,
     {
       theme: {
         token: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esic-lab/data-core-ui",
-  "version": "0.0.39",
+  "version": "0.0.41",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",