@palettelab/cli 0.3.25 → 0.3.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@palettelab/cli",
-  "version": "0.3.25",
+  "version": "0.3.27",
   "description": "Developer CLI for building Palette platform plugins — no platform source access required.",
   "bin": {
     "pltt": "bin/pltt.js"
@@ -8,6 +8,7 @@
   "files": [
     "bin",
     "backend-sdk",
+    "docs",
     "lib",
     "platform-dev",
     "template-fallback",

package/template-fallback/frontend/src/index.tsx

@@ -5,46 +5,58 @@
  *
  * This is the root component that the platform renders when your plugin is opened.
  * It receives a `platform` prop with access to the authenticated user, API client,
- * navigation, and toast notifications.
+ * navigation, toast notifications, and Palette OS language.
  *
  * Available hooks from @palettelab/sdk:
- *   - usePlatform()       — access user, org, apiFetch, navigate, showToast
- *   - usePluginTasks()    — CRUD tasks
- *   - usePluginDataRooms() — browse data rooms and files
- *   - usePluginChat()     — chat with agents
+ *   - usePlatform()           - access user, org, API, language, navigate, showToast
+ *   - usePluginTranslations() - translate app-owned resource files using OS language
+ *   - usePluginTasks()        - CRUD tasks
+ *   - usePluginDataRooms()    - browse data rooms and files
+ *   - usePluginChat()         - chat with agents
  */
 
-import { usePlatform, usePluginTasks } from "@palettelab/sdk"
+import { usePlatform, usePluginTasks, usePluginTranslations } from "@palettelab/sdk"
 import type { PluginComponentProps } from "@palettelab/sdk"
+import { translations } from "./translations"
 
-export default function MyPlugin({ platform }: PluginComponentProps) {
+export default function MyPlugin(_props: PluginComponentProps) {
   const { user, showToast } = usePlatform()
   const { tasks, loading, createTask } = usePluginTasks()
+  const { t, language, setLanguage } = usePluginTranslations(translations)
 
   return (
     <div className="p-6 space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold">My Plugin</h1>
-        <p className="text-muted-foreground mt-1">
-          Hello, {user.name}! This is your plugin template.
-        </p>
+      <div className="flex flex-wrap items-start justify-between gap-3">
+        <div>
+          <h1 className="text-2xl font-bold">{t("title")}</h1>
+          <p className="text-muted-foreground mt-1">
+            {t("greeting", { name: user.name })}
+          </p>
+        </div>
+        <button
+          className="px-3 py-1.5 text-sm border rounded-md hover:bg-muted"
+          onClick={() => setLanguage(language === "ko" ? "en" : "ko")}
+          aria-label={t("language")}
+        >
+          {language === "ko" ? "EN" : "KO"}
+        </button>
       </div>
 
       <div className="rounded-lg border p-4 space-y-3">
-        <h2 className="font-semibold">Quick Start</h2>
+        <h2 className="font-semibold">{t("quickStart")}</h2>
         <ul className="text-sm text-muted-foreground space-y-1 list-disc list-inside">
-          <li>Edit <code>frontend/src/index.tsx</code> to build your UI</li>
-          <li>Edit <code>backend/api/main.py</code> to add API endpoints</li>
-          <li>Use <code>usePlatform()</code> to access the authenticated user and API</li>
-          <li>Use <code>usePluginTasks()</code> to manage tasks</li>
-          <li>Use <code>usePluginDataRooms()</code> to browse files</li>
+          <li>{t("editUi")}</li>
+          <li>{t("editApi")}</li>
+          <li>{t("usePlatform")}</li>
+          <li>{t("useTasks")}</li>
+          <li>{t("useDataRooms")}</li>
         </ul>
       </div>
 
       <div className="rounded-lg border p-4">
-        <h2 className="font-semibold mb-2">Tasks ({loading ? "..." : tasks.length})</h2>
+        <h2 className="font-semibold mb-2">{t("tasks")} ({loading ? "..." : tasks.length})</h2>
         {!loading && tasks.length === 0 && (
-          <p className="text-sm text-muted-foreground">No tasks yet.</p>
+          <p className="text-sm text-muted-foreground">{t("noTasks")}</p>
         )}
         {tasks.slice(0, 5).map(task => (
           <div key={task.id} className="flex items-center justify-between py-1 text-sm">
@@ -55,11 +67,11 @@ export default function MyPlugin({ platform }: PluginComponentProps) {
         <button
           className="mt-3 px-3 py-1.5 text-sm bg-primary text-primary-foreground rounded-md hover:bg-primary/90"
           onClick={async () => {
-            await createTask({ title: "Sample task from plugin", priority: "medium" })
-            showToast("Task created!", "success")
+            await createTask({ title: t("sampleTaskTitle"), priority: "medium" })
+            showToast(t("taskCreated"), "success")
           }}
         >
-          Create Sample Task
+          {t("createSampleTask")}
         </button>
       </div>
     </div>

package/template-fallback/frontend/src/translations.ts

@@ -0,0 +1,36 @@
+import type { TranslationResources } from "@palettelab/sdk"
+
+export const translations = {
+  en: {
+    title: "My Plugin",
+    greeting: "Hello, {{name}}! This plugin follows the Palette OS language.",
+    quickStart: "Quick Start",
+    editUi: "Edit frontend/src/index.tsx to build your UI",
+    editApi: "Edit backend/api/main.py to add API endpoints",
+    usePlatform: "Use usePlatform() to access the authenticated user and API",
+    useTasks: "Use usePluginTasks() to manage tasks",
+    useDataRooms: "Use usePluginDataRooms() to browse files",
+    tasks: "Tasks",
+    noTasks: "No tasks yet.",
+    createSampleTask: "Create Sample Task",
+    sampleTaskTitle: "Sample task from plugin",
+    taskCreated: "Task created!",
+    language: "Language",
+  },
+  ko: {
+    title: "내 플러그인",
+    greeting: "안녕하세요, {{name}}님! 이 플러그인은 Palette OS 언어를 따릅니다.",
+    quickStart: "빠른 시작",
+    editUi: "frontend/src/index.tsx를 수정해 UI를 만드세요",
+    editApi: "backend/api/main.py를 수정해 API 엔드포인트를 추가하세요",
+    usePlatform: "usePlatform()으로 인증 사용자와 API에 접근하세요",
+    useTasks: "usePluginTasks()로 작업을 관리하세요",
+    useDataRooms: "usePluginDataRooms()로 파일을 둘러보세요",
+    tasks: "작업",
+    noTasks: "아직 작업이 없습니다.",
+    createSampleTask: "샘플 작업 만들기",
+    sampleTaskTitle: "플러그인에서 만든 샘플 작업",
+    taskCreated: "작업이 생성되었습니다!",
+    language: "언어",
+  },
+} satisfies TranslationResources

package/template-fallback/package.json

@@ -4,7 +4,7 @@
   "private": true,
   "description": "A Palette platform plugin",
   "dependencies": {
-    "@palettelab/sdk": "^0.1.10"
+    "@palettelab/sdk": "^0.1.11"
   },
   "devDependencies": {
     "typescript": "^5.0.0",

package/template-fallback/palette-plugin.json

@@ -13,7 +13,7 @@
     "text": "#fff"
   },
   "sdk": {
-    "frontend": "^0.1.0",
+    "frontend": "^0.1.11",
     "backend": "^0.1.0"
   },
   "platform": {

package/template-fallback/templates/dashboard/frontend/src/index.tsx

@@ -1,13 +1,15 @@
 "use client"
 
 import { useEffect, useState } from "react"
-import { usePlatform } from "@palettelab/sdk"
+import { usePlatform, usePluginTranslations } from "@palettelab/sdk"
 import type { PluginComponentProps } from "@palettelab/sdk"
+import { translations } from "./translations"
 
 type Series = { label: string; value: number }
 
 export default function DashboardWidget(_props: PluginComponentProps) {
   const { apiFetch } = usePlatform()
+  const { t } = usePluginTranslations(translations)
   const [data, setData] = useState<Series[]>([])
   const [loading, setLoading] = useState(true)
 
@@ -22,9 +24,9 @@ export default function DashboardWidget(_props: PluginComponentProps) {
 
   return (
     <div className="p-6 space-y-4">
-      <h1 className="text-2xl font-bold">Dashboard Widget</h1>
+      <h1 className="text-2xl font-bold">{t("title")}</h1>
       {loading ? (
-        <p className="text-muted-foreground">Loading…</p>
+        <p className="text-muted-foreground">{t("loading")}</p>
       ) : (
         <div className="space-y-2">
           {data.map((d) => (

package/template-fallback/templates/dashboard/frontend/src/translations.ts

@@ -0,0 +1,12 @@
+import type { TranslationResources } from "@palettelab/sdk"
+
+export const translations = {
+  en: {
+    title: "Dashboard Widget",
+    loading: "Loading...",
+  },
+  ko: {
+    title: "대시보드 위젯",
+    loading: "불러오는 중...",
+  },
+} satisfies TranslationResources

package/template-fallback/templates/dashboard/package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@palettelab/sdk": "^0.1.10",
+    "@palettelab/sdk": "^0.1.11",
     "react": "^19.0.0"
   }
 }

package/template-fallback/templates/dashboard/palette-plugin.json

@@ -9,7 +9,7 @@
   "description": "A widget that exposes a dashboard data source and renders a chart from it.",
   "icon": "ChartBar",
   "gradient": { "bg": "linear-gradient(135deg, #06B6D4, #6366F1)", "text": "#fff" },
-  "sdk": { "frontend": "^0.1.0", "backend": "^0.1.0" },
+  "sdk": { "frontend": "^0.1.11", "backend": "^0.1.0" },
   "platform": { "min_version": "0.1.0" },
   "capabilities": {
     "frontend": true,

package/template-fallback/templates/database/frontend/src/index.tsx

@@ -1,8 +1,9 @@
 "use client"
 
 import { useEffect, useState } from "react"
-import { usePlatform } from "@palettelab/sdk"
+import { usePlatform, usePluginTranslations } from "@palettelab/sdk"
 import type { PluginComponentProps } from "@palettelab/sdk"
+import { translations } from "./translations"
 
 type Note = { id: number; body: string }
 
@@ -96,6 +97,7 @@ const styles = `
 
 export default function NotesApp(_props: PluginComponentProps) {
   const { apiFetch, showToast, user } = usePlatform()
+  const { t } = usePluginTranslations(translations)
   const [notes, setNotes] = useState<Note[]>([])
   const [body, setBody] = useState("")
   const [loading, setLoading] = useState(true)
@@ -105,7 +107,7 @@ export default function NotesApp(_props: PluginComponentProps) {
     setLoading(true)
     try {
       const response = await apiFetch("/api/v1/plugins/my-db-plugin/notes")
-      if (!response.ok) throw new Error("Could not load notes")
+      if (!response.ok) throw new Error(t("loadError"))
       setNotes(await response.json())
     } finally {
       setLoading(false)
@@ -126,9 +128,9 @@ export default function NotesApp(_props: PluginComponentProps) {
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ body: cleaned }),
       })
-      if (!response.ok) throw new Error("Could not save note")
+      if (!response.ok) throw new Error(t("saveError"))
       setBody("")
-      showToast("Note saved", "success")
+      showToast(t("saved"), "success")
       await load()
     } finally {
       setSaving(false)
@@ -139,11 +141,10 @@ export default function NotesApp(_props: PluginComponentProps) {
     <div className="notes-app">
       <style>{styles}</style>
       <main className="notes-shell">
-        <p className="notes-kicker">Palette DB App</p>
-        <h1 className="notes-title">Org Notes</h1>
+        <p className="notes-kicker">{t("kicker")}</p>
+        <h1 className="notes-title">{t("title")}</h1>
         <p className="notes-copy">
-          Built for {user.name}. This app uses a Python backend and the Palette
-          SDK database session exposed as <code>ctx.db</code>.
+          {t("copy", { name: user.name })}
         </p>
         <section className="notes-form">
           <input
@@ -153,7 +154,7 @@ export default function NotesApp(_props: PluginComponentProps) {
             onKeyDown={(event) => {
               if (event.key === "Enter") void add()
             }}
-            placeholder="New note..."
+            placeholder={t("placeholder")}
           />
           <button
             type="button"
@@ -161,14 +162,14 @@ export default function NotesApp(_props: PluginComponentProps) {
             disabled={saving || body.trim().length === 0}
             className="notes-button"
           >
-            {saving ? "Saving" : "Add Note"}
+            {saving ? t("saving") : t("add")}
           </button>
         </section>
         <section className="notes-list">
           {loading ? (
-            <p className="notes-empty">Loading notes...</p>
+            <p className="notes-empty">{t("loading")}</p>
           ) : notes.length === 0 ? (
-            <p className="notes-empty">No notes yet.</p>
+            <p className="notes-empty">{t("empty")}</p>
           ) : (
             notes.map((note) => (
               <p key={note.id} className="notes-item">

package/template-fallback/templates/database/frontend/src/translations.ts

@@ -0,0 +1,30 @@
+import type { TranslationResources } from "@palettelab/sdk"
+
+export const translations = {
+  en: {
+    kicker: "Palette DB App",
+    title: "Org Notes",
+    copy: "Built for {{name}}. This app uses a Python backend and the Palette SDK database session exposed as ctx.db.",
+    placeholder: "New note...",
+    add: "Add Note",
+    saving: "Saving",
+    loading: "Loading notes...",
+    empty: "No notes yet.",
+    loadError: "Could not load notes",
+    saveError: "Could not save note",
+    saved: "Note saved",
+  },
+  ko: {
+    kicker: "Palette DB 앱",
+    title: "조직 노트",
+    copy: "{{name}}님을 위해 생성되었습니다. 이 앱은 Python 백엔드와 ctx.db로 제공되는 Palette SDK 데이터베이스 세션을 사용합니다.",
+    placeholder: "새 노트...",
+    add: "노트 추가",
+    saving: "저장 중",
+    loading: "노트를 불러오는 중...",
+    empty: "아직 노트가 없습니다.",
+    loadError: "노트를 불러올 수 없습니다",
+    saveError: "노트를 저장할 수 없습니다",
+    saved: "노트가 저장되었습니다",
+  },
+} satisfies TranslationResources

package/template-fallback/templates/database/package.json

@@ -2,5 +2,5 @@
   "name": "my-db-plugin",
   "version": "1.0.0",
   "private": true,
-  "dependencies": { "@palettelab/sdk": "^0.1.10", "react": "^19.0.0" }
+  "dependencies": { "@palettelab/sdk": "^0.1.11", "react": "^19.0.0" }
 }

package/template-fallback/templates/database/palette-plugin.json

@@ -9,7 +9,7 @@
   "description": "Stores notes per organization with RLS-enforced isolation.",
   "icon": "Database",
   "gradient": { "bg": "linear-gradient(135deg, #8B5CF6, #EC4899)", "text": "#fff" },
-  "sdk": { "frontend": "^0.1.0", "backend": "^0.1.0" },
+  "sdk": { "frontend": "^0.1.11", "backend": "^0.1.0" },
   "platform": { "min_version": "0.1.0" },
   "capabilities": {
     "frontend": true,

package/template-fallback/templates/external-service/frontend/src/index.tsx

@@ -1,16 +1,18 @@
 "use client"
 
 import { useState } from "react"
-import { usePlatform } from "@palettelab/sdk"
+import { usePlatform, usePluginTranslations } from "@palettelab/sdk"
 import type { PluginComponentProps } from "@palettelab/sdk"
+import { translations } from "./translations"
 
 export default function ExternalServiceWidget(_props: PluginComponentProps) {
   const { apiFetch } = usePlatform()
+  const { t } = usePluginTranslations(translations)
   const [result, setResult] = useState<string>("")
 
   return (
     <div className="p-6 space-y-3">
-      <h1 className="text-2xl font-bold">External Service</h1>
+      <h1 className="text-2xl font-bold">{t("title")}</h1>
       <button
         className="px-3 py-1.5 rounded bg-primary text-primary-foreground text-sm"
         onClick={async () => {
@@ -18,7 +20,7 @@ export default function ExternalServiceWidget(_props: PluginComponentProps) {
           setResult(await r.text())
         }}
       >
-        Call api.example.com
+        {t("call")}
       </button>
       {result && <pre className="text-xs">{result}</pre>}
     </div>

package/template-fallback/templates/external-service/frontend/src/translations.ts

@@ -0,0 +1,12 @@
+import type { TranslationResources } from "@palettelab/sdk"
+
+export const translations = {
+  en: {
+    title: "External Service",
+    call: "Call api.example.com",
+  },
+  ko: {
+    title: "외부 서비스",
+    call: "api.example.com 호출",
+  },
+} satisfies TranslationResources

package/template-fallback/templates/external-service/package.json

@@ -2,5 +2,5 @@
   "name": "my-external-svc",
   "version": "1.0.0",
   "private": true,
-  "dependencies": { "@palettelab/sdk": "^0.1.10", "react": "^19.0.0" }
+  "dependencies": { "@palettelab/sdk": "^0.1.11", "react": "^19.0.0" }
 }

package/template-fallback/templates/external-service/palette-plugin.json

@@ -9,7 +9,7 @@
   "description": "Demonstrates declared external_network access and a scoped per-org config token.",
   "icon": "CloudArrowUp",
   "gradient": { "bg": "linear-gradient(135deg, #10B981, #06B6D4)", "text": "#fff" },
-  "sdk": { "frontend": "^0.1.0", "backend": "^0.1.0" },
+  "sdk": { "frontend": "^0.1.11", "backend": "^0.1.0" },
   "platform": { "min_version": "0.1.0" },
   "capabilities": {
     "frontend": true,

package/template-fallback/templates/frontend-only/frontend/src/index.tsx

@@ -1,15 +1,18 @@
 "use client"
 
-import { usePlatform } from "@palettelab/sdk"
+import { usePlatform, usePluginTranslations } from "@palettelab/sdk"
 import type { PluginComponentProps } from "@palettelab/sdk"
+import { translations } from "./translations"
 
 export default function FrontendOnlyPlugin(_props: PluginComponentProps) {
   const { user } = usePlatform()
+  const { t } = usePluginTranslations(translations)
+
   return (
     <div className="p-6">
-      <h1 className="text-2xl font-bold">Hello, {user.name}</h1>
+      <h1 className="text-2xl font-bold">{t("title", { name: user.name })}</h1>
       <p className="text-muted-foreground mt-2">
-        This plugin runs entirely in the browser sandbox — no backend.
+        {t("body")}
       </p>
     </div>
   )

package/template-fallback/templates/frontend-only/frontend/src/translations.ts

@@ -0,0 +1,12 @@
+import type { TranslationResources } from "@palettelab/sdk"
+
+export const translations = {
+  en: {
+    title: "Hello, {{name}}",
+    body: "This plugin runs entirely in the browser sandbox and follows the Palette OS language.",
+  },
+  ko: {
+    title: "안녕하세요, {{name}}님",
+    body: "이 플러그인은 브라우저 샌드박스에서만 실행되며 Palette OS 언어를 따릅니다.",
+  },
+} satisfies TranslationResources

package/template-fallback/templates/frontend-only/package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@palettelab/sdk": "^0.1.10",
+    "@palettelab/sdk": "^0.1.11",
     "react": "^19.0.0"
   }
 }

package/template-fallback/templates/frontend-only/palette-plugin.json

@@ -9,7 +9,7 @@
   "description": "A frontend-only plugin — renders inside the platform iframe sandbox with no backend.",
   "icon": "Puzzle",
   "gradient": { "bg": "linear-gradient(135deg, #6366F1, #8B5CF6)", "text": "#fff" },
-  "sdk": { "frontend": "^0.1.0" },
+  "sdk": { "frontend": "^0.1.11" },
   "platform": { "min_version": "0.1.0" },
   "capabilities": {
     "frontend": true,