Skip to content

fix(ui): improve dashboard widget edit controls#17359

Open
JarrodMFlesch wants to merge 1 commit into
mainfrom
dashboard-widget-controls
Open

fix(ui): improve dashboard widget edit controls#17359
JarrodMFlesch wants to merge 1 commit into
mainfrom
dashboard-widget-controls

Conversation

@JarrodMFlesch

Copy link
Copy Markdown
Contributor

Improves modular dashboard widget edit controls by relying on shared Button styling for the edit, delete, and width controls.

The widget edit state now dims the widget content with a focus outline, and keeps that overlay active while the width popup is open so portaled popup content remains visually associated with its widget. The width popup trigger uses renderButton, and the edit icon 24px path now matches the 16px EditIcon orientation instead of the previous rotated path.

Related:

  • Adds a focused unit test for the 24px EditIcon path.
  • Updates the dashboard drop indicator to use --color-bg-brand-secondary.

Verified with:

  • pnpm exec eslint packages/ui/src/icons/Edit/index.tsx packages/ui/src/views/Dashboard/Default/ModularDashboard/WidgetEditControl.tsx packages/ui/src/views/Dashboard/Default/ModularDashboard/index.client.tsx
  • pnpm exec vitest run --project unit packages/ui/src/icons/Edit/index.spec.ts

Note: lint-pr-title "fix(ui): improve dashboard widget edit controls" was skipped because lint-pr-title is not installed in this environment.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@github-actions

Copy link
Copy Markdown
Contributor

📦 esbuild Bundle Analysis for payload

This analysis was generated by esbuild-bundle-analyzer. 🤖
This PR introduced no changes to the esbuild bundle! 🙌

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

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant