Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor(overlays)!: Simplify usage introducing anchor property and new Design #1661

Merged
merged 31 commits into from
Jan 24, 2024
Merged

refactor(overlays)!: Simplify usage introducing anchor property and new Design #1661

merged 31 commits into from
Jan 24, 2024

Conversation

imoutaharik
Copy link
Contributor

@imoutaharik imoutaharik commented Nov 15, 2023 •
edited by selimovicz
Loading

Definition of Done

  • User interface and experience have been verified by a designer

  • I have added thorough Cypress tests (All properties and interactions have been tested).

  • Cross-browser compatibility - The component look consistent in the latest version of Chrome, Safari, Firefox and Edge.

  • I've added documentation in Storybook. all properties are reflected in table and controls.

  • User interface is compliant with WCAG 2.1 AA. Ensure these items are fulfilled:

    • Keyboard operability: All functionality can be accessed using only the keyboard
    • Logical tab order: Interactive elements follow a consistent and logical tab order
    • Visual indication of focus: Focused elements are visually highlighted for keyboard navigation
    • Color contrast: Sufficient contrast is used between text and background, as well as form fields and background
    • Alternative visual cues: Information is not solely reliant on color and includes alternative visual indicators
    • Semantic markup: Headings, lists, and form elements are marked up with appropriate semantic tags

    As This PR is already quite big, the following tasks will be tackled in another PR:

    • SideContentImage on Dialog component
    • Add EnterDelay and LeaveDelay on Popover
    • More in context Stories and tests for accessibility.

@imoutaharik imoutaharik added the breaking-change Any breaking change updates label Nov 15, 2023
@netlify Netlify
Copy link

netlify bot commented Nov 15, 2023 •
edited
Loading

✅ Deploy Preview for beta-fondue-components ready!

Name Link
🔨 Latest commit 682ef5e
🔍 Latest deploy log https://app.netlify.com/sites/beta-fondue-components/deploys/65b0da5d17a9ea0008120d51
😎 Deploy Preview https://deploy-preview-1661--beta-fondue-components.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@imoutaharik
fix typecheck issues and usage in other stories
602df5b
@imoutaharik
Add dark theme to Popover
7a77cbe
@imoutaharik
Move Arrow to Popper component.
438b93c
@imoutaharik
Fix test
b497de0
@imoutaharik
Omit properties depending on component purpose.
08329da
@imoutaharik
use new Tooltip in InlineDialog story
0dfeb53
@imoutaharik
Remove useToggleOverlay and replace as a new hook
ee85d54
@imoutaharik
merge beta into branch
082b54a
@imoutaharik
Update InlineDialog styling and add roundedCorners property
6d5a1b8
@imoutaharik
Refactor DialogHeader
f88ee25
@imoutaharik
Refactor DialogFooter and add responsive Design
0f91a6f
@imoutaharik
Revert
8e53467
@imoutaharik
Further impprovements
2823a28
@imoutaharik
Adjust shadow and mobile behaviour
46c2034
@imoutaharik
Fix Shadow values
43d3958
@imoutaharik
Add In Context folders in Storybook
c0274c8
@imoutaharik
fix setter naming in stories
00b2614
@imoutaharik
Popover dark theme and DialogHeader support
a3bb5b7
@imoutaharik
Add larger border-radius to Dialog
87ac249
@imoutaharik
Refactor
74a7510
@imoutaharik
chore: merge beta into branch
dcbf2c1
@imoutaharik
Refactor useFocusTrap to listen on the element instead of window.
59a40a4
@imoutaharik
Cleaning properties in Storybook
f980fa1
@imoutaharik
Add missing tests
dfe5b9d
@imoutaharik
chore: merge beta into branch
5f6d1a2
@imoutaharik imoutaharik marked this pull request as ready for review December 15, 2023 11:05
@imoutaharik imoutaharik requested a review from a team December 15, 2023 11:05
@imoutaharik imoutaharik requested a review from a team as a code owner December 15, 2023 11:05
@imoutaharik imoutaharik changed the title refactor(overlays)!: Simplify usage introducing anchor property [WIP] refactor(overlays)!: Simplify usage introducing anchor property and new Design Dec 15, 2023
ryancarville
ryancarville reviewed Dec 18, 2023
View reviewed changes
Copy link
Contributor

@ryancarville ryancarville left a comment

Choose a reason for hiding this comment

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

Not sure if this is intentional, but when the Dialog is open it opens to what ever the last state it was in.

E.g if there is a Select menu as a child of the Dialog. On initial open it is closed ~> then the Select is opened ~> then the Dialog is closed while the Select is open ~> when the Dialog is re-opened the Select menu is open.

anxobotana
anxobotana approved these changes Dec 20, 2023
View reviewed changes
Copy link
Contributor

@anxobotana anxobotana left a comment

Choose a reason for hiding this comment

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

Tree related file looks good and works as expected

@imoutaharik
Copy link
Contributor Author

Not sure if this is intentional, but when the Dialog is open it opens to what ever the last state it was in.

E.g if there is a Select menu as a child of the Dialog. On initial open it is closed ~> then the Select is opened ~> then the Dialog is closed while the Select is open ~> when the Dialog is re-opened the Select menu is open.

Updated @ryancarville

ryancarville
ryancarville approved these changes Dec 20, 2023
View reviewed changes
Copy link
Contributor

@ryancarville ryancarville left a comment

Choose a reason for hiding this comment

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

LGTM 👍

@selimovicz selimovicz merged commit 126cef2 into beta Jan 24, 2024
16 checks passed
@selimovicz selimovicz deleted the fix/popper-logic branch January 24, 2024 14:13
@github-actions GitHub Actions
Copy link
Contributor

Lead time: 70 days, 4 hours, 19 minutes, 43 seconds (1684.33 total hours) from first commit to close.
Review time: 40 days, 3 hours, 8 minutes, 31 seconds (963.14 total hours) from ready for review to close.

  • First commit: 15.11.2023, 10:54:06.
  • Ready for review: 15.12.2023, 12:05:18.
  • Closed: 24.1.2024, 15:13:49.

@github-actions GitHub Actions
Copy link
Contributor

🎉 This PR is included in version 12.0.0-beta.399 🎉

The release is available on:

Your semantic-release bot 📦🚀

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

@ryancarville ryancarville ryancarville approved these changes

@anxobotana anxobotana anxobotana approved these changes

Assignees
No one assigned
Labels
breaking-change Any breaking change updates released on @beta
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@imoutaharik @anxobotana @ryancarville @selimovicz