@cut-workbench/workbench 0.2.0 → 0.3.0

package/dist/index.cjs

@@ -1,8 +1,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_format = require("./format--DhqHMgX.cjs");
+const require_notify = require("./notify-CMNwDFGw.cjs");
 let react_dom_client = require("react-dom/client");
 let react = require("react");
-react = require_format.__toESM(react, 1);
+react = require_notify.__toESM(react, 1);
 let _cut_workbench_core_engine = require("@cut-workbench/core/engine");
 let _cut_workbench_core = require("@cut-workbench/core");
 let _cut_workbench_react = require("@cut-workbench/react");
@@ -36,7 +36,7 @@ let zustand_vanilla = require("zustand/vanilla");
 */
 function AppShell({ topBar, left, center, right, timeline, leftWidth, rightWidth, timelineHeight, leftResizer, rightResizer, timelineResizer, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("flex h-full min-h-0 flex-col bg-background", className),
+		className: require_notify.cn("flex h-full min-h-0 flex-col bg-background", className),
 		children: [
 			topBar,
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -106,7 +106,7 @@ function Button({ className, variant = "default", size = "default", asChild = fa
 		"data-slot": "button",
 		"data-variant": variant,
 		"data-size": size,
-		className: require_format.cn(buttonVariants({
+		className: require_notify.cn(buttonVariants({
 			variant,
 			size,
 			className
@@ -120,7 +120,7 @@ function Separator({ className, orientation = "horizontal", decorative = true, .
 		"data-slot": "separator",
 		decorative,
 		orientation,
-		className: require_format.cn("shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px", className),
+		className: require_notify.cn("shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px", className),
 		...props
 	});
 }
@@ -199,7 +199,7 @@ function TooltipContent({ className, sideOffset = 0, children, ...props }) {
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Tooltip.Content, {
 			"data-slot": "tooltip-content",
 			sideOffset,
-			className: require_format.cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-md bg-foreground px-3 py-1.5 text-xs text-balance text-background fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", className),
+			className: require_notify.cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-md bg-foreground px-3 py-1.5 text-xs text-balance text-background fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", className),
 			...props,
 			children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tooltip.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" })]
 		})
@@ -226,7 +226,7 @@ function PopoverContent({ className, align = "center", sideOffset = 4, ...props
 			"data-slot": "popover-content",
 			align,
 			sideOffset,
-			className: require_format.cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
+			className: require_notify.cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
 			...props
 		})
 	});
@@ -237,7 +237,7 @@ function CapabilityBadge({ info }) {
 	const { status, report, summary } = info;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Popover, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverTrigger, {
 		asChild: true,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_format.Badge, {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_notify.Badge, {
 			variant: "outline",
 			className: "cursor-pointer gap-1 text-[11px] font-normal select-none",
 			children: [status === "checking" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Loader2, { className: "size-3 animate-spin" }) : status === "ready" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CheckCircle2, { className: "size-3 text-success" }) : status === "degraded" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlertTriangle, { className: "size-3 text-warning" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.XCircle, { className: "size-3 text-destructive" }), summary]
@@ -306,44 +306,6 @@ function Row$1({ label, ok, optional }) {
 		})]
 	});
 }
-// src/context.tsx
-/**
-* 工作台自身的 Context：UI 状态（面板尺寸 / 缩放 / 对话框）+ 宿主桥。
-*
-* 与 `@cut-workbench/react` 的编辑器 Context 分开：编辑器是「数据与引擎」，
-* 这里是「某一次挂载的布局与交互」。两者生命周期可以不同（例如宿主切换项目时
-* 复用同一个编辑器、只重建 UI）。
-*/
-var WorkbenchContext = (0, react.createContext)(null);
-function useWorkbench() {
-	const value = (0, react.useContext)(WorkbenchContext);
-	if (value == null) throw new Error("[cut-workbench] 缺少 <WorkbenchProvider>：组件必须挂在工作台内部");
-	return value;
-}
-/** 订阅 UI 状态（带 selector） */
-function useUi(selector) {
-	const { ui } = useWorkbench();
-	return (0, react.useSyncExternalStore)(ui.subscribe, () => selector(ui.getState()), () => selector(ui.getState()));
-}
-/** 取 UI store 本体（事件回调里读写用） */
-function useUiStoreApi() {
-	return useWorkbench().ui;
-}
-/** 默认功能开关 */
-var DEFAULT_FEATURES = {
-	mediaLibrary: true,
-	preview: true,
-	timeline: true,
-	inspector: true,
-	export: true,
-	canvasSettings: true,
-	lab: false
-};
-var DEFAULT_CONFIG = {
-	features: DEFAULT_FEATURES,
-	keyboard: "global",
-	resizable: true
-};
 // src/components/layout/WorkbenchToolbar.tsx
 /**
 * 内置顶栏（WorkbenchToolbar）。
@@ -368,9 +330,9 @@ function WorkbenchToolbar({ capability, onExport, onSaveProject, onOpenProject,
 	const redo = (0, _cut_workbench_react.useEditor)((s) => s.redo);
 	const canUndo = (0, _cut_workbench_react.useHistory)((s) => s.past.length > 0);
 	const canRedo = (0, _cut_workbench_react.useHistory)((s) => s.future.length > 0);
-	const route = useUi((s) => s.route);
-	const setRoute = useUi((s) => s.setRoute);
-	const openDialog = useUi((s) => s.openDialog);
+	const route = require_notify.useUi((s) => s.route);
+	const setRoute = require_notify.useUi((s) => s.setRoute);
+	const openDialog = require_notify.useUi((s) => s.openDialog);
 	const clipCount = (0, _cut_workbench_react.useEditor)((s) => s.project.clips.length);
 	const projectWidth = (0, _cut_workbench_react.useEditor)((s) => s.project.width);
 	const projectHeight = (0, _cut_workbench_react.useEditor)((s) => s.project.height);
@@ -530,7 +492,7 @@ function ProjectTitle({ name, dirty, placeholder, editable, onRename }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "flex min-w-0 items-center gap-1.5",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: require_format.cn("truncate text-sm font-medium", editable && "cursor-text"),
+			className: require_notify.cn("truncate text-sm font-medium", editable && "cursor-text"),
 			title: editable ? "双击重命名" : name.length > 0 ? name : placeholder,
 			onDoubleClick: editable ? () => {
 				setDraft(name.length > 0 ? name : "");
@@ -621,8 +583,8 @@ function PanelResizer({ orientation, value, min, max, invert, onChange, classNam
 		"aria-orientation": isVertical ? "vertical" : "horizontal",
 		"aria-label": label,
 		onPointerDown,
-		className: require_format.cn("group relative z-20 shrink-0 touch-none transition-colors", isVertical ? "w-1 cursor-col-resize" : "h-1 cursor-row-resize", dragging ? "bg-primary/60" : "bg-border hover:bg-primary/40", className),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: require_format.cn("absolute", isVertical ? "-left-1 -right-1 inset-y-0" : "-top-1 -bottom-1 inset-x-0") })
+		className: require_notify.cn("group relative z-20 shrink-0 touch-none transition-colors", isVertical ? "w-1 cursor-col-resize" : "h-1 cursor-row-resize", dragging ? "bg-primary/60" : "bg-border hover:bg-primary/40", className),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: require_notify.cn("absolute", isVertical ? "-left-1 -right-1 inset-y-0" : "-top-1 -bottom-1 inset-x-0") })
 	});
 }
 // src/components/common/LoadingOverlay.tsx
@@ -630,7 +592,7 @@ function PanelResizer({ orientation, value, min, max, invert, onChange, classNam
 function LoadingOverlay({ visible, title = "处理中…", description, progress, className, fullscreen, children }) {
 	if (!visible) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_format.cn("z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm", fullscreen ? "fixed inset-0" : "absolute inset-0", className),
+		className: require_notify.cn("z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm", fullscreen ? "fixed inset-0" : "absolute inset-0", className),
 		role: "status",
 		"aria-live": "polite",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -711,18 +673,18 @@ function UnsupportedBrowser({ report, loading, error }) {
 	const dependenciesMissing = missing.length > 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "flex min-h-screen items-center justify-center bg-background p-6",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_format.Card, {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_notify.Card, {
 			className: "w-full max-w-2xl",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_format.CardHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_notify.CardHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex items-center gap-2 text-destructive",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlertOctagon, { className: "size-5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_format.CardTitle, {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlertOctagon, { className: "size-5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_notify.CardTitle, {
 					className: "text-base",
 					children: dependenciesMissing ? "缺少引擎依赖" : "当前浏览器无法运行本应用"
 				})]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: "text-sm text-muted-foreground",
 				children: dependenciesMissing ? "工作台的预览与导出依赖 WebAV（@webav/av-cliper、@webav/av-canvas）。当前项目里没有解析到它们。" : "WebAV 依赖 WebCodecs 与 OPFS，仅支持 Chromium 内核浏览器。请使用最新版 Chrome 或 Edge（非无痕模式）重新打开。"
-			})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_format.CardContent, {
+			})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_notify.CardContent, {
 				className: "space-y-4",
 				children: [
 					dependenciesMissing && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -816,7 +778,7 @@ var Toaster = (props) => {
 function Textarea({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
 		"data-slot": "textarea",
-		className: require_format.cn("flex field-sizing-content min-h-16 w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40", className),
+		className: require_notify.cn("flex field-sizing-content min-h-16 w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40", className),
 		...props
 	});
 }
@@ -824,7 +786,7 @@ function Textarea({ className, ...props }) {
 function Label({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Label.Root, {
 		"data-slot": "label",
-		className: require_format.cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
+		className: require_notify.cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
 		...props
 	});
 }
@@ -832,7 +794,7 @@ function Label({ className, ...props }) {
 function ScrollArea({ className, children, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.ScrollArea.Root, {
 		"data-slot": "scroll-area",
-		className: require_format.cn("relative", className),
+		className: require_notify.cn("relative", className),
 		...props,
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ScrollArea.Viewport, {
@@ -849,7 +811,7 @@ function ScrollBar({ className, orientation = "vertical", ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ScrollArea.ScrollAreaScrollbar, {
 		"data-slot": "scroll-area-scrollbar",
 		orientation,
-		className: require_format.cn("flex touch-none p-px transition-colors select-none", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent", className),
+		className: require_notify.cn("flex touch-none p-px transition-colors select-none", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ScrollArea.ScrollAreaThumb, {
 			"data-slot": "scroll-area-thumb",
@@ -888,7 +850,7 @@ function DialogPortal({ ...props }) {
 function DialogOverlay({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Dialog.Overlay, {
 		"data-slot": "dialog-overlay",
-		className: require_format.cn("fixed inset-0 z-50 bg-overlay data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className),
+		className: require_notify.cn("fixed inset-0 z-50 bg-overlay data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className),
 		...props
 	});
 }
@@ -897,7 +859,7 @@ function DialogContent({ className, children, showCloseButton = true, ...props }
 		"data-slot": "dialog-portal",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogOverlay, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Dialog.Content, {
 			"data-slot": "dialog-content",
-			className: require_format.cn("fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg", className),
+			className: require_notify.cn("fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg", className),
 			...props,
 			children: [children, showCloseButton && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Dialog.Close, {
 				"data-slot": "dialog-close",
@@ -913,14 +875,14 @@ function DialogContent({ className, children, showCloseButton = true, ...props }
 function DialogHeader({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "dialog-header",
-		className: require_format.cn("flex flex-col gap-2 text-center sm:text-left", className),
+		className: require_notify.cn("flex flex-col gap-2 text-center sm:text-left", className),
 		...props
 	});
 }
 function DialogFooter({ className, showCloseButton = false, children, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		"data-slot": "dialog-footer",
-		className: require_format.cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
+		className: require_notify.cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
 		...props,
 		children: [children, showCloseButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Dialog.Close, {
 			asChild: true,
@@ -934,14 +896,14 @@ function DialogFooter({ className, showCloseButton = false, children, ...props }
 function DialogTitle({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Dialog.Title, {
 		"data-slot": "dialog-title",
-		className: require_format.cn("text-lg leading-none font-semibold", className),
+		className: require_notify.cn("text-lg leading-none font-semibold", className),
 		...props
 	});
 }
 function DialogDescription({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Dialog.Description, {
 		"data-slot": "dialog-description",
-		className: require_format.cn("text-sm text-muted-foreground", className),
+		className: require_notify.cn("text-sm text-muted-foreground", className),
 		...props
 	});
 }
@@ -970,7 +932,7 @@ function DropdownMenuContent({ className, sideOffset = 4, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DropdownMenuPortal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.DropdownMenu.Content, {
 		"data-slot": "dropdown-menu-content",
 		sideOffset,
-		className: require_format.cn("z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
+		className: require_notify.cn("z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
 		...props
 	}) });
 }
@@ -979,7 +941,7 @@ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
 		"data-slot": "dropdown-menu-item",
 		"data-inset": inset,
 		"data-variant": variant,
-		className: require_format.cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!", className),
+		className: require_notify.cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!", className),
 		...props
 	});
 }
@@ -987,14 +949,14 @@ function DropdownMenuLabel({ className, inset, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.DropdownMenu.Label, {
 		"data-slot": "dropdown-menu-label",
 		"data-inset": inset,
-		className: require_format.cn("px-2 py-1.5 text-sm font-medium data-[inset]:pl-8", className),
+		className: require_notify.cn("px-2 py-1.5 text-sm font-medium data-[inset]:pl-8", className),
 		...props
 	});
 }
 function DropdownMenuSeparator({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.DropdownMenu.Separator, {
 		"data-slot": "dropdown-menu-separator",
-		className: require_format.cn("-mx-1 my-1 h-px bg-border", className),
+		className: require_notify.cn("-mx-1 my-1 h-px bg-border", className),
 		...props
 	});
 }
@@ -1002,7 +964,7 @@ function DropdownMenuSeparator({ className, ...props }) {
 /** 统一空态：图标 + 标题 + 说明 + 可选操作 */
 function EmptyState({ icon: Icon, title, description, action, className, compact }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("flex flex-col items-center justify-center gap-2 text-center", compact ? "px-4 py-6" : "px-6 py-12", className),
+		className: require_notify.cn("flex flex-col items-center justify-center gap-2 text-center", compact ? "px-4 py-6" : "px-6 py-12", className),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: "flex size-10 items-center justify-center rounded-full bg-muted text-muted-foreground",
@@ -1020,8 +982,164 @@ function EmptyState({ icon: Icon, title, description, action, className, compact
 		]
 	});
 }
+// src/features/media-library/lib/pick-files.ts
+var INPUT_ID = "cut-workbench-file-input";
+/** 内置回退：隐藏 input，选完即弃 */
+function pickWithInput(accept, multiple) {
+	return new Promise((resolve) => {
+		const input = document.createElement("input");
+		input.type = "file";
+		input.id = INPUT_ID;
+		input.multiple = multiple;
+		if (accept.length > 0) input.accept = accept.join(",");
+		input.style.display = "none";
+		document.body.appendChild(input);
+		const finish = (files) => {
+			input.remove();
+			resolve(files);
+		};
+		input.addEventListener("change", () => finish(Array.from(input.files ?? [])), { once: true });
+		window.addEventListener("focus", () => {
+			window.setTimeout(() => {
+				if (document.body.contains(input)) finish([]);
+			}, 300);
+		}, { once: true });
+		input.click();
+	});
+}
+/**
+* @returns 选中的文件；用户取消时为空数组
+*/
+async function pickMediaFiles(bridge, options) {
+	const multiple = options.multiple ?? true;
+	if (bridge?.files?.pickFiles != null) {
+		const result = await bridge.files.pickFiles({
+			accept: options.accept,
+			multiple,
+			description: options.description
+		});
+		if (result != null) return result;
+	}
+	return pickWithInput(options.accept, multiple);
+}
+// src/features/media-library/hooks/useMediaImport.ts
+var ACCEPT = [
+	"video/mp4",
+	"audio/*",
+	"image/*",
+	".srt",
+	"text/plain"
+];
+/**
+* 找出可以「重连」的素材。
+*
+* 场景：刷新后工程从 IndexedDB 恢复，但素材二进制消失（File 无法持久化）。
+* 用户重新导入同一个文件时，复用原 assetId，时间轴上已有片段立即恢复。
+* 匹配条件：同名 + 同类型 + 当前确实缺少二进制。
+*/
+function findReconnectableAssetId(state, file, registry) {
+	if (state.missingAssetIds.length === 0) return null;
+	return state.assets.find((asset) => state.missingAssetIds.includes(asset.id) && asset.name === file.name && registry.getFile(asset.id) == null)?.id ?? null;
+}
+/**
+* 批量导入素材。
+*
+* - 串行处理，避免同时开辟多个解码器把内存打爆；
+* - 单个文件失败只影响自身，最后汇总 toast；
+* - 进度写在本地 state（不放进 store，避免高频更新引起全局重渲染）；
+* - 若与「缺失源文件」的素材同名同类型，则重连而不是新增。
+*/
+function useMediaImport() {
+	const editor = (0, _cut_workbench_react.useCutEditor)();
+	const clips = editor.runtime.clips;
+	const store = editor.store;
+	const [progress, setProgress] = (0, react.useState)([]);
+	const [importing, setImporting] = (0, react.useState)(false);
+	const addAsset = (0, _cut_workbench_react.useEditor)((s) => s.addAsset);
+	const replaceAsset = (0, _cut_workbench_react.useEditor)((s) => s.replaceAsset);
+	const clearMissing = (0, _cut_workbench_react.useEditor)((s) => s.clearMissing);
+	const selectAsset = (0, _cut_workbench_react.useEditor)((s) => s.selectAsset);
+	const beginImport = require_notify.useUi((s) => s.beginImport);
+	const endImport = require_notify.useUi((s) => s.endImport);
+	const { bridge } = require_notify.useWorkbench();
+	return {
+		importing,
+		progress,
+		importFiles: (0, react.useCallback)(async (files) => {
+			if (files.length === 0) return [];
+			setImporting(true);
+			beginImport();
+			setProgress(files.map((f) => ({
+				name: f.name,
+				progress: 0
+			})));
+			const imported = [];
+			const failures = [];
+			let reconnected = 0;
+			for (let i = 0; i < files.length; i += 1) {
+				const file = files[i];
+				if (!file) continue;
+				try {
+					const reconnectId = findReconnectableAssetId(store.getState(), file, clips);
+					const result = await (0, _cut_workbench_core_engine.importFile)(clips, file, (p) => {
+						setProgress((prev) => prev.map((item, index) => index === i ? {
+							...item,
+							progress: p
+						} : item));
+					});
+					if (reconnectId != null) {
+						clips.replaceAssetSource(reconnectId, file, result.master ?? null);
+						replaceAsset(reconnectId, result.asset);
+						clearMissing(reconnectId);
+						imported.push({
+							...result.asset,
+							id: reconnectId
+						});
+						reconnected += 1;
+					} else {
+						addAsset(result.asset);
+						imported.push(result.asset);
+					}
+				} catch (err) {
+					const message = err instanceof _cut_workbench_core_engine.UnsupportedFileError ? err.message : err instanceof Error ? err.message : String(err);
+					failures.push(`${file.name}：${message}`);
+					setProgress((prev) => prev.map((item, index) => index === i ? {
+						...item,
+						error: message
+					} : item));
+				}
+			}
+			setImporting(false);
+			endImport();
+			if (imported.length > 0) {
+				selectAsset(imported[0]?.id ?? null);
+				require_notify.notify(bridge, {
+					level: "success",
+					title: reconnected > 0 ? `已导入 ${imported.length} 个素材（其中 ${reconnected} 个重连到已有片段）` : `已导入 ${imported.length} 个素材`
+				});
+			}
+			if (failures.length > 0) require_notify.notify(bridge, {
+				level: "error",
+				title: `${failures.length} 个文件导入失败`,
+				description: failures.slice(0, 3).join("\n"),
+				duration: 8e3
+			});
+			window.setTimeout(() => setProgress([]), 3e3);
+			return imported;
+		}, [
+			addAsset,
+			beginImport,
+			bridge,
+			clearMissing,
+			endImport,
+			replaceAsset,
+			selectAsset
+		])
+	};
+}
 // src/features/media-library/components/DropZone.tsx
-var ACCEPT = {
+/** react-dropzone 用的 MIME → 扩展名映射 */
+var DROPZONE_ACCEPT = {
 	"video/mp4": [".mp4", ".m4v"],
 	"audio/*": [
 		".mp3",
@@ -1044,28 +1162,51 @@ var ACCEPT = {
 /**
 * 拖拽 / 点击导入区域。
 *
+* 两条入口：
+* - **拖拽**：走 react-dropzone（宿主无法介入，这是浏览器原生行为）；
+* - **点击**：优先走 `HostBridge.files.pickFiles` —— 宿主可能不用系统文件
+*   对话框，而是从自己的素材库 / 云端 / URL 导入。宿主返回 `null`（不接管）
+*   时才回退到内置 `<input type=file>`。
+*
 * 注意：react-dropzone 的 accept 只做初筛，真正按 MIME + 扩展名校验在
 * core/media/file-reader，从而保证「拖入 .webm 得到明确错误」而不是被静默拒绝。
 */
 function DropZone({ onFiles, disabled, className, compact }) {
-	const { getRootProps, getInputProps, isDragActive, open } = (0, react_dropzone.useDropzone)({
+	const { bridge } = require_notify.useWorkbench();
+	const { getRootProps, getInputProps, isDragActive } = (0, react_dropzone.useDropzone)({
 		onDrop: (accepted) => {
 			if (accepted.length > 0) onFiles(accepted);
 		},
-		noClick: compact,
-		noKeyboard: compact,
+		noClick: true,
+		noKeyboard: true,
 		multiple: true,
 		disabled,
-		accept: ACCEPT
-	});
+		accept: DROPZONE_ACCEPT
+	});
+	const handleClick = (0, react.useCallback)(() => {
+		if (disabled) return;
+		pickMediaFiles(bridge, {
+			accept: ACCEPT,
+			multiple: true,
+			description: "选择要导入的素材"
+		}).then((files) => {
+			if (files.length > 0) onFiles(files);
+		});
+	}, [
+		bridge,
+		disabled,
+		onFiles
+	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		...getRootProps(),
-		className: require_format.cn("group relative flex cursor-pointer flex-col items-center justify-center gap-1.5 rounded-lg border border-dashed text-center transition-colors", compact ? "px-3 py-2.5" : "px-4 py-8", isDragActive ? "border-primary bg-primary/10" : "border-border hover:border-primary/60 hover:bg-muted/40", disabled && "pointer-events-none opacity-50", className),
+		onClick: handleClick,
+		"data-drop-zone": "",
+		className: require_notify.cn("group relative flex cursor-pointer flex-col items-center justify-center gap-1.5 rounded-lg border border-dashed text-center transition-colors", compact ? "px-3 py-2.5" : "px-4 py-8", isDragActive ? "border-primary bg-primary/10" : "border-border hover:border-primary/60 hover:bg-muted/40", disabled && "pointer-events-none opacity-50", className),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", { ...getInputProps() }),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex items-center gap-2 text-sm font-medium",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Upload, { className: require_format.cn("text-muted-foreground", compact ? "size-3.5" : "size-4") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: compact ? "导入素材" : isDragActive ? "松开以导入" : "拖入文件，或点击选择" })]
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Upload, { className: require_notify.cn("text-muted-foreground", compact ? "size-3.5" : "size-4") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: compact ? "导入素材" : isDragActive ? "松开以导入" : "拖入文件，或点击选择" })]
 			}),
 			!compact && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: "text-xs text-muted-foreground",
@@ -1076,7 +1217,7 @@ function DropZone({ onFiles, disabled, className, compact }) {
 				className: "sr-only",
 				onClick: (e) => {
 					e.stopPropagation();
-					open();
+					handleClick();
 				},
 				children: "选择文件"
 			})
@@ -1087,7 +1228,7 @@ function DropZone({ onFiles, disabled, className, compact }) {
 function Skeleton({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "skeleton",
-		className: require_format.cn("animate-pulse rounded-md bg-accent", className),
+		className: require_notify.cn("animate-pulse rounded-md bg-accent", className),
 		...props
 	});
 }
@@ -1136,7 +1277,7 @@ function MediaCard({ asset, selected, missing, onSelect, onAddToTimeline, onShow
 		onKeyDown: (e) => {
 			if (e.key === "Enter") onAddToTimeline();
 		},
-		className: require_format.cn("group relative flex cursor-pointer flex-col gap-1.5 rounded-lg border p-1.5 text-left transition-colors outline-none", missing ? "border-warning/50 bg-warning/5" : selected ? "border-primary bg-primary/10 ring-1 ring-primary/40" : "border-border bg-card hover:border-primary/40 hover:bg-muted/40 focus-visible:border-primary"),
+		className: require_notify.cn("group relative flex cursor-pointer flex-col gap-1.5 rounded-lg border p-1.5 text-left transition-colors outline-none", missing ? "border-warning/50 bg-warning/5" : selected ? "border-primary bg-primary/10 ring-1 ring-primary/40" : "border-border bg-card hover:border-primary/40 hover:bg-muted/40 focus-visible:border-primary"),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "relative aspect-video w-full overflow-hidden rounded-md bg-muted",
@@ -1157,7 +1298,7 @@ function MediaCard({ asset, selected, missing, onSelect, onAddToTimeline, onShow
 							opacity: .9
 						})
 					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: require_format.cn("flex size-full items-center justify-center", kind.tone),
+						className: require_notify.cn("flex size-full items-center justify-center", kind.tone),
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "size-7" })
 					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
@@ -1204,7 +1345,7 @@ function MediaCard({ asset, selected, missing, onSelect, onAddToTimeline, onShow
 					children: asset.name
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
 					className: "truncate text-[10px] text-muted-foreground",
-					children: [asset.kind === "audio" ? `${require_format.formatBytes(asset.size)} · 48kHz 双声道` : asset.kind === "text" || asset.kind === "subtitle" ? `${require_format.formatResolution(asset.width, asset.height)}` : `${require_format.formatResolution(asset.width, asset.height)} · ${require_format.formatBytes(asset.size)}`, asset.hasAudio ? " · 含音轨" : ""]
+					children: [asset.kind === "audio" ? `${require_notify.formatBytes(asset.size)} · 48kHz 双声道` : asset.kind === "text" || asset.kind === "subtitle" ? `${require_notify.formatResolution(asset.width, asset.height)}` : `${require_notify.formatResolution(asset.width, asset.height)} · ${require_notify.formatBytes(asset.size)}`, asset.hasAudio ? " · 含音轨" : ""]
 				})]
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DropdownMenuTrigger, {
@@ -1246,7 +1387,7 @@ function MediaGrid({ assets, selectedAssetId, missingAssetIds = [], progress, on
 		className: "grid grid-cols-2 gap-2.5 p-2.5",
 		children: [
 			progress.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: require_format.cn("flex flex-col gap-1.5 rounded-lg border border-dashed p-1.5", item.error != null && "border-destructive/50 bg-destructive/5"),
+				className: require_notify.cn("flex flex-col gap-1.5 rounded-lg border border-dashed p-1.5", item.error != null && "border-destructive/50 bg-destructive/5"),
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Skeleton, { className: "aspect-video w-full rounded-md" }),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
@@ -1297,107 +1438,6 @@ function MediaGrid({ assets, selectedAssetId, missingAssetIds = [], progress, on
 		]
 	});
 }
-// src/features/media-library/hooks/useMediaImport.ts
-/**
-* 找出可以「重连」的素材。
-*
-* 场景：刷新后工程从 IndexedDB 恢复，但素材二进制消失（File 无法持久化）。
-* 用户重新导入同一个文件时，复用原 assetId，时间轴上已有片段立即恢复。
-* 匹配条件：同名 + 同类型 + 当前确实缺少二进制。
-*/
-function findReconnectableAssetId(state, file, registry) {
-	if (state.missingAssetIds.length === 0) return null;
-	return state.assets.find((asset) => state.missingAssetIds.includes(asset.id) && asset.name === file.name && registry.getFile(asset.id) == null)?.id ?? null;
-}
-/**
-* 批量导入素材。
-*
-* - 串行处理，避免同时开辟多个解码器把内存打爆；
-* - 单个文件失败只影响自身，最后汇总 toast；
-* - 进度写在本地 state（不放进 store，避免高频更新引起全局重渲染）；
-* - 若与「缺失源文件」的素材同名同类型，则重连而不是新增。
-*/
-function useMediaImport() {
-	const editor = (0, _cut_workbench_react.useCutEditor)();
-	const clips = editor.runtime.clips;
-	const store = editor.store;
-	const [progress, setProgress] = (0, react.useState)([]);
-	const [importing, setImporting] = (0, react.useState)(false);
-	const addAsset = (0, _cut_workbench_react.useEditor)((s) => s.addAsset);
-	const replaceAsset = (0, _cut_workbench_react.useEditor)((s) => s.replaceAsset);
-	const clearMissing = (0, _cut_workbench_react.useEditor)((s) => s.clearMissing);
-	const selectAsset = (0, _cut_workbench_react.useEditor)((s) => s.selectAsset);
-	const beginImport = useUi((s) => s.beginImport);
-	const endImport = useUi((s) => s.endImport);
-	return {
-		importing,
-		progress,
-		importFiles: (0, react.useCallback)(async (files) => {
-			if (files.length === 0) return [];
-			setImporting(true);
-			beginImport();
-			setProgress(files.map((f) => ({
-				name: f.name,
-				progress: 0
-			})));
-			const imported = [];
-			const failures = [];
-			let reconnected = 0;
-			for (let i = 0; i < files.length; i += 1) {
-				const file = files[i];
-				if (!file) continue;
-				try {
-					const reconnectId = findReconnectableAssetId(store.getState(), file, clips);
-					const result = await (0, _cut_workbench_core_engine.importFile)(clips, file, (p) => {
-						setProgress((prev) => prev.map((item, index) => index === i ? {
-							...item,
-							progress: p
-						} : item));
-					});
-					if (reconnectId != null) {
-						clips.replaceAssetSource(reconnectId, file, result.master ?? null);
-						replaceAsset(reconnectId, result.asset);
-						clearMissing(reconnectId);
-						imported.push({
-							...result.asset,
-							id: reconnectId
-						});
-						reconnected += 1;
-					} else {
-						addAsset(result.asset);
-						imported.push(result.asset);
-					}
-				} catch (err) {
-					const message = err instanceof _cut_workbench_core_engine.UnsupportedFileError ? err.message : err instanceof Error ? err.message : String(err);
-					failures.push(`${file.name}：${message}`);
-					setProgress((prev) => prev.map((item, index) => index === i ? {
-						...item,
-						error: message
-					} : item));
-				}
-			}
-			setImporting(false);
-			endImport();
-			if (imported.length > 0) {
-				selectAsset(imported[0]?.id ?? null);
-				sonner.toast.success(reconnected > 0 ? `已导入 ${imported.length} 个素材（其中 ${reconnected} 个重连到已有片段）` : `已导入 ${imported.length} 个素材`);
-			}
-			if (failures.length > 0) sonner.toast.error(`${failures.length} 个文件导入失败`, {
-				description: failures.slice(0, 3).join("\n"),
-				duration: 8e3
-			});
-			window.setTimeout(() => setProgress([]), 3e3);
-			return imported;
-		}, [
-			addAsset,
-			beginImport,
-			clearMissing,
-			endImport,
-			replaceAsset,
-			selectAsset
-		])
-	};
-}
 // src/features/media-library/components/MediaLibraryPanel.tsx
 var KIND_LABEL$1 = {
 	video: "视频",
@@ -1485,11 +1525,11 @@ function MediaLibraryPanel({ onAddToTimeline, onRemoveAsset }) {
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
 								label: "分辨率",
-								value: require_format.formatResolution(metaAsset.width, metaAsset.height)
+								value: require_notify.formatResolution(metaAsset.width, metaAsset.height)
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
 								label: "大小",
-								value: metaAsset.kind === "text" ? "—" : require_format.formatBytes(metaAsset.size)
+								value: metaAsset.kind === "text" ? "—" : require_notify.formatBytes(metaAsset.size)
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
 								label: "音轨",
@@ -1565,6 +1605,7 @@ function CreateTextDialog({ open, onOpenChange, onCreated }) {
 	const projectWidth = (0, _cut_workbench_react.useEditor)((s) => s.project.width);
 	const projectHeight = (0, _cut_workbench_react.useEditor)((s) => s.project.height);
 	const addAsset = (0, _cut_workbench_react.useEditor)((s) => s.addAsset);
+	const { bridge } = require_notify.useWorkbench();
 	const handleCreate = () => {
 		const { asset } = (0, _cut_workbench_core_engine.createTextAsset)({
 			registry: editor.runtime.clips,
@@ -1575,7 +1616,10 @@ function CreateTextDialog({ open, onOpenChange, onCreated }) {
 		addAsset(asset);
 		onCreated(asset.id);
 		onOpenChange(false);
-		sonner.toast.success("已创建文字素材");
+		require_notify.notify(bridge, {
+			level: "success",
+			title: "已创建文字素材"
+		});
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dialog, {
 		open,
@@ -1609,10 +1653,15 @@ function CreateSubtitleDialog({ open, onOpenChange, onCreated }) {
 	const projectWidth = (0, _cut_workbench_react.useEditor)((s) => s.project.width);
 	const projectHeight = (0, _cut_workbench_react.useEditor)((s) => s.project.height);
 	const addAsset = (0, _cut_workbench_react.useEditor)((s) => s.addAsset);
+	const { bridge } = require_notify.useWorkbench();
 	const handleCreate = () => {
 		const durationUs = (0, _cut_workbench_core.parseSrtDurationUs)(srt);
 		if (durationUs <= 0) {
-			sonner.toast.error("SRT 解析失败", { description: "请检查时间轴格式：00:00:00,000 --> 00:00:02,000" });
+			require_notify.notify(bridge, {
+				level: "error",
+				title: "SRT 解析失败",
+				description: "请检查时间轴格式：00:00:00,000 --> 00:00:02,000"
+			});
 			return;
 		}
 		const { asset } = (0, _cut_workbench_core_engine.createSubtitleAsset)({
@@ -1625,7 +1674,10 @@ function CreateSubtitleDialog({ open, onOpenChange, onCreated }) {
 		addAsset(asset);
 		onCreated(asset.id);
 		onOpenChange(false);
-		sonner.toast.success("已创建字幕素材");
+		require_notify.notify(bridge, {
+			level: "success",
+			title: "已创建字幕素材"
+		});
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dialog, {
 		open,
@@ -1651,11 +1703,22 @@ function CreateSubtitleDialog({ open, onOpenChange, onCreated }) {
 	});
 }
 // src/hooks/use-toast-safe.ts
-/** 统一把异常转成可见提示，禁止静默吞掉 */
+/**
+* 把异常转成可见提示，禁止静默吞掉。
+*
+* 这是**非 hook** 版本，供事件回调 / 非组件代码调用（例如 `useAvCanvas` 的
+* 初始化失败）。它拿不到 React context，因此走 `notify` 注册的默认桥：
+* `WorkbenchProvider` 挂载时会把 `bridge` 注册进来，宿主实现了 `notify`
+* 就交给宿主，否则退回库内 toast。
+*/
 function reportError(error, fallback = "操作失败") {
 	const message = error instanceof Error ? error.message : String(error);
 	console.error(error);
-	sonner.toast.error(fallback, { description: message });
+	require_notify.notify(void 0, {
+		level: "error",
+		title: fallback,
+		description: message
+	});
 }
 // src/features/preview/hooks/useAvCanvas.ts
 /**
@@ -2285,7 +2348,7 @@ function PreviewStage({ attachRef, width, height, emptyHint, onCapture, onFullsc
 	const scaleY = height > 0 ? box.h / height : 1;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		ref: outerRef,
-		className: require_format.cn("relative flex min-h-0 flex-1 items-center justify-center overflow-hidden bg-stage-bg", className),
+		className: require_notify.cn("relative flex min-h-0 flex-1 items-center justify-center overflow-hidden bg-stage-bg", className),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "relative shrink-0 overflow-hidden rounded-md bg-black shadow-2xl ring-1 ring-border",
 			style: {
@@ -2346,14 +2409,14 @@ function Slider({ className, defaultValue, value, min = 0, max = 100, ...props }
 		value,
 		min,
 		max,
-		className: require_format.cn("relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col", className),
+		className: require_notify.cn("relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col", className),
 		...props,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Slider.Track, {
 			"data-slot": "slider-track",
-			className: require_format.cn("relative grow overflow-hidden rounded-full bg-muted data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"),
+			className: require_notify.cn("relative grow overflow-hidden rounded-full bg-muted data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Slider.Range, {
 				"data-slot": "slider-range",
-				className: require_format.cn("absolute bg-primary data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full")
+				className: require_notify.cn("absolute bg-primary data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full")
 			})
 		}), Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Slider.Thumb, {
 			"data-slot": "slider-thumb",
@@ -2368,7 +2431,7 @@ function Slider({ className, defaultValue, value, min = 0, max = 100, ...props }
 */
 function Timecode({ us, showMs = true, className, muted, title }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		className: require_format.cn("font-mono text-xs tabular-nums", muted && "text-muted-foreground", className),
+		className: require_notify.cn("font-mono text-xs tabular-nums", muted && "text-muted-foreground", className),
 		title: title ?? `${us} µs`,
 		children: (0, _cut_workbench_core.formatTimecode)(us, showMs)
 	});
@@ -2419,7 +2482,7 @@ function PlaybackControls({ playing, currentUs, durationUs, masterVolume, playba
 	const full = width === 0 || width >= FULL_PX;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		ref: rootRef,
-		className: require_format.cn("flex h-11 shrink-0 items-center gap-1.5 overflow-hidden border-t bg-card/60", ultraCompact ? "px-1.5" : "px-3", className),
+		className: require_notify.cn("flex h-11 shrink-0 items-center gap-1.5 overflow-hidden border-t bg-card/60", ultraCompact ? "px-1.5" : "px-3", className),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex shrink-0 items-center gap-0.5",
@@ -2480,7 +2543,7 @@ function PlaybackControls({ playing, currentUs, durationUs, masterVolume, playba
 				]
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: require_format.cn("mx-2 flex shrink-0 items-baseline gap-1 whitespace-nowrap", ultraCompact && "mx-1", micro && "hidden"),
+				className: require_notify.cn("mx-2 flex shrink-0 items-baseline gap-1 whitespace-nowrap", ultraCompact && "mx-1", micro && "hidden"),
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Timecode, {
 					us: currentUs,
 					className: "text-[13px] font-medium"
@@ -2504,14 +2567,14 @@ function PlaybackControls({ playing, currentUs, durationUs, masterVolume, playba
 				"aria-label": "播放进度"
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: require_format.cn("flex shrink-0 items-center gap-1", compact && "ml-auto", micro && "hidden"),
+				className: require_notify.cn("flex shrink-0 items-center gap-1", compact && "ml-auto", micro && "hidden"),
 				children: [
 					!compact && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "flex items-center rounded-md border p-0.5",
 						children: RATES.map((rate) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 							type: "button",
 							onClick: () => onRateChange(rate),
-							className: require_format.cn("rounded px-1.5 py-0.5 text-[11px] tabular-nums transition-colors", playbackRate === rate ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground"),
+							className: require_notify.cn("rounded px-1.5 py-0.5 text-[11px] tabular-nums transition-colors", playbackRate === rate ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground"),
 							title: rate !== 1 ? "变速预览（不会改变导出结果）" : "正常速度",
 							children: [rate, "×"]
 						}, rate))
@@ -2575,6 +2638,7 @@ function PreviewPanel() {
 	const setMasterVolume = (0, _cut_workbench_react.useEditor)((s) => s.setMasterVolume);
 	const playheadUs = (0, _cut_workbench_react.useEditor)((s) => s.playheadUs);
 	const selectedClipIds = (0, _cut_workbench_react.useEditor)((s) => s.selectedClipIds);
+	const { bridge } = require_notify.useWorkbench();
 	const canvas = useAvCanvas({
 		width: project.width,
 		height: project.height
@@ -2585,12 +2649,18 @@ function PreviewPanel() {
 		if (errors.length === 0) return;
 		const missing = errors.filter((e) => e.message.startsWith("素材文件未载入"));
 		const other = errors.filter((e) => !e.message.startsWith("素材文件未载入"));
-		if (missing.length > 0) sonner.toast.warning(`${missing.length} 个片段缺少源文件，已跳过预览`, {
+		if (missing.length > 0) require_notify.notify(bridge, {
+			level: "warning",
+			title: `${missing.length} 个片段缺少源文件，已跳过预览`,
 			description: "刷新后素材二进制不会保留，请重新导入相同文件",
 			duration: 8e3
 		});
-		if (other.length > 0) sonner.toast.error("部分片段无法载入预览", { description: Array.from(new Set(other.map((e) => e.message))).slice(0, 3).join("\n") });
-	}, []);
+		if (other.length > 0) require_notify.notify(bridge, {
+			level: "error",
+			title: "部分片段无法载入预览",
+			description: Array.from(new Set(other.map((e) => e.message))).slice(0, 3).join("\n")
+		});
+	}, [bridge]);
 	const clock = usePlaybackClock({
 		project,
 		assets,
@@ -2726,12 +2796,18 @@ function PreviewPanel() {
 	const handleCapture = (0, react.useCallback)(() => {
 		const dataUrl = canvas.captureImage();
 		if (dataUrl == null) {
-			sonner.toast.error("截图失败：画布尚未就绪");
+			require_notify.notify(bridge, {
+				level: "error",
+				title: "截图失败：画布尚未就绪"
+			});
 			return;
 		}
 		downloadDataUrl(dataUrl, `frame-${Date.now()}.png`);
-		sonner.toast.success("已导出当前帧");
-	}, [canvas]);
+		require_notify.notify(bridge, {
+			level: "success",
+			title: "已导出当前帧"
+		});
+	}, [bridge, canvas]);
 	const handleFullscreen = () => {
 		const el = canvas.containerRef.current?.parentElement;
 		if (el == null) return;
@@ -2968,14 +3044,14 @@ function Ruler({ pxPerSecond, widthPx, playheadPx, scrollLeftPx, className }) {
 		widthPx
 	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("relative shrink-0 cursor-ew-resize border-b bg-timeline-bg select-none", className),
+		className: require_notify.cn("relative shrink-0 cursor-ew-resize border-b bg-timeline-bg select-none", className),
 		style: {
 			height: 28,
 			width: widthPx
 		},
 		children: [
 			ticks.map((tick) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: require_format.cn("absolute bottom-0 w-px", tick.major ? "h-2 bg-muted-foreground/50" : "h-1 bg-muted-foreground/25"),
+				className: require_notify.cn("absolute bottom-0 w-px", tick.major ? "h-2 bg-muted-foreground/50" : "h-1 bg-muted-foreground/25"),
 				style: { left: tick.px }
 			}, `${tick.us}-${tick.major ? "M" : "m"}`)),
 			ticks.filter((t) => t.major).map((tick) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -3003,7 +3079,7 @@ function Ruler({ pxPerSecond, widthPx, playheadPx, scrollLeftPx, className }) {
 */
 var TrackHeader = (0, react.memo)(function TrackHeader({ track, onToggleMute, onToggleLock, onToggleHidden, onRemove }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("flex items-center gap-1 border-r border-b border-timeline-grid px-2", track.kind === "audio" ? "bg-clip-audio/10" : "bg-clip-video/10", track.hidden && "opacity-60"),
+		className: require_notify.cn("flex items-center gap-1 border-r border-b border-timeline-grid px-2", track.kind === "audio" ? "bg-clip-audio/10" : "bg-clip-video/10", track.hidden && "opacity-60"),
 		style: { height: 56 },
 		"data-track-header": true,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -3058,7 +3134,7 @@ function IconToggle({ active, onClick, label, icon: Icon }) {
 			onClick,
 			"aria-label": label,
 			"aria-pressed": active,
-			className: require_format.cn("flex size-[18px] items-center justify-center rounded transition-colors", active ? "bg-primary/20 text-primary" : "text-muted-foreground hover:text-foreground"),
+			className: require_notify.cn("flex size-[18px] items-center justify-center rounded transition-colors", active ? "bg-primary/20 text-primary" : "text-muted-foreground hover:text-foreground"),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "size-3" })
 		})
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContent, { children: label })] });
@@ -3149,7 +3225,7 @@ var ClipBlock = (0, react.memo)(function ClipBlock({ clip, asset, pxPerSecond, s
 			handlers.beginMove(event, clip);
 		},
 		onDoubleClick: () => handlers.seekTo(clip),
-		className: require_format.cn("group absolute top-1 bottom-1 overflow-hidden rounded-md border text-left select-none transition-shadow", KIND_BG[kind], selected ? "ring-2 ring-primary ring-offset-1 ring-offset-timeline-bg" : "hover:brightness-110", locked ? "cursor-not-allowed opacity-70" : "cursor-grab active:cursor-grabbing"),
+		className: require_notify.cn("group absolute top-1 bottom-1 overflow-hidden rounded-md border text-left select-none transition-shadow", KIND_BG[kind], selected ? "ring-2 ring-primary ring-offset-1 ring-offset-timeline-bg" : "hover:brightness-110", locked ? "cursor-not-allowed opacity-70" : "cursor-grab active:cursor-grabbing"),
 		style: {
 			left: leftPx,
 			width: widthPx,
@@ -3228,7 +3304,7 @@ function ContextMenuPortal({ ...props }) {
 function ContextMenuContent({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContextMenuPortal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ContextMenu.Content, {
 		"data-slot": "context-menu-content",
-		className: require_format.cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
+		className: require_notify.cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
 		...props
 	}) });
 }
@@ -3237,21 +3313,21 @@ function ContextMenuItem({ className, inset, variant = "default", ...props }) {
 		"data-slot": "context-menu-item",
 		"data-inset": inset,
 		"data-variant": variant,
-		className: require_format.cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!", className),
+		className: require_notify.cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!", className),
 		...props
 	});
 }
 function ContextMenuSeparator({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ContextMenu.Separator, {
 		"data-slot": "context-menu-separator",
-		className: require_format.cn("-mx-1 my-1 h-px bg-border", className),
+		className: require_notify.cn("-mx-1 my-1 h-px bg-border", className),
 		...props
 	});
 }
 function ContextMenuShortcut({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 		"data-slot": "context-menu-shortcut",
-		className: require_format.cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
+		className: require_notify.cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
 		...props
 	});
 }
@@ -3308,14 +3384,14 @@ function ClipContextMenu({ children, onSplit, onDuplicate, onRemove, onShowInfo,
 /** 播放头：一条竖线 + 顶部把手，跨过所有轨道 */
 function Playhead({ px, playing, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("pointer-events-none absolute top-0 bottom-0 z-20 w-px", className),
+		className: require_notify.cn("pointer-events-none absolute top-0 bottom-0 z-20 w-px", className),
 		style: { left: px },
 		"aria-hidden": true,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: require_format.cn("absolute inset-y-0 -left-px w-0.5 bg-playhead", playing && "shadow-[0_0_6px_var(--cw-playhead)]"),
+			className: require_notify.cn("absolute inset-y-0 -left-px w-0.5 bg-playhead", playing && "shadow-[0_0_6px_var(--cw-playhead)]"),
 			style: { top: 24 }
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: require_format.cn("absolute -translate-x-1/2 rounded-sm bg-playhead", playing ? "size-3 rotate-45" : "h-2.5 w-2.5 rotate-45"),
+			className: require_notify.cn("absolute -translate-x-1/2 rounded-sm bg-playhead", playing ? "size-3 rotate-45" : "h-2.5 w-2.5 rotate-45"),
 			style: { top: 14 }
 		})]
 	});
@@ -3324,7 +3400,7 @@ function Playhead({ px, playing, className }) {
 /** 框选矩形 */
 function Marquee({ x1, y1, x2, y2, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_format.cn("pointer-events-none absolute z-40 rounded-sm border border-primary/70 bg-primary/15", className),
+		className: require_notify.cn("pointer-events-none absolute z-40 rounded-sm border border-primary/70 bg-primary/15", className),
 		style: {
 			left: Math.min(x1, x2),
 			top: Math.min(y1, y2),
@@ -3342,10 +3418,10 @@ function Marquee({ x1, y1, x2, y2, className }) {
 * 调整回去，视觉上内容不会乱跳。
 */
 function useTimelineZoom(containerRef) {
-	const uiApi = useUiStoreApi();
-	const pxPerSecond = useUi((s) => s.pxPerSecond);
-	const setPxPerSecond = useUi((s) => s.setPxPerSecond);
-	const setScrollLeftPx = useUi((s) => s.setScrollLeftPx);
+	const uiApi = require_notify.useUiStoreApi();
+	const pxPerSecond = require_notify.useUi((s) => s.pxPerSecond);
+	const setPxPerSecond = require_notify.useUi((s) => s.setPxPerSecond);
+	const setScrollLeftPx = require_notify.useUi((s) => s.setScrollLeftPx);
 	const applyZoom = (0, react.useCallback)((nextPps, anchorClientX) => {
 		const container = containerRef.current;
 		const prevPps = uiApi.getState().pxPerSecond;
@@ -3670,7 +3746,7 @@ function useTimelineDrag({ pxPerSecond, contentLeftPx, resolveTrackAt, snapEnabl
 */
 function Timeline() {
 	const editor = (0, _cut_workbench_react.useCutEditor)();
-	const uiApi = useUiStoreApi();
+	const uiApi = require_notify.useUiStoreApi();
 	const project = (0, _cut_workbench_react.useEditor)((s) => s.project);
 	const assets = (0, _cut_workbench_react.useEditor)((s) => s.assets);
 	const selectedClipIds = (0, _cut_workbench_react.useEditor)((s) => s.selectedClipIds);
@@ -3999,7 +4075,7 @@ function Timeline() {
 									"data-timeline-tracks": true,
 									children: [
 										project.tracks.map((track, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-											className: require_format.cn("relative border-b border-timeline-grid", track.kind === "audio" ? "bg-timeline-track/30" : "bg-timeline-track/50", track.hidden && "opacity-40"),
+											className: require_notify.cn("relative border-b border-timeline-grid", track.kind === "audio" ? "bg-timeline-track/30" : "bg-timeline-track/50", track.hidden && "opacity-40"),
 											style: { height: 56 },
 											"data-track-row": track.id,
 											children: [
@@ -4070,7 +4146,7 @@ function Tabs({ className, orientation = "horizontal", ...props }) {
 		"data-slot": "tabs",
 		"data-orientation": orientation,
 		orientation,
-		className: require_format.cn("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", className),
+		className: require_notify.cn("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", className),
 		...props
 	});
 }
@@ -4085,21 +4161,21 @@ function TabsList({ className, variant = "default", ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tabs.List, {
 		"data-slot": "tabs-list",
 		"data-variant": variant,
-		className: require_format.cn(tabsListVariants({ variant }), className),
+		className: require_notify.cn(tabsListVariants({ variant }), className),
 		...props
 	});
 }
 function TabsTrigger({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tabs.Trigger, {
 		"data-slot": "tabs-trigger",
-		className: require_format.cn("relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent", "data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100", className),
+		className: require_notify.cn("relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent", "data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100", className),
 		...props
 	});
 }
 function TabsContent({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tabs.Content, {
 		"data-slot": "tabs-content",
-		className: require_format.cn("flex-1 outline-none", className),
+		className: require_notify.cn("flex-1 outline-none", className),
 		...props
 	});
 }
@@ -4108,7 +4184,7 @@ function Input({ className, type, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
 		type,
 		"data-slot": "input",
-		className: require_format.cn("h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30", "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50", "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40", className),
+		className: require_notify.cn("h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30", "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50", "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40", className),
 		...props
 	});
 }
@@ -4129,7 +4205,7 @@ function SelectTrigger({ className, size = "default", children, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Select.Trigger, {
 		"data-slot": "select-trigger",
 		"data-size": size,
-		className: require_format.cn("flex w-fit items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className),
+		className: require_notify.cn("flex w-fit items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className),
 		...props,
 		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Select.Icon, {
 			asChild: true,
@@ -4143,14 +4219,14 @@ function SelectContent({ className, children, position = "item-aligned", align =
 		container: container ?? void 0,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Select.Content, {
 			"data-slot": "select-content",
-			className: require_format.cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
+			className: require_notify.cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
 			position,
 			align,
 			...props,
 			children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectScrollUpButton, {}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Select.Viewport, {
-					className: require_format.cn("p-1", position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"),
+					className: require_notify.cn("p-1", position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"),
 					children
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectScrollDownButton, {})
@@ -4161,7 +4237,7 @@ function SelectContent({ className, children, position = "item-aligned", align =
 function SelectItem({ className, children, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Select.Item, {
 		"data-slot": "select-item",
-		className: require_format.cn("relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className),
+		className: require_notify.cn("relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className),
 		...props,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 			"data-slot": "select-item-indicator",
@@ -4173,7 +4249,7 @@ function SelectItem({ className, children, ...props }) {
 function SelectScrollUpButton({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Select.ScrollUpButton, {
 		"data-slot": "select-scroll-up-button",
-		className: require_format.cn("flex cursor-default items-center justify-center py-1", className),
+		className: require_notify.cn("flex cursor-default items-center justify-center py-1", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronUpIcon, { className: "size-4" })
 	});
@@ -4181,7 +4257,7 @@ function SelectScrollUpButton({ className, ...props }) {
 function SelectScrollDownButton({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Select.ScrollDownButton, {
 		"data-slot": "select-scroll-down-button",
-		className: require_format.cn("flex cursor-default items-center justify-center py-1", className),
+		className: require_notify.cn("flex cursor-default items-center justify-center py-1", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDownIcon, { className: "size-4" })
 	});
@@ -4190,7 +4266,7 @@ function SelectScrollDownButton({ className, ...props }) {
 /** 属性面板的一行：标签 + 控件（标签在左，控件占满剩余宽度） */
 function Field({ label, hint, children, className, htmlFor }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_format.cn("flex items-center gap-2", className),
+		className: require_notify.cn("flex items-center gap-2", className),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Label, {
 				htmlFor,
@@ -4211,7 +4287,7 @@ function Field({ label, hint, children, className, htmlFor }) {
 /** 属性分组 */
 function Section({ title, children, action, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-		className: require_format.cn("space-y-2", className),
+		className: require_notify.cn("space-y-2", className),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "flex items-center justify-between",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
@@ -4406,7 +4482,7 @@ function VideoProps({ clip, onPatch, onPatchTransform, onPatchSize }) {
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Input, {
 						type: "number",
 						className: "h-7 text-xs tabular-nums",
-						value: require_format.formatSeconds(clip.startUs),
+						value: require_notify.formatSeconds(clip.startUs),
 						step: .1,
 						min: 0,
 						onChange: (e) => {
@@ -4420,7 +4496,7 @@ function VideoProps({ clip, onPatch, onPatchTransform, onPatchSize }) {
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Input, {
 						type: "number",
 						className: "h-7 text-xs tabular-nums",
-						value: require_format.formatSeconds(clip.durationUs),
+						value: require_notify.formatSeconds(clip.durationUs),
 						step: .1,
 						min: .1,
 						onChange: (e) => {
@@ -4527,7 +4603,7 @@ function AudioProps({ clip, onPatch }) {
 				className: "text-[10px] text-muted-foreground",
 				children: [
 					"片段时长 ",
-					require_format.formatSeconds(clip.durationUs),
+					require_notify.formatSeconds(clip.durationUs),
 					"s，淡入使用 setAnimation 线性插值。"
 				]
 			})
@@ -4782,7 +4858,7 @@ function SubtitleProps({ clip, onPatch, onRebuild }) {
 			className: "text-[10px] text-muted-foreground",
 			children: [
 				"片段时长 ",
-				require_format.formatSeconds(clip.durationUs),
+				require_notify.formatSeconds(clip.durationUs),
 				"s",
 				cues.length > 0 && ` · 最后一条结束于 ${(cues[cues.length - 1].endMs / 1e3).toFixed(2)}s`
 			]
@@ -5054,7 +5130,7 @@ function InspectorPanel() {
 								title: asset.name,
 								children: asset.name
 							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_format.Badge, {
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_notify.Badge, {
 								variant: "outline",
 								className: "text-[10px]",
 								children: KIND_LABEL[asset.kind]
@@ -5077,7 +5153,7 @@ function InspectorPanel() {
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
 							(0, _cut_workbench_core.formatDuration)(clip.durationUs),
 							" · ",
-							require_format.formatResolution(asset.width, asset.height)
+							require_notify.formatResolution(asset.width, asset.height)
 						] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
 							"入点 ",
 							(clip.inPointUs / 1e6).toFixed(2),
@@ -5182,11 +5258,11 @@ function Switch({ className, size = "default", ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Switch.Root, {
 		"data-slot": "switch",
 		"data-size": size,
-		className: require_format.cn("peer group/switch inline-flex shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-[1.15rem] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80", className),
+		className: require_notify.cn("peer group/switch inline-flex shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-[1.15rem] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Switch.Thumb, {
 			"data-slot": "switch-thumb",
-			className: require_format.cn("pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground")
+			className: require_notify.cn("pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground")
 		})
 	});
 }
@@ -5194,7 +5270,7 @@ function Switch({ className, size = "default", ...props }) {
 function Progress({ className, value, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Progress.Root, {
 		"data-slot": "progress",
-		className: require_format.cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
+		className: require_notify.cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Progress.Indicator, {
 			"data-slot": "progress-indicator",
@@ -5725,8 +5801,8 @@ var FPS_OPTIONS = [
 * 所有重活都在 Worker 里；这里只负责 UI 与状态机。
 */
 function ExportDialog() {
-	const open = useUi((s) => s.dialog === "export");
-	const closeDialog = useUi((s) => s.closeDialog);
+	const open = require_notify.useUi((s) => s.dialog === "export");
+	const closeDialog = require_notify.useUi((s) => s.closeDialog);
 	const project = (0, _cut_workbench_react.useEditor)((s) => s.project);
 	const assets = (0, _cut_workbench_react.useEditor)((s) => s.assets);
 	const [preset, setPreset] = (0, react.useState)("1080p");
@@ -5872,7 +5948,7 @@ function ExportDialog() {
 									className: "flex justify-between",
 									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "预估大小" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 										className: "font-mono tabular-nums",
-										children: require_format.formatBytes(estimatedBytes)
+										children: require_notify.formatBytes(estimatedBytes)
 									})]
 								}),
 								hasTextClips && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5909,10 +5985,10 @@ function ExportDialog() {
 								children: [
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CheckCircle2, { className: "size-3.5" }),
 									"导出完成 · 耗时 ",
-									require_format.formatElapsed(state.result.elapsedMs / 1e3),
+									require_notify.formatElapsed(state.result.elapsedMs / 1e3),
 									" ·",
 									" ",
-									require_format.formatBytes(state.result.blob.size),
+									require_notify.formatBytes(state.result.blob.size),
 									state.result.mode === "main" && "（主线程）"
 								]
 							}),
@@ -5975,7 +6051,7 @@ function ExportProgress({ progress, label = "正在合成…", className }) {
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Loader2, { className: "size-3 animate-spin" }), label]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: "font-mono tabular-nums",
-				children: require_format.formatPercent(progress)
+				children: require_notify.formatPercent(progress)
 			})]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Progress, { value: progress * 100 })]
 	});
@@ -6051,7 +6127,7 @@ function CanvasSettingsBody({ onDone }) {
 								setDraftW(String(preset.width));
 								setDraftH(String(preset.height));
 							},
-							className: require_format.cn("flex flex-col items-center gap-1 rounded-md border px-2 py-2 text-[11px] transition-colors", activePreset?.id === preset.id ? "border-primary bg-primary/10 text-foreground" : "text-muted-foreground hover:border-primary/50 hover:text-foreground"),
+							className: require_notify.cn("flex flex-col items-center gap-1 rounded-md border px-2 py-2 text-[11px] transition-colors", activePreset?.id === preset.id ? "border-primary bg-primary/10 text-foreground" : "text-muted-foreground hover:border-primary/50 hover:text-foreground"),
 							title: preset.hint,
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: "block rounded-[2px] border border-current opacity-70",
@@ -6112,7 +6188,7 @@ function CanvasSettingsBody({ onDone }) {
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 								type: "button",
 								onClick: () => setMode("scale"),
-								className: require_format.cn("rounded-md border px-2.5 py-2 text-left text-[11px] transition-colors", mode === "scale" ? "border-primary bg-primary/10" : "text-muted-foreground hover:border-primary/50"),
+								className: require_notify.cn("rounded-md border px-2.5 py-2 text-left text-[11px] transition-colors", mode === "scale" ? "border-primary bg-primary/10" : "text-muted-foreground hover:border-primary/50"),
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: "block font-medium text-foreground",
 									children: "随画布缩放"
@@ -6123,7 +6199,7 @@ function CanvasSettingsBody({ onDone }) {
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 								type: "button",
 								onClick: () => setMode("keep"),
-								className: require_format.cn("rounded-md border px-2.5 py-2 text-left text-[11px] transition-colors", mode === "keep" ? "border-primary bg-primary/10" : "text-muted-foreground hover:border-primary/50"),
+								className: require_notify.cn("rounded-md border px-2.5 py-2 text-left text-[11px] transition-colors", mode === "keep" ? "border-primary bg-primary/10" : "text-muted-foreground hover:border-primary/50"),
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: "block font-medium text-foreground",
 									children: "保持原位置"
@@ -6185,16 +6261,23 @@ function useAddToTimeline() {
 	const assets = (0, _cut_workbench_react.useEditor)((s) => s.assets);
 	const playheadUs = (0, _cut_workbench_react.useEditor)((s) => s.playheadUs);
 	const addClip = (0, _cut_workbench_react.useEditor)((s) => s.addClip);
+	const { bridge } = require_notify.useWorkbench();
 	return (0, react.useCallback)((assetId) => {
 		const asset = assets.find((a) => a.id === assetId);
 		if (!asset) {
-			sonner.toast.error("素材不存在，可能已被删除");
+			require_notify.notify(bridge, {
+				level: "error",
+				title: "素材不存在，可能已被删除"
+			});
 			return;
 		}
 		const kindIsAudio = asset.kind === "audio";
 		const track = project.tracks.find((t) => t.kind === (kindIsAudio ? "audio" : "visual")) ?? project.tracks[0];
 		if (!track) {
-			sonner.toast.error("没有可用轨道");
+			require_notify.notify(bridge, {
+				level: "error",
+				title: "没有可用轨道"
+			});
 			return;
 		}
 		const trackEnd = (0, _cut_workbench_core.getTrackEnd)(project, track.id);
@@ -6227,6 +6310,7 @@ function useAddToTimeline() {
 	}, [
 		addClip,
 		assets,
+		bridge,
 		playheadUs,
 		project
 	]);
@@ -6280,7 +6364,7 @@ var FRAME_US = 1e6 / 30;
 */
 function useKeyboardShortcuts() {
 	const editor = (0, _cut_workbench_react.useCutEditor)();
-	const uiApi = useUiStoreApi();
+	const uiApi = require_notify.useUiStoreApi();
 	const handler = (0, react.useCallback)((event) => {
 		const target = event.target;
 		const isEditable = target != null && (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable || target.getAttribute("role") === "textbox" || target.closest("[role=menu]") != null);
@@ -6460,17 +6544,17 @@ var LabPage = (0, react.lazy)(() => import("@cut-workbench/workbench/lab").then(
 function CutWorkbench({ slots, toolbar: toolbarOptions, className, onSaveProject, onOpenProject, enforceCapability = true }) {
 	const editor = (0, _cut_workbench_react.useCutEditor)();
 	const capability = useCapabilityInfo();
-	const leftWidth = useUi((s) => s.leftWidth);
-	const rightWidth = useUi((s) => s.rightWidth);
-	const timelineHeight = useUi((s) => s.timelineHeight);
-	const setLeftWidth = useUi((s) => s.setLeftWidth);
-	const setRightWidth = useUi((s) => s.setRightWidth);
-	const setTimelineHeight = useUi((s) => s.setTimelineHeight);
-	const openDialog = useUi((s) => s.openDialog);
-	const closeDialog = useUi((s) => s.closeDialog);
-	const dialog = useUi((s) => s.dialog);
-	const { config, theme } = useWorkbench();
-	const route = useUi((s) => s.route);
+	const leftWidth = require_notify.useUi((s) => s.leftWidth);
+	const rightWidth = require_notify.useUi((s) => s.rightWidth);
+	const timelineHeight = require_notify.useUi((s) => s.timelineHeight);
+	const setLeftWidth = require_notify.useUi((s) => s.setLeftWidth);
+	const setRightWidth = require_notify.useUi((s) => s.setRightWidth);
+	const setTimelineHeight = require_notify.useUi((s) => s.setTimelineHeight);
+	const openDialog = require_notify.useUi((s) => s.openDialog);
+	const closeDialog = require_notify.useUi((s) => s.closeDialog);
+	const dialog = require_notify.useUi((s) => s.dialog);
+	const { config, theme } = require_notify.useWorkbench();
+	const route = require_notify.useUi((s) => s.route);
 	const addToTimeline = useAddToTimeline();
 	const removeAsset = (0, _cut_workbench_react.useEditor)((s) => s.removeAsset);
 	const [busy, setBusy] = (0, react.useState)(null);
@@ -7517,11 +7601,15 @@ function CutWorkbenchProvider({ children, bridge, theme = "dark", tokens, config
 	(0, _cut_workbench_react.useCutEditor)();
 	const [ui] = (0, react.useState)(() => createUiStore());
 	const resolvedBridge = (0, react.useMemo)(() => bridge ?? createDefaultBridge(), [bridge]);
+	(0, react.useEffect)(() => {
+		require_notify.setDefaultBridge(resolvedBridge);
+		return () => require_notify.setDefaultBridge(null);
+	}, [resolvedBridge]);
 	const mergedConfig = (0, react.useMemo)(() => ({
-		...DEFAULT_CONFIG,
+		...require_notify.DEFAULT_CONFIG,
 		...config,
 		features: {
-			...DEFAULT_CONFIG.features,
+			...require_notify.DEFAULT_CONFIG.features,
 			...config?.features ?? {}
 		}
 	}), [config]);
@@ -7550,7 +7638,7 @@ function CutWorkbenchProvider({ children, bridge, theme = "dark", tokens, config
 		resolvedTheme,
 		portalContainer
 	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkbenchContext.Provider, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_notify.WorkbenchContext.Provider, {
 		value,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PortalContainerProvider, {
 			container: portalContainer,
@@ -7803,8 +7891,8 @@ exports.ClipBlock = ClipBlock;
 exports.ClipContextMenu = ClipContextMenu;
 exports.CutWorkbench = CutWorkbench;
 exports.CutWorkbenchProvider = CutWorkbenchProvider;
-exports.DEFAULT_CONFIG = DEFAULT_CONFIG;
-exports.DEFAULT_FEATURES = DEFAULT_FEATURES;
+exports.DEFAULT_CONFIG = require_notify.DEFAULT_CONFIG;
+exports.DEFAULT_FEATURES = require_notify.DEFAULT_FEATURES;
 exports.DropZone = DropZone;
 exports.EmptyState = EmptyState;
 exports.ExportDialog = ExportDialog;
@@ -7852,8 +7940,8 @@ exports.useExport = useExport;
 exports.useHostDarkClass = useHostDarkClass;
 exports.useMediaImport = useMediaImport;
 exports.usePortalContainer = usePortalContainer;
-exports.useUi = useUi;
-exports.useUiStoreApi = useUiStoreApi;
-exports.useWorkbench = useWorkbench;
+exports.useUi = require_notify.useUi;
+exports.useUiStoreApi = require_notify.useUiStoreApi;
+exports.useWorkbench = require_notify.useWorkbench;
 
 //# sourceMappingURL=index.cjs.map