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

Provide an option to disable props filtering #968

Closed
Chen-jj opened this issue May 9, 2022 · 5 comments
Closed

Provide an option to disable props filtering #968

Chen-jj opened this issue May 9, 2022 · 5 comments
Labels
enhancement: proposal 💬 Improvement of current behaviour that needs to be discussed needs: triage 🏷 Issue needs to be checked and prioritized

Comments

@Chen-jj
Copy link

Chen-jj commented May 9, 2022

Describe the enhancement

Provide an option to disable props filtering.

Motivation

Now, there is a filter for props:

https://github.com/callstack/linaria/blob/master/packages/react/src/styled.ts#L111-L120

But the conditions for checking whether an element is HTML tag or custom element are not satisfy with our cases.

We have some element with names like: ViewTextInput from WeChat MiniApp,and both of them have some special attributes like: hoverClass.Once linaria filter these attributes, then it will not work correctly.

WeChat MiniApp' docs

Possible implementations

// Check if it's an HTML tag and not a custom element
if (options.enablePropsFilter && typeof component === 'string' && component.indexOf('-') === -1) {
  // ...
} else {
  filteredProps = rest;
}
@Chen-jj Chen-jj added the enhancement: proposal 💬 Improvement of current behaviour that needs to be discussed label May 9, 2022
@github-actions github-actions bot added the needs: triage 🏷 Issue needs to be checked and prioritized label May 9, 2022
@Anber
Copy link
Collaborator

Anber commented May 13, 2022

Hi @Chen-jj!
Unfortunately, there is no clear way to pass such an option to styled. However, there are no built-in components that start with a capital letter, so will it be enough for you if I add a check that will ignore all components that start with a capital?

@Anber
Copy link
Collaborator

Anber commented May 13, 2022

Fixed in #970

@Anber Anber closed this as completed May 13, 2022
@Chen-jj
Copy link
Author

Chen-jj commented May 16, 2022

@Anber Thanks for fixing it.However, we use styled('view') in that case, because it refers to a built-in component with React.createElement.According to your PR, we can use styled('View'), but could you please change to lowercase for us before passing to React.createElement?Otherwise, React will refers to a user-defined component and throw an error.

@Anber
Copy link
Collaborator

Anber commented May 29, 2022

@Chen-jj Unfortunately, it seems like there is no way to detect whether or not passed argument is a default tag or a custom component. According to the specs, names of custom components must have a hyphen, so View and especially view are just wrong names and we cannot support them.

@Anber
Copy link
Collaborator

Anber commented May 29, 2022

Ok, I have an idea, but I need some time to implement it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement: proposal 💬 Improvement of current behaviour that needs to be discussed needs: triage 🏷 Issue needs to be checked and prioritized
Projects
None yet
Development

No branches or pull requests

2 participants