admin08077/Githubgemini
0
1{"version":3,"file":"PwaManifestEditor-DaEhsmZQ.js","sources":["../../components/features/PwaManifestEditor.tsx"],"sourcesContent":["import React, { useState, useMemo } from 'react';\nimport { CodeBracketSquareIcon, ArrowDownTrayIcon } from '../icons.tsx';\nimport { downloadFile } from '../../services/fileUtils.ts';\n\ninterface ManifestData {\n name: string;\n short_name: string;\n start_url: string;\n scope: string;\n display: 'standalone' | 'fullscreen' | 'minimal-ui' | 'browser';\n orientation: 'any' | 'natural' | 'landscape' | 'portrait';\n background_color: string;\n theme_color: string;\n}\n\nconst HomeScreenPreview: React.FC<{ manifest: ManifestData }> = ({ manifest }) => (\n <div className=\"w-full max-w-xs mx-auto flex flex-col items-center\">\n <div className=\"w-72 h-[550px] bg-gray-800 rounded-[40px] border-[10px] border-black shadow-2xl p-4 flex flex-col\">\n <div className=\"flex-shrink-0 h-6 flex justify-between items-center px-4\">\n <span className=\"text-xs font-bold\" style={{color: manifest.theme_color}}>9:41</span>\n <div className=\"w-16 h-4 bg-black rounded-full\" />\n <span className=\"text-xs font-bold\" style={{color: manifest.theme_color}}>100%</span>\n </div>\n <div className=\"flex-grow grid grid-cols-4 gap-4 p-4\">\n <div className=\"flex flex-col items-center gap-1\">\n <div className=\"w-14 h-14 bg-white rounded-xl flex items-center justify-center text-3xl\" style={{backgroundColor: manifest.background_color}}>\n <span style={{color: manifest.theme_color}}>{manifest.short_name[0]}</span>\n </div>\n <p className=\"text-xs text-center text-white truncate w-full\">{manifest.short_name}</p>\n </div>\n </div>\n </div>\n <p className=\"text-xs text-text-secondary mt-2 text-center\">Home Screen Preview</p>\n </div>\n);\n\n\nexport const PwaManifestEditor: React.FC = () => {\n const [manifest, setManifest] = useState<ManifestData>({\n name: 'DevCore Progressive Web App', short_name: 'DevCore', start_url: '/', scope: '/',\n display: 'standalone', orientation: 'any', background_color: '#F5F7FA', theme_color: '#0047AB',\n });\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {\n setManifest({ ...manifest, [e.target.name]: e.target.value });\n };\n\n const generatedJson = useMemo(() => {\n const fullManifest = { ...manifest, icons: [{\"src\": \"icon-192.png\", \"type\": \"image/png\", \"sizes\": \"192x192\"}, {\"src\": \"icon-512.png\", \"type\": \"image/png\", \"sizes\": \"512x512\"}] };\n return JSON.stringify(fullManifest, null, 2);\n }, [manifest]);\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\"><h1 className=\"text-3xl font-bold flex items-center\"><CodeBracketSquareIcon /><span className=\"ml-3\">PWA Manifest Editor</span></h1><p className=\"text-text-secondary mt-1\">Configure and generate the `manifest.json` file for your PWA.</p></header>\n <div className=\"flex-grow grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-6 min-h-0\">\n <div className=\"xl:col-span-1 flex flex-col gap-4 bg-surface border border-border p-6 rounded-lg overflow-y-auto\">\n <h3 className=\"text-xl font-bold\">Configuration</h3>\n <div><label className=\"block text-sm\">App Name</label><input type=\"text\" name=\"name\" value={manifest.name} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"/></div>\n <div><label className=\"block text-sm\">Short Name</label><input type=\"text\" name=\"short_name\" value={manifest.short_name} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"/></div>\n <div><label className=\"block text-sm\">Start URL</label><input type=\"text\" name=\"start_url\" value={manifest.start_url} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"/></div>\n <div><label className=\"block text-sm\">Scope</label><input type=\"text\" name=\"scope\" value={manifest.scope} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"/></div>\n <div><label className=\"block text-sm\">Display Mode</label><select name=\"display\" value={manifest.display} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"><option>standalone</option><option>fullscreen</option><option>minimal-ui</option><option>browser</option></select></div>\n <div><label className=\"block text-sm\">Orientation</label><select name=\"orientation\" value={manifest.orientation} onChange={handleChange} className=\"w-full mt-1 p-2 rounded bg-background border border-border\"><option>any</option><option>natural</option><option>landscape</option><option>portrait</option></select></div>\n <div className=\"flex gap-4\">\n <div className=\"w-1/2\"><label className=\"block text-sm\">Background Color</label><input type=\"color\" name=\"background_color\" value={manifest.background_color} onChange={handleChange} className=\"w-full mt-1 h-10 rounded bg-background border border-border\"/></div>\n <div className=\"w-1/2\"><label className=\"block text-sm\">Theme Color</label><input type=\"color\" name=\"theme_color\" value={manifest.theme_color} onChange={handleChange} className=\"w-full mt-1 h-10 rounded bg-background border border-border\"/></div>\n </div>\n </div>\n <div className=\"xl:col-span-1 flex flex-col\">\n <div className=\"flex justify-between items-center mb-2\">\n <label className=\"text-sm font-medium text-text-secondary\">Generated manifest.json</label>\n <button onClick={() => downloadFile(generatedJson, 'manifest.json', 'application/json')} className=\"flex items-center gap-1 px-3 py-1 bg-gray-100 text-xs rounded-md hover:bg-gray-200\">\n <ArrowDownTrayIcon className=\"w-4 h-4\"/> Download\n </button>\n </div>\n <div className=\"relative flex-grow\"><pre className=\"w-full h-full bg-background p-4 rounded-md text-primary text-sm overflow-auto\">{generatedJson}</pre></div>\n </div>\n <div className=\"hidden xl:flex flex-col items-center justify-center\">\n <label className=\"text-sm font-medium text-text-secondary mb-2\">Live Preview</label>\n <HomeScreenPreview manifest={manifest} />\n </div>\n </div>\n </div>\n );\n};"],"names":["HomeScreenPreview","manifest","jsxs","jsx","PwaManifestEditor","setManifest","useState","handleChange","e","generatedJson","useMemo","fullManifest","CodeBracketSquareIcon","downloadFile","ArrowDownTrayIcon"],"mappings":"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"}