ingred-ui icon indicating copy to clipboard operation
ingred-ui copied to clipboard

Confirmed modalからアクションボタンを除去したい

Open noronaoki opened this issue 2 years ago • 3 comments

https://ingred-ui.netlify.app/?path=/story/components-utils-confirmmodal--with-sub-actions そもそもなぜコンポーネントとしてこのボタンが組み込まれているかはよく分かっていないのが前提としてあるけど。

タイトル横にアクションボタンがセットで実装されているのは柔軟性に欠けるのでできれば除去したい。(別の要素を載せたいって時にそれができないので)

noronaoki avatar Nov 16 '22 04:11 noronaoki

subactionspropsに入るものがReactNode | undefinedになるイメージ。

youchann avatar Nov 16 '22 04:11 youchann

subactions部分のheightは任意。大きい要素が入るとそのまま上部の高さが大きくなる。

image

youchann avatar Nov 16 '22 04:11 youchann

@youchann @noronaoki

このissueのモチベーション的にtipElementReactNodeみたいに渡す感じにした方が統一感あるのかなと思ったんですが、どうでしょうか

タイトルと閉じるボタン以外の「モーダル上部に置くもの」として扱う感じでしょうか (アクションじゃないものも渡せてしまうので、subActionという名前じゃないほうが良い?)

penicillin0 avatar Dec 12 '22 10:12 penicillin0

MEMO tipElement も subAction も一緒で良さそう。

takurinton avatar Jan 06 '23 07:01 takurinton

ref: #1090

penicillin0 avatar Jan 09 '23 13:01 penicillin0

メモ

  • 従来の tipElement も subActions の1つとして扱う
    • そのため tipElement prop は削除
  • subActions は ReactNode[] を受け取る
    • 1つだけ渡したい場合でも array で渡す
    • 1つ用と2つ以上用の両方の story を作る
  • subActions の1つ1つの要素の gap はいじれない
  • title と subActions の間の padding はいじれない

takurinton avatar Jan 31 '23 23:01 takurinton