Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ant Design ConfigProvider does not override classes #2838

Closed
3 of 4 tasks
ferretwithaberet opened this issue Apr 28, 2022 · 5 comments
Closed
3 of 4 tasks

Ant Design ConfigProvider does not override classes #2838

ferretwithaberet opened this issue Apr 28, 2022 · 5 comments
Assignees
Labels
antd antd related theme issue awaiting response bug help wanted needs reproducible example Missing a link to a reproduction in the playground, CodeSandbox, JSFiddle, etc.

Comments

@ferretwithaberet
Copy link

ferretwithaberet commented Apr 28, 2022

Prerequisites

What theme are you using?

antd

Version

4.1.1

Current Behavior

Ant Design's ConfigProvider does not override classes of the components used by react-jsonschema-form using prefixCls prop.

Expected Behavior

Ant Design's ConfigProvider does override classes of the components used by react-jsonschema-form using prefixCls prop.

Steps To Reproduce

  1. Create react app.
  2. Install @rjsf/antd and it's perequisites.
  3. Add ConfigProvider to App.jsx with a value for the prefixCls prop.
  4. Place the Form somewhere inside ConfigProvider.
  5. Check if classes used by ant design are prefixed with the value of prefixCls.

Environment

- OS: EndeavourOS Linux x86_64 (Kernel 5.17.4-arch1-1 )
- Node: 16.14.0
- npm: 8.3.1

Anything else?

No response

@ferretwithaberet ferretwithaberet added bug needs triage Initial label given, to be assigned correct labels and assigned labels Apr 28, 2022
@jacqueswho jacqueswho added antd antd related theme issue and removed needs triage Initial label given, to be assigned correct labels and assigned labels Apr 28, 2022
@heath-freenome
Copy link
Member

@ferretwithaberet Can you confirm whether this is a problem with the 5.x version? Also, providing a codesandbox.io or JSFiddle with a working example would be most helpful

@heath-freenome heath-freenome added awaiting response needs reproducible example Missing a link to a reproduction in the playground, CodeSandbox, JSFiddle, etc. labels Jan 19, 2023
@ferretwithaberet
Copy link
Author

@ferretwithaberet Can you confirm whether this is a problem with the 5.x version?

Seems to work with v5.x.

@miguelgrc
Copy link

Hi, I still have this issue with the latest version of @rjsf/antd. Here is a simple example to demonstrate.

Notice how the prefixCls doesn't apply to the input added by rjsf while it does for the second input, which is a normal antd input. Also, the colorPrimary makes the second input have a red border on focus while the first input has the default light blue border.

Notice also how the rjsf-generated elements have the .css-dev-only-do-not-override-nllxry class while the other input has .css-dev-only-do-not-override-e4x42x. The hashes are different, which explains why the styles are not being applied to one of them.

Could you please have a look? Thank you.

@dllnaoki
Copy link

have you solved this problem? @miguelgrc

@miguelgrc
Copy link

@dllnaoki, sorry for the late response. It seems to have been fixed in @rjsf/antd v5.18.0. I believe by #4132

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
antd antd related theme issue awaiting response bug help wanted needs reproducible example Missing a link to a reproduction in the playground, CodeSandbox, JSFiddle, etc.
Projects
None yet
Development

No branches or pull requests

6 participants