Skip to content

feat(evo-marko): evo-toast-dialog#631

Open
LuLaValva wants to merge 3 commits intomainfrom
evo-toast-dialog
Open

feat(evo-marko): evo-toast-dialog#631
LuLaValva wants to merge 3 commits intomainfrom
evo-toast-dialog

Conversation

@LuLaValva
Copy link
Copy Markdown
Member

  • Create <evo-toast-dialog> component

Differences from <ebay-toast-dialog>

  • Use <dialog> instead of <aside>
    • This means the top-level component is also in the focus order (it wasn't before)
  • Use @animation instead of transition
  • <@close> attr tag instead of a11yCloseText
  • controllable open (with openChange)

Copilot AI review requested due to automatic review settings April 17, 2026 23:08
@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Apr 17, 2026

🦋 Changeset detected

Latest commit: faeea27

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@evo-web/marko Patch
@ebay/skin Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

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

Adds a new evo-toast-dialog tag to evo-marko, aligning the toast dialog implementation with native <dialog> semantics (non-modal via .show()), and updates Skin toast-dialog styles to support <dialog> open/close animations.

Changes:

  • Added native <dialog>-based toast open/close keyframe animations and UA style resets in Skin.
  • Introduced the new evo-toast-dialog Marko component with header/close/footer attr-tag API and open control.
  • Added Storybook story plus SSR + browser tests for the new component.

Reviewed changes

Copilot reviewed 9 out of 10 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
packages/skin/src/sass/toast-dialog/toast-dialog.scss Adds keyframe animations and <dialog>-specific resets while keeping legacy transition classes deprecated.
packages/skin/dist/toast-dialog/toast-dialog.css Regenerated dist CSS reflecting new <dialog> animation/reset rules.
packages/evo-marko/src/tags/evo-toast-dialog/toast-dialog.stories.ts Adds Storybook metadata/argTypes and default story wiring.
packages/evo-marko/src/tags/evo-toast-dialog/test/test.server.ts Adds SSR snapshot coverage for default and open states.
packages/evo-marko/src/tags/evo-toast-dialog/test/test.browser.ts Adds browser assertions for element/attrs/classes and basic structure.
packages/evo-marko/src/tags/evo-toast-dialog/style.ts Wires Skin toast-dialog styles into the component.
packages/evo-marko/src/tags/evo-toast-dialog/index.marko Implements the new <dialog>-based toast component and close behavior.
packages/evo-marko/src/tags/evo-toast-dialog/examples/default.marko Provides an interactive open/close example used by Storybook.
packages/evo-marko/src/tags/evo-toast-dialog/README.md Adds component README and documentation links.

Comment thread packages/evo-marko/src/tags/evo-toast-dialog/index.marko
Comment thread packages/evo-marko/src/tags/evo-toast-dialog/index.marko
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.

2 participants