update(AutoScrollContainer): Add auto prop.

mack-mac
mackt 7 months ago
parent 3ee2d6da4a
commit 307cc0f6cf

@ -2,12 +2,12 @@
/** /**
* *
* TODO:
*/ */
import React, { useRef, useEffect, useState } from 'react'; import React, { useRef, useEffect, useState } from 'react';
interface TextScrollProps { interface TextScrollProps {
auto?: boolean;
hover?: boolean; hover?: boolean;
speed?: number; speed?: number;
width: string; width: string;
@ -17,10 +17,11 @@ interface TextScrollProps {
const TextScroll: React.FC<TextScrollProps> = ({ const TextScroll: React.FC<TextScrollProps> = ({
width = '100px', width = '100px',
auto = false,
className = '', className = '',
children = '', children = '',
hover = false, hover = false,
speed = 30, speed = 5,
}) => { }) => {
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const childrenRef = useRef<HTMLParagraphElement>(null); const childrenRef = useRef<HTMLParagraphElement>(null);
@ -62,7 +63,11 @@ const TextScroll: React.FC<TextScrollProps> = ({
onMouseEnter={() => handleMouseMove(true)} onMouseEnter={() => handleMouseMove(true)}
onMouseLeave={() => handleMouseMove(false)} onMouseLeave={() => handleMouseMove(false)}
> >
<div ref={childrenRef} className={`flex flex-row items-center relative w-[fit-content] h-auto ${className}`}> <div
ref={childrenRef}
className={`flex flex-row items-center relative w-[fit-content] h-auto ${className}`}
style={{ animation: auto ? animation : 'none' }}
>
{children} {children}
{isOverflowing && ( {isOverflowing && (
<> <>

Loading…
Cancel
Save