@tutorialkit-rb/runtime 0.1.5 → 0.1.6

package/dist/store/index.d.ts

@@ -71,6 +71,11 @@ export declare class TutorialStore {
      * @internal
      */
     get steps(): import("nanostores").WritableAtom<import("../webcontainer/steps.js").Steps | undefined>;
+    /**
+     * Whether the environment is being prepared (prepare commands like npm install are running).
+     * Use this to block terminal input until the environment is ready.
+     */
+    get isPreparing(): ReadableAtom<boolean>;
     /** Check if file tree is visible */
     hasFileTree(): boolean;
     /** Check if editor is visible */

package/dist/store/index.js

@@ -187,6 +187,13 @@ export class TutorialStore {
     get steps() {
         return this._stepController.steps;
     }
+    /**
+     * Whether the environment is being prepared (prepare commands like npm install are running).
+     * Use this to block terminal input until the environment is ready.
+     */
+    get isPreparing() {
+        return this._stepController.isPreparing;
+    }
     /** Check if file tree is visible */
     hasFileTree() {
         if (!this._lesson) {

package/dist/store/tutorial-runner.js

@@ -58,6 +58,8 @@ export class TutorialRunner {
     setCommands(commands) {
         const newCommands = new Commands(commands);
         const anyChange = this._changeDetection(commands);
+        // update the blocking count (this affects terminal input blocking)
+        this._stepController.setBlockingCount(commands.terminalBlockingPrepareCommandsCount);
         // if we already know that there's a change we can update the steps now
         if (anyChange) {
             this._stepController.setFromCommands(Array.from(newCommands));
@@ -187,6 +189,8 @@ export class TutorialRunner {
             this._currentTemplate = { ...template };
             this._currentFiles = { ...files };
             this._updateDirtyState({ ...template, ...files });
+            // set up watcher early so file events are captured during prepareCommands
+            this._setupWatcher(webcontainer);
         }, { ignoreCancel: true, signal });
         return this._currentLoadTask.promise;
     }
@@ -509,16 +513,10 @@ export class TutorialRunner {
                         }
                     }
                     if (!this._editorStore.documents.get()[filePath]) {
-                        const isDirectory = await _isDirectory(webcontainer, filePath);
-                        if (isDirectory) {
-                            this._editorStore.addFileOrFolder({ path: filePath, type: 'folder' });
-                        }
-                        else {
-                            this._editorStore.addFileOrFolder({ path: filePath, type: 'file' });
-                            this._updateCurrentFiles({ [filePath]: '' });
-                            scheduleReadFor(filePath, 'utf-8');
-                        }
+                        this._editorStore.addFileOrFolder({ path: filePath, type: 'file' });
                     }
+                    this._updateCurrentFiles({ [filePath]: '' });
+                    scheduleReadFor(filePath, 'utf-8');
                 }
             }
         });

package/dist/webcontainer/steps.d.ts

@@ -9,6 +9,21 @@ export declare class StepsController {
      * Steps that the runner is or will be executing.
      */
     steps: import("nanostores").WritableAtom<Steps | undefined>;
+    /**
+     * Number of prepare commands that should block terminal input.
+     * If undefined, terminal is not blocked during prepare commands.
+     */
+    private _blockingCount;
+    /**
+     * Whether the environment is being prepared (blocking prepare commands are running).
+     * This is true when any of the first N prepare commands (where N = terminalBlockingPrepareCommandsCount)
+     * has status 'idle' or 'running'. Used to block terminal input during npm install and similar setup commands.
+     */
+    isPreparing: import("nanostores").ReadableAtom<boolean>;
+    /**
+     * Set the number of prepare commands that should block terminal input.
+     */
+    setBlockingCount(count: number | undefined): void;
     setFromCommands(commands: Command[]): void;
     updateStep(index: number, step: Step): void;
     skipRemaining(index: number): void;

package/dist/webcontainer/steps.js

@@ -1,9 +1,38 @@
-import { atom } from 'nanostores';
+import { atom, computed } from 'nanostores';
 export class StepsController {
     /**
      * Steps that the runner is or will be executing.
      */
     steps = atom(undefined);
+    /**
+     * Number of prepare commands that should block terminal input.
+     * If undefined, terminal is not blocked during prepare commands.
+     */
+    _blockingCount = atom(undefined);
+    /**
+     * Whether the environment is being prepared (blocking prepare commands are running).
+     * This is true when any of the first N prepare commands (where N = terminalBlockingPrepareCommandsCount)
+     * has status 'idle' or 'running'. Used to block terminal input during npm install and similar setup commands.
+     */
+    isPreparing = computed([this.steps, this._blockingCount], (steps, blockingCount) => {
+        // if no blocking count is set, terminal is never blocked
+        if (blockingCount === undefined || blockingCount === 0) {
+            return false;
+        }
+        if (!steps || steps.length === 0) {
+            return false;
+        }
+        // only check the first N steps where N is the blocking count
+        const blockingSteps = steps.slice(0, blockingCount);
+        // environment is preparing if any blocking step is idle or running
+        return blockingSteps.some((step) => step.status === 'idle' || step.status === 'running');
+    });
+    /**
+     * Set the number of prepare commands that should block terminal input.
+     */
+    setBlockingCount(count) {
+        this._blockingCount.set(count);
+    }
     setFromCommands(commands) {
         if (commands.length > 0) {
             this.steps.set(commands.map((command) => ({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tutorialkit-rb/runtime",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "TutorialKit runtime",
   "author": "StackBlitz Inc.",
   "type": "module",
@@ -31,7 +31,7 @@
     "@webcontainer/api": "1.5.1",
     "nanostores": "^0.10.3",
     "picomatch": "^4.0.2",
-    "@tutorialkit-rb/types": "0.1.5"
+    "@tutorialkit-rb/types": "0.1.6"
   },
   "devDependencies": {
     "@types/picomatch": "^3.0.1",