graycoreio / daffodil

Angular Ecommerce PWA Framework
https://next.daff.io
MIT License
155 stars 28 forks source link

Modal UI updates #2832

Closed xelaint closed 1 month ago

xelaint commented 3 months ago

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[x] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[ ] Other... Please describe:

What is the current behavior?

  1. Accessibility features are not comprehensive enough in modal.
  2. No easy way to add button to close modal

Part of: #2767

What is the new behavior?

  1. daffModalClose directive to pass in close modal event to a button to reduce code duplication. It's used in the close button in the header, and enduser can pass it into a <button> element in the actions component to also close the modal.
  2. Update UI with considerations on if header and footer is used or not.
  3. Add close button to header.
  4. Clean up and update docs.

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

damienwebdev commented 1 month ago

@xelaint this looks good to me. Can you fixup the commits and I'll merge this in directly?

xelaint commented 1 month ago

@damienwebdev done