myjsbook 1.0.0

package/public/components/constants.js

@@ -0,0 +1,421 @@
+/* ===== THEME ===== */
+const THEMES = {
+  champa: { base: "light", label: "Champa", monacoId: "monaco-champa" },
+  varuna: { base: "light", label: "Varuna", monacoId: "monaco-varuna" },
+  haritha: { base: "light", label: "Haritha", monacoId: "monaco-haritha" },
+  obsidian: { base: "dark", label: "Obsidian", monacoId: "monaco-obsidian" },
+  antariksha: {
+    base: "dark",
+    label: "Antariksha",
+    monacoId: "monaco-antariksha",
+  },
+  vriksha: { base: "dark", label: "Vriksha", monacoId: "monaco-vriksha" },
+};
+
+const MONACO_THEME_DEFS = {
+  // ─── LIGHT THEMES ────────────────────────────────────────────────────────────
+
+  "monaco-champa": {
+    base: "vs",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "2C2C2A" },
+      { token: "comment", foreground: "B4B2A9", fontStyle: "italic" },
+      { token: "keyword", foreground: "534AB7", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "883DA0", fontStyle: "bold" },
+      { token: "string", foreground: "0F6E56" },
+      { token: "string.escape", foreground: "993C1D" },
+      { token: "number", foreground: "3B6D11" },
+      { token: "regexp", foreground: "185FA5" },
+      { token: "identifier", foreground: "2C2C2A" },
+      { token: "identifier.function", foreground: "185FA5" },
+      { token: "type", foreground: "883DA0" },
+      { token: "type.identifier", foreground: "883DA0" },
+      { token: "function", foreground: "185FA5" },
+      { token: "variable", foreground: "2C2C2A" },
+      { token: "variable.name", foreground: "3C3489" },
+      { token: "parameter", foreground: "854F0B" }, // deep amber
+      { token: "operator", foreground: "444441" },
+      { token: "delimiter", foreground: "888780" },
+      { token: "delimiter.bracket", foreground: "5F5E5A" },
+      { token: "annotation", foreground: "534AB7" },
+      { token: "constant", foreground: "993C1D" }, // coral-red
+    ],
+    colors: {
+      "editor.background": "#FAFAF8",
+      "editor.foreground": "#2C2C2A",
+      "editor.lineHighlightBackground": "#F1EFE8",
+      "editor.selectionBackground": "#EEEDFE",
+      "editorCursor.foreground": "#534AB7",
+      "editorLineNumber.foreground": "#B4B2A9",
+      "editorLineNumber.activeForeground": "#5F5E5A",
+      "editorIndentGuide.background1": "#D3D1C7",
+      "editorWidget.background": "#F7F5F0",
+      "editorSuggestWidget.background": "#F7F5F0",
+      "editorSuggestWidget.border": "#D3D1C7",
+      "editorSuggestWidget.foreground": "#2C2C2A",
+      "editorSuggestWidget.selectedBackground": "#EDE9FC",
+      "editorSuggestWidget.selectedForeground": "#2C2C2A",
+      "editorSuggestWidget.highlightForeground": "#534AB7",
+      "editorSuggestWidget.focusHighlightForeground": "#534AB7",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#2C2C2A" },
+      "variable.readonly": { foreground: "#3C3489" },
+      parameter: { foreground: "#854F0B" },
+      function: { foreground: "#185FA5" },
+      method: { foreground: "#185FA5" },
+      type: { foreground: "#883DA0" },
+      class: { foreground: "#883DA0" },
+      interface: { foreground: "#534AB7" },
+      enum: { foreground: "#993C1D" },
+      enumMember: { foreground: "#993C1D" },
+      property: { foreground: "#185FA5" },
+      decorator: { foreground: "#534AB7" },
+      typeParameter: { foreground: "#883DA0" },
+    },
+  },
+
+  "monaco-varuna": {
+    base: "vs",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "042C53" },
+      { token: "comment", foreground: "85B7EB", fontStyle: "italic" },
+      { token: "keyword", foreground: "993C1D", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "0F6E56", fontStyle: "bold" },
+      { token: "string", foreground: "0C447C" },
+      { token: "string.escape", foreground: "993C1D" },
+      { token: "number", foreground: "3B6D11" },
+      { token: "regexp", foreground: "1D9E75" },
+      { token: "identifier", foreground: "042C53" },
+      { token: "identifier.function", foreground: "378ADD" },
+      { token: "type", foreground: "0F6E56" },
+      { token: "type.identifier", foreground: "0F6E56" },
+      { token: "function", foreground: "378ADD" },
+      { token: "variable", foreground: "042C53" },
+      { token: "variable.name", foreground: "0C447C" },
+      { token: "parameter", foreground: "854F0B" }, // amber — warm contrast to cool blues
+      { token: "operator", foreground: "185FA5" },
+      { token: "delimiter", foreground: "2D5A8A" },
+      { token: "delimiter.bracket", foreground: "185FA5" },
+      { token: "annotation", foreground: "185FA5" },
+      { token: "constant", foreground: "993C1D" }, // coral-red
+    ],
+    colors: {
+      "editor.background": "#F4F9FF",
+      "editor.foreground": "#042C53",
+      "editor.lineHighlightBackground": "#E6F1FB",
+      "editor.selectionBackground": "#B5D4F455",
+      "editorCursor.foreground": "#185FA5",
+      "editorLineNumber.foreground": "#85B7EB",
+      "editorLineNumber.activeForeground": "#185FA5",
+      "editorIndentGuide.background1": "#B5D4F4",
+      "editorWidget.background": "#EDF4FC",
+      "editorSuggestWidget.background": "#EDF4FC",
+      "editorSuggestWidget.border": "#B5D4F4",
+      "editorSuggestWidget.foreground": "#042C53",
+      "editorSuggestWidget.selectedBackground": "#D5E7F5",
+      "editorSuggestWidget.selectedForeground": "#042C53",
+      "editorSuggestWidget.highlightForeground": "#185FA5",
+      "editorSuggestWidget.focusHighlightForeground": "#185FA5",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#042C53" },
+      "variable.readonly": { foreground: "#0C447C" },
+      parameter: { foreground: "#854F0B" },
+      function: { foreground: "#378ADD" },
+      method: { foreground: "#378ADD" },
+      type: { foreground: "#0F6E56" },
+      class: { foreground: "#0F6E56" },
+      interface: { foreground: "#185FA5" },
+      enum: { foreground: "#993C1D" },
+      enumMember: { foreground: "#993C1D" },
+      property: { foreground: "#0F6E56" },
+      decorator: { foreground: "#185FA5" },
+      typeParameter: { foreground: "#1D9E75" },
+    },
+  },
+
+  "monaco-haritha": {
+    base: "vs",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "04342C" },
+      { token: "comment", foreground: "5DCAA5", fontStyle: "italic" },
+      { token: "keyword", foreground: "0F6E56", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "1D9E75", fontStyle: "bold" },
+      { token: "string", foreground: "085041" },
+      { token: "string.escape", foreground: "3B6D11" },
+      { token: "number", foreground: "27500A" },
+      { token: "regexp", foreground: "185FA5" },
+      { token: "identifier", foreground: "04342C" },
+      { token: "identifier.function", foreground: "1D9E75" },
+      { token: "type", foreground: "185FA5" },
+      { token: "type.identifier", foreground: "185FA5" },
+      { token: "function", foreground: "1D9E75" },
+      { token: "variable", foreground: "04342C" },
+      { token: "variable.name", foreground: "085041" },
+      { token: "parameter", foreground: "854F0B" }, // amber — warm pop on green bg
+      { token: "operator", foreground: "0F6E56" },
+      { token: "delimiter", foreground: "2D7A60" },
+      { token: "delimiter.bracket", foreground: "0F5A45" },
+      { token: "annotation", foreground: "1D9E75" },
+      { token: "constant", foreground: "993C1D" }, // coral-red
+    ],
+    colors: {
+      "editor.background": "#F0FBF6",
+      "editor.foreground": "#04342C",
+      "editor.lineHighlightBackground": "#E1F5EE",
+      "editor.selectionBackground": "#9FE1CB55",
+      "editorCursor.foreground": "#1D9E75",
+      "editorLineNumber.foreground": "#9FE1CB",
+      "editorLineNumber.activeForeground": "#0F6E56",
+      "editorIndentGuide.background1": "#E1F5EE",
+      "editorWidget.background": "#E8F8F2",
+      "editorSuggestWidget.background": "#E8F8F2",
+      "editorSuggestWidget.border": "#9FE1CB",
+      "editorSuggestWidget.foreground": "#04342C",
+      "editorSuggestWidget.selectedBackground": "#D8EFE7",
+      "editorSuggestWidget.selectedForeground": "#04342C",
+      "editorSuggestWidget.highlightForeground": "#1D9E75",
+      "editorSuggestWidget.focusHighlightForeground": "#1D9E75",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#04342C" },
+      "variable.readonly": { foreground: "#085041" },
+      parameter: { foreground: "#854F0B" },
+      function: { foreground: "#1D9E75" },
+      method: { foreground: "#1D9E75" },
+      type: { foreground: "#185FA5" },
+      class: { foreground: "#185FA5" },
+      interface: { foreground: "#0F6E56" },
+      enum: { foreground: "#27500A" },
+      enumMember: { foreground: "#27500A" },
+      property: { foreground: "#185FA5" },
+      decorator: { foreground: "#1D9E75" },
+      typeParameter: { foreground: "#185FA5" },
+    },
+  },
+
+  // ─── DARK THEMES ─────────────────────────────────────────────────────────────
+
+  "monaco-obsidian": {
+    base: "vs-dark",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "E2E0F0" },
+      { token: "comment", foreground: "524F70", fontStyle: "italic" },
+      { token: "keyword", foreground: "A78BFA", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "F472B6", fontStyle: "bold" },
+      { token: "string", foreground: "34D399" },
+      { token: "string.escape", foreground: "FB923C" },
+      { token: "number", foreground: "FBBF24" },
+      { token: "regexp", foreground: "34D399" },
+      { token: "identifier", foreground: "E2E0F0" },
+      { token: "identifier.function", foreground: "60A5FA" },
+      { token: "type", foreground: "F472B6" },
+      { token: "type.identifier", foreground: "F472B6" },
+      { token: "function", foreground: "60A5FA" },
+      { token: "variable", foreground: "CBD5E1" },
+      { token: "variable.name", foreground: "A5B4FC" }, // soft indigo
+      { token: "parameter", foreground: "FB923C" }, // orange — warm pop
+      { token: "parameter.name", foreground: "FB923C" },
+      { token: "operator", foreground: "9E9BC8" },
+      { token: "delimiter", foreground: "7C79A8" },
+      { token: "delimiter.bracket", foreground: "A78BFA" },
+      { token: "annotation", foreground: "F472B6" },
+      { token: "constant", foreground: "F9A8D4" }, // pink — distinct from yellow number
+    ],
+    colors: {
+      "editor.background": "#0E0E16",
+      "editor.foreground": "#E2E0F0",
+      "editor.lineHighlightBackground": "#1A1A2C",
+      "editor.selectionBackground": "#A78BFA2A",
+      "editorCursor.foreground": "#A78BFA",
+      "editorLineNumber.foreground": "#3D3A5C",
+      "editorLineNumber.activeForeground": "#9E9BC8",
+      "editorIndentGuide.background1": "#1E1E30",
+      "editorWidget.background": "#13131F",
+      "editorSuggestWidget.background": "#13131F",
+      "editorSuggestWidget.border": "#2A2840",
+      "editorSuggestWidget.foreground": "#E2E0F0",
+      "editorSuggestWidget.selectedBackground": "#2A2840",
+      "editorSuggestWidget.selectedForeground": "#E2E0F0",
+      "editorSuggestWidget.highlightForeground": "#A78BFA",
+      "editorSuggestWidget.focusHighlightForeground": "#A78BFA",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#CBD5E1" },
+      "variable.readonly": { foreground: "#A5B4FC" },
+      parameter: { foreground: "#FB923C" },
+      function: { foreground: "#60A5FA" },
+      method: { foreground: "#60A5FA" },
+      type: { foreground: "#F472B6" },
+      class: { foreground: "#F472B6" },
+      interface: { foreground: "#A78BFA" },
+      enum: { foreground: "#FBBF24" },
+      enumMember: { foreground: "#FBBF24" },
+      namespace: { foreground: "#E2E0F0" },
+      property: { foreground: "#7DD3FC" },
+      decorator: { foreground: "#F472B6" },
+      typeParameter: { foreground: "#F9A8D4" },
+    },
+  },
+
+  "monaco-antariksha": {
+    base: "vs-dark",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "B5D4F4" },
+      { token: "comment", foreground: "1F5A8A", fontStyle: "italic" },
+      { token: "keyword", foreground: "ef9f27", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "5DCAA5", fontStyle: "bold" },
+      { token: "string", foreground: "9FE1CB" },
+      { token: "string.escape", foreground: "FAC775" },
+      { token: "number", foreground: "F0997B" },
+      { token: "regexp", foreground: "9FE1CB" },
+      { token: "identifier", foreground: "B5D4F4" },
+      { token: "identifier.function", foreground: "5DCAA5" },
+      { token: "type", foreground: "85B7EB" },
+      { token: "type.identifier", foreground: "85B7EB" },
+      { token: "function", foreground: "ef9f27" },
+      { token: "variable", foreground: "d2dce6" },
+      { token: "variable.name", foreground: "9EC8EC" },
+      { token: "parameter", foreground: "FAC775" }, // warm gold
+      { token: "operator", foreground: "378ADD" },
+      { token: "delimiter", foreground: "4A7DAA" },
+      { token: "delimiter.bracket", foreground: "AFA9EC" },
+      { token: "annotation", foreground: "AFA9EC" },
+      { token: "constant", foreground: "F0997B" }, // coral-orange
+    ],
+    colors: {
+      "editor.background": "#0A1220",
+      "editor.foreground": "#B5D4F4",
+      "editor.lineHighlightBackground": "#0C1E35",
+      "editor.selectionBackground": "#185FA566",
+      "editorCursor.foreground": "#5DCAA5",
+      "editorLineNumber.foreground": "#1A4060",
+      "editorLineNumber.activeForeground": "#378ADD",
+      "editorIndentGuide.background1": "#0F2D4A",
+      "editorWidget.background": "#080F1A",
+      "editorSuggestWidget.background": "#080F1A",
+      "editorSuggestWidget.border": "#0C447C",
+      "editorSuggestWidget.foreground": "#B5D4F4",
+      "editorSuggestWidget.selectedBackground": "#0C1E35",
+      "editorSuggestWidget.selectedForeground": "#B5D4F4",
+      "editorSuggestWidget.highlightForeground": "#5DCAA5",
+      "editorSuggestWidget.focusHighlightForeground": "#5DCAA5",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#B5D4F4" },
+      "variable.readonly": { foreground: "#AFA9EC" },
+      parameter: { foreground: "#FAC775" },
+      function: { foreground: "#5DCAA5" },
+      method: { foreground: "#5DCAA5" },
+      type: { foreground: "#85B7EB" },
+      class: { foreground: "#85B7EB" },
+      interface: { foreground: "#AFA9EC" },
+      enum: { foreground: "#F0997B" },
+      enumMember: { foreground: "#F0997B" },
+      property: { foreground: "#5DCAA5" },
+      decorator: { foreground: "#AFA9EC" },
+      typeParameter: { foreground: "#9FE1CB" },
+    },
+  },
+
+  "monaco-vriksha": {
+    base: "vs-dark",
+    inherit: false,
+    rules: [
+      { token: "", foreground: "9FE1CB" },
+      { token: "comment", foreground: "1A5A40", fontStyle: "italic" },
+      { token: "keyword", foreground: "5DCAA5", fontStyle: "bold" },
+      { token: "keyword.flow", foreground: "EF9F27", fontStyle: "bold" },
+      { token: "string", foreground: "97C459" },
+      { token: "string.escape", foreground: "FAC775" },
+      { token: "number", foreground: "639922" },
+      { token: "regexp", foreground: "97C459" },
+      { token: "identifier", foreground: "9FE1CB" },
+      { token: "identifier.function", foreground: "EF9F27" },
+      { token: "type", foreground: "C0DD97" },
+      { token: "type.identifier", foreground: "C0DD97" },
+      { token: "function", foreground: "EF9F27" },
+      { token: "variable", foreground: "9FE1CB" },
+      { token: "variable.name", foreground: "8DCFBA" },
+      { token: "parameter", foreground: "FAC775" }, // bright gold
+      { token: "operator", foreground: "5DCAA5" },
+      { token: "delimiter", foreground: "2D7A5A" },
+      { token: "delimiter.bracket", foreground: "5DCAA5" },
+      { token: "annotation", foreground: "EF9F27" },
+      { token: "constant", foreground: "F0997B" }, // coral — distinct from green number
+    ],
+    colors: {
+      "editor.background": "#071410",
+      "editor.foreground": "#9FE1CB",
+      "editor.lineHighlightBackground": "#0D1F1A",
+      "editor.selectionBackground": "#1D9E7555",
+      "editorCursor.foreground": "#EF9F27",
+      "editorLineNumber.foreground": "#0F3525",
+      "editorLineNumber.activeForeground": "#1D9E75",
+      "editorIndentGuide.background1": "#0F2E24",
+      "editorWidget.background": "#050F0B",
+      "editorSuggestWidget.background": "#050F0B",
+      "editorSuggestWidget.border": "#085041",
+      "editorSuggestWidget.foreground": "#9FE1CB",
+      "editorSuggestWidget.selectedBackground": "#0D1F1A",
+      "editorSuggestWidget.selectedForeground": "#9FE1CB",
+      "editorSuggestWidget.highlightForeground": "#EF9F27",
+      "editorSuggestWidget.focusHighlightForeground": "#EF9F27",
+    },
+    semanticHighlighting: true,
+    semanticTokenColors: {
+      variable: { foreground: "#9FE1CB" },
+      "variable.readonly": { foreground: "#5DCAA5" },
+      parameter: { foreground: "#FAC775" },
+      function: { foreground: "#EF9F27" },
+      method: { foreground: "#EF9F27" },
+      type: { foreground: "#C0DD97" },
+      class: { foreground: "#C0DD97" },
+      interface: { foreground: "#5DCAA5" },
+      enum: { foreground: "#639922" },
+      enumMember: { foreground: "#639922" },
+      property: { foreground: "#C0DD97" },
+      decorator: { foreground: "#EF9F27" },
+      typeParameter: { foreground: "#FAC775" },
+    },
+  },
+};
+
+
+
+const NODE_GLOBALS_DTS = `
+declare const process: NodeJS.Process & { env: { [key: string]: string | undefined } };
+declare const Buffer: typeof globalThis.Buffer;
+declare const module: { exports: any };
+declare const exports: any;
+declare const __dirname: string;
+declare const __filename: string;
+declare function fetch(input: string | URL | Request, init?: RequestInit): Promise<Response>;
+declare function setTimeout(callback: (...args: any[]) => void, ms?: number, ...args: any[]): NodeJS.Timeout;
+declare function setInterval(callback: (...args: any[]) => void, ms?: number, ...args: any[]): NodeJS.Timeout;
+declare function clearTimeout(id: NodeJS.Timeout | undefined): void;
+declare function clearInterval(id: NodeJS.Timeout | undefined): void;
+declare function structuredClone<T>(value: T): T;
+declare function input(message?: string): Promise<string>;
+declare function prompt(message?: string): Promise<string>;
+declare const window: {
+  input: (message?: string) => Promise<string>;
+  prompt: (message?: string) => Promise<string>;
+};
+interface ProcessEnv {
+  [key: string]: string | undefined;
+}
+`;
+
+export { MONACO_THEME_DEFS, THEMES, NODE_GLOBALS_DTS };

package/public/components/elements.js

@@ -0,0 +1,118 @@
+const elements = {
+  // Notebook header
+  nbTitleDisplay: document.querySelector("#nb-title-display"),
+  nbTitleInput: document.querySelector("#nb-title-input"),
+  nbSaveState: document.querySelector("#nb-save-state"),
+  nbCellCount: document.querySelector("#nb-cell-count"),
+  nbLangBadge: document.querySelector("#nb-lang-badge"),
+  nbLangToggle: document.querySelector("#nb-lang-toggle"),
+  breadcrumbTitle: document.querySelector("#breadcrumb-title"),
+  saveBtn: document.querySelector("#save-btn"),
+  runAllBtn: document.querySelector("#run-all-btn"),
+  clearOutputsBtn: document.querySelector("#clear-outputs-btn"),
+  aiAssistBtn: document.querySelector("#ai-assist-btn"),
+  kernelPill: document.querySelector("#kernel-pill"),
+  kernelPillLabel: document.querySelector("#kernel-pill-label"),
+  explorerToggleBtn: document.querySelector("#explorer-toggle-btn"),
+  notebookListPanel: document.querySelector("#notebook-list-panel"),
+  // Notebook canvas
+  notebookCells: document.querySelector("#notebook-cells"),
+  filePreview: document.querySelector("#file-preview"),
+  addCodeButton: document.querySelector("#add-code-button"),
+  addMarkdownButton: document.querySelector("#add-markdown-button"),
+  addPromptBtn: document.querySelector("#add-prompt-btn"),
+  // Terminal bottom sheet
+  terminalSheet: document.querySelector("#terminal-sheet"),
+  terminalScrim: document.querySelector("#terminal-scrim"),
+  terminalHistoryEl: document.querySelector("#terminal-history"),
+  terminalInput: document.querySelector("#terminal-input"),
+  terminalCwdLabel: document.querySelector("#terminal-cwd-label"),
+  terminalClearBtn: document.querySelector("#terminal-clear-btn"),
+  terminalCloseBtn: document.querySelector("#terminal-close-btn"),
+  terminalRunBtn: document.querySelector("#terminal-run-btn"),
+  // Env panel
+  envToggle: document.querySelector("#env-toggle"),
+  envPanel: document.querySelector("#env-panel"),
+  envModalScrim: document.querySelector("#env-modal-scrim"),
+  envList: document.querySelector("#env-list"),
+  addEnvButton: document.querySelector("#add-env-button"),
+  envSaveButton: document.querySelector("#env-save-button"),
+  envCloseButton: document.querySelector("#env-close-button"),
+  // AI assistant
+  aiAssistantSheet: document.querySelector("#ai-assistant-sheet"),
+  aiModalScrim: document.querySelector("#ai-modal-scrim"),
+  aiCloseButton: document.querySelector("#ai-close-button"),
+  aiModelSelect: document.querySelector("#ai-model-select"), // AI model dropdown
+  aiMissingKey: document.querySelector("#ai-missing-key"),
+  aiChatList: document.querySelector("#ai-chat-list"),
+  aiChatForm: document.querySelector("#ai-chat-form"),
+  aiChatInput: document.querySelector("#ai-chat-input"),
+  aiSendButton: document.querySelector("#ai-send-button"),
+  aiSheetSubtitle: document.querySelector("#ai-sheet-subtitle"),
+  // Notebook list panel
+  nlpList: document.querySelector("#nlp-list"),
+  nlpSearchInput: document.querySelector("#nlp-search-input"),
+  nlpNewBtn: document.querySelector("#nlp-new-btn"),
+  // Package docs drawer
+  packageDocsDrawer: document.querySelector("#package-docs-drawer"),
+  packageDocsScrim: document.querySelector("#package-docs-scrim"),
+  packageDocsClose: document.querySelector("#package-docs-close"),
+  packageDocsTitle: document.querySelector("#package-docs-title"),
+  packageDocsVersion: document.querySelector("#package-docs-version"),
+  packageDocsStatus: document.querySelector("#package-docs-status"),
+  packageDocsContent: document.querySelector("#package-docs-content"),
+  // Dashboard
+  dashboardGreeting: document.querySelector("#dashboard-greeting"),
+  statNotebooks: document.querySelector("#stat-notebooks"),
+  statExecutions: document.querySelector("#stat-executions"),
+  statPackages: document.querySelector("#stat-packages"),
+  statTokens: document.querySelector("#stat-tokens"),
+  resetExecutionsBtn: document.querySelector("#reset-executions-btn"),
+  resetTokensBtn: document.querySelector("#reset-tokens-btn"),
+  notebookGrid: document.querySelector("#notebook-grid"),
+  notebookFilterTabs: document.querySelector("#notebook-filter-tabs"),
+  activityFeed: document.querySelector("#activity-feed"),
+  metricSuccess: document.querySelector("#metric-success"),
+  metricExecTime: document.querySelector("#metric-exec-time"),
+  metricLines: document.querySelector("#metric-lines"),
+  newNotebookBtn: document.querySelector("#new-notebook-btn"),
+  // Package manager page
+  pkgSearchInput: document.querySelector("#pkg-search-input"),
+  pkgInstallBtn: document.querySelector("#pkg-install-btn"),
+  pkgCdnInput: document.querySelector("#pkg-cdn-input"),
+  pkgCountInstalled: document.querySelector("#pkg-count-installed"),
+  pkgCountAi: document.querySelector("#pkg-count-ai"),
+  pkgCountSize: document.querySelector("#pkg-count-size"),
+  pkgList: document.querySelector("#pkg-list"),
+  pkgListTitle: document.querySelector("#pkg-list-title"),
+  pkgCatCount: document.querySelector("#pkg-cat-count"),
+  pkgSuggestionsGrid: document.querySelector("#pkg-suggestions-grid"),
+  pkgSuggestionsSection: document.querySelector("#pkg-suggestions-section"),
+  // Shared
+  cellTemplate: document.querySelector("#cell-template"),
+  toastRegion: document.querySelector("#toast-region"),
+  confirmModal: document.querySelector("#confirm-modal"),
+  confirmScrim: document.querySelector("#confirm-scrim"),
+  confirmTitle: document.querySelector("#confirm-title"),
+  confirmMessage: document.querySelector("#confirm-message"),
+  confirmCancel: document.querySelector("#confirm-cancel"),
+  confirmConfirm: document.querySelector("#confirm-confirm"),
+  // New-notebook filename dialog
+  newNbModal: document.querySelector("#new-nb-modal"),
+  newNbScrim: document.querySelector("#new-nb-scrim"),
+  newNbInput: document.querySelector("#new-nb-input"),
+  newNbError: document.querySelector("#new-nb-error"),
+  newNbCancel: document.querySelector("#new-nb-cancel"),
+  newNbConfirm: document.querySelector("#new-nb-confirm"),
+  // themeToggle removed — now handled by event delegation on .theme-toggle-btn
+  // Page views
+  pageDashboard: document.querySelector("#page-dashboard"),
+  pageNotebook: document.querySelector("#page-notebook"),
+  pagePackages: document.querySelector("#page-packages"),
+  // Nav items
+  navDashboard: document.querySelector("#nav-dashboard"),
+  navNotebooks: document.querySelector("#nav-notebooks"),
+  navPackages: document.querySelector("#nav-packages"),
+};
+
+export { elements };

