vue-material-adapter is an integration of
Material Components
for Vue.js which follows the best practices
recommended by Google:
Using Foundations and Adapters
This project aims to find the right balance between ease of use and customization while sticking to the Vue Spirit (approachable, versatile, and performant)
v0.14.0 - This release changes how the mcw-list component is structured in order to support the select component properly, note this is a BREAKING CHANGE.
There are now examples of using vue-material-adapter both as a basic-global and a basic-webpack project examples
v0.13.0 - This release now uses material-components-web v4.0.0 so there are significant changes in how several of the packages work and are structured.
The most notable change is with the mcw-select which no longer uses the native select but renders what was previously known as the "enhanced select". See Material Components for a list of all the changes, and review the Documentation & Demo for working examples of how to structure the markup for Vue.
This project is under active development. The long term goal is to allow easy integration with Vue but to allow maximum flexibility in structuring the markup with an emphasis of being as close to the plain material-components-web documented structure as feasible. There are helper components defined to aid
simple use, but they can constrain the markup sometimes. As the material-components-web library matures the goal is to avoid simplistic helper elements such as those that just add required classes, for example, as they risk needing to understand how to control the helpers when it is in practice simpler to control the underlying markup directly.
Do not hesitate to open an issue on GitHub
Each MDCWeb component is mapped to a single vue plugin
Install dependencies
npm install
to build everything
npm run build
npm run build:demo
to run demo
npm run dev
This project is based on a fork of the successful vue-mdc-adapter project.