@bigtablet/design-system 1.11.4 → 1.11.6

package/dist/index.css

@@ -869,14 +869,14 @@
 /* src/ui/form/date-picker/style.scss */
 .date_picker {
   display: flex;
-  flex-direction: column;
   gap: 0.25rem;
 }
 .date_picker_label {
-  font-family: "Pretendard", sans-serif;
+  color: #1a1a1a;
+  margin-bottom: 0.25rem;
+  font-weight: 500;
   font-size: 0.875rem;
   line-height: 1.5;
-  color: #666666;
 }
 .date_picker_required {
   margin-left: 0.25rem;

package/dist/index.d.ts

@@ -129,6 +129,7 @@ declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.
 
 type DatePickerMode = "year-month" | "year-month-day";
 interface DatePickerProps {
+    label?: string;
     value?: string;
     onChange: (value: string) => void;
     mode?: DatePickerMode;
@@ -143,7 +144,7 @@ interface DatePickerProps {
         day?: number | string;
     };
 }
-declare const DatePicker: ({ value, onChange, mode, startYear, endYear, minDate, disabled, width, }: DatePickerProps) => react_jsx_runtime.JSX.Element;
+declare const DatePicker: ({ label, value, onChange, mode, startYear, endYear, minDate, disabled, width, }: DatePickerProps) => react_jsx_runtime.JSX.Element;
 
 interface PaginationProps {
     page: number;

package/dist/index.js

@@ -592,6 +592,7 @@ var pad = (n) => String(n).padStart(2, "0");
 var getDaysInMonth = (year, month) => new Date(year, month, 0).getDate();
 var normalizeWidth = (v) => typeof v === "number" ? `${v}px` : v;
 var DatePicker = ({
+  label,
   value,
   onChange,
   mode = "year-month-day",
@@ -609,11 +610,20 @@ var DatePicker = ({
   const minMonth = minY && year === minY ? minM : 1;
   const minDay = minY && minM && year === minY && month === minM ? minD : 1;
   const days = year && month ? getDaysInMonth(year, month) : 31;
+  const clampDay = (year2, month2, day2) => {
+    const maxDay = getDaysInMonth(year2, month2);
+    return Math.min(day2, maxDay);
+  };
   const emit = (yy, mm, dd) => {
-    const result = mode === "year-month" ? `${yy}-${pad(mm)}` : `${yy}-${pad(mm)}-${pad(dd ?? 1)}`;
-    onChange(result);
+    if (mode === "year-month") {
+      onChange(`${yy}-${pad(mm)}`);
+      return;
+    }
+    const safeDay = clampDay(yy, mm, dd ?? 1);
+    onChange(`${yy}-${pad(mm)}-${pad(safeDay)}`);
   };
   return /* @__PURE__ */ jsxs("div", { className: "date_picker", style: { width: normalizeWidth(width?.container) }, children: [
+    label && /* @__PURE__ */ jsx("label", { className: "date_picker_label", children: label }),
     /* @__PURE__ */ jsxs(
       "select",
       {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigtablet/design-system",
-  "version": "1.11.4",
+  "version": "1.11.6",
   "description": "Bigtablet Design System UI Components",
   "type": "module",
   "types": "dist/index.d.ts",