package/public/components/state.js

@@ -0,0 +1,53 @@
+const state = {
+  notebookPath: "startup.ijsnb",
+  activePath: null,
+  activeResourceType: "notebook",
+  notebook: null,
+  filePreview: null,
+  modules: [],
+  installedPackages: [],
+  typeLibraries: [],
+  packageExports: [],
+  loadedTypePackages: new Set(),
+  localFiles: [],          // { name, content } for .js/.ts files in the notebook dir
+  workspaceRoot: null,
+  monaco: null,
+  monacoReady: false,
+  activeCellId: null,
+  dirty: false,
+  kernelBusy: false,
+  lastSavedAt: null,
+  packagesDrawerOpen: false,
+  packageDocsOpen: false,
+  packageDocsLoading: false,
+  packageDocsPackage: null,
+  packageDocsData: null,
+  packageDocsError: null,
+  envPanelOpen: false,
+  aiAssistantOpen: false,
+  aiAssistantLoading: false,
+  aiAssistantCellId: null,
+  aiAssistantMessages: [],
+  aiAssistantHasKey: false,
+  aiAssistantModels: [],
+  aiAssistantModel: "llama-3.3-70b-versatile",
+  sidebarOpen: true,
+  explorerOpen: true,
+  // 0 = both visible, 1 = workspace panel hidden (sidebar always shown)
+  sidebarLayoutState: Math.min(Number(sessionStorage.getItem("sidebarLayoutState") ?? 0), 1),
+  theme: localStorage.getItem("nodebook-theme") || "antariksha",
+  editorFontSize: Number(localStorage.getItem("nodebook-font-size")) || 13,
+  editorFontFamily: localStorage.getItem("nodebook-font-family") || "default",
+  cellTimings: new Map(),
+  notebookLanguage: "typescript",   // global notebook-level language
+  runningCells: new Set(),
+  // ── Terminal ──────────────────────────────────────────
+  terminalOpen: false,
+  terminalCwd: null,         // current working directory shown in header
+  terminalHistory: [],      // [{command, output, ok, running}]
+  terminalCmdHistory: [],   // strings for Up/Down navigation
+  terminalHistoryIdx: -1
+};
+
+
+export {state}

