@aokiapp/rjsf-mantine-theme
Version:
Mantine theme, fields and widgets for react-jsonschema-form
76 lines (51 loc) • 2.05 kB
Markdown
# /rjsf-mantine-theme
This package provides a Mantine theme for the React JSON Schema Form (rjsf) library.
## Demo
We have a playgroud where you can see the theme in action:
```bash
npm install
npm run build
cd packages/playground
npm run start
```
## Installation
You can install the package:
npm:
```bash
npm install /core@7 @mantine/dates@7 /hooks@7 @rjsf/core /icons-react dayjs react @aokiapp/rjsf-mantine-theme
```
yarn:
```bash
yarn add /core@7 @mantine/dates@7 /hooks@7 @rjsf/core /icons-react dayjs react @aokiapp/rjsf-mantine-theme
```
## Usage
```js
import { MantineProvider } from '@mantine/core';
import Form from '@aokiapp/rjsf-mantine-theme';
import '@mantine/core/styles.css';
import '@mantine/dates/styles.css'; // add only if you use MantineDateWidget
import '@mantine/dropzone/styles.css'; // add only if you use mantine-corparate and FileWidget
render(
<MantineProvider>
<Form schema={schema} uiSchema={uiSchema} />
</MantineProvider>,
document.getElementById('app'),
);
```
or with a custom theme:
```js
import { withTheme } from '@rjsf/core';
import { Theme as MantineTheme } from '@aokiapp/rjsf-mantine-theme';
import '@mantine/core/styles.css';
import '@mantine/dates/styles.css'; // if you use MantineDateWidget
import '@mantine/dropzone/styles.css'; // if you use mantine-corparate and FileWidget
// Make modifications to the theme with your own fields and widgets
const Form = withTheme(MantineTheme);
```
For usage of RJSF, please refer the [official documentation](https://rjsf-team.github.io/react-jsonschema-form/docs/).
## Credits
This derivative is based on the ['s previous work](https://github.com/pkalisiewicz/react-jsonschema-form/tree/rc5.7.0).
This repository is built using [RJSF (React JSON Schema Form)](https://github.com/rjsf-team/react-jsonschema-form).
We appreciate the hard work and dedication of the RJSF team and contributors in creating and maintaining this valuable tool.
## License
Apache-2.0