sn = (...args) => {
mutable counter = 1;
return html`
<div class="wrapper">
${viewof style.parentNode ? [] : style}
${md(...args)}
</div>
`;
}
note = (...args) => {
const id = mutable counter;
mutable counter += 1;
const trigger = html`<button class="ref subtle">${id}</button>`;
const extract = md(...args);
tippy.default(trigger, {
content: extract,
ignoreAttributes: true,
interactive: true,
trigger: 'click',
theme: 'light-border',
placement: 'bottom',
animation: 'shift-away',
maxWidth: 354
});
return isDesktop ? html`<div class="extract"><font size=2>${extract}</font>` : trigger;
}
isDesktop = createVariable({
get: () => document.body.clientWidth > 700,
attach: cb => addEventListener("resize", cb),
detach: cb => removeEventListener("resize", cb)
})
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
