From a237544ce0546cd56f832181b7a1c0bec80dbcf7 Mon Sep 17 00:00:00 2001
From: "Yuichiro Tachibana (Tsuchiya)" <t.yic.yt@gmail.com>
Date: Wed, 22 Feb 2023 23:52:31 +0900
Subject: [PATCH 1/2] Add a section about embedding Streamlit Spaces with
 auto-resizing iframes

---
 docs/hub/spaces-sdks-streamlit.md | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/docs/hub/spaces-sdks-streamlit.md b/docs/hub/spaces-sdks-streamlit.md
index afb6e3605..61a2d9a82 100644
--- a/docs/hub/spaces-sdks-streamlit.md
+++ b/docs/hub/spaces-sdks-streamlit.md
@@ -82,4 +82,30 @@ For example, the demo above can be embedded in these docs with the following tag
 
 <iframe src="https://NimaBoscarino-hotdog-streamlit.hf.space" frameBorder="0" height="600" title="Streamlit app" class="container p-0 flex-grow space-iframe" allow="accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"></iframe>
 
+## Embed Streamlit Spaces with auto-resizing IFrames
+
+Streamlit has supported automatic iframe resizing since [1.17.0](https://docs.streamlit.io/library/changelog#version-1170) so that the size of the parent iframe is automatically adjusted to fit the content volume of the embedded Streamlit application.
+
+It relies on the [`iFrame Resizer`](https://github.com/davidjbradshaw/iframe-resizer) library, which you need to add a few lines of code to use, as in the following example where
+
+- `id` is set to `<iframe />` that is used to specify the auto-resize target.
+- The `iFrame Resizer` is loaded via the `script` tag.
+- The `iFrameResize()` function is called with the ID of the target `iframe` element, so that its size changes automatically.
+
+We can pass options to the first argument of `iFrameResize()`. See [the document](https://github.com/davidjbradshaw/iframe-resizer/blob/master/docs/parent_page/options.md) for the details.
+
+```html
+<iframe
+	id="your-iframe-id"
+	src="https://<space-subdomain>.hf.space"
+	frameborder="0"
+	width="850"
+	height="450"
+></iframe>
+<script src="https://cdn.jsdelivr.net/npm/iframe-resizer@4.3.4/js/iframeResizer.min.js"></script>
+<script>
+  iFrameResize({}, "#your-iframe-id")
+</script>
+```
+
 Additionally, you can checkout [our documentation](./spaces-embed).

From 29bb10e1306bcba56146d7148c5280b2c79f62e4 Mon Sep 17 00:00:00 2001
From: "Yuichiro Tachibana (Tsuchiya)" <t.yic.yt@gmail.com>
Date: Tue, 4 Apr 2023 17:01:57 +0900
Subject: [PATCH 2/2] Update docs/hub/spaces-sdks-streamlit.md

Co-authored-by: christophe-rannou <christophe@huggingface.co>
---
 docs/hub/spaces-sdks-streamlit.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/hub/spaces-sdks-streamlit.md b/docs/hub/spaces-sdks-streamlit.md
index 61a2d9a82..38d7301d1 100644
--- a/docs/hub/spaces-sdks-streamlit.md
+++ b/docs/hub/spaces-sdks-streamlit.md
@@ -86,7 +86,7 @@ For example, the demo above can be embedded in these docs with the following tag
 
 Streamlit has supported automatic iframe resizing since [1.17.0](https://docs.streamlit.io/library/changelog#version-1170) so that the size of the parent iframe is automatically adjusted to fit the content volume of the embedded Streamlit application.
 
-It relies on the [`iFrame Resizer`](https://github.com/davidjbradshaw/iframe-resizer) library, which you need to add a few lines of code to use, as in the following example where
+It relies on the [`iFrame Resizer`](https://github.com/davidjbradshaw/iframe-resizer) library, for which you need to add a few lines of code, as in the following example where
 
 - `id` is set to `<iframe />` that is used to specify the auto-resize target.
 - The `iFrame Resizer` is loaded via the `script` tag.