assets/FontPreviewPicker-Z5SOKfoJ.js

import{r as l,j as e}from"./react-D_B_5QVd.js";import{E as n}from"./index-QBya0NjG.js";import"./jszip-C9ownNzX.js";import"./react-dom-EAO2-NBm.js";import"./scheduler-DYLXRpC5.js";import"./@google-4tyssLU_.js";import"./idb-Dob3nYDb.js";const c=["Roboto","Open Sans","Lato","Montserrat","Oswald","Source Sans Pro","Raleway","Poppins","Nunito","Merriweather"],f=()=>{const[s,r]=l.useState("Roboto"),[a,i]=l.useState("The quick brown fox jumps over the lazy dog.");l.useEffect(()=>{if(s){const t=document.createElement("link");return t.href=`https://fonts.googleapis.com/css?family=${s.replace(/ /g,"+")}&display=swap`,t.rel="stylesheet",document.head.appendChild(t),()=>{document.head.removeChild(t)}}},[s]);const o=`@import url('https://fonts.googleapis.com/css?family=${s.replace(/ /g,"+")}&display=swap');`;return e.jsxs("div",{className:"h-full flex flex-col p-4 sm:p-6 lg:p-8",children:[e.jsxs("header",{className:"mb-6",children:[e.jsxs("h1",{className:"text-3xl font-bold text-slate-100 flex items-center",children:[e.jsx(n,{}),e.jsx("span",{className:"ml-3",children:"Font Preview & Picker"})]}),e.jsx("p",{className:"text-slate-400 mt-1",children:"Preview Google Fonts and get the CSS import rule."})]}),e.jsxs("div",{className:"flex-grow grid grid-cols-1 lg:grid-cols-3 gap-6 min-h-0",children:[e.jsxs("div",{className:"lg:col-span-1 flex flex-col gap-4 bg-slate-800/50 p-6 rounded-lg",children:[e.jsx("h3",{className:"text-xl font-bold",children:"Controls"}),e.jsxs("div",{children:[e.jsx("label",{htmlFor:"font-select",className:"block text-sm font-medium text-slate-400",children:"Select Font"}),e.jsx("select",{id:"font-select",value:s,onChange:t=>r(t.target.value),className:"w-full mt-1 px-3 py-2 rounded-md bg-slate-800 border border-slate-700",children:c.map(t=>e.jsx("option",{value:t,children:t},t))})]}),e.jsxs("div",{children:[e.jsx("label",{htmlFor:"preview-text",className:"block text-sm font-medium text-slate-400",children:"Preview Text"}),e.jsx("textarea",{id:"preview-text",value:a,onChange:t=>i(t.target.value),className:"w-full mt-1 p-2 rounded-md bg-slate-800 border border-slate-700 h-24 resize-none"})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-sm font-medium text-slate-400",children:"CSS Import Rule"}),e.jsxs("div",{className:"relative mt-1",children:[e.jsx("pre",{className:"bg-slate-900 p-2 rounded-md text-cyan-300 text-xs overflow-x-auto",children:o}),e.jsx("button",{onClick:()=>navigator.clipboard.writeText(o),className:"absolute top-1 right-1 px-2 py-0.5 bg-slate-700 hover:bg-slate-600 rounded-md text-xs",children:"Copy"})]})]})]}),e.jsx("div",{className:"lg:col-span-2 bg-slate-900 rounded-lg p-8 flex items-center justify-center",children:e.jsx("p",{className:"text-4xl",style:{fontFamily:s},children:a})})]})]})};export{f as FontPreviewPicker};
//# sourceMappingURL=FontPreviewPicker-Z5SOKfoJ.js.map