matrix-svelte

matrix-svelte is a collection of Svelte components that may be helpful for building Matrix clients.

They are built for the Inverse project but presented independently in the hope that they might be useful.

Development

To run the demonstation app:

npm install
npm run dev -- --open

Design Principles

• We value visual clarity, accessibility and visual stability.

"Rules" (none of these are set in stone, and they also may conflict with each other in some cases):

• It should be clear which component is selected, and there should be a visible cursor for arrow-key navigation.
• Everything should be possible and convenient to do with keyboard controls.
• We sometimes take inspiration from Vim.
• Nothing should move around unless I triggered it:
  • with notable exceptions:
    • the timeline scrolls when I am at the bottom.
    • the room list may re-order based on activity.
  • this means we leave extra space for things to appear when needed.
• nothing important should happen on hover

Code style

Always run all the tests, formatting and linting before making a pull request.

Make sure you have Playwright installed:

npx playwright install  # Only needed the first time

Then run all tests and checks:

npm run format
npm run test
npm run check
npm run lint

All of these should pass without warnings before any code is merged.

To create a new component

• Create a new file inside src/lib and refer to it from src/lib/index.ts.

• Add some demos of how it looks to the demo app at routes/+page.svelte.

Building and Publishing Releases

To build the package:

npm run package

Update package.json with the correct version number, then:

npm publish

License

Copyright 2023 Andy Balaam and the matrix-svelte contributors.

Released under the Apache 2.0 license. See LICENSE for info.

Reasoning: I (Andy Balaam) generally prefer the AGPLv3 license, but Apache 2.0 is chosen for compatibility with Matrix Foundation libraries.

Code of conduct

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms.