1.4.1

changelog.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 2025-01-20 - 1.4.1 - fix(dependencies)
+Update dependency versions for smartpromise, webcontainer/api, tapbundle, and @types/node
+
+- Update @push.rocks/smartpromise to version ^4.2.0
+- Downgrade @webcontainer/api to version 1.2.0
+- Update @push.rocks/tapbundle to version ^5.5.6
+- Update @types/node to version ^22.10.7
+
+## 2025-01-20 - 1.4.0 - feat(dees-terminal)
+Enhanced the dees-terminal component to support environment variable settings and improved setup command execution.
+
+- Added environment property to pass custom environment variables.
+- Introduced webcontainerDeferred to handle the promise for web container creation.
+- Enhanced demo to illustrate environment variable usage.
+- Improved async interaction with the terminal for setting environment variables and executing setup commands.
+
 ## 2025-01-15 - 1.3.4 - fix(chart)
 Fix chart rendering and appearance issues in the DeesChartArea component.
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@design.estate/dees-catalog",
-  "version": "1.3.4",
+  "version": "1.4.1",
   "private": false,
   "description": "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.",
   "main": "dist_ts_web/index.js",
@@ -23,10 +23,10 @@
     "@fortawesome/free-regular-svg-icons": "^6.7.2",
     "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@push.rocks/smarti18n": "^1.0.4",
-    "@push.rocks/smartpromise": "^4.1.0",
+    "@push.rocks/smartpromise": "^4.2.0",
     "@push.rocks/smartstring": "^4.0.15",
     "@tsclass/tsclass": "^4.4.0",
-    "@webcontainer/api": "1.5.1-internal.6",
+    "@webcontainer/api": "1.2.0",
     "apexcharts": "^4.3.0",
     "highlight.js": "11.11.1",
     "ibantools": "^4.5.1",
@@ -41,8 +41,8 @@
     "@git.zone/tstest": "^1.0.90",
     "@git.zone/tswatch": "^2.0.37",
     "@push.rocks/projectinfo": "^5.0.2",
-    "@push.rocks/tapbundle": "^5.5.4",
-    "@types/node": "^22.10.6"
+    "@push.rocks/tapbundle": "^5.5.6",
+    "@types/node": "^22.10.7"
   },
   "files": [
     "ts/**/*",

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@design.estate/dees-catalog',
-  version: '1.3.4',
+  version: '1.4.1',
   description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 }

ts_web/elements/dees-terminal.ts

@@ -22,13 +22,25 @@ declare global {
 
 @customElement('dees-terminal')
 export class DeesTerminal extends DeesElement {
-  public static demo = () => html` <dees-terminal></dees-terminal> `;
+  public static demo = () => html` <dees-terminal
+    .environment=${{
+      NODE_ENV: 'development',
+      PORT: '3000',
+    }}
+  ></dees-terminal> `;
 
   // INSTANCE
   private resizeObserver: ResizeObserver;
 
   @property()
-  public setupCommand = `pnpm install @git.zone/tsbuild && clear && echo 'welcome'`;
+  public setupCommand = `pnpm install @serve.zone/cli && servezone cli\n`;
+
+  @property()
+  environment: {[key: string]: string} = {};
+
+  // exposing webcontainer
+  private webcontainerDeferred = new domtools.plugins.smartpromise.Deferred<webcontainer.WebContainer>();
+  public webcontainerPromise = this.webcontainerDeferred.promise;
 
   constructor() {
     super();
@@ -282,8 +294,15 @@ export class DeesTerminal extends DeesElement {
       input.write(data);
     });
     await this.waitForPrompt(term, '~/');
+    // lets set the environment variables
+    await this.setEnvironmentVariables(this.environment, webcontainerInstance);
+    input.write(`source source.env\n`);
+    await this.waitForPrompt(term, '~/');
+    // lets run the setup command
     input.write(this.setupCommand);
-    input.write(`\n`);
+    await this.waitForPrompt(term, '~/');
+    input.write(`clear && echo 'welcome'\n`);
+    this.webcontainerDeferred.resolve(webcontainerInstance);
   }
 
   async connectedCallback(): Promise<void> {
@@ -300,14 +319,16 @@ export class DeesTerminal extends DeesElement {
     this.fitAddon.fit();
   }
 
-  private async waitForPrompt(term: Terminal, prompt: string): Promise<void> {
+  public async waitForPrompt(term: Terminal, prompt: string): Promise<void> {
     return new Promise<void>((resolve) => {
       const checkPrompt = () => {
         const lines = term.buffer.active;
         for (let i = 0; i < lines.length; i++) {
           const line = lines.getLine(i);
           if (line && line.translateToString().includes(prompt)) {
+            setTimeout(() => {
               resolve();
+            }, 100);
             return;
           }
         }
@@ -317,4 +338,18 @@ export class DeesTerminal extends DeesElement {
       checkPrompt();
     });
   }
+
+  public async setEnvironmentVariables(envArg: {[key: string]: string}, webcontainerInstanceArg?: webcontainer.WebContainer) {
+    const webcontainerInstance = webcontainerInstanceArg ||await this.webcontainerPromise;
+    let envFile = ``
+    for (const key in envArg) { 
+      envFile += `export ${key}="${envArg[key]}"\n`;
+    }
+
+    await webcontainerInstance.mount({'source.env': {
+      file: {
+        contents: envFile,
+      }
+    }});
+  }
 }