@open-slide/core 1.0.6 → 1.2.0

package/src/app/routes/slide.tsx

@@ -24,17 +24,20 @@ import {
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
 import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
 import { useFolders } from '@/lib/folders';
-import { useLocale } from '@/lib/use-locale';
+import { format, useLocale } from '@/lib/use-locale';
 import { useWheelPageNavigation } from '@/lib/use-wheel-page-navigation';
 import { cn } from '@/lib/utils';
 import { ClickNavZones } from '../components/click-nav-zones';
+import { NotesDrawer } from '../components/notes-drawer';
 import { PdfProgressToast } from '../components/pdf-progress-toast';
 import { Player } from '../components/player';
 import { SlideCanvas } from '../components/slide-canvas';
-import { ThumbnailRail } from '../components/thumbnail-rail';
+import { type ThumbnailActions, ThumbnailRail } from '../components/thumbnail-rail';
 import { exportSlideAsHtml } from '../lib/export-html';
 import { exportSlideAsPdf } from '../lib/export-pdf';
+import { remapNotesSessionCacheAfterReorder } from '../lib/inspector/use-notes';
 import type { SlideModule } from '../lib/sdk';
 import { loadSlide } from '../lib/slides';
 
@@ -68,12 +71,28 @@ export function Slide() {
     };
   }, [slideId]);
 
-  const pages = useMemo(() => slide?.default ?? [], [slide]);
+  const modulePages = useMemo(() => slide?.default ?? [], [slide]);
+  const [pages, setPages] = useState<typeof modulePages>(modulePages);
+  useEffect(() => {
+    setPages(modulePages);
+  }, [modulePages]);
   const pageCount = pages.length;
   const rawIndex = Number(searchParams.get('p') ?? '1') - 1;
   const index = Number.isFinite(rawIndex) ? Math.max(0, Math.min(pageCount - 1, rawIndex)) : 0;
   const view = searchParams.get('view') === 'assets' ? 'assets' : 'slides';
 
