@suphark/ui 0.4.1 → 0.4.3

package/CHANGELOG.md

@@ -2,6 +2,29 @@
 
 รูปแบบตาม [Keep a Changelog](https://keepachangelog.com/) · semver: patch = หน้าตา/บั๊ก, minor = component/prop ใหม่, major = เปลี่ยน/ลบ props
 
+## [0.4.3] — 2026-09-19
+
+### Added
+
+- **`useConfirm()`** (barrel) — `window.confirm` แบบ promise บน ConfirmDialog สำหรับโค้ดฝั่ง client ที่ไม่ใช่ server action (ยกมาจาก DueBell ที่ย้าย window.confirm 8 จุดด้วย hook นี้): `const { confirm, confirmDialog } = useConfirm(); if (!(await confirm({ description, destructive: true }))) return;` แล้ว render `{confirmDialog}`; เรียกซ้ำขณะเปิดอยู่ → คำขอเดิม resolve(false)
+- `ConfirmSpec` object รับ `destructive?` (RowActions/ConfirmActionButton ใช้เป็นตัวทับค่าเดิมของรายการ/variant)
+- README: ตาราง "ยืนยันก่อนทำ — ห้ามใช้ window.confirm" (เลือก RowActions.confirm / ConfirmActionButton / useConfirm / ConfirmDialog) และหมายเหตุ Turbopack ค้าง `Package path ./styles.css is exported … but no valid target file` หลังอัปเดตแพ็กเกจ = cache ของ dev server ให้ลบ `.next`
+
+## [0.4.2] — 2026-09-19
+
+### Added
+
+- **`ConfirmDialog`** (barrel) — กล่องยืนยันมาตรฐานบน `AlertDialog` ของแพ็กเกจ ใช้แทน `window.confirm` (webview/automation บางตัวปิด window.confirm ทิ้ง กดแล้วไม่เกิดอะไร และไม่เข้า design system): controlled `open`/`onOpenChange`, `title?` (ค่าเริ่มต้น `UiText.confirmTitle`), `description`, `confirmLabel?` (ค่าเริ่มต้น `UiText.confirm`), `cancelLabel?`, `destructive` (ปุ่มยืนยันสีแดง), `pending` (ปุ่มหมุน + ปิดไม่ได้ชั่วคราว), `onConfirm`; พร้อม type `ConfirmSpec` (= `string | { title?, description, confirmLabel?, cancelLabel? }`) และ `normalizeConfirm()`
+- **`ConfirmActionButton`** (`@suphark/ui/next`) — ปุ่มเดี่ยว + ConfirmDialog + server action ในตัว (`confirm`, `action`, `data`, `onDone?` + props ของ ActionButton เช่น `variant`/`icon`/`permission`) รอ action เสร็จแล้ว `router.refresh()` — ใช้แทน `<form action>` + window.confirm ที่ Pi Auth มี (ชื่อไม่ใช้ `ConfirmButton` เพราะมีปุ่มธรรมดาชื่อนั้นอยู่แล้วใน standard buttons)
+- `UiText.confirm` / `UiText.confirmTitle` (optional มีค่าเริ่มต้นไทย/อังกฤษ) — แอปที่ส่ง UiText เองไม่ต้องเพิ่ม
+- export type `RowActionItem` (รายการที่ไม่ใช่ separator)
+
+### Changed
+
+- **`RowActions` / `RowMenu` prop `confirm`** เปิด `ConfirmDialog` แทน `window.confirm` (ขอจาก Pi Auth ผ่าน Pi Mail) — รับ `ConfirmSpec`: string เดิมยังใช้ได้ (= description, title/ปุ่มค่าเริ่มต้น) หรือ object กำหนด `title`/`confirmLabel`/`cancelLabel`; ปุ่มยืนยันสีแดงเมื่อ `destructive`; dropdown ปิดก่อน dialog เปิด และ dialog render นอก DropdownMenu (กัน focus trap ของ Base UI ชนกัน); กดยืนยันแล้วค่อยรัน `href`/`onSelect`/`action` ใน transition เหมือนเดิม — โค้ดเรียกเดิมไม่ต้องแก้
+- ไม่มี `window.confirm` เหลือในแพ็กเกจ
+- showcase: หน้า `/components/confirm-dialog` (ConfirmDialog + ConfirmActionButton) และ `/components/row-actions` ใช้ confirm แบบ object
+
 ## [0.4.1] — 2026-09-19
 
 ### Added

package/README.md

@@ -51,11 +51,15 @@ import { ThemeProvider, Toaster } from "@suphark/ui";
 
 แอปจะ type-check source ของแพ็กเกจด้วย — แพ็กเกจผ่าน `strict` + `noUncheckedIndexedAccess` + `verbatimModuleSyntax` อยู่แล้ว
 
+### หลังอัปเดตเวอร์ชันแพ็กเกจ
+
+ถ้า Turbopack ค้าง `Package path ./styles.css is exported … but no valid target file` (หรือ resolve entry อื่นไม่ได้) หลัง `pnpm install` เวอร์ชันใหม่ — เป็น cache ของ dev server ไม่ใช่ปัญหาแพ็กเกจ: หยุด dev server แล้วลบ `.next` ของแอป
+
 ## การ import
 
 ```ts
 // ทุกอย่างที่ไม่พึ่ง Next — primitives, shared, theme, hooks, cn
-import { Button, Card, FormFieldInput, StatusBadge, ThemeToggle, cn } from "@suphark/ui";
+import { Button, Card, FormFieldInput, StatusBadge, ThemeToggle, ConfirmDialog, useConfirm, cn } from "@suphark/ui";
 
 // ของที่ใช้ next/navigation หรือ next/link + โครงแอป
 import { AppShell, UserMenu, filterNav, FormDialog, RowActions, LinkButton, RefreshButton, PageShell } from "@suphark/ui/next";
@@ -140,6 +144,19 @@ export default async function Layout({ children }) {
 <div style={{ "--brand": tenant.color, "--brand-foreground": "oklch(0.985 0 0)" } as React.CSSProperties}>…</div>
 ```
 
+### ยืนยันก่อนทำ — ห้ามใช้ `window.confirm`
+
+webview/automation บางตัวปิด `window.confirm` ทิ้ง (กดแล้วไม่เกิดอะไร) และไม่เข้า design system — ใช้ 3 ตัวนี้แทน
+
+| สถานการณ์ | ใช้ |
+| --- | --- |
+| รายการในเมนู … ท้ายแถว | `RowActions` / `RowMenu` prop `confirm` (string หรือ `{ title, description, confirmLabel }`) |
+| ปุ่มเดี่ยวเรียก server action | `ConfirmActionButton` (`@suphark/ui/next`) — `confirm` + `action` + `data` |
+| โค้ด client อื่น ๆ (fetch/mutation เอง) | `const { confirm, confirmDialog } = useConfirm(); if (!(await confirm({ description, destructive: true }))) return;` แล้ว render `{confirmDialog}` |
+| คุม state เอง | `ConfirmDialog` controlled |
+
+ข้อความค่าเริ่มต้น (หัว/ปุ่ม) มาจาก `UiText.confirmTitle` / `UiText.confirm`
+
 ### สิทธิ์ (ActionButton/LinkButton `permission` prop)
 
 แพ็กเกจไม่รู้จักระบบสิทธิ์ของแอป — ครอบด้วย `UiPermissionProvider` แล้วส่งฟังก์ชัน `check(requirement, options)` ของแอปเข้ามา ถ้าไม่ครอบ = อนุญาตทุกอย่าง

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@suphark/ui",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "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/button/confirm-action-button.tsx

@@ -0,0 +1,73 @@
+"use client";
+
+import {
+  ActionButton,
+  type ActionButtonProps,
+} from "@suphark/ui/components/shared/button/base/action-button";
+import {
+  ConfirmDialog,
+  type ConfirmSpec,
+  normalizeConfirm,
+} from "@suphark/ui/components/shared/confirm-dialog";
+import { useRouter } from "next/navigation";
+import { useState, useTransition } from "react";
+
+/**
+ * ปุ่มเดี่ยวที่ถามยืนยัน (ConfirmDialog) ก่อนเรียก server action — ใช้แทน `<form action>` + window.confirm
+ * `confirm` เหมือน `RowAction.confirm`; `action` + `data` เหมือน RowAction; refresh หน้าเมื่อเสร็จ
+ * ต้องการ next/navigation → export จาก `@suphark/ui/next`
+ */
+export function ConfirmActionButton({
+  confirm,
+  action,
+  data,
+  onDone,
+  variant,
+  children,
+  ...props
+}: Omit<ActionButtonProps, "onClick" | "isLoading" | "type"> & {
+  confirm: ConfirmSpec;
+  action: (formData: FormData) => Promise<unknown>;
+  data?: Record<string, string>;
+  /** เรียกหลัง action สำเร็จ (ก่อน refresh) เช่น toast */
+  onDone?: () => void;
+}) {
+  const router = useRouter();
+  const [open, setOpen] = useState(false);
+  const [pending, start] = useTransition();
+  const spec = normalizeConfirm(confirm);
+  const destructive = spec.destructive ?? variant === "destructive";
+  return (
+    <>
+      <ActionButton
+        type="button"
+        variant={variant}
+        isLoading={pending}
+        onClick={() => setOpen(true)}
+        {...props}
+      >
+        {children}
+      </ActionButton>
+      <ConfirmDialog
+        open={open}
+        onOpenChange={setOpen}
+        title={spec.title}
+        description={spec.description}
+        confirmLabel={spec.confirmLabel}
+        cancelLabel={spec.cancelLabel}
+        destructive={destructive}
+        pending={pending}
+        onConfirm={() => {
+          const fd = new FormData();
+          for (const [k, v] of Object.entries(data ?? {})) fd.set(k, v);
+          start(async () => {
+            await action(fd);
+            onDone?.();
+            setOpen(false);
+            router.refresh();
+          });
+        }}
+      />
+    </>
+  );
+}

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

@@ -0,0 +1,83 @@
+"use client";
+
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@suphark/ui/components/ui/alert-dialog";
+import { Loader2 } from "lucide-react";
+import type { ReactNode } from "react";
+import { useUiText } from "./ui-text";
+
+/** สเปกการยืนยัน — string = description อย่างเดียว (title/ปุ่มใช้ค่าเริ่มต้นจาก UiText) */
+export type ConfirmSpec =
+  | string
+  | {
+      title?: ReactNode;
+      description: ReactNode;
+      confirmLabel?: string;
+      cancelLabel?: string;
+      /** ปุ่มยืนยันสีแดง (RowActions ใช้ `destructive` ของรายการเป็นค่าเริ่มต้นอยู่แล้ว) */
+      destructive?: boolean;
+    };
+
+/** แปลง ConfirmSpec เป็น object เสมอ */
+export function normalizeConfirm(spec: ConfirmSpec): Exclude<ConfirmSpec, string> {
+  return typeof spec === "string" ? { description: spec } : spec;
+}
+
+/**
+ * กล่องยืนยันมาตรฐานของแพ็กเกจ (AlertDialog) — ใช้แทน `window.confirm` ทุกที่
+ * (webview/automation บางตัวปิด window.confirm ทิ้ง กดแล้วไม่เกิดอะไร และไม่เข้า design system)
+ * controlled: `open`/`onOpenChange`; `pending` = กำลังรัน action → ปุ่มยืนยันหมุน ปิดไม่ได้ชั่วคราว
+ */
+export function ConfirmDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  confirmLabel,
+  cancelLabel,
+  destructive = false,
+  pending = false,
+  onConfirm,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  title?: ReactNode;
+  description: ReactNode;
+  confirmLabel?: string;
+  cancelLabel?: string;
+  /** ปุ่มยืนยันสีแดง (ลบ/เพิกถอน) */
+  destructive?: boolean;
+  pending?: boolean;
+  onConfirm: () => void;
+}) {
+  const text = useUiText();
+  return (
+    <AlertDialog open={open} onOpenChange={(o) => !pending && onOpenChange(o)}>
+      <AlertDialogContent>
+        <AlertDialogHeader>
+          <AlertDialogTitle>{title ?? text.confirmTitle ?? "ยืนยันการทำรายการ"}</AlertDialogTitle>
+          <AlertDialogDescription>{description}</AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel disabled={pending}>{cancelLabel ?? text.cancel}</AlertDialogCancel>
+          <AlertDialogAction
+            variant={destructive ? "destructive" : "default"}
+            disabled={pending}
+            onClick={onConfirm}
+          >
+            {pending && <Loader2 className="animate-spin" aria-hidden="true" />}
+            {confirmLabel ?? text.confirm ?? "ยืนยัน"}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+}

package/src/components/shared/row-actions.tsx

@@ -11,83 +11,110 @@ import {
 import { MoreHorizontalIcon } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { useState, useTransition } from "react";
+import { ConfirmDialog, type ConfirmSpec, normalizeConfirm } from "./confirm-dialog";
 import { useUiText } from "./ui-text";
 
-export type RowAction =
-  | {
-      type?: "item";
-      label: string;
-      href?: string;
-      onSelect?: () => void;
-      destructive?: boolean;
-      confirm?: string;
-      action?: (formData: FormData) => Promise<unknown>;
-      data?: Record<string, string>;
-      disabled?: boolean;
-    }
-  | { type: "separator" };
+export type RowActionItem = {
+  type?: "item";
+  label: string;
+  href?: string;
+  onSelect?: () => void;
+  destructive?: boolean;
+  /** ถามยืนยันก่อน (ConfirmDialog ของแพ็กเกจ — ไม่ใช่ window.confirm): string = ข้อความ หรือ object กำหนด title/ปุ่ม */
+  confirm?: ConfirmSpec;
+  action?: (formData: FormData) => Promise<unknown>;
+  data?: Record<string, string>;
+  disabled?: boolean;
+};
+
+export type RowAction = RowActionItem | { type: "separator" };
 
 /**
  * เมนู "…" ท้ายแถว — รวมการกระทำรองไว้ที่เดียวแทนปุ่ม/ฟอร์มหลายอันในแถว
  * รายการเรียก server action ได้โดยตรง (`action` + `data`) หรือไปหน้าอื่น (`href`) หรือเปิด dialog (`onSelect`)
- * `confirm` = ถามยืนยันก่อน (ใช้กับสิ่งที่ย้อนกลับไม่ได้)
+ * `confirm` = ถามยืนยันก่อนด้วย ConfirmDialog (ใช้กับสิ่งที่ย้อนกลับไม่ได้) — dialog render นอก DropdownMenu กัน focus trap ชนกัน
  */
 export function RowActions({ items, label }: { items: RowAction[]; label?: string }) {
   const router = useRouter();
   const text = useUiText();
   const [pending, start] = useTransition();
   const [open, setOpen] = useState(false);
+  const [confirming, setConfirming] = useState<RowActionItem | null>(null);
+
+  function run(it: RowActionItem) {
+    if (it.href) {
+      router.push(it.href);
+      return;
+    }
+    if (it.onSelect) {
+      it.onSelect();
+      return;
+    }
+    if (it.action) {
+      const fd = new FormData();
+      for (const [k, v] of Object.entries(it.data ?? {})) fd.set(k, v);
+      const act = it.action;
+      start(async () => {
+        await act(fd);
+        router.refresh();
+      });
+    }
+  }
+
+  const spec = confirming?.confirm ? normalizeConfirm(confirming.confirm) : null;
   return (
-    <DropdownMenu open={open} onOpenChange={setOpen}>
-      <DropdownMenuTrigger
-        render={
-          <Button
-            variant="ghost"
-            size="icon-sm"
-            aria-label={label ?? text.actions}
-            disabled={pending}
-          />
-        }
-      >
-        <MoreHorizontalIcon />
-      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="min-w-52">
-        {items.map((it, i) =>
-          it.type === "separator" ? (
-            // biome-ignore lint/suspicious/noArrayIndexKey: separator ไม่มี identity
-            <DropdownMenuSeparator key={`sep-${i}`} />
-          ) : (
-            <DropdownMenuItem
-              key={it.label}
-              variant={it.destructive ? "destructive" : "default"}
-              disabled={it.disabled}
-              onClick={() => {
-                setOpen(false);
-                if (it.confirm && !window.confirm(it.confirm)) return;
-                if (it.href) {
-                  router.push(it.href);
-                  return;
-                }
-                if (it.onSelect) {
-                  it.onSelect();
-                  return;
-                }
-                if (it.action) {
-                  const fd = new FormData();
-                  for (const [k, v] of Object.entries(it.data ?? {})) fd.set(k, v);
-                  const run = it.action;
-                  start(async () => {
-                    await run(fd);
-                    router.refresh();
-                  });
-                }
-              }}
-            >
-              {it.label}
-            </DropdownMenuItem>
-          ),
-        )}
-      </DropdownMenuContent>
-    </DropdownMenu>
+    <>
+      <DropdownMenu open={open} onOpenChange={setOpen}>
+        <DropdownMenuTrigger
+          render={
+            <Button
+              variant="ghost"
+              size="icon-sm"
+              aria-label={label ?? text.actions}
+              disabled={pending}
+            />
+          }
+        >
+          <MoreHorizontalIcon />
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end" className="min-w-52">
+          {items.map((it, i) =>
+            it.type === "separator" ? (
+              // biome-ignore lint/suspicious/noArrayIndexKey: separator ไม่มี identity
+              <DropdownMenuSeparator key={`sep-${i}`} />
+            ) : (
+              <DropdownMenuItem
+                key={it.label}
+                variant={it.destructive ? "destructive" : "default"}
+                disabled={it.disabled}
+                onClick={() => {
+                  setOpen(false);
+                  if (it.confirm) setConfirming(it);
+                  else run(it);
+                }}
+              >
+                {it.label}
+              </DropdownMenuItem>
+            ),
+          )}
+        </DropdownMenuContent>
+      </DropdownMenu>
+      {spec && confirming && (
+        <ConfirmDialog
+          open
+          onOpenChange={(o) => !o && setConfirming(null)}
+          title={spec.title}
+          description={spec.description}
+          confirmLabel={spec.confirmLabel}
+          cancelLabel={spec.cancelLabel}
+          destructive={spec.destructive ?? confirming.destructive}
+          onConfirm={() => {
+            const it = confirming;
+            setConfirming(null);
+            run(it);
+          }}
+        />
+      )}
+    </>
   );
 }

package/src/components/shared/ui-text.tsx

@@ -14,6 +14,10 @@ export interface UiText {
   success: string;
   /** EnvSnippet: คัดลอกอัตโนมัติไม่ได้ (optional — มีค่าเริ่มต้นในตัว) */
   copyFailed?: string;
+  /** ConfirmDialog: ปุ่มยืนยัน (optional — ค่าเริ่มต้น "ยืนยัน") */
+  confirm?: string;
+  /** ConfirmDialog: หัวกล่อง (optional — ค่าเริ่มต้น "ยืนยันการทำรายการ") */
+  confirmTitle?: string;
 }
 
 export const UI_TEXT_TH: UiText = {
@@ -26,6 +30,8 @@ export const UI_TEXT_TH: UiText = {
   showOnce: "แสดงครั้งเดียว — คัดลอกเก็บไว้ทันที",
   success: "สำเร็จ",
   copyFailed: "คัดลอกอัตโนมัติไม่ได้ — เลือกข้อความให้แล้ว กด Ctrl+C / ⌘C",
+  confirm: "ยืนยัน",
+  confirmTitle: "ยืนยันการทำรายการ",
 };
 
 export const UI_TEXT_EN: UiText = {
@@ -38,6 +44,8 @@ export const UI_TEXT_EN: UiText = {
   showOnce: "Shown once — copy it now",
   success: "Done",
   copyFailed: "Automatic copy is blocked — text selected, press Ctrl+C / ⌘C",
+  confirm: "Confirm",
+  confirmTitle: "Please confirm",
 };
 
 const UiTextContext = createContext<UiText>(UI_TEXT_TH);

package/src/hooks/use-confirm.tsx

@@ -0,0 +1,63 @@
+"use client";
+
+import {
+  ConfirmDialog,
+  type ConfirmSpec,
+  normalizeConfirm,
+} from "@suphark/ui/components/shared/confirm-dialog";
+import { type ReactNode, useCallback, useState } from "react";
+
+/**
+ * `window.confirm` แบบ promise บน ConfirmDialog — สำหรับโค้ดฝั่ง client ที่ไม่ใช่ server action
+ * (เช่น กดลบแล้วเรียก fetch/mutation เอง) — ยกมาจาก DueBell
+ *
+ *   const { confirm, confirmDialog } = useConfirm();
+ *   async function remove() {
+ *     if (!(await confirm({ description: "ลบรายการนี้?", destructive: true }))) return;
+ *     …
+ *   }
+ *   return <>{confirmDialog}<Button onClick={remove}>ลบ</Button></>;
+ *
+ * ต้อง render `confirmDialog` ในต้นไม้ของ component ที่เรียก hook (ครั้งเดียวต่อ hook)
+ * เรียก `confirm` ซ้ำขณะกล่องเปิดอยู่ → คำขอเดิม resolve(false) แล้วแสดงคำขอใหม่แทน
+ */
+export function useConfirm(): {
+  confirm: (spec: ConfirmSpec) => Promise<boolean>;
+  confirmDialog: ReactNode;
+} {
+  const [request, setRequest] = useState<{
+    options: Exclude<ConfirmSpec, string>;
+    resolve: (ok: boolean) => void;
+  } | null>(null);
+
+  const confirm = useCallback(
+    (spec: ConfirmSpec) =>
+      new Promise<boolean>((resolve) => {
+        setRequest((prev) => {
+          prev?.resolve(false);
+          return { options: normalizeConfirm(spec), resolve };
+        });
+      }),
+    [],
+  );
+
+  function settle(ok: boolean) {
+    request?.resolve(ok);
+    setRequest(null);
+  }
+
+  const confirmDialog = request ? (
+    <ConfirmDialog
+      open
+      onOpenChange={(open) => !open && settle(false)}
+      title={request.options.title}
+      description={request.options.description}
+      confirmLabel={request.options.confirmLabel}
+      cancelLabel={request.options.cancelLabel}
+      destructive={request.options.destructive}
+      onConfirm={() => settle(true)}
+    />
+  ) : null;
+
+  return { confirm, confirmDialog };
+}

package/src/index.ts

@@ -16,6 +16,11 @@ export { toast } from "sonner";
 export * from "./components/shared/button";
 export { ClientRedirect } from "./components/shared/client-redirect";
 export { Combobox } from "./components/shared/combobox";
+export {
+  ConfirmDialog,
+  type ConfirmSpec,
+  normalizeConfirm,
+} from "./components/shared/confirm-dialog";
 export { DataList, DataRow } from "./components/shared/data-list";
 export { DateRangePicker } from "./components/shared/date/date-range-picker";
 export { DescriptionList } from "./components/shared/description-list";
@@ -137,6 +142,7 @@ export * from "./components/ui/toggle";
 export * from "./components/ui/toggle-group";
 export * from "./components/ui/tooltip";
 // ---------- lib / hooks ----------
+export { useConfirm } from "./hooks/use-confirm";
 export { useCopyToClipboard } from "./hooks/use-copy-to-clipboard";
 export { useIsMobile } from "./hooks/use-mobile";
 export { copyText, selectContents } from "./lib/copy-text";

package/src/next.ts

@@ -6,6 +6,7 @@
 // ---------- app shell (sidebar + header + เนื้อหา) ----------
 export * from "./components/app-shell";
 export { LinkButton, type LinkButtonProps } from "./components/shared/button/base/link-button";
+export { ConfirmActionButton } from "./components/shared/button/confirm-action-button";
 export { RefreshButton } from "./components/shared/button/refresh-button";
 export { FormDialog } from "./components/shared/form-dialog";
 export { PageShell } from "./components/shared/layout/page-shell";
@@ -14,7 +15,7 @@ export {
   PageBreadcrumb,
   type PageBreadcrumbItem,
 } from "./components/shared/navigation/page-breadcrumb";
-export { type RowAction, RowActions } from "./components/shared/row-actions";
+export { type RowAction, type RowActionItem, RowActions } from "./components/shared/row-actions";
 export { RowMenu, type RowMenuDialog, type RowMenuItem } from "./components/shared/row-menu";
 export {
   TABLE_PARAM,