tasmota-esp-web-tools 11.1.10 → 12.0.0

package/dist/components/ew-checkbox.d.ts

@@ -0,0 +1,9 @@
+import { Checkbox } from "@material/web/checkbox/internal/checkbox.js";
+export declare class EwCheckbox extends Checkbox {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-checkbox": EwCheckbox;
+    }
+}

package/dist/components/ew-checkbox.js

@@ -0,0 +1,6 @@
+import { Checkbox } from "@material/web/checkbox/internal/checkbox.js";
+import { styles } from "@material/web/checkbox/internal/checkbox-styles.js";
+export class EwCheckbox extends Checkbox {
+}
+EwCheckbox.styles = [styles];
+customElements.define("ew-checkbox", EwCheckbox);

package/dist/components/ew-circular-progress.d.ts

@@ -0,0 +1,9 @@
+import { CircularProgress } from "@material/web/progress/internal/circular-progress.js";
+export declare class EwCircularProgress extends CircularProgress {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-circular-progress": EwCircularProgress;
+    }
+}

package/dist/components/ew-circular-progress.js

@@ -0,0 +1,6 @@
+import { CircularProgress } from "@material/web/progress/internal/circular-progress.js";
+import { styles } from "@material/web/progress/internal/circular-progress-styles.js";
+export class EwCircularProgress extends CircularProgress {
+}
+EwCircularProgress.styles = [styles];
+customElements.define("ew-circular-progress", EwCircularProgress);

package/dist/components/{ewt-console.d.ts → ew-console.d.ts}

@@ -6,15 +6,21 @@ export declare class EwtConsole extends HTMLElement {
     onReset?: () => Promise<void>;
     private _console?;
     private _cancelConnection?;
+    private _clickHandler?;
+    private _commandHistory;
+    private _historyIndex;
+    private _currentInput;
     logs(): string;
     connectedCallback(): void;
     private _connect;
+    private _navigateHistory;
     private _sendCommand;
     disconnect(): Promise<void>;
+    disconnectedCallback(): void;
     reset(): Promise<void>;
 }
 declare global {
     interface HTMLElementTagNameMap {
-        "ewt-console": EwtConsole;
+        "ew-console": EwtConsole;
     }
 }

package/dist/components/ew-console.js

