[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_207":208,"_209":210},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_63":118,"_16":-7,"_168":-5,"_17":169,"_170":171,"_29":172,"_21":173,"_23":174,"_82":-5,"_175":-5,"_176":-5,"_177":36,"_178":179,"_180":39,"_181":-5,"_182":-5,"_183":184},"routes/_app.x.$handle.$name._index",{"_11":12,"_13":14,"_15":-7,"_16":-7,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":-5,"_28":-5,"_29":30,"_31":32,"_33":-5,"_34":-5,"_35":36,"_37":36,"_38":39},"handle","jxnblk","name","identicon","branchName","version","project",{"_40":108,"_13":14,"_51":109,"_110":-5,"_111":36,"_112":113,"_114":113,"_115":116,"_117":118,"_119":120,"_121":44,"_122":39,"_123":39,"_124":-5,"_125":53,"_126":127,"_128":129,"_130":131,"_132":133,"_134":-5,"_135":136,"_137":136,"_138":139,"_140":139,"_141":139,"_142":136,"_143":136,"_144":145,"_146":147,"_148":149,"_150":36},"tags",[],"counts",{"_97":53,"_98":99,"_100":53,"_101":102,"_103":104},"contents",[88,89,90],"readme",{"_40":76,"_13":77,"_43":78,"_45":-5,"_46":47,"_48":79,"_50":39,"_51":86,"_16":81,"_54":82,"_56":83,"_58":36,"_59":-5,"_63":87},"upstream","pull","files",[65,32,66],"preview",{"_40":41,"_13":42,"_43":44,"_45":-5,"_46":47,"_48":49,"_50":39,"_51":52,"_16":53,"_54":55,"_56":57,"_58":36,"_59":60,"_61":62,"_63":64},"ahead","behind","showHomeCustomizationHint",false,"showHTTPPreviewSettingsHint","hasHTTPFiles",true,"id","71a88616-988c-11f0-aa91-0224a6c84d84","demo.tsx","fileId","71a886e8-988c-11f0-aa91-0224a6c84d84","parentId","branchId","268abb12-8f28-11f0-adeb-0224a6c84d84","branchVersion",60,"latest","createdAt",["D",1758638941806],0,"fileType","http","content","/** @jsxImportSource npm:hono/jsx */\nimport { Hono } from \"npm:hono\";\nimport crs from \"npm:crypto-random-string\";\n\nconst URL = \"https://identicon.val.run\";\n\nconst app = new Hono();\n\nconst rand = (min = 1, max = 24) =>\n Math.random() * (max - min) + min;\n\nconst css = `\nbody {\n margin: 0;\n padding: 32px;\n font-family: system-ui;\n}\npre {\n font-size: 10px;\n}\n.grid {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n \n}\n`;\n\nfunction Thumb ({\n name,\n size = 128,\n}: {\n name: string;\n size?: number\n}) {\n const url = `${URL}/?name=${name}`;\n return (\n

\n $\"demo$ \n

{name}

\n )\n}\n\napp.get(\"/\", async c => {\n const names = Array.from({ length: 32 }).map((n, i) => {\n const length = rand();\n return crs({ length, type: \"alphanumeric\" });\n });\n\n return c.html(\n \n \n

jxnblk

identicon

identicon

Usage

Examples