+  useEffect(() => {
+    if (!import.meta.hot) return;
+    if (!slideId || !slide || pageCount === 0) return;
+    import.meta.hot.send('open-slide:current', {
+      slideId,
+      pageIndex: index,
+      totalPages: pageCount,
+      slideTitle: slide.meta?.title ?? slideId,
+      view,
+    });
+  }, [slideId, index, pageCount, slide, view]);
+
   const goTo = useCallback(
     (i: number) => {
       const clamped = Math.max(0, Math.min(pageCount - 1, i));
@@ -89,6 +108,117 @@ export function Slide() {
     [pageCount, setSearchParams],
   );
 
+  const reorderPage = useCallback(
+    async (from: number, to: number) => {
+      if (from === to) return;
+      const before = pages;
+      const nextPages = [...before];
+      const [moved] = nextPages.splice(from, 1);
+      nextPages.splice(to, 0, moved);
+      setPages(nextPages);
+
+      const order = before.map((_, i) => i);
+      const [movedIdx] = order.splice(from, 1);
+      order.splice(to, 0, movedIdx);
+
+      remapNotesSessionCacheAfterReorder(slideId, order);
+
+      // Keep the user looking at the same page they were on before the drag.
+      let nextIndex = index;
+      if (index === from) nextIndex = to;
+      else if (from < index && to >= index) nextIndex = index - 1;
+      else if (from > index && to <= index) nextIndex = index + 1;
+      if (nextIndex !== index) goTo(nextIndex);
+
+      try {
+        const res = await fetch(`/__slides/${encodeURIComponent(slideId)}/reorder`, {
+          method: 'PUT',
+          headers: { 'content-type': 'application/json' },
+          body: JSON.stringify({ order }),
+        });
+        if (!res.ok) {
+          const detail = await res.json().catch(() => ({ error: res.statusText }));
+          throw new Error(detail.error ?? `HTTP ${res.status}`);
+        }
+      } catch (err) {
+        setPages(before);
+        const inverse = order.map((_, i) => order.indexOf(i));
+        remapNotesSessionCacheAfterReorder(slideId, inverse);
+        toast.error(`Reorder failed: ${String((err as Error).message ?? err)}`);
+      }
+    },
+    [pages, index, slideId, goTo],
+  );
+
+  const duplicatePage = useCallback(
+    async (i: number) => {
+      const before = pages;
+      if (i < 0 || i >= before.length) return;
+      const nextPages = [...before];
+      nextPages.splice(i + 1, 0, before[i]);
+      setPages(nextPages);
+      if (index > i) goTo(index + 1);
+
+      try {
+        const res = await fetch(`/__slides/${encodeURIComponent(slideId)}/pages/${i}/duplicate`, {
+          method: 'POST',
+        });
+        if (!res.ok) {
+          const detail = await res.json().catch(() => ({ error: res.statusText }));
+          throw new Error(detail.error ?? `HTTP ${res.status}`);
+        }
+        toast.success(format(t.thumbnailRail.toastDuplicated, { n: i + 1 }));
+      } catch (err) {
+        setPages(before);
+        toast.error(
+          `${t.thumbnailRail.toastDuplicateFailed}: ${String((err as Error).message ?? err)}`,
+        );
+      }
+    },
+    [pages, index, slideId, goTo, t.thumbnailRail],
+  );
+
+  const deletePage = useCallback(
+    async (i: number) => {
+      const before = pages;
+      if (i < 0 || i >= before.length || before.length <= 1) return;
+      const nextPages = before.slice(0, i).concat(before.slice(i + 1));
+      setPages(nextPages);
+      if (index >= i && index > 0) {
+        const target = index === i ? Math.min(index, nextPages.length - 1) : index - 1;
+        goTo(target);
+      }
+
+      try {
+        const res = await fetch(`/__slides/${encodeURIComponent(slideId)}/pages/${i}`, {
+          method: 'DELETE',
+        });
+        if (!res.ok) {
+          const detail = await res.json().catch(() => ({ error: res.statusText }));
+          throw new Error(detail.error ?? `HTTP ${res.status}`);
+        }
+        toast.success(format(t.thumbnailRail.toastDeleted, { n: i + 1 }));
+      } catch (err) {
+        setPages(before);
+        toast.error(
+          `${t.thumbnailRail.toastDeleteFailed}: ${String((err as Error).message ?? err)}`,
+        );
+      }
+    },
+    [pages, index, slideId, goTo, t.thumbnailRail],
+  );
+
+  const thumbnailActions = useMemo<ThumbnailActions | undefined>(
+    () =>
+      import.meta.env.DEV
+        ? {
+            onDuplicate: duplicatePage,
+            onDelete: deletePage,
+          }
+        : undefined,
+    [duplicatePage, deletePage],
+  );
+
   useEffect(() => {
     if (playing) return;
     const onKey = (e: KeyboardEvent) => {
@@ -204,6 +334,7 @@ export function Slide() {
   return (
     <HistoryProvider>
       <InspectorProvider slideId={slideId}>
+        <SelectionReporter />
         <div className="flex h-dvh flex-col overflow-hidden bg-background text-foreground">
           {/* Editorial toolbar — three zones, hairline separators, mono-folio center */}
           <header className="relative flex h-12 shrink-0 items-center justify-between border-b border-hairline bg-sidebar/85 px-2 backdrop-blur-md md:px-3">
@@ -237,6 +368,7 @@ export function Slide() {
                   </TabsList>
                 </Tabs>
               )}
+              {import.meta.env.DEV && <AgentConnectedBadge />}
             </div>
 
             {/* Centered title — the rail and mobile pill carry the page count. */}
@@ -349,56 +481,69 @@ export function Slide() {
             </div>
           ) : (
             <DesignProvider slideId={slideId}>
-              <div className="flex min-h-0 flex-1 flex-col md:flex-row">
-                <div className="hidden w-[16.5rem] shrink-0 md:block">
-                  <ThumbnailRail
-                    pages={pages}
-                    design={slide.design}
-                    current={index}
-                    onSelect={goTo}
-                  />
-                </div>
-                <main
-                  ref={slideViewportRef}
-                  data-inspector-root
-                  className="paper relative min-h-0 min-w-0 flex-1 bg-canvas p-2 md:p-10"
-                >
-                  <SlideWheelNavigation
-                    targetRef={slideViewportRef}
-                    onPrev={() => goTo(index - 1)}
-                    onNext={() => goTo(index + 1)}
-                    canPrev={index > 0}
-                    canNext={index < pageCount - 1}
-                  />
-                  <SlideCanvas design={slide.design}>
-                    <CurrentPage />
-                  </SlideCanvas>
-                  <ClickNavZones
-                    onPrev={() => goTo(index - 1)}
-                    onNext={() => goTo(index + 1)}
-                    canPrev={index > 0}
-                    canNext={index < pageCount - 1}
-                  />
-                  <InspectOverlay />
-                  <SaveBar />
-                  {import.meta.env.DEV && <CommentWidget />}
-                </main>
-                {/* Mobile-only horizontal rail. Sits below the canvas and
+              <div className="flex min-h-0 flex-1 flex-col">
+                <div className="flex min-h-0 flex-1 flex-col md:flex-row">
+                  <div className="hidden w-[16.5rem] shrink-0 md:block">
+                    <ThumbnailRail
+                      pages={pages}
+                      design={slide.design}
+                      current={index}
+                      onSelect={goTo}
+                      onReorder={import.meta.env.DEV ? reorderPage : undefined}
+                      actions={thumbnailActions}
+                    />
+                  </div>
+                  <main
+                    ref={slideViewportRef}
+                    data-inspector-root
+                    className="paper relative min-h-0 min-w-0 flex-1 bg-canvas p-2 md:p-10"
+                  >
+                    <SlideWheelNavigation
+                      targetRef={slideViewportRef}
+                      onPrev={() => goTo(index - 1)}
+                      onNext={() => goTo(index + 1)}
+                      canPrev={index > 0}
+                      canNext={index < pageCount - 1}
+                    />
+                    <SlideCanvas design={slide.design}>
+                      <CurrentPage />
+                    </SlideCanvas>
+                    <ClickNavZones
+                      onPrev={() => goTo(index - 1)}
+                      onNext={() => goTo(index + 1)}
+                      canPrev={index > 0}
+                      canNext={index < pageCount - 1}
+                    />
+                    <InspectOverlay />
+                    <SaveBar />
+                    {import.meta.env.DEV && <CommentWidget />}
+                  </main>
+                  {/* Mobile-only horizontal rail. Sits below the canvas and
                     pads its bottom for the iOS home indicator / Safari URL bar. */}
-                <div
-                  className="shrink-0 border-t border-hairline md:hidden"
-                  style={{ paddingBottom: 'env(safe-area-inset-bottom)' }}
-                >
-                  <ThumbnailRail
-                    pages={pages}
-                    design={slide.design}
-                    current={index}
-                    onSelect={goTo}
-                    orientation="horizontal"
-                  />
+                  <div
+                    className="shrink-0 border-t border-hairline md:hidden"
+                    style={{ paddingBottom: 'env(safe-area-inset-bottom)' }}
+                  >
+                    <ThumbnailRail
+                      pages={pages}
+                      design={slide.design}
+                      current={index}
+                      onSelect={goTo}
+                      orientation="horizontal"
+                      actions={thumbnailActions}
+                    />
+                  </div>
+                  <InspectorPanel />
+                  <DesignPanel open={designOpen} onClose={() => setDesignOpen(false)} />
                 </div>
-                <InspectorPanel />
-                <DesignPanel open={designOpen} onClose={() => setDesignOpen(false)} />
+                {import.meta.env.DEV && (
+                  <NotesDrawer
+                    slideId={slideId}
+                    index={index}
+                    total={pageCount}
+                    initial={slide.notes?.[index]}
+                  />
+                )}
               </div>
             </DesignProvider>
           )}
@@ -408,6 +553,48 @@ export function Slide() {
   );
 }
 
+function AgentConnectedBadge() {
+  const t = useLocale();
+  return (
+    <TooltipProvider delayDuration={200}>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <button
+            type="button"
+            className="ml-1 flex shrink-0 cursor-help items-center gap-1.5 rounded-[3px] border border-hairline bg-card px-1.5 py-0.5 text-[10.5px] text-foreground/85 outline-none focus-visible:ring-2 focus-visible:ring-ring/30"
+          >
+            <span aria-hidden className="relative flex size-1.5 items-center justify-center">
+              <span className="absolute inline-flex size-full animate-ping rounded-full bg-emerald-500 opacity-60" />
+              <span className="relative inline-flex size-1.5 rounded-full bg-emerald-500" />
+            </span>
+            {t.slide.agentConnected}
+          </button>
+        </TooltipTrigger>
+        <TooltipContent side="bottom" align="start" className="max-w-[280px] leading-relaxed">
+          {t.slide.agentConnectedTooltip}
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+}
+
+function SelectionReporter() {
+  const { selected } = useInspector();
+  useEffect(() => {
+    if (!import.meta.hot) return;
+    const selection = selected
+      ? {
+          line: selected.line,
+          column: selected.column,
+          tagName: selected.anchor.tagName.toLowerCase(),
+          text: (selected.anchor.textContent ?? '').replace(/\s+/g, ' ').trim().slice(0, 120),
+        }
+      : null;
+    import.meta.hot.send('open-slide:current', { selection });
+  }, [selected]);
+  return null;
+}
+
 function SlideWheelNavigation({
   targetRef,
   onPrev,

package/src/locale/en.ts

@@ -83,6 +83,9 @@ export const en: Locale = {
   slide: {
     home: 'Home',
     backToHome: 'Back to home',
+    agentConnected: 'Agent connected',
+    agentConnectedTooltip:
+      'The dev server is publishing your current slide and inspector selection to your agent. Ask "this slide" or "this element" in chat and it will resolve. Disappears in production builds.',
     download: 'Download',
     exportAsHtml: 'Export as HTML',
     exportAsPdf: 'Export as PDF',
@@ -156,6 +159,9 @@ export const en: Locale = {
   inspector: {
     inspect: 'Inspect',
     deselect: 'Deselect',
+    agentWatching: 'Agent is watching',
+    agentWatchingTooltip:
+      'Your agent already sees the selected element via the dev server — just ask it in chat. Leave comments here only when you want to queue a few before asking.',
     contentSection: 'Content',
     typographySection: 'Typography',
     colorSection: 'Color',
@@ -185,10 +191,17 @@ export const en: Locale = {
     pickerLoading: 'Loading…',
     pickerEmpty: "No images in this slide's assets folder yet. Add some from the Assets tab.",
     placeholderHintLabel: 'Hint:',
-    noteForAgent: 'Note for the agent',
-    noteAgentPlaceholder: 'Describe a change for the agent…',
-    noteShortcutHint: '⌘↵ to send',
-    addNote: 'Add note',
+    crop: 'Crop…',
+    cropDialogTitle: 'Crop image',
+    cropDialogDescription: 'Drag the frame to choose what stays visible.',
+    cropFitCover: 'Fill',
+    cropFitContain: 'Fit',
+    cropApply: 'Apply',
+    cropResetAria: 'Reset crop',
+    leaveComment: 'Leave a comment',
+    commentPlaceholder: 'Describe a change for the agent…',
+    commentShortcutHint: '⌘↵ to add',
+    addComment: 'Add comment',
     unsavedChanges: {
       one: '{count} unsaved change',
       other: '{count} unsaved changes',
@@ -224,6 +237,8 @@ export const en: Locale = {
     designToggle: 'Design',
     designToggleTitle: 'Design tokens',
     fontPresetCustom: 'Custom…',
+    shuffleAria: 'Shuffle design',
+    shuffleTitle: 'Shuffle for inspiration',
   },
 
   asset: {
@@ -279,6 +294,13 @@ export const en: Locale = {
   thumbnailRail: {
     pages: 'Pages',
     goToPageAria: 'Go to page {n}',
+    duplicatePage: 'Duplicate',
+    deletePage: 'Delete',
+    pageActionsAria: 'Page {n} actions',
+    toastDuplicated: 'Duplicated page {n}',
+    toastDeleted: 'Deleted page {n}',
+    toastDuplicateFailed: 'Could not duplicate page',
+    toastDeleteFailed: 'Could not delete page',
   },
 
   pdfToast: {
@@ -300,4 +322,13 @@ export const en: Locale = {
     prevAria: 'Previous page',
     nextAria: 'Next page',
   },
+
+  notesDrawer: {
+    toggle: 'Notes',
+    pageLabel: 'page {n}/{total}',
+    placeholder: 'Write speaker notes for this slide…',
+    statusSaving: 'Saving…',
+    statusSaved: 'Saved',
+    statusError: 'Save failed: {msg}',
+  },
 };

package/src/locale/ja.ts

@@ -81,6 +81,9 @@ export const ja: Locale = {
   },
 
   slide: {
+    agentConnected: 'エージェント接続中',
+    agentConnectedTooltip:
+      '現在のスライドと Inspector の選択状態を dev server がエージェントに公開しています。チャットで「このスライド」「この要素」と言えば認識されます。本番ビルドでは表示されません。',
     home: 'ホーム',
     backToHome: 'ホームへ戻る',
     download: 'ダウンロード',
@@ -186,10 +189,20 @@ export const ja: Locale = {
     pickerEmpty:
       'このスライドのアセットフォルダにまだ画像がありません。「アセット」タブから追加してください。',
     placeholderHintLabel: 'ヒント:',
-    noteForAgent: 'エージェントへのメモ',
-    noteAgentPlaceholder: 'エージェントに依頼する変更を記述…',
-    noteShortcutHint: '⌘↵ で送信',
-    addNote: 'メモを追加',
+    crop: 'トリミング…',
+    cropDialogTitle: '画像をトリミング',
+    cropDialogDescription: '枠をドラッグして表示する範囲を選択します。',
+    cropFitCover: '塗りつぶす',
+    cropFitContain: '全体表示',
+    cropApply: '適用',
+    cropResetAria: 'トリミングをリセット',
+    agentWatching: 'エージェント監視中',
+    agentWatchingTooltip:
+      'エージェントは選択中の要素を dev server 経由で把握しています。直接チャットで頼めます。ここにコメントを残すのは、複数の依頼をまとめて出したいときだけで OK。',
+    leaveComment: 'コメントを残す',
+    commentPlaceholder: 'エージェントに依頼する変更を記述…',
+    commentShortcutHint: '⌘↵ で追加',
+    addComment: 'コメントを追加',
     unsavedChanges: {
       one: '未保存の変更 {count} 件',
       other: '未保存の変更 {count} 件',
@@ -226,6 +239,8 @@ export const ja: Locale = {
     designToggle: 'デザイン',
     designToggleTitle: 'デザイントークン',
     fontPresetCustom: 'カスタム…',
+    shuffleAria: 'デザインをシャッフル',
+    shuffleTitle: 'シャッフルしてインスピレーションを得る',
   },
 
   asset: {
@@ -283,6 +298,13 @@ export const ja: Locale = {
   thumbnailRail: {
     pages: 'ページ',
     goToPageAria: 'ページ {n} へ移動',
+    duplicatePage: '複製',
+    deletePage: '削除',
+    pageActionsAria: 'ページ {n} の操作',
+    toastDuplicated: 'ページ {n} を複製しました',
+    toastDeleted: 'ページ {n} を削除しました',
+    toastDuplicateFailed: 'ページを複製できませんでした',
+    toastDeleteFailed: 'ページを削除できませんでした',
   },
 
   pdfToast: {
@@ -304,4 +326,13 @@ export const ja: Locale = {
     prevAria: '前のページ',
     nextAria: '次のページ',
   },
+
+  notesDrawer: {
+    toggle: '発表者ノート',
+    pageLabel: '{n} / {total} ページ',
+    placeholder: 'このスライドの発表者ノートを記入…',
+    statusSaving: '保存中…',
+    statusSaved: '保存済み',
+    statusError: '保存に失敗しました: {msg}',
+  },
 };

package/src/locale/types.ts

@@ -86,6 +86,8 @@ export type Locale = {
   slide: {
     home: string;
     backToHome: string;
+    agentConnected: string;
+    agentConnectedTooltip: string;
     download: string;
     exportAsHtml: string;
     exportAsPdf: string;
@@ -161,6 +163,8 @@ export type Locale = {
   inspector: {
     inspect: string;
     deselect: string;
+    agentWatching: string;
+    agentWatchingTooltip: string;
     contentSection: string;
     typographySection: string;
     colorSection: string;
@@ -191,10 +195,17 @@ export type Locale = {
     pickerLoading: string;
     pickerEmpty: string;
     placeholderHintLabel: string;
-    noteForAgent: string;
-    noteAgentPlaceholder: string;
-    noteShortcutHint: string;
-    addNote: string;
+    crop: string;
+    cropDialogTitle: string;
+    cropDialogDescription: string;
+    cropFitCover: string;
+    cropFitContain: string;
+    cropApply: string;
+    cropResetAria: string;
+    leaveComment: string;
+    commentPlaceholder: string;
+    commentShortcutHint: string;
+    addComment: string;
     /** templates: "{count} unsaved change" / "{count} unsaved changes" */
     unsavedChanges: Plural;
     /** templates: "{count} comment" / "{count} comments" */
@@ -228,6 +239,8 @@ export type Locale = {
     designToggle: string;
     designToggleTitle: string;
     fontPresetCustom: string;
+    shuffleAria: string;
+    shuffleTitle: string;
   };
 
   asset: {
@@ -298,6 +311,16 @@ export type Locale = {
     pages: string;
     /** template: "Go to page {n}" */
     goToPageAria: string;
+    duplicatePage: string;
+    deletePage: string;
+    /** template: "Page {n} actions" */
+    pageActionsAria: string;
+    /** template: "Duplicated page {n}" */
+    toastDuplicated: string;
+    /** template: "Deleted page {n}" */
+    toastDeleted: string;
+    toastDuplicateFailed: string;
+    toastDeleteFailed: string;
   };
 
   pdfToast: {
@@ -320,4 +343,15 @@ export type Locale = {
     prevAria: string;
     nextAria: string;
   };
+
+  notesDrawer: {
+    toggle: string;
+    /** template: "page {n}/{total}" */
+    pageLabel: string;
+    placeholder: string;
+    statusSaving: string;
+    statusSaved: string;
+    /** template: "Save failed: {msg}" */
+    statusError: string;
+  };
 };

package/src/locale/zh-cn.ts

@@ -81,6 +81,9 @@ export const zhCN: Locale = {
   },
 
   slide: {
+    agentConnected: 'Agent 已连接',
+    agentConnectedTooltip:
+      'Dev server 正在把你目前在哪张 slide、Inspector 选了哪个元素发布给 agent。直接到聊天说"这张 slide"或"这个元素"就行。Production build 不会出现。',
     home: '首页',
     backToHome: '返回首页',
     download: '下载',
@@ -185,10 +188,20 @@ export const zhCN: Locale = {
     pickerLoading: '加载中…',
     pickerEmpty: '该幻灯片的素材文件夹中尚无图片。请从「素材」标签页添加。',
     placeholderHintLabel: '提示:',
-    noteForAgent: '给代理的备注',
-    noteAgentPlaceholder: '描述你希望代理执行的更改…',
-    noteShortcutHint: '⌘↵ 发送',
-    addNote: '添加备注',
+    crop: '裁剪…',
+    cropDialogTitle: '裁剪图片',
+    cropDialogDescription: '拖动框线决定要保留的可见区域。',
+    cropFitCover: '填满',
+    cropFitContain: '完整显示',
+    cropApply: '应用',
+    cropResetAria: '重置裁剪',
+    agentWatching: 'Agent 正在关注',
+    agentWatchingTooltip:
+      'Agent 已经通过 dev server 看到你选的元素了，直接到聊天请它修改就行。想累积几个再一次问才需要在这里留 comments。',
+    leaveComment: '留个 comment',
+    commentPlaceholder: '描述你希望代理执行的更改…',
+    commentShortcutHint: '⌘↵ 添加',
+    addComment: '添加 comment',
     unsavedChanges: {
       one: '{count} 项未保存的更改',
       other: '{count} 项未保存的更改',
@@ -224,6 +237,8 @@ export const zhCN: Locale = {
     designToggle: '设计',
     designToggleTitle: '设计样式',
     fontPresetCustom: '自定义…',
+    shuffleAria: '随机设计',
+    shuffleTitle: '随机配色获取灵感',
   },
 
   asset: {
@@ -279,6 +294,13 @@ export const zhCN: Locale = {
   thumbnailRail: {
     pages: '页面',
     goToPageAria: '前往第 {n} 页',
+    duplicatePage: '复制',
+    deletePage: '删除',
+    pageActionsAria: '第 {n} 页的操作',
+    toastDuplicated: '已复制第 {n} 页',
+    toastDeleted: '已删除第 {n} 页',
+    toastDuplicateFailed: '无法复制页面',
+    toastDeleteFailed: '无法删除页面',
   },
 
   pdfToast: {
@@ -300,4 +322,13 @@ export const zhCN: Locale = {
     prevAria: '上一页',
     nextAria: '下一页',
   },
+
+  notesDrawer: {
+    toggle: '演讲备注',
+    pageLabel: '第 {n} / {total} 页',
+    placeholder: '为这一页撰写演讲备注…',
+    statusSaving: '保存中…',
+    statusSaved: '已保存',
+    statusError: '保存失败：{msg}',
+  },
 };