3f:null 40:["$","title",null,{"children":"Observable notebook metadata | Riley | Observable"}] 46:T643,viewof example = { let wrap = document.createElement("div"); let form = Inputs.form({ user: Inputs.text({ label: "username", value: "@rmw4269", placeholder: "@…", pattern: (/\@[_-a-z0-9]+/).source, minlength: 2, maxlength: 256, required: true }), notebook: Inputs.text({ label: "notebook", value: "notebook-meta", pattern: (/[-_a-z\d]+(?:\/[0-9]+)?/).source, minlength: 1, required: true }) }); wrap.append(form); link: { let link = document.createElement("a"); link.style.setProperty("display", "block"); let listener = ["input", () => { link.innerText = `ObservableHQ.com/${form.value.user}/${form.value.notebook}`; link.href = `//${link.innerText}`; }, { passive: true }]; listener[1](); form.addEventListener(...listener); invalidation.then(() => { form.removeEventListener(...listener); link.remove(); }); wrap.append(link); } throttle: { let timer; let listener = ["input", event => { event.stopPropagation(); clearTimeout(timer); timer = setTimeout(() => { wrap.dispatchEvent(new Event("input")); timer = undefined; }, 1500); }, { passive: false }]; form.addEventListener(...listener); invalidation.then(() => form.removeEventListener(...listener)); } Object.defineProperty(wrap, "value", { get: function value() { return this.firstElementChild.value; }, set: function value(v) { this.firstElementChild.value = v; }, enumerable: true }); return wrap; }47:T6cc,

usage

There are three functions for accessing notebook metadata. All functions accept the arguments user and notebook. These are both strings. The user is the username of the account, optionally starting with "@". The notebook is the publicly-accessible URL slug that identifies the notebook, excluding the username. This may start with "/".

${notebookMeta_v3.name}

notebookMeta_v3(user, notebook, { rich = false, only } = {})

This returns a ${Map.name} of file-path string to ${File.name} or file contents. These are the files associated with the notebook.

The last argument is an optional options object. The boolean property rich determines whether to replace some ${File.name} objects in the output with more semantic objects. If present, only determines which files are returned, using relative file paths. If it is a string, then only that file is returned, without the containing ${Map.name}. If only is an iterable of strings, then those are the only files available in the output.

When rich is enabled, CSS files are parsed into ${CSSStyleSheet.name}s, JSON files are parsed into objects, JavaScript and text files are converted to strings, and Markdown and HTML files are parsed into ${Document.name}s.

48:T7bd,{ let formatList = list => [...list].map(({name}) => { let e = document.createElement("li"); e.innerText = name; return e; }) .reduce((collection, element) => void collection.append(element) ?? collection, document.createElement("ul")); let clickReveal = ["click", function click({target}) { target.replaceWith(md`\`\`\`javascript\n${target.dataset.code}\`\`\``); }, { once: true, passive: true }]; return Inputs.table(notebookVariables_v3(example.user, example.notebook), { layout: "auto", format: { name: e => e === null ? html`anonymous` : html`${e}`, tags: ({[Symbol.toStringTag]: t}) => t, inputs: formatList, outputs: formatList, definition: d => { if (!d) { return d; } d = d.toString(); let preview = document.createElement("code"); let threshold = d.indexOf("\n"); preview.innerText = d.slice(0, threshold < 0 ? 24 : Math.min(threshold, 24)).trim(); if (preview.innerText == d) { return preview = md`\`\`\`javascript\n${d}\`\`\``; } (d.length > preview.innerText.length) && preview.append("…"); preview.style.cursor = "pointer"; { let lineCount = 0, colCount = 0; for (let line of d.trim().split("\n")) { (line = line.trim()) && lineCount++; colCount = Math.max(line.length, colCount); } preview.title = `Click to show ${lineCount} line${lineCount == 1 ? "" : "s"}${colCount > 64 ? ` & ${colCount} columns` : "" } of code.`; } preview.addEventListener(...clickReveal); preview.dataset.code = d; invalidation.then(() => preview.removeEventListener(...clickReveal)); return preview; } }, columns: [ "name", "tags", "type", "version", "inputs", "outputs", "definition" ] }) }49:T87f,fileType = { class FileType extends Array { constructor(type, ext) { super(ext ? 2 : 1); if (type) { this[0] = String(type); } else { delete this[0]; } if (ext) { this[1] = String(ext); } else if (!type) { throw new TypeError("no types supplied"); } } static #matchType(items) { for (let t of items) { if (this[0] === t) { return true; } } return false; } static #matchExt(items) { for (let t of items) { if (this[1] === t) { return true; } } return false; } static #matchEither(items) { for (let t of items) { if (this[0] === t || this[1] === t) { return true; } } return false; } static #matchBoth(items) { let type = false; let ext = false; for (let t of items) { if (!type && this[0] === t) { if (ext) { return true; } type = true; } if (!ext && this[1] === t) { if (type) { return true; } ext = true; } } return false; } get type() { return this[0] || ""; } get ext() { return this[1] || ""; } get any() { return ( this[0] // type ? this[1] // ext ? FileType.#matchEither : FileType.#matchType : FileType.#matchExt ); } get all() { return ( this[0] // type ? this[1] // ext ? FileType.#matchBoth : FileType.#matchType : FileType.#matchExt ); } get [Symbol.toStringTag]() { return this.type || this.ext; } get [Symbol.species]() { return FileType; } } Object.defineProperty(FileType.prototype, "constructor", {enumerable: false, configurable: true, get() { return new Proxy(FileType, {get: (target, key) => key === "name" ? this[Symbol.toStringTag] : target[key]}); }}); return fileType; function fileType(file, name) { name ||= file.name; try { return new FileType(file.type || "", String(name).match(/(\.[^\.]+)$/)[1]); } catch {} return new FileType(file.type); } }4a:Tc49,richTypes = { let extensions = new MultiMap(undefined, Set.name); let fnList = []; let typeMap = new MultiMap([ // type parsers ["image/svg", ".svg", Symbol.for("text"), makeDOMParser("image/svg")], ["text/markdown", ".md", Symbol.for("text"), (file, {location} = {}) => { let doc = md(Object.assign([file], {raw: file})); if (!(doc instanceof Document)) { let wrap = new Document(); if (!(doc instanceof HTMLBodyElement)) { let body = wrap.createElement("body"); body.append(doc); doc = body; } wrap.append(doc); } doc.location = location; return doc; }], ["text/html", ".html", Symbol.for("text"), makeDOMParser("text/html")], ["text/xml", "application/xml", ".xml", Symbol.for("text"), makeDOMParser("text/xml")], ["application/xhtml+xml", "application/xhtml", ".xhtml", Symbol.for("text"), makeDOMParser("application/xhtml+xml")], ["application/json", ".json", Symbol.for("text"), JSON.parse.bind(JSON)], ["text/css", ".css", Symbol.for("text"), (css, {location} = {}) => { let doc = new DOMParser().parseFromString(`","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":336,"value":"import {MultiMap} from \"@rmw4269/multi-map\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4e","stdlib":"1"}} 45:"$44:body"