@suphark/ui 0.18.0 → 0.20.0

package/src/index.ts

@@ -14,6 +14,11 @@ export type { DateRange } from "react-day-picker";
 // sonner: `toast()` คู่กับ <Toaster /> — แอปไม่ต้องติดตั้ง sonner เอง
 export { toast } from "sonner";
 export { ActionForm } from "./components/shared/action-form";
+export {
+  ActionMenu,
+  type ActionMenuCommand,
+  type ActionMenuItem,
+} from "./components/shared/action-menu";
 export * from "./components/shared/button";
 export {
   type CalendarDayContext,
@@ -37,6 +42,7 @@ export {
   type ConfirmSpec,
   normalizeConfirm,
 } from "./components/shared/confirm-dialog";
+export { CountBadge } from "./components/shared/count-badge";
 export { DataList, DataRow } from "./components/shared/data-list";
 export { DateRangePicker } from "./components/shared/date/date-range-picker";
 export { DescriptionList } from "./components/shared/description-list";
@@ -62,6 +68,7 @@ export { EmptyRow } from "./components/shared/empty-row";
 export { EmptyState } from "./components/shared/empty-state";
 export { EnvSnippet, randomSecret } from "./components/shared/env-snippet";
 export { type FileKind, FileTypeIcon, getFileKind } from "./components/shared/file-type-icon";
+export { FilterBar, type FilterBarFilter } from "./components/shared/filter-bar";
 export { FormFieldBoolean } from "./components/shared/form/form-field-boolean";
 export { FormFieldColorSelect } from "./components/shared/form/form-field-color-select";
 export { FormFieldCombobox } from "./components/shared/form/form-field-combobox";
@@ -84,6 +91,7 @@ export {
   type SimpleSelectOptions,
   type SimpleSelectProps,
 } from "./components/shared/form/simple-select";
+export { SliderField, type SliderFieldProps } from "./components/shared/form/slider-field";
 export {
   type FormAction,
   FormMessage,
@@ -107,6 +115,11 @@ export {
   type LanguageSwitchProps,
 } from "./components/shared/language/language-switch";
 export { ErrorState, type RouteError } from "./components/shared/layout/error-state";
+export {
+  MonthStepper,
+  type MonthStepperProps,
+  useMonthCursor,
+} from "./components/shared/month-stepper";
 export {
   MultiSelectCombobox,
   type MultiSelectComboboxProps,
@@ -136,10 +149,26 @@ export {
   type RuleLeaf,
   type RuleNot,
 } from "./components/shared/rule-builder";
+export { type SaveState, SaveStatus, type SaveStatusText } from "./components/shared/save-status";
 export { SecretReveal } from "./components/shared/secret-reveal";
 export { SectionCard } from "./components/shared/section-card";
+export { SegmentedControl, type SegmentedOption } from "./components/shared/segmented-control";
 export { SelectionButton } from "./components/shared/selection-button";
-export { Stat } from "./components/shared/stat";
+export { SettingsLayout, type SettingsSection } from "./components/shared/settings-layout";
+export { DangerZone, SettingsRow, SwitchRow } from "./components/shared/settings-row";
+export { SetupChecklist, type SetupChecklistStep } from "./components/shared/setup-checklist";
+export { SimpleDialog, SimpleSheet } from "./components/shared/simple-dialog";
+export { paginationRange, SimplePagination } from "./components/shared/simple-pagination";
+export { SimpleTable, type SimpleTableColumn } from "./components/shared/simple-table";
+export {
+  SimpleAccordion,
+  type SimpleAccordionItem,
+  type SimpleTabItem,
+  SimpleTabs,
+} from "./components/shared/simple-tabs";
+export { SimplePopover, SimpleTooltip } from "./components/shared/simple-tooltip";
+export { SkipLink } from "./components/shared/skip-link";
+export { Stat, type StatDelta, StatGrid, type StatTone } from "./components/shared/stat";
 export { StatusBadge, statusTone, type Tone } from "./components/shared/status-badge";
 export { SwitcherChevron } from "./components/shared/switcher-chevron";
 export { CodeBlock, type CodeBlockProps } from "./components/shared/text/code-block";
@@ -164,6 +193,7 @@ export {
   type UploadListText,
   type UploadStatus,
 } from "./components/shared/upload-list";
+export { UserIdentity, type UserIdentityProps } from "./components/shared/user-identity";
 // ---------- shadcn/ui primitives ----------
 export * from "./components/ui/accordion";
 export * from "./components/ui/alert";
@@ -172,7 +202,9 @@ export * from "./components/ui/aspect-ratio";
 export * from "./components/ui/attachment";
 export * from "./components/ui/avatar";
 export * from "./components/ui/badge";
+// toast.tsx (Base UI) ไม่อยู่ใน barrel: ชื่อ toast/Toaster ชนกับ sonner ที่แพ็กเกจใช้ — import ตรงจาก @suphark/ui/components/ui/toast ถ้าต้องการ
 export * from "./components/ui/breadcrumb";
+export * from "./components/ui/bubble";
 export * from "./components/ui/button";
 export * from "./components/ui/button-group";
 export * from "./components/ui/calendar";
@@ -185,6 +217,7 @@ export * from "./components/ui/command";
 export * from "./components/ui/context-menu";
 export * from "./components/ui/date-picker";
 export * from "./components/ui/dialog";
+export * from "./components/ui/direction";
 export * from "./components/ui/drawer";
 export * from "./components/ui/dropdown-menu";
 export * from "./components/ui/empty";
@@ -197,12 +230,16 @@ export * from "./components/ui/input-otp";
 export * from "./components/ui/item";
 export * from "./components/ui/kbd";
 export * from "./components/ui/label";
+export * from "./components/ui/marker";
 export * from "./components/ui/menubar";
+export * from "./components/ui/message";
+export * from "./components/ui/message-scroller";
 export * from "./components/ui/native-select";
 export * from "./components/ui/navigation-menu";
 export * from "./components/ui/pagination";
 export * from "./components/ui/popover";
 export * from "./components/ui/progress";
+export * from "./components/ui/questionnaire";
 export * from "./components/ui/radio-group";
 export * from "./components/ui/relative-date";
 export * from "./components/ui/resizable";
@@ -233,6 +270,16 @@ export { useTrackedState } from "./hooks/use-tracked-state";
 export { copyText, selectContents } from "./lib/copy-text";
 export { formatBytes, formatRelativeThaiDate, formatThaiFullDate } from "./lib/formatters";
 export { getDateTimeFormat, getNumberFormat } from "./lib/intl-cache";
+export {
+  compareMonth,
+  currentMonthKey,
+  formatMonthKey,
+  isMonthKey,
+  type MonthKey,
+  parseMonthKey,
+  shiftMonth,
+  toMonthKey,
+} from "./lib/month";
 export {
   type AtomicPermissionRequirement,
   type CheckPermissionOptions,

package/src/lib/month.ts

@@ -0,0 +1,60 @@
+import { getDateTimeFormat } from "./intl-cache";
+
+/**
+ * เดือนแบบ `"YYYY-MM"` (รูปแบบเดียวกับ `CalendarMonthGrid month`) — ไม่มีวัน/เวลา จึงไม่มีปัญหาโซนเวลา
+ * ยกจาก DueBell `CycleMonth` ให้แอปบัญชี/รายงานใช้ร่วม
+ */
+export type MonthKey = string;
+
+const MONTH_KEY = /^(\d{4})-(\d{2})$/;
+
+/** แยก `"YYYY-MM"` → ปี + เดือน (0–11); รูปแบบผิด = throw (ค่าจาก URL ให้เช็กด้วย `isMonthKey` ก่อน) */
+export function parseMonthKey(key: MonthKey): { year: number; monthIndex: number } {
+  const m = MONTH_KEY.exec(key);
+  const monthIndex = m ? Number(m[2]) - 1 : Number.NaN;
+  if (!m || monthIndex < 0 || monthIndex > 11) {
+    throw new Error(`month ต้องเป็น "YYYY-MM" ได้ "${key}"`);
+  }
+  return { year: Number(m[1]), monthIndex };
+}
+
+export function isMonthKey(value: unknown): value is MonthKey {
+  if (typeof value !== "string") return false;
+  const m = MONTH_KEY.exec(value);
+  return !!m && Number(m[2]) >= 1 && Number(m[2]) <= 12;
+}
+
+/** Date → `"YYYY-MM"` ตามเวลาท้องถิ่นของเครื่อง */
+export function toMonthKey(date: Date): MonthKey {
+  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}`;
+}
+
+export function currentMonthKey(now: Date = new Date()): MonthKey {
+  return toMonthKey(now);
+}
+
+/** เลื่อนเดือน (ลบ = ย้อนหลัง) ข้ามปีให้เอง: shiftMonth("2026-01", -1) → "2025-12" */
+export function shiftMonth(key: MonthKey, by: number): MonthKey {
+  const { year, monthIndex } = parseMonthKey(key);
+  return toMonthKey(new Date(year, monthIndex + by, 1));
+}
+
+/** เทียบเดือน: < 0 = a ก่อน b (เทียบเป็นสตริงได้เพราะเติม 0 แล้ว) */
+export function compareMonth(a: MonthKey, b: MonthKey): number {
+  return a < b ? -1 : a > b ? 1 : 0;
+}
+
+/**
+ * ชื่อเดือนสำหรับแสดง — `th-TH` ได้ปี พ.ศ. ตาม Intl (`"ตุลาคม 2569"`), `en-US` ได้ ค.ศ.
+ * ต้องการ ค.ศ. ในภาษาไทย ใช้ locale `"th-TH-u-ca-gregory"`
+ */
+export function formatMonthKey(
+  key: MonthKey,
+  locale = "th-TH",
+  style: "long" | "short" = "long",
+): string {
+  const { year, monthIndex } = parseMonthKey(key);
+  return getDateTimeFormat(locale, { month: style, year: "numeric" }).format(
+    new Date(year, monthIndex, 1),
+  );
+}

package/src/styles.css

@@ -282,6 +282,16 @@
   }
 }
 
+/* ขอบล่างของจอ iPhone (home indicator) — แถบที่ fixed ติดล่าง เช่น MobileTabBar */
+@utility pb-safe {
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+}
+
+/* เว้นที่ใต้เนื้อหาให้พ้น MobileTabBar (สูง ~4rem + safe-area) — AppShell mobileTabs ใส่ให้เอง */
+@utility pb-tab-bar {
+  padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px));
+}
+
 @utility scrollbar-thin {
   scrollbar-width: thin;
   scrollbar-color: var(--scrollbar-thumb) transparent;