[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_193":194,"_195":196},"routes/_app.x.$handle.$name",{"_95":94,"_32":44,"_104":85,"_27":105,"_13":14,"_106":-5,"_11":107,"_108":109,"_110":111,"_112":113,"_114":115,"_20":-5,"_116":-5,"_117":-5,"_118":25,"_119":120,"_121":57,"_122":-5,"_123":-5,"_124":125},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_32":44,"_37":45,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":55,"_56":57,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",39,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":20,"_34":36,"_37":38,"_39":14,"_40":41,"_24":25},"previous",{"_30":31,"_32":28,"_33":20,"_34":35},"deleted",false,"deletedHere","path","styles.css","latestPath","fileId","894e63de-f3d2-11f0-b1b0-42dde27851f2","name","fileType","content",":root {\n --pico-background-color: #0d0d0d;\n --pico-card-background-color: #1a1a1a;\n}\n\nbody {\n min-height: 100vh;\n background: linear-gradient(135deg, #0d0d0d 0%, #1a1a2e 100%);\n}\n\n.container {\n max-width: 480px;\n padding-top: 2rem;\n}\n\nh1 {\n background: linear-gradient(135deg, #fff 0%, #a5a5a5 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n}\n\n.qr-container {\n display: flex;\n justify-content: center;\n margin: 1.5rem 0;\n}\n\n.qr-wrapper {\n background: #ffffff;\n border-radius: 24px;\n padding: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 8px 32px rgba(0,0,0,0.3);\n min-width: 312px;\n min-height: 312px;\n transition: background-color 0.2s;\n}\n\n.qr-wrapper svg,\n.qr-wrapper canvas {\n display: block;\n}\n\n.label-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 0.25rem;\n}\n\n.style-value {\n font-family: monospace;\n font-size: 0.75rem;\n color: var(--pico-primary);\n background: rgba(99, 102, 241, 0.15);\n padding: 0.2rem 0.5rem;\n border-radius: 4px;\n}\n\n.slider-labels {\n display: flex;\n justify-content: space-between;\n font-size: 0.7rem;\n color: rgba(255,255,255,0.35);\n margin-top: 0.25rem;\n padding: 0 0.25rem;\n}\n\ndetails {\n margin: 1rem 0;\n}\n\n.option-group {\n margin-bottom: 1rem;\n}\n\n.option-group:last-child {\n margin-bottom: 0;\n}\n\n.color-row {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 1rem;\n}\n\n.color-row .option-group {\n margin-bottom: 0;\n}\n\n.color-row input[type=\"color\"] {\n width: 100%;\n height: 42px;\n padding: 4px;\n cursor: pointer;\n}\n\n.download-group {\n display: flex;\n}\n\n.download-group > button {\n flex: 1;\n margin-bottom: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: 1px solid rgba(255,255,255,0.2);\n}\n\n.download-group .dropdown {\n margin-bottom: 0;\n width: auto;\n}\n\n.download-group .dropdown summary {\n margin-bottom: 0;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n padding: 0.75rem 1rem;\n min-width: 0;\n width: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.download-group .dropdown summary::after {\n display: none;\n}\n\n.download-group .dropdown ul {\n min-width: 150px;\n right: 0;\n left: auto;\n}\n\nfooter {\n text-align: center;\n margin-top: 2rem;\n opacity: 0.5;\n font-size: 0.875rem;\n}\n\nfooter a {\n color: inherit;\n}\n\n.loading {\n color: rgba(0,0,0,0.4);\n font-size: 0.875rem;\n}\n",":root {\n --pico-background-color: #0d0d0d;\n --pico-card-background-color: #1a1a1a;\n}\n\nbody {\n min-height: 100vh;\n background: linear-gradient(135deg, #0d0d0d 0%, #1a1a2e 100%);\n}\n\n.container {\n max-width: 480px;\n padding-top: 2rem;\n}\n\nh1 {\n background: linear-gradient(135deg, #fff 0%, #a5a5a5 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n}\n\n.qr-container {\n display: flex;\n justify-content: center;\n margin: 1.5rem 0;\n}\n\n.qr-wrapper {\n background: #ffffff;\n border-radius: 24px;\n padding: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 8px 32px rgba(0,0,0,0.3);\n min-width: 312px;\n min-height: 312px;\n transition: background-color 0.2s;\n}\n\n.qr-wrapper svg,\n.qr-wrapper canvas {\n display: block;\n}\n\n.label-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 0.25rem;\n}\n\n.style-value {\n font-family: monospace;\n font-size: 0.75rem;\n color: var(--pico-primary);\n background: rgba(99, 102, 241, 0.15);\n padding: 0.2rem 0.5rem;\n border-radius: 4px;\n}\n\n.slider-labels {\n display: flex;\n justify-content: space-between;\n font-size: 0.7rem;\n color: rgba(255,255,255,0.35);\n margin-top: 0.25rem;\n padding: 0 0.25rem;\n}\n\ndetails {\n margin: 1rem 0;\n}\n\n.option-group {\n margin-bottom: 1rem;\n}\n\n.option-group:last-child {\n margin-bottom: 0;\n}\n\n.color-row {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 1rem;\n}\n\n.color-row .option-group {\n margin-bottom: 0;\n}\n\n.color-row input[type=\"color\"] {\n width: 100%;\n height: 42px;\n padding: 4px;\n cursor: pointer;\n}\n\n.download-group {\n display: flex;\n width: 100%;\n}\n\n.download-group > button {\n flex: 1;\n margin-bottom: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: none;\n}\n\n.download-group .dropdown {\n margin-bottom: 0;\n}\n\n.download-group .dropdown summary {\n margin-bottom: 0;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n height: 100%;\n padding: 0 1.25rem;\n background: var(--pico-primary);\n border-color: var(--pico-primary);\n color: var(--pico-primary-inverse);\n}\n\n.download-group .dropdown summary:hover {\n background: var(--pico-primary-hover);\n border-color: var(--pico-primary-hover);\n}\n\n.download-group .dropdown summary::after {\n display: none;\n}\n\n.download-group .dropdown ul {\n min-width: 160px;\n right: 0;\n left: auto;\n}\n\nfooter {\n text-align: center;\n margin-top: 2rem;\n opacity: 0.5;\n font-size: 0.875rem;\n}\n\nfooter a {\n color: inherit;\n}\n\n.loading {\n color: rgba(0,0,0,0.4);\n font-size: 0.875rem;\n}\n","createdAt",["D",1768676947847],"branchVersion","branchId","3dc4f85c-f3d1-11f0-8b0b-42dde27851f2","id","3dc47882-f3d1-11f0-8b0b-42dde27851f2","qr-generator",["D",1768674045845],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","3ee322c5-8742-48e0-86c7-5f3ae129683b","pinnedFileId","52078352-f3d1-11f0-8ae3-42dde27851f2","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","f427167a-3263-4778-81d8-f79626323ff5","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_95":94,"_103":99},"org",{"_95":94,"_96":97,"_98":99,"_18":53,"_100":101,"_102":25},"branch",{"_13":84,"_32":85,"_42":41,"_86":43,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":44,"_93":94},"isOwned",51,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","kamalnrf","handle","displayName","Kamal","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yaVpXT3l1d2hWSFdtWTNoZFIwZ0lFUUhOd2oifQ","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_42":43,"_32":44,"_37":189,"_46":-5,"_47":25,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":55,"_56":57,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":190,"_79":191,"_81":192,"_83":25},"tree",[172,173,174,175],"files",[172,173,174,175],"counts",{"_161":61,"_162":163,"_164":61,"_165":166,"_167":168},"contents",[126,127,128,129],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_42":153,"_32":154,"_30":155,"_131":-5,"_40":41,"_39":156,"_132":25,"_37":157,"_13":158,"_33":20,"_34":159,"_24":25,"_135":-5,"_27":160},{"_42":145,"_32":146,"_30":147,"_131":-5,"_40":41,"_39":148,"_132":25,"_37":149,"_13":150,"_33":20,"_34":151,"_24":25,"_135":-5,"_27":152},{"_42":137,"_32":138,"_30":55,"_131":-5,"_40":41,"_39":139,"_132":57,"_37":140,"_13":141,"_33":142,"_34":143,"_24":25,"_135":44,"_27":144},{"_42":130,"_32":28,"_30":31,"_131":-5,"_40":41,"_39":14,"_132":25,"_37":133,"_13":134,"_33":20,"_34":36,"_24":25,"_135":-5,"_27":136},"ff802768-f3d7-11f0-9b14-42dde27851f2","parentId","latest",["D",1768676947847],7,"label",[28],"2a27d248-f3d5-11f0-abd2-42dde27851f2","main.ts",23,["D",1768675730924],4,"http","import { staticHTTPServer } from \"https://esm.town/v/std/utils/index.ts\";\nexport default staticHTTPServer(import.meta.url);\n",[138],"6cc9313a-f3d7-11f0-acca-42dde27851f2","index.html","3069b518-f3d5-11f0-b2ac-42dde27851f2",35,["D",1768676701704],3,"\n\n\n \n \n QR Generator\n \n \n\n\n

QR Generator

\n \n

\n Loading...\n

\n \n \n \n

Customize

\n \n

\n Dots\n dots\n

\n \n

●■

\n \n

\n Corner Square\n extra-rounded\n

\n \n

●■

\n \n

\n Corner Dot\n dot\n

\n \n

●■

\n \n

\n Pixels\n \n

\n Background\n \n

\n \n \n URL\n \n \n \n

\n \n \n

\n \n \n\n\n",[146],"73ffbae6-f3d7-11f0-822d-42dde27851f2","client.js","8e658d1e-f3d4-11f0-8c74-42dde27851f2",37,["D",1768676713797],6,"// Client-side QR generation\nconst DOT_STYLES = [\"dots\", \"rounded\", \"extra-rounded\", \"classy-rounded\", \"classy\", \"square\"];\nconst CORNER_STYLES = [\"dot\", \"extra-rounded\", \"square\"];\n\nlet qrCode = null;\n\nconst state = {\n link: \"https://val.town\",\n dotIndex: 0,\n cornerSquareIndex: 1,\n cornerDotIndex: 0,\n pixelColor: \"#000000\",\n bgColor: \"#ffffff\"\n};\n\nconst getQrOptions = (type = \"canvas\") => ({\n width: 280,\n height: 280,\n type,\n data: state.link || \"https://val.town\",\n dotsOptions: {\n color: state.pixelColor,\n type: DOT_STYLES[state.dotIndex]\n },\n backgroundOptions: {\n color: state.bgColor\n },\n cornersSquareOptions: {\n type: CORNER_STYLES[state.cornerSquareIndex],\n color: state.pixelColor\n },\n cornersDotOptions: {\n type: CORNER_STYLES[state.cornerDotIndex],\n color: state.pixelColor\n }\n});\n\nlet updateTimeout;\nconst updateQR = () => {\n clearTimeout(updateTimeout);\n updateTimeout = setTimeout(() => {\n if (qrCode) {\n qrCode.update(getQrOptions());\n // Update wrapper background to match QR background\n document.getElementById(\"qr-wrapper\").style.backgroundColor = state.bgColor;\n }\n }, 50);\n};\n\nconst randomize = () => {\n state.dotIndex = Math.floor(Math.random() * DOT_STYLES.length);\n state.cornerSquareIndex = Math.floor(Math.random() * CORNER_STYLES.length);\n state.cornerDotIndex = Math.floor(Math.random() * CORNER_STYLES.length);\n state.pixelColor = '#' + Math.floor(Math.random()*16777215).toString(16).padStart(6, '0');\n \n // Random pastel background (light but colorful, keeps scannable)\n const hue = Math.floor(Math.random() * 360);\n const sat = 40 + Math.floor(Math.random() * 40); // 40-80%\n const light = 85 + Math.floor(Math.random() * 12); // 85-97%\n state.bgColor = hslToHex(hue, sat, light);\n \n // Update UI\n document.getElementById(\"dot-slider\").value = state.dotIndex;\n document.getElementById(\"dot-value\").textContent = DOT_STYLES[state.dotIndex];\n document.getElementById(\"corner-square-slider\").value = state.cornerSquareIndex;\n document.getElementById(\"corner-square-value\").textContent = CORNER_STYLES[state.cornerSquareIndex];\n document.getElementById(\"corner-dot-slider\").value = state.cornerDotIndex;\n document.getElementById(\"corner-dot-value\").textContent = CORNER_STYLES[state.cornerDotIndex];\n document.getElementById(\"pixel-color\").value = state.pixelColor;\n document.getElementById(\"bg-color\").value = rgbToHex(state.bgColor);\n \n updateQR();\n};\n\nconst rgbToHex = (rgb) => {\n if (rgb.startsWith('#')) return rgb;\n const match = rgb.match(/\\d+/g);\n if (!match) return '#ffffff';\n return '#' + match.slice(0,3).map(x => parseInt(x).toString(16).padStart(2,'0')).join('');\n};\n\nconst hslToHex = (h, s, l) => {\n s /= 100;\n l /= 100;\n const a = s * Math.min(l, 1 - l);\n const f = n => {\n const k = (n + h / 30) % 12;\n const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n return Math.round(255 * color).toString(16).padStart(2, '0');\n };\n return `#${f(0)}${f(8)}${f(4)}`;\n};\n\nasync function loadQRLibrary() {\n try {\n const mod = await import(\"https://esm.sh/qr-code-styling@1.6.0-rc.1?bundle\");\n return mod.default || mod;\n } catch (e) {\n console.warn(\"ESM import failed, trying alternate:\", e);\n }\n \n return new Promise((resolve, reject) => {\n const script = document.createElement(\"script\");\n script.src = \"https://unpkg.com/qr-code-styling@1.5.0/lib/qr-code-styling.js\";\n script.onload = () => resolve(window.QRCodeStyling);\n script.onerror = reject;\n document.head.appendChild(script);\n });\n}\n\nasync function init() {\n const wrapper = document.getElementById(\"qr-wrapper\");\n \n try {\n const QRCodeStyling = await loadQRLibrary();\n \n if (!QRCodeStyling) {\n throw new Error(\"QRCodeStyling not found\");\n }\n \n wrapper.innerHTML = \"\";\n qrCode = new QRCodeStyling(getQrOptions());\n qrCode.append(wrapper);\n } catch (e) {\n console.error(\"QR library failed:\", e);\n wrapper.innerHTML = 'Failed: ' + e.message + '';\n return;\n }\n \n // URL input\n document.getElementById(\"link-input\").addEventListener(\"input\", (e) => {\n state.link = e.target.value;\n updateQR();\n });\n \n // Dot slider\n const dotSlider = document.getElementById(\"dot-slider\");\n const dotValue = document.getElementById(\"dot-value\");\n dotSlider.addEventListener(\"input\", (e) => {\n state.dotIndex = parseInt(e.target.value);\n dotValue.textContent = DOT_STYLES[state.dotIndex];\n updateQR();\n });\n \n // Corner square slider\n const cornerSquareSlider = document.getElementById(\"corner-square-slider\");\n const cornerSquareValue = document.getElementById(\"corner-square-value\");\n cornerSquareSlider.addEventListener(\"input\", (e) => {\n state.cornerSquareIndex = parseInt(e.target.value);\n cornerSquareValue.textContent = CORNER_STYLES[state.cornerSquareIndex];\n updateQR();\n });\n \n // Corner dot slider\n const cornerDotSlider = document.getElementById(\"corner-dot-slider\");\n const cornerDotValue = document.getElementById(\"corner-dot-value\");\n cornerDotSlider.addEventListener(\"input\", (e) => {\n state.cornerDotIndex = parseInt(e.target.value);\n cornerDotValue.textContent = CORNER_STYLES[state.cornerDotIndex];\n updateQR();\n });\n \n // Pixel color\n document.getElementById(\"pixel-color\").addEventListener(\"input\", (e) => {\n state.pixelColor = e.target.value;\n updateQR();\n });\n \n // Background color\n document.getElementById(\"bg-color\").addEventListener(\"input\", (e) => {\n state.bgColor = e.target.value;\n updateQR();\n });\n \n // Randomize\n document.getElementById(\"randomize-btn\").addEventListener(\"click\", randomize);\n \n // Downloads\n document.getElementById(\"download-png\").addEventListener(\"click\", () => {\n qrCode?.download({ name: \"qr-code\", extension: \"png\" });\n });\n \n document.getElementById(\"download-svg\").addEventListener(\"click\", (e) => {\n e.preventDefault();\n qrCode?.download({ name: \"qr-code\", extension: \"svg\" });\n });\n \n document.getElementById(\"download-pdf\").addEventListener(\"click\", async (e) => {\n e.preventDefault();\n // PDF requires jspdf - create from canvas\n const canvas = document.querySelector(\"#qr-wrapper canvas\");\n if (!canvas) {\n alert(\"Generate QR first\");\n return;\n }\n \n try {\n const { jsPDF } = await import(\"https://esm.sh/jspdf@2.5.1\");\n const pdf = new jsPDF({ unit: \"px\", format: [canvas.width + 40, canvas.height + 40] });\n pdf.addImage(canvas.toDataURL(\"image/png\"), \"PNG\", 20, 20, canvas.width, canvas.height);\n pdf.save(\"qr-code.pdf\");\n } catch (e) {\n console.error(\"PDF generation failed:\", e);\n alert(\"PDF download failed\");\n }\n });\n}\n\ninit();\n",[154],"pulls","branches",1,"forks","envVars",{"_169":61,"_171":61},"connections",{"_169":61,"_170":61},"count","unfilledCount","emptyCount",{"_42":153,"_32":154,"_30":155,"_131":-5,"_40":41,"_39":156,"_132":25,"_37":186,"_13":158,"_33":20,"_34":159,"_24":25,"_135":-5,"_177":187,"_27":188},{"_42":145,"_32":146,"_30":147,"_131":-5,"_40":41,"_39":148,"_132":25,"_37":183,"_13":150,"_33":20,"_34":151,"_24":25,"_135":-5,"_177":184,"_27":185},{"_42":137,"_32":138,"_30":55,"_131":-5,"_40":41,"_39":139,"_132":57,"_37":180,"_13":141,"_33":142,"_34":143,"_24":25,"_135":44,"_177":181,"_27":182},{"_42":130,"_32":28,"_30":31,"_131":-5,"_40":41,"_39":14,"_132":25,"_37":176,"_13":134,"_33":20,"_34":36,"_24":25,"_135":-5,"_177":178,"_27":179},["D",1768676947847],"children",[],[28],["D",1768675730924],[],[138],["D",1768676701704],[],[146],["D",1768676713797],[],[154],["D",1768674045845],{"_95":94,"_103":99},{"_95":94,"_96":97,"_98":99,"_18":53,"_100":101,"_102":25},{"_13":84,"_32":85,"_42":41,"_86":43,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":44,"_93":94},"ctx",{"_77":-5,"_123":226,"_227":228,"_229":230,"_231":25,"_232":25,"_233":25,"_234":57,"_235":-5,"_236":-7,"_237":-7,"_238":61,"_239":25,"_240":25,"_241":-5,"_242":25,"_243":25,"_244":25,"_245":-5},"ENV",{"_197":198,"_199":200,"_201":85,"_202":203,"_204":205,"_206":207,"_208":209,"_210":211,"_212":213,"_214":215,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v39