ui-svelte

The ui-svelte module of the TinyBase project provides reactive functions, listener functions, and components to make it easy to create reactive Svelte 5 apps with Store objects.

The reactive functions in this module provide access to the data and structures exposed by other modules in the project. They return reactive objects with a current property. Those functions register listeners such that components using them re-render when data changes.

The components in this module provide a further abstraction over those reactive functions, and use Svelte snippet props to customize rendering in an idiomatic way.

Functions like the getStore function and getMetrics function return TinyBase objects directly from Provider context. Functions like the getCell function, the getRow function, the getTable function, the getValue function, and the hasCell function return reactive objects whose current property reflects underlying TinyBase data.

Function parameters accept either plain values or reactive getter functions (as per the MaybeGetter type), so passing () => tableId from a let-bound Svelte prop makes the function re-execute whenever the prop changes.