package/public/icons/audio.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#ef5350" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m6 10h-4v8a4 4 0 1 1-4-4 3.96 3.96 0 0 1 2 .555V8h6Z"/></svg>

package/public/icons/azure.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#01579b" d="M12.001 4h7.102l-7.372 23.181a1.14 1.14 0 0 1-1.073.819H5.13A1.166 1.166 0 0 1 4 26.801a1.3 1.3 0 0 1 .06-.385l6.87-21.599A1.14 1.14 0 0 1 12.001 4"/><path fill="#1976d2" d="M22.32 20H11.06a.537.537 0 0 0-.522.55.57.57 0 0 0 .166.408l7.236 6.716a1.1 1.1 0 0 0 .775.325h6.376Z"/><path fill="#29b6f6" d="M21.071 4.816A1.14 1.14 0 0 0 20.001 4h-7.915a1.14 1.14 0 0 1 1.072.815l6.868 21.599a1.22 1.22 0 0 1-.71 1.52 1.1 1.1 0 0 1-.362.064h7.915A1.166 1.166 0 0 0 28 26.8a1.3 1.3 0 0 0-.06-.385L21.072 4.817Z"/></svg>

package/public/icons/babel.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fdd835" d="M18.23 11.21q-.045-.24-1.32-1.65c-.02-.19.29-.45.9-.8l1.74-1.55c.39-.5.62-1.28.69-2.38l-.02-.26c-.07-.78-.63-1.4-1.69-1.89-.63-.42-1.76-.65-3.38-.68-1.35.11-3.11.59-5.28 1.43-.6.43-1.28.86-2.04 1.28l.01.14.21-.08c.08-.01.13.03.14.11l.13-.07.07-.01.01.06c0 .07-.47.44-1.76 1.35l-.06.12c-.31.02-.61.25-.91.67l.08.12.25-.09.18.24c.32-.33.66-.62 1.03-.87.19.05.29.11.44.16 1.02-.75 2.03-1.3 3.04-1.64l.01.14c-.2.27-.32.42-.38.42l.1.23c.01.19-2.55 7-6.66 14.44l.08.19c.35-.08.58-.17.75-.26l.01.13.4-.03-.67 1.76.14.06c.57-.64 1-1.29 1.3-1.88 1.67-.49 2.94-.97 3.82-1.44.88-.08 1.56-.31 2.02-.7l.92-.47c1.27-.98 2.22-1.67 2.87-2.08 1.33-.98 2.2-1.93 2.6-2.85zm-3.46 2.31L13 14.91c-1.29.85-2 1.3-2.09 1.3-2.07 1.13-3.36 1.72-3.86 1.76l-.05.01c.04-.23.96-2.12 2.75-5.67.78-.06 2.02-.43 3.71-1.1l.41-.03c.85-.08 1.49.09 1.91.49l.03.26c-.31.9-.67 1.44-1.04 1.59m1.09-5.78q-.27.33-1.5 1.11c-.27.03-1.27.42-3.01 1.18l-.28-.05-.01-.12c-.02-.25.09-.57.34-.95.13-.7.28-1.12.44-1.2l1.45-3.28c-.02-.22.29-.35.93-.46l.21-.02.01.18 1.16-.16c1.15-.1 1.75.14 1.8.7l.13-.02-.03-.32.15-.02c.35.19.52.4.54.68.02.18-.08.41-.29.68-.09.01-.14-.06-.15-.18l-.14.01-.03.4c-.58.87-1.01 1.31-1.27 1.34z"/></svg>

