BottomFixedArea

BottomFixedAreaは非推奨です。FloatAreaを使ってください。

画面下部に固定で表示する操作パネルです。主にモーダルなUIを作るために使います。

処理中
ドラッグして幅を変更
ドラッグして高さを変更
処理中

Props

description
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortal

この領域の説明

primaryButton
FunctionComponentElement<{ size?: "s" | "default"; disabledDetail?: { icon?: FunctionComponent<{}>; message: ReactNode; }; prefix?: ReactNode; suffix?: ReactNode; square?: boolean; wide?: boolean; variant?: Variant; loading?: boolean; } & { ...; } & ElementProps & Props & RefAttributes<...>>FunctionComponentElement<{ size?: "s" | "default"; disabledDetail?: { icon?: FunctionComponent<{}>; message: ReactNode; }; prefix?: ReactNode; suffix?: ReactNode; square?: boolean; wide?: boolean; variant?: Variant; loading?: boolean; } & { ...; } & { ...; } & ElementProps<...> & ElementRefProps<...>>

表示する Button または AnchorButtonvariant="primary" である必要がある)

secondaryButton
FunctionComponentElement<{ size?: "s" | "default"; disabledDetail?: { icon?: FunctionComponent<{}>; message: ReactNode; }; prefix?: ReactNode; suffix?: ReactNode; square?: boolean; wide?: boolean; variant?: Variant; loading?: boolean; } & { ...; } & ElementProps & Props & RefAttributes<...>>FunctionComponentElement<{ size?: "s" | "default"; disabledDetail?: { icon?: FunctionComponent<{}>; message: ReactNode; }; prefix?: ReactNode; suffix?: ReactNode; square?: boolean; wide?: boolean; variant?: Variant; loading?: boolean; } & { ...; } & { ...; } & ElementProps<...> & ElementRefProps<...>>

表示する Button または AnchorButtonvariant="secondary" である必要がある)

tertiaryLinks
(Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & { ...; } & { ...; })[]

表示する tertialy link のプロパティの配列

zIndex
number

コンポーネントに適用する z-index 値

ref
(instance: HTMLDivElement) => voidRefObject<HTMLDivElement>