@@ -0,0 +1,230 @@
+import { ColoredConsole, coloredConsoleStyles } from "../util/console-color";
+import { sleep } from "../util/sleep";
+import { LineBreakTransformer } from "../util/line-break-transformer";
+import { TimestampTransformer } from "../util/timestamp-transformer";
+export class EwtConsole extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.allowInput = true;
+        this._commandHistory = [];
+        this._historyIndex = -1;
+        this._currentInput = "";
+    }
+    logs() {
+        var _a;
+        return ((_a = this._console) === null || _a === void 0 ? void 0 : _a.logs()) || "";
+    }
+    connectedCallback() {
+        var _a;
+        if (this._console) {
+            return;
+        }
+        // attachShadow throws if a shadow root already exists; reuse it on reattach
+        const shadowRoot = (_a = this.shadowRoot) !== null && _a !== void 0 ? _a : this.attachShadow({ mode: "open" });
+        shadowRoot.innerHTML = `
+      <style>
+        :host, input {
+          background-color: #1c1c1c;
+          color: #ddd;
+          font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier,
+            monospace;
+          line-height: 1.45;
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+        }
+        form {
+          display: flex;
+          align-items: center;
+          padding: 0 8px 0 16px;
+          flex-shrink: 0;
+        }
+        input {
+          flex: 1;
+          padding: 4px;
+          margin: 0 8px;
+          border: 0;
+          outline: none;
+        }
+        ${coloredConsoleStyles}
+      </style>
+      <div class="log"></div>
+      ${this.allowInput
+            ? `<form>
+                <span aria-hidden="true">></span>
+                <input aria-label="Serial command" autofocus>
+              </form>
+            `
+            : ""}
+    `;
+        this._console = new ColoredConsole(this.shadowRoot.querySelector("div"));
+        if (this.allowInput) {
+            const input = this.shadowRoot.querySelector("input");
+            this._clickHandler = () => {
+                var _a;
+                // Only focus input if user didn't select some text
+                if (((_a = getSelection()) === null || _a === void 0 ? void 0 : _a.toString()) === "") {
+                    input.focus();
+                }
+            };
+            this.addEventListener("click", this._clickHandler);
+            input.addEventListener("keydown", (ev) => {
+                if (ev.key === "Enter") {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    this._sendCommand();
+                }
+                else if (ev.key === "ArrowUp") {
+                    ev.preventDefault();
+                    this._navigateHistory(input, 1);
+                }
+                else if (ev.key === "ArrowDown") {
+                    ev.preventDefault();
+                    this._navigateHistory(input, -1);
+                }
+                else {
+                    // User is editing — reset history navigation
+                    this._historyIndex = -1;
+                }
+            });
+        }
+        const abortController = new AbortController();
+        const connection = this._connect(abortController.signal);
+        this._cancelConnection = () => {
+            abortController.abort();
+            return connection;
+        };
+    }
+    async _connect(signal) {
+        this.logger.debug("Starting console read loop");
+        // Capture a stable reference; addLine() becomes a no-op after destroy()
+        const consoleView = this._console;
+        if (!this.port.readable) {
+            consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+            consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+            consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("Terminal disconnected: Port readable stream not available");
+            this.logger.error("Port readable stream not available - port may need to be reopened at correct baudrate");
+            return;
+        }
+        try {
+            await this.port.readable
+                .pipeThrough(new TextDecoderStream(), { signal })
+                .pipeThrough(new TransformStream(new LineBreakTransformer()))
+                .pipeThrough(new TransformStream(new TimestampTransformer()))
+                .pipeTo(new WritableStream({
+                write: (line) => {
+                    consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine(line);
+                },
+            }));
+            if (!signal.aborted) {
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("Terminal disconnected");
+            }
+        }
+        catch (err) {
+            if (!signal.aborted) {
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine("");
+                consoleView === null || consoleView === void 0 ? void 0 : consoleView.addLine(`Terminal disconnected: ${err}`);
+            }
+        }
+        finally {
+            await sleep(100);
+            this.logger.debug("Finished console read loop");
+        }
+    }
+    _navigateHistory(input, direction) {
+        if (this._commandHistory.length === 0)
+            return;
+        // Save current input before navigating away
+        if (this._historyIndex === -1) {
+            this._currentInput = input.value;
+        }
+        const newIndex = this._historyIndex + direction;
+        if (newIndex < 0) {
+            // Back to current (unsent) input
+            this._historyIndex = -1;
+            input.value = this._currentInput;
+        }
+        else if (newIndex < this._commandHistory.length) {
+            this._historyIndex = newIndex;
+            input.value = this._commandHistory[this._historyIndex];
+        }
+        // Move cursor to end
+        const len = input.value.length;
+        input.setSelectionRange(len, len);
+    }
+    async _sendCommand() {
+        var _a, _b;
+        const input = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("input");
+        if (!input || !this.port.writable)
+            return;
+        const value = input.value;
+        const writer = this.port.writable.getWriter();
+        try {
+            await writer.write(new TextEncoder().encode(`${value}\r\n`));
+            (_b = this._console) === null || _b === void 0 ? void 0 : _b.addLine(`> ${value}\r\n`);
+            if (input.isConnected) {
+                // Add to history (skip empty, skip consecutive duplicates, cap at 100)
+                if (value && value !== this._commandHistory[0]) {
+                    this._commandHistory.unshift(value);
+                    if (this._commandHistory.length > 100) {
+                        this._commandHistory.pop();
+                    }
+                }
+                this._historyIndex = -1;
+                this._currentInput = "";
+                input.value = "";
+                input.focus();
+            }
+        }
+        finally {
+            try {
+                writer.releaseLock();
+            }
+            catch (err) {
+                this.logger.error("Ignoring release lock error", err);
+            }
+        }
+    }
+    async disconnect() {
+        var _a;
+        if (this._clickHandler) {
+            this.removeEventListener("click", this._clickHandler);
+            this._clickHandler = undefined;
+        }
+        if (this._cancelConnection) {
+            await this._cancelConnection();
+            this._cancelConnection = undefined;
+        }
+        (_a = this._console) === null || _a === void 0 ? void 0 : _a.destroy();
+        this._console = undefined;
+    }
+    disconnectedCallback() {
+        var _a;
+        if (this._clickHandler) {
+            this.removeEventListener("click", this._clickHandler);
+            this._clickHandler = undefined;
+        }
+        if (this._cancelConnection) {
+            this._cancelConnection();
+            this._cancelConnection = undefined;
+        }
+        (_a = this._console) === null || _a === void 0 ? void 0 : _a.destroy();
+        this._console = undefined;
+    }
+    async reset() {
+        this.logger.debug("Triggering reset.");
+        if (this.onReset) {
+            try {
+                await this.onReset();
+            }
+            catch (err) {
+                this.logger.error("Reset callback failed:", err);
+            }
+        }
+        await sleep(1000);
+    }
+}
+customElements.define("ew-console", EwtConsole);

