@suphark/ui 0.42.0 → 0.42.1

package/CHANGELOG.md

@@ -2,7 +2,13 @@
 
 รูปแบบตาม [Keep a Changelog](https://keepachangelog.com/) · semver: patch = หน้าตา/บั๊ก, minor = component/prop ใหม่, major = เปลี่ยน/ลบ props
 
-## [0.42.0] — 2026-10-07
+## [0.42.1] — 2026-10-07
+
+### Fixed
+
+- **วันที่สัมพัทธ์นับผิด 1 วัน** (เจอตอนตรวจ 0.42.0 บน production: พิมพ์ `t+3` ได้ 10 ต.ค. ถูก แต่วงเล็บบอก "(ใน 2 วัน)") — `formatRelativeThaiDate` ใช้ `formatDistanceToNow` ซึ่งนับเวลาจาก "ตอนนี้" ถึงเที่ยงคืนของวันนั้น (บ่าย/ค่ำเหลือ ~2.4 วัน → 2) และมีคำว่า "ประมาณ 1 เดือน" · ตอนนี้นับเป็นวันปฏิทินด้วย `Intl.RelativeTimeFormat`: "ในอีก 3 วัน", "10 วันที่ผ่านมา", "เดือนหน้า", "ปีที่แล้ว" (< 31 วัน = วัน, < 12 เดือน = เดือน, ที่เหลือ = ปี) — กระทบ `DatePicker` และ `RelativeDate` · `DatePicker locale` ใช้สูตรเดียวกัน (เดิมนับเป็นวันอย่างเดียว "in 45 days")
+- `formatRelativeCalendarDate(date, locale)` ใน `lib/formatters` (ใช้ร่วมกันข้างใน)
+
 
 ### Added
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@suphark/ui",
-  "version": "0.42.0",
+  "version": "0.42.1",
   "private": false,
   "type": "module",
   "description": "Design system กลางของ Suphark apps: shadcn/ui (base-nova, Base UI, Tailwind v4) + shared components + token/ฟอนต์ Noto Sans Thai Looped — ส่งเป็น source ให้แอป Next transpile เอง",

package/src/components/shared/date/date-picker.tsx

@@ -11,7 +11,7 @@ import {
 } from "@suphark/ui/components/ui/input-group";
 import { Popover, PopoverContent, PopoverTrigger } from "@suphark/ui/components/ui/popover";
 import { useMounted } from "@suphark/ui/hooks/use-mounted";
-import { formatRelativeThaiDate, formatThaiFullDate } from "@suphark/ui/lib/formatters";
+import { formatRelativeCalendarDate, formatThaiFullDate } from "@suphark/ui/lib/formatters";
 import { cn } from "@suphark/ui/lib/utils";
 import { addDays, addMonths, addWeeks, addYears } from "date-fns";
 import { CalendarIcon, Check, InfoIcon, X } from "lucide-react";
@@ -158,12 +158,9 @@ function formatDate(date: Date, locale: string | undefined): string {
   }).format(date);
 }
 
-/** "พรุ่งนี้" / "in 3 days" — นับเป็นวันตามปฏิทิน */
+/** "พรุ่งนี้" / "in 3 days" — นับเป็นวันตามปฏิทิน (ไม่ส่ง locale = ไทย) */
 function formatRelative(date: Date, locale: string | undefined): string {
-  if (!locale) return formatRelativeThaiDate(date);
-  const startOf = (d: Date) => new Date(d.getFullYear(), d.getMonth(), d.getDate()).getTime();
-  const days = Math.round((startOf(date) - startOf(new Date())) / 86_400_000);
-  return new Intl.RelativeTimeFormat(locale, { numeric: "auto" }).format(days, "day");
+  return formatRelativeCalendarDate(date, locale ?? "th");
 }
 
 interface DatePickerBaseProps {

package/src/lib/formatters.ts

@@ -1,24 +1,36 @@
-import { differenceInCalendarDays, formatDistanceToNow } from "date-fns";
-import { th } from "date-fns/locale/th";
+import {
+  differenceInCalendarDays,
+  differenceInCalendarMonths,
+  differenceInCalendarYears,
+} from "date-fns";
 
 /**
  * ฟอร์แมตวันที่แบบไทยที่ primitives ใช้ร่วมกัน (DatePicker, RelativeDate)
  * ยกมาจาก supplychain `lib/utils/formatters.ts` เฉพาะส่วนที่ไม่ผูก domain
  */
 
-/** วันที่แบบสัมพัทธ์ภาษาไทย เช่น "วันนี้", "เมื่อวาน", "พรุ่งนี้", "10 วันที่ผ่านมา", "ใน 2 เดือน" */
+/**
+ * วันที่สัมพัทธ์นับตาม "วันปฏิทิน" ไม่ใช่ระยะเวลาจากตอนนี้ — "ในอีก 3 วัน" ทั้งวันไม่ว่าตอนนี้กี่โมง
+ * (เดิมใช้ formatDistanceToNow: 3 วันข้างหน้าตอนบ่ายเหลือ ~2.4 วัน → "ใน 2 วัน", และมี "ประมาณ 1 เดือน")
+ * น้อยกว่า 31 วัน = วัน, น้อยกว่า 12 เดือน = เดือน, ที่เหลือ = ปี
+ */
+export function formatRelativeCalendarDate(date: Date, locale = "th"): string {
+  const now = new Date();
+  const fmt = new Intl.RelativeTimeFormat(locale, { numeric: "auto" });
+  const days = differenceInCalendarDays(date, now);
+  if (Math.abs(days) < 31) return fmt.format(days, "day");
+  const months = differenceInCalendarMonths(date, now);
+  if (Math.abs(months) < 12) return fmt.format(months, "month");
+  return fmt.format(differenceInCalendarYears(date, now), "year");
+}
+
+/** วันที่แบบสัมพัทธ์ภาษาไทย เช่น "วันนี้", "เมื่อวาน", "พรุ่งนี้", "10 วันที่ผ่านมา", "ในอีก 2 เดือน" */
 export function formatRelativeThaiDate(date: Date | string | number | null | undefined): string {
   if (!date) return "ไม่ได้ระบุ";
   const d = new Date(date);
   if (Number.isNaN(d.getTime())) return "ไม่ได้ระบุ";
 
-  // เทียบเป็นวันปฏิทิน (ไม่ใช่ 24 ชม.) และคงเครื่องหมาย — อนาคต 1 วันคือ "พรุ่งนี้" ไม่ใช่ "เมื่อวาน"
-  const diffDays = differenceInCalendarDays(new Date(), d);
-  if (diffDays === 0) return "วันนี้";
-  if (diffDays === 1) return "เมื่อวาน";
-  if (diffDays === -1) return "พรุ่งนี้";
-
-  return formatDistanceToNow(d, { addSuffix: true, locale: th });
+  return formatRelativeCalendarDate(d, "th");
 }
 
 const THAI_MONTH_SHORT = [