[Style] Compact Modern Nodes #6687
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
PrimeVue number inputs are a pain to work with
dosubot
bot
added
the
size:L
🎨 Storybook Build Status✅ Build completed successfully! ⏰ Completed at: 11/13/2025, 11:49:35 PM UTC 🔗 Links🎉 Your Storybook is ready for review! |
🎭 Playwright Test Results❌ Some tests failed ⏰ Completed at: 11/14/2025, 12:03:59 AM UTC 📈 Summary
📊 Test Reports by Browser
🎉 Click on the links above to view detailed test results for each browser configuration. |
Bundle Size ReportSummary
Category Glance Per-category breakdownApp Entry Points — 2.94 MB (baseline 2.94 MB) • 🟢 -113 BMain entry bundles and manifests
Status: 4 added / 4 removed Graph Workspace — 799 kB (baseline 799 kB) • ⚪ 0 BGraph editor runtime, canvas, workflow orchestration
Status: 1 added / 1 removed Views & Navigation — 8 kB (baseline 8 kB) • ⚪ 0 BTop-level views, pages, and routed surfaces
Status: 1 added / 1 removed Panels & Settings — 306 kB (baseline 306 kB) • ⚪ 0 BConfiguration panels, inspectors, and settings screens
Status: 6 added / 6 removed UI Components — 266 kB (baseline 266 kB) • 🟢 -50 BReusable component library chunks
Status: 5 added / 5 removed Data & Services — 12.6 kB (baseline 12.6 kB) • ⚪ 0 BStores, services, APIs, and repositories
Status: 2 added / 2 removed Utilities & Hooks — 5.87 kB (baseline 5.87 kB) • ⚪ 0 BHelpers, composables, and utility bundles
Status: 1 added / 1 removed Vendor & Third-Party — 5.32 MB (baseline 5.32 MB) • ⚪ 0 BExternal libraries and shared vendor chunks
Other — 3.92 MB (baseline 3.92 MB) • 🟢 -388 BBundles that do not match a named category
Status: 15 added / 15 removed |
DrJKL
added
the
New Browser Test Expectations
|
Updating Playwright Expectations |
github-actions
bot
removed
the
New Browser Test Expectations
AustinMroz
previously approved these changes
Nov 13, 2025
DrJKL
added
the
New Browser Test Expectations
Collaborator
|
Changes look great. Some minor notes:
|
github-actions
bot
dismissed stale reviews from christian-byrne and AustinMroz
via
2d3ca9f
github-actions
bot
removed
the
New Browser Test Expectations
AustinMroz
approved these changes
Nov 14, 2025
Contributor
Author
|
@AustinMroz The label truncation is going to be tricky, but I think I have a good idea for it. |
benceruleanlu
pushed a commit
that referenced
this pull request
Nov 14, 2025
## Summary Simple and clean is the way that we're making the nodes tonight. ## Changes - **What**: Smaller minimum widths for nodes and labels - **What**: Smaller font for the labels - **What**: Removed outlines for widgets - **What**: Fixes a text/background issue with buttons on widgets - **What**: Smaller header - **What**: Less padding within the node itself ## Review Focus Check out the new styles and how they align with the Designs. ## Screenshots | Before | After | | --- | --- | | <img width="542" height="486" alt="image" src="https://github.com/user-attachments/assets/41fe9801-7a43-49ac-87fc-36d3b2ee82fb" /> | <img width="411" height="388" alt="image" src="https://github.com/user-attachments/assets/a7c21120-bf67-4039-86b3-c348bcc4341b" /> | <!-- Add screenshots or video recording to help explain your changes --> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6687-Style-Compact-Modern-Nodes-2aa6d73d365081c48db3c5491c556dc9) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <[email protected]>
christian-byrne
pushed a commit
that referenced
this pull request
Nov 18, 2025
#6731) ## Summary ### Problem: After [vue node compacting PR](#6687) the white space within the node has been greatly reduced, lowering the min intrinsic size, thus allowing us to reduce the amount we need to scale up via ensureCorrectLayoutScale(), therefore increasing readability of nodes. Great! However, a side effect of reducing the scale factor means nodes with larger min content will not be scaled up enough causing nodes to be too large in many cases. For example, if the min intrinsic width is very long due to input length: <img width="807" height="519" alt="image" src="https://github.com/user-attachments/assets/a6ea3852-bed5-49b2-b10e-c2e65c6450b2" /> ### Solution: Allow for nodes to be resized less than their intrinsic min width. And truncate widget inputs like many other node UIs do. IMPORTANT: when a node is added via search or other, it will still get a min size based on its intrinsic content it just wont be the min width! So best of both worlds. <img width="670" height="551" alt="image" src="https://github.com/user-attachments/assets/f4f5ec8c-037e-472f-a5a1-d8a59a87c0b0" /> this means we choose a default min width and clamp resize to it. This also means we have to remove the arbitrary min width values that were sprinkled around the vue node widgets. They are not needed because instead of min width, they can take up full width and inherit the sizing from the node min width! This makes nodes like little browser windows and widgets are just responsive elements with in. Much more natural imo. ### Bonus - Set ensureCorrectLayouScale() to scale factor of 1.2 which means vue nodes are now only being set 20% bigger than LG. That covers for the height difference we cant change! - Fix ensureCorrectLayouScale() to offset y position for groups / better alignment - Get rid of arbitrary inflexible min width like min-[417px] which shouldnt have been used the first place - Make Select and Input overlay portals width set to their content ## Changes **What**: - Node resizing behavior - Node widget min width - Widget input and slot truncation - Misc arbitrary styling that should have been fluid ## Screenshots (if applicable) https://github.com/user-attachments/assets/3ea4b8fe-565a-47f7-b3ab-6cef56cecde5 https://github.com/user-attachments/assets/2fe1e1a0-a9dc-4000-b865-ce2d8c7f3606 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6731-fix-arbitrary-styles-min-size-content-ensure-layout-calc-trunc-2af6d73d365081eab507c2f1638a4194) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Simple and clean is the way that we're making the nodes tonight.
Changes
Review Focus
Check out the new styles and how they align with the Designs.
Screenshots
┆Issue is synchronized with this Notion page by Unito