question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

FAB.Group actions accepts a IconSource, not only a string

See original GitHub issue

Environment

"react-native-paper": "2.15.0" and Typescript

Description

I was looking at the docs to see if i could use a custom icon source on the FAB.Group actions, but the type for the actions icon is specified as a string: https://github.com/callstack/react-native-paper/blob/5935fb4c8010f884b407a91bef30a472dafe58a8/src/components/FAB/FABGroup.js#L32-L39

But the signature is wrong, looking at the FAB.Group source, the action list actually can receive a IconSource just like the normal FAB: https://github.com/callstack/react-native-paper/blob/5935fb4c8010f884b407a91bef30a472dafe58a8/src/components/FAB/FABGroup.js#L283-L287

Reproducible Demo

I think that just a simple component using typescript and a icon source on the actions will give you the compile error:


const MyComponent = () => <Portal>
                <FAB.Group
                    open={ true }
                    icon={ props => <Icon name='add' { ...props }/> }
                    actions={ [
                        {
                            icon: props => <Icon name='add' { ...props }/>,
                            label: 'Enviar',
                            onPress: () => console.log('Pressed add')
                        }
                    ] }
                    onStateChange={ () => {  } }
                    onPress={ () => {  } }
                />
            </Portal>

I managed to make my code compile making a cast (as unknown as FABGroupAction[]) on the list before using it on the component

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
Taym95commented, May 8, 2019

I would like to fix this issue!

1reaction
satya164commented, May 8, 2019

Yes, it supports IconSource. PR welcome to fix it.

Read more comments on GitHub >

github_iconTop Results From Across the Web

FAB.Group · React Native Paper
FAB.Group. A component to display a stack of FABs with related actions in a speed dial. ... Type: Array<{ icon: IconSource; label?: string;...
Read more >
React Native Paper FAB.Group Icon stays on screen after ...
Im hoping to be able to have the FAB be bound to one screen. I am not sure ... I can understand class...
Read more >
Demo Template: Annotation of Images with crowd-bounding-box
The templates represent some of the most common tasks and provide a sample to work from as you create your customized labeling task's...
Read more >
Untitled
692 union labor works links, Nss activities in school, ... Blouse tops 2016, Willow tree dental morgantown wv, Strongest group eng sub, Tennis...
Read more >
Implementation of controls in DX API - Pega
(Any property beyond the first three is not part of the JSON response.) ... not contain the data for the Set as Floating...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found