The avatar for @tomlarkworthy
Tom Larkworthy
Tech Lead at Taktile. Formerly Firebase, Google
Public
ui
Edited
Mar 23, 2024
22 stars
ui
Composing viewofs with the view literalScaling User Interface DevelopmentlocalStorageView: Non-invasive local persistanceDOM viewurlQueryFieldView: Non-invasive URL field persistence
Design Guidelines and Linter for Reusable UI Components
Squeezing more Juice out of UI librariesReversible attachmentGlobally Synchronized ViewsTabbed Pane ViewMultiplayer Cursors👋 Hello, javascript-state-machine ⨯ PlotVertical SlidersDraggable LocalFile fileInputData EditorUI AnimationView Composition ExamplesComposing views across time: viewroutineHypertext literal reconciliation with nanomorphResponsive gridimgChooserDraggable Sticky viewHowto import a React component (Chonky Example)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
{
const component = await build();
return Object.getOwnPropertyDescriptor(component, "value");
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
suite.test("Input events bubble", async done => {
const component = await build();
component.addEventListener('input', evt => {
if (!evt.bubbles) {
done(new Error("input event with bubbles: false"));
}
});

component.querySelectorAll("input").forEach(inputEl => {
inputEl.dispatchEvent(new CustomEvent('input', { bubbles: true }));
});
done();
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import { footer } from "@tomlarkworthy/footer"
Insert cell
footer
Insert cell

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.
Learn more