Val Town Code SearchReturn to Val Town

1import {
2  ActionFunctionArgs,
3  LoaderFunctionArgs,
4} from "https://esm.sh/react-router@7.1.3?deps=react@18.2.0,react-dom@18.2.0";
5import aboutLoader from "./about.loader.ts";
18    // imports the correct one to avoid putting the server code in client
19    // bundles
20    async loader(args: LoaderFunctionArgs) {
21      let mod = await (isServer
22        ? import("./layout.server.ts")
26    // same with the action, you'll probably want to abstract this kind of stuff
27    // in a createRoute() kind of thing
28    async action(args: ActionFunctionArgs) {
29      let mod = await (isServer
30        ? import("./layout.server.ts")

1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2
3export default function Home() {
4  return <h1>Home</h1>;
5}

11let { query, dataRoutes } = createStaticHandler(routes);
12
13export async function handler(request: Request) {
14  // 1. run actions/loaders to get the routing context with `query`
15  let context = await query(request);

4import type loader from "./about.loader.js";
5
6export default function About() {
7  let data = useLoaderData<typeof loader>();
8  return <h1>{data.message}</h1>;

1import { data } from "https://esm.sh/react-router@7.1.3?deps=react@18.2.0,react-dom@18.2.0";
2
3export default async function load() {
4  await new Promise(resolve => setTimeout(resolve, 200));
5

3import { createRoot } from "https://esm.sh/react-dom/client";
4
5function App() {
6  return (
7    <div className="">
126}
127
128function Section({ title, children }) {
129  return (
130    <div className="mb-10">
135}
136
137function FeatureItem({ href, title, description }) {
138  return (
139    <div className="bg-white border border-gray-200 rounded-lg p-4 hover:bg-blue-50 hover:border-blue-300 transition-all duration-200 transform hover:-translate-y-1 hover:shadow-md">
146}
147
148function PlannedItem({ title, description }) {
149  return (
150    <div className="bg-gray-100 border border-gray-200 rounded-lg p-4">
160}
161
162function client() {
163  createRoot(document.getElementById("root")).render(<App />);
164}
168}
169
170export default async function server(request: Request): Promise<Response> {
171  return new Response(
172    `

3import { renderToString } from "npm:react-dom/server";
4
5export default async function(req: Request): Promise<Response> {
6  return new Response(
7    renderToString(
13            {`let hasAnError: string = 10;
14
15function increment(num: number) {
16  return num + 1;
17}

2import { easyAQI } from "https://esm.town/v/stevekrouse/easyAQI?v=5";
3
4export async function aqi(interval: Interval) {
5  const location = "12494"; // <-- change to place, city, or zip code
6  const data = await easyAQI({ location });

2import { Eval } from "npm:braintrust@0.01";
3
4export default async function handler() {
5  const result = {
6    apiKeyStatus: null,

12   * @param {number} [opts.timeout=10 minutes] - The maximum amount of time (in milliseconds) the client will wait for a response before timing out.
13   * @param {number} [opts.httpAgent] - An HTTP agent used to manage HTTP(s) connections.
14   * @param {Core.Fetch} [opts.fetch] - Specify a custom `fetch` function implementation.
15   * @param {number} [opts.maxRetries=2] - The maximum number of times the client will retry a request.
16   * @param {Core.Headers} opts.defaultHeaders - Default headers to include with every request to the API.