[feat] Add API for `st.space` by sfc-gh-lwilby · Pull Request #12737 · streamlit/streamlit

sfc-gh-lwilby · 2025-10-09T12:31:18Z

Describe your changes

Adds a new element, st.space. Use this to add space in between elements in vertical and horizontal layouts!

E.g. st.space("stretch"), st.space("medium"), st.space(100).

GitHub Issue Link (if applicable)

Testing Plan

Unit Tests (JS and/or Python) ✅
E2E Tests ✅

Contribution License Agreement

By submitting this pull request you agree that all contributions to this project are made under the Apache 2.0 license.

snyk-io · 2025-10-09T12:31:27Z

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Licenses	0	0	0	0	0 issues
✅	Open Source Security	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

sfc-gh-lwilby · 2025-10-09T12:31:28Z

This stack of pull requests is managed by Graphite. Learn more about stacking.

github-actions · 2025-10-09T12:31:36Z

✅ PR preview is ready!

Name	Link
📦 Wheel file	https://core-previews.s3-us-west-2.amazonaws.com/pr-12737/streamlit-1.50.0-py3-none-any.whl
📦 `@streamlit/component-v2-lib`	Download from artifacts
🕹️ Preview app	pr-12737.streamlit.app (☁️ Deploy here if not accessible)

Copilot

Pull Request Overview

This PR introduces a new st.space API that allows developers to add customizable spacing between elements in both vertical and horizontal layouts. The space element supports predefined sizes ("small", "medium", "large"), a "stretch" option to fill remaining space, and custom pixel values.

Key changes:

Added new space element with flexible sizing options including preset values and pixel dimensions
Implemented comprehensive test coverage for both unit and end-to-end scenarios
Integrated the space functionality into Streamlit's element system and public API

Reviewed Changes

Copilot reviewed 8 out of 17 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
lib/streamlit/elements/space.py	Core implementation of the space element with size validation and layout configuration
lib/streamlit/delta_generator.py	Integration of SpaceMixin into the DeltaGenerator class hierarchy
lib/streamlit/init.py	Export of space function in the public API
lib/tests/streamlit/elements/space_test.py	Unit tests covering all space size options and error cases
lib/tests/streamlit/element_mocks.py	Added space element to test mocks
lib/streamlit/testing/v1/element_tree.py	Testing framework support for space elements
e2e_playwright/st_space_test.py	End-to-end tests for space rendering and behavior
e2e_playwright/st_space.py	Test application demonstrating space usage in various contexts

lib/streamlit/elements/space.py

lukasmasuch · 2025-10-09T18:34:15Z

lib/streamlit/elements/space.py

+        return self.dg._enqueue(  # type: ignore[attr-defined,no-any-return]
+            "space", space_proto, layout_config=layout_config
+        )


Why is the # type: ignore[attr-defined,no-any-return] needed here but not for any other command?

Hmmm I think this is probably a mistake from the agent. At one point it did the wrong thing with fixing the types for layout_config and maybe this is residual. I will take a look.

lukasmasuch · 2025-10-09T18:36:43Z

e2e_playwright/__snapshots__/linux/st_space_test/st_space_horizontal_container[chromium].png

question: There still seems to be some space after the After stretch space. I would have expected that the stretch fills all available space. Why is that the case?

Yes, this is because I used st.write() statements and they are stretch width so the extra space is distributed amongst the elements (including st.space). It also looks a bit unexpected because the text is left-aligned so the last st.write() statement appears different than the first one.

I decided to update to st.markdown(width="content") for the test -- that shows the space a better.

lukasmasuch · 2025-10-09T18:39:10Z

e2e_playwright/st_space_test.py

+    first_space_box = first_space.bounding_box()
+    assert first_space_box is not None
+    assert int(first_space_box["height"]) == 40  # 2.5rem * 16px = 40px
+
+    # Second space: st.space("large") = 4.25rem = 68px height
+    second_space = space_elements.nth(1)
+    second_space_box = second_space.bounding_box()
+    assert second_space_box is not None
+    assert int(second_space_box["height"]) == 68  # 4.25rem * 16px = 68px


not sure if it is the case here, but it might be better to use a wait_until to prevent flakiness, e.g.:

streamlit/e2e_playwright/st_set_page_config_test.py

Lines 49 to 53 in b15e4cc

wait_until(

app,

lambda: (bbox := expander_container.bounding_box()) is not None

and bbox["width"] > narrow_expander_width,

)

github-actions · 2025-10-10T17:25:55Z

📉 Frontend coverage change detected

The frontend unit test (vitest) coverage has decreased by 0.0000%

Current PR: 84.8300% (48252 lines, 7317 missed)
Latest develop: 84.8300% (48252 lines, 7317 missed)

✅ Coverage change is within normal range.

📊 View detailed coverage comparison

lib/streamlit/testing/v1/element_tree.py

…rclass `__init__` during object initialization Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

sfc-gh-lwilby · 2025-10-20T16:49:11Z

e2e_playwright/st_space_test.py

+    assert_snapshot(nested_container, name="st_space_nested_containers")
+
+
+def test_space_sizes_match_widget_heights(app: Page):


This test addresses some feedback from Lukas from the previous PR about making sure we keep the values in sync between backend and frontend #12736 (comment)

This was referenced Oct 9, 2025

[feat] Proto changes for st.space #12732

Merged

[feat] Update useLayoutStyles to support REM type #12733

Merged

[feat] Styling customizations for st.space #12734

Merged

sfc-gh-lwilby mentioned this pull request Oct 9, 2025

[feat] Add rendering logic for st.space elements in frontend. #12735

Merged

sfc-gh-lwilby mentioned this pull request Oct 9, 2025

[feat] Update layout utilities to support st.space #12736

Merged

