[{"_1":2,"_198":-5,"_199":-5},"loaderData",{"_3":4,"_91":92,"_185":186,"_197":-5},"root",{"_5":6,"_32":33,"_58":59,"_89":90},"ctx",{"_7":8,"_18":19,"_20":-5,"_21":22,"_23":24,"_25":26,"_27":26,"_28":29,"_30":31},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"sessionClaims","sessionId","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","environmentVariableKeys",[],"user","preferences_keybindings","default","preferences_theme","light","preferences_fixers",false,"preferences_copilot","preferences_model","claude-3-5-haiku-20241022","notification_count",0,"ENV",{"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","fa80b67e1f763bfb4b247c3f5ca4f0b0730f3f5c","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","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","API_URL","https://api.val.town","WORKER_FINGERPRINT","799d99f2805306c2714a7cfefbeae178","clerkState",{"_60":61},"__internal_clerk_state",{"_62":63,"_64":43,"_65":66,"_67":66,"_68":26,"_69":66,"_70":66,"_71":66,"_72":66,"_73":66,"_74":66,"_75":66,"_76":66,"_77":78,"_87":26,"_88":26},"__clerk_ssr_state",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__signInForceRedirectUrl","__signUpForceRedirectUrl","__signInFallbackRedirectUrl","__signUpFallbackRedirectUrl","__clerk_debug",{"_79":26,"_80":66,"_81":82,"_83":66,"_84":43,"_85":26,"_86":66},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","remixVersion",2,"routes/_app.v.$handle.$name",{"_93":94,"_95":96,"_94":97,"_164":-5,"_165":-5,"_166":167,"_132":133,"_140":141,"_100":101,"_98":99,"_119":-7,"_50":51,"_184":26},"type","val","author","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18",{"_98":99,"_95":96,"_100":101,"_102":103,"_104":-5,"_105":106,"_107":108,"_109":110,"_111":112,"_113":26,"_114":112,"_115":116,"_117":118,"_119":120,"_121":26,"_122":123,"_124":90,"_125":126,"_127":31,"_128":90,"_129":31,"_130":-5,"_20":131,"_136":-5,"_137":-7,"_138":139,"_140":141,"_142":143},"name","react_http","valNameId","37d1ed14-0978-11ef-8fe7-cab58f78796a","parentFolderId","eecc26b7-476b-4e93-9487-ae8b4988d6e5","isOwned","privacy","public","readme","# Client Side React Helper\n\n## Example Usage\n\n```tsx\n/** @jsxImportSource https://esm.sh/react */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport react_http from \"https://esm.town/v/stevekrouse/react_http?v=6\";\n\nexport function App() {\n const [count, setCount] = useState(0);\n return (\n

Example App

\n setCount(count + 1)}\n className=\"bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded\"\n >\n {count}\n \n

\n );\n}\n\nexport default () =>\n react_http({\n component: App,\n sourceURL: import.meta.url,\n head: `\n \n \n Example App`,\n });\n```\n\n## Gotchas\n\n#### Only use https imports\n\nThe val with your React component will be imported in the browser. Thus, only use `https` imports in this val and any that it imports. Replace any `npm:` with `https://esm.sh/` and everything should work great.","valType","script","currentVersion","79afc19a-0eda-11ef-b54c-cab58f78796a","legacyPrivate","id","code","export default function({ component, sourceURL, head }: { component: Function; sourceURL: string; head?: string }) {\n return new Response(\n `\n ${head || \"\"}\n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}","createdAt",["D",1715351697898],"version",6,"currentUserHasLiked","likeCount",3,"forkCount","referenceCount",25,"dependencyCount","commentCount","prCount","mergedPr",{"_132":133,"_134":135},"handle","stevekrouse","profileImageUrl","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","forkedVal","interval","slug","stevekrouse/react_http","description","Client Side React Helper Example Usage /** @jsxImportSource https://esm.sh/react */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport react_http from \"https://esm.town/v/stevekrouse/react_http?v=6\";\n\nexport function App() {\n const [count, setCount] = useState(0);\n return (\n

Example App

\n setCount(count + 1)}\n className=\"bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded\"\n >\n {count}\n \n

\n );\n}\n\nexport default () =>\n react_http({\n component: App,\n sourceURL: import.meta.url,\n head: `\n \n \n Example App`,\n }); Gotchas Only use https imports The val with your React component will be imported in the browser. Thus, only use https imports in this val and any that it imports. Replace any npm: with https://esm.sh/ and everything should work great.","versions",[144,147,151,154,157,161],{"_119":120,"_145":-5,"_117":146,"_114":112},"prId",["D",1715351697898],{"_119":148,"_145":-5,"_117":149,"_114":150},5,["D",1715351578131],"324cc05a-0eda-11ef-8efb-cab58f78796a",{"_119":123,"_145":-5,"_117":152,"_114":153},["D",1714759910172],"9cb6d7f8-0978-11ef-ba66-cab58f78796a",{"_119":90,"_145":-5,"_117":155,"_114":156},["D",1714759830956],"6d7f7878-0978-11ef-8b3d-cab58f78796a",{"_119":158,"_145":-5,"_117":159,"_114":160},1,["D",1714759821052],"67984390-0978-11ef-8fe7-cab58f78796a",{"_119":31,"_145":-5,"_117":162,"_114":163},["D",1714759740906],"37d2f56a-0978-11ef-8fe7-cab58f78796a","recentThread","breadcrumbs","comments",[168,179],{"_114":169,"_170":171,"_117":172,"_173":-5,"_174":26,"_175":26,"_20":176},"7a31c9cc-1e68-11ef-bdab-cab58f78796a","body","Looks like there is a type in the example in the readme. There is a missing close bracket in the component function",["D",1717061954728],"updatedAt","canDelete","canEdit",{"_132":177,"_134":178},"tfayyaz","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yZlB4ekgyWUNWamFTeXdsbHVjWFZWaEgxYnIifQ",{"_114":180,"_170":181,"_117":182,"_173":-5,"_174":26,"_175":26,"_20":183},"36301cba-1ec7-11ef-b661-cab58f78796a","Fixed! Thanks!",["D",1717102642821],{"_132":133,"_134":135},"isOwner","routes/_app.v.$handle.$name.versions.$(version)",{"_93":187,"_188":189,"_94":190},"single","redirect","/v/stevekrouse/react_http/versions",{"_114":160,"_115":191,"_119":158,"_117":192,"_193":99,"_100":101,"_109":110,"_132":133,"_11":96,"_194":-5,"_195":-5,"_196":-5,"_184":26,"_138":139},"export default async (component, url) =>\n function(req: Request) {\n return new Response(\n `\n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n };",["D",1714759821052],"valName","deletedAt","messageId","threadId","routes/_app","actionData","errors"]

react_http

Version 1