Skip to content

Sankey: ribbon primitive + layout engine #375

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Alek99 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Sankey: ribbon primitive + layout engine #375

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
41cf87e
Sankey: ribbon primitive + layout engine (protocol v11)
Alek99 Jul 29, 2026
4b39558
Improve Sankey docs and interactions
Alek99 Jul 29, 2026
91655cc
Sankey/ribbon review fixes: axis modes, outlines, alpha ramps, alignm…
Alek99 Jul 30, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 6 additions & 2 deletions docs/app/scripts/check_html_routes.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
ROUTES_ROOT = APP_ROOT / ".web" / "app" / "routes"
LIVE_PREVIEW_MARKERS = ("python demo exec", "python demo-only exec")
INLINE_SVG_PREVIEW_ROUTES = {"/overview/gallery/"}
INLINE_SVG_PREVIEW_COUNT = 29
XY_PAYLOAD_PATTERN = re.compile(r'["\'](?P<url>/docs/xy/xy/[a-f0-9]+\.xyf)["\']')
XY_PAYLOAD_MAGIC = b"XYBF"
LLMS_DIRECTIVE = "For AI agents: the complete XY documentation index is at"
Expand Down Expand Up @@ -80,8 +81,11 @@ def validate_inline_svg_gallery(page_route: str, module_path: Path) -> None:
"""Validate the code-native chart tiles in the compiled gallery route."""
source = module_path.read_text(encoding="utf-8")
preview_count = source.count('viewBox=\\"0 0 320 232\\"')
if preview_count != 28:
msg = f"Inline SVG gallery has {preview_count} previews, expected 28: {page_route}"
if preview_count != INLINE_SVG_PREVIEW_COUNT:
msg = (
f"Inline SVG gallery has {preview_count} previews, "
f"expected {INLINE_SVG_PREVIEW_COUNT}: {page_route}"
)
raise RuntimeError(msg)
for marker in ("gallery-preview-surface", "aspect-[320/232]", "shadow-large"):
if marker not in source:
Expand Down
26 changes: 15 additions & 11 deletions docs/app/tests/test_docs_site.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1206,18 +1206,18 @@ def test_chart_gallery_grid_renders_every_type_as_inline_svg(
chart_section = next(
leaves for title, _landing_route, _icon, leaves in DOCS_SECTIONS if title == "Chart Gallery"
)
assert len(chart_section) == 14
assert len(chart_section) == 15
assert "XYChart" not in rendered
assert rendered.count("dangerouslySetInnerHTML") == 28
assert rendered.count("dangerouslySetInnerHTML") == 29
assert rendered.count('id:"xy-chart-gallery"') == 1
assert rendered.count("main:has(#xy-chart-gallery) > div:has(#toc-navigation)") == 1
assert rendered.count("main:has(#xy-chart-gallery) > div:has(article #xy-chart-gallery)") == 1
assert rendered.count("display: none") == 1
assert rendered.count("max-width: 88rem") == 1
assert rendered.count("2xl:grid-cols-3") == 8
assert rendered.count("aspect-[320/232]") == 28
assert rendered.count("shadow-large") == 28
assert rendered.count("transition-bg") == 28
assert rendered.count("aspect-[320/232]") == 29
assert rendered.count("shadow-large") == 29
assert rendered.count("transition-bg") == 29
assert "--gallery-preview-surface: #fff" in rendered
assert "--gallery-preview-fill: #efeaff" in rendered
assert "--gallery-preview-soft: #dccfff" in rendered
Expand All @@ -1228,7 +1228,7 @@ def test_chart_gallery_grid_renders_every_type_as_inline_svg(
assert "object-contain" not in rendered
assert "object-center" not in rendered
assert "xy-tailwind-bridge" not in rendered
assert rendered.count("size:14") == 28
assert rendered.count("size:14") == 29
assert "size:6" not in rendered
for chart_type in (
"Line",
Expand All @@ -1249,6 +1249,7 @@ def test_chart_gallery_grid_renders_every_type_as_inline_svg(
"Error Bar",
"Stem",
"Segments",
"Sankey",
"Threshold",
"Triangle Mesh",
"Horizontal Line",
Expand Down Expand Up @@ -1293,7 +1294,7 @@ def test_chart_gallery_inline_svgs_share_the_component_preview_style() -> None:
for item in group.items
}

assert len(previews) == 28
assert len(previews) == 29
for svg in previews.values():
assert 'viewBox="0 0 320 232"' in svg
assert '<rect x="52" y="62" width="216" height="108" rx="12"' in svg
Expand Down Expand Up @@ -1371,6 +1372,7 @@ def test_chart_gallery_cards_link_to_family_pages_with_live_demo_anchors() -> No
"/charts/contour-plot/": "xy.contour(",
"/charts/stem-plot/": "xy.stem(",
"/charts/segments/": "xy.segments(",
"/charts/sankey/": "xy.sankey_chart(",
"/components/triangle-mesh/": "xy.triangle_mesh(",
}
for route, mark in standalone_chart_marks.items():
Expand Down Expand Up @@ -1408,7 +1410,7 @@ def test_chart_gallery_combines_only_the_requested_related_tiles() -> None:
titles = {item.title for group in _GALLERY_GROUPS for item in group.items}
section_titles = [group.title for group in _GALLERY_GROUPS]

assert len(titles) == 28
assert len(titles) == 29
assert section_titles[:3] == [
"Line and Area",
"Distributions",
Expand All @@ -1430,6 +1432,7 @@ def test_chart_gallery_combines_only_the_requested_related_tiles() -> None:
"Contour",
"Error Band",
"Error Bar",
"Sankey",
"Facet Chart",
"Layered Marks",
} <= titles
Expand Down Expand Up @@ -1517,17 +1520,17 @@ def test_inline_svg_gallery_validator_requires_every_styled_preview(tmp_path: Pa
module_path = tmp_path / "route.jsx"
preview = 'viewBox=\\"0 0 320 232\\"'
module_path.write_text(
preview * 28 + "gallery-preview-surface aspect-[320/232] shadow-large",
preview * 29 + "gallery-preview-surface aspect-[320/232] shadow-large",
encoding="utf-8",
)

check_html_routes.validate_inline_svg_gallery("/overview/gallery/", module_path)

module_path.write_text(
preview * 27 + "gallery-preview-surface aspect-[320/232] shadow-large",
preview * 28 + "gallery-preview-surface aspect-[320/232] shadow-large",
encoding="utf-8",
)
with pytest.raises(RuntimeError, match="27 previews, expected 28"):
with pytest.raises(RuntimeError, match="28 previews, expected 29"):
check_html_routes.validate_inline_svg_gallery("/overview/gallery/", module_path)


Expand Down Expand Up @@ -1945,6 +1948,7 @@ def test_chart_gallery_pages_append_factory_api_tables() -> None:
"/charts/uncertainty/": ("xy.error_band_chart", "xy.errorbar_chart"),
"/charts/stem-plot/": ("xy.stem_chart",),
"/charts/segments/": ("xy.segments_chart",),
"/charts/sankey/": ("xy.sankey_chart",),
"/components/triangle-mesh/": ("xy.triangle_mesh_chart",),
"/components/facets-and-layers/": ("xy.chart", "xy.facet_chart"),
}
Expand Down
9 changes: 8 additions & 1 deletion docs/app/xy_docs/api_reference.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,12 @@
("Uncertainty", (xy.error_band_chart, xy.errorbar_chart)),
(
"Specialized",
(xy.stem_chart, xy.segments_chart, xy.triangle_mesh_chart),
(
xy.stem_chart,
xy.segments_chart,
xy.sankey_chart,
xy.triangle_mesh_chart,
),
),
("Annotations", (xy.chart,)),
("Facets and Layers", (xy.chart, xy.facet_chart)),
Expand Down Expand Up @@ -79,6 +84,8 @@
xy.stairs,
xy.stem,
xy.segments,
xy.ribbon,
xy.sankey,
Comment thread
coderabbitai[bot] marked this conversation as resolved.
xy.triangle_mesh,
)

Expand Down
1 change: 1 addition & 0 deletions docs/app/xy_docs/config.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@
("Uncertainty", "/charts/uncertainty/"),
("Stem", "/charts/stem-plot/"),
("Segments", "/charts/segments/"),
("Sankey", "/charts/sankey/"),
),
),
(
Expand Down
4 changes: 4 additions & 0 deletions docs/app/xy_docs/gallery.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -165,6 +165,7 @@ class GalleryGroup:
(
GalleryItem("Stem", route="/charts/stem-plot/"),
GalleryItem("Segments", route="/charts/segments/"),
GalleryItem("Sankey", route="/charts/sankey/"),
GalleryItem("Triangle Mesh", route="/components/triangle-mesh/"),
),
),
Expand Down Expand Up @@ -245,6 +246,9 @@ class GalleryGroup:
""",
"Segments": """
<path d="M72 139L108 110M115 145L149 89M156 128L199 105M204 137L249 79" class="preview-line"/><circle cx="72" cy="139" r="3.5" class="preview-dot-soft"/><circle cx="108" cy="110" r="3.5" class="preview-dot"/><circle cx="115" cy="145" r="3.5" class="preview-dot-soft"/><circle cx="149" cy="89" r="3.5" class="preview-dot"/><circle cx="156" cy="128" r="3.5" class="preview-dot-soft"/><circle cx="199" cy="105" r="3.5" class="preview-dot"/><circle cx="204" cy="137" r="3.5" class="preview-dot-soft"/><circle cx="249" cy="79" r="3.5" class="preview-dot"/>
""",
"Sankey": """
<path d="M85 82C122 82 124 91 157 91V108C124 108 122 99 85 99Z" class="preview-fill"/><path d="M85 102C123 102 124 130 157 130V151C124 151 122 123 85 123Z" class="preview-fill-soft"/><path d="M174 92C207 92 208 76 239 76V97C208 97 207 113 174 113Z" class="preview-fill"/><path d="M174 118C207 118 208 125 239 125V148C208 148 207 141 174 141Z" class="preview-fill-soft"/><rect x="72" y="78" width="13" height="49" rx="3" class="preview-fill-strong"/><rect x="157" y="87" width="17" height="68" rx="3" class="preview-fill-strong"/><rect x="239" y="72" width="13" height="29" rx="3" class="preview-fill-strong"/><rect x="239" y="121" width="13" height="31" rx="3" class="preview-fill-strong"/>
""",
"Triangle Mesh": """
<path d="M72 147L105 87L143 139L175 73L214 121L249 82L262 151H72Z" class="preview-fill"/><path d="M72 147L105 87L143 139L175 73L214 121L249 82L262 151M72 147L143 139L214 121L262 151M105 87L175 73L249 82M105 87L143 139L175 73L214 121L249 82" class="preview-line preview-line-soft"/>
Expand Down
Loading
Loading