sfc-gh-lwilby changed the title ~~st-space-add-space-api~~ [feat] Add API for st.space Oct 9, 2025

sfc-gh-lwilby added security-assessment-completed change:feature PR contains new feature or enhancement implementation impact:users PR changes affect end users labels Oct 9, 2025

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 4bc1388 to a27a540 Compare October 9, 2025 13:02

sfc-gh-lwilby force-pushed the 10-09-st-space-utilities branch from 6ec879b to 6f2a490 Compare October 9, 2025 13:02

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch 2 times, most recently from 5d5f3a8 to f90346e Compare October 9, 2025 13:57

sfc-gh-lwilby marked this pull request as ready for review October 9, 2025 14:20

lukasmasuch requested a review from Copilot October 9, 2025 18:18

Copilot AI reviewed Oct 9, 2025

View reviewed changes

lukasmasuch reviewed Oct 9, 2025

View reviewed changes

sfc-gh-lwilby force-pushed the 10-09-st-space-utilities branch from 6f2a490 to 63b78b9 Compare October 10, 2025 17:11

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from f90346e to 153ea80 Compare October 10, 2025 17:11

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 153ea80 to 8117630 Compare October 10, 2025 17:51

sfc-gh-lwilby force-pushed the 10-09-st-space-utilities branch from 63b78b9 to d22d189 Compare October 10, 2025 17:51

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 8117630 to e1d755a Compare October 10, 2025 17:55

sfc-gh-lwilby force-pushed the 10-09-st-space-utilities branch 2 times, most recently from 5b76187 to cf3ad90 Compare October 11, 2025 06:34

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from e1d755a to 9a4e9f8 Compare October 11, 2025 06:34

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 9a4e9f8 to 2be7fb5 Compare October 11, 2025 08:15

sfc-gh-lwilby force-pushed the 10-09-st-space-utilities branch from cf3ad90 to fcda0e6 Compare October 11, 2025 08:15

sfc-gh-lwilby changed the base branch from 10-09-st-space-utilities to graphite-base/12737 October 20, 2025 12:53

sfc-gh-lwilby force-pushed the graphite-base/12737 branch from fcda0e6 to e01c6b3 Compare October 20, 2025 13:06

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 2be7fb5 to 74caadd Compare October 20, 2025 13:06

sfc-gh-lwilby changed the base branch from graphite-base/12737 to 10-09-st-space-utilities October 20, 2025 13:06

Base automatically changed from 10-09-st-space-utilities to develop October 20, 2025 13:41

st-space-add-space-api

6be291f

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 74caadd to 6be291f Compare October 20, 2025 14:09

github-advanced-security bot found potential problems Oct 20, 2025

View reviewed changes

lib/streamlit/testing/v1/element_tree.py Dismissed Show dismissed Hide dismissed

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 991a1ca to 918e5c2 Compare October 20, 2025 14:35

Potential fix for code scanning alert no. 10760: Missing call to supe…

5f5d473

…rclass `__init__` during object initialization Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

sfc-gh-lwilby force-pushed the 10-09-st-space-add-space-api branch from 918e5c2 to 5f5d473 Compare October 20, 2025 15:04

sfc-gh-lwilby commented Oct 20, 2025

View reviewed changes

sfc-gh-bnisco approved these changes Oct 20, 2025

View reviewed changes

sfc-gh-lwilby merged commit e5e13cd into develop Oct 20, 2025
39 checks passed

sfc-gh-lwilby deleted the 10-09-st-space-add-space-api branch October 20, 2025 20:30

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[feat] Add API for `st.space`#12737

[feat] Add API for `st.space`#12737
sfc-gh-lwilby merged 2 commits intodevelopfrom
10-09-st-space-add-space-api

sfc-gh-lwilby commented Oct 9, 2025 •

edited

Loading

Uh oh!

snyk-io bot commented Oct 9, 2025 •

edited

Loading

Uh oh!

sfc-gh-lwilby commented Oct 9, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Oct 9, 2025 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

lukasmasuch Oct 9, 2025

Uh oh!

sfc-gh-lwilby Oct 9, 2025

Uh oh!

lukasmasuch Oct 9, 2025

Uh oh!

sfc-gh-lwilby Oct 10, 2025 •

edited

Loading

Uh oh!

lukasmasuch Oct 9, 2025

Uh oh!

github-actions bot commented Oct 10, 2025 •

edited

Loading

Uh oh!

Uh oh!

sfc-gh-lwilby Oct 20, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

	wait_until(
	app,
	lambda: (bbox := expander_container.bounding_box()) is not None
	and bbox["width"] > narrow_expander_width,
	)

		assert_snapshot(nested_container, name="st_space_nested_containers")


		def test_space_sizes_match_widget_heights(app: Page):

Conversation

sfc-gh-lwilby commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Describe your changes

GitHub Issue Link (if applicable)

Testing Plan

Uh oh!

snyk-io bot commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Snyk checks have passed. No issues have been found so far.

Uh oh!

sfc-gh-lwilby commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ PR preview is ready!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

lukasmasuch Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

sfc-gh-lwilby Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

lukasmasuch Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

sfc-gh-lwilby Oct 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

lukasmasuch Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Oct 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📉 Frontend coverage change detected

Uh oh!

Uh oh!

sfc-gh-lwilby Oct 20, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

sfc-gh-lwilby commented Oct 9, 2025 •

edited

Loading

snyk-io bot commented Oct 9, 2025 •

edited

Loading

sfc-gh-lwilby commented Oct 9, 2025 •

edited

Loading

github-actions bot commented Oct 9, 2025 •

edited

Loading

sfc-gh-lwilby Oct 10, 2025 •

edited

Loading

github-actions bot commented Oct 10, 2025 •

edited

Loading