deku-carousel - npm Package Compare versions

Comparing version 0.0.0 to 1.0.0

index.js

@@ -6,2 +6,5 @@ /** @jsx dom */
 const propTypes = {
+	arrows: {
+		type: 'boolean'
+	},
 	class: {
@@ -22,2 +25,5 @@ type: 'string'
 	},
+	play: {
+		type: 'boolean'
+	},
 	threshold: {
@@ -29,3 +35,3 @@ type: 'number'
 function afterMount({props}, el) {
-	const {duration, fastThreshold, interval, onChange, threshold} = props;
+	const {arrows, duration, fastThreshold, interval, onChange, play, threshold} = props;
 	const swipe = new Swipe(el);
@@ -55,11 +61,46 @@
 
-	swipe.play();
+	if (arrows) {
+		const prev = el.querySelector('.Carousel-control--prev');
+		const next = el.querySelector('.Carousel-control--next');
+
+		prev.addEventListener('click', e => {
+			e.preventDefault();
+			swipe.prev();
+		});
+
+		next.addEventListener('click', e => {
+			e.preventDefault();
+			swipe.next();
+		});
+	}
+
+	if (play) {
+		swipe.play();
+	}
 }
 
 function render({props}) {
-	const {children} = props;
+	const {arrows, arrowNext, arrowPrev, children} = props;
 
+	function getArrows() {
+		if (!arrows) {
+			return null;
+		}
+
+		return (
+			<div>
+				<button class='Carousel-control Carousel-control--prev'>
+					{arrowPrev || null}
+				</button>
+				<button class='Carousel-control Carousel-control--next'>
+					{arrowNext || null}
+				</button>
+			</div>
+		);
+	}
+
 	return (
 		<div class={['Carousel', props.class]}>
 			<div>{children}</div>
+			{getArrows()}
 		</div>
@@ -66,0 +107,0 @@ );

package.json

 {
   "name": "deku-carousel",
-  "version": "0.0.0",
-  "description": "My first-rate module",
+  "version": "1.0.0",
+  "description": "Carousel component for deku",
   "license": "MIT",
@@ -17,3 +17,3 @@ "repository": "kevva/deku-carousel",
     "build": "browserify example/index.js -o example/build.js -dv",
-    "test": "./node_modules/.bin/eslint index.js test.js lib/* && ava"
+    "test": "./node_modules/.bin/eslint index.js"
   },
@@ -24,3 +24,6 @@ "files": [
   "keywords": [
-    ""
+    "carousel",
+    "component",
+    "deku",
+    "swipe"
   ],
@@ -32,4 +35,2 @@ "dependencies": {
   "devDependencies": {
-    "assert-element": "^0.3.1",
-    "ava": "^0.2.0",
     "babel": "^5.8.23",
@@ -39,3 +40,2 @@ "babel-eslint": "^4.1.1",
     "browserify": "^11.2.0",
-    "component-mock": "0.0.2",
     "deku": "^0.5.6",
@@ -42,0 +42,0 @@ "eslint": "^1.3.1",

readme.md

@@ -1,4 +0,4 @@
-# deku-carousel [![Build Status](https://travis-ci.org/kevva/deku-carousel.svg?branch=master)](https://travis-ci.org/kevva/deku-carousel)
+# deku-carousel
 
-> My first-rate module
+> Carousel component for deku
 
@@ -16,31 +16,17 @@
 ```js
-var dekuCarousel = require('deku-carousel');
+import Carousel from 'deku-carousel';
 
-dekuCarousel('unicorns');
-//=> 'unicorns & rainbows'
+export function render() {
+	return (
+		<Carousel play arrows arrowPrev='Previous' arrowNext='Next'>
+			<img src='cat.jpg' alt=''/>
+			<img src='unicorn.jpg' alt=''/>
+		</Carousel>
+	);
+}
 ```
 
 
-## API
-
-### dekuCarousel(input, [options])
-
-#### input
-
-Type: `string`
-
-Lorem ipsum.
-
-#### options
-
-##### foo
-
-Type: `boolean`  
-Default: `false`
-
-Lorem ipsum.
-
-
 ## License
 
 MIT © [Kevin Mårtensson](http://github.com/kevva)

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4607

13.75%

Dev dependency count

10

-23.08%

Lines of code

90

66.67%

Number of low quality alerts

1

-50%

Worsened metrics

Number of lines in readme file

32

-30.43%

No dependency changes