52 lines
1.2 KiB
TypeScript
52 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
BottomActionButton,
|
|
BottomActionButtonProps,
|
|
} from "@/components/widgets/BottomActionButton/BottomActionButton";
|
|
import { useDynamicSize } from "@/hooks/DOM/useDynamicSize";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface QuestionInformationProps extends React.ComponentProps<"div"> {
|
|
image?: React.ReactNode;
|
|
text?: React.ReactNode;
|
|
bottomActionButtonProps?: BottomActionButtonProps;
|
|
}
|
|
|
|
function QuestionInformation({
|
|
image,
|
|
text,
|
|
bottomActionButtonProps,
|
|
...props
|
|
}: QuestionInformationProps) {
|
|
const {
|
|
height: bottomActionButtonHeight,
|
|
elementRef: bottomActionButtonRef,
|
|
} = useDynamicSize<HTMLDivElement>({
|
|
defaultHeight: 132,
|
|
});
|
|
|
|
return (
|
|
<div
|
|
className="w-full flex flex-col items-center gap-[22px]"
|
|
{...props}
|
|
style={{
|
|
paddingBottom: `${bottomActionButtonHeight}px`,
|
|
...props.style,
|
|
}}
|
|
>
|
|
{image}
|
|
{text}
|
|
{bottomActionButtonProps && (
|
|
<BottomActionButton
|
|
{...bottomActionButtonProps}
|
|
className={cn("max-w-[560px]", bottomActionButtonProps.className)}
|
|
ref={bottomActionButtonRef}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export { QuestionInformation };
|