Skip to content

feat(apollo-react): add CanvasPropertiesPanel control component#757

Closed
1980computer wants to merge 1 commit into
mainfrom
new-canvas-panel-component
Closed

feat(apollo-react): add CanvasPropertiesPanel control component#757
1980computer wants to merge 1 commit into
mainfrom
new-canvas-panel-component

Conversation

@1980computer
Copy link
Copy Markdown
Collaborator

Summary

  • Adds a new CanvasPropertiesPanel control component to packages/apollo-react/src/canvas/controls/
  • Pill-trigger (Properties label + sliders icon) + fixed-positioned popover menu, pixel-matched to the flow-prototype reference
  • Pure Tailwind using apollo-wind Future design tokens (bg-surface-raised, text-foreground-muted, border-border-subtle, bg-foreground-accent, etc.) — no Emotion
  • Popover sections: per-panel toggles (Parameters / Input / Output), Panel Behavior (auto-hide / always-persist), Default Layouts (Right / Bottom / Split), Saved Presets with optional save + delete actions
  • Storybook story at Canvas/Components/Controls/CanvasPropertiesPanel with Default (interactive), States (doc layout), and WithPresets variants

Test plan

  • Open Storybook → Canvas > Components > Controls > CanvasPropertiesPanel
  • Default: click the sliders icon — popover opens anchored to the button, closes on outside click
  • States: confirm two-column layout — Default State (pill only) and Clicked State with full popover rendered inline
  • WithPresets: confirm preset list renders with delete buttons and "Save as preset" row
  • Toggle a panel item (Parameters / Input / Output) — dot flips between accent and overlay
  • Toggle behavior — blue dot moves between Auto hide / Always persist
  • Confirm w-fit keeps trigger pill sized to content (not full-width)
  • TypeScript: pnpm --filter @uipath/apollo-react exec tsc --noEmit passes clean

🤖 Generated with Claude Code

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 28, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (PT)
apollo-design 🟢 Ready Preview, Logs May 28, 2026, 11:09:25 AM
apollo-docs 🟢 Ready Preview, Logs May 28, 2026, 11:09:25 AM
apollo-landing 🟢 Ready Preview, Logs May 28, 2026, 11:09:25 AM
apollo-ui-react 🟢 Ready Preview, Logs May 28, 2026, 11:09:25 AM
apollo-vertex 🟢 Ready Preview, Logs May 28, 2026, 11:09:25 AM

@github-actions github-actions Bot added pkg:apollo-react size:XL 500-999 changed lines. labels May 28, 2026
@github-actions
Copy link
Copy Markdown
Contributor

Dependency License Review

  • 1901 package(s) scanned
  • ✅ No license issues found
  • ⚠️ 2 package(s) excluded (see details below)
License distribution
License Packages
MIT 1671
ISC 89
Apache-2.0 55
BSD-3-Clause 27
BSD-2-Clause 23
BlueOak-1.0.0 8
MPL-2.0 4
MIT-0 3
CC0-1.0 3
MIT OR Apache-2.0 2
(MIT OR Apache-2.0) 2
Unlicense 2
LGPL-3.0-or-later 1
Python-2.0 1
CC-BY-4.0 1
(MPL-2.0 OR Apache-2.0) 1
Unknown 1
Artistic-2.0 1
(WTFPL OR MIT) 1
(BSD-2-Clause OR MIT OR Apache-2.0) 1
CC-BY-3.0 1
0BSD 1
(MIT OR CC0-1.0) 1
MIT AND ISC 1
Excluded packages
Package Version License Reason
@img/sharp-libvips-linux-x64 1.2.4 LGPL-3.0-or-later LGPL pre-built binary, not linked
khroma 2.1.0 Unknown MIT per GitHub repo, missing license field in package.json

@1980computer 1980computer force-pushed the new-canvas-panel-component branch from 7bd9d25 to a3a506a Compare May 28, 2026 18:03
Adds a new pill-trigger + popover control for configuring canvas panel
visibility, behavior (auto-hide / always-persist), default layout, and
saved presets. Pixel-matched to the flow-prototype reference using
apollo-wind Future design tokens. Pure Tailwind, no Emotion.

Story registered under Canvas/Components/Controls/CanvasPropertiesPanel
with Default, States, and WithPresets variants.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@1980computer 1980computer force-pushed the new-canvas-panel-component branch from a3a506a to c4021e4 Compare May 28, 2026 18:03
@1980computer
Copy link
Copy Markdown
Collaborator Author

Closing — this work has been absorbed into PR #760 (add-properties-panel-form-manifest) which consolidates the CanvasPropertiesPanel alongside the new NodeManifestPanel.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

pkg:apollo-react size:XL 500-999 changed lines.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant