BaseColumn(非推奨)
BaseやDialogの内部で視覚的に要素をグルーピングするコンポーネントです。Base内やダイアログコンテンツ内でコンテンツを囲んで「ブロック」領域として示すときに使います。
デザインパターン
メッセージを表示するパターン
注意事項や補足事項などを見出しと内容のセットで伝えるパターンです。Baseや各種Dialog(contentBgColorがWHITEの場合)の内側など、InformationPanelが配置できない場合に主に使います。
Do
Baseの内側ではInformationPanelの代わりにBaseColumnで注意事項を表示する。Props
rounded
falsetrue"right""left""top""bottom""all"
角丸を適用する範囲
bgColor
"BACKGROUND""COLUMN""BASE_GREY""OVER_BACKGROUND""HEAD""BORDER""ACTION_BACKGROUND""WHITE""GREY_5""GREY_6""GREY_7""GREY_9""GREY_20"
背景色
ref
(instance: HTMLDivElement) => voidRefObject<HTMLDivElement>
overflow
"clip""hidden""auto""visible""scroll"{ x: "auto" | "hidden" | "visible" | "clip" | "scroll"; y: "auto" | "hidden" | "visible" | "clip" | "scroll"; }
コンテンツが要素内に収まらない場合の処理方法
padding
012"XS""S""M""XXS""L""XL""XXL"340.250.50.751.251.52.53.58-0.25-0.5-0.75-1-1.25-1.5-2-2.5-3-3.5-4-8"X3S""X3L"{ block?: Gap; inline?: Gap; }
境界とコンテンツの間の余白