@pactor-app/ui 0.1.0 → 1.1.0

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import { createShadcnComponentRegistry } from './components/index.cjs';
-export { Alert, AlertProps, AlertVariant, Button, ButtonProps, ButtonSize, ButtonVariant, Card, CardProps, FieldRule, Flex, FlexProps, Form, FormContextValue, FormProps, Grid, GridProps, Input, InputProps, Page, PageProps, Select, SelectOption, SelectProps, Statistic, StatisticProps, TabItem, Table, TableColumn, TablePagination, TablePaginationInfo, TableProps, Tabs, TabsProps, registerShadcnComponents, shadcnComponents, useFormContext } from './components/index.cjs';
+export { Accordion, AccordionItemData, AccordionProps, Alert, AlertDialog, AlertDialogProps, AlertProps, AlertVariant, AspectRatio, AspectRatioProps, Avatar, AvatarProps, Badge, BadgeProps, BadgeVariant, Breadcrumb, BreadcrumbItemData, BreadcrumbProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonVariant, Calendar, CalendarProps, Card, CardProps, Carousel, CarouselImage, CarouselItemData, CarouselProps, Chart, ChartProps, ChartType, Checkbox, CheckboxProps, Collapsible, CollapsibleProps, Combobox, ComboboxOption, ComboboxProps, Command, CommandGroupData, CommandItemData, CommandProps, Content, ContentProps, ContextMenu, ContextMenuItemData, ContextMenuProps, DataTable, DataTableColumn, DataTablePagination, DataTableProps, DataTableSort, DataTableSortOrder, Dialog, DialogProps, Drawer, DrawerPlacement, DrawerProps, DropdownMenu, DropdownMenuItemData, DropdownMenuProps, Empty, EmptyProps, Field, FieldProps, FieldRule, Flex, FlexProps, Footer, FooterProps, Form, FormContextValue, FormProps, Grid, GridProps, Header, HeaderBrandPosition, HeaderDropdown, HeaderDropdownItem, HeaderLocale, HeaderMenuItem, HeaderProps, HeaderUser, HeaderUserItem, HoverCard, HoverCardProps, ICONS, Icon, IconProps, IconSize, Input, InputGroup, InputGroupProps, InputOTP, InputOTPProps, InputProps, Item, ItemProps, Kbd, KbdProps, Label, LabelProps, Layout, LayoutProps, Link, LinkProps, Menu, MenuItem, MenuProps, Menubar, MenubarLeafItem, MenubarMenuData, MenubarProps, NavigationMenu, NavigationMenuChildItem, NavigationMenuItemData, NavigationMenuProps, Page, PageProps, Pagination, PaginationProps, Popover, PopoverProps, Progress, ProgressProps, RadioGroup, RadioGroupOption, RadioGroupProps, RailTooltip, Resizable, ResizablePanelData, ResizableProps, ScrollArea, ScrollAreaProps, Select, SelectOption, SelectProps, Separator, SeparatorProps, Sheet, SheetProps, SheetSide, Sidebar, SidebarBrand, SidebarNavItem, SidebarProps, Sider, SiderProps, Skeleton, SkeletonProps, SkeletonShape, Slider, SliderProps, Sonner, SonnerProps, Spinner, SpinnerProps, SpinnerSize, Statistic, StatisticProps, Switch, SwitchProps, TabItem, Table, TableColumn, TablePagination, TablePaginationInfo, TableProps, Tabs, TabsProps, Text, TextProps, TextType, Textarea, TextareaProps, Toggle, ToggleGroup, ToggleGroupOption, ToggleGroupProps, ToggleProps, Tooltip, TooltipProps, Typography, TypographyProps, TypographyVariant, normalizeIconName, registerShadcnComponents, shadcnComponents, useFormContext, useSidebarDrawer } from './components/index.cjs';
 import { createShadcnLayoutRegistry } from './layout/index.cjs';
 export { AdminBrand, AdminLayoutBreakpoint, AdminLayoutConfig, AdminLayoutMode, AdminLayoutProps, BlankLayoutProps, LandingLayoutProps, LayoutComponent, LayoutRegistry, LoginBrand, LoginLayoutProps, ShadcnAdminLayout, ShadcnBlankLayout, ShadcnLandingLayout, ShadcnLoginLayout, collectDefaultOpenKeys, findMenuChain, registerShadcnLayouts, resolveLayout } from './layout/index.cjs';
 import { ShadcnInteractionProvider, ShadcnOverlayHost } from './interaction/index.cjs';
