InformationPanel
ユーザーに伝えたい情報を視覚的に目立たせるパネルコンポーネントです。複数行のテキストや複数項目の不備一覧など、ResponseMessageやNotificationBarでは収まらない量のフィードバック情報などを表示するときに使います。
使用上の注意
短い一文で説明できるものに使用しない
見出しと内容を必ずセットにして使用してください。短い一文で説明できる場合は、ResponseMessageやNotificationBar[base=“base”]が適しています。
詳しい使い分けはフィードバック - 同期的な処理が完了したときを参照してください。
白背景の中に配置しない
InformationPanelの背景色は白いため、Baseやダイアログコンテンツなど背景が白い要素の中にそのまま配置しないでください。
BaseColumnのなかや、背景色をCOLUMNやOVER_BACKGROUNDなどの白以外に変更したBaseやダイアログコンテンツのなかであれば配置できます。
InformationPanelでは視覚的に強調されすぎる場合は、削除ダイアログの注意事項のようにBaseColumnを使った代替パターンも検討してください。
OVER_BACKGROUNDになっている
レイアウト
[WIP] モバイル
開閉ボタン
モバイルでは画面の表示領域が狭いため、開閉ボタンをアイコンボタンで表示します。
余白
コンポーネント内部の余白はパディングの通りに16pxに変更します。
前後の要素との余白についてはマージンを参照してください。
状態
デフォルト
利用者に伝えたい情報を表示するためのコンポーネントなため、デフォルトでは開閉ボタンを表示しません。
全文表示したままだと操作の妨げになるなど、利用者の使い勝手に影響する場合は開閉ボタンの表示を検討してください。その際、利用者のストレスを生みやすいため、開閉状態の保持を合せて検討してください。
Props
パネルのタイトル
true のとき、開閉ボタンを表示する
開閉ボタン押下時に発火するコールバック関数