search

eBay / nice-form-react

A meta based form builder for React.
http://opensource.ebay.com/nice-form-react/
MIT License
33 stars 3 forks source link

The examples aren't self-contained #4

Open leroydev opened 6 months ago

leroydev commented 6 months ago

I tried copying over the code from the antd Form List, added the necessary dependencies and ran into this issue:

config.tsx:62 Uncaught Error: Widget 'form-list' not defined. Did you define it?
    at Object.getWidgetDef (config.tsx:62:15)
    at NiceForm.tsx:65:26
    at Array.map (<anonymous>)
    at NiceForm (NiceForm.tsx:24:25)
    at renderWithHooks (react-dom.development.js:16305:18)
    at mountIndeterminateComponent (react-dom.development.js:20074:13)
    at beginWork (react-dom.development.js:21587:16)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:4164:14)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:16)
    at invokeGuardedCallback (react-dom.development.js:4277:31)

By copying this over from packages/examples-antd/src/main.tsx into the example code, it does work:

import { config as niceFormConfig } from '@ebay/nice-form-react';
import antdAdapter from '@ebay/nice-form-react/adapters/antdAdapter';

niceFormConfig.addAdapter(antdAdapter);

Because antdAdapter defines the form-list widget. This is most likely the same for the formik form-list, but might happen in even more files.

To make it easier for developers to play around with nice-form-react, it'd be better if the example code is self-contained.

leroydev commented 6 months ago

I'll see if I can come up with a solution for this.

Due to all examples being imported non lazily from App.tsx, it would seem like example B that is missing the adapter works after example A has been opened, due to the import of example A already having added the adapter. That way it isn't easy to spot where the adapter needs to be added and where it is unnecessary. I'll try and refactor it so App.tsx lazily imports the examples.