spectacle icon indicating copy to clipboard operation
spectacle copied to clipboard

export hooks

Open sneakers-the-rat opened this issue 3 years ago • 0 comments

Description

Export hooks! hooks are currently not exported from the main module. Attempting to import from within library fails, eg:

import { useSteps } from 'spectacle/lib/hooks/use-steps';

or making an alias in webpack like

resolve: {
    alias: {
      '@useSteps': path.resolve(__dirname, '../node_modules/spectacle/lib/hooks/use-steps.js')
    }

causes errors like:

Uncaught TypeError: _React$useContext is null
    useSteps use-steps.js:69

Exporting them seems to solve this. This is the only way that i have found (looking through the source) to add custom step logic to a slide (eg. stepping through a series of callbacks to animate an svg), and the comments around the hooks seem to indicate they are intended to be public, but if there's some other way i should do this lmk

Fixes # (issue): not necessarily a fix, but related to https://github.com/FormidableLabs/spectacle/issues/1009

Type of Change

  • [x] Bug fix (non-breaking change which fixes an issue)
  • [x] This change requires a documentation update - same as https://github.com/FormidableLabs/spectacle/issues/1009

How Has This Been Tested?

Doing something like this seems to create multiple steps, though i still haven't figured out exactly how to use them, following examples from Appear and CodePane

import { useSteps } from 'spectacle';

export default function SvgAnimator({
steps=[]
}){
  const numberOfSteps = steps.length;
  const { stepId, isActive, stepNum, placeholder } = useSteps(numberOfSteps, {stepIndex});
}

Checklist: (Feel free to delete this section upon completion)

  • [x] I have performed a self-review of my own code
  • [ ] I have commented my code, particularly in hard-to-understand areas - not really necessary? pretty clear whats going on?
  • [ ] I have made corresponding changes to the documentation - still unclear on how exactly hooks are intended to be used
  • [x] I have updated type definitions in index.d.ts for any breaking API changes - N/A
  • [x] My code follows the style guidelines of this project (I have run yarn format)
  • [ ] I have added tests that prove my fix is effective or that my feature works - still unsure how hooks are supposed to work
  • [x] New and existing unit tests pass locally with my changes (I have run yarn test)
  • [x] My changes generate no new warnings
  • [ ] Any dependent changes have been merged and published in downstream modules - not sure what this means!

sneakers-the-rat avatar May 04 '21 22:05 sneakers-the-rat