molefrog / presa Goto Github PK

Need to discuss the interface first

A fragment is a piece of the slide that's only visible via an additional click on the slide. For example:

import { Fragment } from 'presa'
import { H1, H2 } from 'presa/blocks'

<Slide>
   <H1>This appears by default...</H1>
   <Fragment index={0}><H2>This appears next...</H2></Fragment>
   <Fragment index={1}><H2>This appears afterwards.</H2></Fragment>
</Slide>

Fragments are indexed in the order of appearance by default (is it possible in React?). If hard to implement — make index prop mandatory.

Demo is coming...

This one is to increase the DX (development experience). We use Prettier in the project, so would be nice to run it against all the files in the project automatically on commit.

Not everyone has Prettier integrated in their IDEs so implementing this would increase the code consistency a lot.

Would be super cool to make the deck in 5-10 slides about the Presa itself and use it as a project page. Check out how others do that:

• https://revealjs.com/#/1
• https://github.com/FormidableLabs/spectacle

Possible structure:

• What is Presa? Why do you need it for?
• A quick start with code example.
• Using blocks: typography, code etc.
• Additional features: clicker support, fullscreen mode.
• Spread the world: star on github widget.

We can try using Parcel (pros: no config needed, already supports everything needed) to build the deck inside demo/ (or deck or pitch you choose it) folder.

Zoomable block allows to zoom a piece of DOM on click. It can be used in order to wrap images and other blocks. We can later connect it to fragments (see #1), but for now zoom on click is fine too.

The possible interface:

import { Zoomable } from 'presa/blocks'

<Slide>
  <Zoomable>
    <img src="..." />
  </Zoomable>
</Slide>

New version with fragments support is not on npm. Is there anything preventing you from publishing it? It's working fine and tests are green.