rjsf-mantine-theme
/
0.4.1-alpha.0
rjsf-mantine-theme 0.4.1-alpha.0
Install from the command line:
Learn more about npm packages
$ npm install @aokiapp/rjsf-mantine-theme@0.4.1-alpha.0
Install via package.json:
"@aokiapp/rjsf-mantine-theme": "0.4.1-alpha.0"
About this version
This package provides a Mantine theme for the React JSON Schema Form (rjsf) library.
We have a playgroud where you can see the theme in action:
npm install
npm run build
cd packages/playground
npm run start
You can install the package:
npm:
npm install @mantine/core@7 @mantine/dates@7 @mantine/hooks@7 @rjsf/core @tabler/icons-react dayjs react @aokiapp/rjsf-mantine-theme
yarn:
yarn add @mantine/core@7 @mantine/dates@7 @mantine/hooks@7 @rjsf/core @tabler/icons-react dayjs react @aokiapp/rjsf-mantine-theme
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:
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.
This derivative is based on the @pkalisiewicz's previous work.
This repository is built using RJSF (React JSON Schema Form).
We appreciate the hard work and dedication of the RJSF team and contributors in creating and maintaining this valuable tool.
Apache-2.0