@vue-patternfly/core
v0.1.0-beta.27
Published
[![LICENSE](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)][link-LICENSE] [![NPM](https://img.shields.io/npm/v/@vue-patternfly/core.svg?style=flat-square)](https://npmjs.org/package/@vue-patternfly/core) [![Download](https://i
Downloads
140
Readme
Vue PatternFly
PatternFly 5 components for Vue 3.
The components are mostly a straight-forward port of the PatternFly 5 components to Vue 3 with some differences where it makes sense to improve ergonomics or add new features.
Common differences from patternfly-react
Component names are prefixed with pf-
This is done to conform to the custom element specification that requires component names to include an hyphen and to avoid conflicts with other components.
Boolean props "is/has" prefixes removed
This makes it easier to use the components and matches the naming convention of native elements. E.g. <pf-text-input disabled />
just like <input disabled>
instead of <pf-text-input is-disabled />
.
By doing this we can also omit to declare some props that are automatically inherited by the underlying native element.
Get started
Install the library with the package management tool of your choice:
npm install --save @vue-patternfly/core
# or
yarn add @vue-patternfly/core
Then you can import the components you need or use the whole library of components like this:
import '@patternfly/patternfly/patternfly.css';
import '@patternfly/patternfly/patternfly-addons.css';
// alternatively include them in your html as a <style> tag
import { createApp } from 'vue';
import VuePatternFly from '@vue-patternfly/core';
const app = createApp({
setup() {
return {};
},
});
app.use(VuePatternFly);
app.mount('#app');
Contributing
Please see CONTRIBUTING and CONDUCT for details.
Documentation
See the storybook for usage instructions and other documentation.
Security
If you discover any security related issues, please email [email protected] instead of using the issue tracker.
Credits
License
The MIT License (MIT). Please see License File for more information.