feat: add render prop#9918
Conversation
size-limit report 📦
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #9918 +/- ##
=======================================
Coverage 95.22% 95.22%
=======================================
Files 462 462
Lines 12518 12524 +6
Branches 4479 4480 +1
=======================================
+ Hits 11920 11926 +6
Misses 598 598
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
👀 Docs deployed
📦 Package ✅yarn add @vkontakte/vkui@https://development.s3.prodcloud.vk.team/pull/9918/d19c3d350f22aa088ea3a049e3313c70a13adb4f/pkg/@vkontakte/vkui/_pkg.tgzCommit d19c3d3 |
994ae8b to
a8cac1d
Compare
e2e tests |
| }; | ||
|
|
||
| if (render) { | ||
| return <RenderRootComponent render={render} getRootRef={getRootRef} {...resolvedProps} />; |
There was a problem hiding this comment.
А точно нужно дополнительный узел в дереве создавать? Нельзя просто?
if (render) return render({ ...resolvedProps, getRootRef });
There was a problem hiding this comment.
Нельзя, так как ругается компилятор
There was a problem hiding this comment.
Нашёл несколько моментов, которые стоит поправить перед мержем:
-
ContentCardсейчас наследуетrenderчерезTappableOmitProps, ноComponentу него применяется к внешнемуCard, аrenderпроваливается во внутреннийTappable. Получается, чтоrenderне является аналогомComponentдля этого компонента. Нужно либо передаватьrenderво внешнийCard, либо явно исключить его из props. -
Часть компонентов, которые являются обёртками над
RootComponent, типизируются черезHTMLAttributesWithRootRef & HasComponent, поэтомуrenderв их публичном API не появляется, хотя технически они его уже могут прокинуть вRootComponent. Нужно либоHasComponentрасширить типомrender, либо по аналогии создать типHasRenderи подключить ручкамиCardCardGridCardScrollChipFormItemTopGroupContainerGroupExpandedContent
a8cac1d to
adb290d
Compare
adb290d to
9c0cd5f
Compare
| }; | ||
|
|
||
| if (render) { | ||
| return <RenderRootComponent render={render} getRootRef={getRootRef} {...resolvedProps} />; |
There was a problem hiding this comment.
Нашёл несколько моментов, которые стоит поправить перед мержем:
-
ContentCardсейчас наследуетrenderчерезTappableOmitProps, ноComponentу него применяется к внешнемуCard, аrenderпроваливается во внутреннийTappable. Получается, чтоrenderне является аналогомComponentдля этого компонента. Нужно либо передаватьrenderво внешнийCard, либо явно исключить его из props. -
Часть компонентов, которые являются обёртками над
RootComponent, типизируются черезHTMLAttributesWithRootRef & HasComponent, поэтомуrenderв их публичном API не появляется, хотя технически они его уже могут прокинуть вRootComponent. Нужно либоHasComponentрасширить типомrender, либо по аналогии создать типHasRenderи подключить ручкамиCardCardGridCardScrollChipFormItemTopGroupContainerGroupExpandedContent
| extends HasRootRef<HTMLDivElement>, | ||
| HasComponent, | ||
| Omit<TappableOmitProps, 'getRootRef' | 'crossOrigin' | 'title' | 'src'>, | ||
| Omit<TappableOmitProps, 'getRootRef' | 'crossOrigin' | 'title' | 'src' | 'render'>, |
There was a problem hiding this comment.
а почему тут удаляем? Component ведь можно передать
e2e-тестыДизайн-ревьюОписание
Добавляем свойство render для компонентов
Release notes
Улучшения
renderна заменуComponent