@gradio/core 0.0.4 → 0.1.0-beta.2

package/CHANGELOG.md

@@ -1,5 +1,81 @@
 # @gradio/core
 
+## 0.1.0-beta.2
+
+### Features
+
+- [#9323](https://github.com/gradio-app/gradio/pull/9323) [`06babda`](https://github.com/gradio-app/gradio/commit/06babda0395fd3fbd323c1c3cb33704ecfd6deb0) - Disable liking user message in chatbot by default but make it configurable.  Thanks @freddyaboulton!
+- [#9339](https://github.com/gradio-app/gradio/pull/9339) [`4c8c6f2`](https://github.com/gradio-app/gradio/commit/4c8c6f2fe603081941c5fdc43f48a0632b9f31ad) - Ssr part 2.  Thanks @pngwn!
+- [#9269](https://github.com/gradio-app/gradio/pull/9269) [`e05f568`](https://github.com/gradio-app/gradio/commit/e05f568f47e9fa33ef91dbbe5cc477d32762bc36) - Fix reload mode and streaming in 5.0 dev.  Thanks @freddyaboulton!
+- [#9253](https://github.com/gradio-app/gradio/pull/9253) [`99648ec`](https://github.com/gradio-app/gradio/commit/99648ec7c4443e74799941e47b0015ac9ca581e1) - Adds ability to block event trigger when file is uploading.  Thanks @dawoodkhan82!
+- [#9335](https://github.com/gradio-app/gradio/pull/9335) [`b543465`](https://github.com/gradio-app/gradio/commit/b543465d06d7d1b399c4d0755da05e022611a97f) - Remove lite/theme.css from the Git-managed file tree.  Thanks @whitphx!
+
+### Fixes
+
+- [#9299](https://github.com/gradio-app/gradio/pull/9299) [`aa35b07`](https://github.com/gradio-app/gradio/commit/aa35b0788e613fdd45446d267513e6f94fa208ea) - Trigger state change event on iterators.  Thanks @freddyaboulton!
+
+### Dependency updates
+
+- @gradio/atoms@0.9.0-beta.2
+- @gradio/gallery@0.13.0-beta.2
+- @gradio/upload@0.13.0-beta.2
+- @gradio/wasm@0.14.0-beta.2
+- @gradio/markdown@0.10.0-beta.2
+- @gradio/client@1.6.0-beta.2
+- @gradio/icons@0.8.0-beta.2
+- @gradio/statustracker@0.8.0-beta.2
+- @gradio/utils@0.7.0-beta.2
+- @gradio/plot@0.6.5-beta.2
+- @gradio/button@0.3.0-beta.2
+- @gradio/file@0.10.0-beta.2
+- @gradio/image@0.16.0-beta.2
+- @gradio/video@0.11.0-beta.2
+- @gradio/code@0.10.0-beta.2
+- @gradio/paramviewer@0.4.22-beta.2
+- @gradio/checkbox@0.4.0-beta.2
+- @gradio/column@0.2.0-beta.0
+- @gradio/textbox@0.7.0-beta.2
+- @gradio/tabs@0.3.0-beta.2
+
+## 0.1.0-beta.1
+
+### Features
+
+- [#9200](https://github.com/gradio-app/gradio/pull/9200) [`2e179d3`](https://github.com/gradio-app/gradio/commit/2e179d35be6ed60a5a6bfc7303178d63e41781ad) - prefix api routes.  Thanks @pngwn!
+
+### Dependency updates
+
+- @gradio/video@0.11.0-beta.1
+- @gradio/atoms@0.8.1-beta.1
+- @gradio/icons@0.8.0-beta.1
+- @gradio/statustracker@0.8.0-beta.1
+- @gradio/utils@0.7.0-beta.1
+- @gradio/client@1.6.0-beta.1
+- @gradio/image@0.16.0-beta.1
+- @gradio/upload@0.12.4-beta.1
+- @gradio/markdown@0.9.4-beta.1
+- @gradio/wasm@0.13.1-beta.1
+- @gradio/theme@0.3.0-beta.1
+- @gradio/gallery@0.13.0-beta.1
+- @gradio/plot@0.6.5-beta.1
+- @gradio/tabs@0.3.0-beta.1
+- @gradio/column@0.2.0-beta.0
+- @gradio/button@0.3.0-beta.1
+- @gradio/textbox@0.7.0-beta.1
+- @gradio/code@0.9.1-beta.1
+- @gradio/paramviewer@0.4.22-beta.1
+- @gradio/file@0.9.4-beta.1
+- @gradio/checkbox@0.4.0-beta.1
+
+## 0.1.0-beta.0
+
+### Features
+
+- [#9149](https://github.com/gradio-app/gradio/pull/9149) [`3d7a9b8`](https://github.com/gradio-app/gradio/commit/3d7a9b81f6fef06187eca832471dc1692eb493a0) - Open audio/image input stream only when queue is ready.  Thanks @freddyaboulton!
+- [#9173](https://github.com/gradio-app/gradio/pull/9173) [`66349fe`](https://github.com/gradio-app/gradio/commit/66349fe26827e3a3c15b738a1177e95fec7f5554) - Streaming Guides.  Thanks @freddyaboulton!
+- [#9052](https://github.com/gradio-app/gradio/pull/9052) [`f3652eb`](https://github.com/gradio-app/gradio/commit/f3652ebe08211e12739df73c15fd97e5ff81276a) - Video gallery.  Thanks @dawoodkhan82!
+- [#8941](https://github.com/gradio-app/gradio/pull/8941) [`97a7bf6`](https://github.com/gradio-app/gradio/commit/97a7bf66a79179d1b91a3199d68e5c11216ca500) - Streaming inputs for 5.0.  Thanks @freddyaboulton!
+
 ## 0.0.4
 
 ### Fixes

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export { default as Embed } from "./src/Embed.svelte";
 export { prefix_css, mount_css } from "./src/css";
+export { create_components } from "./src/init";
 export * from "./src/i18n";
 export * from "./src/types";

package/dist/index.js

@@ -1,4 +1,5 @@
 export { default as Embed } from "./src/Embed.svelte";
 export { prefix_css, mount_css } from "./src/css";
+export { create_components } from "./src/init";
 export * from "./src/i18n";
 export * from "./src/types";

package/dist/src/Blocks.svelte

@@ -1,4 +1,4 @@
-<script>import { tick } from "svelte";
+<script>import { tick, onMount } from "svelte";
 import { _ } from "svelte-i18n";
 import { Client } from "@gradio/client";
 import { setupi18n } from "./i18n";
@@ -28,43 +28,53 @@ export let js;
 export let fill_height = false;
 export let ready;
 export let username;
-const {
+export let api_prefix;
+export let max_file_size;
+export let initial_layout = void 0;
+let {
   layout: _layout,
   targets,
   update_value,
   get_data,
+  modify_stream,
+  get_stream_state,
+  set_time_limit,
   loading_status,
   scheduled_updates,
   create_layout,
   rerender_layout
 } = create_components();
+$_layout = initial_layout;
 $:
-  create_layout({
+  components, layout, dependencies, root, app, fill_height, target, run();
+$: {
+  ready = !!$_layout;
+}
+async function run() {
+  await create_layout({
     components,
     layout,
     dependencies,
-    root,
+    root: root + api_prefix,
     app,
     options: {
       fill_height
     }
   });
-$: {
-  ready = !!$_layout;
 }
-let params = new URLSearchParams(window.location.search);
-let api_docs_visible = params.get("view") === "api" && show_api;
-let api_recorder_visible = params.get("view") === "api-recorder" && show_api;
+export let search_params;
+let api_docs_visible = search_params.get("view") === "api" && show_api;
+let api_recorder_visible = search_params.get("view") === "api-recorder" && show_api;
 function set_api_docs_visible(visible) {
   api_recorder_visible = false;
   api_docs_visible = visible;
-  let params2 = new URLSearchParams(window.location.search);
+  let params = new URLSearchParams(window.location.search);
   if (visible) {
-    params2.set("view", "api");
+    params.set("view", "api");
   } else {
-    params2.delete("view");
+    params.delete("view");
   }
-  history.replaceState(null, "", "?" + params2.toString());
+  history.replaceState(null, "", "?" + params.toString());
 }
 let api_calls = [];
 export let render_complete = false;
@@ -121,22 +131,17 @@ export function add_new_message(message, type) {
 }
 let _error_id = -1;
 let user_left_page = false;
-document.addEventListener("visibilitychange", function() {
-  if (document.visibilityState === "hidden") {
-    user_left_page = true;
-  }
-});
 const MESSAGE_QUOTE_RE = /^'([^]+)'$/;
 const DUPLICATE_MESSAGE = $_("blocks.long_requests_queue");
 const MOBILE_QUEUE_WARNING = $_("blocks.connection_can_break");
 const MOBILE_RECONNECT_MESSAGE = $_("blocks.lost_connection");
+const WAITING_FOR_INPUTS_MESSAGE = $_("blocks.waiting_for_inputs");
 const SHOW_DUPLICATE_MESSAGE_ON_ETA = 15;
 const SHOW_MOBILE_QUEUE_WARNING_ON_ETA = 10;
-const is_mobile_device = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
-  navigator.userAgent
-);
+let is_mobile_device = false;
 let showed_duplicate_message = false;
 let showed_mobile_warning = false;
+let inputs_waiting = [];
 function wait_then_trigger_api_call(dep_index, trigger_id = null, event_data = null) {
   let _unsub = () => {
   };
@@ -154,8 +159,22 @@ function wait_then_trigger_api_call(dep_index, trigger_id = null, event_data = n
     trigger_api_call(dep_index, trigger_id, event_data);
   }
 }
+async function get_component_value_or_event_data(component_id, trigger_id, event_data) {
+  if (component_id === trigger_id && event_data && event_data.is_value_data === true) {
+    return event_data.value;
+  }
+  return get_data(component_id);
+}
 async function trigger_api_call(dep_index, trigger_id = null, event_data = null) {
   let dep = dependencies.find((dep2) => dep2.id === dep_index);
+  if (inputs_waiting.length > 0) {
+    for (const input of inputs_waiting) {
+      if (dep.inputs.includes(input)) {
+        add_new_message(WAITING_FOR_INPUTS_MESSAGE, "warning");
+        return;
+      }
+    }
+  }
   const current_status = loading_status.get_status_for_fn(dep_index);
   messages = messages.filter(({ fn_index }) => fn_index !== dep_index);
   if (current_status === "pending" || current_status === "generating") {
@@ -163,7 +182,11 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
   }
   let payload = {
     fn_index: dep_index,
-    data: await Promise.all(dep.inputs.map((id) => get_data(id))),
+    data: await Promise.all(
+      dep.inputs.map(
+        (id) => get_component_value_or_event_data(id, trigger_id, event_data)
+      )
+    ),
     event_data: dep.collects_event_data ? event_data : null,
     trigger_id
   };
@@ -196,22 +219,39 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
   function trigger_prediction(dep2, payload2) {
     if (dep2.trigger_mode === "once") {
       if (!dep2.pending_request)
-        make_prediction(payload2);
+        make_prediction(payload2, dep2.connection == "stream");
     } else if (dep2.trigger_mode === "multiple") {
-      make_prediction(payload2);
+      make_prediction(payload2, dep2.connection == "stream");
     } else if (dep2.trigger_mode === "always_last") {
       if (!dep2.pending_request) {
-        make_prediction(payload2);
+        make_prediction(payload2, dep2.connection == "stream");
       } else {
         dep2.final_event = payload2;
       }
     }
   }
-  async function make_prediction(payload2) {
+  $:
+    console.log({ app });
+  async function make_prediction(payload2, streaming = false) {
     if (api_recorder_visible) {
       api_calls = [...api_calls, JSON.parse(JSON.stringify(payload2))];
     }
     let submission;
+    app.set_current_payload(payload2);
+    if (streaming) {
+      if (!submit_map.has(dep_index)) {
+        dep.inputs.forEach((id) => modify_stream(id, "waiting"));
+      } else if (submit_map.has(dep_index) && dep.inputs.some((id) => get_stream_state(id) === "waiting")) {
+        return;
+      } else if (submit_map.has(dep_index) && dep.inputs.some((id) => get_stream_state(id) === "open")) {
+        await app.post_data(
+          // @ts-ignore
+          `${app.config.root + app.config.api_prefix}/stream/${submit_map.get(dep_index).event_id()}`,
+          { ...payload2, session_hash: app.session_hash }
+        );
+        return;
+      }
+    }
     try {
       submission = app.submit(
         payload2.fn_index,
@@ -248,7 +288,7 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
       const { data, fn_index } = message;
       if (dep.pending_request && dep.final_event) {
         dep.pending_request = false;
-        make_prediction(dep.final_event);
+        make_prediction(dep.final_event, dep.connection == "stream");
       }
       dep.pending_request = false;
       handle_update(data, fn_index);
@@ -287,10 +327,24 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
         ...messages
       ];
     }
+    function open_stream_events(status, id, dep2) {
+      if (status.original_msg === "process_starts" && dep2.connection === "stream") {
+        modify_stream(id, "open");
+      }
+    }
     function handle_status_update(message) {
       const { fn_index, ...status } = message;
+      if (status.stage === "streaming" && status.time_limit) {
+        dep.inputs.forEach((id) => {
+          set_time_limit(id, status.time_limit);
+        });
+      }
+      dep.inputs.forEach((id) => {
+        open_stream_events(message, id, dep);
+      });
       loading_status.update({
         ...status,
+        time_limit: status.time_limit,
         status: status.stage,
         progress: status.progress_data,
         fn_index
@@ -310,17 +364,23 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
           ...messages
         ];
       }
-      if (status.stage === "complete") {
+      if (status.stage === "complete" || status.stage === "generating") {
         status.changed_state_ids?.forEach((id) => {
           dependencies.filter((dep2) => dep2.targets.some(([_id, _2]) => _id === id)).forEach((dep2) => {
             wait_then_trigger_api_call(dep2.id, payload2.trigger_id);
           });
         });
+      }
+      if (status.stage === "complete") {
         dependencies.forEach(async (dep2) => {
           if (dep2.trigger_after === fn_index) {
             wait_then_trigger_api_call(dep2.id, payload2.trigger_id);
           }
         });
+        dep.inputs.forEach((id) => {
+          modify_stream(id, "closed");
+        });
+        submit_map.delete(dep_index);
       }
       if (status.broken && is_mobile_device && user_left_page) {
         window.setTimeout(() => {
@@ -396,13 +456,19 @@ async function handle_mount() {
       wait_then_trigger_api_call(dep.id);
     }
   });
-  if (render_complete)
+  if (!target || render_complete)
     return;
   target.addEventListener("prop_change", (e) => {
     if (!isCustomEvent(e))
       throw new Error("not a custom event");
     const { id, prop, value } = e.detail;
     update_value([{ id, prop, value }]);
+    if (prop === "input_ready" && value === false) {
+      inputs_waiting.push(id);
+    }
+    if (prop === "input_ready" && value === true) {
+      inputs_waiting = inputs_waiting.filter((item) => item !== id);
+    }
   });
   target.addEventListener("gradio", (e) => {
     if (!isCustomEvent(e))
@@ -415,6 +481,17 @@ async function handle_mount() {
       messages = [new_message(data, -1, event), ...messages];
     } else if (event == "clear_status") {
       update_status(id, "complete", data);
+    } else if (event == "close_stream") {
+      const deps = $targets[id]?.[data];
+      deps?.forEach((dep_id) => {
+        if (submit_map.has(dep_id)) {
+          app.post_data(
+            // @ts-ignore
+            `${app.config.root + app.config.api_prefix}/stream/${submit_map.get(dep_id).event_id()}/close`,
+            {}
+          );
+        }
+      });
     } else {
       const deps = $targets[id]?.[event];
       deps?.forEach((dep_id) => {
@@ -470,6 +547,16 @@ function set_status(statuses) {
 function isCustomEvent(event) {
   return "detail" in event;
 }
+onMount(() => {
+  document.addEventListener("visibilitychange", function() {
+    if (document.visibilityState === "hidden") {
+      user_left_page = true;
+    }
+  });
+  is_mobile_device = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
+    navigator.userAgent
+  );
+});
 </script>
 
 <svelte:head>
@@ -480,19 +567,19 @@ function isCustomEvent(event) {
 
 <div class="wrap" style:min-height={app_mode ? "100%" : "auto"}>
 	<div class="contain" style:flex-grow={app_mode ? "1" : "auto"}>
-		{#if $_layout && app.config}
-			<MountComponents
-				rootNode={$_layout}
-				{root}
-				{target}
-				{theme_mode}
-				on:mount={handle_mount}
-				{version}
-				{autoscroll}
-				max_file_size={app.config.max_file_size}
-				client={app}
-			/>
-		{/if}
+		<!-- {#if $_layout} -->
+		<MountComponents
+			rootNode={$_layout}
+			{root}
+			{target}
+			{theme_mode}
+			on:mount={handle_mount}
+			{version}
+			{autoscroll}
+			{max_file_size}
+			client={app}
+		/>
+		<!-- {/if} -->
 	</div>
 
 	{#if show_footer}

package/dist/src/Blocks.svelte.d.ts

@@ -24,6 +24,10 @@ declare const __propDef: {
         fill_height?: boolean | undefined;
         ready: boolean;
         username: string | null;
+        api_prefix: string;
+        max_file_size: number;
+        initial_layout?: LayoutNode | undefined;
+        search_params: URLSearchParams;
         render_complete?: boolean | undefined;
         add_new_message?: ((message: string, type: ToastMessage["type"]) => void) | undefined;
     };

package/dist/src/MountComponents.svelte

@@ -14,13 +14,15 @@ onMount(() => {
 });
 </script>
 
-<Render
-	node={rootNode}
-	{root}
-	{target}
-	{theme_mode}
-	{version}
-	{autoscroll}
-	{max_file_size}
-	{client}
-/>
+{#if rootNode}
+	<Render
+		node={rootNode}
+		{root}
+		{target}
+		{theme_mode}
+		{version}
+		{autoscroll}
+		{max_file_size}
+		{client}
+	/>
+{/if}

package/dist/src/Render.svelte

@@ -25,17 +25,20 @@ onMount(() => {
     }
   };
 });
-$:
-  node.children = node.children && node.children.filter((v) => {
-    const valid_node = node.type !== "statustracker";
-    if (!valid_node) {
-      filtered_children.push(v);
-    }
-    return valid_node;
-  });
+$: {
+  if (node) {
+    node.children = node.children && node.children.filter((v) => {
+      const valid_node = node.type !== "statustracker";
+      if (!valid_node) {
+        filtered_children.push(v);
+      }
+      return valid_node;
+    });
+  }
+}
 setContext("BLOCK_KEY", parent);
 $: {
-  if (node.type === "form") {
+  if (node && node.type === "form") {
     if (node.children?.every((c) => !c.props.visible)) {
       node.props.visible = false;
     } else {
@@ -44,7 +47,7 @@ $: {
   }
 }
 $:
-  gradio_class = new Gradio(
+  node.props.gradio = new Gradio(
     node.id,
     target,
     theme_mode,
@@ -59,7 +62,7 @@ $:
 </script>
 
 <RenderComponent
-	_id={node.id}
+	_id={node?.id}
 	component={node.component}
 	bind:instance={node.instance}
 	bind:value={node.props.value}
@@ -70,7 +73,6 @@ $:
 	{...node.props}
 	{theme_mode}
 	{root}
-	gradio={gradio_class}
 >
 	{#if node.children && node.children.length}
 		{#each node.children as _node (_node.id)}

package/dist/src/RenderComponent.svelte

@@ -7,7 +7,6 @@ export let target;
 export let theme_mode;
 export let instance;
 export let value;
-export let gradio;
 export let elem_id;
 export let elem_classes;
 export let _id;
@@ -19,6 +18,8 @@ function wrap(component2) {
       const props = Object.keys(instance2.$$.props);
       function report(props2) {
         return function(propargs) {
+          if (!target)
+            return;
           const ev = s(_id, props2, propargs);
           target.dispatchEvent(ev);
         };
@@ -45,7 +46,6 @@ const _component = wrap(component);
 	{...$$restProps}
 	{theme_mode}
 	{root}
-	{gradio}
 >
 	<slot />
 </svelte:component>

package/dist/src/RenderComponent.svelte.d.ts

@@ -1,5 +1,4 @@
 import { SvelteComponent } from "svelte";
-import type { Gradio } from "./gradio_helper";
 import type { ComponentMeta, ThemeMode } from "./types";
 declare const __propDef: {
     props: {
@@ -10,7 +9,6 @@ declare const __propDef: {
         theme_mode: ThemeMode;
         instance: ComponentMeta["instance"];
         value: any;
-        gradio: Gradio;
         elem_id: string;
         elem_classes: string[];
         _id: number;

package/dist/src/api_docs/ApiDocs.svelte

@@ -38,7 +38,9 @@ const langs = [
 ];
 let is_running = false;
 async function get_info() {
-  let response = await fetch(root + "info");
+  let response = await fetch(
+    root.replace(/\/$/, "") + app.api_prefix + "/info"
+  );
   let data = await response.json();
   return data;
 }
@@ -205,6 +207,7 @@ onMount(() => {
 								{root}
 								{space_id}
 								{username}
+								api_prefix={app.api_prefix}
 							/>
 
 							<ParametersSnippet

package/dist/src/api_docs/CodeSnippet.svelte

@@ -5,6 +5,7 @@ import EndpointDetail from "./EndpointDetail.svelte";
 export let dependency;
 export let dependency_index;
 export let root;
+export let api_prefix;
 export let space_id;
 export let endpoint_parameters;
 export let named;
@@ -21,6 +22,10 @@ let blob_components = ["Audio", "File", "Image", "Video"];
 let blob_examples = endpoint_parameters.filter(
   (param) => blob_components.includes(param.component)
 );
+$:
+  normalised_api_prefix = api_prefix ? api_prefix : "/";
+$:
+  normalised_root = root.replace(/\/$/, "");
 </script>
 
 <div class="container">
@@ -121,7 +126,7 @@ console.log(result.data);
 				</div>
 
 				<div bind:this={bash_post_code}>
-					<pre>curl -X POST {root}call/{dependency.api_name} -s -H "Content-Type: application/json" -d '{"{"}
+					<pre>curl -X POST {normalised_root}{normalised_api_prefix}/call/{dependency.api_name} -s -H "Content-Type: application/json" -d '{"{"}
   "data": [{#each endpoint_parameters as { label, parameter_name, type, python_type, component, example_input, serializer }, i}
 							<!-- 
 -->{represent_value(
@@ -133,7 +138,7 @@ console.log(result.data);
 						{/each}
 ]{"}"}' \
   | awk -F'"' '{"{"} print $4{"}"}'  \
-  | read EVENT_ID; curl -N {root}call/{dependency.api_name}/$EVENT_ID</pre>
+  | read EVENT_ID; curl -N {normalised_root}{normalised_api_prefix}/call/{dependency.api_name}/$EVENT_ID</pre>
 				</div>
 			</code>
 		</Block>

package/dist/src/api_docs/CodeSnippet.svelte.d.ts

@@ -5,6 +5,7 @@ declare const __propDef: {
         dependency: Dependency;
         dependency_index: number;
         root: string;
+        api_prefix: string;
         space_id: string | null;
         endpoint_parameters: any;
         named: boolean;

package/dist/src/css.js

@@ -1,5 +1,6 @@
 let supports_adopted_stylesheets = false;
-if ("attachShadow" in Element.prototype &&
+if (typeof window !== "undefined" &&
+    "attachShadow" in Element.prototype &&
     "adoptedStyleSheets" in Document.prototype) {
     // Both Shadow DOM and adoptedStyleSheets are supported
     const shadow_root_test = document

package/dist/src/init.d.ts

@@ -16,6 +16,9 @@ export declare function create_components(): {
     targets: Writable<TargetMap>;
     update_value: (updates: UpdateTransaction[]) => void;
     get_data: (id: number) => any | Promise<any>;
+    modify_stream: (id: number, state: "open" | "waiting" | "closed") => void;
+    get_stream_state: (id: number) => "open" | "waiting" | "closed" | "not_set";
+    set_time_limit: (id: number, time_limit: number | undefined) => void;
     loading_status: ReturnType<typeof create_loading_status_store>;
     scheduled_updates: Writable<boolean>;
     create_layout: (args: {
@@ -27,7 +30,7 @@ export declare function create_components(): {
         options: {
             fill_height: boolean;
         };
-    }) => void;
+    }) => Promise<void>;
     rerender_layout: (args: {
         render_id: number;
         components: ComponentMeta[];