BaseColumn
矩形で視覚的に要素をグルーピングするコンポーネントです。
主にBaseや各種Dialogの上で視覚的グルーピングにおけるブロックの表現に使います。
デザインパターン
メッセージを表示するパターン
注意事項や補足事項などを見出しと内容のセットで伝えるパターンです。Baseや各種Dialogの上など、InformationPanelが配置できない場合に主に使います。
Props
overflow
"hidden" "clip" "auto" "visible" "scroll" { x: "hidden" | "auto" | "clip" | "scroll" | "visible"; y: "hidden" | "auto" | "clip" | "scroll" | "visible"; }
コンテンツが要素内に収まらない場合の処理方法
padding
0 1 2 0.25 0.5 0.75 1.25 1.5 2.5 3 3.5 4 8 -0.25 -0.5 -0.75 -1 -1.25 -1.5 -2 -2.5 -3 -3.5 -4 -8 "X3S" "XXS" "XS" "S" "M" "L" "XL" "XXL" "X3L" { block?: Gap; inline?: Gap; narrowModeBlock?: Gap; narrowModeInline?: Gap; }
境界とコンテンツの間の余白
rounded
false true "all" "left" "right" "bottom" "top"
bgColor
"BACKGROUND" "COLUMN" "BASE_GREY" "OVER_BACKGROUND" "HEAD" "BORDER" "ACTION_BACKGROUND" "WHITE" "GREY_5" "GREY_6" "GREY_7" "GREY_9" "GREY_20"