rename widget components dimensions prop to dialogDimensions

This commit is contained in:
nflnkr 2024-05-13 16:41:10 +03:00
parent aebf66eba4
commit 2375f81b48
4 changed files with 20 additions and 16 deletions

@ -1,14 +1,12 @@
import lightTheme from "@/utils/themes/light";
import { Box, ThemeProvider, Typography } from "@mui/material";
import { useEffect, useRef } from "react";
import { BannerWidget as Widget } from "./widgets";
import { ContainerWidget as Widget } from "./widgets";
const widgetProps: ConstructorParameters<typeof Widget>[0] = {
quizId: "3c49550d-8c77-4788-bc2d-42586a261514",
position: "bottomleft",
pulsation: true,
rounded: true,
selector: "#widget-container",
};
export default function WidgetDev() {
@ -32,6 +30,12 @@ export default function WidgetDev() {
>
<Lorem />
<Box id="widget-button"></Box>
<Box
id="widget-container"
sx={{
height: "500px",
}}
></Box>
<Lorem />
<Lorem />
<Lorem />

@ -12,7 +12,7 @@ const WIDGET_DEFAULT_HEIGHT = "80%";
interface Props {
quizId: string;
fixedSide?: "left" | "right";
dimensions?: { width: string; height: string; };
dialogDimensions?: { width: string; height: string; };
/**
* Открыть квиз через X секунд, 0 - сразу
*/
@ -31,7 +31,7 @@ export default function OpenQuizButton({
quizId,
fixedSide,
autoShowQuizTime = null,
dimensions,
dialogDimensions,
hideOnMobile,
openOnLeaveAttempt,
buttonFlash = false,
@ -128,8 +128,8 @@ export default function OpenQuizButton({
quizId={quizId}
onClose={() => setIsQuizShown(false)}
paperSx={{
width: dimensions?.width ?? WIDGET_DEFAULT_WIDTH,
height: dimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
width: dialogDimensions?.width ?? WIDGET_DEFAULT_WIDTH,
height: dialogDimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
}}
/>
</ThemeProvider>

@ -9,7 +9,7 @@ const WIDGET_DEFAULT_HEIGHT = "80%";
interface Props {
quizId: string;
dimensions?: { width: string; height: string; };
dialogDimensions?: { width: string; height: string; };
/**
* Открыть квиз через X секунд, 0 - сразу
*/
@ -20,7 +20,7 @@ interface Props {
export default function QuizPopup({
quizId,
dimensions,
dialogDimensions,
autoShowQuizTime = null,
hideOnMobile = false,
openOnLeaveAttempt = false,
@ -70,8 +70,8 @@ export default function QuizPopup({
quizId={quizId}
onClose={() => setIsQuizShown(false)}
paperSx={{
width: dimensions?.width ?? WIDGET_DEFAULT_WIDTH,
height: dimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
width: dialogDimensions?.width ?? WIDGET_DEFAULT_WIDTH,
height: dialogDimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
}}
/>
);

@ -17,7 +17,7 @@ interface Props {
position: "left" | "right";
buttonBackgroundColor?: string;
buttonTextColor?: string;
dimensions?: { width: string; height: string; };
dialogDimensions?: { width: string; height: string; };
fullScreen?: boolean;
buttonFlash?: boolean;
/**
@ -36,7 +36,7 @@ export default function QuizSideButton({
position,
buttonBackgroundColor,
buttonTextColor,
dimensions,
dialogDimensions,
fullScreen = false,
buttonFlash = false,
autoOpenTime = 0,
@ -87,9 +87,9 @@ export default function QuizSideButton({
bottom: PADDING,
right: position === "right" ? PADDING : undefined,
left: position === "left" ? PADDING : undefined,
width: dimensions?.width ?? WIDGET_DEFAULT_WIDTH,
width: dialogDimensions?.width ?? WIDGET_DEFAULT_WIDTH,
maxWidth: `calc(100% - ${PADDING * 2}px)`,
height: dimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
height: dialogDimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
maxHeight: `calc(100% - ${PADDING * 2}px)`,
},
(isMobile || fullScreen) && {