package/dist/components/ew-dialog.d.ts

@@ -0,0 +1,9 @@
+import { Dialog } from "@material/web/dialog/internal/dialog.js";
+export declare class EwDialog extends Dialog {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-dialog": EwDialog;
+    }
+}

package/dist/components/ew-dialog.js

@@ -0,0 +1,6 @@
+import { Dialog } from "@material/web/dialog/internal/dialog.js";
+import { styles } from "@material/web/dialog/internal/dialog-styles.js";
+export class EwDialog extends Dialog {
+}
+EwDialog.styles = [styles];
+customElements.define("ew-dialog", EwDialog);

package/dist/components/ew-divider.d.ts

@@ -0,0 +1,9 @@
+import { Divider } from "@material/web/divider/internal/divider.js";
+export declare class EwDivider extends Divider {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-divider": EwDivider;
+    }
+}

package/dist/components/ew-divider.js

@@ -0,0 +1,6 @@
+import { Divider } from "@material/web/divider/internal/divider.js";
+import { styles } from "@material/web/divider/internal/divider-styles.js";
+export class EwDivider extends Divider {
+}
+EwDivider.styles = [styles];
+customElements.define("ew-divider", EwDivider);

package/dist/components/ew-filled-select.d.ts

@@ -0,0 +1,9 @@
+import { FilledSelect } from "@material/web/select/internal/filled-select.js";
+export declare class EwFilledSelect extends FilledSelect {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-filled-select": EwFilledSelect;
+    }
+}

package/dist/components/ew-filled-select.js

@@ -0,0 +1,7 @@
+import { FilledSelect } from "@material/web/select/internal/filled-select.js";
+import { styles } from "@material/web/select/internal/filled-select-styles.js";
+import { styles as sharedStyles } from "@material/web/select/internal/shared-styles.js";
+export class EwFilledSelect extends FilledSelect {
+}
+EwFilledSelect.styles = [sharedStyles, styles];
+customElements.define("ew-filled-select", EwFilledSelect);

package/dist/components/ew-filled-text-field.d.ts

@@ -0,0 +1,10 @@
+import { FilledTextField } from "@material/web/textfield/internal/filled-text-field.js";
+export declare class EwFilledTextField extends FilledTextField {
+    static styles: import("lit").CSSResult[];
+    protected readonly fieldTag: import("lit-html/static.js").StaticValue;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-filled-text-field": EwFilledTextField;
+    }
+}

package/dist/components/ew-filled-text-field.js

@@ -0,0 +1,12 @@
+import { styles as filledStyles } from "@material/web/textfield/internal/filled-styles.js";
+import { FilledTextField } from "@material/web/textfield/internal/filled-text-field.js";
+import { styles as sharedStyles } from "@material/web/textfield/internal/shared-styles.js";
+import { literal } from "lit/static-html.js";
+export class EwFilledTextField extends FilledTextField {
+    constructor() {
+        super(...arguments);
+        this.fieldTag = literal `md-filled-field`;
+    }
+}
+EwFilledTextField.styles = [sharedStyles, filledStyles];
+customElements.define("ew-filled-text-field", EwFilledTextField);

package/dist/components/ew-icon-button.d.ts

@@ -0,0 +1,9 @@
+import { IconButton } from "@material/web/iconbutton/internal/icon-button.js";
+export declare class EwIconButton extends IconButton {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-icon-button": EwIconButton;
+    }
+}

package/dist/components/ew-icon-button.js

@@ -0,0 +1,7 @@
+import { IconButton } from "@material/web/iconbutton/internal/icon-button.js";
+import { styles as sharedStyles } from "@material/web/iconbutton/internal/shared-styles.js";
+import { styles } from "@material/web/iconbutton/internal/standard-styles.js";
+export class EwIconButton extends IconButton {
+}
+EwIconButton.styles = [sharedStyles, styles];
+customElements.define("ew-icon-button", EwIconButton);

package/dist/components/ew-list-item.d.ts

@@ -0,0 +1,9 @@
+import { ListItemEl as ListItem } from "@material/web/list/internal/listitem/list-item.js";
+export declare class EwListItem extends ListItem {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-list-item": EwListItem;
+    }
+}

package/dist/components/ew-list-item.js

@@ -0,0 +1,6 @@
+import { ListItemEl as ListItem } from "@material/web/list/internal/listitem/list-item.js";
+import { styles } from "@material/web/list/internal/listitem/list-item-styles.js";
+export class EwListItem extends ListItem {
+}
+EwListItem.styles = [styles];
+customElements.define("ew-list-item", EwListItem);

package/dist/components/ew-list.d.ts

@@ -0,0 +1,9 @@
+import { List } from "@material/web/list/internal/list.js";
+export declare class EwList extends List {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-list": EwList;
+    }
+}

package/dist/components/ew-list.js

@@ -0,0 +1,6 @@
+import { List } from "@material/web/list/internal/list.js";
+import { styles } from "@material/web/list/internal/list-styles.js";
+export class EwList extends List {
+}
+EwList.styles = [styles];
+customElements.define("ew-list", EwList);

package/dist/components/{ewt-littlefs-manager.d.ts → ew-littlefs-manager.d.ts}

@@ -1,7 +1,6 @@
 import { LitElement } from "lit";
 import type { Partition } from "../partition.js";
