Public
Script
- multiFormat@postpostscriptmultiFormat: easily create outputs of multiple formats (e.g. text/html for Email) using tagged templates Examples import { format } from "https://esm.town/v/postpostscript/multiFormat"; console.log(format.Plain` ${format.Heading1`Some Heading`} Lorem ipsum dolor ${format.Strong`sit`} amet `); { "text": "\nSome Heading\n\nLorem ipsum dolor sit amet\n", "html": "\n<br><h1>Some Heading</h1>\n<br>\n<br>Lorem ipsum dolor <strong>sit</strong> amet\n<br>" } Create Your Own Formatters import { createFormatMethod, wrapHTMLTag, type MultiFormatWithHTML } from "https://esm.town/v/postpostscript/multiFormat"; export const Red = createFormatMethod<MultiFormatWithHTML>((value) => { return wrapHTMLTag("span", value, { style: "color: red;", }); }); console.log(Red`red text!`) { "text": "red text!", "html": "<span style=\"color: red;\">red text!</span>" } Sanitization Text is automatically sanitized when converted to HTML: console.log(format.Trim` ${format.Heading1`Some Heading`} <script>alert(1)</script> `.html.toString()) <h1>Some Heading</h1> <br> <br><script>alert(1)</script>Script
- vue@postpostscriptvue: inline Vue SFC components in your HTML Example Val showing how to define reusable components: @postpostscript/vueExample import { htmlResponse } from "https://esm.town/v/postpostscript/html"; import { vueSfcInline } from "https://esm.town/v/postpostscript/vue"; export default function() { return htmlResponse` ${vueSfcInline` <script setup type="ts"> import { ref } from "vue"; const name = ref("Vue"); </script> <template> Hello World from {{ name }}! <br> <input v-model="name" /> </template> `} `; }Script
- provideBlob@postpostscriptprovideBlob: Return Response Quickly and Poll for the Expensive Parts Example: See @postpostscript/provideBlobExample for full example. You will need to fork this val to use provideBlob on your projects as it uses @std/blob for storage import { Image } from "https://deno.land/x/imagescript@1.2.17/mod.ts"; import { htmlResponse } from "https://esm.town/v/postpostscript/html"; import { provideBlob } from "https://esm.town/v/postpostscript/provideBlob"; export default async function(req: Request) { const image = provideBlob(async () => { const png = new Image(100, 100); png.drawCircle(50, 50, 50, 100); return png.encode(); }).jsPromise(); return htmlResponse` <div id="image"></div> <script> ${image}.then(blob => { const $img = document.createElement("img") $img.src = URL.createObjectURL(blob) document.getElementById("image").appendChild($img) }) </script> `; }HTTP (deprecated)
- blog@postpostscript@postpostscript 's Val Town Blog Blog Posts: Ideas 2024-03-06 - Auth for Val Town 2024-03-09 - sqliteUniverse: Make SQLite Queries Against Multiple Endpoints in Deno (Val Town) (Part 1) 2024-03-09 - sqliteUniverse: Make SQLite Queries Against Multiple Endpoints in Deno (Val Town) (Part 2) Other Projects: 2024-02-25 - moduleHighlightValueLink: Link to a Val With a Value or Method's Code Highlighted 2024-02-28 - provideBlob: Return Response Quickly and Poll for the Expensive Parts 2024-03-02 - MyFooter: my footer component which shares random vals I've liked! 2024-03-16 - readmeManager: Edit Val Readmes With Persistent Drafts 2024-04-09 - reactiveStateBlob: wrap blob state in a proxy to autosave it on changes 2024-04-24 - lock: lock that releases when it leaves the execution context 2024-04-25 - fetchWorker: communicate with a worker over a fetch-like interfaceHTTP (deprecated)
March 2, 2024