Atrium

A collection of framework agnostic and functional web-components and templates for building Websites.

Docs · Issues · Packages

Use in other projects

See Usage in the docs for instructions.

Packages

@sv/components

This package contains all component templates and the cli for use.

@sv/elements

The elements package distributes all the custom-elements that are used in the components or external projects. All elements share the same dependencies from the packages/elements/package.json.

Development

Prerequisites

See ./.mise.toml for tools and versions used in this project.

• task
• bun

It is recomended to use mise to automatically manage these tools.

Getting Started

See all available commands:

task

Run dev server for docs website:

task docs

Development

Watch and build packages:

task dev

Link packages from local repository in external project:

cd <project>
pnpm link <path_to_atrium>/mono/packages/<package_name>

This will link the local package to the project. To unlink the package, run:

pnpm unlink <package_name>

Building elements

Since all elements are written in TypeScript, they need to be compiled to JavaScript. Most of the elements share the same build system. We use tsup to generate light weight bundles.

The tsup configuration is located in the package.json of each element.

Publishing packages

This project uses Knope for creating releases. Packages are automatically versioned using Conventional commits or Changeset.

Example commit to bump the elements package by a minor version when merged into main:

git commit -m "feat(elements): some change notes"

Scopes for each package are define in ./knope.toml. Commits without scope will version all packages.

To create a new version of multiple packages at once, run task version and follow the instructions of the cli to create a Changeset.

After all changes are committed and merged into main, the CI will automatically version and publish the package(s), as well as build and deployed docs to gitlab pages.