Skip to content
Lightweight React Library for creating clickable Prototypes
JavaScript HTML CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
example
src
.babelrc
.editorconfig
.eslintignore
.eslintrc
.gitignore
.travis.yml
CHANGELOG.md
LICENSE
README.md
index.js
package-lock.json
package.json
rollup.config.js

README.md

clickable-prototype

Lightweight React Library for creating clickable Prototypes

NPM JavaScript Style Guide Build Status npm bundle size

Demo Page

Install

npm install --save clickable-prototype

Usage

import React, { Component } from 'react'

import { View, HitBox, ViewContainer } from 'clickable-prototype'

import view1 from './views/view1.png'
import view2 from './views/view2.png'

export default class App extends Component {
  render () {
    return (
      <div>
        <h1><span>clickable-prototype</span> Demo</h1>
        <ViewContainer defaultView='view1' className='container'>
          <View
            key='view1'
            className='custom-view'
            screen={view1}
            width='1220px'
            height='630px'>
            <HitBox
              position={{y: 380, x: 477, width: 280, height: 60}}
              to='view2' />
          </View>
          <View
            key='view2'
            className='custom-view'
            screen={view2}
            width='1220px'
            height='630px'>
            <HitBox
              position={{y: 490, x: 477, width: 280, height: 60}}
              to='view1' />
          </View>
        </ViewContainer>
      </div>
    )
  }
}

Development Setup

To set up this project, first clone the repository

$ git clone https://github.com/pinussilvestrus/clickable prototype

Change your working directory into the project directory

$ cd clickable-prototype

Install all dependencies in the library and the example

$ npm install
$ cd example && npm install

Run the development server(s)

$ npm run dev

License

MIT © pinussilvestrus

You can’t perform that action at this time.