Open forrest-akin opened 4 years ago
@kale-stew This might be a related thing to #870 in that both Appear
and Stepper
are similarly written, and used here: https://github.com/FormidableLabs/spectacle/blob/88e635bae3a00eda9fd35bc77acb9d7ffe5a7b74/src/components/deck/index.js#L143-L144
My workaround in the meantime is to map a list of slide metadata into Slide children of Deck
const Presentation =
( { theme , template , slides } ) => (
<Deck theme={ theme } template={ template }>
{ slides.map(
( { heading , code , steps } ) => (
<Slide transitionEffect="slide">
<Heading> { heading } </Heading>
<Stepper defaultValue={ [] } values={ steps }>
{ ( [ start , end , size ] ) => (
<CodePane highlightStart={ start } highlightEnd={ end } fontSize={ size }>
{ code }
</CodePane> ) }
</Stepper>
</Slide> ) ) }
</Deck> )
Documenting my findings after digging into this a little deeper:
name
is accessible, but its props are not.undefined
. Fragment-wrapped Slides aren't making it into the Deck whatsoever.I'm thinking our problem is going to be buried a bit deeper in the DeckContext or elsewhere. Something about imported slides just doesn't mesh well with our methods of searching children
.
Stepper also seems to not work when it is the only child in a slide like:
<Slide>
<Stepper values={[1, 2, 3]}>{(value, step) => <div>{step}</div>}</Stepper>
</Slide>
It calls the function only once with value = undefined
and step = -1
.
It starts working when I put a sibling either before or after Stepper though. ¯_(ツ)_/¯
@m11m I can confirm this behavior.
Stepper also seems to not work when it is the only child in a slide like:
<Slide> <Stepper values={[1, 2, 3]}>{(value, step) => <div>{step}</div>}</Stepper> </Slide>
It calls the function only once with
value = undefined
andstep = -1
.It starts working when I put a sibling either before or after Stepper though. ¯(ツ)/¯
I can also confirm this behaviour. It appears that if you put any element or even a React.Fragment
as a sibling, the Stepper
component is then somehow happy and works as expected. Weird.
react : 6.13.1 spectacle : 6.0.1
I'm trying Spectacle for the first time and ran into this issue Various Issues w/ Imported Slides #678, which mentions it should be resolved by the
Slide
rewrite. I believe the rewrite has since been released, but the issue is not resolved so I'd like to reopen. Specifically,Slide
s are discarded if they are not inlined children ofDeck
. The suggested workaround to wrapSlide
contents inReact.Fragment
allows theSlide
to render, but causes nestedStepper
s to ignore their steps and immediately proceed to the nextSlide
.Please see this CodeSandbox I've prepared demonstrating the issues I've mentioned.