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.
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.
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.
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');Please see CONTRIBUTING and CONDUCT for details.
See the storybook for usage instructions and other documentation.
If you discover any security related issues, please email massimiliano.torromeo@gmail.com instead of using the issue tracker.
The MIT License (MIT). Please see License File for more information.