patternfly / patternfly/patternfly-react
Menu/MenuItem - should support drill-[up/out] icon/layout in menu list
まだ誰も着手していません。
- 主要言語
- TypeScript
- スター
- 862
- フォーク
- 392
- 平均マージ
- 4日 8時間
- マージ済み PR(30日)
- 9
説明
re: https://github.com/patternfly/patternfly-react/issues/9587 and this issue to make the same update in core https://github.com/patternfly/patternfly/issues/5950. Not sure if this is a breaking change or not, probably depends on how we go about implementing it.
In the drilldown with breadcrumb menu examples, in the breadcrumb dropdown, we have items that present (and seem to function) as drill-[up/out] items with a back arrow at the start of the item, and clicking on the item takes you up a level in the breadcrumb hierarchy. However, our component doesn't support this layout - our examples are using a user-supplied icon passed as the icon prop - https://github.com/patternfly/patternfly-react/blob/e27aac2f35e0a8bb16fa5397eb5ef841b3ecc578/packages/react-core/src/components/Menu/examples/MenuWithDrilldownBreadcrumbs.tsx#L130-L138
Some issues with this are:
- It doesn't work by default in RTL since we can't predictably target and mirror/flip that menu item icon for the user since that could be a non-directional icon or they may have opted for some other type of directional icon there that shouldn't be flipped.
- Since it's a user supplied icon, there is the possibility for inconsistency
- I could be wrong, but I don't know if a user could pass an actual icon to any of those items since the prop is being used for the back arrow.
We have a direction="up" prop that puts the correct icon container and icon on a drill-up/out icon and works in RTL, but that is specific to the top/first item in a drilled-in drilldown menu. The prop applies other logic to that item that isn't appropriate for use in the breadcrumb items, so we can't use that prop there. https://github.com/patternfly/patternfly-react/blob/e27aac2f35e0a8bb16fa5397eb5ef841b3ecc578/packages/react-core/src/components/Menu/MenuItem.tsx#L366-L370
Ideally we could do something like update the direction prop so it could be used in these breadcrumb menu items or maybe introduce some new kind of prop for an item that indicates clicking it does some kind of "back" action and it just borrows the way direction="up" includes the icon in the item.
Jira Issue: PF-116
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
調査の方向性
packages/react-core/src/components/Menu/MenuItem.tsx から始め、特に既存の direction="up" の処理と、issue にリンクされている MenuWithDrilldownBreadcrumbs.tsx の例を確認してください。現在の breadcrumb dropdown の動作を core issue および RTL の期待事項と比較してください。完了条件は、breadcrumb の drilldown で上位へ戻る/外へ出る項目が、ユーザー提供の戻るアイコンに依存せず、一貫した方向対応のレイアウトになることです。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- react, typescript
- 領域
- frontend
- issue の種類
- 機能追加
- 難易度
- 5/5
- 見積もり時間
- 1週間以上
- 活発さ
- 停滞
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 35/100