Components for the web built with Patternfly 💗
Install patternfly-webcomponents via NPM
npm install --save patternfly-webcomponents
Load the components you need alongside Patternfly CSS
<script src="node_modules/patternfly-webcomponents/dist/js/pf-alert.js"></script> <pf-alert type="success"> Oh snap! There's something going on here. </pf-alert>
Patternfly web components provides a set of core web component implementations for the Patternfly project.
Web components promote base level abstractions for component presentation and behavior based on browser standards. This allows for better encapsulation and interoperability of individual HTML elements. It also encourages more semantic HTML which expresses the true meaning of each HTML element.
Web components are an evolving feature set, and some browsers are still in the process of implementing the new web component standards. However, web component polyfills should enable you to start using web components in modern browsers today. With Custom Elements and HTML Templates currently having the widest browser support, we have chosen to focus on these standards first in our patternfly-webcomponent implementations. We've also chosen to write our web components using ES6 Modules for current browser and framework support, but our long term plan is to adopt and support the Shadow DOM and HTML Import specifications as well.