@zairakai/vue-components

@zairakai/vue-components

[][license]

Collection of reusable Vue 3 components — TypeScript, v-model, WAI-ARIA.

Documentation: vue-components-46b2bb.gitlab.io

Install

npm install @zairakai/vue-components

Usage

Plugin

import { createApp } from 'vue'
import VueComponentsPlugin from '@zairakai/vue-components'

const app = createApp(App)
app.use(VueComponentsPlugin)
app.mount('#app')

With a custom prefix:

app.use(VueComponentsPlugin, { prefix: 'Zk' })
// ZkFormInput, ZkLayoutContainer, etc.

Import by category

import { FormInput, FormButton } from '@zairakai/vue-components/Form'
import { LayoutContainer, LayoutRow } from '@zairakai/vue-components/Layout'
import { ContentHeading, ContentParagraph } from '@zairakai/vue-components/Content'
import { MediaImage, MediaVideo } from '@zairakai/vue-components/Medias'

Documentation

The documentation site has a page for every component (description, usage, props, events and slots, generated from the source), the guides and the theming contract. Build it with cd docs && npm ci && npm run dev. It is published with GitLab Pages from main, with the documentation of every released version (selector at the top right, next is main) and the live examples styled with @zairakai/mithril-scss.

The components ship no style: they give the markup, the WAI-ARIA, the keyboard and the behaviour, and use the web platform first (native dialog, Popover API, details name, progress, search, real links) with a script fallback when the browser lacks a feature. See docs/theming.md and docs/browser-support.md.

Categories

Development

npm install
make ci              # full CI validation
make test-coverage   # run vitest with coverage

See CONTRIBUTING.md for the full development workflow.

Getting Help

[][license] [][security]

Made with ❤️ by Zairakai

Statistics