package/public/icons/bun.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#fff8e1" d="M30 17.045a9.8 9.8 0 0 0-.32-2.306l-.004.034a11.2 11.2 0 0 0-5.762-6.786c-3.495-1.89-5.243-3.326-6.8-3.811h.003c-1.95-.695-3.949.82-5.825 1.927-4.52 2.481-9.573 5.45-9.28 11.417.008-.029.017-.052.026-.08a9.97 9.97 0 0 0 3.934 7.257l-.01-.006C13.747 31.473 30.05 27.292 30 17.045"/><path fill="#37474f" d="M19.855 20.236A.8.8 0 0 0 19.26 20h-6.514a.8.8 0 0 0-.596.236.51.51 0 0 0-.137.463 4.37 4.37 0 0 0 1.641 2.339 4.2 4.2 0 0 0 2.349.926 4.2 4.2 0 0 0 2.343-.926 4.37 4.37 0 0 0 1.642-2.339.5.5 0 0 0-.132-.463Z"/><ellipse cx="22.5" cy="18.5" fill="#f8bbd0" rx="2.5" ry="1.5"/><ellipse cx="9.5" cy="18.5" fill="#f8bbd0" rx="2.5" ry="1.5"/><circle cx="10" cy="16" r="2" fill="#37474f"/><circle cx="22" cy="16" r="2" fill="#37474f"/><path fill="#455a64" d="M9.996 18A2 2 0 1 0 8 15.996V16a2 2 0 0 0 1.996 2"/><circle cx="9" cy="15" r="1" fill="#fafafa"/><circle cx="21" cy="15" r="1" fill="#fafafa"/></svg>