@@ -7,6 +7,11 @@ export { InteractionProviderProps, OVERLAY_CANCEL_PAYLOAD, OverlayConfig, Overla
 import '@pactor-app/runtime';
 import 'react';
 import '@pactor-app/core';
+import 'lucide-react';
+import './typography-DsGdDBc2.cjs';
+import 'class-variance-authority/types';
+import '@base-ui/react/toggle';
+import 'class-variance-authority';
 import '@pactor-app/permission';
 import '@pactor-app/router';
 

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { createShadcnComponentRegistry } from './components/index.js';
-export { Alert, AlertProps, AlertVariant, Button, ButtonProps, ButtonSize, ButtonVariant, Card, CardProps, FieldRule, Flex, FlexProps, Form, FormContextValue, FormProps, Grid, GridProps, Input, InputProps, Page, PageProps, Select, SelectOption, SelectProps, Statistic, StatisticProps, TabItem, Table, TableColumn, TablePagination, TablePaginationInfo, TableProps, Tabs, TabsProps, registerShadcnComponents, shadcnComponents, useFormContext } from './components/index.js';
+export { Accordion, AccordionItemData, AccordionProps, Alert, AlertDialog, AlertDialogProps, AlertProps, AlertVariant, AspectRatio, AspectRatioProps, Avatar, AvatarProps, Badge, BadgeProps, BadgeVariant, Breadcrumb, BreadcrumbItemData, BreadcrumbProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonVariant, Calendar, CalendarProps, Card, CardProps, Carousel, CarouselImage, CarouselItemData, CarouselProps, Chart, ChartProps, ChartType, Checkbox, CheckboxProps, Collapsible, CollapsibleProps, Combobox, ComboboxOption, ComboboxProps, Command, CommandGroupData, CommandItemData, CommandProps, Content, ContentProps, ContextMenu, ContextMenuItemData, ContextMenuProps, DataTable, DataTableColumn, DataTablePagination, DataTableProps, DataTableSort, DataTableSortOrder, Dialog, DialogProps, Drawer, DrawerPlacement, DrawerProps, DropdownMenu, DropdownMenuItemData, DropdownMenuProps, Empty, EmptyProps, Field, FieldProps, FieldRule, Flex, FlexProps, Footer, FooterProps, Form, FormContextValue, FormProps, Grid, GridProps, Header, HeaderBrandPosition, HeaderDropdown, HeaderDropdownItem, HeaderLocale, HeaderMenuItem, HeaderProps, HeaderUser, HeaderUserItem, HoverCard, HoverCardProps, ICONS, Icon, IconProps, IconSize, Input, InputGroup, InputGroupProps, InputOTP, InputOTPProps, InputProps, Item, ItemProps, Kbd, KbdProps, Label, LabelProps, Layout, LayoutProps, Link, LinkProps, Menu, MenuItem, MenuProps, Menubar, MenubarLeafItem, MenubarMenuData, MenubarProps, NavigationMenu, NavigationMenuChildItem, NavigationMenuItemData, NavigationMenuProps, Page, PageProps, Pagination, PaginationProps, Popover, PopoverProps, Progress, ProgressProps, RadioGroup, RadioGroupOption, RadioGroupProps, RailTooltip, Resizable, ResizablePanelData, ResizableProps, ScrollArea, ScrollAreaProps, Select, SelectOption, SelectProps, Separator, SeparatorProps, Sheet, SheetProps, SheetSide, Sidebar, SidebarBrand, SidebarNavItem, SidebarProps, Sider, SiderProps, Skeleton, SkeletonProps, SkeletonShape, Slider, SliderProps, Sonner, SonnerProps, Spinner, SpinnerProps, SpinnerSize, Statistic, StatisticProps, Switch, SwitchProps, TabItem, Table, TableColumn, TablePagination, TablePaginationInfo, TableProps, Tabs, TabsProps, Text, TextProps, TextType, Textarea, TextareaProps, Toggle, ToggleGroup, ToggleGroupOption, ToggleGroupProps, ToggleProps, Tooltip, TooltipProps, Typography, TypographyProps, TypographyVariant, normalizeIconName, registerShadcnComponents, shadcnComponents, useFormContext, useSidebarDrawer } from './components/index.js';
 import { createShadcnLayoutRegistry } from './layout/index.js';
 export { AdminBrand, AdminLayoutBreakpoint, AdminLayoutConfig, AdminLayoutMode, AdminLayoutProps, BlankLayoutProps, LandingLayoutProps, LayoutComponent, LayoutRegistry, LoginBrand, LoginLayoutProps, ShadcnAdminLayout, ShadcnBlankLayout, ShadcnLandingLayout, ShadcnLoginLayout, collectDefaultOpenKeys, findMenuChain, registerShadcnLayouts, resolveLayout } from './layout/index.js';
 import { ShadcnInteractionProvider, ShadcnOverlayHost } from './interaction/index.js';
@@ -7,6 +7,11 @@ export { InteractionProviderProps, OVERLAY_CANCEL_PAYLOAD, OverlayConfig, Overla
 import '@pactor-app/runtime';
 import 'react';
 import '@pactor-app/core';
+import 'lucide-react';
+import './typography-DsGdDBc2.js';
+import 'class-variance-authority/types';
+import '@base-ui/react/toggle';
+import 'class-variance-authority';
 import '@pactor-app/permission';
 import '@pactor-app/router';
 

package/dist/index.js

@@ -1,21 +1,79 @@
 import {
+  Accordion,
   Alert,
+  AlertDialog,
+  AspectRatio,
+  Avatar,
+  Badge,
+  Breadcrumb,
   Button,
+  ButtonGroup,
+  Calendar,
   Card,
+  Carousel,
+  Chart,
+  Checkbox,
+  Collapsible,
+  Combobox,
+  Command,
+  Content,
+  ContextMenu,
+  DataTable,
+  Dialog,
+  Drawer,
+  DropdownMenu,
+  Empty,
+  Field,
   Flex,
+  Footer,
   Form,
   Grid,
+  Header,
+  HoverCard,
   Input,
+  InputGroup,
+  InputOTP,
+  Item,
+  Kbd,
+  Label,
+  Layout,
+  Link,
+  Menu,
+  Menubar,
+  NavigationMenu,
   Page,
+  Pagination,
+  Popover,
+  Progress,
+  RadioGroup,
+  RailTooltip,
+  Resizable,
+  ScrollArea,
   Select,
+  Separator,
+  Sheet,
+  Sidebar,
+  Sider,
+  Skeleton,
+  Slider,
+  Sonner,
+  Spinner,
   Statistic,
+  Switch,
   Table,
   Tabs,
+  Text,
+  Textarea,
+  Toggle,
+  ToggleGroup,
+  Tooltip,
+  Typography,
   createShadcnComponentRegistry,
   registerShadcnComponents,
   shadcnComponents,
-  useFormContext
-} from "./chunk-XGOTHOI6.js";
+  useFormContext,
+  useSidebarDrawer
+} from "./chunk-6B5ZX7L3.js";
 import {
   OVERLAY_CANCEL_PAYLOAD,
   OverlayManager,
@@ -23,7 +81,7 @@ import {
   ShadcnOverlayHost,
   createUiBridge,
   registerInteractionActions
-} from "./chunk-OH3U6PCM.js";
+} from "./chunk-BZSRLTQQ.js";
 import {
   ShadcnAdminLayout,
   ShadcnBlankLayout,
@@ -34,12 +92,15 @@ import {
   findMenuChain,
   registerShadcnLayouts,
   resolveLayout
-} from "./chunk-DMK6RSTK.js";
-import "./chunk-OUTSIJMO.js";
-import "./chunk-QDTVOJ5P.js";
-import "./chunk-QWZ23QLS.js";
-import "./chunk-SNFDI77B.js";
-import "./chunk-57NRUZ5G.js";
+} from "./chunk-GV5R6TUT.js";
+import {
+  ICONS,
+  Icon,
+  normalizeIconName
+} from "./chunk-6JNCDPGS.js";
+import "./chunk-BVHAP22U.js";
+import "./chunk-F3H23KYG.js";
+import "./chunk-GL7IO22L.js";
 import "./chunk-RQHJBTEU.js";
 
 // src/index.ts
@@ -52,36 +113,97 @@ var shadcnUiKit = {
   }
 };
 export {
+  Accordion,
   Alert,
+  AlertDialog,
+  AspectRatio,
+  Avatar,
+  Badge,
+  Breadcrumb,
   Button,
+  ButtonGroup,
+  Calendar,
   Card,
+  Carousel,
+  Chart,
+  Checkbox,
+  Collapsible,
+  Combobox,
+  Command,
+  Content,
+  ContextMenu,
+  DataTable,
+  Dialog,
+  Drawer,
+  DropdownMenu,
+  Empty,
+  Field,
   Flex,
+  Footer,
   Form,
   Grid,
+  Header,
+  HoverCard,
+  ICONS,
+  Icon,
   Input,
+  InputGroup,
+  InputOTP,
+  Item,
+  Kbd,
+  Label,
+  Layout,
+  Link,
+  Menu,
+  Menubar,
+  NavigationMenu,
   OVERLAY_CANCEL_PAYLOAD,
   OverlayManager,
   Page,
+  Pagination,
+  Popover,
+  Progress,
+  RadioGroup,
+  RailTooltip,
+  Resizable,
+  ScrollArea,
   Select,
+  Separator,
   ShadcnAdminLayout,
   ShadcnBlankLayout,
   ShadcnInteractionProvider,
   ShadcnLandingLayout,
   ShadcnLoginLayout,
   ShadcnOverlayHost,
+  Sheet,
+  Sidebar,
+  Sider,
+  Skeleton,
+  Slider,
+  Sonner,
+  Spinner,
   Statistic,
+  Switch,
   Table,
   Tabs,
+  Text,
+  Textarea,
+  Toggle,
+  ToggleGroup,
+  Tooltip,
+  Typography,
   collectDefaultOpenKeys,
   createShadcnComponentRegistry,
   createShadcnLayoutRegistry,
   createUiBridge,
   findMenuChain,
+  normalizeIconName,
   registerInteractionActions,
   registerShadcnComponents,
   registerShadcnLayouts,
   resolveLayout,
   shadcnComponents,
   shadcnUiKit,
-  useFormContext
+  useFormContext,
+  useSidebarDrawer
 };

