@suphark/ui 0.3.2 → 0.4.0

package/src/components/shared/form-dialog.tsx

@@ -10,6 +10,7 @@ import {
   DialogTitle,
   DialogTrigger,
 } from "@suphark/ui/components/ui/dialog";
+import { cn } from "@suphark/ui/lib/utils";
 import { useRouter } from "next/navigation";
 import {
   type ReactElement,
@@ -76,7 +77,10 @@ export function FormDialog({
   return (
     <Dialog open={open} onOpenChange={setOpen}>
       {trigger && <DialogTrigger render={trigger} />}
-      <DialogContent className={contentClassName ?? "sm:max-w-md"}>
+      {/* จำกัดความสูงไว้ในจอ: header/footer ตรึง เฉพาะเนื้อฟอร์มเลื่อน (ฟอร์มยาวไม่ล้นในหน้าต่างเตี้ย) */}
+      <DialogContent
+        className={cn("flex max-h-[calc(100dvh-2rem)] flex-col", contentClassName ?? "sm:max-w-md")}
+      >
         <form
           // ไม่ใช้ `action=` — React 19 รีเซ็ตฟอร์ม uncontrolled หลัง action จบทุกครั้ง (แม้คืน error)
           // ทำให้ค่าที่พิมพ์หาย; เรียก action ใน transition เองแทน ฟอร์มจึงคงค่าไว้ให้แก้ต่อได้
@@ -86,13 +90,15 @@ export function FormDialog({
             setSubmitted((n) => n + 1);
             startTransition(() => formAction(fd));
           }}
-          className="flex flex-col gap-4"
+          className="flex min-h-0 flex-1 flex-col gap-4"
         >
           <DialogHeader>
             <DialogTitle>{title}</DialogTitle>
             {description && <DialogDescription>{description}</DialogDescription>}
           </DialogHeader>
-          <div className="flex flex-col gap-3">{children}</div>
+          <div className="-mx-1 flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto px-1">
+            {children}
+          </div>
           <FormMessage state={state} />
           <DialogFooter>
             <Button type="button" variant="ghost" onClick={() => setOpen(false)}>

package/src/index.ts

@@ -9,6 +9,8 @@
  * `chart` (recharts) ไม่อยู่ใน barrel: import ตรง `@suphark/ui/components/ui/chart` เมื่อแอปติดตั้ง recharts เอง
  */
 
+// ชนิดช่วงวันที่ของ react-day-picker — แอปไม่ต้องติดตั้ง react-day-picker เอง
+export type { DateRange } from "react-day-picker";
 // sonner: `toast()` คู่กับ <Toaster /> — แอปไม่ต้องติดตั้ง sonner เอง
 export { toast } from "sonner";
 export * from "./components/shared/button";

package/src/styles.css

@@ -9,6 +9,10 @@
  *
  * ฟอนต์: Noto Sans Thai Looped (@fontsource) โหลดที่นี่ — แอปที่ต้องการฟอนต์อื่น override --font-sans ใน @theme ของตัวเอง
  * ส่วน print/A4 และสไตล์เฉพาะ feature ของ supplychain ไม่ได้ยกมา (อยู่ที่แอปนั้น)
+ *
+ * Override contract (ดู docs/agent-rules.md):
+ *   แอปแก้ได้: --brand / --brand-foreground (บน wrapper), --font-sans / --font-mono, --radius
+ *   ห้ามแก้: semantic token (--primary --background --muted --destructive …), --sidebar-*, --chart-*, วิธีสลับธีม
  */
 @import "tw-animate-css";
 @import "@fontsource/noto-sans-thai-looped/400.css";