feat(#246): Add onChange and initialSlideIndex props to CH.Slideshow

[brianespinosa]

Resolves #246

For the proposed use case, it is not enough to only initialize the Slideshow component with a starting slide. There also needed to be a way to expose the current slide so that someone could use that value to set in the current URL.

• Adds an initialSlideIndex prop which allows initializing CH.Slideshow on a specific slide

  • Includes a new useInitialState hook which is used to make sure changing the initialSlideIndex after mount would not control the component
  • Includes a check to make sure the initial slide does not get set greater than the max slides in the MDX file
  • Includes MDX example of this prop in use

• Adds an onChange function to the CH.Slideshow component which will get called every time the internal Slideshow state changes, and will return the internal state object

  • NOTE: If we wanted to only return the current slide and not the whole state object, I could make those changes to limit what we are exposing
  • NOTE: Since state changes do not happen from only one event, I did not think it made sense to also try to return different React synthetic events from the onChange in addition to the state data

    Version

Published prerelease version: v0.7.3-next.2

Changelog

#### 🐛 Bug Fix - `@code-hike/mdx` - feat(#246): Add onChange and initialSlideIndex props to CH.Slideshow [#248](https://github.com/code-hike/codehike/pull/248) ([@brianespinosa](https://github.com/brianespinosa)) - Fix typescript module resolution [#249](https://github.com/code-hike/codehike/pull/249) ([@pomber](https://github.com/pomber)) - feat(244): Allow Slideshow controls to autoFocus [#245](https://github.com/code-hike/codehike/pull/245) ([@brianespinosa](https://github.com/brianespinosa) [@pomber](https://github.com/pomber)) #### ⚠️ Pushed to `next` - Update bundle_analysis.yml ([@pomber](https://github.com/pomber)) #### Authors: 2 - Brian Espinosa ([@brianespinosa](https://github.com/brianespinosa)) - Rodrigo Pombo ([@pomber](https://github.com/pomber))

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
chtest	✅ Ready (Inspect)	Visit Preview	Jul 29, 2022 at 5:52PM (UTC)
playground	✅ Ready (Inspect)	Visit Preview	Jul 29, 2022 at 5:52PM (UTC)

[pomber]

Thanks a lot for the PRs @brianespinosa! I'll take a look later.

One small thing: can you disable the thing that reorders the props for future PRs? It makes the review harder.

[brianespinosa]

One small thing: can you disable the thing that reorders the props for future PRs? It makes the review harder.

Sorry... that's actually me and my OCD sorting alphabetically by habit. I'll make sure not to do that on other PRs.

Is there a logical method you're using to sort these props and objects so I can follow that in the future?

[pomber]

Is there a logical method you're using to sort these props and objects so I can follow that in the future?

chaos

[github-actions[bot]]

📦 Next.js Bundle Analysis

This analysis was generated by the next.js bundle analysis action 🤖

This PR introduced no changes to the javascript bundle 🙌

[pomber]

Looks good, thank you!

[github-actions[bot]]

:rocket: PR was released in v0.7.3 :rocket: