phirepass-widgets 0.0.41 → 0.0.43

package/dist/esm/{index-C8ZFkLEv.js → index-D6RLmr6w.js}

@@ -1,8 +1,8 @@
 const NAMESPACE = 'phirepass-widgets';
-const BUILD = /* phirepass-widgets */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, prop: true, propChangeCallback: true, updatable: true};
+const BUILD = /* phirepass-widgets */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: true, state: true, updatable: true};
 
 /*
- Stencil Client Platform v4.43.3 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v4.43.4 | MIT Licensed | https://stenciljs.com
  */
 
 
@@ -58,7 +58,7 @@ var registerInstance = (lazyInstance, hostRef) => {
   if (!hostRef) return;
   lazyInstance.__stencil__getHostRef = () => hostRef;
   hostRef.$lazyInstance$ = lazyInstance;
-  if (hostRef.$cmpMeta$.$flags$ & 512 /* hasModernPropertyDecls */ && (BUILD.prop)) {
+  if (hostRef.$cmpMeta$.$flags$ & 512 /* hasModernPropertyDecls */ && (BUILD.state)) {
     reWireGetterSetter(lazyInstance, hostRef);
   }
 };
@@ -70,6 +70,9 @@ var registerHost = (hostElement, cmpMeta) => {
     $instanceValues$: /* @__PURE__ */ new Map(),
     $serializerValues$: /* @__PURE__ */ new Map()
   };
+  {
+    hostRef.$onInstancePromise$ = new Promise((r) => hostRef.$onInstanceResolve$ = r);
+  }
   {
     hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
     hostElement["s-p"] = [];
@@ -380,6 +383,12 @@ var h = (nodeName, vnodeData, ...children) => {
     if (vnodeData.key) {
       key = vnodeData.key;
     }
+    {
+      const classData = vnodeData.className || vnodeData.class;
+      if (classData) {
+        vnodeData.class = typeof classData !== "object" ? classData : Object.keys(classData).filter((k) => classData[k]).join(" ");
+      }
+    }
   }
   const vnode = newVNode(nodeName, null);
   vnode.$attrs$ = vnodeData;
@@ -411,6 +420,31 @@ var newVNode = (tag, text) => {
 var Host = {};
 var isHost = (node) => node && node.$tag$ === Host;
 
+// src/runtime/normalize-watchers.ts
+var normalizeWatchers = (raw) => {
+  if (!raw) return void 0;
+  const keys = Object.keys(raw);
+  if (keys.length === 0) return void 0;
+  let hasLegacy = false;
+  for (const propName of keys) {
+    if (hasLegacy) break;
+    for (const h2 of raw[propName]) {
+      if (typeof h2 === "string") {
+        hasLegacy = true;
+        break;
+      }
+    }
+  }
+  if (!hasLegacy) return raw;
+  const out = {};
+  for (const propName of keys) {
+    out[propName] = raw[propName].map(
+      (h2) => typeof h2 === "string" ? { [h2]: 0 } : h2
+    );
+  }
+  return out;
+};
+
 // src/runtime/parse-property-value.ts
 var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if (propValue != null && !isComplexType(propValue)) {
@@ -458,11 +492,37 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
     return;
   }
   let isProp = isMemberInElement(elm, memberName);
-  memberName.toLowerCase();
-  if (memberName === "key") ; else if (memberName === "ref") {
+  let ln = memberName.toLowerCase();
+  if (memberName === "class") {
+    const classList = elm.classList;
+    const oldClasses = parseClassList(oldValue);
+    let newClasses = parseClassList(newValue);
+    {
+      classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
+      classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
+    }
+  } else if (memberName === "key") ; else if (memberName === "ref") {
     if (newValue) {
       queueRefAttachment(newValue, elm);
     }
+  } else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
+    if (memberName[2] === "-") {
+      memberName = memberName.slice(3);
+    } else if (isMemberInElement(win, ln)) {
+      memberName = ln.slice(2);
+    } else {
+      memberName = ln[2] + memberName.slice(3);
+    }
+    if (oldValue || newValue) {
+      const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+      memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
+      if (oldValue) {
+        plt.rel(elm, memberName, oldValue, capture);
+      }
+      if (newValue) {
+        plt.ael(elm, memberName, newValue, capture);
+      }
+    }
   } else if (memberName[0] === "a" && memberName.startsWith("attr:")) {
     const propName = memberName.slice(5);
     let attrName;
@@ -528,6 +588,18 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
     }
   }
 };
+var parseClassListRegex = /\s/;
+var parseClassList = (value) => {
+  if (typeof value === "object" && value && "baseVal" in value) {
+    value = value.baseVal;
+  }
+  if (!value || typeof value !== "string") {
+    return [];
+  }
+  return value.split(parseClassListRegex);
+};
+var CAPTURE_EVENT_SUFFIX = "Capture";
+var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
 
 // src/runtime/vdom/update-element.ts
 var updateElement = (oldVnode, newVnode, isSvgMode2, isInitialRender) => {
@@ -567,7 +639,6 @@ function sortedAttrNames(attrNames) {
   );
 }
 var hostTagName;
-var useNativeShadowDom = false;
 var isSvgMode = false;
 var refCallbacksToRemove = [];
 var refCallbacksToAttach = [];
@@ -576,7 +647,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   let i2 = 0;
   let elm;
   let childNode;
-  {
+  if (newVNode2.$text$ != null) {
+    elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
+  } else {
     if (!win.document) {
       throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");
     }
@@ -599,25 +672,6 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   elm["s-hn"] = hostTagName;
   return elm;
 };
-var relocateToHostRoot = (parentElm) => {
-  plt.$flags$ |= 1 /* isTmpDisconnected */;
-  const host = parentElm.closest(hostTagName.toLowerCase());
-  if (host != null) {
-    const contentRefNode = Array.from(host.__childNodes || host.childNodes).find(
-      (ref) => ref["s-cr"]
-    );
-    const childNodeArray = Array.from(
-      parentElm.__childNodes || parentElm.childNodes
-    );
-    for (const childNode of contentRefNode ? childNodeArray.reverse() : childNodeArray) {
-      if (childNode["s-sh"] != null) {
-        insertBefore(host, childNode, contentRefNode != null ? contentRefNode : null);
-        childNode["s-sh"] = void 0;
-      }
-    }
-  }
-  plt.$flags$ &= -2 /* isTmpDisconnected */;
-};
 var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
   let containerElm = parentElm;
   let childNode;
@@ -750,20 +804,17 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
   const elm = newVNode2.$elm$ = oldVNode.$elm$;
   const oldChildren = oldVNode.$children$;
   const newChildren = newVNode2.$children$;
-  const tag = newVNode2.$tag$;
-  {
+  const text = newVNode2.$text$;
+  if (text == null) {
     {
-      if (tag === "slot" && !useNativeShadowDom) {
-        if (oldVNode.$name$ !== newVNode2.$name$) {
-          newVNode2.$elm$["s-sn"] = newVNode2.$name$ || "";
-          relocateToHostRoot(newVNode2.$elm$.parentElement);
-        }
-      }
       updateElement(oldVNode, newVNode2, isSvgMode);
     }
     if (oldChildren !== null && newChildren !== null) {
       updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
     } else if (newChildren !== null) {
+      if (oldVNode.$text$ !== null) {
+        elm.textContent = "";
+      }
       addVnodes(elm, null, newVNode2, newChildren, 0, newChildren.length - 1);
     } else if (
       // don't do this on initial render as it can cause non-hydrated content to be removed
@@ -771,6 +822,8 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
     ) {
       removeVnodes(oldChildren, 0, oldChildren.length - 1);
     } else ;
+  } else if (oldVNode.$text$ !== text) {
+    elm.data = text;
   }
 };
 var nullifyVNodeRefs = (vNode) => {
@@ -803,7 +856,6 @@ var insertBefore = (parent, newNode, reference, isInitialLoad) => {
 };
 var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   const hostElm = hostRef.$hostElement$;
-  const cmpMeta = hostRef.$cmpMeta$;
   const oldVNode = hostRef.$vnode$ || newVNode(null, null);
   const isHostElement = isHost(renderFnResults);
   const rootVnode = isHostElement ? renderFnResults : h(null, null, renderFnResults);
@@ -819,7 +871,6 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   rootVnode.$flags$ |= 4 /* isHost */;
   hostRef.$vnode$ = rootVnode;
   rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
-  useNativeShadowDom = !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && !(cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */);
   patch(oldVNode, rootVnode, isInitialLoad);
   flushQueuedRefCallbacks();
 };
@@ -959,6 +1010,9 @@ var postUpdateComponent = (hostRef) => {
     safeCall(instance, "componentDidUpdate", void 0, elm);
     endPostUpdate();
   }
+  {
+    hostRef.$onInstanceResolve$(elm);
+  }
   {
     if (hostRef.$onRenderResolve$) {
       hostRef.$onRenderResolve$();
@@ -1053,7 +1107,7 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
   if (cmpMeta.$members$ || BUILD.propChangeCallback) {
     {
       if (Cstr.watchers && !cmpMeta.$watchers$) {
-        cmpMeta.$watchers$ = Cstr.watchers;
+        cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
       }
       if (Cstr.deserializers && !cmpMeta.$deserializers$) {
         cmpMeta.$deserializers$ = Cstr.deserializers;
@@ -1137,6 +1191,17 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
             }
           }
         });
+      } else if (flags & 1 /* isElementConstructor */ && memberFlags & 64 /* Method */) {
+        Object.defineProperty(prototype, memberName, {
+          value(...args) {
+            var _a2;
+            const ref = getHostRef(this);
+            return (_a2 = ref == null ? void 0 : ref.$onInstancePromise$) == null ? void 0 : _a2.then(() => {
+              var _a3;
+              return (_a3 = ref.$lazyInstance$) == null ? void 0 : _a3[memberName](...args);
+            });
+          }
+        });
       }
     });
     if ((flags & 1 /* isElementConstructor */)) {
@@ -1168,11 +1233,13 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
             return;
           }
           const propFlags = members.find(([m]) => m === propName);
