Code Monkey home page Code Monkey logo

react-tidy's Introduction

React Tidy

A collection of atomic, independent, typed, tested and documented React custom hooks.

Bundle size Tests Status Coverage Status Rank Version MIT

Contents

What is React Tidy?

React Tidy is a library of utility custom hooks. It's like lodash for React hooks. The goal is to provide a collection of tiny hooks that solve common problems or make writing React components easier.

Features

To keep the library tidy, all included hooks are:

  • Atomic: only does one thing and does it well.
  • Independent: does not depend on any external library/configuration/context to work. Just import and call it.
  • Typed: can infer the type of its arguments and give the correct type in return.
  • Tested: has meaningful tests that cover all use cases.
  • Documented: has its own README describing the arguments, return and giving a usage example.

Installation

Install using npm

npm install react-tidy

Or using yarn

yarn add react-tidy

List of Custom Hooks

  • useIsMounted Avoid using/updating state of unmounted components.
  • useInstance Create an instance of any class and make your component react to its changes.
  • usePrevious Track previous values of a variable.
  • useRefresh Rerender your React component whenever you want.
  • useStorage Read and write items on browser storages the React way.

Contributing

You can contribute to this library in many ways, including:

  • Reporting bugs: Simply open an issue and describe the bug. Please include a code snippet to reproduce the bug, it really helps to solve the problem quickly.

  • Suggesting new hooks: If you have a common use case that you think worth having its own hook, open an issue and we will discuss it. Do you already have an implementation for it? Great, make a pull request and I will review it. Please make sure your code is consistent with the rest of the codebase and use Prettier and EditorConfig to format your files.

Those are just examples, any issue or pull request is welcome :)

Changelog

1.3.7 (April 17th 2023)

  • Update dev dependencies and Node version on Github actions.

1.3.6 (August 21th, 2022)

  • Update dev dependencies.

1.3.5 (April 2nd, 2022)

  • Update dev dependencies.

1.3.4 (March 3rd, 2022)

1.3.3 (February 27th, 2022)

  • Using parcel instead of tsdx and yarn instead of npm.

1.3.2 (November 13th, 2021)

  • Updating dev dependencies.

1.3.1 (May 27th, 2021)

  • Updating dev dependencies and improving docs.

1.3.0 (January 7th, 2021)

1.2.1 (January 2nd, 2021) Fix the bug of usePrevious not being exported.

1.2.0 (January 2nd, 2021) Add usePrevious hook.

1.1.1 (December 29, 2020) Upgrade dev dependencies.

1.1.0 (October 9, 2020) Make useStorage able to work on the server to enable SSR.

1.0.0 (September 23, 2020) The first official release containing 3 hooks useIsMounted, useRefresh and useStorage.

react-tidy's People

Contributors

bobby-rust avatar dependabot[bot] avatar goiblas avatar webneat avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

react-tidy's Issues

Can't import the named export 'useMemo' from non EcmaScript module (only default export is available)

"dependencies": {
"@date-io/date-fns": "^1.3.13",
"@emotion/styled": "^11.6.0",
"@hookform/resolvers": "^2.8.0",
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "^4.0.0-alpha.60",
"@material-ui/pickers": "^3.3.10",
"@mui-treasury/styles": "^1.13.1",
"@mui/icons-material": "^5.3.0",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"autosuggest-highlight": "^3.1.1",
"axios": "^0.21.1",
"clsx": "^1.1.1",
"date-fns": "^2.23.0",
"libphonenumber-js": "^1.9.24",
"material-design-icons": "^3.0.1",
"material-table": "^1.69.3",
"material-ui-dropzone": "^3.5.0",
"material-ui-popup-state": "^1.9.3",
"moment": "^2.29.1",
"notistack": "^1.0.10",
"react": "^17.0.2",
"react-big-calendar": "^0.36.1",
"react-datepicker": "^4.2.1",
"react-dom": "^17.0.2",
"react-hook-form": "^7.12.2",
"react-phone-input-material-ui": "^2.16.1",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"react-select": "^4.3.1",
"react-svg-radar-chart": "1.3.0",
"react-tidy": "^1.3.3",
"react-tooltip": "^4.2.21",
"react-wait": "^0.3.0",
"react-window": "^1.8.6",
"styled-components": "^5.3.0",
"survey-pdf": "^1.8.63",
"survey-react": "^1.8.58",
"sweetalert2": "^11.1.7",
"sweetalert2-react-content": "^4.1.1",
"valtio": "^1.1.3",
"web-vitals": "^1.0.1",
"yup": "^0.32.9",
"yup-phone": "^1.2.19"
},

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.