package/dist/interaction/index.cjs

@@ -189,7 +189,7 @@ function registerInteractionActions(actions, manager, ui) {
       );
     }
     const params = action.params ?? {};
-    const type = params["type"];
+    const type = params["messageType"] ?? params["type"];
     const text = params["text"];
     if (type === "success" || type === "error" || type === "warning") {
       message[type](text);
@@ -207,6 +207,7 @@ function isRecord(value) {
 }
 
 // src/interaction/provider.tsx
+var import_runtime2 = require("@pactor-app/runtime");
 var import_react = require("react");
 var import_react_dom = require("react-dom");
 
@@ -418,6 +419,7 @@ function ShadcnInteractionProvider({
 }) {
   const [confirmState, setConfirmState] = (0, import_react.useState)(null);
   const [toasts, setToasts] = (0, import_react.useState)([]);
+  const { t } = (0, import_runtime2.useI18n)();
   const { modal, message } = (0, import_react.useMemo)(() => {
     const pushToast = (type, content) => {
       const id = Date.now() + Math.random();
@@ -481,8 +483,8 @@ function ShadcnInteractionProvider({
                 )
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(DialogFooter, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button, { type: "button", variant: "outline", onClick: handleCancel, children: "\u53D6\u6D88" }),
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button, { type: "button", onClick: handleOk, children: "\u786E\u5B9A" })
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button, { type: "button", variant: "outline", onClick: handleCancel, children: t("pactor.alertDialog.cancel") }),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button, { type: "button", onClick: handleOk, children: t("pactor.alertDialog.confirm") })
               ] })
             ] })
           }
