-
Notifications
You must be signed in to change notification settings - Fork 143
feat: #187 add gap property #188
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
Conversation
cla signed |
@mlecoq thanks for doing this! To isolate the changes of this PR to just be related to the gap property, I'll be making a PR upgrading this package's React Native version to 0.71. Once that's done, you'll be able to rebase and push only the changes specific to the gap property. The upgrade PR should be up within the next few days, thanks for your patience! |
39f47eb
to
fdf04f7
Compare
@mattfrances done ! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks good!
I know we haven't done this for the other properties since it is somewhat redundant to test that the individual props are passed to style
based on the true
flag in restyleFunction
. But I'd still really love if we could get some basic coverage at least for new props. That is there should be some test that fails before implementing the rest of the PR.
I suggest adding a test like this to createRestyleComponent.test.tsx
:
it('uses gap values from the theme', () => {
const {root} = render(
<ThemeProvider theme={theme}>
<Component gap="s" columnGap="s" rowGap="s" />
</ThemeProvider>,
);
expect(root.findByType(View).props).toStrictEqual({
style: [{gap: 8, columnGap: 8, rowGap: 8}],
});
});
We should also update the docs by adding the gap
props here in README
.
Additionally, let's also add an entry into CHANGELOG
🙏
Ok I'm on it |
fdf04f7
to
463ddae
Compare
@fortmarek done ! |
@mlecoq could you also update the |
463ddae
to
6e3ceb5
Compare
I have added gap properties to the list + updated an example where |
when will be this update released please? |
You can use a patch with patch-package if you need it now You just have to add 3 lines in SpacingProperties in file src/restyleFunctions.ts
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks a lot for your contribution ❤️ Let's ship it!
We'll do a release soon with this one 🙂
rG: 'rowGap', | ||
cG: 'columnGap', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wasn't it better to keep the shorthand version consistent? rg
and cg
instead of rG
and cG
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You're right, I don't use shorthands and didn't notice they are in lowercase
@matinzd I will make a new PR to fix my mistake
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
see #218
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks! That would be great :)
@fortmarek please any idea about adding : the cornerCurve prop ? added in RN 0.71.X |
borderCurve you mean ? |
@mlecoq yes hhh |
I'll make a PR |
it's missing in react native types, have to make a PR on types repo first |
yes, it works only on iOS also I think |
Resolves #187
I have upgraded the lib to support new gap property of RN 0.71
I had to make some adjustments on types to fix typescript issues