Warp-ds Elements
Welcome to @warp-ds/elements,
a collection of Web Components built with Lit to be used to build interfaces based on the Warp Design System.
This repository is maintained by the Warp Core Team
and is home to the @warp-ds/vue library.
How to contribute
If you'd like to contribute to @warp-ds/elements
,
start by reviewing the contributing guidelines.
How to use
Installation
Install by using npm/pnpm or by adding a script link:
Install using npm
npm install @warp-ds/elements
Install using pnpm
pnpm add @warp-ds/elements
Using a direct link to Eik
<script src="https://assets.finn.no/pkg/@warp-ds/elements/v1"></script>
Import components
This project builds both the whole Elements package and separate component packages that are published to EIK, making it possible for the user to choose to either import all of the components:
import '@warp-ds/elements';
or a specific component:
import '@warp-ds/elements/components/toast';
Documentation
For information on the components available in the package and how to use them,
see the Warp Design System documentation.
Releases
This project is continuously published to NPM and Eik using a next
tag (e.g. 1.1.0-next.1
).
Anyone needing to use the latest changes of this package can point to the next
version while waiting for the stable release.
Changelog
Detailed changes for each release can be found in the CHANGELOG file.
How to test component-classes locally
It is possible to test changes that have been made to component-classes from the @warp-ds/css package but that has not yet been published to Eik. You simply need to link the @warp-ds/css
package in this repository and add @unocss-placeholder
inside the static styles of the component that you want to test:
static styles = [
css`
@unocss-placeholder
`,
]
Run pnpm dev
to see the linked styles in action.
Once you have tested it locally, make sure to remove the @unocss-placeholder
from the static styles before pushing any changes to the repository.
License
@warp-ds/elements is available under the Apache-2.0 software license.