@kosdev-code/kos-ui-sdk 0.1.0-next.719 → 0.1.0-next.734

package/index.cjs

@@ -807,12 +807,12 @@ log$Q.methodFactory = function(methodName, logLevel, loggerName) {
   return function(...args) {
     const _name = loggerName ? String(loggerName) : "";
     const prefix = _name ? `[${String(_name).substring(_name.lastIndexOf(":") + 1)}] | ` : "[root] | ";
-    const message = args.map(
+    const message2 = args.map(
       (arg) => typeof arg === "object" ? JSON.stringify(arg) : String(arg)
     ).join(" ");
-    rawMethod(`${prefix}${message}`);
+    rawMethod(`${prefix}${message2}`);
     if (globalThis?.kosConfig?.logging && globalThis.kosLog && (loggerName !== WS_LOG || enableMessageLogging && enableStudioMessageLogging)) {
-      globalThis.kosLog(`UI: ${prefix}${message}`);
+      globalThis.kosLog(`UI: ${prefix}${message2}`);
     }
   };
 };
@@ -1027,11 +1027,11 @@ function createTransitionMethod(_instance, config2, options, entryHandlers, exit
   };
 }
 function handleUninitializedFsm(initializeAt, throwOnInvalid) {
-  const message = `Cannot transition: FSM not initialized. Waiting for ${initializeAt} lifecycle phase.`;
+  const message2 = `Cannot transition: FSM not initialized. Waiting for ${initializeAt} lifecycle phase.`;
   if (throwOnInvalid) {
-    throw new Error(message);
+    throw new Error(message2);
   } else {
-    console.warn(message);
+    console.warn(message2);
   }
 }
 function resolveNextState(currentState, event, config2, throwOnInvalid) {
@@ -1044,11 +1044,11 @@ function resolveNextState(currentState, event, config2, throwOnInvalid) {
   return nextState;
 }
 function handleInvalidTransition(currentState, event, throwOnInvalid) {
-  const message = `Invalid transition: Event "${event}" not allowed from state "${currentState}"`;
+  const message2 = `Invalid transition: Event "${event}" not allowed from state "${currentState}"`;
   if (throwOnInvalid) {
-    throw new Error(message);
+    throw new Error(message2);
   } else {
-    console.warn(message);
+    console.warn(message2);
   }
 }
 function executeTransition(instance, currentState, nextState, event, stateProperty, entryHandlers, exitHandlers, options) {
@@ -1364,8 +1364,8 @@ class ServiceRequestError extends Error {
   responseBody;
   /** Response headers as a plain key/value map */
   responseHeaders;
-  constructor(message, details) {
-    super(message);
+  constructor(message2, details) {
+    super(message2);
     this.name = "ServiceRequestError";
     this.status = details.status;
     this.statusText = details.statusText;
@@ -1668,16 +1668,16 @@ function kosStateGuard(options) {
       const currentState = this.currentState;
       const isAllowed = options.allowedStates.includes(currentState);
       if (!isAllowed) {
-        const message = `Method ${String(
+        const message2 = `Method ${String(
           propertyKey
         )} cannot be called from state "${currentState}". Allowed states: ${options.allowedStates.join(
           ", "
         )}`;
         const shouldThrow = options.throwOnInvalid !== void 0 ? options.throwOnInvalid : this[StateMachineSetup]?.options?.throwOnInvalid !== false;
         if (shouldThrow) {
-          throw new Error(message);
+          throw new Error(message2);
         } else {
-          log$M.warn(message);
+          log$M.warn(message2);
           return void 0;
         }
       }
@@ -1943,9 +1943,9 @@ class ExtensionException extends Error {
   extensionId;
   extensionType;
   cause;
-  constructor(extensionId, extensionType, cause, message) {
+  constructor(extensionId, extensionType, cause, message2) {
     super(
-      message || `Extension failure in ${extensionType} for id "${extensionId}"`
+      message2 || `Extension failure in ${extensionType} for id "${extensionId}"`
     );
     this.name = "ExtensionException";
     this.extensionId = extensionId;
@@ -3393,11 +3393,11 @@ function injectTroubleAwareSupport(modelInstance) {
     get() {
       const pathValue = this[pathProperty];
       if (pathValue === void 0 || pathValue === null) {
-        const message = `@kosTroubleAware: Path property '${pathProperty}' is undefined on model ${this.id || "unknown"}. Returning empty troubles array.`;
+        const message2 = `@kosTroubleAware: Path property '${pathProperty}' is undefined on model ${this.id || "unknown"}. Returning empty troubles array.`;
         if (this.logger && typeof this.logger.warn === "function") {
-          this.logger.warn(message);
+          this.logger.warn(message2);
         } else {
-          console.warn(message);
+          console.warn(message2);
         }
         return [];
       }
@@ -4175,8 +4175,8 @@ class KosModelCache {
 class KosModelError extends Error {
   context;
   originalCause;
-  constructor(message, context, cause) {
-    super(message, { cause });
+  constructor(message2, context, cause) {
+    super(message2, { cause });
     this.name = "KosModelError";
     this.context = context;
     this.originalCause = cause;
@@ -4479,8 +4479,8 @@ const TransitionMap = {
 };
 class ModelError extends Error {
   model;
-  constructor(message, model) {
-    super(message);
+  constructor(message2, model) {
+    super(message2);
     this.model = model;
   }
 }
@@ -5398,10 +5398,19 @@ class KosFSMManager {
     });
   }
   /**
-   * Checks if a given target maps to status or activeStatus
+   * Checks if a given target maps to status, activeStatus, or onlineStatus.
+   * Online/offline transitions are tracked on model.onlineStatus because the
+   * main FSM keeps status at READY when GO_ONLINE / GO_OFFLINE fire; reading
+   * model.status for those targets would hang the transition forever.
    */
   getTransitionStatusFor(target) {
-    return [KosModelState.ACTIVE, KosModelState.INACTIVE].includes(target) ? this.model.activeStatus : this.model.status;
+    if ([KosModelState.ACTIVE, KosModelState.INACTIVE].includes(target)) {
+      return this.model.activeStatus;
+    }
+    if ([KosModelState.ONLINE, KosModelState.OFFLINE].includes(target)) {
+      return this.model.onlineStatus;
+    }
+    return this.model.status;
   }
 }
 const BROWSER_ROUTER_MODEL_TYPE = "browser-router-model";
@@ -5763,6 +5772,7 @@ class KosOnlineLifecycleManager {
   log;
   unsubscribers = [];
   register() {
+    this.dispose();
     const modelId = this.model.modelId;
     const onlineUnsub = subscribe("/kosCore/online", async () => {
       this.log.debug(
@@ -7453,11 +7463,6 @@ class BaseTransport {
   onConnectionLost;
   offlineMessages = [];
   oldSend;
-  // Reconnection configuration
-  reconnectAttempts = 0;
-  static MAX_RECONNECT_ATTEMPTS = 10;
-  static BASE_DELAY_MS = 1e3;
-  static MAX_DELAY_MS = 3e4;
   constructor({
     host,
     port,
@@ -7527,7 +7532,6 @@ class BaseTransport {
   }
   onOpen(event) {
     KosLog.info(`websocket connection opened`);
-    this.reconnectAttempts = 0;
     this.socket = event.currentTarget;
     mobx.runInAction(() => {
       this.connectionEstablished = true;
@@ -7557,26 +7561,8 @@ alias:${this.alias}
       this.connectionEstablished = false;
     });
     publish("websocket.disconnected", { code, reason, wasClean });
-    const shouldReconnect = this.shouldAttemptReconnection(code);
-    if (!this.onConnectionLost) {
-      return;
-    }
-    if (shouldReconnect && this.reconnectAttempts < BaseTransport.MAX_RECONNECT_ATTEMPTS) {
-      const delay2 = this.calculateBackoffDelay();
-      KosLog.debug(
-        `Reconnecting in ${delay2}ms (attempt ${this.reconnectAttempts + 1}/${BaseTransport.MAX_RECONNECT_ATTEMPTS})`
-      );
-      setTimeout(() => {
-        this.reconnectAttempts++;
-        this.onConnectionLost?.();
-      }, delay2);
-    } else if (this.reconnectAttempts >= BaseTransport.MAX_RECONNECT_ATTEMPTS) {
-      KosLog.error(
-        `Max reconnection attempts (${BaseTransport.MAX_RECONNECT_ATTEMPTS}) reached. Giving up.`
-      );
-      publish("websocket.max_retries_exceeded", {
-        attempts: this.reconnectAttempts
-      });
+    if (this.shouldAttemptReconnection(code)) {
+      this.onConnectionLost?.();
     } else {
       KosLog.info(
         `Not reconnecting due to close code ${code} (intentional close or configuration error)`
@@ -7595,7 +7581,7 @@ alias:${this.alias}
   shouldAttemptReconnection(code) {
     switch (code) {
       case 1e3:
-        return false;
+        return true;
       case 1001:
         return true;
       case 1002:
@@ -7628,19 +7614,6 @@ alias:${this.alias}
         return true;
     }
   }
-  /**
-   * Calculates the delay before the next reconnection attempt using
-   * exponential backoff with jitter.
-   * @returns Delay in milliseconds
-   */
-  calculateBackoffDelay() {
-    const exponentialDelay = Math.min(
-      BaseTransport.BASE_DELAY_MS * Math.pow(2, this.reconnectAttempts),
-      BaseTransport.MAX_DELAY_MS
-    );
-    const jitter = exponentialDelay * 0.25 * (Math.random() * 2 - 1);
-    return Math.floor(exponentialDelay + jitter);
-  }
   send(data) {
     KosLog.wsSend(data);
     if (window.kosLogEvents) {
@@ -7701,15 +7674,15 @@ class BridgeTransport {
   }
   sendNextMessage() {
     if (this.messageQueue.length > 0) {
-      const message = this.messageQueue.shift();
-      globalThis.kosWindowWebsocketSend(message);
+      const message2 = this.messageQueue.shift();
+      globalThis.kosWindowWebsocketSend(message2);
       setTimeout(() => this.sendNextMessage(), 1);
     } else {
       this.isSending = false;
     }
   }
-  enqueueMessage(message) {
-    this.messageQueue.push(message);
+  enqueueMessage(message2) {
+    this.messageQueue.push(message2);
     if (!this.isSending) {
       this.isSending = true;
       this.sendNextMessage();
@@ -7864,6 +7837,11 @@ class WebSocketTransport {
   fosSocket;
   fosPort;
   useFosTransport;
+  // Reconnection state (persists across BaseTransport re-creation in init())
+  reconnectAttempts = 0;
+  static MAX_RECONNECT_ATTEMPTS = 10;
+  static BASE_DELAY_MS = 1e3;
+  static MAX_DELAY_MS = 3e4;
   constructor({
     host = `localhost`,
     port = 8080,
@@ -7896,6 +7874,7 @@ class WebSocketTransport {
       (connectionEstablished) => {
         if (connectionEstablished) {
           log$z.warn("Connection Established");
+          this.reconnectAttempts = 0;
           publish(
             WebSocketEvents.CONNECTED,
             WebSocketEvents.CONNECTED
@@ -7946,11 +7925,7 @@ class WebSocketTransport {
       alias: this.alias,
       onConnectionLost: () => {
         log$z.error(`Connection Lost`);
-        publish(
-          WebSocketEvents.DISCONNECTED,
-          WebSocketEvents.DISCONNECTED
-        );
-        this.init();
+        this.scheduleReconnect();
       }
     });
     if (globalThis.kosWindowWebsocketOpen) {
@@ -7961,6 +7936,39 @@ class WebSocketTransport {
     }
     return this;
   }
+  /**
+   * Schedules a reconnect attempt using exponential backoff with jitter.
+   * Counter persists across BaseTransport re-creation, so the cap actually
+   * fires after MAX_RECONNECT_ATTEMPTS consecutive failures rather than
+   * resetting on every new BaseTransport instance.
+   */
+  scheduleReconnect() {
+    if (this.reconnectAttempts >= WebSocketTransport.MAX_RECONNECT_ATTEMPTS) {
+      KosLog.error(
+        `Max reconnection attempts (${WebSocketTransport.MAX_RECONNECT_ATTEMPTS}) reached. Giving up.`
+      );
+      publish(WebSocketEvents.MAX_RETRIES_EXCEEDED, {
+        attempts: this.reconnectAttempts
+      });
+      return;
+    }
+    const delay2 = this.calculateBackoffDelay();
+    KosLog.debug(
+      `Reconnecting in ${delay2}ms (attempt ${this.reconnectAttempts + 1}/${WebSocketTransport.MAX_RECONNECT_ATTEMPTS})`
+    );
+    setTimeout(() => {
+      this.reconnectAttempts++;
+      this.init();
+    }, delay2);
+  }
+  calculateBackoffDelay() {
+    const exponentialDelay = Math.min(
+      WebSocketTransport.BASE_DELAY_MS * Math.pow(2, this.reconnectAttempts),
+      WebSocketTransport.MAX_DELAY_MS
+    );
+    const jitter = exponentialDelay * 0.25 * (Math.random() * 2 - 1);
+    return Math.floor(exponentialDelay + jitter);
+  }
   _sendSubscriptionMessage(topic, type, fos = false, bridge = false, connectionId, explicitDestination = false) {
     log$z.debug(`${type} to topic ${topic}`);
     let connId;
@@ -10014,13 +10022,33 @@ class KosCore {
         this.transport.token = data.body;
       }
     });
+    subscribe(WebSocketEvents.DISCONNECTED, async () => {
+      await Promise.allSettled(
+        this.modelManager.models.map(async (model) => {
+          try {
+            await model.offline?.();
+          } catch (e) {
+            log$v.error(`model ${model.modelId} offline() threw:`, e);
+          }
+          model.onlineLifecycleManager?.dispose();
+        })
+      );
+      this.fsmService.service.send(KosCoreEvents.GO_OFFLINE);
+    });
     subscribe(WebSocketEvents.CONNECTED, async () => {
       await this.whenReady();
+      await Promise.allSettled(
+        this.modelManager.models.map(async (model) => {
+          model.onlineLifecycleManager?.register();
+          try {
+            await model.online?.();
+          } catch (e) {
+            log$v.error(`model ${model.modelId} online() threw:`, e);
+          }
+        })
+      );
       this.fsmService.service.send(KosCoreEvents.GO_ONLINE);
     });
-    subscribe(WebSocketEvents.DISCONNECTED, async () => {
-      this.fsmService.service.send(KosCoreEvents.GO_OFFLINE);
-    });
     subscribe("/studioServer/auth/LOGGED_IN", () => {
       this.authState = "logged_in";
       this.transport.authorized = true;
@@ -11073,8 +11101,8 @@ const getModelById = (destinationAddress2, url, _fetch) => async ({
 };
 class FetchError extends Error {
   payload;
-  constructor(message, payload) {
-    super(message);
+  constructor(message2, payload) {
+    super(message2);
     this.name = "FetchException";
     this.payload = payload;
   }
@@ -12178,21 +12206,21 @@ async function waitForAppsToStart(appIds, options = {}) {
       return false;
     });
     if (notStartedApps.length > 0) {
-      const message = `Apps not started: ${notStartedApps.join(", ")}`;
-      log$q.error(message);
+      const message2 = `Apps not started: ${notStartedApps.join(", ")}`;
+      log$q.error(message2);
       if (throwOnTimeout) {
-        throw new Error(`App startup timeout: ${message}`);
+        throw new Error(`App startup timeout: ${message2}`);
       }
       return false;
     }
     log$q.info(`All apps started successfully: ${appIds.join(", ")}`);
     return true;
   } catch (error) {
-    const message = `Failed to wait for apps to start: ${appIds.join(", ")}`;
-    log$q.error(message, error);
+    const message2 = `Failed to wait for apps to start: ${appIds.join(", ")}`;
+    log$q.error(message2, error);
     if (throwOnTimeout) {
       throw new Error(
-        `${message} - ${error instanceof Error ? error.message : String(error)}`
+        `${message2} - ${error instanceof Error ? error.message : String(error)}`
       );
     }
     return false;
@@ -12368,14 +12396,14 @@ const buildConfigBeanModel = (factory) => (modelId) => (configBeanOptions) => {
   const configBeanModel = factory.build(modelId, configBeanOptions);
   return configBeanModel;
 };
-var __defProp$u = Object.defineProperty;
+var __defProp$v = Object.defineProperty;
 var __getOwnPropDesc$A = Object.getOwnPropertyDescriptor;
 var __decorateClass$A = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$A(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$u(target, key, result);
+  if (kind && result) __defProp$v(target, key, result);
   return result;
 };
 function matchValue(patterns, value) {
@@ -12735,14 +12763,14 @@ function defaultMeasureMapReducer(systemAcc, unitSystem) {
   });
   return systemAcc;
 }
-var __defProp$t = Object.defineProperty;
+var __defProp$u = Object.defineProperty;
 var __getOwnPropDesc$z = Object.getOwnPropertyDescriptor;
 var __decorateClass$z = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$z(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$t(target, key, result);
+  if (kind && result) __defProp$u(target, key, result);
   return result;
 };
 const MODEL_TYPE$w = "region-info-model";
@@ -13347,14 +13375,14 @@ const displayOptionsFactory = (schema, unitSystem) => {
   }
   return schema.options;
 };
-var __defProp$s = Object.defineProperty;
+var __defProp$t = Object.defineProperty;
 var __getOwnPropDesc$y = Object.getOwnPropertyDescriptor;
 var __decorateClass$y = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$y(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$s(target, key, result);
+  if (kind && result) __defProp$t(target, key, result);
   return result;
 };
 function isEnum(schema) {
@@ -14191,14 +14219,14 @@ const index$e = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   __proto__: null,
   getStateBeanData
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$r = Object.defineProperty;
+var __defProp$s = Object.defineProperty;
 var __getOwnPropDesc$x = Object.getOwnPropertyDescriptor;
 var __decorateClass$x = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$x(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$r(target, key, result);
+  if (kind && result) __defProp$s(target, key, result);
   return result;
 };
 const MODEL_TYPE$u = "state-bean-model";
@@ -14296,14 +14324,14 @@ const kosStateBean = ({ path }) => (target, name) => {
     lifecycle: DependencyLifecycle.INIT
   };
 };
-var __defProp$q = Object.defineProperty;
+var __defProp$r = Object.defineProperty;
 var __getOwnPropDesc$w = Object.getOwnPropertyDescriptor;
 var __decorateClass$w = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$w(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$q(target, key, result);
+  if (kind && result) __defProp$r(target, key, result);
   return result;
 };
 const MODEL_TYPE$t = "state-prop-model";
@@ -14402,14 +14430,14 @@ function kosStateProp(params2) {
     };
   };
 }
-var __defProp$p = Object.defineProperty;
+var __defProp$q = Object.defineProperty;
 var __getOwnPropDesc$v = Object.getOwnPropertyDescriptor;
 var __decorateClass$v = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$v(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$p(target, key, result);
+  if (kind && result) __defProp$q(target, key, result);
   return result;
 };
 const MODEL_TYPE$s = "browser-router-model";
@@ -14529,14 +14557,14 @@ const BrowserRouter = new SingletonKosModelRegistrationFactory({
   class: BrowserRouterModelImpl,
   type: MODEL_TYPE$s
 });
-var __defProp$o = Object.defineProperty;
+var __defProp$p = Object.defineProperty;
 var __getOwnPropDesc$u = Object.getOwnPropertyDescriptor;
 var __decorateClass$u = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$u(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$o(target, key, result);
+  if (kind && result) __defProp$p(target, key, result);
   return result;
 };
 const log$i = KosLog.getLogger(FutureFactory.type);
@@ -14600,7 +14628,10 @@ let FutureModel$1 = class FutureModel {
   async cancelFuture() {
     const path = this.namespace === "studio" ? `/api/future` : `/api/${this.namespace}/future`;
     await kosWhen(() => this.futureId !== FUTURE_NOT_ASSIGNED);
-    await this._cancelFuture(this.futureId, path);
+    const response = await this._cancelFuture(this.futureId, path);
+    if (response?.status !== 200) {
+      log$i.error(`Failed to cancel Future ${this.id}. Response: ${JSON.stringify(response)}`);
+    }
   }
   /**
    * Gets the current status of the future operation.
@@ -14674,14 +14705,14 @@ FutureModel$1 = __decorateClass$u([
   kosModel(FutureFactory.type)
 ], FutureModel$1);
 const FutureModel2 = FutureModel$1;
-var __defProp$n = Object.defineProperty;
+var __defProp$o = Object.defineProperty;
 var __getOwnPropDesc$t = Object.getOwnPropertyDescriptor;
 var __decorateClass$t = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$t(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$n(target, key, result);
+  if (kind && result) __defProp$o(target, key, result);
   return result;
 };
 const log$h = KosLog.getLogger(FutureContainerFactory.type);
@@ -14906,14 +14937,14 @@ const index$c = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   getKeyValue,
   updateKeyValue
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$m = Object.defineProperty;
+var __defProp$n = Object.defineProperty;
 var __getOwnPropDesc$s = Object.getOwnPropertyDescriptor;
 var __decorateClass$s = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$s(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$m(target, key, result);
+  if (kind && result) __defProp$n(target, key, result);
   return result;
 };
 const MODEL_TYPE$r = "key-value-model";
@@ -16603,9 +16634,9 @@ Parser.prototype.isOperatorEnabled = function(op) {
   var operators = this.options.operators || {};
   return !(optionName in operators) || !!operators[optionName];
 };
-var __defProp$l = Object.defineProperty;
+var __defProp$m = Object.defineProperty;
 var __getOwnPropDesc$r = Object.getOwnPropertyDescriptor;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __decorateClass$r = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$r(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
@@ -16961,14 +16992,14 @@ const index$b = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   __proto__: null,
   getLogOverrides
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$k = Object.defineProperty;
+var __defProp$l = Object.defineProperty;
 var __getOwnPropDesc$q = Object.getOwnPropertyDescriptor;
 var __decorateClass$q = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$q(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$k(target, key, result);
+  if (kind && result) __defProp$l(target, key, result);
   return result;
 };
 const MODEL_TYPE$p = "kos-log-manager-model";
@@ -17215,14 +17246,14 @@ const index$a = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   setTime,
   setTimezone
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$j = Object.defineProperty;
+var __defProp$k = Object.defineProperty;
 var __getOwnPropDesc$p = Object.getOwnPropertyDescriptor;
 var __decorateClass$p = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$p(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$j(target, key, result);
+  if (kind && result) __defProp$k(target, key, result);
   return result;
 };
 const MODEL_TYPE$o = "kos-time-model";
@@ -17316,14 +17347,14 @@ const KosTime = {
   predicate: isKosModel(MODEL_TYPE$o),
   factory: Kos.Singleton.create(MODEL_TYPE$o)
 };
-var __defProp$i = Object.defineProperty;
+var __defProp$j = Object.defineProperty;
 var __getOwnPropDesc$o = Object.getOwnPropertyDescriptor;
 var __decorateClass$o = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$o(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$i(target, key, result);
+  if (kind && result) __defProp$j(target, key, result);
   return result;
 };
 const MODEL_TYPE$n = "log-block-container-model";
@@ -17557,14 +17588,14 @@ const LogBlockContainer = new KosModelRegistrationFactory({
   type: MODEL_TYPE$n
 });
 LogBlockContainer.addRelatedModel(LogBlock);
-var __defProp$h = Object.defineProperty;
+var __defProp$i = Object.defineProperty;
 var __getOwnPropDesc$m = Object.getOwnPropertyDescriptor;
 var __decorateClass$m = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$m(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$h(target, key, result);
+  if (kind && result) __defProp$i(target, key, result);
   return result;
 };
 const MODEL_TYPE$l = "log-stream-model";
@@ -17785,14 +17816,14 @@ const LogStream = new KosModelRegistrationFactory({
   class: LogStreamModelImpl,
   type: MODEL_TYPE$l
 });
-var __defProp$g = Object.defineProperty;
+var __defProp$h = Object.defineProperty;
 var __getOwnPropDesc$l = Object.getOwnPropertyDescriptor;
 var __decorateClass$l = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$l(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$g(target, key, result);
+  if (kind && result) __defProp$h(target, key, result);
   return result;
 };
 const MODEL_TYPE$k = "log-stream-container-model";
@@ -18187,14 +18218,14 @@ class TroubleHandlerFactory {
     }
   }
 }
-var __defProp$f = Object.defineProperty;
+var __defProp$g = Object.defineProperty;
 var __getOwnPropDesc$k = Object.getOwnPropertyDescriptor;
 var __decorateClass$k = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$k(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$f(target, key, result);
+  if (kind && result) __defProp$g(target, key, result);
   return result;
 };
 const MODEL_TYPE$j = "trouble-model";
@@ -18349,18 +18380,29 @@ const Trouble = {
   predicate: isKosModel(MODEL_TYPE$j),
   factory: Kos.Factory.create(MODEL_TYPE$j)
 };
-var __defProp$e = Object.defineProperty;
+var __defProp$f = Object.defineProperty;
 var __getOwnPropDesc$j = Object.getOwnPropertyDescriptor;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __decorateClass$j = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$j(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$e(target, key, result);
+  if (kind && result) __defProp$f(target, key, result);
   return result;
 };
 var __publicField$4 = (obj, key, value) => __defNormalProp$4(obj, key + "", value);
+const addTrouble = (trouble) => {
+  const options = {
+    ...trouble,
+    rank: troubleRankMapper(trouble),
+    color: troubleColorMapper(trouble),
+    role: troubleRoleMapper(trouble),
+    id: String(trouble.id)
+  };
+  const newTrouble = Trouble.factory(`trouble-${trouble.id}`)(options);
+  return newTrouble;
+};
 function troubleRankMapper(trouble) {
   const _rank = ExtensionManager.propertyMapper.hasMapper(
     KosCoreModelPropertyMapper.TroubleRank
@@ -18405,6 +18447,16 @@ let TroubleContainerModelImpl = class {
     this.servicePath = options.servicePath ?? this.servicePath;
   }
   // -------------------LIFECYCLE----------------------------
+  async reload() {
+    this.logger.info("reloading trouble container");
+    const _troubles = await getTroubles(this.servicePath);
+    const incoming = _troubles?.data ?? [];
+    const incomingKeys = new Set(incoming.map((t) => `trouble-${t.id}`));
+    const toRemove = this.troubles.data.map((m) => m.id).filter((id) => !incomingKeys.has(id));
+    const toAdd = incoming.filter((t) => !this.troubles.getModel(`trouble-${t.id}`)).map(addTrouble);
+    this.troubles.removeAll(toRemove);
+    this.troubles.addAll(toAdd);
+  }
   async load() {
     this.logger.debug("loading trouble container");
     try {
@@ -18504,14 +18556,14 @@ const getArtifacts = async () => {
   log$c.debug("getArtifacts - response:", response);
   return response?.data;
 };
-var __defProp$d = Object.defineProperty;
+var __defProp$e = Object.defineProperty;
 var __getOwnPropDesc$i = Object.getOwnPropertyDescriptor;
 var __decorateClass$i = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$d(target, key, result);
+  if (kind && result) __defProp$e(target, key, result);
   return result;
 };
 const MODEL_TYPE$h = "ota-model";
@@ -18710,14 +18762,14 @@ function encodeFrame(rgba, format, stripAlpha) {
     return btoa(String.fromCharCode(...rgb));
   }
 }
-var __defProp$c = Object.defineProperty;
+var __defProp$d = Object.defineProperty;
 var __getOwnPropDesc$h = Object.getOwnPropertyDescriptor;
 var __decorateClass$h = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$c(target, key, result);
+  if (kind && result) __defProp$d(target, key, result);
   return result;
 };
 const MODEL_TYPE$g = "canvas-renderer-model";
@@ -20755,14 +20807,14 @@ const getRenderer = ({
   }
   throw new Error(`Unknown mode: ${mode}`);
 };
-var __defProp$b = Object.defineProperty;
+var __defProp$c = Object.defineProperty;
 var __getOwnPropDesc$g = Object.getOwnPropertyDescriptor;
 var __decorateClass$g = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$b(target, key, result);
+  if (kind && result) __defProp$c(target, key, result);
   return result;
 };
 const MODEL_TYPE$f = "canvas-dispatcher-model";
@@ -20975,14 +21027,14 @@ const index$6 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   getDeviceDetails,
   getSerialNumber
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$a = Object.defineProperty;
+var __defProp$b = Object.defineProperty;
 var __getOwnPropDesc$f = Object.getOwnPropertyDescriptor;
 var __decorateClass$f = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$a(target, key, result);
+  if (kind && result) __defProp$b(target, key, result);
   return result;
 };
 const MODEL_TYPE$e = "device-model";
@@ -21322,14 +21374,14 @@ const index$5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   __proto__: null,
   getNetworkInterfaces
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$9 = Object.defineProperty;
+var __defProp$a = Object.defineProperty;
 var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
 var __decorateClass$d = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$9(target, key, result);
+  if (kind && result) __defProp$a(target, key, result);
   return result;
 };
 const MODEL_TYPE$c = "network-interface-container-model";
@@ -21513,14 +21565,14 @@ const StorageDevice = new KosModelRegistrationFactory({
   class: StorageDeviceModelImpl,
   type: MODEL_TYPE$b
 });
-var __defProp$8 = Object.defineProperty;
+var __defProp$9 = Object.defineProperty;
 var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
 var __decorateClass$b = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$8(target, key, result);
+  if (kind && result) __defProp$9(target, key, result);
   return result;
 };
 const MODEL_TYPE$a = "storage-device-container-model";
@@ -21658,14 +21710,14 @@ const index$3 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePrope
   getAvailableUpdates,
   installUpdate
 }, Symbol.toStringTag, { value: "Module" }));
-var __defProp$7 = Object.defineProperty;
+var __defProp$8 = Object.defineProperty;
 var __getOwnPropDesc$a = Object.getOwnPropertyDescriptor;
 var __decorateClass$a = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$7(target, key, result);
+  if (kind && result) __defProp$8(target, key, result);
   return result;
 };
 const MODEL_TYPE$9 = "usb-update-model";
@@ -21731,14 +21783,14 @@ const UsbUpdate = new KosModelRegistrationFactory({
   class: UsbUpdateModelImpl,
   type: MODEL_TYPE$9
 });
-var __defProp$6 = Object.defineProperty;
+var __defProp$7 = Object.defineProperty;
 var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
 var __decorateClass$9 = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp$6(target, key, result);
+  if (kind && result) __defProp$7(target, key, result);
   return result;
 };
 const MODEL_TYPE$8 = "usb-update-container-model";
@@ -21905,12 +21957,14 @@ const getKosLocalizationDescriptor = (context) => async () => {
   return response.data[context];
 };
 const CONTEXT_LANG_RESOLVER = "langResolver";
+var __defProp$6 = Object.defineProperty;
 var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
 var __decorateClass$8 = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
-      result = decorator(result) || result;
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp$6(target, key, result);
   return result;
 };
 const MODEL_TYPE$7 = "translation-model";
@@ -22177,17 +22231,16 @@ let TranslationModelImpl = class {
    */
   async ready() {
     this.logger.debug(`ready translation ${this.id}`);
-    this.disposer = mobx.reaction(
-      () => this.currentLocale,
-      (value, previous) => {
-        this.logger.info(
-          `translation langs for namespace ${this.id} changed from ${previous} to ${value}`
-        );
-        this.loadTranslations();
-      }
-    );
+  }
+  async handleCurrentLocaleChange() {
+    await this.loadTranslations();
   }
 };
+__decorateClass$8([
+  kosModelEffect({
+    dependencies: (model) => [model.currentLocale]
+  })
+], TranslationModelImpl.prototype, "handleCurrentLocaleChange", 1);
 TranslationModelImpl = __decorateClass$8([
   kosParentAware(),
   kosModel(MODEL_TYPE$7)
@@ -23771,11 +23824,11 @@ const loadingDot = react.css`
 `;
 const Portal = ({ children }) => reactDom.createPortal(children, document.body);
 function LoadingMessage({
-  message = "Wait a moment while we load your app.",
+  message: message2 = "Wait a moment while we load your app.",
   theme = "light"
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(MessageContainer, { theme, children: [
-    message,
+    message2,
     /* @__PURE__ */ jsxRuntime.jsx("div", { css: loadingDot, children: "." })
   ] }) });
 }
@@ -23975,32 +24028,6 @@ const KosModelLoaderDisplay = (props) => {
   const loader = props.loading || /* @__PURE__ */ jsxRuntime.jsx(DefaultLoader, {});
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: model && isReady ? props.children : loader });
 };
-const DEFAULT_TRANSLATIONS = {
-  header: {
-    title: "Model",
-    createLabel: "Create new Model",
-    deleteLabel: "Delete"
-  },
-  createModal: {
-    okText: "OK",
-    cancelText: "Cancel",
-    title: "Create New Model"
-  }
-};
-const CreateModelTranslationsContext = React.createContext(DEFAULT_TRANSLATIONS);
-const CreateModelTranslationsProvider = ({
-  translations = DEFAULT_TRANSLATIONS,
-  children
-}) => {
-  const merged = {
-    header: { ...DEFAULT_TRANSLATIONS.header, ...translations.header },
-    createModal: {
-      ...DEFAULT_TRANSLATIONS.createModal,
-      ...translations.createModal
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(CreateModelTranslationsContext.Provider, { value: merged, children });
-};
 function fetchKosCore(registration, alias) {
   const kosCore = KosCore.create(registration, false, alias);
   const promise = kosCore.whenReady().then(() => kosCore);
@@ -24020,7 +24047,11 @@ const initKosProvider = (registration = { models: {}, preloadModels: [] }, alias
         disposer();
       };
     }, [kosCore]);
-    return /* @__PURE__ */ jsxRuntime.jsx(KosContext.Provider, { value: { kosCore, online }, children });
+    const value = React.useMemo(
+      () => ({ kosCore, online }),
+      [kosCore, online]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(KosContext.Provider, { value, children });
   };
   return { KosCoreContextProvider: mobxReactLite.observer(KosCoreContextProvider) };
 };
@@ -24031,6 +24062,202 @@ const useKosCore = () => {
   }
   return context;
 };
+const KOS_RECOVERING_SESSION_KEY = "kos:recovering";
+const DEFAULT_GRACE_MS = 3e3;
+const defaultReloadFn = () => {
+  window.location.reload();
+};
+const ReloadOnDisconnectPolicy = ({
+  graceMs = DEFAULT_GRACE_MS,
+  onBeforeReload,
+  reloadFn = defaultReloadFn
+}) => {
+  const pendingReloadRef = React.useRef(null);
+  React.useEffect(() => {
+    const { unsubscribe } = subscribe(
+      WebSocketEvents.DISCONNECTED,
+      (msg) => {
+        if (pendingReloadRef.current) {
+          return;
+        }
+        const payload = msg?.body;
+        if (!payload || typeof payload.code !== "number") {
+          return;
+        }
+        const info = {
+          code: payload.code,
+          reason: payload.reason,
+          wasClean: payload.wasClean,
+          at: Date.now()
+        };
+        try {
+          sessionStorage.setItem(
+            KOS_RECOVERING_SESSION_KEY,
+            JSON.stringify(info)
+          );
+        } catch (err) {
+          KosLog.warn(
+            "ReloadOnDisconnectPolicy: failed to write sessionStorage",
+            err
+          );
+        }
+        KosLog.warn(
+          `ReloadOnDisconnectPolicy: scheduling reload in ${graceMs}ms (code=${info.code}, wasClean=${info.wasClean})`
+        );
+        pendingReloadRef.current = setTimeout(() => {
+          pendingReloadRef.current = null;
+          try {
+            onBeforeReload?.(info);
+          } catch (err) {
+            KosLog.error(
+              "ReloadOnDisconnectPolicy: onBeforeReload threw",
+              err
+            );
+          }
+          reloadFn();
+        }, graceMs);
+      }
+    );
+    return () => {
+      unsubscribe();
+      if (pendingReloadRef.current) {
+        clearTimeout(pendingReloadRef.current);
+        pendingReloadRef.current = null;
+      }
+    };
+  }, [graceMs, onBeforeReload, reloadFn]);
+  return null;
+};
+const defaultIsReady = ({ online }) => online;
+const readRecoveringInfo = () => {
+  try {
+    const raw = sessionStorage.getItem(KOS_RECOVERING_SESSION_KEY);
+    if (!raw) return null;
+    sessionStorage.removeItem(KOS_RECOVERING_SESSION_KEY);
+    const parsed = JSON.parse(raw);
+    if (parsed && typeof parsed === "object" && typeof parsed.code === "number") {
+      return parsed;
+    }
+  } catch {
+  }
+  return null;
+};
+const useReconnectingOverlayState = (options = {}) => {
+  const { isReady = defaultIsReady, readSessionStorage = true } = options;
+  const { online } = useKosCore();
+  const [info, setInfo] = React.useState(
+    () => readSessionStorage ? readRecoveringInfo() : null
+  );
+  const [dismissed, setDismissed] = React.useState(false);
+  React.useEffect(() => {
+    const { unsubscribe } = subscribe(
+      WebSocketEvents.DISCONNECTED,
+      (msg) => {
+        const payload = msg?.body;
+        if (!payload || typeof payload.code !== "number") return;
+        setInfo({
+          code: payload.code,
+          reason: payload.reason,
+          wasClean: payload.wasClean,
+          at: Date.now()
+        });
+        setDismissed(false);
+      }
+    );
+    return () => {
+      unsubscribe();
+    };
+  }, []);
+  const ready = isReady({ online, info });
+  const visible = !dismissed && !!info && !ready;
+  return {
+    visible,
+    info,
+    sinceMs: info ? Date.now() - info.at : null,
+    dismiss: () => setDismissed(true)
+  };
+};
+const spin = react.keyframes`
+  to { transform: rotate(360deg); }
+`;
+const overlayRoot = react.css`
+  position: fixed;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+  background: rgba(0, 0, 0, 0.72);
+  color: #ffffff;
+  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
+  z-index: 2147483647;
+  pointer-events: auto;
+  user-select: none;
+`;
+const spinner = react.css`
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  border: 4px solid rgba(255, 255, 255, 0.25);
+  border-top-color: #ffffff;
+  animation: ${spin} 1s linear infinite;
+`;
+const message = react.css`
+  font-size: 18px;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+`;
+const ReconnectingOverlay = ({
+  messageText = "Reconnecting…",
+  renderContent,
+  className,
+  isReady,
+  readSessionStorage
+}) => {
+  const state = useReconnectingOverlayState({ isReady, readSessionStorage });
+  if (!state.visible) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      css: overlayRoot,
+      className,
+      role: "alertdialog",
+      "aria-live": "assertive",
+      "aria-label": "Reconnecting",
+      children: renderContent ? renderContent(state) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { css: spinner, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { css: message, children: messageText })
+      ] })
+    }
+  );
+};
+const DEFAULT_TRANSLATIONS = {
+  header: {
+    title: "Model",
+    createLabel: "Create new Model",
+    deleteLabel: "Delete"
+  },
+  createModal: {
+    okText: "OK",
+    cancelText: "Cancel",
+    title: "Create New Model"
+  }
+};
+const CreateModelTranslationsContext = React.createContext(DEFAULT_TRANSLATIONS);
+const CreateModelTranslationsProvider = ({
+  translations = DEFAULT_TRANSLATIONS,
+  children
+}) => {
+  const merged = {
+    header: { ...DEFAULT_TRANSLATIONS.header, ...translations.header },
+    createModal: {
+      ...DEFAULT_TRANSLATIONS.createModal,
+      ...translations.createModal
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(CreateModelTranslationsContext.Provider, { value: merged, children });
+};
 const MAX_RETRIES = 8;
 const waitForRetry = (depth = 0) => new Promise((resolve) => {
   setTimeout(() => {
@@ -24269,11 +24496,13 @@ const KosTranslationProvider = ({
   locale = "en",
   resolver,
   rootUrl,
-  descriptorResolver
+  descriptorResolver,
+  excludeNamespaces = []
 }) => {
   const [ready, setReady] = React.useState(false);
   const [localization, setLocalization] = React.useState();
   const [translations, setTranslations] = React.useState();
+  const [allLocales, setAllLocales] = React.useState([]);
   const resolvedRootUrl = rootUrl || getDefaultHost();
   const _appContext = React.useMemo(() => appContext ?? "app/system", [appContext]);
   React.useEffect(() => {
@@ -24303,6 +24532,24 @@ const KosTranslationProvider = ({
         };
       }, {});
       setLocalization(localizationDescriptor);
+      const _allLocales = descriptors.reduce((acc, curr) => {
+        Object.keys(curr.namespaces).filter((ns) => !excludeNamespaces.includes(ns)).forEach((namespaceKey) => {
+          const namespace = curr.namespaces[namespaceKey];
+          Object.keys(namespace.locales).forEach((localeKey) => {
+            acc.add(localeKey);
+          });
+        });
+        return acc;
+      }, /* @__PURE__ */ new Set());
+      const localeList = Array.from(_allLocales).map((locale2) => {
+        return {
+          locale: locale2,
+          label: new Intl.DisplayNames([locale2], { type: "language" }).of(
+            locale2
+          )
+        };
+      });
+      setAllLocales(localeList);
     }
     initTools();
   }, [_appContext, descriptorResolver]);
@@ -24330,13 +24577,15 @@ const KosTranslationProvider = ({
           if (translations) {
             translations.currentLocale = locale2;
           }
-        }
+        },
+        allLocales
       };
     }
     return {
       setLocale: () => {
         throw new Error("Translations not ready");
-      }
+      },
+      allLocales: []
     };
   }, [ready, translations]);
   const content = ready ? children : null;
@@ -25059,6 +25308,36 @@ const useConfigProperty = ({
     error
   };
 };
+const useConnectionState = () => {
+  const { online } = useKosCore();
+  const [lastDisconnect, setLastDisconnect] = React.useState(
+    null
+  );
+  React.useEffect(() => {
+    const { unsubscribe } = subscribe(
+      WebSocketEvents.DISCONNECTED,
+      (msg) => {
+        const payload = msg?.body;
+        if (payload && typeof payload === "object" && typeof payload.code === "number") {
+          setLastDisconnect({
+            code: payload.code,
+            reason: payload.reason,
+            wasClean: payload.wasClean,
+            at: Date.now()
+          });
+        }
+      }
+    );
+    return () => {
+      unsubscribe();
+    };
+  }, []);
+  return {
+    online,
+    lastDisconnect,
+    sinceLastDisconnectMs: lastDisconnect ? Date.now() - lastDisconnect.at : null
+  };
+};
 function getDaysInMonth(month, year) {
   const yearToUse = year ?? (/* @__PURE__ */ new Date()).getFullYear();
   const daysInEachMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
@@ -26204,6 +26483,7 @@ exports.HEADER_WORK_TRACKER = HEADER_WORK_TRACKER;
 exports.HttpRouteHandlers = HttpRouteHandlers;
 exports.KOS_EXECUTION_CONTEXT = KOS_EXECUTION_CONTEXT;
 exports.KOS_MODEL_ID = KOS_MODEL_ID;
+exports.KOS_RECOVERING_SESSION_KEY = KOS_RECOVERING_SESSION_KEY;
 exports.KOS_SERVICE = service$4;
 exports.KOS_SERVICE_1_6_5 = service$6;
 exports.KOS_SERVICE_1_8_1 = service$5;
@@ -26294,12 +26574,14 @@ exports.PROFILE_TOOLS_PREVIEW = PROFILE_TOOLS_PREVIEW;
 exports.ParentModel = ParentModel;
 exports.PluginExtensionManager = PluginExtensionManager;
 exports.ProgressBar = ProgressBar;
+exports.ReconnectingOverlay = ReconnectingOverlay;
 exports.ReferenceConfig = ReferenceConfig;
 exports.RegionInfo = Registration$1;
 exports.RegionServices = index$f;
 exports.RegistrationManager = RegistrationManager;
 exports.Registry = Registry;
 exports.ReloadAwareSetup = ReloadAwareSetup;
+exports.ReloadOnDisconnectPolicy = ReloadOnDisconnectPolicy;
 exports.ReplayStrategy = ReplayStrategy;
 exports.ResponseRetention = ResponseRetention;
 exports.STATUS = STATUS;
@@ -26579,6 +26861,7 @@ exports.useAmPmValues = useAmPmValues;
 exports.useCalendarDayArray = useCalendarDayArray;
 exports.useConfigBean = useConfigBean;
 exports.useConfigProperty = useConfigProperty;
+exports.useConnectionState = useConnectionState;
 exports.useContextModel = useContextModel;
 exports.useContextModelHierarchy = useContextModelHierarchy;
 exports.useDateArrays = useDateArrays;
@@ -26612,6 +26895,7 @@ exports.useNetworkInterfaceContainer = useNetworkInterfaceContainer;
 exports.useOta = useOta;
 exports.usePressGesture = usePressGesture;
 exports.useProjectReload = useProjectReload;
+exports.useReconnectingOverlayState = useReconnectingOverlayState;
 exports.useRegionTimeProps = useRegionTimeProps;
 exports.useRegionalTimeDate = useRegionalTimeDate;
 exports.useSoftwareInfo = useSoftwareInfo;