From 64c7da70c031fdd4e9dfed5fea3243bf967d8a80 Mon Sep 17 00:00:00 2001 From: bender Date: Wed, 11 Mar 2026 22:14:54 +0000 Subject: [PATCH] Update src/components/shared/SvgTextLogo/SvgTextLogo.tsx --- .../shared/SvgTextLogo/SvgTextLogo.tsx | 73 +++++++++++-------- 1 file changed, 42 insertions(+), 31 deletions(-) diff --git a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx index f214190..aa3febd 100644 --- a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx +++ b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx @@ -1,51 +1,62 @@ -"use client"; - -import { memo } from "react"; -import useSvgTextLogo from "./useSvgTextLogo"; -import { cls } from "@/lib/utils"; +import React from 'react'; interface SvgTextLogoProps { - logoText: string; - adjustHeightFactor?: number; - verticalAlign?: "top" | "center"; + text: string; className?: string; + fontSize?: number; + fontWeight?: number | string; + letterSpacing?: number; + fill?: string; } -const SvgTextLogo = memo(function SvgTextLogo({ - logoText, - adjustHeightFactor, - verticalAlign = "top", - className = "", -}) { - const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor); +const SvgTextLogo: React.FC = ({ + text, + className = '', + fontSize = 48, + fontWeight = 700, + letterSpacing = 0, + fill = 'currentColor', +}) => { + const svgRef = React.useRef(null); + const textRef = React.useRef(null); + const [viewBox, setViewBox] = React.useState('0 0 1000 100'); + + React.useEffect(() => { + if (textRef.current && svgRef.current) { + try { + const bbox = textRef.current.getBBox(); + const padding = 20; + const newViewBox = `${bbox.x - padding} ${bbox.y - padding} ${bbox.width + padding * 2} ${bbox.height + padding * 2}`; + setViewBox(newViewBox); + } catch (e) { + console.error('Error calculating SVG viewBox:', e); + } + } + }, [text]); return ( - {logoText} + {text} ); -}); - -SvgTextLogo.displayName = "SvgTextLogo"; +}; export default SvgTextLogo;