0.0.2-rc.1 • Published 2 years ago

@thaddeusjiang/react-hook-form v0.0.2-rc.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Welcome to @thaddeusjiang/react-hook-form šŸ‘‹

Out of box form input components via react-hook-form and daisyUI

Version Documentation Maintenance License: MIT Twitter: ThaddeusJiang

šŸ  Homepage

Demo

Features

  • Basic Inputs, e.g. Input, InputNumber, Select, Checkbox, Radio, Switch
  • Support react-hook-form v7 and daisyUI v2
  • Super easy to use

Install

npm install @thaddeusjiang/react-hook-form

Usage

export const Profile = () => {
  const formMethods = useForm();

  const onSubmit = (data) => console.debug(data);

  return (
    <FormProvider {...formMethods}>
      <form onSubmit={formMethods.handleSubmit(onSubmit)}>
        <Field name="firstName">
          <Input id="firstName" name="firstName" />
        </Field>
        <Field name="lastName">
          <Input id="lastName" name="lastName" />
        </Field>
        <Field name="age">
          <InputNumber id="age" name="age" />
        </Field>

        <button type="submit">Save</button>
      </form>
    </FormProvider>
  );
};

Show Case

More examples: storybook

Apply Styles

if you don't use Tailwind CSS

import { SortableList } from '@thaddeusjiang/react-hook-form';
import '@thaddeusjiang/react-hook-form/dist/index.css';
<SortableList ... />

if you use Tailwind CSS

import { SortableList } from '@thaddeusjiang/react-hook-form';
<SortableList ...>

modify tailwind.config.js

// tailwind.config.js
+ const path = require("path");
module.exports = {
  content: [
    "./src/**/*{js,ts,jsx,tsx}",
+    path.join(
+      require.resolve("@thaddeusjiang/react-hook-form"),
+      "../**/*.{js,ts,jsx,tsx}"
+    ),
  ],
  theme: {},
  plugins: [],
};

Run tests

npm run test

Author

šŸ‘¤ Thaddeus Jiang

šŸ¤ Contributing

Contributions, issues and feature requests are welcome!

Feel free to check issues page. You can also take a look at the contributing guide.

Show your support

Give a ā­ļø if this project helped you!

šŸ“ License

Copyright Ā© 2023 Thaddeus Jiang.

This project is MIT licensed.


This README was generated with ā¤ļø by readme-md-generator

0.0.2-rc.1

2 years ago

0.0.1

2 years ago