Vitre JS

Small behavior helpers for semantic Vitre UI components.

Vitre JS has no component skinning of its own. These docs pair it with Vitre CSS to show the combined Vitre UI experience.

Install

npm install vitre-js
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vitre-css/vitre.css">
<script type="module" src="https://cdn.jsdelivr.net/npm/vitre-js/vitre.js"></script>
import { Vitre, apply } from "vitre-js";

Alerts

Alerts use semantic roles for styling and short attributes for behavior.

Markup

Saved successfully. This status can be dismissed or time out. 
<div role="status" dismiss timeout="8">
  Saved successfully.
</div>

See the kitchen sink example for all currently supported alert patterns.