-          if (propFlags && propFlags[1][0] & 4 /* Boolean */) {
+          const isBooleanTarget = propFlags && propFlags[1][0] & 4 /* Boolean */;
+          const isSpuriousBooleanRemoval = isBooleanTarget && newValue === null && this[propName] === void 0;
+          if (isBooleanTarget) {
             newValue = newValue === null || newValue === "false" ? false : true;
           }
           const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
-          if (newValue != this[propName] && (!propDesc.get || !!propDesc.set)) {
+          if (!isSpuriousBooleanRemoval && newValue != this[propName] && (!propDesc.get || !!propDesc.set)) {
             this[propName] = newValue;
           }
         });
@@ -1213,7 +1280,7 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         }
         if (!Cstr.isProxied) {
           {
-            cmpMeta.$watchers$ = Cstr.watchers;
+            cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
             cmpMeta.$serializers$ = Cstr.serializers;
             cmpMeta.$deserializers$ = Cstr.deserializers;
           }
@@ -1366,7 +1433,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
   plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", win.document.baseURI).href;
   lazyBundles.map((lazyBundle) => {
     lazyBundle[1].map((compactMeta) => {
-      var _a2, _b, _c;
+      var _a2, _b;
       const cmpMeta = {
         $flags$: compactMeta[0],
         $tagName$: compactMeta[1],
@@ -1377,9 +1444,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
         cmpMeta.$members$ = compactMeta[2];
       }
       {
-        cmpMeta.$watchers$ = (_a2 = compactMeta[4]) != null ? _a2 : {};
-        cmpMeta.$serializers$ = (_b = compactMeta[5]) != null ? _b : {};
-        cmpMeta.$deserializers$ = (_c = compactMeta[6]) != null ? _c : {};
+        cmpMeta.$watchers$ = normalizeWatchers(compactMeta[4]);
+        cmpMeta.$serializers$ = (_a2 = compactMeta[5]) != null ? _a2 : {};
+        cmpMeta.$deserializers$ = (_b = compactMeta[6]) != null ? _b : {};
       }
       const tagName = transformTag(cmpMeta.$tagName$);
       const HostElement = class extends HTMLElement {

package/dist/esm/loader.js

@@ -1,11 +1,11 @@
-import { b as bootstrapLazy } from './index-C8ZFkLEv.js';
-export { s as setNonce } from './index-C8ZFkLEv.js';
+import { b as bootstrapLazy } from './index-D6RLmr6w.js';
+export { s as setNonce } from './index-D6RLmr6w.js';
 import { g as globalScripts } from './app-globals-DQuL1Twl.js';
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["phirepass-sftp-client",[[257,"phirepass-sftp-client"]]],["phirepass-terminal",[[513,"phirepass-terminal",{"terminalOptions":[16],"serverHost":[1,"server-host"],"serverPort":[2,"server-port"],"allowInsecure":[4,"allow-insecure"],"heartbeatInterval":[2,"heartbeat-interval"],"nodeId":[1,"node-id"],"token":[1],"serverId":[1,"server-id"]},null,{"nodeId":[{"onNodeIdChange":0}],"serverId":[{"onServerIdChange":0}]}]]]], options);
+  return bootstrapLazy([["phirepass-sftp-client",[[513,"phirepass-sftp-client",{"name":[1],"description":[1],"hideHeader":[4,"hide-header"],"serverHost":[1,"server-host"],"serverPort":[2,"server-port"],"allowInsecure":[4,"allow-insecure"],"heartbeatInterval":[2,"heartbeat-interval"],"nodeId":[1,"node-id"],"token":[1],"serverId":[1,"server-id"],"max":[32],"show_login_screen":[32],"show_login_screen_username":[32],"show_login_screen_password":[32],"maximize":[64],"minimize":[64]},null,{"nodeId":[{"onNodeIdChange":0}],"serverId":[{"onServerIdChange":0}]}]]],["phirepass-terminal",[[513,"phirepass-terminal",{"terminalOptions":[16],"serverHost":[1,"server-host"],"serverPort":[2,"server-port"],"allowInsecure":[4,"allow-insecure"],"heartbeatInterval":[2,"heartbeat-interval"],"nodeId":[1,"node-id"],"token":[1],"serverId":[1,"server-id"]},null,{"nodeId":[{"onNodeIdChange":0}],"serverId":[{"onServerIdChange":0}]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/esm/phirepass-sftp-client.entry.js

@@ -1,14 +1,236 @@
-import { r as registerInstance, h, H as Host } from './index-C8ZFkLEv.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-D6RLmr6w.js';
+import { _ as __wbg_init, C as Channel, a as ConnectionState, P as ProtocolMessageType } from './protocol-DgZMmpg7.js';
 
-const phirepassSftpClientCss = () => `:host{display:block}`;
+const phirepassSftpClientLogoSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIgogICAgc3Ryb2tlPSJyZ2IoNDYsIDE4NCwgMTM4KSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgICBjbGFzcz0ibHVjaWRlIGx1Y2lkZS10ZXJtaW5hbCB3LTMuNSBoLTMuNSB0ZXh0LXByaW1hcnkiPgogICAgPHBvbHlsaW5lIHBvaW50cz0iNCAxNyAxMCAxMSA0IDUiPjwvcG9seWxpbmU+CiAgICA8bGluZSB4MT0iMTIiIHgyPSIyMCIgeTE9IjE5IiB5Mj0iMTkiPjwvbGluZT4KPC9zdmc+Cg==';
+
+const phirepassSftpClientMaxSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIgogICAgc3Ryb2tlPSJyZ2IoMTE1LCAxMjMsIDE0MCkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIgogICAgY2xhc3M9Imx1Y2lkZSBsdWNpZGUtbWF4aW1pemUyIHctMyBoLTMiPgogICAgPHBvbHlsaW5lIHBvaW50cz0iMTUgMyAyMSAzIDIxIDkiPjwvcG9seWxpbmU+CiAgICA8cG9seWxpbmUgcG9pbnRzPSI5IDIxIDMgMjEgMyAxNSI+PC9wb2x5bGluZT4KICAgIDxsaW5lIHgxPSIyMSIgeDI9IjE0IiB5MT0iMyIgeTI9IjEwIj48L2xpbmU+CiAgICA8bGluZSB4MT0iMyIgeDI9IjEwIiB5MT0iMjEiIHkyPSIxNCI+PC9saW5lPgo8L3N2Zz4K';
+
+const phirepassSftpClientCss = () => `:host{--radius:0.375rem;--card:220 18% 10%;--border:220 15% 18%;--primary:160 60% 45%;--muted-foreground:220 10% 50%;font-family:ui-monospace,     SFMono-Regular,     Menlo,     Monaco,     Consolas,     Liberation Mono,     Courier New,     monospace;height:100%;width:100%;border:1px solid hsl(var(--border));background-color:hsl(var(--card));border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;position:relative;.listing{flex:1;display:flex;flex-direction:column;justify-content:space-between;header{height:30px;background:rgba(28, 31, 38, 0.6);border-bottom:1px solid hsl(var(--border));display:flex;align-items:center;justify-content:space-between;.actions{display:flex;align-items:center;.action{cursor:pointer;padding:4px;display:flex;align-items:center;z-index:1;img{height:14px;padding:4px;border-radius:4px}&:hover{background-color:hsl(var(--border) / 0.6)}}}.title{color:hsl(var(--primary));height:14px;padding:0 12px;display:flex;align-items:center;font-size:0.75rem;line-height:1rem;img{height:14px;margin-right:5px}.text{display:flex;flex-direction:row;justify-content:center;margin-top:2px;.name{margin-right:10px}.description{color:hsl(var(--muted-foreground))}}}}footer{height:25px;background:rgba(28, 31, 38, 0.6);border-top:1px solid hsl(var(--border))}}.creds{position:absolute;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;&.blurred{background:rgba(28, 31, 38, 0);backdrop-filter:blur(4px)}.form{display:flex;flex-direction:column;background:hsl(var(--card));width:200px;position:relative;background-color:rgba(21, 24, 30, 0.95);border:1px solid hsl(var(--border));padding:20px;box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px,         rgba(0, 0, 0, 0) 0px 0px 0px 0px,         rgba(0, 0, 0, 0.5) 0px 25px 50px -12px}}}:host(.max){height:100vh;width:100vw;position:fixed;top:0;left:0;z-index:9999}`;
 
 const PhirepassSftpClient = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.maximizeEvent = createEvent(this, "maximize");
+        this.connectionStateChanged = createEvent(this, "connectionStateChanged");
+    }
+    channel;
+    domReady = false;
+    runtimeReady = false;
+    connected = false;
+    // private inputMode: InputMode = InputMode.Default;
+    // private session_id?: number;
+    // private usernameBuffer = "";
+    // private passwordBuffer = "";
+    name = 'SFTP';
+    description = 'Client';
+    hideHeader = false;
+    serverHost = "phirepass.com";
+    serverPort = 443;
+    allowInsecure = false;
+    heartbeatInterval = 30_000;
+    nodeId;
+    token;
+    onNodeIdChange(newValue, _oldValue) {
+        // Handle the change in node_id here
+        // console.log(`node_id changed from ${oldValue} to ${newValue}`);
+        // Always clear local session state and reset terminal view
+        this.reset_session_state();
+        // this.terminal.reset();
+        // Close existing comms if connected
+        if (this.channel && this.channel.is_connected()) {
+            this.close_comms();
+        }
+        // Open new comms for the updated node
+        if (newValue) {
+            this.open_comms();
+            this.channel.connect();
+        }
+    }
+    serverId;
+    onServerIdChange(_newValue, _oldValue) {
+        this.onNodeIdChange(this.nodeId, this.nodeId);
+    }
+    maximizeEvent;
+    async maximize() {
+        this.max = !this.max;
+    }
+    async minimize() {
+        this.max = false;
+    }
+    connectionStateChanged;
+    max = false;
+    show_login_screen = false;
+    show_login_screen_username = false;
+    show_login_screen_password = false;
+    toggle_max() {
+        this.maximizeEvent?.emit(!this.max);
+    }
+    async connectedCallback() {
+        await __wbg_init();
+        // this.setup_terminal();
+        this.open_comms();
+        this.runtimeReady = true;
+        if (!this.nodeId) {
+            console.warn('Prop node_id is not set. Cannot connect to terminal.');
+            return;
+        }
+        this.try_connect();
+    }
+    componentDidLoad() {
+        this.domReady = true;
+        this.try_connect();
+    }
+    async disconnectedCallback() {
+        // if (this.resizeDebounceHandle) {
+        //     clearTimeout(this.resizeDebounceHandle);
+        //     this.resizeDebounceHandle = undefined;
+        // }
+        //
+        // if (this.resizeObserver) {
+        //     this.resizeObserver.disconnect();
+        // }
+        this.connected = false;
+        this.domReady = false;
+        this.runtimeReady = false;
+        this.close_comms();
+        // this.destroy_terminal();
+    }
+    connect() {
+        this.connected = true;
+        this.channel.connect();
+        // const container = this.containerEl;
+        // console.log('Attempting to connect terminal to container:', container);
+        // if (container) {
+        //     this.terminal.open(container);
+        //     console.log('Terminal opened in container');
+        //     this.connected = true;
+        //     this.fit_terminal_safely();
+        //     this.terminal.focus();
+        //     this.terminal.onData(this.handle_terminal_data.bind(this));
+        //     this.channel.connect();
+        //     this.setup_resize_observer();
+        //     console.log('Terminal connected and ready');
+        // }
+    }
+    try_connect() {
+        if (this.connected || !this.domReady || !this.runtimeReady) {
+            return;
+        }
+        if (!this.channel) {
+            return;
+        }
+        this.connect();
+    }
+    create_web_socket_endpoint() {
+        const protocol = this.allowInsecure ? 'ws' : 'wss';
+        if (!this.allowInsecure && this.serverPort === 443) {
+            return `${protocol}://${this.serverHost}`;
+        }
+        if (this.allowInsecure && this.serverPort === 80) {
+            return `${protocol}://${this.serverHost}`;
+        }
+        return `${protocol}://${this.serverHost}:${this.serverPort}`;
+    }
+    handle_error(_error_) {
+        //
+    }
+    handle_auth_success(_auth_) {
+        this.clear_creds_buffer();
+        this.channel.start_heartbeat(this.heartbeatInterval <= 15_000 ? 30_000 : this.heartbeatInterval);
+        this.channel.open_sftp_tunnel(this.nodeId);
+    }
+    handle_tunnel_opened(_web_) {
+        // this.session_id = web.sid;
+        // this.terminal.reset();
+        // this.fit_terminal_safely();
+        // this.send_ssh_terminal_resize();
+    }
+    handle_tunnel_data(_web_) {
+        // TODO
+    }
+    handle_tunnel_closed(_web_) {
+        // this.session_id = undefined;
+        // this.inputMode = InputMode.Default;
+        this.clear_creds_buffer();
+        // this.terminal.reset();
+        // this.terminal.writeln("Connection closed.");
+        this.close_comms();
+    }
+    open_comms() {
+        if (this.serverId) {
+            this.channel = new Channel(`${this.create_web_socket_endpoint()}/api/web/ws`, this.nodeId, this.serverId);
+        }
+        else {
+            this.channel = new Channel(`${this.create_web_socket_endpoint()}/api/web/ws`, this.nodeId);
+        }
+        this.channel.on_connection_open(() => {
+            this.connectionStateChanged.emit([ConnectionState.Connected]);
+            this.channel.authenticate(this.token, this.nodeId);
+        });
+        this.channel.on_connection_close(() => {
+            this.connectionStateChanged.emit([ConnectionState.Disconnected]);
+            // this.terminal.reset();
+        });
+        this.channel.on_connection_error((err) => {
+            this.connectionStateChanged.emit([ConnectionState.Error, err]);
+        });
+        this.channel.on_connection_message((_raw_) => {
+            // console.log('>> raw message received', raw);
+        });
+        this.channel.on_protocol_message((msg) => {
+            const { web } = msg.data;
+            switch (web.type) {
+                case ProtocolMessageType.Error:
+                    this.handle_error(web);
+                    break;
+                case ProtocolMessageType.AuthSuccess:
+                    this.handle_auth_success(web);
+                    break;
+                case ProtocolMessageType.TunnelOpened:
+                    this.handle_tunnel_opened(web);
+                    break;
+                case ProtocolMessageType.TunnelClosed:
+                    this.handle_tunnel_closed(web);
+                    break;
+                case ProtocolMessageType.TunnelData:
+                    this.handle_tunnel_data(web);
+                    break;
+                default:
+                    console.warn('Unknown protocol message type:', web);
+            }
+        });
+    }
+    close_comms() {
+        this.channel.stop_heartbeat();
+        this.channel.disconnect();
+    }
+    clear_creds_buffer() {
+        // this.usernameBuffer = "";
+        // this.passwordBuffer = "";
+    }
+    reset_session_state() {
+        // this.session_id = undefined;
+        // this.inputMode = InputMode.Default;
+        this.clear_creds_buffer();
     }
     render() {
-        return (h(Host, { key: 'd03ff09e3636f79d699c7462e121abe7d08c6683' }, h("slot", { key: 'bd7285e70384558e4cbf0600b89a57fa4ec3406d' })));
+        return (h(Host, { key: 'ac63e2c701cd09a605d0aaa7396eaec16ff9c3bc', class: {
+                'default': !this.max,
+                'max': this.max,
+            } }, h("section", { key: '253dfc510c62ee57a96d574af993e8017475a0c2', class: "listing" }, !this.hideHeader &&
+            h("header", { key: '215ddf76ba55641892fc9a758077ba8d1f3a6671' }, h("section", { key: '49541a8d31d8c61e2df84c60348f7426fddec67c', class: "title" }, h("img", { key: '1a86ba6b3de92b35cbd5b1bacfdfee2da6fa6766', src: phirepassSftpClientLogoSvg, alt: "SFTP Client" }), h("div", { key: '38d90384978acc8b323ca4c396db7bda54320059', class: "text" }, h("div", { key: 'a94b3fd21025000b620b2bb85aec87198e575bfa', class: "name" }, this.name), h("div", { key: '072c41dc8d05faf77929f8c128bb97b64d8835bf', class: "description" }, this.description))), h("section", { key: '46e575f4ce5f2da0913d2f3aebe025540f1f3688', class: "actions" }, h("div", { key: 'f92d66ab7ab5e9c25a29037c60709c54623194be', class: "action", onClick: () => this.toggle_max() }, h("img", { key: 'e115204a83336fc4b49a30551208b727c3f33be9', src: phirepassSftpClientMaxSvg, alt: "Maximize" })))), h("main", { key: 'c6bf5ab4e5aa46dcba8e50ec1a9c2feb1f55ea02' }), h("footer", { key: 'ac67a3e0966e3f04bee019162f8174aae58cbf1a' })), h("section", { key: '07e83117470f7f226328703b18f836bd4358cfe9', class: {
+                'creds': true,
+                'blurred': this.show_login_screen,
+            } }, this.show_login_screen && h("form", { key: '808209eaba50f10a8ef96163972ad36ea9e3d3e2', class: "form" }, h("div", { key: '9e26efeac2f17d6b4168e1a77da6ef61d325f6e3' }, "SFTP Connection"), h("div", { key: 'f9badb92d4434a16916429a2bedb6e38d2ae647c' }, h("div", { key: '9fb267ba7828cd950b327a17e0ee803dc399c80b' }, "Username"), h("input", { key: '65b34c14292b0bde408861e791f3baa99c4c9a02', type: "text", placeholder: "" })), h("div", { key: 'f1f9def8290dfcde9beff0f61092f6020580b72c' }, h("div", { key: '1c89b71c4126299b7e8e421b05761d2b0424d4ed' }, "Password"), h("input", { key: '17364976158ddaacbb55ed17ee09ec242bcbdce7', type: "password", placeholder: "" })), h("div", { key: '9362acdf153ceeba3c8e8cee0518cf2baeec27e0' }, h("button", { key: 'ebf6c205276a7c3ff34c13e148978be61044ff7a' }, "Connect"))))));
     }
+    static get watchers() { return {
+        "nodeId": [{
+                "onNodeIdChange": 0
+            }],
+        "serverId": [{
+                "onServerIdChange": 0
+            }]
+    }; }
 };
 PhirepassSftpClient.style = phirepassSftpClientCss();