package/public/icons/bun_light.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#fff8e1" d="M15.696 27.002a13.73 13.73 0 0 1-9.071-3.062 8.86 8.86 0 0 1-3.6-6.505c-.252-5.091 3.813-7.747 8.748-10.455.28-.165.537-.322.793-.48a7.8 7.8 0 0 1 3.52-1.5 2 2 0 0 1 .695.118 14.8 14.8 0 0 1 2.95 1.576c.972.6 2.182 1.348 3.707 2.173a10.14 10.14 0 0 1 5.274 6.147A8.8 8.8 0 0 1 29 17.035a8.15 8.15 0 0 1-2.525 5.959 15.6 15.6 0 0 1-10.778 4.008Z"/><path fill="#37474f" d="M16.087 6a1 1 0 0 1 .358.06l.038.013.037.012a14.5 14.5 0 0 1 2.684 1.46 72 72 0 0 0 3.767 2.205 9.17 9.17 0 0 1 4.767 5.493A8 8 0 0 1 28 17.055a7.18 7.18 0 0 1-2.234 5.233 14.6 14.6 0 0 1-10.07 3.714 12.74 12.74 0 0 1-8.415-2.816l-.027-.024-.029-.023a7.98 7.98 0 0 1-3.202-5.758c-.223-4.516 3.431-6.89 8.231-9.525l.027-.015.027-.015q.389-.231.783-.474A7.4 7.4 0 0 1 16.087 6m0-2c-1.618 0-3.248 1.19-4.795 2.103-4.52 2.481-9.56 5.41-9.267 11.376a9.9 9.9 0 0 0 3.942 7.215 14.77 14.77 0 0 0 9.73 3.308c7.122 0 14.335-4.134 14.303-10.957a9.6 9.6 0 0 0-.322-2.29 11.16 11.16 0 0 0-5.764-6.768c-3.495-1.89-5.242-3.326-6.798-3.811A3 3 0 0 0 16.086 4Z"/><path fill="#37474f" d="M19.855 20.236A.8.8 0 0 0 19.26 20h-6.514a.8.8 0 0 0-.596.236.51.51 0 0 0-.137.463 4.37 4.37 0 0 0 1.641 2.339 4.2 4.2 0 0 0 2.349.926 4.2 4.2 0 0 0 2.343-.926 4.37 4.37 0 0 0 1.642-2.339.5.5 0 0 0-.132-.463Z"/><ellipse cx="22.5" cy="18.5" fill="#f8bbd0" rx="2.5" ry="1.5"/><ellipse cx="9.5" cy="18.5" fill="#f8bbd0" rx="2.5" ry="1.5"/><circle cx="10" cy="16" r="2" fill="#37474f"/><circle cx="22" cy="16" r="2" fill="#37474f"/><path fill="#455a64" d="M9.996 18A2 2 0 1 0 8 15.996V16a2 2 0 0 0 1.996 2"/><circle cx="9" cy="15" r="1" fill="#fafafa"/><circle cx="21" cy="15" r="1" fill="#fafafa"/></svg>

