npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

material-ui-forms

v2.0.3

Published

A library that makes using material ui components easier and quick to use. Contains common use cases.

Downloads

61

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

nicholas_jonesnicholas_jones

Keywords

material-uireacthooksformsinput

Readme

material-ui-forms

npm npm GitHub repo size npm bundle size GitHub top language npm

Peer Dependencies

npm peer dependency version npm peer dependency version npm peer dependency version npm peer dependency version npm peer dependency version npm peer dependency version

Dependencies

npm peer dependency version

About The Project

This projects goal is to make using material-ui to create webforms easy, fast, and fully featured. The features include:

  • The ability to add locks to the form without much effort. Use case being role management, content management or similar.
  • The ability to save user progress, using local storage, allowing for a quick return.
  • The ability to print the forms with automatic page breaks conveniencing both the developer and end user.
  • Generic typeing to reduce coupling between form logic and controllers (api calls).
  • Simplification of complex components such as AutoComplete to reduce the amount of configuration is basic use cases.
  • Compiling helper functions, option lists, and hooks commonly used in material UI forms.
  • ...more descriptions in future releases

Recent Changes

There are not 2 new ways to use material-ui forms making it more simple with much less configuration.

    1. FormViewAuto -> Check out the code in the examples project inside the repo. It's located at http://localhost:3000/views/form-view-auto (view), /src/pages/views/form-view-auto.tsx (code)
    1. Added Helper functions for Simple Forms. See http://localhost:3000/simple-form (view), //src/components/SimpleForm.tsx (code)
    1. Removed all Bootstrap from the application
    1. Decouple react-to-print as a peer dependency. Thinking about using a PDF Generator instead.

Upcoming Changes

    1. Continuing the simplification and decoupling of parts of this project (as always)
    1. More Examples, full hosting of material-ui-forms of the example application, and documentation
    1. More Customization, Adding more ways to customize the FormView and FormViewAuto through overloading the props with some default templates
    1. Decouple nextJs router from material-ui-forms allowing for e.g. React Router Dom or no default

Built With

Getting Started

To get started you'll need to Create a New React App. I recommend using TypeScript to take full advantage of the types and interfaces defined in material-ui-forms but, it's not neccessary. For TypeScript create a project --template typescript.

Prerequisites

This project is still in development and requires the following peer dependencies to use.

"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.56",
"react": "^16.13.1",
"react-dom": "^17.0.1",
"react-to-print": "^2.11.0",
"next": "^9.5.5"

The next (NextJs) dependency will be removed in a future release to allow developers to specify their router.

Installation

npm install material-ui-forms

Usage

For more examples, please refer to the Documentation

Roadmap

See the open issues for a list of proposed features (and known issues).

Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/HelpfulFeature)
  3. Commit your Changes (git commit -m 'Add a HelpfulFeature')
  4. Push to the Branch (git push origin feature/HelpfulFeature)
  5. Open a Pull Request

License

Distributed under the MIT License. See License for more information.

Contact

Acknowledgements