Skip to content

fix(menuButton): fix RTL issues with MenuButton#14565

Merged
tw15egan merged 6 commits into
carbon-design-system:logical-propertiesfrom
tw15egan:rtl-menubutton
Sep 5, 2023
Merged

fix(menuButton): fix RTL issues with MenuButton#14565
tw15egan merged 6 commits into
carbon-design-system:logical-propertiesfrom
tw15egan:rtl-menubutton

Conversation

@tw15egan

@tw15egan tw15egan commented Sep 1, 2023

Copy link
Copy Markdown
Contributor

Fixes some positioning logic inside Menu and MenuButton.

Changelog

Changed

  • Adjusted positioning logic based on RTL

Testing / Reviewing

Check Menu and MenuButton stories in both LTR and RTL modes. Should render as expected.

One note: I'm seeing an issue where the state seems to be stale if you go from MenuButton to Menu with RTL enabled. It appears on the wrong side. However, once you refresh it is fixed. Any ideas? Can probably be fixed later

@tw15egan tw15egan requested a review from a team as a code owner September 1, 2023 14:46
@tw15egan tw15egan requested review from andreancardona and guidari and removed request for a team September 1, 2023 14:46
@tw15egan

tw15egan commented Sep 5, 2023

Copy link
Copy Markdown
Contributor Author

All issues should be fixed with Menu and MenuButton in RTL mode

@tw15egan tw15egan requested a review from tay1orjones September 5, 2023 15:45

@tay1orjones tay1orjones left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Looks good, just one minor thought

Comment thread packages/react/src/components/Menu/MenuItem.js
@tw15egan tw15egan merged commit 6ec1cda into carbon-design-system:logical-properties Sep 5, 2023
tw15egan added a commit that referenced this pull request Sep 5, 2023
* fix(menuButton): fix RTL issues with MenuButton

* fix(Menu): adjust caret rotation

* refactor(menu): remove rtl override

* fix(Menu): adjust story positioning, add CaretLeft for RTL mode

* refactor(Menu): useLayoutContext to check if parent has direction set
tw15egan added a commit that referenced this pull request Sep 11, 2023
* fix(menuButton): fix RTL issues with MenuButton

* fix(Menu): adjust caret rotation

* refactor(menu): remove rtl override

* fix(Menu): adjust story positioning, add CaretLeft for RTL mode

* refactor(Menu): useLayoutContext to check if parent has direction set
github-merge-queue Bot pushed a commit that referenced this pull request Sep 11, 2023
…upport (#14580)

* refactor(@carbon/styles): use logical properties for better RTL support (#14531)

* refactor(styles): update styles to use CSS logical properties

* fix(styles): change padding-inline-end to padding-inline

* fix(styles): run stylelint --fix on components

* fix(styles): run stylelint --fix on utilities

* fix(Select): test padding fix

* chore(stylelint): run styelint on files outside @carbon/styles

* fix(AspectRatio): remove unsupported float: inline-start

* fix(ContainedList): redefine tag tokens in contained list

* fix(ContainedList): keep story the same

* [WIP] fix(components): fix RTL issues with components (#14546)

* fix(components): fix RTL issues with components

* style(components): more fixes for RTL styles

* style(components): more fixes for RTL styles

* fix(Popover): fix popover styles in RTL mode

* fix(TreeView): fix RTL issues with TreeView

* fix(Breadcrumb): fix small issue with overflow menu variant

* fix(Popover): fix autoalign story issues

* fix(menuButton): fix RTL issues with MenuButton (#14565)

* fix(menuButton): fix RTL issues with MenuButton

* fix(Menu): adjust caret rotation

* refactor(menu): remove rtl override

* fix(Menu): adjust story positioning, add CaretLeft for RTL mode

* refactor(Menu): useLayoutContext to check if parent has direction set

* style(React): fix linting issues with storybook styles

* test(Accordion): update snapshots

* fix(Tooltip): move border
github-merge-queue Bot pushed a commit that referenced this pull request Sep 12, 2023
* refactor(@carbon/styles): use logical properties for better RTL support (#14531)

* refactor(styles): update styles to use CSS logical properties

* fix(styles): change padding-inline-end to padding-inline

* fix(styles): run stylelint --fix on components

* fix(styles): run stylelint --fix on utilities

* fix(Select): test padding fix

* chore(stylelint): run styelint on files outside @carbon/styles

* fix(AspectRatio): remove unsupported float: inline-start

* fix(ContainedList): redefine tag tokens in contained list

* fix(ContainedList): keep story the same

* [WIP] fix(components): fix RTL issues with components (#14546)

* fix(components): fix RTL issues with components

* style(components): more fixes for RTL styles

* style(components): more fixes for RTL styles

* fix(Popover): fix popover styles in RTL mode

* fix(TreeView): fix RTL issues with TreeView

* fix(Breadcrumb): fix small issue with overflow menu variant

* fix(Popover): fix autoalign story issues

* fix(menuButton): fix RTL issues with MenuButton (#14565)

* fix(menuButton): fix RTL issues with MenuButton

* fix(Menu): adjust caret rotation

* refactor(menu): remove rtl override

* fix(Menu): adjust story positioning, add CaretLeft for RTL mode

* refactor(Menu): useLayoutContext to check if parent has direction set

* style(React): fix linting issues with storybook styles

* test(Accordion): update snapshots

* fix(Tooltip): move border

* fix(components): fix a few more RTL issues with components

* fix(Slider): adjust positioning logic when rtl mode is enabled

* chore(test): remove console.log

* test(Slider): update tests

* fix(ProgressBar): reverse indeterminate animation in RTL mode
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