package/public/icons/c.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#0288d1" d="M19.563 22A5.57 5.57 0 0 1 14 16.437v-2.873A5.57 5.57 0 0 1 19.563 8H24V2h-4.437A11.563 11.563 0 0 0 8 13.563v2.873A11.564 11.564 0 0 0 19.563 28H24v-6Z"/></svg>

package/public/icons/chrome.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#42a5f5" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m0 3a11 11 0 0 1 9.208 5H16a6 6 0 0 0-5.74 4.253L7.27 9.334A10.98 10.98 0 0 1 16 5m4 11a4 4 0 1 1-4-4 4.005 4.005 0 0 1 4 4M5 16a10.9 10.9 0 0 1 1.094-4.75l4.838 7.959.003-.002a5.96 5.96 0 0 0 6.16 2.689l-2.996 4.928A11.01 11.01 0 0 1 5 16m11.343 10.983 4.878-8.026-.003-.002A5.97 5.97 0 0 0 20.463 12h5.773a10.966 10.966 0 0 1-9.893 14.983"/></svg>

package/public/icons/citation.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path fill="#1e88e5" d="M256 192c-106.039 0-192 85.961-192 192 .189 103.43 82.273 188.122 185.646 191.545L128 832h128l173.473-365.715C441.746 440.412 447.323 412.44 448 384c0-106.039-85.961-192-192-192m512 0c-106.039 0-192 85.961-192 192 .189 103.43 82.273 188.122 185.646 191.545L640 832h128l173.473-365.715C953.746 440.412 959.323 412.44 960 384c0-106.039-85.961-192-192-192"/></svg>

