ayo/status-indicator
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: update readme on how to use import maps

Browse source
This commit is contained in:
ayo 2026-05-14 09:13:32 +02:00
parent 32e1d3ab3b
commit 2a61caa922
1 changed files with 26 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
README.md
View file

@ -28,6 +28,32 @@ pnpm add web-component-base @ayo-run/status-indicator
## Usage
Without a bundler that resolves `node_module` imports for you, you can use [import
maps](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/script/type/importmap):
```html
<html>
<head>
<script type="importmap">
{
"imports": {
"web-component-base": "./node_modules/web-component-base/dist/index.js",
"status-indicator": "./node_modules/@ayo-run/status-indicator/dist/status-indicator.js"
}
}
</script>
<script type="module">
import StatusIndicator from "status-indicator";
</script>
</head>
<body>
<!-- you can use the status-indicator component now -->
</body>
</html>
```
## Attributes
### 1. `status` attribute
To indicate the status that determines the color of the circle, set the `status` attribute of the `status-indicator` component to any of the following values: `positive`, `negative`, `active`, or `intermediary`.