diff --git a/components/QuotationCarousel.tsx b/components/QuotationCarousel.tsx index e1adce1..25724e8 100644 --- a/components/QuotationCarousel.tsx +++ b/components/QuotationCarousel.tsx @@ -6,7 +6,7 @@ import styles from "./QuotationCarousel.module.css"; interface QuotationCarouselProps { data: string[]; /** Width of the entire carousel including the buttons, in px. */ - width: number; + width?: number; /** Minimum height of the carousel, in px. */ height?: number; /** Diameter of the background circles, in px. Set to 0 for no circles. */ @@ -24,12 +24,13 @@ interface CarouselButtonProps { export function QuotationCarousel(props: QuotationCarouselProps) { const { data, + width = 600, height = 100, circleDiameter = 120, minWidth = 600, className, } = props; - const width = props.width < minWidth ? minWidth : props.width; + const actualWidth = width < minWidth ? minWidth : width; const [activeIdx, setActiveIdx] = useState(0); function showNextCard() { @@ -45,7 +46,10 @@ export function QuotationCarousel(props: QuotationCarouselProps) { className={ className ? `${className} ${styles.carousel}` : styles.carousel } - style={{ width: `${width / 16}rem`, minHeight: `${height / 16}rem` }} + style={{ + width: `${actualWidth / 16}rem`, + minHeight: `${height / 16}rem`, + }} >