dozer644/rmwc-merge

Integration of RMWC library with UXPin Merge Technology.

React Material Web Components + UXPin Merge

Integration of RMWC library with UXPin Merge Technology.

About RMWC

RMWC is a collection of React Wrappers for official Google's material-components library. Created and maintained by James Friedman 🙌. To support RMWC please consider donation: https://opencollective.com/rmwc

About UXPin Merge

Merge is a revolutionary technology that lets users import (and keep in sync) coded React.js components from GIT repositories to UXPin editor. The imported components are 100% identical to components used by developers during the development process. It means that components are going to look and, function (interactions, data) identical to the real product experienced by the users.

UXPin is a leading code–based design platform.

How to use Merge integration with RMWC?

Merge is currently only available to selected beta users.

1. Fork this repository and clone it to your computer.
2. Install dependencies with npm install
3. Log in to your UXPin beta account (approved for alpha and beta tests by UXPin Inc.)
4. Start Merge dev environment with npm start

If you wish to push RMWC components to your UXPin account or set-up a continues integration with a CI server - contact UXPin on Merge alpha Slack community.

Supported components

Component	RMWC url	Status
Button	RMWC Buttons	✅ Full Support
Fab	RMWC Fabs	✅ Full Support
Icon Button	RMWC Icon Button	✅ Full Support
Card	RMWC Card	✅ Full Support
Chips	RMWC Chips	✅ Full Support
Data Tables	RMWC Data Tables	🔶 Partial Support. Sorting doesn't work.
Dialogs	RMWC Dialogs	🔻 Not Supported. Issues with absolutely positioned elements.
Drawers	RMWC Drawers	🔶 Partial Support. Full support, except absolutely positoned full page drawer.
Elevation	RMWC Elevation	✅ Full Support
Grid Lists	RMWC Grid Lists	🔶 Partial Support. TileContent are logging unknown errors.
Image Lists	RMWC Image Lists	✅ Full Support
Checkbox	RMWC Checkbox	✅ Full Support
Radio	RMWC Radio	✅ Full Support
Select Menus	RMWC Select Menus	✅ Full Support
Sliders	RMWC Select Menus	✅ Full Support
Switches	RMWC Switches	✅ Full Support
Text Fields	RMWC Switches	✅ Full Support. 🐜 Known small CSS bugs in outlined version.
Layout Grid	RMWC Switches	✅ Full Support
Linear Progress	RMWC Switches	✅ Full Support
Circular Progress	RMWC Switches	✅ Full Support
Lists	RMWC Switches	✅ Full Support
Menus	RMWC Switches	🔶 Partial Support. Only simple menu supported. Due to the state management requirement of full version.
Ripples	RMWC Switches	✅ Full Support
Snackbars	RMWC Switches	🔻 Not Supported. Issues with absolutely positioned elements.
Tabs	RMWC Switches	✅ Full Support
TopAppBar	RMWC Toolbars	✅ Full Support
Toolbars	RMWC Toolbars	✅ Full Support
Typography	RMWC Toolbars	✅ Full Support
Icons	RMWC Toolbars	✅ Full Support

Theming

To change the theme - modify theme.css file located in the ./src/Wrapper/ directory. ThemeProvider was unfortunately causing bugs with some of the components. The functionality is identitcal in both approaches.

Video