-import "./ewt-button";
-import "./ewt-textfield";
+import "./ew-text-button";
 export declare class EwtLittleFSManager extends LitElement {
     partition: Partition;
     espStub: any;

package/dist/components/{ewt-littlefs-manager.js → ew-littlefs-manager.js}

@@ -1,8 +1,7 @@
 import { __decorate } from "tslib";
 import { LitElement, html, css } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
-import "./ewt-button";
-import "./ewt-textfield";
+import "./ew-text-button";
 // Dynamic import for LittleFS WASM module
 let _wasmBasePath = null;
 let _littleFSModule = null;
@@ -458,38 +457,32 @@ let EwtLittleFSManager = class EwtLittleFSManager extends LitElement {
         </div>
 
         <div class="littlefs-controls">
-          <ewt-button
-            label="Refresh"
-            @click=${this._refreshFiles}
-            ?disabled=${this._busy}
-          ></ewt-button>
-          <ewt-button
-            label="Backup Image"
-            @click=${this._backupImage}
-            ?disabled=${this._busy}
-          ></ewt-button>
-          <ewt-button
-            label="Write to Flash"
-            @click=${this._writeToFlash}
-            ?disabled=${this._busy}
-          ></ewt-button>
-          <ewt-button
-            label="Close"
+          <ew-text-button @click=${this._refreshFiles} ?disabled=${this._busy}
+            >Refresh</ew-text-button
+          >
+          <ew-text-button @click=${this._backupImage} ?disabled=${this._busy}
+            >Backup Image</ew-text-button
+          >
+          <ew-text-button @click=${this._writeToFlash} ?disabled=${this._busy}
+            >Write to Flash</ew-text-button
+          >
+          <ew-text-button
             @click=${() => {
             this._cleanup();
             if (this.onClose)
                 this.onClose();
         }}
             ?disabled=${this._busy}
-          ></ewt-button>
+            >Close</ew-text-button
+          >
         </div>
 
         <div class="littlefs-breadcrumb">
-          <ewt-button
-            label="↑ Up"
+          <ew-text-button
             @click=${this._navigateUp}
             ?disabled=${this._currentPath === "/" || this._busy}
-          ></ewt-button>
+            >↑ Up</ew-text-button
+          >
           <span>${this._currentPath || "/"}</span>
         </div>
 
@@ -499,16 +492,14 @@ let EwtLittleFSManager = class EwtLittleFSManager extends LitElement {
             @change=${this._handleFileSelect}
             ?disabled=${this._busy}
           />
-          <ewt-button
-            label="Upload File"
+          <ew-text-button
             @click=${this._uploadFile}
             ?disabled=${!this._selectedFile || this._busy}
-          ></ewt-button>
-          <ewt-button
-            label="New Folder"
-            @click=${this._createFolder}
-            ?disabled=${this._busy}
-          ></ewt-button>
+            >Upload File</ew-text-button
+          >
+          <ew-text-button @click=${this._createFolder} ?disabled=${this._busy}
+            >New Folder</ew-text-button
+          >
         </div>
 
         <div class="littlefs-files">
@@ -560,19 +551,19 @@ let EwtLittleFSManager = class EwtLittleFSManager extends LitElement {
                           <div class="file-actions">
                             ${entry.type === "file"
                 ? html `
-                                  <ewt-button
-                                    label="Download"
+                                  <ew-text-button
                                     @click=${() => this._downloadFile(entry.path)}
                                     ?disabled=${this._busy}
-                                  ></ewt-button>
+                                    >Download</ew-text-button
+                                  >
                                 `
                 : ""}
-                            <ewt-button
+                            <ew-text-button
                               class="danger"
-                              label="Delete"
                               @click=${() => this._deleteFile(entry.path, entry.type)}
                               ?disabled=${this._busy}
-                            ></ewt-button>
+                              >Delete</ew-text-button
+                            >
                           </div>
                         </td>
                       </tr>
@@ -594,7 +585,7 @@ EwtLittleFSManager.styles = css `
       max-width: 100%;
       margin: 0 auto;
       padding: 15px;
-      border: 2px solid var(--mdc-theme-primary, #03a9f4);
+      border: 2px solid var(--md-sys-color-primary, #03a9f4);
       border-radius: 10px;
       background-color: rgba(3, 169, 244, 0.05);
       box-sizing: border-box;
@@ -602,7 +593,7 @@ EwtLittleFSManager.styles = css `
 
     h3 {
       margin: 0 0 15px 0;
-      color: var(--mdc-theme-primary, #03a9f4);
+      color: var(--md-sys-color-primary, #03a9f4);
       font-size: 18px;
       font-weight: 600;
     }
@@ -641,8 +632,8 @@ EwtLittleFSManager.styles = css `
       height: 100%;
       background: linear-gradient(
         90deg,
-        var(--mdc-theme-primary, #03a9f4) 0%,
-        var(--mdc-theme-primary, #03a9f4) 100%
+        var(--md-sys-color-primary, #03a9f4) 0%,
+        var(--md-sys-color-primary, #03a9f4) 100%
       );
       transition: width 0.3s ease;
     }
@@ -680,7 +671,7 @@ EwtLittleFSManager.styles = css `
     .disk-version {
       font-size: 11px;
       padding: 2px 6px;
-      background-color: var(--mdc-theme-primary, #03a9f4);
+      background-color: var(--md-sys-color-primary, #03a9f4);
       color: white;
       border-radius: 4px;
     }
@@ -783,7 +774,7 @@ EwtLittleFSManager.styles = css `
     }
 
     .file-name.clickable:hover {
-      color: var(--mdc-theme-primary, #03a9f4);
+      color: var(--md-sys-color-primary, #03a9f4);
       text-decoration: underline;
     }
 
@@ -797,7 +788,7 @@ EwtLittleFSManager.styles = css `
     }
 
     .danger {
-      --mdc-theme-primary: var(--improv-danger-color, #db4437);
+      --md-sys-color-primary: var(--danger-color, #db4437);
     }
   `;
 __decorate([

package/dist/components/ew-select-option.d.ts

@@ -0,0 +1,9 @@
+import { SelectOptionEl } from "@material/web/select/internal/selectoption/select-option.js";
+export declare class EwSelectOption extends SelectOptionEl {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-select-option": EwSelectOption;
+    }
+}

package/dist/components/ew-select-option.js

@@ -0,0 +1,6 @@
+import { styles } from "@material/web/menu/internal/menuitem/menu-item-styles.js";
+import { SelectOptionEl } from "@material/web/select/internal/selectoption/select-option.js";
+export class EwSelectOption extends SelectOptionEl {
+}
+EwSelectOption.styles = [styles];
+customElements.define("ew-select-option", EwSelectOption);

package/dist/components/ew-text-button.d.ts

@@ -0,0 +1,9 @@
+import { TextButton } from "@material/web/button/internal/text-button.js";
+export declare class EwTextButton extends TextButton {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "ew-text-button": EwTextButton;
+    }
+}

package/dist/components/ew-text-button.js

@@ -0,0 +1,7 @@
+import { styles as sharedStyles } from "@material/web/button/internal/shared-styles.js";
+import { TextButton } from "@material/web/button/internal/text-button.js";
+import { styles as textStyles } from "@material/web/button/internal/text-styles.js";
+export class EwTextButton extends TextButton {
+}
+EwTextButton.styles = [sharedStyles, textStyles];
+customElements.define("ew-text-button", EwTextButton);