Fix Compatibility with CommonJS

.github/factory/index.html.pug

@@ -129,7 +129,7 @@ block content
     p Functions and methods in this application are mostly native JavaScript and are intended for use by the browser. Node.js doesn’t know about the DOM, so this kind of practice will probably be used more often to build new browser packages than to be used directly in the Node.js server.
     h4 CommonJS
     pre: code
-      | const CP = require('@taufik-nurrohman/color-picker');
+      | const CP = require('@taufik-nurrohman/color-picker').default;
       |
       | const picker = new CP(document.querySelector('input'));
       |

README.md

@@ -50,145 +50,4 @@ This project exists thanks to all the people who contribute.
 <a href="https://opencollective.com/color-picker/organization/6/website"><img src="https://opencollective.com/color-picker/organization/6/avatar.svg"></a>
 <a href="https://opencollective.com/color-picker/organization/7/website"><img src="https://opencollective.com/color-picker/organization/7/avatar.svg"></a>
 <a href="https://opencollective.com/color-picker/organization/8/website"><img src="https://opencollective.com/color-picker/organization/8/avatar.svg"></a>
-<a href="https://opencollective.com/color-picker/organization/9/website"><img src="https://opencollective.com/color-picker/organization/9/avatar.svg"></a>
-
----
-
-Release Notes
--------------
-
-### 2.4.1
-
- - Added CSS variables for easy integration with third-party applications.
- - Changed CSS classes to follow the [BEM](http://getbem.com) approach.
-
-### 2.3.2
-
- - Added keyboard controls example [#71](https://github.com/taufik-nurrohman/color-picker/issues/71).
- - Removed `picker.value` property. Initial color data can be stored manually before initialization.
- - Removed `state.parent` option. Use `picker.enter(parent)` to append the color picker panel to `parent`.
-
-### 2.3.0
-
-Starting from this version, you need to have a form element to store the color data. We no longer support storing color data via `data-color` attribute and element content.
-
- - Added `picker._set()` method.
- - Added `picker.value` property to store the initial color data.
- - Removed `picker.value()` method. Use the `picker.set()` method instead.
-
-### 2.2.6
-
- - Maintenance.
- - Prioritized maintainability over file size. Say hello to Node.js and ES6! :wave:
- - Removed custom element example.
- - Restructured the test files.
-
-### 2.1.6
-
- - Make color picker tweaks reusable by wrapping them in a function.
- - Modernized syntax.
-
-### 2.1.5
-
- - Fixed minified code does not yet updated after release.
-
-### 2.1.4
-
- - Removed `CP._` method.
- - Small bug fixes.
-
-### 2.1.3
-
- - Added transition effect example.
- - Removed opacity value rounding internally.
- - Updated to pass the Firefox extension validator (#57)
-
-### 2.1.2
-
- - Updated the donation target.
-
-### 2.1.1
-
- - Fixed common issue with ES6 module which does not reference the `this` scope to `window` object by default.
-
-### 2.1.0
-
- - Added `blur` and `focus` hook that removed `state.e` option.
- - Added ability to clear the hook storage object if it’s empty.
-
-### 2.0.3
-
- - Added `CP.state` property to set initial state globally.
-
-### 2.0.2
-
- - Renamed `state.events` to `state.e`.
-
-### 2.0.1
-
- - Removed `CP.each()` method.
- - Renamed `CP.__instance__` to `CP.instances`.
-
-### 2.0.0
-
- - Hooks function arguments is now contains red, green, blue and alpha color value instead of static hex color string value.
- - Reduced file size by removing all color supports other than hex.
- - Removed `change:sv`, `change:h`, `start:sv`, `start:h`, `drag:sv`, `drag:h`, `stop:sv`, `stop:h` hooks.
-
-### 1.4.2
-
- - Changed to CSS flexbox for layout.
- - Fixed #48
-
-### 1.4.1
-
- - Removed the instance parameter in the first function argument of the hook and move the `this` scope in the function body to the current color picker instance.
- - Trigger `enter` and `exit` hooks on `enter` and `exit` method call.
-
-### 1.4.0
-
- - Renamed `target` property to `source` and `picker` property to `self`.
-
-### 1.3.10
-
- - Automatic color picker size based on container’s font size.
-
-### 1.3.9
-
- - Renamed `trigger` method to `fire`.
-
-### 1.3.8
-
- - Fixed color picker panel position using `HTMLElement.prototype.getBoundingClientRect()` by @flamestream and @alex3683 #29
-
-### 1.3.5
-
- - Allow users to change the plugin name from `CP` to another.
-
-### 1.3.2
-
- - Allow users to override the `fit` method.
-
-### 1.3.0
-
- - Converted all color converters into static function.
-
-### 1.2.0
-
- - Added static `__instance__` property to collect all of the color picker instance.
-
-### 1.1.0
-
- - Fixed Chrome bug with desktop events #9
-
-### 1.0.3
-
- - Fixed `event.stopPropagation()` issue #8
-
-### 1.0.2
-
- - Added `change` hook.
-
-### 1.0.0
-
- - Initial release.
+<a href="https://opencollective.com/color-picker/organization/9/website"><img src="https://opencollective.com/color-picker/organization/9/avatar.svg"></a>

index.html

@@ -5,7 +5,7 @@
     <meta content="#000" name="theme-color">
     <meta content="width=device-width" name="viewport">
     <meta content="A simple color picker application written in pure JavaScript, for modern browsers." name="description">
-    <title>Color Picker 2.4.1</title>
+    <title>Color Picker 2.4.2</title>
     <link href="index.min.css" rel="stylesheet">
     <style>
       * {
@@ -70,7 +70,7 @@
   <body>
     <p role="alert">Do you like this project? Please support my <a href="https://github.com/mecha-cms">Mecha CMS</a> project too. Thank you!</p>
     <header>
-      <h1>Color Picker 2.4.1</h1>
+      <h1>Color Picker 2.4.2</h1>
       <p>Color Picker is a simple JavaScript application that aims to provide custom color picker feature to the web with the most basic appearance and usability.</p>
       <hr>
     </header>
@@ -120,7 +120,7 @@ <h3>Browser</h3>
       <h3>Node.js</h3>
       <p>Functions and methods in this application are mostly native JavaScript and are intended for use by the browser. Node.js doesn&rsquo;t know about the DOM, so this kind of practice will probably be used more often to build new browser packages than to be used directly in the Node.js server.</p>
       <h4>CommonJS</h4>
-      <pre><code>const CP = require('@taufik-nurrohman/color-picker');
+      <pre><code>const CP = require('@taufik-nurrohman/color-picker').default;
 
 const picker = new CP(document.querySelector('input'));
 

index.js

@@ -770,6 +770,6 @@
         'class': 'color-picker',
         'color': COLOR_TYPE
     };
-    CP.version = '2.4.1';
+    CP.version = '2.4.2';
     return CP;
 });