rita-workspace 0.3.0 → 0.3.2

package/README.md

@@ -8,6 +8,7 @@ Multi-drawing workspace feature for Rita (Excalidraw fork based on B310-digital/
 - **Menu integration** - Seamlessly integrates with Excalidraw's hamburger menu
 - **Auto-save** - All drawings saved locally in IndexedDB
 - **Rename & delete** - Full drawing management via dialog
+- **i18n support** - Swedish and English with automatic Excalidraw language sync
 
 ## Installation
 
@@ -29,17 +30,34 @@ Two files need to be modified in the B310/Excalidraw fork:
 import { WorkspaceProvider } from "rita-workspace";
 ```
 
-**Wrap with WorkspaceProvider** (in the `ExcalidrawApp` component):
+**Wrap with WorkspaceProvider** (in the `ExcalidrawWrapper` component to access `langCode`):
+
+```tsx
+const ExcalidrawWrapper = () => {
+  const [langCode] = useAppLangCode();  // Excalidraw's language hook
+
+  // ... existing code ...
+
+  return (
+    <WorkspaceProvider lang={langCode}>   {/* <-- Pass langCode here */}
+      <div style={{ height: "100%" }}>
+        <Excalidraw ... />
+      </div>
+    </WorkspaceProvider>
+  );
+};
+```
+
+Or if you prefer wrapping at the app level:
 
 ```tsx
 const ExcalidrawApp = () => {
-  // ...
   return (
     <TopErrorBoundary>
       <Provider store={appJotaiStore}>
-        <WorkspaceProvider>          {/* <-- Add this */}
+        <WorkspaceProvider lang="sv">    {/* <-- Or hardcode language */}
           <ExcalidrawWrapper />
-        </WorkspaceProvider>          {/* <-- And this */}
+        </WorkspaceProvider>
       </Provider>
     </TopErrorBoundary>
   );
@@ -61,15 +79,15 @@ import { WorkspaceMenuItems, DrawingsDialog } from "rita-workspace";
 
 ```tsx
 export const AppMainMenu: React.FC<{...}> = React.memo((props) => {
-  const [showDrawingsDialog, setShowDrawingsDialog] = useState(false);  // Add this
+  const [showDrawingsDialog, setShowDrawingsDialog] = useState(false);
 
   return (
-    <>                                          {/* Add fragment */}
+    <>
     <MainMenu>
       <MainMenu.DefaultItems.LoadScene />
       <MainMenu.DefaultItems.SaveToActiveFile />
 
-      {/* === RITA WORKSPACE: Add this block === */}
+      {/* === RITA WORKSPACE === */}
       <MainMenu.Sub>
         <MainMenu.Sub.Trigger>📄 Ritningar</MainMenu.Sub.Trigger>
         <MainMenu.Sub.Content>
@@ -78,25 +96,59 @@ export const AppMainMenu: React.FC<{...}> = React.memo((props) => {
           />
         </MainMenu.Sub.Content>
       </MainMenu.Sub>
-      {/* === END RITA WORKSPACE === */}
 
       <MainMenu.DefaultItems.Export />
       {/* ... rest of menu items ... */}
     </MainMenu>
 
-    {/* === RITA WORKSPACE: Add dialog === */}
     <DrawingsDialog
       open={showDrawingsDialog}
       onClose={() => setShowDrawingsDialog(false)}
     />
-    </>                                         {/* Close fragment */}
+    </>
   );
 });
 ```
 
+## Language Support (i18n)
+
+Rita Workspace supports **Swedish** and **English**, with automatic sync to Excalidraw's language setting.
+
+### Automatic Language Sync
+
+Pass Excalidraw's `langCode` to `WorkspaceProvider` - all child components inherit the language automatically:
+
+```tsx
+const [langCode] = useAppLangCode();  // From Excalidraw
+
+<WorkspaceProvider lang={langCode}>
+  {/* All components automatically use the same language */}
+  <WorkspaceMenuItems ... />
+  <DrawingsDialog ... />
+</WorkspaceProvider>
+```
+
+### Manual Override
+
+You can override the language on individual components if needed:
+
+```tsx
+<WorkspaceProvider lang="en">
+  {/* This dialog will be in Swedish despite provider being English */}
+  <DrawingsDialog lang="sv" ... />
+</WorkspaceProvider>
+```
+
+### Supported Languages
+
+| Code | Language |
+|------|----------|
+| `sv`, `sv-SE` | 🇸🇪 Swedish |
+| `en`, `en-US` | 🇬🇧 English (default) |
+
 ## Result
 
-After integration, a "📄 Ritningar" submenu appears in the hamburger menu:
+After integration, a "📄 Ritningar" (or "📄 Drawings") submenu appears in the hamburger menu:
 
 ```
 ┌─────────────────────────┐
@@ -119,28 +171,37 @@ After integration, a "📄 Ritningar" submenu appears in the hamburger menu:
 
 | Component | Description |
 |-----------|-------------|
-| `WorkspaceProvider` | React context provider - wrap your app with this |
-| `WorkspaceMenuItems` | Menu items for Excalidraw's MainMenu |
-| `DrawingsDialog` | Modal dialog for managing all drawings |
+| `WorkspaceProvider` | React context provider - wrap your app with this. Accepts `lang` prop. |
+| `WorkspaceMenuItems` | Menu items for Excalidraw's MainMenu. Optional `lang` prop for override. |
+| `DrawingsDialog` | Modal dialog for managing all drawings. Optional `lang` prop for override. |
 
 ### Hooks
 
 | Hook | Description |
 |------|-------------|
-| `useWorkspace()` | Access workspace state and actions |
+| `useWorkspace()` | Access workspace state, actions, and current language |
+| `useWorkspaceLang()` | Get just the current language and translations |
 
 ### useWorkspace() returns
 
 ```tsx
 const {
+  // State
   drawings,           // Drawing[] - all drawings
   activeDrawing,      // Drawing | null - currently active
   isLoading,          // boolean
-  createNewDrawing,   // () => Promise<Drawing>
+  error,              // string | null
+
+  // Language
+  lang,               // string - current language code
+  t,                  // Translations object
+
+  // Actions
+  createNewDrawing,   // (name?: string) => Promise<Drawing>
   switchDrawing,      // (id: string) => Promise<void>
   renameDrawing,      // (id: string, name: string) => Promise<void>
   removeDrawing,      // (id: string) => Promise<void>
-  saveCurrentDrawing, // (elements, appState, files?) => Promise<void>
+  saveCurrentDrawing, // (elements, appState) => Promise<void>
 } = useWorkspace();
 ```
 

package/dist/index.d.mts

@@ -52,12 +52,48 @@ declare function addDrawingToWorkspace(workspaceId: string, drawingId: string):
 declare function removeDrawingFromWorkspace(workspaceId: string, drawingId: string): Promise<Workspace | undefined>;
 declare function setActiveDrawing(workspaceId: string, drawingId: string): Promise<Workspace | undefined>;
 
+/**
+ * Rita Workspace Translations
+ *
+ * Supports Swedish (sv) and English (en)
+ */
+type SupportedLanguage = 'sv' | 'en';
+interface Translations {
+    drawings: string;
+    newDrawing: string;
+    manageDrawings: string;
+    dialogTitle: string;
+    close: string;
+    open: string;
+    rename: string;
+    delete: string;
+    save: string;
+    cancel: string;
+    confirm: string;
+    noDrawingsYet: string;
+    clickNewToStart: string;
+    modified: string;
+    confirmDelete: string;
+    shortcutNewDrawing: string;
+}
+/**
+ * Get translations for a language code
+ * Falls back to English if language is not supported
+ */
+declare function getTranslations(langCode?: string): Translations;
+/**
+ * Check if a language is supported
+ */
+declare function isLanguageSupported(langCode?: string): boolean;
+
 interface WorkspaceContextValue {
     workspace: Workspace | null;
     drawings: Drawing[];
     activeDrawing: Drawing | null;
     isLoading: boolean;
     error: string | null;
+    lang: string;
+    t: Translations;
     createNewDrawing: (name?: string) => Promise<Drawing | null>;
     switchDrawing: (id: string) => Promise<void>;
     renameDrawing: (id: string, name: string) => Promise<void>;
@@ -66,10 +102,24 @@ interface WorkspaceContextValue {
     saveCurrentDrawing: (elements: unknown[], appState: Record<string, unknown>) => Promise<void>;
 }
 declare function useWorkspace(): WorkspaceContextValue;
+/**
+ * Hook to get current language and translations
+ * Can be used by any component within WorkspaceProvider
+ */
+declare function useWorkspaceLang(): {
+    lang: string;
+    t: Translations;
+};
 interface WorkspaceProviderProps {
     children: ReactNode;
+    /**
+     * Language code (e.g., 'sv', 'en', 'sv-SE')
+     * Pass Excalidraw's langCode here to sync languages
+     * Falls back to English if not supported
+     */
+    lang?: string;
 }
-declare function WorkspaceProvider({ children }: WorkspaceProviderProps): react_jsx_runtime.JSX.Element;
+declare function WorkspaceProvider({ children, lang }: WorkspaceProviderProps): react_jsx_runtime.JSX.Element;
 
 interface SidebarProps {
     isOpen?: boolean;
@@ -212,40 +262,6 @@ declare function useExcalidrawBridge({ excalidrawAPI, autoSaveInterval, }: UseEx
     scheduleSave: () => void;
 };
 
-/**
- * Rita Workspace Translations
- *
- * Supports Swedish (sv) and English (en)
- */
-type SupportedLanguage = 'sv' | 'en';
-interface Translations {
-    drawings: string;
-    newDrawing: string;
-    manageDrawings: string;
-    dialogTitle: string;
-    close: string;
-    open: string;
-    rename: string;
-    delete: string;
-    save: string;
-    cancel: string;
-    confirm: string;
-    noDrawingsYet: string;
-    clickNewToStart: string;
-    modified: string;
-    confirmDelete: string;
-    shortcutNewDrawing: string;
-}
-/**
- * Get translations for a language code
- * Falls back to English if language is not supported
- */
-declare function getTranslations(langCode?: string): Translations;
-/**
- * Check if a language is supported
- */
-declare function isLanguageSupported(langCode?: string): boolean;
-
 interface WorkspacePluginProps {
     children: ReactNode;
     defaultSidebarOpen?: boolean;
@@ -269,4 +285,4 @@ interface WorkspacePluginProps {
  */
 declare function WorkspacePlugin(props: WorkspacePluginProps): react_jsx_runtime.JSX.Element;
 
-export { type Drawing, DrawingList, DrawingListItem, DrawingsDialog, type DrawingsDialogProps, Sidebar, type SupportedLanguage, type Translations, type Workspace, type WorkspaceContextValue, WorkspaceMenuItems, type WorkspaceMenuItemsProps, WorkspacePlugin, WorkspaceProvider, addDrawingToWorkspace, closeDB, createDrawing, deleteDrawing, duplicateDrawing, getAllDrawings, getDB, getDrawing, getOrCreateDefaultWorkspace, getTranslations, getWorkspace, isLanguageSupported, removeDrawingFromWorkspace, setActiveDrawing, updateDrawing, updateWorkspace, useExcalidrawBridge, useWorkspace };
+export { type Drawing, DrawingList, DrawingListItem, DrawingsDialog, type DrawingsDialogProps, Sidebar, type SupportedLanguage, type Translations, type Workspace, type WorkspaceContextValue, WorkspaceMenuItems, type WorkspaceMenuItemsProps, WorkspacePlugin, WorkspaceProvider, addDrawingToWorkspace, closeDB, createDrawing, deleteDrawing, duplicateDrawing, getAllDrawings, getDB, getDrawing, getOrCreateDefaultWorkspace, getTranslations, getWorkspace, isLanguageSupported, removeDrawingFromWorkspace, setActiveDrawing, updateDrawing, updateWorkspace, useExcalidrawBridge, useWorkspace, useWorkspaceLang };

package/dist/index.d.ts

@@ -52,12 +52,48 @@ declare function addDrawingToWorkspace(workspaceId: string, drawingId: string):
 declare function removeDrawingFromWorkspace(workspaceId: string, drawingId: string): Promise<Workspace | undefined>;
 declare function setActiveDrawing(workspaceId: string, drawingId: string): Promise<Workspace | undefined>;
 
+/**
+ * Rita Workspace Translations
+ *
+ * Supports Swedish (sv) and English (en)
+ */
+type SupportedLanguage = 'sv' | 'en';
+interface Translations {
+    drawings: string;
+    newDrawing: string;
+    manageDrawings: string;
+    dialogTitle: string;
+    close: string;
+    open: string;
+    rename: string;
+    delete: string;
+    save: string;
+    cancel: string;
+    confirm: string;
+    noDrawingsYet: string;
+    clickNewToStart: string;
+    modified: string;
+    confirmDelete: string;
+    shortcutNewDrawing: string;
+}
+/**
+ * Get translations for a language code
+ * Falls back to English if language is not supported
+ */
+declare function getTranslations(langCode?: string): Translations;
+/**
+ * Check if a language is supported
+ */
+declare function isLanguageSupported(langCode?: string): boolean;
+
 interface WorkspaceContextValue {
     workspace: Workspace | null;
     drawings: Drawing[];
     activeDrawing: Drawing | null;
     isLoading: boolean;
     error: string | null;
+    lang: string;
+    t: Translations;
     createNewDrawing: (name?: string) => Promise<Drawing | null>;
     switchDrawing: (id: string) => Promise<void>;
     renameDrawing: (id: string, name: string) => Promise<void>;
@@ -66,10 +102,24 @@ interface WorkspaceContextValue {
     saveCurrentDrawing: (elements: unknown[], appState: Record<string, unknown>) => Promise<void>;
 }
 declare function useWorkspace(): WorkspaceContextValue;
+/**
+ * Hook to get current language and translations
+ * Can be used by any component within WorkspaceProvider
+ */
+declare function useWorkspaceLang(): {
+    lang: string;
+    t: Translations;
+};
 interface WorkspaceProviderProps {
     children: ReactNode;
+    /**
+     * Language code (e.g., 'sv', 'en', 'sv-SE')
+     * Pass Excalidraw's langCode here to sync languages
+     * Falls back to English if not supported
+     */
+    lang?: string;
 }
-declare function WorkspaceProvider({ children }: WorkspaceProviderProps): react_jsx_runtime.JSX.Element;
+declare function WorkspaceProvider({ children, lang }: WorkspaceProviderProps): react_jsx_runtime.JSX.Element;
 
 interface SidebarProps {
     isOpen?: boolean;
@@ -212,40 +262,6 @@ declare function useExcalidrawBridge({ excalidrawAPI, autoSaveInterval, }: UseEx
     scheduleSave: () => void;
 };
 
-/**
- * Rita Workspace Translations
- *
- * Supports Swedish (sv) and English (en)
- */
-type SupportedLanguage = 'sv' | 'en';
-interface Translations {
-    drawings: string;
-    newDrawing: string;
-    manageDrawings: string;
-    dialogTitle: string;
-    close: string;
-    open: string;
-    rename: string;
-    delete: string;
-    save: string;
-    cancel: string;
-    confirm: string;
-    noDrawingsYet: string;
-    clickNewToStart: string;
-    modified: string;
-    confirmDelete: string;
-    shortcutNewDrawing: string;
-}
-/**
- * Get translations for a language code
- * Falls back to English if language is not supported
- */
-declare function getTranslations(langCode?: string): Translations;
-/**
- * Check if a language is supported
- */
-declare function isLanguageSupported(langCode?: string): boolean;
-
 interface WorkspacePluginProps {
     children: ReactNode;
     defaultSidebarOpen?: boolean;
@@ -269,4 +285,4 @@ interface WorkspacePluginProps {
  */
 declare function WorkspacePlugin(props: WorkspacePluginProps): react_jsx_runtime.JSX.Element;
 
-export { type Drawing, DrawingList, DrawingListItem, DrawingsDialog, type DrawingsDialogProps, Sidebar, type SupportedLanguage, type Translations, type Workspace, type WorkspaceContextValue, WorkspaceMenuItems, type WorkspaceMenuItemsProps, WorkspacePlugin, WorkspaceProvider, addDrawingToWorkspace, closeDB, createDrawing, deleteDrawing, duplicateDrawing, getAllDrawings, getDB, getDrawing, getOrCreateDefaultWorkspace, getTranslations, getWorkspace, isLanguageSupported, removeDrawingFromWorkspace, setActiveDrawing, updateDrawing, updateWorkspace, useExcalidrawBridge, useWorkspace };
+export { type Drawing, DrawingList, DrawingListItem, DrawingsDialog, type DrawingsDialogProps, Sidebar, type SupportedLanguage, type Translations, type Workspace, type WorkspaceContextValue, WorkspaceMenuItems, type WorkspaceMenuItemsProps, WorkspacePlugin, WorkspaceProvider, addDrawingToWorkspace, closeDB, createDrawing, deleteDrawing, duplicateDrawing, getAllDrawings, getDB, getDrawing, getOrCreateDefaultWorkspace, getTranslations, getWorkspace, isLanguageSupported, removeDrawingFromWorkspace, setActiveDrawing, updateDrawing, updateWorkspace, useExcalidrawBridge, useWorkspace, useWorkspaceLang };

package/dist/index.js

@@ -54,7 +54,8 @@ __export(index_exports, {
   updateDrawing: () => updateDrawing,
   updateWorkspace: () => updateWorkspace,
   useExcalidrawBridge: () => useExcalidrawBridge,
-  useWorkspace: () => useWorkspace
+  useWorkspace: () => useWorkspace,
+  useWorkspaceLang: () => useWorkspaceLang
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -206,6 +207,71 @@ async function setActiveDrawing(workspaceId, drawingId) {
 
 // src/state/WorkspaceContext.tsx
 var import_react = require("react");
+
+// src/i18n/translations.ts
+var sv = {
+  // Menu
+  drawings: "Ritningar",
+  newDrawing: "Ny ritning",
+  manageDrawings: "Hantera ritningar...",
+  // Dialog
+  dialogTitle: "Ritningar",
+  close: "St\xE4ng",
+  open: "\xD6ppna",
+  rename: "Byt namn",
+  delete: "Ta bort",
+  save: "Spara",
+  cancel: "Avbryt",
+  confirm: "Bekr\xE4fta",
+  // Messages
+  noDrawingsYet: "Inga ritningar \xE4nnu.",
+  clickNewToStart: 'Klicka "Ny ritning" f\xF6r att b\xF6rja.',
+  modified: "\xC4ndrad",
+  confirmDelete: "Vill du ta bort denna ritning?",
+  // Shortcuts
+  shortcutNewDrawing: "Ctrl+Alt+N"
+};
+var en = {
+  // Menu
+  drawings: "Drawings",
+  newDrawing: "New drawing",
+  manageDrawings: "Manage drawings...",
+  // Dialog
+  dialogTitle: "Drawings",
+  close: "Close",
+  open: "Open",
+  rename: "Rename",
+  delete: "Delete",
+  save: "Save",
+  cancel: "Cancel",
+  confirm: "Confirm",
+  // Messages
+  noDrawingsYet: "No drawings yet.",
+  clickNewToStart: 'Click "New drawing" to start.',
+  modified: "Modified",
+  confirmDelete: "Do you want to delete this drawing?",
+  // Shortcuts
+  shortcutNewDrawing: "Ctrl+Alt+N"
+};
+var translations = {
+  sv,
+  en
+};
+function getTranslations(langCode) {
+  if (!langCode) return en;
+  const lang = langCode.split("-")[0].toLowerCase();
+  if (lang in translations) {
+    return translations[lang];
+  }
+  return en;
+}
+function isLanguageSupported(langCode) {
+  if (!langCode) return false;
+  const lang = langCode.split("-")[0].toLowerCase();
+  return lang in translations;
+}
+
+// src/state/WorkspaceContext.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var WorkspaceContext = (0, import_react.createContext)(null);
 function useWorkspace() {
@@ -215,12 +281,20 @@ function useWorkspace() {
   }
   return context;
 }
-function WorkspaceProvider({ children }) {
+function useWorkspaceLang() {
+  const context = (0, import_react.useContext)(WorkspaceContext);
+  if (!context) {
+    return { lang: "en", t: getTranslations("en") };
+  }
+  return { lang: context.lang, t: context.t };
+}
+function WorkspaceProvider({ children, lang = "en" }) {
   const [workspace, setWorkspace] = (0, import_react.useState)(null);
   const [drawings, setDrawings] = (0, import_react.useState)([]);
   const [activeDrawing, setActiveDrawing2] = (0, import_react.useState)(null);
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
   const [error, setError] = (0, import_react.useState)(null);
+  const t = getTranslations(lang);
   (0, import_react.useEffect)(() => {
     async function init() {
       try {
@@ -245,7 +319,8 @@ function WorkspaceProvider({ children }) {
   const createNewDrawing = (0, import_react.useCallback)(async (name) => {
     if (!workspace) return null;
     try {
-      const drawing = await createDrawing(name || `Ritning ${drawings.length + 1}`);
+      const defaultName = `${t.newDrawing} ${drawings.length + 1}`;
+      const drawing = await createDrawing(name || defaultName);
       await addDrawingToWorkspace(workspace.id, drawing.id);
       await setActiveDrawing(workspace.id, drawing.id);
       setDrawings((prev) => [...prev, drawing]);
@@ -260,7 +335,7 @@ function WorkspaceProvider({ children }) {
       setError(err instanceof Error ? err.message : "Failed to create drawing");
       return null;
     }
-  }, [workspace, drawings.length]);
+  }, [workspace, drawings.length, t]);
   const switchDrawing = (0, import_react.useCallback)(async (id) => {
     if (!workspace) return;
     try {
@@ -341,6 +416,8 @@ function WorkspaceProvider({ children }) {
     activeDrawing,
     isLoading,
     error,
+    lang,
+    t,
     createNewDrawing,
     switchDrawing,
     renameDrawing,
@@ -545,71 +622,6 @@ function Sidebar({ isOpen = true, onToggle, width = 250 }) {
 
 // src/ui/Menu/WorkspaceMenuItems.tsx
 var import_react4 = __toESM(require("react"));
-
-// src/i18n/translations.ts
-var sv = {
-  // Menu
-  drawings: "Ritningar",
-  newDrawing: "Ny ritning",
-  manageDrawings: "Hantera ritningar...",
-  // Dialog
-  dialogTitle: "Ritningar",
-  close: "St\xE4ng",
-  open: "\xD6ppna",
-  rename: "Byt namn",
-  delete: "Ta bort",
-  save: "Spara",
-  cancel: "Avbryt",
-  confirm: "Bekr\xE4fta",
-  // Messages
-  noDrawingsYet: "Inga ritningar \xE4nnu.",
-  clickNewToStart: 'Klicka "Ny ritning" f\xF6r att b\xF6rja.',
-  modified: "\xC4ndrad",
-  confirmDelete: "Vill du ta bort denna ritning?",
-  // Shortcuts
-  shortcutNewDrawing: "Ctrl+Alt+N"
-};
-var en = {
-  // Menu
-  drawings: "Drawings",
-  newDrawing: "New drawing",
-  manageDrawings: "Manage drawings...",
-  // Dialog
-  dialogTitle: "Drawings",
-  close: "Close",
-  open: "Open",
-  rename: "Rename",
-  delete: "Delete",
-  save: "Save",
-  cancel: "Cancel",
-  confirm: "Confirm",
-  // Messages
-  noDrawingsYet: "No drawings yet.",
-  clickNewToStart: 'Click "New drawing" to start.',
-  modified: "Modified",
-  confirmDelete: "Do you want to delete this drawing?",
-  // Shortcuts
-  shortcutNewDrawing: "Ctrl+Alt+N"
-};
-var translations = {
-  sv,
-  en
-};
-function getTranslations(langCode) {
-  if (!langCode) return en;
-  const lang = langCode.split("-")[0].toLowerCase();
-  if (lang in translations) {
-    return translations[lang];
-  }
-  return en;
-}
-function isLanguageSupported(langCode) {
-  if (!langCode) return false;
-  const lang = langCode.split("-")[0].toLowerCase();
-  return lang in translations;
-}
-
-// src/ui/Menu/WorkspaceMenuItems.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var DrawingsIcon = /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
   /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
@@ -653,8 +665,8 @@ var WorkspaceMenuItems = ({
   renderSubMenu,
   renderSeparator
 }) => {
-  const { drawings, activeDrawing, switchDrawing, createNewDrawing } = useWorkspace();
-  const t = getTranslations(lang);
+  const { drawings, activeDrawing, switchDrawing, createNewDrawing, t: contextT, lang: contextLang } = useWorkspace();
+  const t = lang ? getTranslations(lang) : contextT;
   const MenuItem = renderMenuItem || ((props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DefaultMenuItem, { ...props }));
   const Separator = renderSeparator || (() => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("hr", { style: { margin: "4px 0", border: "none", borderTop: "1px solid #ccc" } }));
   const handleDrawingSelect = async (drawing) => {
@@ -734,9 +746,12 @@ var DrawingsDialog = ({
     switchDrawing,
     createNewDrawing,
     renameDrawing,
-    removeDrawing
+    removeDrawing,
+    t: contextT,
+    lang: contextLang
   } = useWorkspace();
-  const t = getTranslations(lang);
+  const t = lang ? getTranslations(lang) : contextT;
+  const effectiveLang = lang || contextLang;
   const [editingId, setEditingId] = (0, import_react5.useState)(null);
   const [editName, setEditName] = (0, import_react5.useState)("");
   const [confirmDeleteId, setConfirmDeleteId] = (0, import_react5.useState)(null);
@@ -772,8 +787,8 @@ var DrawingsDialog = ({
     setConfirmDeleteId(null);
   }, [removeDrawing]);
   const getLocale = () => {
-    if (!lang) return "en-US";
-    const baseLang = lang.split("-")[0].toLowerCase();
+    if (!effectiveLang) return "en-US";
+    const baseLang = effectiveLang.split("-")[0].toLowerCase();
     if (baseLang === "sv") return "sv-SE";
     return "en-US";
   };
@@ -1257,5 +1272,6 @@ function WorkspacePlugin(props) {
   updateDrawing,
   updateWorkspace,
   useExcalidrawBridge,
-  useWorkspace
+  useWorkspace,
+  useWorkspaceLang
 });

package/dist/index.mjs

@@ -146,6 +146,71 @@ async function setActiveDrawing(workspaceId, drawingId) {
 
 // src/state/WorkspaceContext.tsx
 import { createContext, useContext, useEffect, useState, useCallback } from "react";
+
+// src/i18n/translations.ts
+var sv = {
+  // Menu
+  drawings: "Ritningar",
+  newDrawing: "Ny ritning",
+  manageDrawings: "Hantera ritningar...",
+  // Dialog
+  dialogTitle: "Ritningar",
+  close: "St\xE4ng",
+  open: "\xD6ppna",
+  rename: "Byt namn",
+  delete: "Ta bort",
+  save: "Spara",
+  cancel: "Avbryt",
+  confirm: "Bekr\xE4fta",
+  // Messages
+  noDrawingsYet: "Inga ritningar \xE4nnu.",
+  clickNewToStart: 'Klicka "Ny ritning" f\xF6r att b\xF6rja.',
+  modified: "\xC4ndrad",
+  confirmDelete: "Vill du ta bort denna ritning?",
+  // Shortcuts
+  shortcutNewDrawing: "Ctrl+Alt+N"
+};
+var en = {
+  // Menu
+  drawings: "Drawings",
+  newDrawing: "New drawing",
+  manageDrawings: "Manage drawings...",
+  // Dialog
+  dialogTitle: "Drawings",
+  close: "Close",
+  open: "Open",
+  rename: "Rename",
+  delete: "Delete",
+  save: "Save",
+  cancel: "Cancel",
+  confirm: "Confirm",
+  // Messages
+  noDrawingsYet: "No drawings yet.",
+  clickNewToStart: 'Click "New drawing" to start.',
+  modified: "Modified",
+  confirmDelete: "Do you want to delete this drawing?",
+  // Shortcuts
+  shortcutNewDrawing: "Ctrl+Alt+N"
+};
+var translations = {
+  sv,
+  en
+};
+function getTranslations(langCode) {
+  if (!langCode) return en;
+  const lang = langCode.split("-")[0].toLowerCase();
+  if (lang in translations) {
+    return translations[lang];
+  }
+  return en;
+}
+function isLanguageSupported(langCode) {
+  if (!langCode) return false;
+  const lang = langCode.split("-")[0].toLowerCase();
+  return lang in translations;
+}
+
+// src/state/WorkspaceContext.tsx
 import { jsx } from "react/jsx-runtime";
 var WorkspaceContext = createContext(null);
 function useWorkspace() {
@@ -155,12 +220,20 @@ function useWorkspace() {
   }
   return context;
 }
-function WorkspaceProvider({ children }) {
+function useWorkspaceLang() {
+  const context = useContext(WorkspaceContext);
+  if (!context) {
+    return { lang: "en", t: getTranslations("en") };
+  }
+  return { lang: context.lang, t: context.t };
+}
+function WorkspaceProvider({ children, lang = "en" }) {
   const [workspace, setWorkspace] = useState(null);
   const [drawings, setDrawings] = useState([]);
   const [activeDrawing, setActiveDrawing2] = useState(null);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
+  const t = getTranslations(lang);
   useEffect(() => {
     async function init() {
       try {
@@ -185,7 +258,8 @@ function WorkspaceProvider({ children }) {
   const createNewDrawing = useCallback(async (name) => {
     if (!workspace) return null;
     try {
-      const drawing = await createDrawing(name || `Ritning ${drawings.length + 1}`);
+      const defaultName = `${t.newDrawing} ${drawings.length + 1}`;
+      const drawing = await createDrawing(name || defaultName);
       await addDrawingToWorkspace(workspace.id, drawing.id);
       await setActiveDrawing(workspace.id, drawing.id);
       setDrawings((prev) => [...prev, drawing]);
@@ -200,7 +274,7 @@ function WorkspaceProvider({ children }) {
       setError(err instanceof Error ? err.message : "Failed to create drawing");
       return null;
     }
-  }, [workspace, drawings.length]);
+  }, [workspace, drawings.length, t]);
   const switchDrawing = useCallback(async (id) => {
     if (!workspace) return;
     try {
@@ -281,6 +355,8 @@ function WorkspaceProvider({ children }) {
     activeDrawing,
     isLoading,
     error,
+    lang,
+    t,
     createNewDrawing,
     switchDrawing,
     renameDrawing,
@@ -485,71 +561,6 @@ function Sidebar({ isOpen = true, onToggle, width = 250 }) {
 
 // src/ui/Menu/WorkspaceMenuItems.tsx
 import React4 from "react";
-
-// src/i18n/translations.ts
-var sv = {
-  // Menu
-  drawings: "Ritningar",
-  newDrawing: "Ny ritning",
-  manageDrawings: "Hantera ritningar...",
-  // Dialog
-  dialogTitle: "Ritningar",
-  close: "St\xE4ng",
-  open: "\xD6ppna",
-  rename: "Byt namn",
-  delete: "Ta bort",
-  save: "Spara",
-  cancel: "Avbryt",
-  confirm: "Bekr\xE4fta",
-  // Messages
-  noDrawingsYet: "Inga ritningar \xE4nnu.",
-  clickNewToStart: 'Klicka "Ny ritning" f\xF6r att b\xF6rja.',
-  modified: "\xC4ndrad",
-  confirmDelete: "Vill du ta bort denna ritning?",
-  // Shortcuts
-  shortcutNewDrawing: "Ctrl+Alt+N"
-};
-var en = {
-  // Menu
-  drawings: "Drawings",
-  newDrawing: "New drawing",
-  manageDrawings: "Manage drawings...",
-  // Dialog
-  dialogTitle: "Drawings",
-  close: "Close",
-  open: "Open",
-  rename: "Rename",
-  delete: "Delete",
-  save: "Save",
-  cancel: "Cancel",
-  confirm: "Confirm",
-  // Messages
-  noDrawingsYet: "No drawings yet.",
-  clickNewToStart: 'Click "New drawing" to start.',
-  modified: "Modified",
-  confirmDelete: "Do you want to delete this drawing?",
-  // Shortcuts
-  shortcutNewDrawing: "Ctrl+Alt+N"
-};
-var translations = {
-  sv,
-  en
-};
-function getTranslations(langCode) {
-  if (!langCode) return en;
-  const lang = langCode.split("-")[0].toLowerCase();
-  if (lang in translations) {
-    return translations[lang];
-  }
-  return en;
-}
-function isLanguageSupported(langCode) {
-  if (!langCode) return false;
-  const lang = langCode.split("-")[0].toLowerCase();
-  return lang in translations;
-}
-
-// src/ui/Menu/WorkspaceMenuItems.tsx
 import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 var DrawingsIcon = /* @__PURE__ */ jsxs3("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
   /* @__PURE__ */ jsx5("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
@@ -593,8 +604,8 @@ var WorkspaceMenuItems = ({
   renderSubMenu,
   renderSeparator
 }) => {
-  const { drawings, activeDrawing, switchDrawing, createNewDrawing } = useWorkspace();
-  const t = getTranslations(lang);
+  const { drawings, activeDrawing, switchDrawing, createNewDrawing, t: contextT, lang: contextLang } = useWorkspace();
+  const t = lang ? getTranslations(lang) : contextT;
   const MenuItem = renderMenuItem || ((props) => /* @__PURE__ */ jsx5(DefaultMenuItem, { ...props }));
   const Separator = renderSeparator || (() => /* @__PURE__ */ jsx5("hr", { style: { margin: "4px 0", border: "none", borderTop: "1px solid #ccc" } }));
   const handleDrawingSelect = async (drawing) => {
@@ -674,9 +685,12 @@ var DrawingsDialog = ({
     switchDrawing,
     createNewDrawing,
     renameDrawing,
-    removeDrawing
+    removeDrawing,
+    t: contextT,
+    lang: contextLang
   } = useWorkspace();
-  const t = getTranslations(lang);
+  const t = lang ? getTranslations(lang) : contextT;
+  const effectiveLang = lang || contextLang;
   const [editingId, setEditingId] = useState4(null);
   const [editName, setEditName] = useState4("");
   const [confirmDeleteId, setConfirmDeleteId] = useState4(null);
@@ -712,8 +726,8 @@ var DrawingsDialog = ({
     setConfirmDeleteId(null);
   }, [removeDrawing]);
   const getLocale = () => {
-    if (!lang) return "en-US";
-    const baseLang = lang.split("-")[0].toLowerCase();
+    if (!effectiveLang) return "en-US";
+    const baseLang = effectiveLang.split("-")[0].toLowerCase();
     if (baseLang === "sv") return "sv-SE";
     return "en-US";
   };
@@ -1196,5 +1210,6 @@ export {
   updateDrawing,
   updateWorkspace,
   useExcalidrawBridge,
-  useWorkspace
+  useWorkspace,
+  useWorkspaceLang
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rita-workspace",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "description": "Multi-drawing workspace feature for Rita (Excalidraw fork)",
   "main": "dist/index.js",
   "module": "dist/index.mjs",