package/public/icons/claude.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 16 16"><g fill="#ff7043"><path d="m14.375 6.48.49.28v.209l-.14.489-5.937 1.397-.558-1.387zm0 0"/><path d="m12.155 2.373.683.143.182.224.173.535-.072.342-3.983 5.447L7.81 7.737l3.673-4.82z"/><path d="m8.719 1.522.419-.28.349.14.349.49-.957 5.748-.65-.441-.279-.769.49-4.33z"/><path d="m4.239 1.614.43-.55L4.95 1l.558.081.275.216 2.004 4.442.724 2.11-.848.471-3.231-5.864z"/><path d="m2.154 4.665-.14-.56.42-.488.488.07h.14l2.933 2.165.908.698 1.257.978-.698 1.187-.629-.489-.419-.419-4.05-2.863z"/><path d="M1.316 8.296 1 7.946v-.31l.316-.108 3.562.21 3.491.279-.113.695-6.66-.346z"/><path d="M3.411 11.931h-.698l-.278-.32v-.382l1.186-.838 4.82-3.068.487.833z"/><path d="m4.738 13.883-.28.07-.418-.21.07-.35 4.12-5.446.558.768-3.072 4.05z"/><path d="m8.23 14.581-.21.28-.419.14-.349-.28-.21-.42L8.09 8.646l.629.07z"/><path d="M11.791 13.045v.558l-.07.21-.279.14-.489-.066-3.356-4.996 1.331-1.014 1.117 2.025.105.733z"/><path d="m13.398 12.207.07.349-.21.279-.21-.07-1.187-.838-1.815-1.606-1.397-.978.419-1.326.698.419.42.768z"/><path d="m12.49 8.645 1.746.14.419.28.279.418v.302l-.768.327-3.911-.978-1.606-.07.419-1.466 1.117.838z"/></g></svg>

package/public/icons/console.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="#ff7043" d="M2 2a1 1 0 0 0-1 1v10c0 .554.446 1 1 1h12c.554 0 1-.446 1-1V3a1 1 0 0 0-1-1zm0 3h12v8H2zm1 2 2 2-2 2 1 1 3-3-3-3zm5 3.5V12h5v-1.5z"/></svg>

package/public/icons/cpp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#0288d1" d="M28 14v-4h-2v4h-6v-4h-2v4h-4v2h4v4h2v-4h6v4h2v-4h4v-2z"/><path fill="#0288d1" d="M13.563 22A5.57 5.57 0 0 1 8 16.437v-2.873A5.57 5.57 0 0 1 13.563 8H18V2h-4.437A11.563 11.563 0 0 0 2 13.563v2.873A11.564 11.564 0 0 0 13.563 28H18v-6Z"/></svg>

package/public/icons/css-map.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#7e57c2" d="M26 11.998v2h2v14H14v-2h-2v4L30 30V11.998Z"/><path fill="#7e57c2" d="M16 14h-2v-2h-2v2c0 .193 0 .703 1.254 1.033A3.345 3.345 0 0 1 16 18h2v2h2v-2c0-.388-.562-.851-1.254-1.034C16.356 16.34 16 14.84 16 14m-3.254 2.966C10.356 16.34 10 14.84 10 14H8v-2H6v8h2v-2h4v2h2v-2c0-.388-.562-.851-1.254-1.034"/><path fill="#7e57c2" d="M2 2v21.998h22V2Zm20 12h-2v-2h-2v2c0 .193 0 .703 1.254 1.033A3.345 3.345 0 0 1 22 18v2a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2 2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2 2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2 2 2 0 0 1 2-2h2a2 2 0 0 1 2 2 2 2 0 0 1 2-2h2a2 2 0 0 1 2 2Z"/></svg>

package/public/icons/css.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="#7e57c2" d="M20 18h-2v-2h-2v2c0 .193 0 .703 1.254 1.033A3.345 3.345 0 0 1 20 22h2v2h2v-2c0-.388-.562-.851-1.254-1.034C20.356 20.34 20 18.84 20 18m-3.254 2.966C14.356 20.34 14 18.84 14 18h-2v-2h-2v8h2v-2h4v2h2v-2c0-.388-.562-.851-1.254-1.034"/><path fill="#7e57c2" d="M24 4H4v20a4 4 0 0 0 4 4h16.16A3.84 3.84 0 0 0 28 24.16V8a4 4 0 0 0-4-4m2 14h-2v-2h-2v2c0 .193 0 .703 1.254 1.033A3.345 3.345 0 0 1 26 22v2a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2 2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2 2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2 2 2 0 0 1 2-2h2a2 2 0 0 1 2 2 2 2 0 0 1 2-2h2a2 2 0 0 1 2 2Z"/></svg>