Page MenuHomeSealhub

map-with-pins.jdd.tsx
No OneTemporary

map-with-pins.jdd.tsx

import { TempstreamJSX } from "tempstream";
import type { ComponentToHTMLArgs } from "@sealcode/jdd";
import { Component, ComponentArguments } from "@sealcode/jdd";
const component_arguments = {
theme: new ComponentArguments.Enum(["accent", "accent2"]),
pins: new ComponentArguments.List(
new ComponentArguments.Structured({
title: new ComponentArguments.ShortText(),
address: new ComponentArguments.ShortText(),
coordinates: new ComponentArguments.ShortText().setExampleValues(["52,16"]),
button: new ComponentArguments.Structured({
text: new ComponentArguments.ShortText(),
link: new ComponentArguments.ShortText(),
}),
})
),
} as const;
export class MapWithPins extends Component<typeof component_arguments> {
getArguments() {
return component_arguments;
}
async getEarlyAssets() {
return [
{
type: "script" as const,
url: "https://unpkg.com/leaflet@1.9.4/dist/leaflet.js",
identity: "https://unpkg.com/leaflet@1.9.4/dist/leaflet.js",
integrity:
"sha512-BwHfrr4c9kmRkLw6iXFdzcdWV/PGkVgiIyIWLLlTSXzWQzxuSg4DiQUCpauz/EWjgk5TYQqX/kvn9pG1NpYfqg==",
},
{
type: "style" as const,
url: "https://unpkg.com/leaflet@1.9.4/dist/leaflet.css",
integrity:
"sha512-Zcn6bjR/8RZbLEpLIeOwNtzREBAJnUKESxces60Mpoj+2okopSAcSUIUOseddDm0cxnGQzxIR7vJgsLZbdLE3w==",
identity: "https://unpkg.com/leaflet@1.9.4/dist/leaflet.css",
},
];
}
toHTML({
args: { theme, pins },
classes,
index,
}: ComponentToHTMLArgs<typeof component_arguments>) {
return (
<div
class={[
"map-with-pins bleed-out",
`map-with-pins--theme-${theme}`,
...classes,
]}
style={`--jdd-index: ${index}`}
data-controller="map-with-pins"
data-map-with-pins-pins-value={JSON.stringify(pins)
.replaceAll("\n", "\\n")
.replaceAll('"', "&quot;")}
></div>
);
}
}

File Metadata

Mime Type
text/x-java
Expires
Sat, Nov 8, 02:32 (14 h, 17 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1033925
Default Alt Text
map-with-pins.jdd.tsx (1 KB)

Event Timeline