Skip to content

refactor(editor): Reshape search panel UI#764

Merged
ije merged 6 commits into
beta-1.3from
editor/refactor-css
Jun 3, 2026
Merged

refactor(editor): Reshape search panel UI#764
ije merged 6 commits into
beta-1.3from
editor/refactor-css

Conversation

@ije
Copy link
Copy Markdown
Collaborator

@ije ije commented Jun 2, 2026

the style.css and sprite.ts is independent from diffs global style and sprite for lazy importing.

Copilot AI review requested due to automatic review settings June 2, 2026 04:42
@vercel
Copy link
Copy Markdown

vercel Bot commented Jun 2, 2026

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

Project Deployment Actions Updated (UTC)
pierre-docs-diffshub Ready Ready Preview Jun 3, 2026 4:53am
pierre-docs-trees Ready Ready Preview Jun 3, 2026 4:53am
pierrejs-diff-demo Ready Ready Preview Jun 3, 2026 4:53am
pierrejs-docs Ready Ready Preview Jun 3, 2026 4:53am

Request Review

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR refactors the editor’s styling and icon rendering by moving editor CSS into a dedicated stylesheet and introducing an SVG sprite-based icon system used by editor widgets.

Changes:

  • Replaced inline editorCSS string with style.css and updated the editor to load it.
  • Added an editor-local SVG sprite sheet (sprite.ts) and switched Search/Quick Edit widgets to use it.
  • Updated theme CSS variable names for match highlighting.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 4 comments.

Show a summary per file
File Description
packages/diffs/src/editor/tokenzier.ts Updates injected theme CSS variable names for match highlighting and cursor color.
packages/diffs/src/editor/style.css Introduces externalized editor/widget CSS previously embedded in TS.
packages/diffs/src/editor/sprite.ts Adds SVG sprite sheet + helper for generating icon SVG markup.
packages/diffs/src/editor/searchPanel.ts Replaces inline SVG strings with sprite-based icons.
packages/diffs/src/editor/quickEdit.ts Replaces inline SVG string with sprite-based icon.
packages/diffs/src/editor/editor.ts Loads style.css, injects sprite sheet into Shadow DOM, and removes old css.ts usage.
packages/diffs/src/editor/css.ts Removes legacy embedded CSS constants (migrated to style.css).

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread packages/diffs/src/editor/editor.ts Outdated
Comment thread packages/diffs/src/editor/editor.ts Outdated
Comment thread packages/diffs/src/editor/sprite.ts Outdated
Comment thread packages/diffs/src/editor/style.css Outdated
@ije ije changed the title refactor(editor): Add editor.css and sprite.ts refactor(editor): Reshape search panel UI Jun 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants