admin08077/Githubgemini
0
1{"version":3,"file":"FontPreviewPicker-CKFfwwwW.js","sources":["../../components/features/FontPreviewPicker.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { TypographyLabIcon } from '../icons.tsx';\n\nconst popularFonts = [\n 'Roboto', 'Open Sans', 'Lato', 'Montserrat', 'Oswald', 'Source Sans Pro', 'Raleway', 'Poppins', 'Nunito', 'Merriweather',\n 'Playfair Display', 'Lora', 'Noto Sans', 'Ubuntu', 'PT Sans', 'Slabo 27px', 'Great Vibes', 'EB Garamond'\n];\n\nexport const FontPreviewPicker: React.FC = () => {\n const [text, setText] = useState('The quick brown fox jumps over the lazy dog.');\n const [fontSize, setFontSize] = useState(24);\n\n useEffect(() => {\n const fontsToLoad = popularFonts.join('|').replace(/ /g, '+');\n const linkId = 'font-picker-stylesheet';\n let link = document.getElementById(linkId) as HTMLLinkElement;\n if (!link) {\n link = document.createElement('link');\n link.id = linkId;\n link.rel = 'stylesheet';\n document.head.appendChild(link);\n }\n link.href = `https://fonts.googleapis.com/css?family=${fontsToLoad}:400,700&display=swap`;\n }, []);\n\n return (\n <div className=\"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary\">\n <header className=\"mb-6\">\n <h1 className=\"text-3xl font-bold flex items-center\">\n <TypographyLabIcon />\n <span className=\"ml-3\">Font Preview Picker</span>\n </h1>\n <p className=\"text-text-secondary mt-1\">Enter your text and see how it looks with different fonts.</p>\n </header>\n\n <div className=\"flex flex-col md:flex-row gap-4 mb-6\">\n <div className=\"flex-grow\">\n <label htmlFor=\"preview-text\" className=\"text-sm font-medium\">Preview Text</label>\n <input\n id=\"preview-text\"\n type=\"text\"\n value={text}\n onChange={e => setText(e.target.value)}\n className=\"w-full mt-1 p-2 bg-surface border border-border rounded-md\"\n />\n </div>\n <div>\n <label htmlFor=\"font-size\" className=\"text-sm font-medium\">Font Size ({fontSize}px)</label>\n <input\n id=\"font-size\"\n type=\"range\"\n min=\"12\"\n max=\"72\"\n value={fontSize}\n onChange={e => setFontSize(Number(e.target.value))}\n className=\"w-full mt-1\"\n />\n </div>\n </div>\n\n <div className=\"flex-grow bg-surface border border-border rounded-lg p-4 overflow-y-auto\">\n <div className=\"space-y-4\">\n {popularFonts.map(font => (\n <div key={font} className=\"border-b border-border pb-2\">\n <p className=\"text-sm text-text-secondary\">{font}</p>\n <p style={{ fontFamily: `'${font}', sans-serif`, fontSize: `${fontSize}px` }}>\n {text}\n </p>\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};"],"names":["popularFonts","FontPreviewPicker","text","setText","useState","fontSize","setFontSize","useEffect","fontsToLoad","linkId","link","jsxs","jsx","TypographyLabIcon","font"],"mappings":"6mFAGA,MAAMA,EAAe,CACjB,SAAU,YAAa,OAAQ,aAAc,SAAU,kBAAmB,UAAW,UAAW,SAAU,eAC1G,mBAAoB,OAAQ,YAAa,SAAU,UAAW,aAAc,cAAe,aAC/F,EAEaC,GAA8B,IAAM,CAC7C,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,8CAA8C,EACzE,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAAS,EAAE,EAE3CG,OAAAA,EAAAA,UAAU,IAAM,CACZ,MAAMC,EAAcR,EAAa,KAAK,GAAG,EAAE,QAAQ,KAAM,GAAG,EACtDS,EAAS,yBACf,IAAIC,EAAO,SAAS,eAAeD,CAAM,EACpCC,IACDA,EAAO,SAAS,cAAc,MAAM,EACpCA,EAAK,GAAKD,EACVC,EAAK,IAAM,aACX,SAAS,KAAK,YAAYA,CAAI,GAElCA,EAAK,KAAO,2CAA2CF,CAAW,uBACtE,EAAG,CAAA,CAAE,EAGDG,EAAAA,KAAC,MAAA,CAAI,UAAU,2DACX,SAAA,CAAAA,EAAAA,KAAC,SAAA,CAAO,UAAU,OACd,SAAA,CAAAA,EAAAA,KAAC,KAAA,CAAG,UAAU,uCACV,SAAA,CAAAC,EAAAA,IAACC,EAAA,EAAkB,EACnBD,EAAAA,IAAC,OAAA,CAAK,UAAU,OAAO,SAAA,qBAAA,CAAmB,CAAA,EAC9C,EACAA,EAAAA,IAAC,IAAA,CAAE,UAAU,2BAA2B,SAAA,4DAAA,CAA0D,CAAA,EACtG,EAEAD,EAAAA,KAAC,MAAA,CAAI,UAAU,uCACX,SAAA,CAAAA,EAAAA,KAAC,MAAA,CAAI,UAAU,YACX,SAAA,CAAAC,MAAC,QAAA,CAAM,QAAQ,eAAe,UAAU,sBAAsB,SAAA,eAAY,EAC1EA,EAAAA,IAAC,QAAA,CACG,GAAG,eACH,KAAK,OACL,MAAOV,EACP,SAAU,GAAKC,EAAQ,EAAE,OAAO,KAAK,EACrC,UAAU,4DAAA,CAAA,CACd,EACJ,SACC,MAAA,CACG,SAAA,CAAAQ,EAAAA,KAAC,QAAA,CAAM,QAAQ,YAAY,UAAU,sBAAsB,SAAA,CAAA,cAAYN,EAAS,KAAA,EAAG,EACnFO,EAAAA,IAAC,QAAA,CACG,GAAG,YACH,KAAK,QACL,IAAI,KACJ,IAAI,KACJ,MAAOP,EACP,SAAU,GAAKC,EAAY,OAAO,EAAE,OAAO,KAAK,CAAC,EACjD,UAAU,aAAA,CAAA,CACd,CAAA,CACJ,CAAA,EACJ,EAEAM,MAAC,MAAA,CAAI,UAAU,2EACX,eAAC,MAAA,CAAI,UAAU,YACV,SAAAZ,EAAa,IAAIc,GACdH,EAAAA,KAAC,MAAA,CAAe,UAAU,8BACtB,SAAA,CAAAC,EAAAA,IAAC,IAAA,CAAE,UAAU,8BAA+B,SAAAE,EAAK,EACjDF,EAAAA,IAAC,IAAA,CAAE,MAAO,CAAE,WAAY,IAAIE,CAAI,gBAAiB,SAAU,GAAGT,CAAQ,IAAA,EACjE,SAAAH,CAAA,CACL,CAAA,GAJMY,CAKV,CACH,CAAA,CACL,CAAA,CACJ,CAAA,EACJ,CAER"}