@@ -516,9 +518,94 @@ function ShadcnInteractionProvider({
 
 // src/interaction/host.tsx
 var import_lucide_react2 = require("lucide-react");
-var import_runtime2 = require("@pactor-app/runtime");
+var import_runtime3 = require("@pactor-app/runtime");
 var import_react2 = require("react");
+
+// src/ui/drawer.tsx
+var import_vaul = require("vaul");
 var import_jsx_runtime4 = require("react/jsx-runtime");
+function Drawer({
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_vaul.Drawer.Root, { "data-slot": "drawer", ...props });
+}
+function DrawerPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_vaul.Drawer.Portal, { "data-slot": "drawer-portal", ...props });
+}
+function DrawerClose({
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_vaul.Drawer.Close, { "data-slot": "drawer-close", ...props });
+}
+function DrawerOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_vaul.Drawer.Overlay,
+    {
+      "data-slot": "drawer-overlay",
+      className: cn("fixed inset-0 z-50 bg-black/50", className),
+      ...props
+    }
+  );
+}
+function DrawerContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(DrawerPortal, { "data-slot": "drawer-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      import_vaul.Drawer.Content,
+      {
+        "data-slot": "drawer-content",
+        className: cn(
+          "group/drawer-content fixed z-50 flex h-auto flex-col border-border bg-background",
+          "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b",
+          "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t",
+          "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
+          "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
+          children
+        ]
+      }
+    )
+  ] });
+}
+function DrawerHeader({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "div",
+    {
+      "data-slot": "drawer-header",
+      className: cn("flex flex-col gap-1.5 p-4", className),
+      ...props
+    }
+  );
+}
+function DrawerTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_vaul.Drawer.Title,
+    {
+      "data-slot": "drawer-title",
+      className: cn("font-semibold text-foreground", className),
+      ...props
+    }
+  );
+}
+
+// src/interaction/host.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function toCssWidth(width) {
   if (width === void 0) {
     return void 0;
@@ -526,7 +613,7 @@ function toCssWidth(width) {
   return typeof width === "number" ? `${width}px` : width;
 }
 function ShadcnOverlayHost({ manager, resolvePage }) {
-  const renderer = (0, import_runtime2.useRenderer)();
+  const renderer = (0, import_runtime3.useRenderer)();
   const stack = (0, import_react2.useSyncExternalStore)(
     (onChange) => manager.subscribe(onChange),
     () => manager.stack()
@@ -542,7 +629,7 @@ function ShadcnOverlayHost({ manager, resolvePage }) {
     },
     () => `${renderer.context.state.getVersion()}:${renderer.context.data.getVersion()}`
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: stack.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: stack.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     OverlayEntryView,
     {
       entry,
@@ -559,6 +646,7 @@ function OverlayEntryView({
   renderer,
   resolvePage
 }) {
+  const { t } = (0, import_runtime3.useI18n)();
   const handleCancel = () => manager.close(entry.id);
   let body = null;
   if (entry.content) {
@@ -567,7 +655,7 @@ function OverlayEntryView({
       parent: manager.parentScopeOf(entry.id)
     });
   } else if (entry.page) {
-    body = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    body = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       PageOverlayBody,
       {
         entry,
@@ -577,9 +665,9 @@ function OverlayEntryView({
     );
   }
   if (entry.type === "drawer") {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ShadcnDrawerView, { entry, onCancel: handleCancel, children: body });
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ShadcnDrawerView, { entry, onCancel: handleCancel, children: body });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     Dialog,
     {
       open: true,
@@ -588,7 +676,7 @@ function OverlayEntryView({
           handleCancel();
         }
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
         DialogContent,
         {
           "data-slot": "overlay-modal",
@@ -596,25 +684,25 @@ function OverlayEntryView({
           style: entry.width === void 0 ? void 0 : { width: toCssWidth(entry.width) },
           showCloseButton: false,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(DialogHeader, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DialogTitle, { children: entry.title ?? "" }),
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(DialogHeader, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogTitle, { children: entry.title ?? "" }),
+              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
                 DialogClose,
                 {
-                  render: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  render: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
                     "button",
                     {
                       type: "button",
                       "data-slot": "overlay-modal-close",
-                      "aria-label": "\u5173\u95ED",
+                      "aria-label": t("pactor.overlay.close"),
                       className: "absolute top-4 right-4 cursor-pointer rounded-xs opacity-70 transition-opacity hover:opacity-100 focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-none",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.XIcon, { className: "size-4" })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react2.XIcon, { className: "size-4" })
                     }
                   )
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { "data-slot": "overlay-modal-body", children: body })
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { "data-slot": "overlay-modal-body", children: body })
           ]
         }
       )
@@ -626,64 +714,51 @@ function ShadcnDrawerView({
   onCancel,
   children
 }) {
-  (0, import_react2.useEffect)(() => {
-    const handleKeyDown = (event) => {
-      if (event.key === "Escape") {
-        onCancel();
-      }
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    return () => {
-      document.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [onCancel]);
+  const { t } = (0, import_runtime3.useI18n)();
   const panelStyle = entry.width === void 0 ? void 0 : { width: toCssWidth(entry.width) };
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { "data-slot": "drawer-root", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      "div",
-      {
-        "data-slot": "drawer-mask",
-        "data-testid": "drawer-mask",
-        className: "fixed inset-0 z-50 bg-black/50",
-        onClick: onCancel
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-      "div",
-      {
-        "data-slot": "drawer-panel",
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-label": entry.title,
-        style: panelStyle,
-        className: "fixed inset-y-0 right-0 z-50 flex w-96 max-w-full flex-col border-l border-border bg-background shadow-lg",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-            "div",
-            {
-              "data-slot": "drawer-header",
-              className: "flex items-center justify-between border-b border-border px-6 py-4",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-lg font-semibold", children: entry.title ?? "" }),
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                  "button",
-                  {
-                    type: "button",
-                    "data-slot": "drawer-close",
-                    "aria-label": "\u5173\u95ED",
-                    className: "cursor-pointer rounded-xs opacity-70 transition-opacity hover:opacity-100 focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-none",
-                    onClick: onCancel,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.XIcon, { className: "size-4" })
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { "data-slot": "drawer-body", className: "flex-1 overflow-auto p-6", children })
-        ]
-      }
-    )
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    Drawer,
+    {
+      direction: "right",
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) {
+          onCancel();
+        }
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        DrawerContent,
+        {
+          "data-slot": "drawer-panel",
+          className: cn(entry.width !== void 0 && "sm:max-w-none"),
+          style: panelStyle,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+              DrawerHeader,
+              {
+                "data-slot": "drawer-header",
+                className: "flex flex-row items-center justify-between border-b border-border px-6 py-4",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DrawerTitle, { className: "text-lg", children: entry.title ?? "" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DrawerClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                    "button",
+                    {
+                      type: "button",
+                      "data-slot": "drawer-close",
+                      "aria-label": t("pactor.overlay.close"),
+                      className: "cursor-pointer rounded-xs opacity-70 transition-opacity hover:opacity-100 focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-none",
+                      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react2.XIcon, { className: "size-4" })
+                    }
+                  ) })
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { "data-slot": "drawer-body", className: "flex-1 overflow-auto p-6", children })
+          ]
+        }
+      )
+    }
+  );
 }
 function PageOverlayBody({
   entry,
@@ -710,7 +785,7 @@ function PageOverlayBody({
           return;
         }
         const host = renderer.context;
-        created = (0, import_runtime2.createPageRuntime)(pageDsl, {
+        created = (0, import_runtime3.createPageRuntime)(pageDsl, {
           app: host.app,
           user: host.user,
           components: host.components,
@@ -734,12 +809,12 @@ function PageOverlayBody({
     };
   }, [entry.id]);
   if (error) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { role: "alert", children: error.message });
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { role: "alert", children: error.message });
   }
   if (!child) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_runtime2.PageRuntimeView, { runtime: child });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_runtime3.PageRuntimeView, { runtime: child });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/interaction/index.d.cts

@@ -125,8 +125,10 @@ declare function createUiBridge(): UiBridge;
  * - `confirm`：`params.title` / `params.content` → UiBridge 注入的
  *   modal.confirm，确认返回 data `true`，取消返回 `false`；UiBridge
  *   未注入 modal 时返回 `{ ok: false }` 受控失败
- * - `message`：`params.type`（success / error / info / warning，缺省
- *   info）+ `params.text` → UiBridge 注入的 message；未注入时受控失败
+ * - `message`：`params.messageType`（success / error / info / warning，
+ *   缺省 info；推荐别名——params 带 `type` 键会被动作引擎 isOpaque
+ *   约定跳过表达式求值）+ `params.text` → UiBridge 注入的 message；
+ *   未注入时受控失败。`params.type` 保留为兼容别名（静态文案可用）
  *
  * 已注册的同名动作不会被覆盖（与 registerBuiltinActions 同约定）。
  */
@@ -164,9 +166,9 @@ interface OverlayHostProps {
 /**
  * ShadcnOverlayHost：与 pactor-interaction 的 OverlayHost（antd 版）契约一致——
  * 订阅同一 OverlayManager 堆栈逐条渲染；type 为 modal 用 vendored shadcn
- * Dialog、drawer 用自绘固定右侧面板 + 遮罩（无 drawer 原语）；title/width
- * 原样应用；UI 取消（X / 遮罩 / Escape）触发取消语义 close（resolve
- * `{ success: false }`）。
+ * Dialog、drawer 用 vendored drawer 原语（vaul，与 DSL 弹层适配器同一套
+ * src/ui 原语，design D4）；title/width 原样应用；UI 取消（X / 遮罩 /
+ * Escape）触发取消语义 close（resolve `{ success: false }`）。
  *
  * 与 antd 版相同：必须位于 PageRuntime 的 React Context 之内；DSL content
  * 经当前 Renderer 的 `renderChildren` 渲染，作用域注入

package/dist/interaction/index.d.ts

@@ -125,8 +125,10 @@ declare function createUiBridge(): UiBridge;
  * - `confirm`：`params.title` / `params.content` → UiBridge 注入的
  *   modal.confirm，确认返回 data `true`，取消返回 `false`；UiBridge
  *   未注入 modal 时返回 `{ ok: false }` 受控失败
- * - `message`：`params.type`（success / error / info / warning，缺省
- *   info）+ `params.text` → UiBridge 注入的 message；未注入时受控失败
+ * - `message`：`params.messageType`（success / error / info / warning，
+ *   缺省 info；推荐别名——params 带 `type` 键会被动作引擎 isOpaque
+ *   约定跳过表达式求值）+ `params.text` → UiBridge 注入的 message；
+ *   未注入时受控失败。`params.type` 保留为兼容别名（静态文案可用）
  *
  * 已注册的同名动作不会被覆盖（与 registerBuiltinActions 同约定）。
  */
@@ -164,9 +166,9 @@ interface OverlayHostProps {
 /**
  * ShadcnOverlayHost：与 pactor-interaction 的 OverlayHost（antd 版）契约一致——
  * 订阅同一 OverlayManager 堆栈逐条渲染；type 为 modal 用 vendored shadcn
- * Dialog、drawer 用自绘固定右侧面板 + 遮罩（无 drawer 原语）；title/width
- * 原样应用；UI 取消（X / 遮罩 / Escape）触发取消语义 close（resolve
- * `{ success: false }`）。
+ * Dialog、drawer 用 vendored drawer 原语（vaul，与 DSL 弹层适配器同一套
+ * src/ui 原语，design D4）；title/width 原样应用；UI 取消（X / 遮罩 /
+ * Escape）触发取消语义 close（resolve `{ success: false }`）。
  *
  * 与 antd 版相同：必须位于 PageRuntime 的 React Context 之内；DSL content
  * 经当前 Renderer 的 `renderChildren` 渲染，作用域注入