Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Readme

View on Val Town

Give url and, link to your val!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
// This val creates a JSX component that displays a link to the current val on Val Town.
// It uses the pomdtr/extractValInfo val to get the current val's information.
// The component is rendered using Hono's JSX support for simplicity.
/** @jsxImportSource npm:hono@3/jsx */
import { extractValInfo } from "https://esm.town/v/pomdtr/extractValInfo";
import { Hono } from "npm:hono";
const app = new Hono();
export const ValTownLink = ({ url }: { url?: string | URL | null }) => {
const { author, name } = extractValInfo(url || import.meta.url);
const valUrl = `https://www.val.town/v/${author}/${name}`;
return (
<a href={valUrl} target="_blank" rel="noopener noreferrer" style="text-decoration: none; color: inherit;">
<span style="display: inline-flex; align-items: center; font-family: sans-serif;">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 400 400" fill="none">
<rect width="32" height="32" fill="white" />
<g clip-path="url(#clip0_1045_835)">
<path
d="M265.026 271.002C257.83 271.002 251.994 268.767 247.518 264.293C243.038 259.821 240.802 253.841 240.802 246.363V184.761H226.364V161.881H240.802V128H268.548V161.881H298.5V184.761H268.548V241.521C268.548 245.921 270.604 248.123 274.716 248.1
fill="black"
/>
<path
d="M204.362 174.325L158.23 250.768H154.266V178.601C154.266 169.37 146.776 161.887 137.536 161.887H126.518V253.01C126.518 262.95 134.586 271.01 144.536 271.01H163.396C173.396 271.01 182.638 265.682 187.64 257.03L242.664 161.887H226.404C217.384
fill="black"
/>
<path d="M99.9939 161.887H127.8V184.769H99.9939V161.887Z" fill="black" />
</g>
<defs>
<clipPath id="clip0_1045_835">
<rect width="200" height="143.86" fill="white" transform="translate(100 128)" />
</clipPath>
</defs>
</svg>
View on Val Town
</span>
</a>
);
};
app.get("/", (c) => c.html(<ValTownLink />));
export default app.fetch;
dthyresson-viewonvaltowncomponent.web.val.run
August 4, 2024