dara-core 1.16.20__py3-none-any.whl → 1.16.21__py3-none-any.whl

dara/core/umd/dara.core.umd.js

@@ -33,7 +33,7 @@ var __privateWrapper = (obj, member, setter, getter) => ({
 (function(global2, factory) {
   typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("@tanstack/react-query"), require("react-dom"), require("styled-components")) : typeof define === "function" && define.amd ? define(["exports", "react", "@tanstack/react-query", "react-dom", "styled-components"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory((global2.dara = global2.dara || {}, global2.dara.core = {}), global2.React, global2.ReactQuery, global2.ReactDOM, global2.styled));
 })(this, function(exports, React, reactQuery, ReactDOM, styled) {
-  var _locks, _subscribers, _events$, _parentBus, _pingInterval, _socketUrl, _reconnectCount, _instance, _observers;
+  var _locks, _subscribers, _pingInterval, _socketUrl, _reconnectCount, _events$, _parentBus, _instance, _observers;
   "use strict";
   const _interopDefaultLegacy = (e2) => e2 && typeof e2 === "object" && "default" in e2 ? e2 : { default: e2 };
   function _interopNamespace(e2) {
@@ -4936,14 +4936,14 @@ var __privateWrapper = (obj, member, setter, getter) => ({
     useEffect: useEffect$1$1,
     useRef: useRef$2$1
   } = React__default.default;
-  function usePrevious$1(value) {
+  function usePrevious$2(value) {
     const ref = useRef$2$1();
     useEffect$1$1(() => {
       ref.current = value;
     });
     return ref.current;
   }
-  var Recoil_usePrevious$1 = usePrevious$1;
+  var Recoil_usePrevious$1 = usePrevious$2;
   const {
     useStoreRef: useStoreRef$1
   } = Recoil_RecoilRoot;
@@ -11897,14 +11897,14 @@ var __privateWrapper = (obj, member, setter, getter) => ({
     useEffect: useEffect$2,
     useRef: useRef$2
   } = React__default.default;
-  function usePrevious(value) {
+  function usePrevious$1(value) {
     const ref = useRef$2();
     useEffect$2(() => {
       ref.current = value;
     });
     return ref.current;
   }
-  var Recoil_usePrevious = usePrevious;
+  var Recoil_usePrevious = usePrevious$1;
   const {
     DefaultValue: DefaultValue$2
   } = Recoil_index;
@@ -50034,12 +50034,26 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     localStorage.setItem(getTokenKey(), token);
     return token;
   }
+  function useSession(body = {}) {
+    return reactQuery.useQuery({
+      queryFn: async () => {
+        return requestSessionToken(body);
+      },
+      queryKey: ["session"],
+      refetchOnMount: false
+    });
+  }
   async function verifySessionToken() {
     const res = await request("/api/auth/verify-session", {
       method: HTTP_METHOD.POST
     });
     return res.ok;
   }
+  var AuthType = /* @__PURE__ */ ((AuthType2) => {
+    AuthType2["BASIC"] = "BASIC";
+    AuthType2["SSO"] = "SSO";
+    return AuthType2;
+  })(AuthType || {});
   var ComponentType = /* @__PURE__ */ ((ComponentType2) => {
     ComponentType2["JS"] = "js";
     ComponentType2["PY"] = "py";
@@ -51143,6 +51157,7 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
   const atomRegistry = /* @__PURE__ */ new Map();
   const atomFamilyRegistry = /* @__PURE__ */ new Map();
   const atomFamilyMembersRegistry = /* @__PURE__ */ new Map();
+  const selectorRegistry = /* @__PURE__ */ new Map();
   const selectorFamilyRegistry = /* @__PURE__ */ new Map();
   const selectorFamilyMembersRegistry = /* @__PURE__ */ new Map();
   const depsRegistry = /* @__PURE__ */ new Map();
@@ -51154,6 +51169,20 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     }
     return `${getUniqueIdentifier(variable)}-${type}-${extras}`;
   }
+  function clearRegistries_TEST() {
+    for (const registry of [
+      dataRegistry,
+      atomRegistry,
+      atomFamilyRegistry,
+      atomFamilyMembersRegistry,
+      selectorRegistry,
+      depsRegistry,
+      selectorFamilyRegistry,
+      selectorFamilyMembersRegistry
+    ]) {
+      registry.clear();
+    }
+  }
   function isRegistered(variable) {
     if (!isVariable(variable)) {
       return false;
@@ -51395,247 +51424,1066 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     console.warn("No valid theme was found. Defaulting to light theme.");
     return theme;
   }
-  class EventBus {
-    constructor(parentBus) {
-      __privateAdd(this, _events$, new Subject());
-      __privateAdd(this, _parentBus, null);
-      __privateSet(this, _parentBus, parentBus != null ? parentBus : null);
-    }
-    publish(type, data) {
-      __privateGet(this, _events$).next({ type, data });
-      if (__privateGet(this, _parentBus)) {
-        __privateGet(this, _parentBus).publish(type, data);
+  function useDeferLoadable(loadable) {
+    const { suspend } = useFallbackCtx();
+    const [availableState, setAvailableState] = React.useState(() => loadable.getValue());
+    const timerId = React.useRef(null);
+    const isFirstRender = React.useRef(true);
+    const [showFallback, setShowFallback] = React.useState(false);
+    React.useEffect(() => {
+      if (isFirstRender.current) {
+        isFirstRender.current = false;
+        return;
       }
-    }
-    subscribe(callback) {
-      const sub = __privateGet(this, _events$).pipe().subscribe(callback);
-      return () => sub.unsubscribe();
-    }
-  }
-  _events$ = new WeakMap();
-  _parentBus = new WeakMap();
-  const DEFAULT_BUS = new EventBus();
-  const EventBusContext = React__namespace.createContext(DEFAULT_BUS);
-  function useEventBus() {
-    return React__namespace.useContext(EventBusContext);
-  }
-  function EventCapturer({ children, onEvent }) {
-    const parentBus = useEventBus();
-    const bus = React__namespace.useMemo(() => new EventBus(parentBus), [parentBus]);
-    React__namespace.useEffect(() => {
-      return bus.subscribe(onEvent);
-    }, [bus, onEvent]);
-    return /* @__PURE__ */ React__namespace.createElement(EventBusContext.Provider, { value: bus }, children);
-  }
-  function err(message) {
-    const error = new Error(message);
-    if (error.stack === void 0) {
-      try {
-        throw error;
-      } catch (_) {
+      if (loadable.state === "loading" && typeof suspend === "number") {
+        timerId.current = setTimeout(() => {
+          setShowFallback(true);
+        }, suspend);
+      }
+      return () => {
+        if (timerId.current) {
+          clearTimeout(timerId.current);
+        }
+      };
+    }, [loadable.state, suspend]);
+    React.useEffect(() => {
+      if (loadable.state === "hasValue") {
+        if (timerId.current) {
+          clearTimeout(timerId.current);
+        }
+        setShowFallback(false);
+        setAvailableState(loadable.valueOrThrow());
       }
+    }, [loadable]);
+    if (suspend === true || showFallback) {
+      return loadable.getValue();
     }
-    return error;
+    return availableState;
   }
-  var err_1 = err;
-  var Recoil_err = err_1;
-  function raiseError(suffix, resultFailure) {
-    if (resultFailure != null) {
-      const path = resultFailure.path.toString();
-      const message = resultFailure.message;
-      throw Recoil_err(`[refine.js (path=${path}, message=${message})]: ${suffix}`);
-    }
-    throw Recoil_err(`[refine.js (null result)]: ${suffix}`);
+  const interAttemptTimeout = 500;
+  const maxDisconnectedTime = 1e4;
+  const interPingInterval = 5e3;
+  const maxAttempts = Math.round(maxDisconnectedTime / interAttemptTimeout);
+  function isInitMessage(message) {
+    return message.type === "init";
   }
-  function assertion(checker, errorMessage = "assertion error") {
-    return (value) => {
-      const result = checker(value);
-      return result.type === "success" ? result.value : raiseError(errorMessage, result);
-    };
+  function isTaskNotification(message) {
+    return message.type === "message" && "status" in message.message && "task_id" in message.message;
   }
-  function coercion(checker, onResult) {
-    return (value) => {
-      const result = checker(value);
-      if (onResult != null) {
-        onResult(result);
-      }
-      return result.type === "success" ? result.value : null;
-    };
+  function isServerTriggerMessage(message) {
+    return message.type === "message" && "data_id" in message.message;
   }
-  var Refine_API = {
-    assertion,
-    coercion
-  };
-  function _defineProperty(obj, key, value) {
-    if (key in obj) {
-      Object.defineProperty(obj, key, {
-        value,
-        enumerable: true,
-        configurable: true,
-        writable: true
-      });
-    } else {
-      obj[key] = value;
-    }
-    return obj;
+  function isServerErrorMessage(message) {
+    return message.type === "message" && "error" in message.message;
   }
-  class Path {
-    constructor(parent = null, field = "<root>") {
-      _defineProperty(this, "parent", void 0);
-      _defineProperty(this, "field", void 0);
-      this.parent = parent;
-      this.field = field;
-    }
-    extend(field) {
-      return new Path(this, field);
-    }
-    toString() {
-      const pieces = [];
-      let current = this;
-      while (current != null) {
-        const {
-          field,
-          parent
-        } = current;
-        pieces.push(field);
-        current = parent;
-      }
-      return pieces.reverse().join("");
-    }
+  function isVariableRequestMessage(message) {
+    return message.type === "message" && "variable" in message.message;
   }
-  function success(value, warnings) {
-    return {
-      type: "success",
-      value,
-      warnings
-    };
+  function isActionMessage(message) {
+    return message.type === "message" && "action" in message.message;
   }
-  function failure(message, path) {
-    return {
-      type: "failure",
-      message,
-      path
-    };
+  function isBackendStoreMessage(message) {
+    return message.type === "message" && "store_uid" in message.message && "value" in message.message;
   }
-  function compose(checker, next) {
-    return (value, path = new Path()) => {
-      const result = checker(value, path);
-      return result.type === "failure" ? result : next(result, path);
-    };
+  function isBackendStorePatchMessage(message) {
+    return message.type === "message" && "store_uid" in message.message && "patches" in message.message;
   }
-  var Refine_Checkers = {
-    Path,
-    success,
-    failure,
-    compose
+  function isCustomMessage(message) {
+    return message.type === "custom";
+  }
+  const pingMessage = {
+    message: null,
+    type: "ping"
   };
-  var Refine_Checkers_1 = Refine_Checkers.Path;
-  var Refine_Checkers_2 = Refine_Checkers.success;
-  var Refine_Checkers_3 = Refine_Checkers.failure;
-  var Refine_Checkers_4 = Refine_Checkers.compose;
-  var Refine_Checkers$1 = /* @__PURE__ */ Object.freeze({
-    __proto__: null,
-    Path: Refine_Checkers_1,
-    success: Refine_Checkers_2,
-    failure: Refine_Checkers_3,
-    compose: Refine_Checkers_4
-  });
-  const {
-    Path: Path$1,
-    compose: compose$1,
-    failure: failure$1,
-    success: success$1
-  } = Refine_Checkers$1;
-  function isPlainObject$1(value) {
-    if (Object.prototype.toString.call(value) !== "[object Object]") {
-      return false;
+  class WebSocketClient {
+    constructor(_socketUrl2, _token, _liveReload = false) {
+      __publicField(this, "channel");
+      __publicField(this, "messages$");
+      __publicField(this, "socket");
+      __publicField(this, "token");
+      __publicField(this, "liveReload");
+      __publicField(this, "closeHandler");
+      __publicField(this, "maxAttempts");
+      __privateAdd(this, _pingInterval, void 0);
+      __privateAdd(this, _socketUrl, void 0);
+      __privateAdd(this, _reconnectCount, void 0);
+      this.token = _token;
+      this.liveReload = _liveReload;
+      this.messages$ = new Subject();
+      this.closeHandler = this.onClose.bind(this);
+      this.maxAttempts = maxAttempts;
+      __privateSet(this, _socketUrl, _socketUrl2);
+      __privateSet(this, _reconnectCount, 0);
+      __privateSet(this, _pingInterval, null);
+      this.channel = Promise.resolve("");
+      this.socket = this.initialize();
     }
-    const prototype = Object.getPrototypeOf(value);
-    return prototype === null || prototype === Object.prototype;
-  }
-  function array(valueChecker) {
-    return (value, path = new Path$1()) => {
-      if (!Array.isArray(value)) {
-        return failure$1("value is not an array", path);
-      }
-      const len = value.length;
-      const out = new Array(len);
-      const warnings = [];
-      for (let i2 = 0; i2 < len; i2++) {
-        const element = value[i2];
-        const result = valueChecker(element, path.extend(`[${i2}]`));
-        if (result.type === "failure") {
-          return failure$1(result.message, result.path);
+    initialize(isReconnect = false) {
+      const url = new URL(__privateGet(this, _socketUrl));
+      this.token = store.getValueSync(getTokenKey());
+      url.searchParams.set("token", this.token);
+      const socket = new WebSocket(url);
+      __privateSet(this, _pingInterval, setInterval(() => {
+        if (socket.readyState === WebSocket.OPEN) {
+          socket.send(JSON.stringify(pingMessage));
         }
-        out[i2] = result.value;
-        if (result.warnings.length !== 0) {
-          warnings.push(...result.warnings);
+      }, interPingInterval));
+      socket.addEventListener("error", () => {
+        if (__privateGet(this, _pingInterval)) {
+          clearInterval(__privateGet(this, _pingInterval));
         }
+      });
+      socket.addEventListener("message", (ev) => {
+        const msg = JSON.parse(ev.data);
+        this.messages$.next(msg);
+      });
+      this.channel = new Promise((resolve) => {
+        const handler = (ev) => {
+          var _a;
+          const msg = JSON.parse(ev.data);
+          if (msg.type === "init") {
+            __privateSet(this, _reconnectCount, 0);
+            this.messages$.next(msg);
+            socket.removeEventListener("message", handler);
+            resolve((_a = msg.message) == null ? void 0 : _a.channel);
+            if (this.liveReload && isReconnect) {
+              window.location.reload();
+            }
+          }
+        };
+        socket.addEventListener("message", handler);
+      });
+      socket.addEventListener("close", this.closeHandler);
+      return socket;
+    }
+    onClose() {
+      if (__privateGet(this, _reconnectCount) >= this.maxAttempts) {
+        console.error("Could not reconnect the websocket to the server");
+        const handler = () => {
+          if (document.visibilityState === "visible") {
+            __privateSet(this, _reconnectCount, 0);
+            this.socket = this.initialize();
+            document.removeEventListener("visibilitychange", handler);
+          }
+        };
+        document.addEventListener("visibilitychange", handler);
+        return;
       }
-      return success$1(out, warnings);
-    };
-  }
-  function tuple(...checkers) {
-    return (value, path = new Path$1()) => {
-      if (!Array.isArray(value)) {
-        return failure$1("value is not an array", path);
+      setTimeout(() => {
+        __privateWrapper(this, _reconnectCount)._++;
+        this.socket = this.initialize(true);
+      }, interAttemptTimeout);
+    }
+    close() {
+      if (__privateGet(this, _pingInterval)) {
+        clearInterval(__privateGet(this, _pingInterval));
       }
-      const out = new Array(checkers.length);
-      const warnings = [];
-      for (const [i2, checker] of checkers.entries()) {
-        const result = checker(value[i2], path.extend(`[${i2}]`));
-        if (result.type === "failure") {
-          return failure$1(result.message, result.path);
-        }
-        out[i2] = result.value;
-        if (result.warnings.length !== 0) {
-          warnings.push(...result.warnings);
-        }
+      this.socket.removeEventListener("close", this.closeHandler);
+      this.socket.close();
+    }
+    getChannel() {
+      return this.channel;
+    }
+    backendStoreMessages$() {
+      return this.messages$.pipe(
+        filter(isBackendStoreMessage),
+        map$2((msg) => msg.message)
+      );
+    }
+    backendStorePatchMessages$() {
+      return this.messages$.pipe(
+        filter(isBackendStorePatchMessage),
+        map$2((msg) => msg.message)
+      );
+    }
+    channel$() {
+      return this.messages$.pipe(
+        filter((msg) => isInitMessage(msg)),
+        map$2((msg) => msg.message.channel)
+      );
+    }
+    taskStatusUpdates$(...task_ids) {
+      return this.messages$.pipe(
+        filter(
+          (msg) => isTaskNotification(msg) && task_ids.includes(msg.message.task_id)
+        ),
+        map$2((msg) => msg.message.status)
+      );
+    }
+    progressUpdates$(...task_ids) {
+      return this.messages$.pipe(
+        filter(
+          (msg) => isTaskNotification(msg) && msg.message.status === "PROGRESS" && task_ids.includes(msg.message.task_id)
+        )
+      );
+    }
+    serverTriggers$(dataId) {
+      return this.messages$.pipe(
+        filter(isServerTriggerMessage),
+        filter((msg) => {
+          var _a;
+          return ((_a = msg.message) == null ? void 0 : _a.data_id) === dataId;
+        })
+      );
+    }
+    serverErrors$() {
+      return this.messages$.pipe(filter(isServerErrorMessage));
+    }
+    variableRequests$() {
+      return this.messages$.pipe(filter(isVariableRequestMessage));
+    }
+    actionMessages$(executionId) {
+      return this.messages$.pipe(
+        filter((msg) => isActionMessage(msg) && msg.message.uid === executionId),
+        map$2((msg) => msg.message.action)
+      );
+    }
+    customMessages$() {
+      return this.messages$.pipe(filter(isCustomMessage));
+    }
+    waitForTask(task_id) {
+      return this.messages$.pipe(
+        filter(
+          (msg) => {
+            var _a;
+            return isTaskNotification(msg) && ((_a = msg.message) == null ? void 0 : _a.task_id) === task_id && msg.message.status !== "PROGRESS";
+          }
+        ),
+        map$2((msg) => {
+          if (isTaskNotification(msg) && msg.message.status === "CANCELED") {
+            throw new Error("CANCELED");
+          }
+          return msg;
+        }),
+        take(1)
+      ).toPromise();
+    }
+    sendVariable(value, channel) {
+      this.sendMessage(value, channel);
+    }
+    sendMessage(value, channel, chunkCount) {
+      if (this.socket.readyState === WebSocket.OPEN) {
+        this.socket.send(
+          JSON.stringify({
+            channel,
+            chunk_count: chunkCount != null ? chunkCount : null,
+            message: value,
+            type: "message"
+          })
+        );
       }
-      return success$1(out, warnings);
-    };
-  }
-  function dict(valueChecker) {
-    return (value, path = new Path$1()) => {
-      if (typeof value !== "object" || value === null || !isPlainObject$1(value)) {
-        return failure$1("value is not an object", path);
+    }
+    updateToken(newToken) {
+      this.token = newToken;
+      if (this.socket.readyState === WebSocket.OPEN) {
+        this.socket.send(
+          JSON.stringify({
+            message: newToken,
+            type: "token_update"
+          })
+        );
       }
-      const out = {};
-      const warnings = [];
-      for (const [key, element] of Object.entries(value)) {
-        const result = valueChecker(element, path.extend(`.${key}`));
-        if (result.type === "failure") {
-          return failure$1(result.message, result.path);
-        }
-        out[key] = result.value;
-        if (result.warnings.length !== 0) {
-          warnings.push(...result.warnings);
+    }
+    sendCustomMessage(kind, data, awaitResponse = false) {
+      if (this.socket.readyState === WebSocket.OPEN) {
+        if (awaitResponse) {
+          const rchan = nanoid();
+          return new Promise((resolve) => {
+            const subscription = this.customMessages$().pipe().subscribe({
+              next: (msg) => {
+                if (msg.message.__response_for === rchan) {
+                  resolve(msg);
+                  subscription.unsubscribe();
+                }
+              }
+            });
+            this.socket.send(
+              JSON.stringify({
+                message: {
+                  data,
+                  kind,
+                  __rchan: rchan
+                },
+                type: "custom"
+              })
+            );
+          });
         }
+        this.socket.send(
+          JSON.stringify({
+            message: {
+              data,
+              kind
+            },
+            type: "custom"
+          })
+        );
+        return Promise.resolve(null);
       }
-      return success$1(out, warnings);
-    };
-  }
-  class OptionalProperty {
-    constructor(checker) {
-      _defineProperty(this, "checker", void 0);
-      this.checker = checker;
+      return Promise.resolve(null);
     }
   }
-  function optional(checker) {
-    return new OptionalProperty((value, path = new Path$1()) => {
-      const result = checker(value, path);
-      if (result.type === "failure") {
-        return {
-          ...result,
-          message: "(optional property) " + result.message
-        };
-      } else {
-        return result;
+  _pingInterval = new WeakMap();
+  _socketUrl = new WeakMap();
+  _reconnectCount = new WeakMap();
+  function setupWebsocket(sessionToken, liveReload) {
+    var _a;
+    let { host } = window.location;
+    if ((_a = window.dara) == null ? void 0 : _a.base_url) {
+      const baseUrl = new URL(window.dara.base_url, window.origin);
+      let { pathname } = baseUrl;
+      if (pathname.endsWith("/")) {
+        pathname = pathname.slice(0, -1);
       }
-    });
-  }
-  function object(checkers) {
-    const checkerProperties = Object.keys(checkers);
+      host = baseUrl.host + pathname;
+    }
+    const socketUrl = `${window.location.protocol === "https:" ? "wss://" : "ws://"}${host}/api/core/ws`;
+    const url = new URL(socketUrl);
+    url.searchParams.set("token", sessionToken);
+    return new WebSocketClient(socketUrl, sessionToken, liveReload);
+  }
+  function useComponentRegistry(maxRetries = 5) {
+    const { componentRegistry: components, refetchComponents } = React.useContext(registriesCtx);
+    const extras = useRequestExtras();
+    const get2 = React.useCallback(
+      async (instance) => {
+        let component = null;
+        let registry = { ...components };
+        let i2 = 0;
+        while (i2 < maxRetries) {
+          if (registry && registry[instance.name]) {
+            component = registry[instance.name];
+            break;
+          }
+          if (i2 === 0) {
+            const res = await request(
+              `/api/core/components?name=${instance.name}`,
+              { method: HTTP_METHOD.GET },
+              extras
+            );
+            await handleAuthErrors(res, true);
+            await validateResponse(res, "Failed to fetch the config for this app");
+            registry = await res.json();
+          } else {
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            const { data } = await refetchComponents();
+            registry = data;
+          }
+          i2++;
+        }
+        if (!component) {
+          throw new Error(`Attempted to load a component (${instance.name}) that is not in the registry`);
+        }
+        return component;
+      },
+      [components]
+    );
+    return { get: get2 };
+  }
+  function useInterval(callback, delay2) {
+    React.useEffect(
+      () => {
+        if (delay2) {
+          const id = setInterval(callback, delay2 * 1e3);
+          return () => clearInterval(id);
+        }
+      },
+      useDeepCompare([delay2, callback])
+    );
+  }
+  function usePrevious(value, initialValue) {
+    const ref = React.useRef(initialValue);
+    React.useEffect(() => {
+      ref.current = value;
+    });
+    return ref.current;
+  }
+  function useWindowTitle(pageTitle) {
+    const { data: config2 } = useConfig();
+    React.useEffect(() => {
+      if (!config2) {
+        return;
+      }
+      if (!pageTitle) {
+        document.title = config2.title;
+        return;
+      }
+      document.title = `${config2.title} - ${pageTitle}`;
+    }, [config2, config2 == null ? void 0 : config2.title, pageTitle]);
+  }
+  const all_min = "";
+  const BaseRawCssInject = styled__default.default.div`
+    ${(props) => props.$rawCss}
+`;
+  function injectCss(component) {
+    if (typeof component === "string") {
+      if (component === "div") {
+        return BaseRawCssInject;
+      }
+      return BaseRawCssInject.withComponent(component);
+    }
+    return styled__default.default(component)`
+        ${(props) => props.$rawCss}
+    `;
+  }
+  const Icon = injectCss("i");
+  function getIcon(icon2) {
+    let iconClasses = icon2;
+    if (typeof icon2 === "string" && !icon2.includes("fa-")) {
+      const inferredIconName = icon2.replace(/([A-Z])/g, " $1").trim().toLowerCase().split(" ").join("-");
+      iconClasses = `fa-solid fa-${inferredIconName}`;
+      console.warn(
+        `Invalid fontawesome class string "${icon2}" provided to getIcon(). This behaviour is deprecated and will be removed in the next version, please use "dara_core.css.get_icon" method. 
+Inferred class string: "${iconClasses}."`
+      );
+    }
+    return (props) => {
+      var _a;
+      return /* @__PURE__ */ React__default.default.createElement(Icon, { ...props, className: `${String((_a = props.className) != null ? _a : "")} ${iconClasses}` });
+    };
+  }
+  function flexStyles(props, displayCtx2, useDisplayContext) {
+    let flexBasis = props.basis;
+    let flexShrink = props.shrink;
+    let flexGrow = props.grow;
+    if (useDisplayContext) {
+      if (props.width && displayCtx2.direction === "horizontal") {
+        flexBasis != null ? flexBasis : flexBasis = props.width;
+        flexShrink != null ? flexShrink : flexShrink = "0";
+        flexGrow != null ? flexGrow : flexGrow = "0";
+      }
+      if (props.height && displayCtx2.direction === "vertical") {
+        flexBasis != null ? flexBasis : flexBasis = props.height;
+        flexShrink != null ? flexShrink : flexShrink = "0";
+        flexGrow != null ? flexGrow : flexGrow = "0";
+      }
+    }
+    if (props.hug || props.hug !== false && displayCtx2.hug) {
+      flexBasis != null ? flexBasis : flexBasis = "content";
+      flexShrink != null ? flexShrink : flexShrink = "1";
+      flexGrow != null ? flexGrow : flexGrow = "0";
+    }
+    return { flexBasis, flexGrow, flexShrink };
+  }
+  function parseRawCss(rawCss) {
+    const isRawObject = typeof rawCss === "object" && rawCss !== null && rawCss !== void 0;
+    const componentCss = !isRawObject && typeof rawCss === "string" ? rawCss : "";
+    const styles2 = isRawObject ? rawCss : {};
+    return [styles2, componentCss];
+  }
+  function useComponentStyles(props, useDisplayContext = true) {
+    const [rawStyles, rawCss] = parseRawCss(props.raw_css);
+    const displayCtx$1 = React.useContext(displayCtx);
+    const flexProps = flexStyles(props, displayCtx$1, useDisplayContext);
+    const styles2 = React.useMemo(() => {
+      var _a;
+      const stylesObj = {
+        backgroundColor: props.background,
+        border: props.border,
+        borderRadius: props.border_radius,
+        color: props.color,
+        fontFamily: props.font,
+        fontSize: props.font_size,
+        fontStyle: props.italic ? "italic" : "normal",
+        fontWeight: props.bold ? "bold" : "normal",
+        gap: props.gap,
+        height: props.height,
+        margin: props.margin,
+        maxHeight: props.max_height,
+        maxWidth: props.max_width,
+        minHeight: props.min_height,
+        minWidth: props.min_width,
+        overflow: props.overflow,
+        padding: props.padding,
+        position: props.position,
+        textDecoration: props.underline ? "underline" : "none",
+        width: props.width,
+        ...flexProps,
+        ...rawStyles,
+        ...(_a = props.style) != null ? _a : {}
+      };
+      return Object.fromEntries(Object.entries(stylesObj).filter(([, v2]) => v2 !== null && v2 !== void 0));
+    }, [useDeepCompare(props)]);
+    return [styles2, rawCss];
+  }
+  function useUrlSync(options) {
+    const urlSerializer = React.useCallback((val) => {
+      if (val === void 0 || val === null) {
+        return "";
+      }
+      if (["string", "number", "boolean"].includes(typeof val)) {
+        return String(val);
+      }
+      return JSON.stringify(val);
+    }, []);
+    const urlDeserializer = React.useCallback((val) => {
+      if (val === "") {
+        return void 0;
+      }
+      try {
+        return JSON.parse(val);
+      } catch {
+        return val;
+      }
+    }, []);
+    const listenChangeURL = React.useCallback((handler) => {
+      const unregister = options.history.listen(() => {
+        handler();
+      });
+      return () => unregister();
+    }, []);
+    const memoryOptions = {
+      getURL: () => {
+        return window.location.origin + options.history.location.pathname + options.history.location.search;
+      },
+      pushURL: (url) => {
+        options.history.push(url.replace(window.location.origin, ""));
+      },
+      replaceURL: (url) => {
+        options.history.replace(url.replace(window.location.origin, ""));
+      }
+    };
+    return {
+      browserInterface: {
+        listenChangeURL,
+        ...options.memory_TEST ? memoryOptions : {}
+      },
+      deserialize: urlDeserializer,
+      location: { part: "queryParams" },
+      serialize: urlSerializer
+    };
+  }
+  const Wrapper$2 = styled__default.default.div`
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    width: 100%;
+    height: 100%;
+`;
+  const FlashingDots = styled__default.default.div`
+    position: relative;
+
+    width: 10px;
+    height: 10px;
+
+    color: ${(props) => props.theme.colors.grey4};
+
+    background-color: ${(props) => props.theme.colors.grey4};
+    border-radius: 5px;
+
+    animation: dot-flashing 1s infinite linear alternate;
+    animation-delay: 0.5s;
+
+    &::before,
+    &::after {
+        content: '';
+        position: absolute;
+        top: 0;
+        display: inline-block;
+    }
+
+    &::before {
+        left: -15px;
+
+        width: 10px;
+        height: 10px;
+
+        color: ${(props) => props.theme.colors.grey4};
+
+        background-color: ${(props) => props.theme.colors.grey4};
+        border-radius: 5px;
+
+        animation: dot-flashing 1s infinite alternate;
+        animation-delay: 0s;
+    }
+
+    &::after {
+        left: 15px;
+
+        width: 10px;
+        height: 10px;
+
+        color: ${(props) => props.theme.colors.grey4};
+
+        background-color: ${(props) => props.theme.colors.grey4};
+        border-radius: 5px;
+
+        animation: dot-flashing 1s infinite alternate;
+        animation-delay: 1s;
+    }
+
+    @keyframes dot-flashing {
+        0% {
+            background-color: ${(props) => props.theme.colors.grey4};
+        }
+
+        50%,
+        100% {
+            background-color: ${(props) => props.theme.colors.grey3};
+        }
+    }
+`;
+  function Dots(props) {
+    return /* @__PURE__ */ React__default.default.createElement(Wrapper$2, { className: props.className, style: props.style }, /* @__PURE__ */ React__default.default.createElement(FlashingDots, { "data-testid": "LOADING" }));
+  }
+  const StyledDots$1 = injectCss(Dots);
+  function DefaultFallback(props) {
+    const [style, css2] = useComponentStyles(props);
+    return /* @__PURE__ */ React__default.default.createElement(StyledDots$1, { $rawCss: css2, style });
+  }
+  const Center = styled__default.default.div`
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+
+    width: 100%;
+    height: 100%;
+
+    background: ${(props) => props.colored ? props.theme.colors.blue1 : ""};
+`;
+  const CenteredDivWithGap = styled__default.default(Center)`
+    gap: 0.6rem;
+    margin: 10px;
+    text-align: center;
+`;
+  const errorMessages = {
+    "403": {
+      description: "You are not authorised to access this application. Please contact the application owner to enable access.",
+      styling: "error",
+      title: "We were not able to authenticate you"
+    },
+    default: {
+      description: "Your login session may have expired. Try again.",
+      styling: "primary",
+      title: "We were not able to authenticate you"
+    }
+  };
+  function ErrorPage() {
+    const { search } = useLocation();
+    const query = React.useMemo(() => new URLSearchParams(search), [search]);
+    const code = query.get("code");
+    const errorConfig = code && errorMessages[code] || errorMessages.default;
+    return /* @__PURE__ */ React__default.default.createElement(CenteredDivWithGap, null, /* @__PURE__ */ React__default.default.createElement("h1", null, errorConfig.title), /* @__PURE__ */ React__default.default.createElement("p", null, errorConfig.description), /* @__PURE__ */ React__default.default.createElement(Button$1, { href: "/login", styling: errorConfig.styling }, "Retry"));
+  }
+  function onTokenChange(cb) {
+    return store.subscribe(getTokenKey(), cb);
+  }
+  function getSessionToken() {
+    return store.getValueSync(getTokenKey());
+  }
+  function setSessionToken(token) {
+    store.setValue(getTokenKey(), token);
+  }
+  function useSessionToken() {
+    return React__namespace.useSyncExternalStore(onTokenChange, getSessionToken);
+  }
+  class EventBus {
+    constructor(parentBus) {
+      __privateAdd(this, _events$, new Subject());
+      __privateAdd(this, _parentBus, null);
+      __privateSet(this, _parentBus, parentBus != null ? parentBus : null);
+    }
+    publish(type, data) {
+      __privateGet(this, _events$).next({ type, data });
+      if (__privateGet(this, _parentBus)) {
+        __privateGet(this, _parentBus).publish(type, data);
+      }
+    }
+    subscribe(callback) {
+      const sub = __privateGet(this, _events$).pipe().subscribe(callback);
+      return () => sub.unsubscribe();
+    }
+  }
+  _events$ = new WeakMap();
+  _parentBus = new WeakMap();
+  const DEFAULT_BUS = new EventBus();
+  const EventBusContext = React__namespace.createContext(DEFAULT_BUS);
+  function useEventBus() {
+    return React__namespace.useContext(EventBusContext);
+  }
+  function EventCapturer({ children, onEvent }) {
+    const parentBus = useEventBus();
+    const bus = React__namespace.useMemo(() => new EventBus(parentBus), [parentBus]);
+    React__namespace.useEffect(() => {
+      return bus.subscribe(onEvent);
+    }, [bus, onEvent]);
+    return /* @__PURE__ */ React__namespace.createElement(EventBusContext.Provider, { value: bus }, children);
+  }
+  function useActionRegistry() {
+    const { actionRegistry: actions } = React.useContext(registriesCtx);
+    const get2 = React.useCallback(
+      (impl) => {
+        if (actions && actions[impl.name]) {
+          return actions[impl.name];
+        }
+        throw new Error(`Attempted to load an action (${impl.name}) that is not in the registry`);
+      },
+      [actions]
+    );
+    return React.useMemo(() => ({ get: get2 }), [get2]);
+  }
+  const _StateSynchronizer = class {
+    constructor() {
+      __privateAdd(this, _observers, /* @__PURE__ */ new Map());
+    }
+    static getInstance() {
+      if (!__privateGet(_StateSynchronizer, _instance)) {
+        __privateSet(_StateSynchronizer, _instance, new _StateSynchronizer());
+      }
+      return __privateGet(_StateSynchronizer, _instance);
+    }
+    register(key, defaultValue) {
+      if (!__privateGet(this, _observers).has(key)) {
+        __privateGet(this, _observers).set(key, new BehaviorSubject({ type: "initial", value: defaultValue }));
+      }
+    }
+    isRegistered(key) {
+      return __privateGet(this, _observers).has(key);
+    }
+    getCurrentState(key) {
+      if (!this.isRegistered(key)) {
+        return null;
+      }
+      return __privateGet(this, _observers).get(key).getValue();
+    }
+    subscribe(key, subscription) {
+      if (!this.isRegistered(key)) {
+        this.register(key, null);
+      }
+      const sub = __privateGet(this, _observers).get(key).subscribe(subscription);
+      return () => {
+        sub.unsubscribe();
+        if (__privateGet(this, _observers).get(key).observers.length === 0) {
+          __privateGet(this, _observers).delete(key);
+        }
+      };
+    }
+    notify(key, update) {
+      if (!this.isRegistered(key)) {
+        this.register(key, null);
+      }
+      __privateGet(this, _observers).get(key).next(update);
+    }
+  };
+  let StateSynchronizer = _StateSynchronizer;
+  _instance = new WeakMap();
+  _observers = new WeakMap();
+  __privateAdd(StateSynchronizer, _instance, void 0);
+  function getOrRegisterPlainVariable(variable, wsClient, taskContext, extras) {
+    const isNested = variable.nested && variable.nested.length > 0;
+    const isDefaultDerived = isDerivedVariable(variable.default);
+    if (!atomFamilyRegistry.has(variable.uid)) {
+      atomFamilyRegistry.set(
+        variable.uid,
+        Recoil_index_10({
+          default: isDefaultDerived ? (extrasSerializable2) => getOrRegisterDerivedVariableValue(
+            variable.default,
+            wsClient,
+            taskContext,
+            extrasSerializable2.extras
+          ) : variable.default,
+          effects: (extrasSerializable2) => {
+            const familySync = ({ onSet, setSelf, resetSelf, node }) => {
+              if (!StateSynchronizer.getInstance().isRegistered(variable.uid)) {
+                StateSynchronizer.getInstance().register(variable.uid, variable.default);
+              } else {
+                const currentState = StateSynchronizer.getInstance().getCurrentState(variable.uid);
+                if (!isDefaultDerived || (currentState == null ? void 0 : currentState.type) !== "initial") {
+                  setSelf(currentState == null ? void 0 : currentState.value);
+                }
+              }
+              const unsub = StateSynchronizer.getInstance().subscribe(variable.uid, (update) => {
+                if (update.type === "initial") {
+                  return;
+                }
+                if (update.nodeKey === node.key) {
+                  return;
+                }
+                if (update.isReset) {
+                  resetSelf();
+                } else {
+                  setSelf(update.value);
+                }
+              });
+              onSet((newValue, oldValue, isReset) => {
+                StateSynchronizer.getInstance().notify(variable.uid, {
+                  isReset,
+                  nodeKey: node.key,
+                  oldValue,
+                  type: "update",
+                  value: newValue
+                });
+              });
+              return unsub;
+            };
+            const effects = [familySync];
+            const storeEffect = getEffect(variable);
+            if (storeEffect) {
+              effects.push(storeEffect(variable, extrasSerializable2, wsClient, taskContext));
+            } else {
+              if (variable.persist_value || isEmbedded()) {
+                effects.push(
+                  STORES.BrowserStore.effect(variable, extrasSerializable2, wsClient, taskContext)
+                );
+              }
+            }
+            return effects;
+          },
+          key: variable.uid
+        })
+      );
+    }
+    const family = atomFamilyRegistry.get(variable.uid);
+    const extrasSerializable = new RequestExtrasSerializable(extras);
+    const atomInstance = family(extrasSerializable);
+    if (!atomFamilyMembersRegistry.has(family)) {
+      atomFamilyMembersRegistry.set(family, /* @__PURE__ */ new Map());
+    }
+    atomFamilyMembersRegistry.get(family).set(extrasSerializable.toJSON(), atomInstance);
+    if (isNested) {
+      const key = getRegistryKey(variable, "selector");
+      if (!selectorFamilyRegistry.has(key)) {
+        selectorFamilyRegistry.set(
+          key,
+          Recoil_index_11({
+            get: (currentExtras) => ({ get: get2 }) => {
+              const variableValue = get2(family(currentExtras));
+              return resolveNested(
+                variableValue,
+                variable.nested.map((n2) => String(n2))
+              );
+            },
+            key,
+            set: (currentExtras) => ({ set: set2 }, newValue) => {
+              set2(
+                family(currentExtras),
+                (v2) => setNested(
+                  v2,
+                  variable.nested.map((n2) => String(n2)),
+                  newValue
+                )
+              );
+            }
+          })
+        );
+      }
+      const selectorFamilyInstance = selectorFamilyRegistry.get(key);
+      return selectorFamilyInstance(extrasSerializable);
+    }
+    return atomInstance;
+  }
+  function err(message) {
+    const error = new Error(message);
+    if (error.stack === void 0) {
+      try {
+        throw error;
+      } catch (_) {
+      }
+    }
+    return error;
+  }
+  var err_1 = err;
+  var Recoil_err = err_1;
+  function raiseError(suffix, resultFailure) {
+    if (resultFailure != null) {
+      const path = resultFailure.path.toString();
+      const message = resultFailure.message;
+      throw Recoil_err(`[refine.js (path=${path}, message=${message})]: ${suffix}`);
+    }
+    throw Recoil_err(`[refine.js (null result)]: ${suffix}`);
+  }
+  function assertion(checker, errorMessage = "assertion error") {
+    return (value) => {
+      const result = checker(value);
+      return result.type === "success" ? result.value : raiseError(errorMessage, result);
+    };
+  }
+  function coercion(checker, onResult) {
+    return (value) => {
+      const result = checker(value);
+      if (onResult != null) {
+        onResult(result);
+      }
+      return result.type === "success" ? result.value : null;
+    };
+  }
+  var Refine_API = {
+    assertion,
+    coercion
+  };
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+    return obj;
+  }
+  class Path {
+    constructor(parent = null, field = "<root>") {
+      _defineProperty(this, "parent", void 0);
+      _defineProperty(this, "field", void 0);
+      this.parent = parent;
+      this.field = field;
+    }
+    extend(field) {
+      return new Path(this, field);
+    }
+    toString() {
+      const pieces = [];
+      let current = this;
+      while (current != null) {
+        const {
+          field,
+          parent
+        } = current;
+        pieces.push(field);
+        current = parent;
+      }
+      return pieces.reverse().join("");
+    }
+  }
+  function success(value, warnings) {
+    return {
+      type: "success",
+      value,
+      warnings
+    };
+  }
+  function failure(message, path) {
+    return {
+      type: "failure",
+      message,
+      path
+    };
+  }
+  function compose(checker, next) {
+    return (value, path = new Path()) => {
+      const result = checker(value, path);
+      return result.type === "failure" ? result : next(result, path);
+    };
+  }
+  var Refine_Checkers = {
+    Path,
+    success,
+    failure,
+    compose
+  };
+  var Refine_Checkers_1 = Refine_Checkers.Path;
+  var Refine_Checkers_2 = Refine_Checkers.success;
+  var Refine_Checkers_3 = Refine_Checkers.failure;
+  var Refine_Checkers_4 = Refine_Checkers.compose;
+  var Refine_Checkers$1 = /* @__PURE__ */ Object.freeze({
+    __proto__: null,
+    Path: Refine_Checkers_1,
+    success: Refine_Checkers_2,
+    failure: Refine_Checkers_3,
+    compose: Refine_Checkers_4
+  });
+  const {
+    Path: Path$1,
+    compose: compose$1,
+    failure: failure$1,
+    success: success$1
+  } = Refine_Checkers$1;
+  function isPlainObject$1(value) {
+    if (Object.prototype.toString.call(value) !== "[object Object]") {
+      return false;
+    }
+    const prototype = Object.getPrototypeOf(value);
+    return prototype === null || prototype === Object.prototype;
+  }
+  function array(valueChecker) {
+    return (value, path = new Path$1()) => {
+      if (!Array.isArray(value)) {
+        return failure$1("value is not an array", path);
+      }
+      const len = value.length;
+      const out = new Array(len);
+      const warnings = [];
+      for (let i2 = 0; i2 < len; i2++) {
+        const element = value[i2];
+        const result = valueChecker(element, path.extend(`[${i2}]`));
+        if (result.type === "failure") {
+          return failure$1(result.message, result.path);
+        }
+        out[i2] = result.value;
+        if (result.warnings.length !== 0) {
+          warnings.push(...result.warnings);
+        }
+      }
+      return success$1(out, warnings);
+    };
+  }
+  function tuple(...checkers) {
+    return (value, path = new Path$1()) => {
+      if (!Array.isArray(value)) {
+        return failure$1("value is not an array", path);
+      }
+      const out = new Array(checkers.length);
+      const warnings = [];
+      for (const [i2, checker] of checkers.entries()) {
+        const result = checker(value[i2], path.extend(`[${i2}]`));
+        if (result.type === "failure") {
+          return failure$1(result.message, result.path);
+        }
+        out[i2] = result.value;
+        if (result.warnings.length !== 0) {
+          warnings.push(...result.warnings);
+        }
+      }
+      return success$1(out, warnings);
+    };
+  }
+  function dict(valueChecker) {
+    return (value, path = new Path$1()) => {
+      if (typeof value !== "object" || value === null || !isPlainObject$1(value)) {
+        return failure$1("value is not an object", path);
+      }
+      const out = {};
+      const warnings = [];
+      for (const [key, element] of Object.entries(value)) {
+        const result = valueChecker(element, path.extend(`.${key}`));
+        if (result.type === "failure") {
+          return failure$1(result.message, result.path);
+        }
+        out[key] = result.value;
+        if (result.warnings.length !== 0) {
+          warnings.push(...result.warnings);
+        }
+      }
+      return success$1(out, warnings);
+    };
+  }
+  class OptionalProperty {
+    constructor(checker) {
+      _defineProperty(this, "checker", void 0);
+      this.checker = checker;
+    }
+  }
+  function optional(checker) {
+    return new OptionalProperty((value, path = new Path$1()) => {
+      const result = checker(value, path);
+      if (result.type === "failure") {
+        return {
+          ...result,
+          message: "(optional property) " + result.message
+        };
+      } else {
+        return result;
+      }
+    });
+  }
+  function object(checkers) {
+    const checkerProperties = Object.keys(checkers);
     return (value, path = new Path$1()) => {
       if (typeof value !== "object" || value === null || !isPlainObject$1(value)) {
         return failure$1("value is not an object", path);
@@ -51893,500 +52741,218 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
       if (a2.type === "success") {
         return success$3(a2.value, a2.warnings);
       }
-      const b2 = bChecker(value, path);
-      if (b2.type === "success") {
-        return success$3(b2.value, b2.warnings);
-      }
-      return unionFailure("value did not match any types in or()", path, [a2, b2]);
-    };
-  }
-  function union(...checkers) {
-    return (value, path = new Path$3()) => {
-      const failures = [];
-      for (const checker of checkers) {
-        const result = checker(value, path);
-        if (result.type === "success") {
-          return success$3(result.value, result.warnings);
-        }
-        failures.push(result);
-      }
-      return unionFailure("value did not match any types in union", path, failures);
-    };
-  }
-  function match(...checkers) {
-    return union(...checkers);
-  }
-  function nullable(checker, options) {
-    const {
-      nullWithWarningWhenInvalid = false
-    } = options !== null && options !== void 0 ? options : {};
-    return (value, parentPath = new Path$3()) => {
-      if (value == null) {
-        return success$3(value, []);
-      }
-      const result = checker(value, parentPath);
-      if (result.type === "success") {
-        return success$3(result.value, result.warnings);
-      }
-      if (nullWithWarningWhenInvalid) {
-        return success$3(null, [result]);
-      }
-      const {
-        message,
-        path
-      } = result;
-      return failure$3(message, path);
-    };
-  }
-  function voidable(checker, options) {
-    const {
-      undefinedWithWarningWhenInvalid = false
-    } = options !== null && options !== void 0 ? options : {};
-    return (value, parentPath = new Path$3()) => {
-      if (value === void 0) {
-        return success$3(void 0, []);
-      }
-      const result = checker(value, parentPath);
-      if (result.type === "success") {
-        return success$3(result.value, result.warnings);
-      }
-      if (undefinedWithWarningWhenInvalid) {
-        return success$3(void 0, [result]);
-      }
-      const {
-        message,
-        path
-      } = result;
-      return failure$3(message, path);
-    };
-  }
-  function withDefault(checker, fallback) {
-    return (value, path = new Path$3()) => {
-      if (value == null) {
-        return success$3(fallback, []);
-      }
-      const result = checker(value, path);
-      return result.type === "failure" || result.value != null ? result : success$3(fallback, []);
-    };
-  }
-  function constraint(checker, predicate) {
-    return compose$3(checker, ({
-      value,
-      warnings
-    }, path) => {
-      const result = predicate(value);
-      const [passed, message] = typeof result === "boolean" ? [result, "value failed constraint check"] : result;
-      return passed ? success$3(value, warnings) : failure$3(message, path);
-    });
-  }
-  function lazy(getChecker) {
-    return (value, path = new Path$3()) => {
-      const checker = getChecker();
-      return checker(value, path);
-    };
-  }
-  function custom(checkValue, failureMessage = `failed to return non-null from custom checker.`) {
-    return (value, path = new Path$3()) => {
-      try {
-        const checked = checkValue(value);
-        return checked != null ? success$3(checked, []) : failure$3(failureMessage, path);
-      } catch (error) {
-        return failure$3(error.message, path);
-      }
-    };
-  }
-  var Refine_UtilityCheckers = {
-    or,
-    union,
-    match,
-    nullable,
-    voidable,
-    withDefault,
-    constraint,
-    asType,
-    lazy,
-    custom
-  };
-  const {
-    assertion: assertion$2,
-    coercion: coercion$1
-  } = Refine_API;
-  const {
-    Path: Path$4
-  } = Refine_Checkers$1;
-  const {
-    array: array$1,
-    dict: dict$1,
-    map: map$1,
-    object: object$1,
-    optional: optional$1,
-    set: set$1$1,
-    tuple: tuple$1,
-    writableArray: writableArray$1,
-    writableDict: writableDict$1,
-    writableObject: writableObject$1
-  } = Refine_ContainerCheckers$1;
-  const {
-    jsonParser: jsonParser$1,
-    jsonParserEnforced: jsonParserEnforced$1
-  } = Refine_JSON;
-  const {
-    bool: bool$1,
-    date: date$1,
-    jsonDate: jsonDate$1,
-    literal: literal$1,
-    mixed: mixed$1,
-    number: number$1,
-    string: string$1,
-    stringLiterals: stringLiterals$1
-  } = Refine_PrimitiveCheckers;
-  const {
-    asType: asType$1,
-    constraint: constraint$1,
-    custom: custom$1,
-    lazy: lazy$1,
-    match: match$1,
-    nullable: nullable$1,
-    or: or$1,
-    union: union$1,
-    voidable: voidable$1,
-    withDefault: withDefault$1
-  } = Refine_UtilityCheckers;
-  var Refine_index = {
-    assertion: assertion$2,
-    coercion: coercion$1,
-    jsonParser: jsonParser$1,
-    jsonParserEnforced: jsonParserEnforced$1,
-    Path: Path$4,
-    mixed: mixed$1,
-    literal: literal$1,
-    bool: bool$1,
-    number: number$1,
-    string: string$1,
-    stringLiterals: stringLiterals$1,
-    date: date$1,
-    jsonDate: jsonDate$1,
-    asType: asType$1,
-    or: or$1,
-    union: union$1,
-    match: match$1,
-    nullable: nullable$1,
-    voidable: voidable$1,
-    withDefault: withDefault$1,
-    constraint: constraint$1,
-    lazy: lazy$1,
-    custom: custom$1,
-    array: array$1,
-    tuple: tuple$1,
-    dict: dict$1,
-    object: object$1,
-    optional: optional$1,
-    set: set$1$1,
-    map: map$1,
-    writableArray: writableArray$1,
-    writableDict: writableDict$1,
-    writableObject: writableObject$1
-  };
-  var Refine_index_6 = Refine_index.mixed;
-  function getOrRegisterUrlVariable(variable) {
-    if (!atomRegistry.has(variable.uid)) {
-      atomRegistry.set(
-        variable.uid,
-        Recoil_index_8({
-          default: variable.default,
-          effects: [
-            RecoilSync_index_6({ history: "push", itemKey: variable.query, refine: Refine_index_6(), syncDefault: true })
-          ],
-          key: variable.uid
-        })
-      );
-    }
-    return atomRegistry.get(variable.uid);
-  }
-  function useUrlVariable(variable) {
-    return Recoil_index_22(getOrRegisterUrlVariable(variable));
-  }
-  const interAttemptTimeout = 500;
-  const maxDisconnectedTime = 1e4;
-  const interPingInterval = 5e3;
-  const maxAttempts = Math.round(maxDisconnectedTime / interAttemptTimeout);
-  function isInitMessage(message) {
-    return message.type === "init";
-  }
-  function isTaskNotification(message) {
-    return message.type === "message" && "status" in message.message && "task_id" in message.message;
-  }
-  function isServerTriggerMessage(message) {
-    return message.type === "message" && "data_id" in message.message;
-  }
-  function isServerErrorMessage(message) {
-    return message.type === "message" && "error" in message.message;
-  }
-  function isVariableRequestMessage(message) {
-    return message.type === "message" && "variable" in message.message;
-  }
-  function isActionMessage(message) {
-    return message.type === "message" && "action" in message.message;
-  }
-  function isBackendStoreMessage(message) {
-    return message.type === "message" && "store_uid" in message.message && "value" in message.message;
-  }
-  function isBackendStorePatchMessage(message) {
-    return message.type === "message" && "store_uid" in message.message && "patches" in message.message;
-  }
-  function isCustomMessage(message) {
-    return message.type === "custom";
-  }
-  const pingMessage = {
-    message: null,
-    type: "ping"
-  };
-  class WebSocketClient {
-    constructor(_socketUrl2, _token, _liveReload = false) {
-      __publicField(this, "channel");
-      __publicField(this, "messages$");
-      __publicField(this, "socket");
-      __publicField(this, "token");
-      __publicField(this, "liveReload");
-      __publicField(this, "closeHandler");
-      __publicField(this, "maxAttempts");
-      __privateAdd(this, _pingInterval, void 0);
-      __privateAdd(this, _socketUrl, void 0);
-      __privateAdd(this, _reconnectCount, void 0);
-      this.token = _token;
-      this.liveReload = _liveReload;
-      this.messages$ = new Subject();
-      this.closeHandler = this.onClose.bind(this);
-      this.maxAttempts = maxAttempts;
-      __privateSet(this, _socketUrl, _socketUrl2);
-      __privateSet(this, _reconnectCount, 0);
-      __privateSet(this, _pingInterval, null);
-      this.channel = Promise.resolve("");
-      this.socket = this.initialize();
-    }
-    initialize(isReconnect = false) {
-      const url = new URL(__privateGet(this, _socketUrl));
-      this.token = store.getValueSync(getTokenKey());
-      url.searchParams.set("token", this.token);
-      const socket = new WebSocket(url);
-      __privateSet(this, _pingInterval, setInterval(() => {
-        if (socket.readyState === WebSocket.OPEN) {
-          socket.send(JSON.stringify(pingMessage));
-        }
-      }, interPingInterval));
-      socket.addEventListener("error", () => {
-        if (__privateGet(this, _pingInterval)) {
-          clearInterval(__privateGet(this, _pingInterval));
-        }
-      });
-      socket.addEventListener("message", (ev) => {
-        const msg = JSON.parse(ev.data);
-        this.messages$.next(msg);
-      });
-      this.channel = new Promise((resolve) => {
-        const handler = (ev) => {
-          var _a;
-          const msg = JSON.parse(ev.data);
-          if (msg.type === "init") {
-            __privateSet(this, _reconnectCount, 0);
-            this.messages$.next(msg);
-            socket.removeEventListener("message", handler);
-            resolve((_a = msg.message) == null ? void 0 : _a.channel);
-            if (this.liveReload && isReconnect) {
-              window.location.reload();
-            }
-          }
-        };
-        socket.addEventListener("message", handler);
-      });
-      socket.addEventListener("close", this.closeHandler);
-      return socket;
-    }
-    onClose() {
-      if (__privateGet(this, _reconnectCount) >= this.maxAttempts) {
-        console.error("Could not reconnect the websocket to the server");
-        const handler = () => {
-          if (document.visibilityState === "visible") {
-            __privateSet(this, _reconnectCount, 0);
-            this.socket = this.initialize();
-            document.removeEventListener("visibilitychange", handler);
-          }
-        };
-        document.addEventListener("visibilitychange", handler);
-        return;
-      }
-      setTimeout(() => {
-        __privateWrapper(this, _reconnectCount)._++;
-        this.socket = this.initialize(true);
-      }, interAttemptTimeout);
-    }
-    close() {
-      if (__privateGet(this, _pingInterval)) {
-        clearInterval(__privateGet(this, _pingInterval));
-      }
-      this.socket.removeEventListener("close", this.closeHandler);
-      this.socket.close();
-    }
-    getChannel() {
-      return this.channel;
-    }
-    backendStoreMessages$() {
-      return this.messages$.pipe(
-        filter(isBackendStoreMessage),
-        map$2((msg) => msg.message)
-      );
-    }
-    backendStorePatchMessages$() {
-      return this.messages$.pipe(
-        filter(isBackendStorePatchMessage),
-        map$2((msg) => msg.message)
-      );
-    }
-    channel$() {
-      return this.messages$.pipe(
-        filter((msg) => isInitMessage(msg)),
-        map$2((msg) => msg.message.channel)
-      );
-    }
-    taskStatusUpdates$(...task_ids) {
-      return this.messages$.pipe(
-        filter(
-          (msg) => isTaskNotification(msg) && task_ids.includes(msg.message.task_id)
-        ),
-        map$2((msg) => msg.message.status)
-      );
-    }
-    progressUpdates$(...task_ids) {
-      return this.messages$.pipe(
-        filter(
-          (msg) => isTaskNotification(msg) && msg.message.status === "PROGRESS" && task_ids.includes(msg.message.task_id)
-        )
-      );
-    }
-    serverTriggers$(dataId) {
-      return this.messages$.pipe(
-        filter(isServerTriggerMessage),
-        filter((msg) => {
-          var _a;
-          return ((_a = msg.message) == null ? void 0 : _a.data_id) === dataId;
-        })
-      );
-    }
-    serverErrors$() {
-      return this.messages$.pipe(filter(isServerErrorMessage));
-    }
-    variableRequests$() {
-      return this.messages$.pipe(filter(isVariableRequestMessage));
-    }
-    actionMessages$(executionId) {
-      return this.messages$.pipe(
-        filter((msg) => isActionMessage(msg) && msg.message.uid === executionId),
-        map$2((msg) => msg.message.action)
-      );
-    }
-    customMessages$() {
-      return this.messages$.pipe(filter(isCustomMessage));
-    }
-    waitForTask(task_id) {
-      return this.messages$.pipe(
-        filter(
-          (msg) => {
-            var _a;
-            return isTaskNotification(msg) && ((_a = msg.message) == null ? void 0 : _a.task_id) === task_id && msg.message.status !== "PROGRESS";
-          }
-        ),
-        map$2((msg) => {
-          if (isTaskNotification(msg) && msg.message.status === "CANCELED") {
-            throw new Error("CANCELED");
-          }
-          return msg;
-        }),
-        take(1)
-      ).toPromise();
-    }
-    sendVariable(value, channel) {
-      this.sendMessage(value, channel);
-    }
-    sendMessage(value, channel, chunkCount) {
-      if (this.socket.readyState === WebSocket.OPEN) {
-        this.socket.send(
-          JSON.stringify({
-            channel,
-            chunk_count: chunkCount != null ? chunkCount : null,
-            message: value,
-            type: "message"
-          })
-        );
-      }
-    }
-    updateToken(newToken) {
-      this.token = newToken;
-      if (this.socket.readyState === WebSocket.OPEN) {
-        this.socket.send(
-          JSON.stringify({
-            message: newToken,
-            type: "token_update"
-          })
-        );
-      }
-    }
-    sendCustomMessage(kind, data, awaitResponse = false) {
-      if (this.socket.readyState === WebSocket.OPEN) {
-        if (awaitResponse) {
-          const rchan = nanoid();
-          return new Promise((resolve) => {
-            const subscription = this.customMessages$().pipe().subscribe({
-              next: (msg) => {
-                if (msg.message.__response_for === rchan) {
-                  resolve(msg);
-                  subscription.unsubscribe();
-                }
-              }
-            });
-            this.socket.send(
-              JSON.stringify({
-                message: {
-                  data,
-                  kind,
-                  __rchan: rchan
-                },
-                type: "custom"
-              })
-            );
-          });
+      const b2 = bChecker(value, path);
+      if (b2.type === "success") {
+        return success$3(b2.value, b2.warnings);
+      }
+      return unionFailure("value did not match any types in or()", path, [a2, b2]);
+    };
+  }
+  function union(...checkers) {
+    return (value, path = new Path$3()) => {
+      const failures = [];
+      for (const checker of checkers) {
+        const result = checker(value, path);
+        if (result.type === "success") {
+          return success$3(result.value, result.warnings);
         }
-        this.socket.send(
-          JSON.stringify({
-            message: {
-              data,
-              kind
-            },
-            type: "custom"
-          })
-        );
-        return Promise.resolve(null);
+        failures.push(result);
       }
-      return Promise.resolve(null);
-    }
+      return unionFailure("value did not match any types in union", path, failures);
+    };
   }
-  _pingInterval = new WeakMap();
-  _socketUrl = new WeakMap();
-  _reconnectCount = new WeakMap();
-  function setupWebsocket(sessionToken, liveReload) {
-    var _a;
-    let { host } = window.location;
-    if ((_a = window.dara) == null ? void 0 : _a.base_url) {
-      const baseUrl = new URL(window.dara.base_url, window.origin);
-      let { pathname } = baseUrl;
-      if (pathname.endsWith("/")) {
-        pathname = pathname.slice(0, -1);
+  function match(...checkers) {
+    return union(...checkers);
+  }
+  function nullable(checker, options) {
+    const {
+      nullWithWarningWhenInvalid = false
+    } = options !== null && options !== void 0 ? options : {};
+    return (value, parentPath = new Path$3()) => {
+      if (value == null) {
+        return success$3(value, []);
       }
-      host = baseUrl.host + pathname;
+      const result = checker(value, parentPath);
+      if (result.type === "success") {
+        return success$3(result.value, result.warnings);
+      }
+      if (nullWithWarningWhenInvalid) {
+        return success$3(null, [result]);
+      }
+      const {
+        message,
+        path
+      } = result;
+      return failure$3(message, path);
+    };
+  }
+  function voidable(checker, options) {
+    const {
+      undefinedWithWarningWhenInvalid = false
+    } = options !== null && options !== void 0 ? options : {};
+    return (value, parentPath = new Path$3()) => {
+      if (value === void 0) {
+        return success$3(void 0, []);
+      }
+      const result = checker(value, parentPath);
+      if (result.type === "success") {
+        return success$3(result.value, result.warnings);
+      }
+      if (undefinedWithWarningWhenInvalid) {
+        return success$3(void 0, [result]);
+      }
+      const {
+        message,
+        path
+      } = result;
+      return failure$3(message, path);
+    };
+  }
+  function withDefault(checker, fallback) {
+    return (value, path = new Path$3()) => {
+      if (value == null) {
+        return success$3(fallback, []);
+      }
+      const result = checker(value, path);
+      return result.type === "failure" || result.value != null ? result : success$3(fallback, []);
+    };
+  }
+  function constraint(checker, predicate) {
+    return compose$3(checker, ({
+      value,
+      warnings
+    }, path) => {
+      const result = predicate(value);
+      const [passed, message] = typeof result === "boolean" ? [result, "value failed constraint check"] : result;
+      return passed ? success$3(value, warnings) : failure$3(message, path);
+    });
+  }
+  function lazy(getChecker) {
+    return (value, path = new Path$3()) => {
+      const checker = getChecker();
+      return checker(value, path);
+    };
+  }
+  function custom(checkValue, failureMessage = `failed to return non-null from custom checker.`) {
+    return (value, path = new Path$3()) => {
+      try {
+        const checked = checkValue(value);
+        return checked != null ? success$3(checked, []) : failure$3(failureMessage, path);
+      } catch (error) {
+        return failure$3(error.message, path);
+      }
+    };
+  }
+  var Refine_UtilityCheckers = {
+    or,
+    union,
+    match,
+    nullable,
+    voidable,
+    withDefault,
+    constraint,
+    asType,
+    lazy,
+    custom
+  };
+  const {
+    assertion: assertion$2,
+    coercion: coercion$1
+  } = Refine_API;
+  const {
+    Path: Path$4
+  } = Refine_Checkers$1;
+  const {
+    array: array$1,
+    dict: dict$1,
+    map: map$1,
+    object: object$1,
+    optional: optional$1,
+    set: set$1$1,
+    tuple: tuple$1,
+    writableArray: writableArray$1,
+    writableDict: writableDict$1,
+    writableObject: writableObject$1
+  } = Refine_ContainerCheckers$1;
+  const {
+    jsonParser: jsonParser$1,
+    jsonParserEnforced: jsonParserEnforced$1
+  } = Refine_JSON;
+  const {
+    bool: bool$1,
+    date: date$1,
+    jsonDate: jsonDate$1,
+    literal: literal$1,
+    mixed: mixed$1,
+    number: number$1,
+    string: string$1,
+    stringLiterals: stringLiterals$1
+  } = Refine_PrimitiveCheckers;
+  const {
+    asType: asType$1,
+    constraint: constraint$1,
+    custom: custom$1,
+    lazy: lazy$1,
+    match: match$1,
+    nullable: nullable$1,
+    or: or$1,
+    union: union$1,
+    voidable: voidable$1,
+    withDefault: withDefault$1
+  } = Refine_UtilityCheckers;
+  var Refine_index = {
+    assertion: assertion$2,
+    coercion: coercion$1,
+    jsonParser: jsonParser$1,
+    jsonParserEnforced: jsonParserEnforced$1,
+    Path: Path$4,
+    mixed: mixed$1,
+    literal: literal$1,
+    bool: bool$1,
+    number: number$1,
+    string: string$1,
+    stringLiterals: stringLiterals$1,
+    date: date$1,
+    jsonDate: jsonDate$1,
+    asType: asType$1,
+    or: or$1,
+    union: union$1,
+    match: match$1,
+    nullable: nullable$1,
+    voidable: voidable$1,
+    withDefault: withDefault$1,
+    constraint: constraint$1,
+    lazy: lazy$1,
+    custom: custom$1,
+    array: array$1,
+    tuple: tuple$1,
+    dict: dict$1,
+    object: object$1,
+    optional: optional$1,
+    set: set$1$1,
+    map: map$1,
+    writableArray: writableArray$1,
+    writableDict: writableDict$1,
+    writableObject: writableObject$1
+  };
+  var Refine_index_6 = Refine_index.mixed;
+  function getOrRegisterUrlVariable(variable) {
+    if (!atomRegistry.has(variable.uid)) {
+      atomRegistry.set(
+        variable.uid,
+        Recoil_index_8({
+          default: variable.default,
+          effects: [
+            RecoilSync_index_6({ history: "push", itemKey: variable.query, refine: Refine_index_6(), syncDefault: true })
+          ],
+          key: variable.uid
+        })
+      );
     }
-    const socketUrl = `${window.location.protocol === "https:" ? "wss://" : "ws://"}${host}/api/core/ws`;
-    const url = new URL(socketUrl);
-    url.searchParams.set("token", sessionToken);
-    return new WebSocketClient(socketUrl, sessionToken, liveReload);
+    return atomRegistry.get(variable.uid);
+  }
+  function useUrlVariable(variable) {
+    return Recoil_index_22(getOrRegisterUrlVariable(variable));
   }
   function combineFilters(combinator, queries) {
     const validQueries = queries.filter(Boolean);
@@ -52544,17 +53110,6 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
       atomRegistry.set(variable.uid, Recoil_index_8({ default: true, key: variable.uid }));
     }
   }
-  function useInterval(callback, delay2) {
-    React.useEffect(
-      () => {
-        if (delay2) {
-          const id = setInterval(callback, delay2 * 1e3);
-          return () => clearInterval(id);
-        }
-      },
-      useDeepCompare([delay2, callback])
-    );
-  }
   function isTaskResponse$1(dvResponse) {
     return "task_id" in dvResponse;
   }
@@ -52632,9 +53187,9 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
       debouncedFetchCache[selectorKey].pipe(take(1)).subscribe(resolve, reject);
     });
   }
-  function resolveValue$1(value, getter) {
+  function resolveValue(value, getter) {
     if (isResolvedDerivedVariable(value) || isResolvedDerivedDataVariable(value)) {
-      const resolvedValues = value.values.map((v2) => resolveValue$1(v2, getter));
+      const resolvedValues = value.values.map((v2) => resolveValue(v2, getter));
       return {
         ...value,
         values: resolvedValues
@@ -52656,12 +53211,15 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
       return isResolvedDerivedVariable(val) || isResolvedDerivedDataVariable(val) ? getDeps(val.values, val.deps).flat() : val;
     });
   }
+  function useTriggerIndex(variable) {
+    return Recoil_index_20(getOrRegisterTrigger(variable));
+  }
   async function resolveDerivedValue(key, variables, deps, resolvedVariables, wsClient, get2, selfTrigger) {
     const triggers = registerChildTriggers(variables, wsClient, get2);
     if (selfTrigger) {
       triggers.unshift(selfTrigger);
     }
-    const values = resolvedVariables.map((v2) => resolveValue$1(v2, get2));
+    const values = resolvedVariables.map((v2) => resolveValue(v2, get2));
     const depsValues = getDeps(values);
     const variableValueMap = variables.reduce((acc, v2, idx) => {
       if (!isVariable(v2)) {
@@ -53624,18 +54182,6 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     escapePathComponent,
     unescapePathComponent
   });
-  function onTokenChange(cb) {
-    return store.subscribe(getTokenKey(), cb);
-  }
-  function getSessionToken() {
-    return store.getValueSync(getTokenKey());
-  }
-  function setSessionToken(token) {
-    store.setValue(getTokenKey(), token);
-  }
-  function useSessionToken() {
-    return React__namespace.useSyncExternalStore(onTokenChange, getSessionToken);
-  }
   const STORE_EXTRAS_MAP = /* @__PURE__ */ new Map();
   const STORE_VARIABLE_MAP = /* @__PURE__ */ new Map();
   const STORE_SEQUENCE_MAP = /* @__PURE__ */ new Map();
@@ -53775,303 +54321,117 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
         return () => {
           valueSub.unsubscribe();
           patchSub.unsubscribe();
-        };
-      },
-      [client, applyPatchesToAtoms]
-    );
-    return /* @__PURE__ */ React__namespace.createElement(RecoilSync_index_1, { listen: listenToStoreChanges, read: getStoreValue, storeKey: "BackendStore", write: syncStoreValues }, children);
-  }
-  function backendStoreEffect(variable, requestExtras) {
-    STORE_EXTRAS_MAP.set(variable.store.uid, requestExtras);
-    if (!STORE_VARIABLE_MAP.has(variable.store.uid)) {
-      STORE_VARIABLE_MAP.set(variable.store.uid, /* @__PURE__ */ new Set());
-    }
-    STORE_VARIABLE_MAP.get(variable.store.uid).add(variable.uid);
-    return RecoilSync_index_2({
-      itemKey: variable.store.uid,
-      refine: Refine_index_6(),
-      storeKey: "BackendStore",
-      write({ write: write2 }, newValue) {
-        if (variable.store.readonly) {
-          return;
-        }
-        if (newValue instanceof Recoil_index_1) {
-          return;
-        }
-        write2(variable.store.uid, newValue);
-      }
-    });
-  }
-  function getSessionKey(uid2) {
-    if (isEmbedded()) {
-      return `dara-session-${window.frameElement.dataset.daraPageId}-var-${uid2}`;
-    }
-    return `dara-session-${getSessionToken()}-var-${uid2}`;
-  }
-  function BrowserStoreSync({ children }) {
-    const getStoreValue = React__namespace.useCallback((itemKey) => {
-      var _a;
-      const key = getSessionKey(itemKey);
-      return JSON.parse((_a = localStorage.getItem(key)) != null ? _a : "null");
-    }, []);
-    const syncStoreValues = React__namespace.useCallback(({ diff }) => {
-      for (const [itemKey, value] of diff.entries()) {
-        const key = getSessionKey(itemKey);
-        localStorage.setItem(key, JSON.stringify(value));
-      }
-    }, []);
-    const listenToStoreChanges = React__namespace.useCallback(({ updateItem }) => {
-      const listener2 = (e2) => {
-        var _a;
-        if (e2.storageArea === localStorage) {
-          if (e2.key) {
-            const match2 = e2.key.match(/^dara-session-(.*)-var-(.*)$/);
-            if (match2) {
-              const [, sessionToken, uid2] = match2;
-              if (sessionToken === getSessionToken()) {
-                updateItem(uid2, JSON.parse((_a = e2.newValue) != null ? _a : "null"));
-              }
-            }
-          }
-        }
-      };
-      window.addEventListener("storage", listener2);
-      return () => {
-        window.removeEventListener("storage", listener2);
-      };
-    }, []);
-    return /* @__PURE__ */ React__namespace.createElement(RecoilSync_index_1, { listen: listenToStoreChanges, read: getStoreValue, storeKey: "BrowserStore", write: syncStoreValues }, children);
-  }
-  function localStorageEffect(variable, extrasSerializable, wsClient, taskContext) {
-    let firstRun = false;
-    return RecoilSync_index_2({
-      itemKey: variable.uid,
-      read: ({ read: read2 }) => {
-        const readValue = read2(variable.uid);
-        if (!firstRun) {
-          firstRun = true;
-          if (!readValue) {
-            const isDefaultDerived = isDerivedVariable(variable.default);
-            return isDefaultDerived ? getOrRegisterDerivedVariableValue(
-              variable.default,
-              wsClient,
-              taskContext,
-              extrasSerializable.extras
-            ) : variable.default;
-          }
-        }
-        return readValue;
-      },
-      refine: Refine_index_6(),
-      storeKey: "BrowserStore"
-    });
-  }
-  const STORES = {
-    BackendStore: {
-      effect: backendStoreEffect,
-      sync: BackendStoreSync
-    },
-    BrowserStore: {
-      effect: localStorageEffect,
-      sync: BrowserStoreSync
-    }
-  };
-  function getEffect(variable) {
-    var _a, _b, _c;
-    const storeName = (_a = variable.store) == null ? void 0 : _a.__typename;
-    if (!storeName) {
-      return null;
-    }
-    return (_c = (_b = STORES[storeName]) == null ? void 0 : _b.effect) != null ? _c : null;
-  }
-  function StoreProviders({ children }) {
-    return /* @__PURE__ */ React__namespace.createElement(BackendStoreSync, null, /* @__PURE__ */ React__namespace.createElement(BrowserStoreSync, null, children));
-  }
-  const _StateSynchronizer = class {
-    constructor() {
-      __privateAdd(this, _observers, /* @__PURE__ */ new Map());
-    }
-    static getInstance() {
-      if (!__privateGet(_StateSynchronizer, _instance)) {
-        __privateSet(_StateSynchronizer, _instance, new _StateSynchronizer());
-      }
-      return __privateGet(_StateSynchronizer, _instance);
-    }
-    register(key, defaultValue) {
-      if (!__privateGet(this, _observers).has(key)) {
-        __privateGet(this, _observers).set(key, new BehaviorSubject({ type: "initial", value: defaultValue }));
-      }
-    }
-    isRegistered(key) {
-      return __privateGet(this, _observers).has(key);
-    }
-    getCurrentState(key) {
-      if (!this.isRegistered(key)) {
-        return null;
-      }
-      return __privateGet(this, _observers).get(key).getValue();
-    }
-    subscribe(key, subscription) {
-      if (!this.isRegistered(key)) {
-        this.register(key, null);
-      }
-      const sub = __privateGet(this, _observers).get(key).subscribe(subscription);
-      return () => {
-        sub.unsubscribe();
-        if (__privateGet(this, _observers).get(key).observers.length === 0) {
-          __privateGet(this, _observers).delete(key);
-        }
-      };
-    }
-    notify(key, update) {
-      if (!this.isRegistered(key)) {
-        this.register(key, null);
-      }
-      __privateGet(this, _observers).get(key).next(update);
-    }
-  };
-  let StateSynchronizer = _StateSynchronizer;
-  _instance = new WeakMap();
-  _observers = new WeakMap();
-  __privateAdd(StateSynchronizer, _instance, void 0);
-  function getOrRegisterPlainVariable(variable, wsClient, taskContext, extras) {
-    const isNested = variable.nested && variable.nested.length > 0;
-    const isDefaultDerived = isDerivedVariable(variable.default);
-    if (!atomFamilyRegistry.has(variable.uid)) {
-      atomFamilyRegistry.set(
-        variable.uid,
-        Recoil_index_10({
-          default: isDefaultDerived ? (extrasSerializable2) => getOrRegisterDerivedVariableValue(
-            variable.default,
-            wsClient,
-            taskContext,
-            extrasSerializable2.extras
-          ) : variable.default,
-          effects: (extrasSerializable2) => {
-            const familySync = ({ onSet, setSelf, resetSelf, node }) => {
-              if (!StateSynchronizer.getInstance().isRegistered(variable.uid)) {
-                StateSynchronizer.getInstance().register(variable.uid, variable.default);
-              } else {
-                const currentState = StateSynchronizer.getInstance().getCurrentState(variable.uid);
-                if (!isDefaultDerived || (currentState == null ? void 0 : currentState.type) !== "initial") {
-                  setSelf(currentState == null ? void 0 : currentState.value);
-                }
-              }
-              const unsub = StateSynchronizer.getInstance().subscribe(variable.uid, (update) => {
-                if (update.type === "initial") {
-                  return;
-                }
-                if (update.nodeKey === node.key) {
-                  return;
-                }
-                if (update.isReset) {
-                  resetSelf();
-                } else {
-                  setSelf(update.value);
-                }
-              });
-              onSet((newValue, oldValue, isReset) => {
-                StateSynchronizer.getInstance().notify(variable.uid, {
-                  isReset,
-                  nodeKey: node.key,
-                  oldValue,
-                  type: "update",
-                  value: newValue
-                });
-              });
-              return unsub;
-            };
-            const effects = [familySync];
-            const storeEffect = getEffect(variable);
-            if (storeEffect) {
-              effects.push(storeEffect(variable, extrasSerializable2, wsClient, taskContext));
-            } else {
-              if (variable.persist_value || isEmbedded()) {
-                effects.push(
-                  STORES.BrowserStore.effect(variable, extrasSerializable2, wsClient, taskContext)
-                );
-              }
-            }
-            return effects;
-          },
-          key: variable.uid
-        })
-      );
-    }
-    const family = atomFamilyRegistry.get(variable.uid);
-    const extrasSerializable = new RequestExtrasSerializable(extras);
-    const atomInstance = family(extrasSerializable);
-    if (!atomFamilyMembersRegistry.has(family)) {
-      atomFamilyMembersRegistry.set(family, /* @__PURE__ */ new Map());
+        };
+      },
+      [client, applyPatchesToAtoms]
+    );
+    return /* @__PURE__ */ React__namespace.createElement(RecoilSync_index_1, { listen: listenToStoreChanges, read: getStoreValue, storeKey: "BackendStore", write: syncStoreValues }, children);
+  }
+  function backendStoreEffect(variable, requestExtras) {
+    STORE_EXTRAS_MAP.set(variable.store.uid, requestExtras);
+    if (!STORE_VARIABLE_MAP.has(variable.store.uid)) {
+      STORE_VARIABLE_MAP.set(variable.store.uid, /* @__PURE__ */ new Set());
     }
-    atomFamilyMembersRegistry.get(family).set(extrasSerializable.toJSON(), atomInstance);
-    if (isNested) {
-      const key = getRegistryKey(variable, "selector");
-      if (!selectorFamilyRegistry.has(key)) {
-        selectorFamilyRegistry.set(
-          key,
-          Recoil_index_11({
-            get: (currentExtras) => ({ get: get2 }) => {
-              const variableValue = get2(family(currentExtras));
-              return resolveNested(
-                variableValue,
-                variable.nested.map((n2) => String(n2))
-              );
-            },
-            key,
-            set: (currentExtras) => ({ set: set2 }, newValue) => {
-              set2(
-                family(currentExtras),
-                (v2) => setNested(
-                  v2,
-                  variable.nested.map((n2) => String(n2)),
-                  newValue
-                )
-              );
-            }
-          })
-        );
+    STORE_VARIABLE_MAP.get(variable.store.uid).add(variable.uid);
+    return RecoilSync_index_2({
+      itemKey: variable.store.uid,
+      refine: Refine_index_6(),
+      storeKey: "BackendStore",
+      write({ write: write2 }, newValue) {
+        if (variable.store.readonly) {
+          return;
+        }
+        if (newValue instanceof Recoil_index_1) {
+          return;
+        }
+        write2(variable.store.uid, newValue);
       }
-      const selectorFamilyInstance = selectorFamilyRegistry.get(key);
-      return selectorFamilyInstance(extrasSerializable);
+    });
+  }
+  function getSessionKey(uid2) {
+    if (isEmbedded()) {
+      return `dara-session-${window.frameElement.dataset.daraPageId}-var-${uid2}`;
     }
-    return atomInstance;
+    return `dara-session-${getSessionToken()}-var-${uid2}`;
   }
-  function useDeferLoadable(loadable) {
-    const { suspend } = useFallbackCtx();
-    const [availableState, setAvailableState] = React.useState(() => loadable.getValue());
-    const timerId = React.useRef(null);
-    const isFirstRender = React.useRef(true);
-    const [showFallback, setShowFallback] = React.useState(false);
-    React.useEffect(() => {
-      if (isFirstRender.current) {
-        isFirstRender.current = false;
-        return;
-      }
-      if (loadable.state === "loading" && typeof suspend === "number") {
-        timerId.current = setTimeout(() => {
-          setShowFallback(true);
-        }, suspend);
+  function BrowserStoreSync({ children }) {
+    const getStoreValue = React__namespace.useCallback((itemKey) => {
+      var _a;
+      const key = getSessionKey(itemKey);
+      return JSON.parse((_a = localStorage.getItem(key)) != null ? _a : "null");
+    }, []);
+    const syncStoreValues = React__namespace.useCallback(({ diff }) => {
+      for (const [itemKey, value] of diff.entries()) {
+        const key = getSessionKey(itemKey);
+        localStorage.setItem(key, JSON.stringify(value));
       }
-      return () => {
-        if (timerId.current) {
-          clearTimeout(timerId.current);
+    }, []);
+    const listenToStoreChanges = React__namespace.useCallback(({ updateItem }) => {
+      const listener2 = (e2) => {
+        var _a;
+        if (e2.storageArea === localStorage) {
+          if (e2.key) {
+            const match2 = e2.key.match(/^dara-session-(.*)-var-(.*)$/);
+            if (match2) {
+              const [, sessionToken, uid2] = match2;
+              if (sessionToken === getSessionToken()) {
+                updateItem(uid2, JSON.parse((_a = e2.newValue) != null ? _a : "null"));
+              }
+            }
+          }
         }
       };
-    }, [loadable.state, suspend]);
-    React.useEffect(() => {
-      if (loadable.state === "hasValue") {
-        if (timerId.current) {
-          clearTimeout(timerId.current);
+      window.addEventListener("storage", listener2);
+      return () => {
+        window.removeEventListener("storage", listener2);
+      };
+    }, []);
+    return /* @__PURE__ */ React__namespace.createElement(RecoilSync_index_1, { listen: listenToStoreChanges, read: getStoreValue, storeKey: "BrowserStore", write: syncStoreValues }, children);
+  }
+  function localStorageEffect(variable, extrasSerializable, wsClient, taskContext) {
+    let firstRun = false;
+    return RecoilSync_index_2({
+      itemKey: variable.uid,
+      read: ({ read: read2 }) => {
+        const readValue = read2(variable.uid);
+        if (!firstRun) {
+          firstRun = true;
+          if (!readValue) {
+            const isDefaultDerived = isDerivedVariable(variable.default);
+            return isDefaultDerived ? getOrRegisterDerivedVariableValue(
+              variable.default,
+              wsClient,
+              taskContext,
+              extrasSerializable.extras
+            ) : variable.default;
+          }
         }
-        setShowFallback(false);
-        setAvailableState(loadable.valueOrThrow());
-      }
-    }, [loadable]);
-    if (suspend === true || showFallback) {
-      return loadable.getValue();
+        return readValue;
+      },
+      refine: Refine_index_6(),
+      storeKey: "BrowserStore"
+    });
+  }
+  const STORES = {
+    BackendStore: {
+      effect: backendStoreEffect,
+      sync: BackendStoreSync
+    },
+    BrowserStore: {
+      effect: localStorageEffect,
+      sync: BrowserStoreSync
     }
-    return availableState;
+  };
+  function getEffect(variable) {
+    var _a, _b, _c;
+    const storeName = (_a = variable.store) == null ? void 0 : _a.__typename;
+    if (!storeName) {
+      return null;
+    }
+    return (_c = (_b = STORES[storeName]) == null ? void 0 : _b.effect) != null ? _c : null;
+  }
+  function StoreProviders({ children }) {
+    return /* @__PURE__ */ React__namespace.createElement(BackendStoreSync, null, /* @__PURE__ */ React__namespace.createElement(BrowserStoreSync, null, children));
   }
   function warnUpdateOnDerivedState() {
     console.warn("You tried to call update on variable with derived state, this is a noop and will be ignored.");
@@ -54135,19 +54495,6 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     const deferred = useDeferLoadable(loadable);
     return [deferred, setLoadable];
   }
-  function useActionRegistry() {
-    const { actionRegistry: actions } = React.useContext(registriesCtx);
-    const get2 = React.useCallback(
-      (impl) => {
-        if (actions && actions[impl.name]) {
-          return actions[impl.name];
-        }
-        throw new Error(`Attempted to load an action (${impl.name}) that is not in the registry`);
-      },
-      [actions]
-    );
-    return React.useMemo(() => ({ get: get2 }), [get2]);
-  }
   async function invokeAction(input, executionId, annotatedAction, actionCtx) {
     const resolvedKwargs = Object.keys(annotatedAction.dynamic_kwargs).reduce(
       (acc, k2) => {
@@ -54190,6 +54537,9 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
     }
   }
   const ACTION_HANDLER_BY_NAME = {};
+  function clearActionHandlerCache_TEST() {
+    Object.keys(ACTION_HANDLER_BY_NAME).forEach((k2) => delete ACTION_HANDLER_BY_NAME[k2]);
+  }
   class UnhandledActionError extends Error {
     constructor(message, actionImpl) {
       super(message);
@@ -54334,350 +54684,42 @@ You must set sticky: 'left' | 'right' for the '${bugWithUnderColumnsSticky.Heade
             cbInterface.set(loadingVariable, true);
           }
           const fullActionContext = {
-            ...actionCtx.current,
-            input,
-            onUnhandledAction: (_a = optionsRef.current) == null ? void 0 : _a.onUnhandledAction,
-            gotoSnapshot: cbInterface.gotoSnapshot,
-            refresh: cbInterface.refresh,
-            reset: cbInterface.reset,
-            set: cbInterface.set,
-            snapshot: cbInterface.snapshot,
-            transact_UNSTABLE: cbInterface.transact_UNSTABLE
-          };
-          try {
-            await executeAction(input, actionToExecute, fullActionContext, getAction, importers);
-          } catch (error) {
-            console.error(error);
-            let message = "Try again or contact the application owner";
-            if (error instanceof UnhandledActionError) {
-              message = error.message;
-            }
-            actionCtx.current.notificationCtx.pushNotification({
-              key: "_actionError",
-              message,
-              status: Status.ERROR,
-              title: "Error executing action"
-            });
-          }
-          if (loadingVariable) {
-            cbInterface.set(loadingVariable, false);
-          }
-        }
-      },
-      [action, getAction, importers]
-    );
-    if (!action) {
-      return noop;
-    }
-    return callback;
-  }
-  function useComponentRegistry(maxRetries = 5) {
-    const { componentRegistry: components, refetchComponents } = React.useContext(registriesCtx);
-    const extras = useRequestExtras();
-    const get2 = React.useCallback(
-      async (instance) => {
-        let component = null;
-        let registry = { ...components };
-        let i2 = 0;
-        while (i2 < maxRetries) {
-          if (registry && registry[instance.name]) {
-            component = registry[instance.name];
-            break;
-          }
-          if (i2 === 0) {
-            const res = await request(
-              `/api/core/components?name=${instance.name}`,
-              { method: HTTP_METHOD.GET },
-              extras
-            );
-            await handleAuthErrors(res, true);
-            await validateResponse(res, "Failed to fetch the config for this app");
-            registry = await res.json();
-          } else {
-            await new Promise((resolve) => setTimeout(resolve, 500));
-            const { data } = await refetchComponents();
-            registry = data;
-          }
-          i2++;
-        }
-        if (!component) {
-          throw new Error(`Attempted to load a component (${instance.name}) that is not in the registry`);
-        }
-        return component;
-      },
-      [components]
-    );
-    return { get: get2 };
-  }
-  function useWindowTitle(pageTitle) {
-    const { data: config2 } = useConfig();
-    React.useEffect(() => {
-      if (!config2) {
-        return;
-      }
-      if (!pageTitle) {
-        document.title = config2.title;
-        return;
-      }
-      document.title = `${config2.title} - ${pageTitle}`;
-    }, [config2, config2 == null ? void 0 : config2.title, pageTitle]);
-  }
-  const all_min = "";
-  const BaseRawCssInject = styled__default.default.div`
-    ${(props) => props.$rawCss}
-`;
-  function injectCss(component) {
-    if (typeof component === "string") {
-      if (component === "div") {
-        return BaseRawCssInject;
-      }
-      return BaseRawCssInject.withComponent(component);
-    }
-    return styled__default.default(component)`
-        ${(props) => props.$rawCss}
-    `;
-  }
-  const Icon = injectCss("i");
-  function getIcon(icon2) {
-    let iconClasses = icon2;
-    if (typeof icon2 === "string" && !icon2.includes("fa-")) {
-      const inferredIconName = icon2.replace(/([A-Z])/g, " $1").trim().toLowerCase().split(" ").join("-");
-      iconClasses = `fa-solid fa-${inferredIconName}`;
-      console.warn(
-        `Invalid fontawesome class string "${icon2}" provided to getIcon(). This behaviour is deprecated and will be removed in the next version, please use "dara_core.css.get_icon" method. 
-Inferred class string: "${iconClasses}."`
-      );
-    }
-    return (props) => {
-      var _a;
-      return /* @__PURE__ */ React__default.default.createElement(Icon, { ...props, className: `${String((_a = props.className) != null ? _a : "")} ${iconClasses}` });
-    };
-  }
-  function flexStyles(props, displayCtx2, useDisplayContext) {
-    let flexBasis = props.basis;
-    let flexShrink = props.shrink;
-    let flexGrow = props.grow;
-    if (useDisplayContext) {
-      if (props.width && displayCtx2.direction === "horizontal") {
-        flexBasis != null ? flexBasis : flexBasis = props.width;
-        flexShrink != null ? flexShrink : flexShrink = "0";
-        flexGrow != null ? flexGrow : flexGrow = "0";
-      }
-      if (props.height && displayCtx2.direction === "vertical") {
-        flexBasis != null ? flexBasis : flexBasis = props.height;
-        flexShrink != null ? flexShrink : flexShrink = "0";
-        flexGrow != null ? flexGrow : flexGrow = "0";
-      }
-    }
-    if (props.hug || props.hug !== false && displayCtx2.hug) {
-      flexBasis != null ? flexBasis : flexBasis = "content";
-      flexShrink != null ? flexShrink : flexShrink = "1";
-      flexGrow != null ? flexGrow : flexGrow = "0";
-    }
-    return { flexBasis, flexGrow, flexShrink };
-  }
-  function parseRawCss(rawCss) {
-    const isRawObject = typeof rawCss === "object" && rawCss !== null && rawCss !== void 0;
-    const componentCss = !isRawObject && typeof rawCss === "string" ? rawCss : "";
-    const styles2 = isRawObject ? rawCss : {};
-    return [styles2, componentCss];
-  }
-  function useComponentStyles(props, useDisplayContext = true) {
-    const [rawStyles, rawCss] = parseRawCss(props.raw_css);
-    const displayCtx$1 = React.useContext(displayCtx);
-    const flexProps = flexStyles(props, displayCtx$1, useDisplayContext);
-    const styles2 = React.useMemo(() => {
-      var _a;
-      const stylesObj = {
-        backgroundColor: props.background,
-        border: props.border,
-        borderRadius: props.border_radius,
-        color: props.color,
-        fontFamily: props.font,
-        fontSize: props.font_size,
-        fontStyle: props.italic ? "italic" : "normal",
-        fontWeight: props.bold ? "bold" : "normal",
-        gap: props.gap,
-        height: props.height,
-        margin: props.margin,
-        maxHeight: props.max_height,
-        maxWidth: props.max_width,
-        minHeight: props.min_height,
-        minWidth: props.min_width,
-        overflow: props.overflow,
-        padding: props.padding,
-        position: props.position,
-        textDecoration: props.underline ? "underline" : "none",
-        width: props.width,
-        ...flexProps,
-        ...rawStyles,
-        ...(_a = props.style) != null ? _a : {}
-      };
-      return Object.fromEntries(Object.entries(stylesObj).filter(([, v2]) => v2 !== null && v2 !== void 0));
-    }, [useDeepCompare(props)]);
-    return [styles2, rawCss];
-  }
-  function useUrlSync(options) {
-    const urlSerializer = React.useCallback((val) => {
-      if (val === void 0 || val === null) {
-        return "";
-      }
-      if (["string", "number", "boolean"].includes(typeof val)) {
-        return String(val);
-      }
-      return JSON.stringify(val);
-    }, []);
-    const urlDeserializer = React.useCallback((val) => {
-      if (val === "") {
-        return void 0;
-      }
-      try {
-        return JSON.parse(val);
-      } catch {
-        return val;
-      }
-    }, []);
-    const listenChangeURL = React.useCallback((handler) => {
-      const unregister = options.history.listen(() => {
-        handler();
-      });
-      return () => unregister();
-    }, []);
-    const memoryOptions = {
-      getURL: () => {
-        return window.location.origin + options.history.location.pathname + options.history.location.search;
-      },
-      pushURL: (url) => {
-        options.history.push(url.replace(window.location.origin, ""));
-      },
-      replaceURL: (url) => {
-        options.history.replace(url.replace(window.location.origin, ""));
-      }
-    };
-    return {
-      browserInterface: {
-        listenChangeURL,
-        ...options.memory_TEST ? memoryOptions : {}
-      },
-      deserialize: urlDeserializer,
-      location: { part: "queryParams" },
-      serialize: urlSerializer
-    };
-  }
-  const Wrapper$2 = styled__default.default.div`
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    width: 100%;
-    height: 100%;
-`;
-  const FlashingDots = styled__default.default.div`
-    position: relative;
-
-    width: 10px;
-    height: 10px;
-
-    color: ${(props) => props.theme.colors.grey4};
-
-    background-color: ${(props) => props.theme.colors.grey4};
-    border-radius: 5px;
-
-    animation: dot-flashing 1s infinite linear alternate;
-    animation-delay: 0.5s;
-
-    &::before,
-    &::after {
-        content: '';
-        position: absolute;
-        top: 0;
-        display: inline-block;
-    }
-
-    &::before {
-        left: -15px;
-
-        width: 10px;
-        height: 10px;
-
-        color: ${(props) => props.theme.colors.grey4};
-
-        background-color: ${(props) => props.theme.colors.grey4};
-        border-radius: 5px;
-
-        animation: dot-flashing 1s infinite alternate;
-        animation-delay: 0s;
-    }
-
-    &::after {
-        left: 15px;
-
-        width: 10px;
-        height: 10px;
-
-        color: ${(props) => props.theme.colors.grey4};
-
-        background-color: ${(props) => props.theme.colors.grey4};
-        border-radius: 5px;
-
-        animation: dot-flashing 1s infinite alternate;
-        animation-delay: 1s;
-    }
-
-    @keyframes dot-flashing {
-        0% {
-            background-color: ${(props) => props.theme.colors.grey4};
-        }
-
-        50%,
-        100% {
-            background-color: ${(props) => props.theme.colors.grey3};
-        }
-    }
-`;
-  function Dots(props) {
-    return /* @__PURE__ */ React__default.default.createElement(Wrapper$2, { className: props.className, style: props.style }, /* @__PURE__ */ React__default.default.createElement(FlashingDots, { "data-testid": "LOADING" }));
-  }
-  const StyledDots$1 = injectCss(Dots);
-  function DefaultFallback(props) {
-    const [style, css2] = useComponentStyles(props);
-    return /* @__PURE__ */ React__default.default.createElement(StyledDots$1, { $rawCss: css2, style });
-  }
-  const Center = styled__default.default.div`
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-
-    width: 100%;
-    height: 100%;
-
-    background: ${(props) => props.colored ? props.theme.colors.blue1 : ""};
-`;
-  const CenteredDivWithGap = styled__default.default(Center)`
-    gap: 0.6rem;
-    margin: 10px;
-    text-align: center;
-`;
-  const errorMessages = {
-    "403": {
-      description: "You are not authorised to access this application. Please contact the application owner to enable access.",
-      styling: "error",
-      title: "We were not able to authenticate you"
-    },
-    default: {
-      description: "Your login session may have expired. Try again.",
-      styling: "primary",
-      title: "We were not able to authenticate you"
+            ...actionCtx.current,
+            input,
+            onUnhandledAction: (_a = optionsRef.current) == null ? void 0 : _a.onUnhandledAction,
+            gotoSnapshot: cbInterface.gotoSnapshot,
+            refresh: cbInterface.refresh,
+            reset: cbInterface.reset,
+            set: cbInterface.set,
+            snapshot: cbInterface.snapshot,
+            transact_UNSTABLE: cbInterface.transact_UNSTABLE
+          };
+          try {
+            await executeAction(input, actionToExecute, fullActionContext, getAction, importers);
+          } catch (error) {
+            console.error(error);
+            let message = "Try again or contact the application owner";
+            if (error instanceof UnhandledActionError) {
+              message = error.message;
+            }
+            actionCtx.current.notificationCtx.pushNotification({
+              key: "_actionError",
+              message,
+              status: Status.ERROR,
+              title: "Error executing action"
+            });
+          }
+          if (loadingVariable) {
+            cbInterface.set(loadingVariable, false);
+          }
+        }
+      },
+      [action, getAction, importers]
+    );
+    if (!action) {
+      return noop;
     }
-  };
-  function ErrorPage() {
-    const { search } = useLocation();
-    const query = React.useMemo(() => new URLSearchParams(search), [search]);
-    const code = query.get("code");
-    const errorConfig = code && errorMessages[code] || errorMessages.default;
-    return /* @__PURE__ */ React__default.default.createElement(CenteredDivWithGap, null, /* @__PURE__ */ React__default.default.createElement("h1", null, errorConfig.title), /* @__PURE__ */ React__default.default.createElement("p", null, errorConfig.description), /* @__PURE__ */ React__default.default.createElement(Button$1, { href: "/login", styling: errorConfig.styling }, "Retry"));
+    return callback;
   }
   function PrivateRoute({ children, on_load, name }) {
     const token = useSessionToken();
@@ -54704,486 +54746,42 @@ Inferred class string: "${iconClasses}."`
   function DynamicAuthComponent(props) {
     const importers = React.useContext(importersCtx);
     const [component, setComponent] = React.useState(() => /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
-    React.useEffect(() => {
-      const importer = importers[props.component.py_module];
-      if (!importer) {
-        throw new Error(`Missing importer for module ${props.component.py_module}`);
-      }
-      importer().then((moduleContent) => {
-        if (!moduleContent) {
-          throw new Error(`Failed to import module ${props.component.py_module}`);
-        }
-        const Component = moduleContent[props.component.js_name];
-        if (!Component) {
-          throw new Error(
-            `Failed to import component ${props.component.js_name} from module ${props.component.py_module}`
-          );
-        }
-        setComponent(/* @__PURE__ */ React__default.default.createElement(Component, null));
-      }).catch((err2) => {
-        throw new Error(`Failed to import module ${props.component.py_module}`, err2);
-      });
-    }, [props.component, importers]);
-    return component;
-  }
-  function AuthWrapper(props) {
-    const { data: authConfig, isLoading } = useAuthConfig();
-    const isMounted = React.useRef(false);
-    if (!isMounted.current) {
-      isMounted.current = true;
-      setSessionToken(getToken());
-    }
-    if (isLoading) {
-      return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
-    }
-    const { login, logout, ...extraRoutes } = authConfig.auth_components;
-    return /* @__PURE__ */ React__default.default.createElement(Switch$1, null, /* @__PURE__ */ React__default.default.createElement(Route, { path: "/login" }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component: login })), /* @__PURE__ */ React__default.default.createElement(Route, { path: "/logout" }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component: logout })), Object.entries(extraRoutes).map(([path, component]) => /* @__PURE__ */ React__default.default.createElement(Route, { key: path, path: `/${path}` }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component }))), /* @__PURE__ */ React__default.default.createElement(Route, { component: ErrorPage, path: "/error" }), /* @__PURE__ */ React__default.default.createElement(Route, { path: "/", render: () => /* @__PURE__ */ React__default.default.createElement(PrivateRoute, null, props.children) }));
-  }
-  const index = "";
-  const ErrorBoundaryContext = React.createContext(null);
-  const initialState = {
-    didCatch: false,
-    error: null
-  };
-  class ErrorBoundary extends React.Component {
-    constructor(props) {
-      super(props);
-      this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
-      this.state = initialState;
-    }
-    static getDerivedStateFromError(error) {
-      return {
-        didCatch: true,
-        error
-      };
-    }
-    resetErrorBoundary() {
-      const {
-        error
-      } = this.state;
-      if (error !== null) {
-        var _this$props$onReset, _this$props;
-        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-          args[_key] = arguments[_key];
-        }
-        (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
-          args,
-          reason: "imperative-api"
-        });
-        this.setState(initialState);
-      }
-    }
-    componentDidCatch(error, info) {
-      var _this$props$onError, _this$props2;
-      (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
-    }
-    componentDidUpdate(prevProps, prevState) {
-      const {
-        didCatch
-      } = this.state;
-      const {
-        resetKeys
-      } = this.props;
-      if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
-        var _this$props$onReset2, _this$props3;
-        (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
-          next: resetKeys,
-          prev: prevProps.resetKeys,
-          reason: "keys"
-        });
-        this.setState(initialState);
-      }
-    }
-    render() {
-      const {
-        children,
-        fallbackRender,
-        FallbackComponent,
-        fallback
-      } = this.props;
-      const {
-        didCatch,
-        error
-      } = this.state;
-      let childToRender = children;
-      if (didCatch) {
-        const props = {
-          error,
-          resetErrorBoundary: this.resetErrorBoundary
-        };
-        if (typeof fallbackRender === "function") {
-          childToRender = fallbackRender(props);
-        } else if (FallbackComponent) {
-          childToRender = React.createElement(FallbackComponent, props);
-        } else if (fallback !== void 0) {
-          childToRender = fallback;
-        } else {
-          throw error;
-        }
-      }
-      return React.createElement(ErrorBoundaryContext.Provider, {
-        value: {
-          didCatch,
-          error,
-          resetErrorBoundary: this.resetErrorBoundary
-        }
-      }, childToRender);
-    }
-  }
-  function hasArrayChanged() {
-    let a2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
-    let b2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [];
-    return a2.length !== b2.length || a2.some((item, index2) => !Object.is(item, b2[index2]));
-  }
-  var baseGetTag = _baseGetTag, getPrototype = _getPrototype, isObjectLike = isObjectLike_1;
-  var objectTag = "[object Object]";
-  var funcProto = Function.prototype, objectProto = Object.prototype;
-  var funcToString = funcProto.toString;
-  var hasOwnProperty = objectProto.hasOwnProperty;
-  var objectCtorString = funcToString.call(Object);
-  function isPlainObject(value) {
-    if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
-      return false;
-    }
-    var proto = getPrototype(value);
-    if (proto === null) {
-      return true;
-    }
-    var Ctor = hasOwnProperty.call(proto, "constructor") && proto.constructor;
-    return typeof Ctor == "function" && Ctor instanceof Ctor && funcToString.call(Ctor) == objectCtorString;
-  }
-  var isPlainObject_1 = isPlainObject;
-  var baseSet = _baseSet;
-  function set(object2, path, value) {
-    return object2 == null ? object2 : baseSet(object2, path, value);
-  }
-  var set_1 = set;
-  function createMarkers(scope, loopInstanceUid) {
-    const markers = [];
-    if (scope.action) {
-      markers.push({ type: "action", path: scope.action });
-    }
-    if (scope.derivedVariable) {
-      markers.push({ type: "derived_var", path: scope.derivedVariable, loopInstanceUid });
-    }
-    if (scope.serverComponent) {
-      markers.push({ type: "server_component", path: scope.serverComponent, loopInstanceUid });
-    }
-    return markers;
-  }
-  function updateScope(scope, value, path) {
-    const newScope = { ...scope };
-    if (!scope.action && isAnnotatedAction(value)) {
-      newScope.action = path;
-    }
-    if (!scope.derivedVariable && isDerivedVariable(value)) {
-      newScope.derivedVariable = path;
-    }
-    if (!scope.serverComponent && isPyComponent(value)) {
-      newScope.serverComponent = path;
-    }
-    return newScope;
-  }
-  function getInjectionMarkers(renderer) {
-    const markers = [];
-    function walk(obj, pathSegments, scope = {}) {
-      for (const [key, value] of Object.entries(obj)) {
-        const currentPath = [...pathSegments, key];
-        const dotPath = currentPath.join(".");
-        if (isLoopVariable(value)) {
-          markers.push(
-            { path: dotPath, nested: value.nested, type: "loop_var" },
-            ...createMarkers(scope, value.uid)
-          );
-          continue;
-        }
-        if (isPlainObject_1(value) || Array.isArray(value)) {
-          const newScope = updateScope(scope, value, dotPath);
-          walk(value, [...pathSegments, key], newScope);
-        }
-      }
-    }
-    walk(renderer, []);
-    return markers;
-  }
-  function applyMarkers(renderer, markers, loopValue, itemKey) {
-    if (markers.length === 0) {
-      return renderer;
-    }
-    const clonedRenderer = cloneDeep_1(renderer);
-    for (const marker of markers) {
-      switch (marker.type) {
-        case "loop_var": {
-          set_1(clonedRenderer, marker.path, resolveNested(loopValue, marker.nested));
-          break;
-        }
-        case "action": {
-          set_1(clonedRenderer, `${marker.path}.loading.uid`, nanoid());
-          break;
-        }
-        case "derived_var": {
-          set_1(clonedRenderer, `${marker.path}.loop_instance_uid`, `${marker.loopInstanceUid}:${itemKey}`);
-          break;
-        }
-        case "server_component": {
-          set_1(clonedRenderer, `${marker.path}.loop_instance_uid`, `${marker.loopInstanceUid}:${itemKey}`);
-          break;
-        }
-      }
-    }
-    return clonedRenderer;
-  }
-  function hasMarkers(component) {
-    for (const [key, value] of Object.entries(component.props)) {
-      if (isLoopVariable(value)) {
-        return key;
-      }
-    }
-    return null;
-  }
-  const POLLING_INTERVAL = 100;
-  const FAKE_PROGRESS_INTERVAL = 100;
-  const ESTIMATE_RATIO = 0.85;
-  function estimateProgress(time, timeConstant = 10) {
-    return 1 - Math.exp(-1 * time / (FAKE_PROGRESS_INTERVAL * 10 * timeConstant));
-  }
-  function fakeProgressGenerator(progressStart, progressEnd, estimatedTime) {
-    const difference = progressEnd - progressStart;
-    const estimatedProgressUpdates = [];
-    let timeConstant = 10;
-    if (estimatedTime && estimatedTime !== 0) {
-      const estimatedDifference = ESTIMATE_RATIO * difference;
-      const estimatedProgressTime = ESTIMATE_RATIO * estimatedTime;
-      const numberOfUpdates = estimatedProgressTime / FAKE_PROGRESS_INTERVAL;
-      const estimatedProgressChunk = estimatedDifference / numberOfUpdates;
-      let t2 = 0;
-      let p2 = progressStart;
-      while (t2 < estimatedProgressTime) {
-        p2 += estimatedProgressChunk;
-        t2 += FAKE_PROGRESS_INTERVAL;
-        estimatedProgressUpdates.push(p2);
-      }
-      timeConstant = (1 - ESTIMATE_RATIO) * (estimatedTime / 1e3);
-    }
-    function* getNextUpdate() {
-      let startFrom = progressStart;
-      while (estimatedProgressUpdates.length > 0) {
-        const update = estimatedProgressUpdates.shift();
-        startFrom = update;
-        yield update;
-      }
-      let i2 = 0;
-      while (true) {
-        const estimated = estimateProgress(FAKE_PROGRESS_INTERVAL * i2, timeConstant);
-        yield estimated * (progressEnd - startFrom) + startFrom;
-        i2++;
-      }
-    }
-    return getNextUpdate();
-  }
-  const ProgressWrapper = styled__default.default.div`
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-    padding: 1rem;
-`;
-  const ProgressHeader = styled__default.default.h4`
-    font-size: 1.2rem;
-`;
-  const ProgressMessage = styled__default.default.span`
-    font-size: ${(props) => props.theme.font.size};
-`;
-  function findRunningTasks(tasksContext, variablesRef) {
-    var _a;
-    if (!(variablesRef && ((_a = variablesRef == null ? void 0 : variablesRef.current) == null ? void 0 : _a.size) > 0 && tasksContext.hasRunningTasks())) {
-      return [];
-    }
-    return tasksContext.getVariableTasks(...variablesRef.current.values());
-  }
-  function ProgressTracker(props) {
-    const taskContext = useTaskContext();
-    const { client: wsClient } = React.useContext(websocketCtx);
-    const [latestProgressUpdate, setLatestProgressUpdate] = React.useState(
-      null
-    );
-    const [progress, setProgress] = React.useState(null);
-    const fakeInterval = React.useRef(null);
-    const [subscribedTaskIds, setSubscribedTaskIds] = React.useState([]);
-    const [restartTrigger, setRestartTrigger] = React.useState(0);
-    React.useEffect(() => {
-      if (!wsClient) {
-        return;
-      }
-      let progressSubscription = null;
-      const timer2 = setInterval(() => {
-        const taskIds = findRunningTasks(taskContext, props.variablesRef);
-        if (taskIds.length > 0) {
-          setSubscribedTaskIds(taskIds);
-          progressSubscription = wsClient.progressUpdates$(...taskIds).subscribe((notif) => setLatestProgressUpdate(notif.message));
-          clearInterval(timer2);
-        }
-      }, POLLING_INTERVAL);
-      return () => {
-        clearInterval(timer2);
-        if (fakeInterval.current) {
-          clearInterval(fakeInterval.current);
-        }
-        progressSubscription == null ? void 0 : progressSubscription.unsubscribe();
-      };
-    }, [restartTrigger, wsClient]);
-    React.useEffect(() => {
-      if (!wsClient) {
-        return;
-      }
-      let subscription = null;
-      if (subscribedTaskIds.length > 0) {
-        subscription = wsClient.taskStatusUpdates$(...subscribedTaskIds).subscribe((newStatus) => {
-          if (newStatus === "CANCELED") {
-            if (fakeInterval.current) {
-              clearInterval(fakeInterval.current);
-            }
-            setLatestProgressUpdate(null);
-            setSubscribedTaskIds([]);
-            setProgress(null);
-            setRestartTrigger((v2) => v2 + 1);
-          }
-        });
-      }
-      return () => {
-        subscription == null ? void 0 : subscription.unsubscribe();
-      };
-    }, [subscribedTaskIds, wsClient]);
-    React.useEffect(() => {
-      var _a, _b;
-      if (!latestProgressUpdate) {
-        return;
-      }
-      if (fakeInterval.current) {
-        clearInterval(fakeInterval.current);
-      }
-      const shouldStartFakeProgress = latestProgressUpdate.message.startsWith("FAKE_PROGRESS__");
-      if (!shouldStartFakeProgress) {
-        setProgress({
-          message: latestProgressUpdate.message,
-          progress: latestProgressUpdate.progress
-        });
-        return;
-      }
-      const [, estimatedTime, message] = latestProgressUpdate.message.split("__");
-      setProgress({
-        message,
-        progress: (_a = progress == null ? void 0 : progress.progress) != null ? _a : 0
-      });
-      const progressGenerator = fakeProgressGenerator(
-        (_b = progress == null ? void 0 : progress.progress) != null ? _b : 0,
-        latestProgressUpdate.progress,
-        parseFloat(estimatedTime)
-      );
-      fakeInterval.current = setInterval(() => {
-        const nextValue = progressGenerator.next().value;
-        setProgress({
-          message,
-          progress: nextValue
-        });
-      }, FAKE_PROGRESS_INTERVAL);
-    }, [latestProgressUpdate]);
-    if (subscribedTaskIds.length === 0) {
-      return props.fallback;
-    }
-    return /* @__PURE__ */ React__default.default.createElement(ProgressWrapper, null, /* @__PURE__ */ React__default.default.createElement(ProgressHeader, null, "Task in progress"), progress && /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(ProgressMessage, null, progress.message), /* @__PURE__ */ React__default.default.createElement(ProgressBar, { progress: parseFloat(progress.progress.toFixed(2)) })));
-  }
-  function isSelectorError(e2) {
-    return e2 !== void 0 && e2 !== null && typeof e2 === "object" && "selectorId" in e2 && "selectorExtras" in e2;
-  }
-  const StyledErrorDisplay = styled__default.default.div`
-    display: flex;
-    gap: 1rem;
-    align-items: center;
-    justify-content: space-between;
-
-    height: min-content;
-    padding: 1rem;
-
-    background-color: ${(props) => curriedTransparentize$1(0.9, props.theme.colors.error)};
-    border-radius: 0.25rem;
-`;
-  const ErrorDisplayWrapper = injectCss(StyledErrorDisplay);
-  const IconWrapper = styled__default.default.div`
-    display: flex;
-    height: 100%;
-`;
-  const ErrorIcon = styled__default.default.i`
-    line-height: 21px;
-    color: ${(props) => props.theme.colors.error};
-`;
-  const ContentWrapper = styled__default.default.div`
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-    align-items: flex-start;
-`;
-  const ErrorContent = styled__default.default.div`
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-    color: ${(props) => props.theme.colors.error};
-`;
-  const ErrorTitle$1 = styled__default.default.h3`
-    display: flex;
-    gap: 0.375rem;
-
-    font-size: 1rem;
-    font-weight: bold;
-    line-height: 1.375rem;
-    color: ${(props) => props.theme.colors.error};
-`;
-  const ErrorText$1 = styled__default.default.span`
-    font-size: 1rem;
-    line-height: 1.375rem;
-`;
-  const RetryButton = styled__default.default.button`
-    cursor: pointer;
-
-    display: flex;
-    gap: 0.5rem;
-    align-items: center;
-    justify-content: center;
-
-    width: 40px;
-    height: 40px;
-
-    color: ${(props) => props.theme.colors.error};
-
-    background-color: inherit;
-    border: none;
-    border: 1px solid;
-    border-color: ${(props) => props.theme.colors.error};
-    border-radius: 5px;
-
-    transition-timing-function: ease;
-    transition-duration: 100ms;
-    transition-property: color, border-color;
-
-    i {
-        line-height: 21px;
-        transition: transform 400ms ease-in-out;
-    }
-
-    &:hover {
-        color: ${(props) => props.theme.colors.errorHover};
-        border-color: ${(props) => props.theme.colors.errorHover};
-
-        i {
-            transform: rotate(180deg);
+    React.useEffect(() => {
+      const importer = importers[props.component.py_module];
+      if (!importer) {
+        throw new Error(`Missing importer for module ${props.component.py_module}`);
+      }
+      importer().then((moduleContent) => {
+        if (!moduleContent) {
+          throw new Error(`Failed to import module ${props.component.py_module}`);
         }
+        const Component = moduleContent[props.component.js_name];
+        if (!Component) {
+          throw new Error(
+            `Failed to import component ${props.component.js_name} from module ${props.component.py_module}`
+          );
+        }
+        setComponent(/* @__PURE__ */ React__default.default.createElement(Component, null));
+      }).catch((err2) => {
+        throw new Error(`Failed to import module ${props.component.py_module}`, err2);
+      });
+    }, [props.component, importers]);
+    return component;
+  }
+  function AuthWrapper(props) {
+    const { data: authConfig, isLoading } = useAuthConfig();
+    const isMounted = React.useRef(false);
+    if (!isMounted.current) {
+      isMounted.current = true;
+      setSessionToken(getToken());
     }
-`;
-  function ErrorDisplay$1(props) {
-    var _a, _b, _c, _d, _e2;
-    const [styles2, css2] = parseRawCss((_a = props.config) == null ? void 0 : _a.raw_css);
-    const defaultMessage = props.error instanceof UserError ? props.error.message : "Try again or contact the application owner.";
-    return /* @__PURE__ */ React__default.default.createElement(ErrorDisplayWrapper, { $rawCss: css2, style: styles2 }, /* @__PURE__ */ React__default.default.createElement(ContentWrapper, null, /* @__PURE__ */ React__default.default.createElement(ErrorContent, null, /* @__PURE__ */ React__default.default.createElement(ErrorTitle$1, null, /* @__PURE__ */ React__default.default.createElement(IconWrapper, null, /* @__PURE__ */ React__default.default.createElement(ErrorIcon, { "aria-hidden": true, className: "fa-solid fa-circle-xmark fa-lg" })), (_c = (_b = props == null ? void 0 : props.config) == null ? void 0 : _b.title) != null ? _c : "Error"), /* @__PURE__ */ React__default.default.createElement(ErrorText$1, null, (_e2 = (_d = props == null ? void 0 : props.config) == null ? void 0 : _d.description) != null ? _e2 : defaultMessage))), props.resetErrorBoundary && /* @__PURE__ */ React__default.default.createElement(RetryButton, { onClick: () => props.resetErrorBoundary(props.error), type: "button" }, /* @__PURE__ */ React__default.default.createElement("i", { "aria-hidden": true, className: "fa-solid fa-rotate fa-xl" })));
+    if (isLoading) {
+      return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
+    }
+    const { login, logout, ...extraRoutes } = authConfig.auth_components;
+    return /* @__PURE__ */ React__default.default.createElement(Switch$1, null, /* @__PURE__ */ React__default.default.createElement(Route, { path: "/login" }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component: login })), /* @__PURE__ */ React__default.default.createElement(Route, { path: "/logout" }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component: logout })), Object.entries(extraRoutes).map(([path, component]) => /* @__PURE__ */ React__default.default.createElement(Route, { key: path, path: `/${path}` }, /* @__PURE__ */ React__default.default.createElement(DynamicAuthComponent, { component }))), /* @__PURE__ */ React__default.default.createElement(Route, { component: ErrorPage, path: "/error" }), /* @__PURE__ */ React__default.default.createElement(Route, { path: "/", render: () => /* @__PURE__ */ React__default.default.createElement(PrivateRoute, null, props.children) }));
   }
+  const index = "";
   function useDataVariable(variable) {
     const extras = useRequestExtras();
     const { client: wsClient } = React.useContext(websocketCtx);
@@ -55300,21 +54898,6 @@ Inferred class string: "${iconClasses}."`
       [variable.uid, useDeepCompare(taskContext), client, search, extras]
     );
   }
-  function resolveValue(value, force) {
-    if (isResolvedDerivedVariable(value) || isResolvedDerivedDataVariable(value)) {
-      const { deps, ...rest } = value;
-      const resolvedValues = value.values.map((v2) => resolveValue(v2, force));
-      return {
-        ...rest,
-        force,
-        values: resolvedValues
-      };
-    }
-    if (typeof value === "function") {
-      return resolveValue(value(), force);
-    }
-    return value;
-  }
   function useRefreshSelector() {
     return Recoil_index_31(({ refresh }) => {
       return (key, extras) => {
@@ -55349,6 +54932,229 @@ Inferred class string: "${iconClasses}."`
       };
     }, []);
   }
+  const Wrapper$1 = styled__default.default.div`
+    display: flex;
+    flex: 1 1 0%;
+    flex-direction: column;
+    justify-content: center;
+
+    min-height: 100%;
+
+    background: ${(props) => `radial-gradient(circle closest-corner at 50% 40%, ${curriedTransparentize$1(
+    0.9,
+    props.theme.colors.background
+  )} 0%, ${curriedTransparentize$1(
+    0.8,
+    props.theme.colors.blue4
+  )} 70%),radial-gradient(circle closest-corner at 20% 150%, ${curriedTransparentize$1(
+    0.8,
+    props.theme.colors.error
+  )} 0%, ${curriedTransparentize$1(0.2, props.theme.colors.blue4)} 230%)`};
+`;
+  const Card = styled__default.default.div`
+    padding: 1.5rem;
+
+    color: ${(props) => props.theme.colors.text};
+
+    background-color: ${(props) => props.theme.colors.blue1};
+    border-radius: 1rem;
+    box-shadow: ${(props) => props.theme.shadow.medium};
+
+    @media (width >= 640px) {
+        width: 100%;
+        max-width: 24rem;
+        margin-right: auto;
+        margin-left: auto;
+    }
+`;
+  const FormWrapper = styled__default.default.div`
+    margin-top: 1.5rem;
+`;
+  const Form = styled__default.default.form`
+    > * + * {
+        margin-top: 1.5rem;
+    }
+`;
+  const ErrorText$1 = styled__default.default.h3`
+    margin: 0;
+
+    font-size: 0.875rem;
+    font-weight: 500;
+    line-height: 1.25rem;
+    color: ${(props) => props.theme.colors.error};
+    letter-spacing: 0.025em;
+
+    visibility: ${(props) => props.$hidden ? "hidden" : "visible"};
+`;
+  const Label = styled__default.default.label`
+    font-weight: 500;
+    line-height: 1.5rem;
+`;
+  const StyledInput = styled__default.default.input`
+    display: flex;
+    display: block;
+    align-items: center;
+
+    width: 100%;
+    height: 2.5rem;
+    margin-top: 0.5rem;
+    padding: 0 1rem;
+
+    font-size: 1rem;
+    line-height: 1.5rem;
+    color: ${(props) => props.theme.colors.text};
+
+    background-color: ${(props) => props.theme.colors.blue1};
+    border: none;
+    border-radius: 0.25rem;
+    outline: none;
+    box-shadow:
+        inset 0 0 0 0 ${(props) => props.theme.colors.blue1},
+        inset 0 0 0 1px ${(props) => props.$error ? props.theme.colors.error : props.theme.colors.grey2},
+        0 1px 2px 0 rgb(0 0 0 / 5%);
+
+    :active,
+    :focus {
+        box-shadow:
+            inset 0 0 0 0 ${(props) => props.theme.colors.blue1},
+            inset 0 0 0 2px ${(props) => props.$error ? props.theme.colors.error : props.theme.colors.primary},
+            0 1px 2px 0 rgb(0 0 0 / 5%);
+    }
+`;
+  const StyledButton = styled__default.default(Button$1)`
+    width: 100%;
+    font-weight: 600;
+    line-height: 1.5rem;
+    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%);
+
+    :active,
+    :focus {
+        outline-color: ${(props) => props.theme.colors.primary};
+        outline-width: 2px;
+        outline-offset: 2px;
+    }
+`;
+  function BasicAuthLogin() {
+    var _a;
+    const [isVerifyingToken, setIsVerifyingToken] = React.useState(true);
+    const [isLoggingIn, setIsLoggingIn] = React.useState(false);
+    const [username, setUsername] = React.useState("");
+    const [password, setPassword] = React.useState("");
+    const [isError2, setIsError] = React.useState(false);
+    const history2 = useHistory();
+    const location2 = useLocation();
+    const queryParams = new URLSearchParams(location2.search);
+    const previousLocation = (_a = queryParams.get("referrer")) != null ? _a : "/";
+    const login = async () => {
+      setIsLoggingIn(true);
+      setIsError(false);
+      try {
+        const sessionToken = await requestSessionToken({ password, username });
+        if (sessionToken) {
+          setSessionToken(sessionToken);
+          history2.replace(decodeURIComponent(previousLocation));
+        }
+      } catch {
+        setIsError(true);
+      }
+      setIsLoggingIn(false);
+    };
+    React.useEffect(() => {
+      if (getSessionToken()) {
+        verifySessionToken().then((verified) => {
+          if (verified) {
+            history2.replace(decodeURIComponent(previousLocation));
+          } else {
+            setIsVerifyingToken(false);
+          }
+        });
+      } else {
+        setIsVerifyingToken(false);
+      }
+    }, []);
+    if (isVerifyingToken) {
+      return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
+    }
+    return /* @__PURE__ */ React__default.default.createElement(Wrapper$1, null, /* @__PURE__ */ React__default.default.createElement(Card, null, /* @__PURE__ */ React__default.default.createElement(FormWrapper, null, /* @__PURE__ */ React__default.default.createElement(
+      Form,
+      {
+        onSubmit: (e2) => {
+          e2.preventDefault();
+          login();
+        }
+      },
+      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(Label, { htmlFor: "username" }, "Username"), /* @__PURE__ */ React__default.default.createElement(
+        StyledInput,
+        {
+          $error: isError2,
+          id: "username",
+          onChange: (e2) => setUsername(e2.target.value),
+          required: true,
+          type: "text",
+          value: username
+        }
+      )),
+      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(Label, { htmlFor: "password" }, "Password"), /* @__PURE__ */ React__default.default.createElement(
+        StyledInput,
+        {
+          $error: isError2,
+          id: "password",
+          onChange: (e2) => setPassword(e2.target.value),
+          required: true,
+          type: "password",
+          value: password
+        }
+      )),
+      /* @__PURE__ */ React__default.default.createElement(ErrorText$1, { $hidden: !isError2, style: { marginTop: "1rem" } }, "Incorrect Username or Password"),
+      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(
+        StyledButton,
+        {
+          loading: isLoggingIn,
+          style: { color: "white" },
+          styling: "primary",
+          type: "submit"
+        },
+        "Sign in"
+      ))
+    ))));
+  }
+  function BasicAuthLogout() {
+    React.useEffect(() => {
+      revokeSession().then(() => {
+        setSessionToken(null);
+        window.location.href = `${window.dara.base_url}/login`;
+      });
+    }, []);
+    return null;
+  }
+  function DefaultAuthLogin() {
+    var _a;
+    const history2 = useHistory();
+    const location2 = useLocation();
+    const queryParams = new URLSearchParams(location2.search);
+    const previousLocation = (_a = queryParams.get("referrer")) != null ? _a : "/";
+    async function getNewToken() {
+      const sessionToken = await requestSessionToken({});
+      if (sessionToken) {
+        setSessionToken(sessionToken);
+        history2.replace(decodeURIComponent(previousLocation));
+      }
+    }
+    React.useEffect(() => {
+      if (getSessionToken()) {
+        verifySessionToken().then((verified) => {
+          if (verified) {
+            history2.replace(decodeURIComponent(previousLocation));
+          } else {
+            getNewToken();
+          }
+        });
+      } else {
+        getNewToken();
+      }
+    }, []);
+    return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
+  }
   function isTaskResponse(response) {
     return response && typeof response === "object" && "task_id" in response;
   }
@@ -55514,56 +55320,500 @@ Inferred class string: "${iconClasses}."`
         })
       );
     }
-    const family = selectorFamilyRegistry.get(key);
-    const serializableExtras = new RequestExtrasSerializable(currentExtras);
-    const selectorInstance = family(serializableExtras);
-    if (!selectorFamilyMembersRegistry.has(family)) {
-      selectorFamilyMembersRegistry.set(family, /* @__PURE__ */ new Map());
+    const family = selectorFamilyRegistry.get(key);
+    const serializableExtras = new RequestExtrasSerializable(currentExtras);
+    const selectorInstance = family(serializableExtras);
+    if (!selectorFamilyMembersRegistry.has(family)) {
+      selectorFamilyMembersRegistry.set(family, /* @__PURE__ */ new Map());
+    }
+    selectorFamilyMembersRegistry.get(family).set(serializableExtras.toJSON(), selectorInstance);
+    return selectorInstance;
+  }
+  function useServerComponent(name, uid2, dynamicKwargs, loop_instance_uid) {
+    const extras = useRequestExtras();
+    const { client: wsClient } = React.useContext(websocketCtx);
+    const taskContext = useTaskContext();
+    const variablesContext = React.useContext(variablesCtx);
+    const bus = useEventBus();
+    variablesContext == null ? void 0 : variablesContext.variables.current.add(getComponentRegistryKey(uid2));
+    React.useEffect(() => {
+      return () => {
+        variablesContext == null ? void 0 : variablesContext.variables.current.delete(getComponentRegistryKey(uid2));
+      };
+    }, []);
+    const componentSelector = getOrRegisterServerComponent({
+      name,
+      uid: uid2,
+      dynamicKwargs,
+      wsClient,
+      taskContext,
+      currentExtras: extras,
+      loop_instance_uid
+    });
+    const componentLoadable = Recoil_index_21(componentSelector);
+    React.useEffect(() => {
+      if (componentLoadable.state === "hasValue") {
+        bus.publish("SERVER_COMPONENT_LOADED", { name, uid: uid2, value: componentLoadable.contents });
+      }
+    }, [componentLoadable]);
+    const deferred = useDeferLoadable(componentLoadable);
+    return deferred;
+  }
+  function useRefreshServerComponent(uid2, loop_instance_uid) {
+    return Recoil_index_31(
+      ({ set: set2 }) => () => {
+        const triggerAtom = getOrRegisterComponentTrigger(uid2, loop_instance_uid);
+        set2(triggerAtom, (triggerIndexValue) => ({
+          force: false,
+          inc: triggerIndexValue.inc + 1
+        }));
+      },
+      [uid2]
+    );
+  }
+  const ErrorBoundaryContext = React.createContext(null);
+  const initialState = {
+    didCatch: false,
+    error: null
+  };
+  class ErrorBoundary extends React.Component {
+    constructor(props) {
+      super(props);
+      this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
+      this.state = initialState;
+    }
+    static getDerivedStateFromError(error) {
+      return {
+        didCatch: true,
+        error
+      };
+    }
+    resetErrorBoundary() {
+      const {
+        error
+      } = this.state;
+      if (error !== null) {
+        var _this$props$onReset, _this$props;
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
+          args,
+          reason: "imperative-api"
+        });
+        this.setState(initialState);
+      }
+    }
+    componentDidCatch(error, info) {
+      var _this$props$onError, _this$props2;
+      (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
+    }
+    componentDidUpdate(prevProps, prevState) {
+      const {
+        didCatch
+      } = this.state;
+      const {
+        resetKeys
+      } = this.props;
+      if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
+        var _this$props$onReset2, _this$props3;
+        (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
+          next: resetKeys,
+          prev: prevProps.resetKeys,
+          reason: "keys"
+        });
+        this.setState(initialState);
+      }
+    }
+    render() {
+      const {
+        children,
+        fallbackRender,
+        FallbackComponent,
+        fallback
+      } = this.props;
+      const {
+        didCatch,
+        error
+      } = this.state;
+      let childToRender = children;
+      if (didCatch) {
+        const props = {
+          error,
+          resetErrorBoundary: this.resetErrorBoundary
+        };
+        if (typeof fallbackRender === "function") {
+          childToRender = fallbackRender(props);
+        } else if (FallbackComponent) {
+          childToRender = React.createElement(FallbackComponent, props);
+        } else if (fallback !== void 0) {
+          childToRender = fallback;
+        } else {
+          throw error;
+        }
+      }
+      return React.createElement(ErrorBoundaryContext.Provider, {
+        value: {
+          didCatch,
+          error,
+          resetErrorBoundary: this.resetErrorBoundary
+        }
+      }, childToRender);
+    }
+  }
+  function hasArrayChanged() {
+    let a2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+    let b2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [];
+    return a2.length !== b2.length || a2.some((item, index2) => !Object.is(item, b2[index2]));
+  }
+  var baseGetTag = _baseGetTag, getPrototype = _getPrototype, isObjectLike = isObjectLike_1;
+  var objectTag = "[object Object]";
+  var funcProto = Function.prototype, objectProto = Object.prototype;
+  var funcToString = funcProto.toString;
+  var hasOwnProperty = objectProto.hasOwnProperty;
+  var objectCtorString = funcToString.call(Object);
+  function isPlainObject(value) {
+    if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
+      return false;
+    }
+    var proto = getPrototype(value);
+    if (proto === null) {
+      return true;
+    }
+    var Ctor = hasOwnProperty.call(proto, "constructor") && proto.constructor;
+    return typeof Ctor == "function" && Ctor instanceof Ctor && funcToString.call(Ctor) == objectCtorString;
+  }
+  var isPlainObject_1 = isPlainObject;
+  var baseSet = _baseSet;
+  function set(object2, path, value) {
+    return object2 == null ? object2 : baseSet(object2, path, value);
+  }
+  var set_1 = set;
+  function createMarkers(scope, loopInstanceUid) {
+    const markers = [];
+    if (scope.action) {
+      markers.push({ type: "action", path: scope.action });
+    }
+    if (scope.derivedVariable) {
+      markers.push({ type: "derived_var", path: scope.derivedVariable, loopInstanceUid });
+    }
+    if (scope.serverComponent) {
+      markers.push({ type: "server_component", path: scope.serverComponent, loopInstanceUid });
+    }
+    return markers;
+  }
+  function updateScope(scope, value, path) {
+    const newScope = { ...scope };
+    if (!scope.action && isAnnotatedAction(value)) {
+      newScope.action = path;
+    }
+    if (!scope.derivedVariable && isDerivedVariable(value)) {
+      newScope.derivedVariable = path;
+    }
+    if (!scope.serverComponent && isPyComponent(value)) {
+      newScope.serverComponent = path;
+    }
+    return newScope;
+  }
+  function getInjectionMarkers(renderer) {
+    const markers = [];
+    function walk(obj, pathSegments, scope = {}) {
+      for (const [key, value] of Object.entries(obj)) {
+        const currentPath = [...pathSegments, key];
+        const dotPath = currentPath.join(".");
+        if (isLoopVariable(value)) {
+          markers.push(
+            { path: dotPath, nested: value.nested, type: "loop_var" },
+            ...createMarkers(scope, value.uid)
+          );
+          continue;
+        }
+        if (isPlainObject_1(value) || Array.isArray(value)) {
+          const newScope = updateScope(scope, value, dotPath);
+          walk(value, [...pathSegments, key], newScope);
+        }
+      }
+    }
+    walk(renderer, []);
+    return markers;
+  }
+  function applyMarkers(renderer, markers, loopValue, itemKey) {
+    if (markers.length === 0) {
+      return renderer;
+    }
+    const clonedRenderer = cloneDeep_1(renderer);
+    for (const marker of markers) {
+      switch (marker.type) {
+        case "loop_var": {
+          set_1(clonedRenderer, marker.path, resolveNested(loopValue, marker.nested));
+          break;
+        }
+        case "action": {
+          set_1(clonedRenderer, `${marker.path}.loading.uid`, nanoid());
+          break;
+        }
+        case "derived_var": {
+          set_1(clonedRenderer, `${marker.path}.loop_instance_uid`, `${marker.loopInstanceUid}:${itemKey}`);
+          break;
+        }
+        case "server_component": {
+          set_1(clonedRenderer, `${marker.path}.loop_instance_uid`, `${marker.loopInstanceUid}:${itemKey}`);
+          break;
+        }
+      }
+    }
+    return clonedRenderer;
+  }
+  function hasMarkers(component) {
+    for (const [key, value] of Object.entries(component.props)) {
+      if (isLoopVariable(value)) {
+        return key;
+      }
+    }
+    return null;
+  }
+  const POLLING_INTERVAL = 100;
+  const FAKE_PROGRESS_INTERVAL = 100;
+  const ESTIMATE_RATIO = 0.85;
+  function estimateProgress(time, timeConstant = 10) {
+    return 1 - Math.exp(-1 * time / (FAKE_PROGRESS_INTERVAL * 10 * timeConstant));
+  }
+  function fakeProgressGenerator(progressStart, progressEnd, estimatedTime) {
+    const difference = progressEnd - progressStart;
+    const estimatedProgressUpdates = [];
+    let timeConstant = 10;
+    if (estimatedTime && estimatedTime !== 0) {
+      const estimatedDifference = ESTIMATE_RATIO * difference;
+      const estimatedProgressTime = ESTIMATE_RATIO * estimatedTime;
+      const numberOfUpdates = estimatedProgressTime / FAKE_PROGRESS_INTERVAL;
+      const estimatedProgressChunk = estimatedDifference / numberOfUpdates;
+      let t2 = 0;
+      let p2 = progressStart;
+      while (t2 < estimatedProgressTime) {
+        p2 += estimatedProgressChunk;
+        t2 += FAKE_PROGRESS_INTERVAL;
+        estimatedProgressUpdates.push(p2);
+      }
+      timeConstant = (1 - ESTIMATE_RATIO) * (estimatedTime / 1e3);
     }
-    selectorFamilyMembersRegistry.get(family).set(serializableExtras.toJSON(), selectorInstance);
-    return selectorInstance;
+    function* getNextUpdate() {
+      let startFrom = progressStart;
+      while (estimatedProgressUpdates.length > 0) {
+        const update = estimatedProgressUpdates.shift();
+        startFrom = update;
+        yield update;
+      }
+      let i2 = 0;
+      while (true) {
+        const estimated = estimateProgress(FAKE_PROGRESS_INTERVAL * i2, timeConstant);
+        yield estimated * (progressEnd - startFrom) + startFrom;
+        i2++;
+      }
+    }
+    return getNextUpdate();
   }
-  function useServerComponent(name, uid2, dynamicKwargs, loop_instance_uid) {
-    const extras = useRequestExtras();
-    const { client: wsClient } = React.useContext(websocketCtx);
+  const ProgressWrapper = styled__default.default.div`
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    padding: 1rem;
+`;
+  const ProgressHeader = styled__default.default.h4`
+    font-size: 1.2rem;
+`;
+  const ProgressMessage = styled__default.default.span`
+    font-size: ${(props) => props.theme.font.size};
+`;
+  function findRunningTasks(tasksContext, variablesRef) {
+    var _a;
+    if (!(variablesRef && ((_a = variablesRef == null ? void 0 : variablesRef.current) == null ? void 0 : _a.size) > 0 && tasksContext.hasRunningTasks())) {
+      return [];
+    }
+    return tasksContext.getVariableTasks(...variablesRef.current.values());
+  }
+  function ProgressTracker(props) {
     const taskContext = useTaskContext();
-    const variablesContext = React.useContext(variablesCtx);
-    const bus = useEventBus();
-    variablesContext == null ? void 0 : variablesContext.variables.current.add(getComponentRegistryKey(uid2));
+    const { client: wsClient } = React.useContext(websocketCtx);
+    const [latestProgressUpdate, setLatestProgressUpdate] = React.useState(
+      null
+    );
+    const [progress, setProgress] = React.useState(null);
+    const fakeInterval = React.useRef(null);
+    const [subscribedTaskIds, setSubscribedTaskIds] = React.useState([]);
+    const [restartTrigger, setRestartTrigger] = React.useState(0);
     React.useEffect(() => {
+      if (!wsClient) {
+        return;
+      }
+      let progressSubscription = null;
+      const timer2 = setInterval(() => {
+        const taskIds = findRunningTasks(taskContext, props.variablesRef);
+        if (taskIds.length > 0) {
+          setSubscribedTaskIds(taskIds);
+          progressSubscription = wsClient.progressUpdates$(...taskIds).subscribe((notif) => setLatestProgressUpdate(notif.message));
+          clearInterval(timer2);
+        }
+      }, POLLING_INTERVAL);
       return () => {
-        variablesContext == null ? void 0 : variablesContext.variables.current.delete(getComponentRegistryKey(uid2));
+        clearInterval(timer2);
+        if (fakeInterval.current) {
+          clearInterval(fakeInterval.current);
+        }
+        progressSubscription == null ? void 0 : progressSubscription.unsubscribe();
       };
-    }, []);
-    const componentSelector = getOrRegisterServerComponent({
-      name,
-      uid: uid2,
-      dynamicKwargs,
-      wsClient,
-      taskContext,
-      currentExtras: extras,
-      loop_instance_uid
-    });
-    const componentLoadable = Recoil_index_21(componentSelector);
+    }, [restartTrigger, wsClient]);
     React.useEffect(() => {
-      if (componentLoadable.state === "hasValue") {
-        bus.publish("SERVER_COMPONENT_LOADED", { name, uid: uid2, value: componentLoadable.contents });
+      if (!wsClient) {
+        return;
       }
-    }, [componentLoadable]);
-    const deferred = useDeferLoadable(componentLoadable);
-    return deferred;
+      let subscription = null;
+      if (subscribedTaskIds.length > 0) {
+        subscription = wsClient.taskStatusUpdates$(...subscribedTaskIds).subscribe((newStatus) => {
+          if (newStatus === "CANCELED") {
+            if (fakeInterval.current) {
+              clearInterval(fakeInterval.current);
+            }
+            setLatestProgressUpdate(null);
+            setSubscribedTaskIds([]);
+            setProgress(null);
+            setRestartTrigger((v2) => v2 + 1);
+          }
+        });
+      }
+      return () => {
+        subscription == null ? void 0 : subscription.unsubscribe();
+      };
+    }, [subscribedTaskIds, wsClient]);
+    React.useEffect(() => {
+      var _a, _b;
+      if (!latestProgressUpdate) {
+        return;
+      }
+      if (fakeInterval.current) {
+        clearInterval(fakeInterval.current);
+      }
+      const shouldStartFakeProgress = latestProgressUpdate.message.startsWith("FAKE_PROGRESS__");
+      if (!shouldStartFakeProgress) {
+        setProgress({
+          message: latestProgressUpdate.message,
+          progress: latestProgressUpdate.progress
+        });
+        return;
+      }
+      const [, estimatedTime, message] = latestProgressUpdate.message.split("__");
+      setProgress({
+        message,
+        progress: (_a = progress == null ? void 0 : progress.progress) != null ? _a : 0
+      });
+      const progressGenerator = fakeProgressGenerator(
+        (_b = progress == null ? void 0 : progress.progress) != null ? _b : 0,
+        latestProgressUpdate.progress,
+        parseFloat(estimatedTime)
+      );
+      fakeInterval.current = setInterval(() => {
+        const nextValue = progressGenerator.next().value;
+        setProgress({
+          message,
+          progress: nextValue
+        });
+      }, FAKE_PROGRESS_INTERVAL);
+    }, [latestProgressUpdate]);
+    if (subscribedTaskIds.length === 0) {
+      return props.fallback;
+    }
+    return /* @__PURE__ */ React__default.default.createElement(ProgressWrapper, null, /* @__PURE__ */ React__default.default.createElement(ProgressHeader, null, "Task in progress"), progress && /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(ProgressMessage, null, progress.message), /* @__PURE__ */ React__default.default.createElement(ProgressBar, { progress: parseFloat(progress.progress.toFixed(2)) })));
   }
-  function useRefreshServerComponent(uid2, loop_instance_uid) {
-    return Recoil_index_31(
-      ({ set: set2 }) => () => {
-        const triggerAtom = getOrRegisterComponentTrigger(uid2, loop_instance_uid);
-        set2(triggerAtom, (triggerIndexValue) => ({
-          force: false,
-          inc: triggerIndexValue.inc + 1
-        }));
-      },
-      [uid2]
-    );
+  function isSelectorError(e2) {
+    return e2 !== void 0 && e2 !== null && typeof e2 === "object" && "selectorId" in e2 && "selectorExtras" in e2;
+  }
+  const StyledErrorDisplay = styled__default.default.div`
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+    justify-content: space-between;
+
+    height: min-content;
+    padding: 1rem;
+
+    background-color: ${(props) => curriedTransparentize$1(0.9, props.theme.colors.error)};
+    border-radius: 0.25rem;
+`;
+  const ErrorDisplayWrapper = injectCss(StyledErrorDisplay);
+  const IconWrapper = styled__default.default.div`
+    display: flex;
+    height: 100%;
+`;
+  const ErrorIcon = styled__default.default.i`
+    line-height: 21px;
+    color: ${(props) => props.theme.colors.error};
+`;
+  const ContentWrapper = styled__default.default.div`
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    align-items: flex-start;
+`;
+  const ErrorContent = styled__default.default.div`
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    color: ${(props) => props.theme.colors.error};
+`;
+  const ErrorTitle$1 = styled__default.default.h3`
+    display: flex;
+    gap: 0.375rem;
+
+    font-size: 1rem;
+    font-weight: bold;
+    line-height: 1.375rem;
+    color: ${(props) => props.theme.colors.error};
+`;
+  const ErrorText = styled__default.default.span`
+    font-size: 1rem;
+    line-height: 1.375rem;
+`;
+  const RetryButton = styled__default.default.button`
+    cursor: pointer;
+
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+    justify-content: center;
+
+    width: 40px;
+    height: 40px;
+
+    color: ${(props) => props.theme.colors.error};
+
+    background-color: inherit;
+    border: none;
+    border: 1px solid;
+    border-color: ${(props) => props.theme.colors.error};
+    border-radius: 5px;
+
+    transition-timing-function: ease;
+    transition-duration: 100ms;
+    transition-property: color, border-color;
+
+    i {
+        line-height: 21px;
+        transition: transform 400ms ease-in-out;
+    }
+
+    &:hover {
+        color: ${(props) => props.theme.colors.errorHover};
+        border-color: ${(props) => props.theme.colors.errorHover};
+
+        i {
+            transform: rotate(180deg);
+        }
+    }
+`;
+  function ErrorDisplay$1(props) {
+    var _a, _b, _c, _d, _e2;
+    const [styles2, css2] = parseRawCss((_a = props.config) == null ? void 0 : _a.raw_css);
+    const defaultMessage = props.error instanceof UserError ? props.error.message : "Try again or contact the application owner.";
+    return /* @__PURE__ */ React__default.default.createElement(ErrorDisplayWrapper, { $rawCss: css2, style: styles2 }, /* @__PURE__ */ React__default.default.createElement(ContentWrapper, null, /* @__PURE__ */ React__default.default.createElement(ErrorContent, null, /* @__PURE__ */ React__default.default.createElement(ErrorTitle$1, null, /* @__PURE__ */ React__default.default.createElement(IconWrapper, null, /* @__PURE__ */ React__default.default.createElement(ErrorIcon, { "aria-hidden": true, className: "fa-solid fa-circle-xmark fa-lg" })), (_c = (_b = props == null ? void 0 : props.config) == null ? void 0 : _b.title) != null ? _c : "Error"), /* @__PURE__ */ React__default.default.createElement(ErrorText, null, (_e2 = (_d = props == null ? void 0 : props.config) == null ? void 0 : _d.description) != null ? _e2 : defaultMessage))), props.resetErrorBoundary && /* @__PURE__ */ React__default.default.createElement(RetryButton, { onClick: () => props.resetErrorBoundary(props.error), type: "button" }, /* @__PURE__ */ React__default.default.createElement("i", { "aria-hidden": true, className: "fa-solid fa-rotate fa-xl" })));
   }
   function cleanProps(props) {
     if ("children" in props && Array.isArray(props.children)) {
@@ -55605,8 +55855,15 @@ Inferred class string: "${iconClasses}."`
   }
   const MODULE_CACHE = /* @__PURE__ */ new Map();
   const COMPONENT_METADATA_CACHE = /* @__PURE__ */ new Map();
+  function clearCaches_TEST() {
+    MODULE_CACHE.clear();
+    COMPONENT_METADATA_CACHE.clear();
+  }
   function resolveComponentSync(component) {
     var _a;
+    if (!component) {
+      return null;
+    }
     if ((component == null ? void 0 : component.name) === "RawString") {
       return component.props.content;
     }
@@ -55654,6 +55911,9 @@ Inferred class string: "${iconClasses}."`
     }
   }
   async function resolveComponentAsync(component, getComponent, importers) {
+    if (!component) {
+      return;
+    }
     const entry = await getComponent(component);
     if (!isJsComponent(entry)) {
       COMPONENT_METADATA_CACHE.set(component.name, entry);
@@ -55709,6 +55969,9 @@ Inferred class string: "${iconClasses}."`
     const [isLoading, setIsLoading] = React.useState(() => component === null);
     const [loadingStarted, setLoadingStarted] = React.useState(false);
     React.useLayoutEffect(() => {
+      if (!props.component) {
+        return;
+      }
       const markerProp = hasMarkers(props.component);
       if (markerProp) {
         throw new UserError(
@@ -55771,6 +56034,9 @@ Inferred class string: "${iconClasses}."`
         return getFallbackComponent((_b2 = (_a2 = props.component) == null ? void 0 : _a2.props) == null ? void 0 : _b2.fallback, (_d2 = (_c2 = props.component) == null ? void 0 : _c2.props) == null ? void 0 : _d2.track_progress, variables);
       }
     );
+    if (!props.component) {
+      return null;
+    }
     if (isLoading) {
       return fallback;
     }
@@ -56396,7 +56662,7 @@ Inferred class string: "${iconClasses}."`
       /* @__PURE__ */ React__default.default.createElement(DynamicContext, { contextComponents: (_c = config2 == null ? void 0 : config2.context_components) != null ? _c : [] }, /* @__PURE__ */ React__default.default.createElement(StoreProviders, null, /* @__PURE__ */ React__default.default.createElement(RootWrapper, null, /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: template.layout }), /* @__PURE__ */ React__default.default.createElement(VariableStateProvider, { wsClient }), (config2 == null ? void 0 : config2.enable_devtools) && /* @__PURE__ */ React__default.default.createElement(DevTools, null))))
     )));
   }
-  const Wrapper$1 = styled__default.default.div`
+  const Wrapper = styled__default.default.div`
     overflow: auto;
     display: flex;
     flex: 1 1 auto;
@@ -81849,229 +82115,6 @@ Inferred class string: "${iconClasses}."`
       title: actionImpl.title
     });
   };
-  const Wrapper = styled__default.default.div`
-    display: flex;
-    flex: 1 1 0%;
-    flex-direction: column;
-    justify-content: center;
-
-    min-height: 100%;
-
-    background: ${(props) => `radial-gradient(circle closest-corner at 50% 40%, ${curriedTransparentize$1(
-    0.9,
-    props.theme.colors.background
-  )} 0%, ${curriedTransparentize$1(
-    0.8,
-    props.theme.colors.blue4
-  )} 70%),radial-gradient(circle closest-corner at 20% 150%, ${curriedTransparentize$1(
-    0.8,
-    props.theme.colors.error
-  )} 0%, ${curriedTransparentize$1(0.2, props.theme.colors.blue4)} 230%)`};
-`;
-  const Card = styled__default.default.div`
-    padding: 1.5rem;
-
-    color: ${(props) => props.theme.colors.text};
-
-    background-color: ${(props) => props.theme.colors.blue1};
-    border-radius: 1rem;
-    box-shadow: ${(props) => props.theme.shadow.medium};
-
-    @media (width >= 640px) {
-        width: 100%;
-        max-width: 24rem;
-        margin-right: auto;
-        margin-left: auto;
-    }
-`;
-  const FormWrapper = styled__default.default.div`
-    margin-top: 1.5rem;
-`;
-  const Form = styled__default.default.form`
-    > * + * {
-        margin-top: 1.5rem;
-    }
-`;
-  const ErrorText = styled__default.default.h3`
-    margin: 0;
-
-    font-size: 0.875rem;
-    font-weight: 500;
-    line-height: 1.25rem;
-    color: ${(props) => props.theme.colors.error};
-    letter-spacing: 0.025em;
-
-    visibility: ${(props) => props.$hidden ? "hidden" : "visible"};
-`;
-  const Label = styled__default.default.label`
-    font-weight: 500;
-    line-height: 1.5rem;
-`;
-  const StyledInput = styled__default.default.input`
-    display: flex;
-    display: block;
-    align-items: center;
-
-    width: 100%;
-    height: 2.5rem;
-    margin-top: 0.5rem;
-    padding: 0 1rem;
-
-    font-size: 1rem;
-    line-height: 1.5rem;
-    color: ${(props) => props.theme.colors.text};
-
-    background-color: ${(props) => props.theme.colors.blue1};
-    border: none;
-    border-radius: 0.25rem;
-    outline: none;
-    box-shadow:
-        inset 0 0 0 0 ${(props) => props.theme.colors.blue1},
-        inset 0 0 0 1px ${(props) => props.$error ? props.theme.colors.error : props.theme.colors.grey2},
-        0 1px 2px 0 rgb(0 0 0 / 5%);
-
-    :active,
-    :focus {
-        box-shadow:
-            inset 0 0 0 0 ${(props) => props.theme.colors.blue1},
-            inset 0 0 0 2px ${(props) => props.$error ? props.theme.colors.error : props.theme.colors.primary},
-            0 1px 2px 0 rgb(0 0 0 / 5%);
-    }
-`;
-  const StyledButton = styled__default.default(Button$1)`
-    width: 100%;
-    font-weight: 600;
-    line-height: 1.5rem;
-    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%);
-
-    :active,
-    :focus {
-        outline-color: ${(props) => props.theme.colors.primary};
-        outline-width: 2px;
-        outline-offset: 2px;
-    }
-`;
-  function BasicAuthLogin() {
-    var _a;
-    const [isVerifyingToken, setIsVerifyingToken] = React.useState(true);
-    const [isLoggingIn, setIsLoggingIn] = React.useState(false);
-    const [username, setUsername] = React.useState("");
-    const [password, setPassword] = React.useState("");
-    const [isError2, setIsError] = React.useState(false);
-    const history2 = useHistory();
-    const location2 = useLocation();
-    const queryParams = new URLSearchParams(location2.search);
-    const previousLocation = (_a = queryParams.get("referrer")) != null ? _a : "/";
-    const login = async () => {
-      setIsLoggingIn(true);
-      setIsError(false);
-      try {
-        const sessionToken = await requestSessionToken({ password, username });
-        if (sessionToken) {
-          setSessionToken(sessionToken);
-          history2.replace(decodeURIComponent(previousLocation));
-        }
-      } catch {
-        setIsError(true);
-      }
-      setIsLoggingIn(false);
-    };
-    React.useEffect(() => {
-      if (getSessionToken()) {
-        verifySessionToken().then((verified) => {
-          if (verified) {
-            history2.replace(decodeURIComponent(previousLocation));
-          } else {
-            setIsVerifyingToken(false);
-          }
-        });
-      } else {
-        setIsVerifyingToken(false);
-      }
-    }, []);
-    if (isVerifyingToken) {
-      return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
-    }
-    return /* @__PURE__ */ React__default.default.createElement(Wrapper, null, /* @__PURE__ */ React__default.default.createElement(Card, null, /* @__PURE__ */ React__default.default.createElement(FormWrapper, null, /* @__PURE__ */ React__default.default.createElement(
-      Form,
-      {
-        onSubmit: (e2) => {
-          e2.preventDefault();
-          login();
-        }
-      },
-      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(Label, { htmlFor: "username" }, "Username"), /* @__PURE__ */ React__default.default.createElement(
-        StyledInput,
-        {
-          $error: isError2,
-          id: "username",
-          onChange: (e2) => setUsername(e2.target.value),
-          required: true,
-          type: "text",
-          value: username
-        }
-      )),
-      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(Label, { htmlFor: "password" }, "Password"), /* @__PURE__ */ React__default.default.createElement(
-        StyledInput,
-        {
-          $error: isError2,
-          id: "password",
-          onChange: (e2) => setPassword(e2.target.value),
-          required: true,
-          type: "password",
-          value: password
-        }
-      )),
-      /* @__PURE__ */ React__default.default.createElement(ErrorText, { $hidden: !isError2, style: { marginTop: "1rem" } }, "Incorrect Username or Password"),
-      /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(
-        StyledButton,
-        {
-          loading: isLoggingIn,
-          style: { color: "white" },
-          styling: "primary",
-          type: "submit"
-        },
-        "Sign in"
-      ))
-    ))));
-  }
-  function BasicAuthLogout() {
-    React.useEffect(() => {
-      revokeSession().then(() => {
-        setSessionToken(null);
-        window.location.href = `${window.dara.base_url}/login`;
-      });
-    }, []);
-    return null;
-  }
-  function DefaultAuthLogin() {
-    var _a;
-    const history2 = useHistory();
-    const location2 = useLocation();
-    const queryParams = new URLSearchParams(location2.search);
-    const previousLocation = (_a = queryParams.get("referrer")) != null ? _a : "/";
-    async function getNewToken() {
-      const sessionToken = await requestSessionToken({});
-      if (sessionToken) {
-        setSessionToken(sessionToken);
-        history2.replace(decodeURIComponent(previousLocation));
-      }
-    }
-    React.useEffect(() => {
-      if (getSessionToken()) {
-        verifySessionToken().then((verified) => {
-          if (verified) {
-            history2.replace(decodeURIComponent(previousLocation));
-          } else {
-            getNewToken();
-          }
-        });
-      } else {
-        getNewToken();
-      }
-    }, []);
-    return /* @__PURE__ */ React__default.default.createElement(Center, null, /* @__PURE__ */ React__default.default.createElement(DefaultFallback, null));
-  }
   const MenuItem = styled__default.default(NavLink)`
     cursor: pointer;
 
@@ -82223,7 +82266,7 @@ Inferred class string: "${iconClasses}."`
     const causalensLogoSrc = theme2.themeType === "dark" ? CausalensDark : CausalensLight;
     const daraLogo = /* @__PURE__ */ React__default.default.createElement("img", { alt: "Dara Logo", src: logoSrc });
     const causalensLogo = /* @__PURE__ */ React__default.default.createElement("img", { alt: "causaLens Logo", src: causalensLogoSrc });
-    return /* @__PURE__ */ React__default.default.createElement(Wrapper$1, { backgroundColor: theme2.colors.background }, props.side_bar_position === "right" && /* @__PURE__ */ React__default.default.createElement(Wrapper$1, null, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })), /* @__PURE__ */ React__default.default.createElement(styled.ThemeContext.Provider, { value: resolveTheme((_a = config2 == null ? void 0 : config2.theme) == null ? void 0 : _a.main, (_b = config2 == null ? void 0 : config2.theme) == null ? void 0 : _b.base) }, /* @__PURE__ */ React__default.default.createElement(SideBar, { style: { padding: props.side_bar_padding }, width: props.side_bar_width }, !props.hide_logo && props.logo_position !== "bottom" && logo, /* @__PURE__ */ React__default.default.createElement(Wrapper$1, { direction: "column" }, /* @__PURE__ */ React__default.default.createElement(directionCtx.Provider, { value: { direction: "column" } }, props.side_bar && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.side_bar }))), !props.hide_logo && props.logo_position === "bottom" && logo, /* @__PURE__ */ React__default.default.createElement(LogoutButton$1, { href: "/logout", styling: "error" }, /* @__PURE__ */ React__default.default.createElement(LogoutArrow$1, { style: { marginRight: "0.5rem" } }), "Logout"), /* @__PURE__ */ React__default.default.createElement(BuiltWithLink, { href: "https://github.com/causalens/dara", target: "_blank", rel: "noopener noreferrer" }, "Built with ", daraLogo), (config2 == null ? void 0 : config2.powered_by_causalens) && /* @__PURE__ */ React__default.default.createElement(
+    return /* @__PURE__ */ React__default.default.createElement(Wrapper, { backgroundColor: theme2.colors.background }, props.side_bar_position === "right" && /* @__PURE__ */ React__default.default.createElement(Wrapper, null, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })), /* @__PURE__ */ React__default.default.createElement(styled.ThemeContext.Provider, { value: resolveTheme((_a = config2 == null ? void 0 : config2.theme) == null ? void 0 : _a.main, (_b = config2 == null ? void 0 : config2.theme) == null ? void 0 : _b.base) }, /* @__PURE__ */ React__default.default.createElement(SideBar, { style: { padding: props.side_bar_padding }, width: props.side_bar_width }, !props.hide_logo && props.logo_position !== "bottom" && logo, /* @__PURE__ */ React__default.default.createElement(Wrapper, { direction: "column" }, /* @__PURE__ */ React__default.default.createElement(directionCtx.Provider, { value: { direction: "column" } }, props.side_bar && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.side_bar }))), !props.hide_logo && props.logo_position === "bottom" && logo, /* @__PURE__ */ React__default.default.createElement(LogoutButton$1, { href: "/logout", styling: "error" }, /* @__PURE__ */ React__default.default.createElement(LogoutArrow$1, { style: { marginRight: "0.5rem" } }), "Logout"), /* @__PURE__ */ React__default.default.createElement(BuiltWithLink, { href: "https://github.com/causalens/dara", target: "_blank", rel: "noopener noreferrer" }, "Built with ", daraLogo), (config2 == null ? void 0 : config2.powered_by_causalens) && /* @__PURE__ */ React__default.default.createElement(
       BuiltWithLink,
       {
         href: "https://causalens.com/?utm_source=dara&utm_medium=direct&utm_campaign=dara_platform",
@@ -82233,7 +82276,7 @@ Inferred class string: "${iconClasses}."`
       /* @__PURE__ */ React__default.default.createElement("span", { style: { marginTop: "0.4375rem" } }, "Powered by"),
       " ",
       causalensLogo
-    ))), props.side_bar_position !== "right" && /* @__PURE__ */ React__default.default.createElement(Wrapper$1, { style: { padding: "2rem 3rem" } }, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })));
+    ))), props.side_bar_position !== "right" && /* @__PURE__ */ React__default.default.createElement(Wrapper, { style: { padding: "2rem 3rem" } }, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })));
   }
   const shouldForwardProp = (prop) => !["width"].includes(prop);
   const TopBar = styled__default.default.div.withConfig({ shouldForwardProp })`
@@ -82294,7 +82337,7 @@ Inferred class string: "${iconClasses}."`
         color: ${(props) => props.theme.colors.blue1};
     }
 `;
-  const RouteButtons = styled__default.default(Wrapper$1)`
+  const RouteButtons = styled__default.default(Wrapper)`
     gap: 0.5rem;
     align-items: center;
 `;
@@ -82317,7 +82360,7 @@ Inferred class string: "${iconClasses}."`
     const logo = props.logo_path && /* @__PURE__ */ React__default.default.createElement(LogoImage, { alt: "Logo", src: prependBaseUrl(props.logo_path), width: props.logo_width });
     const logoSrc = theme2.themeType === "dark" ? DaraDark : DaraLight;
     const daraLogo = /* @__PURE__ */ React__default.default.createElement("img", { alt: "Dara", src: logoSrc });
-    return /* @__PURE__ */ React__default.default.createElement(Wrapper$1, { backgroundColor: theme2.colors.background, direction: "column" }, /* @__PURE__ */ React__default.default.createElement(styled.ThemeContext.Provider, { value: resolveTheme((_a = config2 == null ? void 0 : config2.theme) == null ? void 0 : _a.main, (_b = config2 == null ? void 0 : config2.theme) == null ? void 0 : _b.base) }, /* @__PURE__ */ React__default.default.createElement(TopBar, { height: props.top_bar_height, style: { padding: props.top_bar_padding } }, /* @__PURE__ */ React__default.default.createElement(TopBarContent, null, !props.hide_logo && logo, props.top_bar && /* @__PURE__ */ React__default.default.createElement(RouteButtons, { direction: "row" }, /* @__PURE__ */ React__default.default.createElement(directionCtx.Provider, { value: { direction: "row" } }, props.top_bar && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.top_bar }))), /* @__PURE__ */ React__default.default.createElement(LogoutButton, { href: "/logout", styling: "error" }, /* @__PURE__ */ React__default.default.createElement(LogoutArrow, { style: { marginRight: "0.5rem" } }), "Logout")), /* @__PURE__ */ React__default.default.createElement(BuiltWithSpan, null, "Built with ", daraLogo))), /* @__PURE__ */ React__default.default.createElement(Wrapper$1, { style: { padding: "2rem 3rem" } }, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })));
+    return /* @__PURE__ */ React__default.default.createElement(Wrapper, { backgroundColor: theme2.colors.background, direction: "column" }, /* @__PURE__ */ React__default.default.createElement(styled.ThemeContext.Provider, { value: resolveTheme((_a = config2 == null ? void 0 : config2.theme) == null ? void 0 : _a.main, (_b = config2 == null ? void 0 : config2.theme) == null ? void 0 : _b.base) }, /* @__PURE__ */ React__default.default.createElement(TopBar, { height: props.top_bar_height, style: { padding: props.top_bar_padding } }, /* @__PURE__ */ React__default.default.createElement(TopBarContent, null, !props.hide_logo && logo, props.top_bar && /* @__PURE__ */ React__default.default.createElement(RouteButtons, { direction: "row" }, /* @__PURE__ */ React__default.default.createElement(directionCtx.Provider, { value: { direction: "row" } }, props.top_bar && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.top_bar }))), /* @__PURE__ */ React__default.default.createElement(LogoutButton, { href: "/logout", styling: "error" }, /* @__PURE__ */ React__default.default.createElement(LogoutArrow, { style: { marginRight: "0.5rem" } }), "Logout")), /* @__PURE__ */ React__default.default.createElement(BuiltWithSpan, null, "Built with ", daraLogo))), /* @__PURE__ */ React__default.default.createElement(Wrapper, { style: { padding: "2rem 3rem" } }, props.content && /* @__PURE__ */ React__default.default.createElement(DynamicComponent$1, { component: props.content })));
   }
   const RowDots = styled__default.default(Dots)`
     height: 2.5rem;
@@ -82397,65 +82440,142 @@ Inferred class string: "${iconClasses}."`
     const { suspend } = useFallbackCtx();
     return /* @__PURE__ */ React__namespace.createElement(fallbackCtx.Provider, { value: { suspend: false } }, /* @__PURE__ */ React__namespace.createElement(ForImpl, { ...props, suspend }));
   }
+  exports.AuthType = AuthType;
+  exports.AuthWrapper = AuthWrapper;
   exports.BasicAuthLogin = BasicAuthLogin;
   exports.BasicAuthLogout = BasicAuthLogout;
   exports.Center = Center;
+  exports.ComponentType = ComponentType;
   exports.ConditionOperator = ConditionOperator;
   exports.DARA_JWT_TOKEN = DARA_JWT_TOKEN;
+  exports.DEFAULT_BUS = DEFAULT_BUS;
   exports.DefaultAuthLogin = DefaultAuthLogin;
   exports.DefaultFallback = DefaultFallback;
+  exports.DirectionCtx = directionCtx;
   exports.DisplayCtx = displayCtx;
   exports.DownloadVariable = DownloadVariable;
   exports.DynamicComponent = DynamicComponent$1;
   exports.EventBus = EventBus;
   exports.EventCapturer = EventCapturer;
+  exports.FallbackCtx = fallbackCtx;
   exports.For = For;
+  exports.GlobalTaskProvider = GlobalTaskProvider;
+  exports.ImportersCtx = importersCtx;
   exports.Menu = Menu;
   exports.NavigateTo = NavigateTo;
   exports.Notifications = index$1;
   exports.Notify = Notify;
   exports.PartialRequestExtrasProvider = PartialRequestExtrasProvider;
+  exports.PrivateRoute = PrivateRoute;
   exports.ProgressTracker = ProgressTracker;
   exports.ReactRouter = reactRouterDom;
+  exports.RegistriesCtx = registriesCtx;
+  exports.RequestExtrasCtx = requestExtrasCtx;
   exports.RequestExtrasProvider = RequestExtrasProvider;
   exports.ResetVariables = ResetVariables;
   exports.RouterContent = RouterContent;
   exports.RowFallback = RowFallback;
   exports.SideBarFrame = SideBarFrame;
+  exports.TemplateRoot = TemplateRoot;
   exports.TopBarFrame = TopBarFrame;
   exports.TriggerVariable = TriggerVariable;
   exports.UpdateVariable = UpdateVariable;
+  exports.UserError = UserError;
+  exports.VariableCtx = variablesCtx;
+  exports.WebSocketClient = WebSocketClient;
   exports.WebSocketCtx = websocketCtx;
+  exports.Wrapper = Wrapper;
+  exports.atomFamilyMembersRegistry = atomFamilyMembersRegistry;
+  exports.atomFamilyRegistry = atomFamilyRegistry;
+  exports.atomRegistry = atomRegistry;
+  exports.cancelTask = cancelTask;
+  exports.cleanSessionCache = cleanSessionCache;
+  exports.cleanValue = cleanValue;
+  exports.clearActionHandlerCache_TEST = clearActionHandlerCache_TEST;
+  exports.clearCaches_TEST = clearCaches_TEST;
+  exports.clearRegistries_TEST = clearRegistries_TEST;
   exports.combineFilters = combineFilters;
+  exports.dataRegistry = dataRegistry;
   exports.default = run;
+  exports.depsRegistry = depsRegistry;
+  exports.fetchDerivedVariable = fetchDerivedVariable;
+  exports.fetchTaskResult = fetchTaskResult;
+  exports.formatDerivedVariableRequest = formatDerivedVariableRequest;
   exports.getComponentRegistryKey = getComponentRegistryKey;
+  exports.getDeps = getDeps;
   exports.getIcon = getIcon;
+  exports.getOrRegisterDerivedVariable = getOrRegisterDerivedVariable;
+  exports.getOrRegisterDerivedVariableValue = getOrRegisterDerivedVariableValue;
   exports.getRegistryKey = getRegistryKey;
   exports.getSessionToken = getSessionToken;
   exports.getToken = getToken;
   exports.getTokenKey = getTokenKey;
+  exports.getVariableValue = getVariableValue;
   exports.handleAuthErrors = handleAuthErrors;
   exports.injectCss = injectCss;
+  exports.isActionImpl = isActionImpl;
+  exports.isAnnotatedAction = isAnnotatedAction;
+  exports.isDataVariable = isDataVariable;
+  exports.isDerivedDataVariable = isDerivedDataVariable;
+  exports.isDerivedVariable = isDerivedVariable;
+  exports.isInvalidComponent = isInvalidComponent;
+  exports.isJsComponent = isJsComponent;
+  exports.isLoopVariable = isLoopVariable;
+  exports.isPyComponent = isPyComponent;
+  exports.isRawString = isRawString;
+  exports.isRegistered = isRegistered;
+  exports.isResolvedDataVariable = isResolvedDataVariable;
+  exports.isResolvedDerivedDataVariable = isResolvedDerivedDataVariable;
+  exports.isResolvedDerivedVariable = isResolvedDerivedVariable;
+  exports.isTaskResponse = isTaskResponse$1;
+  exports.isUrlVariable = isUrlVariable;
   exports.isVariable = isVariable;
   exports.normalizeRequest = normalizeRequest;
+  exports.onTokenChange = onTokenChange;
+  exports.parseRawCss = parseRawCss;
   exports.prependBaseUrl = prependBaseUrl;
   exports.request = request;
-  exports.resolveValue = resolveValue;
+  exports.requestSessionToken = requestSessionToken;
+  exports.resolveDerivedValue = resolveDerivedValue;
+  exports.resolveNested = resolveNested;
+  exports.resolveReferrer = resolveReferrer;
+  exports.resolveTheme = resolveTheme;
   exports.revokeSession = revokeSession;
+  exports.selectorFamilyMembersRegistry = selectorFamilyMembersRegistry;
+  exports.selectorFamilyRegistry = selectorFamilyRegistry;
+  exports.selectorRegistry = selectorRegistry;
+  exports.setNested = setNested;
   exports.setSessionToken = setSessionToken;
+  exports.setupWebsocket = setupWebsocket;
   exports.useAction = useAction;
   exports.useActionIsLoading = useActionIsLoading;
+  exports.useActions = useActions;
   exports.useAnyVariable = useAnyVariable;
+  exports.useAuthConfig = useAuthConfig;
+  exports.useComponentRegistry = useComponentRegistry;
   exports.useComponentStyles = useComponentStyles;
+  exports.useComponents = useComponents;
+  exports.useConfig = useConfig;
   exports.useDataVariable = useDataVariable;
+  exports.useDeferLoadable = useDeferLoadable;
+  exports.useDerivedVariable = useDerivedVariable;
   exports.useEventBus = useEventBus;
+  exports.useInterval = useInterval;
+  exports.usePrevious = usePrevious;
   exports.useRefreshSelector = useRefreshSelector;
   exports.useRefreshServerComponent = useRefreshServerComponent;
   exports.useRequestExtras = useRequestExtras;
+  exports.useSession = useSession;
   exports.useSessionToken = useSessionToken;
+  exports.useTaskContext = useTaskContext;
+  exports.useTemplate = useTemplate;
+  exports.useTriggerIndex = useTriggerIndex;
+  exports.useUrlSync = useUrlSync;
   exports.useUser = useUser;
   exports.useVariable = useVariable;
+  exports.useVariableState = useVariableState;
   exports.useVariableValue = useVariableValue;
+  exports.useWindowTitle = useWindowTitle;
   exports.verifySessionToken = verifySessionToken;
   Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 });