Socket
Socket
Sign inDemoInstall

bootstrap-colorpicker

Package Overview
Dependencies
3
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 3.0.0 to 3.0.1

8

package.json
{
"name": "bootstrap-colorpicker",
"version": "3.0.0",
"description": "Simple and customizable colorpicker component for Twitter Bootstrap.",
"version": "3.0.1",
"description": "Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4.",
"main": "./dist/js/bootstrap-colorpicker.js",

@@ -21,3 +21,3 @@ "homepage": "https://farbelous.github.io/bootstrap-colorpicker/",

"dependencies": {
"color": "^3.0.0",
"bootstrap": "^4.0",
"jquery": ">=2.1.0"

@@ -43,2 +43,3 @@ },

"babel-preset-env": "^1.6.1",
"color": "^3.0.0",
"del": "^3.0.0",

@@ -57,2 +58,3 @@ "eslint": "^4.11.0",

"gulp-sourcemaps": "^2.6.1",
"gulp-string-replace": "^1.1.1",
"handlebars-layouts": "^3.1.4",

@@ -59,0 +61,0 @@ "http-server": "^0.10.0",

@@ -1,3 +0,3 @@

<a href="https://farbelous.io/bootstrap-colorpicker">
<img alt="Logo by @reallinfo" src="logo.png" width="190px" />
<a class="readme-logo" href="https://farbelous.io/bootstrap-colorpicker">
<img alt="Logo by @reallinfo" src="logo.png" width="128px" />
</a>

@@ -7,14 +7,11 @@

[Bootstrap Colorpicker](https://github.com/farbelous/bootstrap-colorpicker/) is a simple and customizable colorpicker
component for jQuery, which is also compatible with Twitter Bootstrap.
<!--version-->
[Bootstrap Colorpicker](https://github.com/farbelous/bootstrap-colorpicker/) is a modular color picker plugin for Bootstrap 4.
[![Build Status](https://img.shields.io/travis/farbelous/bootstrap-colorpicker/master.svg?style=flat-square)](https://travis-ci.org/farbelous/bootstrap-colorpicker)
[![npm](https://img.shields.io/npm/v/bootstrap-colorpicker.svg?style=flat-square)](https://www.npmjs.com/package/bootstrap-colorpicker)
[![npm@next](https://img.shields.io/npm/v/bootstrap-colorpicker/next.svg?style=flat-square)](https://www.npmjs.com/package/bootstrap-colorpicker?activeTab=versions)
[![Donate](https://img.shields.io/badge/%E2%9D%A4-Donate%20to%20this%20project-e0a61d.svg?longCache=true&style=flat-square)](https://github.com/itsjavi/itsjavi.github.io/blob/master/BACKERS.md#sponsors--backers)
[![Supporters](https://img.shields.io/badge/%F0%9F%92%AA-Supporters-333333.svg?longCache=true&style=flat-square)](https://github.com/itsjavi/itsjavi.github.io/blob/master/BACKERS.md#sponsors)
> NOTE that this documentation refers to the **latest stable version** of the project.<br>
> Previous documentation can be found here: [v2.x](https://farbelous.github.io/bootstrap-colorpicker/v2/).
## Install

@@ -29,10 +26,55 @@ You can get the latest version in many different ways:

Note that the `dist` files are only distributed via the NPM and Yarn installations.
To start using the component, most of the time you will only need the files under the `dist` folder.
The `dist` folder will be available if you installed this package via npm or yarn. In any other cases
you will need to run `yarn install && npm run build` in order to generate it.
For the rest methods, you will need to generate the files initializing the project with `yarn install`
and then building the code using `npm run build`.
## Versions
Example:
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Colorpicker version</th>
<th>Compatible Bootstrap version</th>
<th>Dependencies</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<a href="https://github.com/farbelous/bootstrap-colorpicker/tree/v2.x">v2.x</a> <br>
<a href="https://farbelous.github.io/bootstrap-colorpicker/v2">Documentation</a>
</td>
<td>(any)</td>
<td>
<ul>
<li>jQuery >= 1.10</li>
<li>Bootstrap CSS (input addon)</li>
</ul>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/farbelous/bootstrap-colorpicker">v3.x</a> <br>
<a href="https://farbelous.github.io/bootstrap-colorpicker">Documentation</a>
</td>
<td>Bootstrap 4</td>
<td>
<ul>
<li>jQuery >= 2.1.0</li>
<li>Bootstrap CSS (input addon, popover)</li>
<li>Bootstrap JS Bundle (popover)</li>
</ul>
</td>
</tr>
</thead>
</table>
Note that the plugin may work without Bootstrap if your code is not using any of the mentioned Bootstrap
dependencies.
## Basic example
```html

@@ -43,13 +85,22 @@ <!DOCTYPE html>

<meta charset="utf-8">
<link href="//cdn.rawgit.com/twbs/bootstrap/v4.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
<div class="container">
<input id="mycp" type="text" class="form-control" />
<div class="jumbotron">
<h1>Bootstrap Colorpicker Demo</h1>
<input id="demo" type="text" class="form-control" value="rgb(255, 128, 0)" />
</div>
<script src="//code.jquery.com/jquery-3.2.1.js"></script>
<script src="//code.jquery.com/jquery-3.3.1.js"></script>
<script src="//cdn.rawgit.com/twbs/bootstrap/v4.1.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="dist/js/bootstrap-colorpicker.js"></script>
<script>
$(function () {
$('#mycp').colorpicker({popover:false});
// Basic instantiation:
$('#demo').colorpicker();
// Example using an event, to change the color of the .jumbotron background:
$('#demo').on('colorpickerChange', function(event) {
$('.jumbotron').css('background-color', event.color.toString());
});
});

@@ -60,23 +111,2 @@ </script>

## Requirements
Note that this library depends on `jQuery >= 2.1.0`.
The `Twitter Bootstrap` dependency is recommended but optional, since this library does not depend directly
on it in order to work, except when Bootstrap-related classes like `form-control` and `input-group-append` are used
like in the examples. In that case you will need at least the Bootstrap CSS for everything to be displayed correctly.
The Bootstrap JS bundle is required in case you want to use the Bootstrap Popover instead of the built-in one.
By default all instances are created using the Bootstrap Popover. In order to make the plugin work without Bootstrap,
you need to set the `popover` option to `false`.
## Documentation
The documentation of this project has been created with by Handlebars, JSDoc and the Minami template.
* [Documentation (@next)](https://farbelous.github.io/bootstrap-colorpicker/)
* [Examples](https://farbelous.github.io/bootstrap-colorpicker/tutorial-Basics.html)
Older versions:
* [Documentation (v2.x)](https://farbelous.github.io/bootstrap-colorpicker/v2/)
## Contributions

@@ -98,6 +128,7 @@ * [Issues](https://github.com/farbelous/bootstrap-colorpicker/issues)

## Credits
Originally written by Stefan Petre in 2013.
Rewritten and maintained by [Javi Aguilar](https://itsjavi.com) and all other contributors.
Written and maintained by [Javi Aguilar](https://itsjavi.com) and all other contributors.
*With the support of JetBrains.*
*Based on Stefan Petre's color picker (2013).*
*Thanks to JetBrains for supporting this project.*

@@ -5,2 +5,3 @@ 'use strict';

* Handles everything related to the colorpicker addon
* @ignore
*/

@@ -7,0 +8,0 @@ class AddonHandler {

@@ -8,2 +8,3 @@ 'use strict';

* Handles everything related to the colorpicker color
* @ignore
*/

@@ -10,0 +11,0 @@ class ColorHandler {

@@ -6,9 +6,23 @@ /**

/**
* HSVA color data class, containing the hue, saturation, value and alpha
* information.
*/
class HSVAColor {
/**
* @param {number|int} h
* @param {number|int} s
* @param {number|int} v
* @param {number|int} a
*/
constructor(h, s, v, a) {
this.h = h;
this.s = s;
this.v = v;
this.a = a;
this.h = isNaN(h) ? 0 : h;
this.s = isNaN(s) ? 0 : s;
this.v = isNaN(v) ? 0 : v;
this.a = isNaN(h) ? 1 : a;
}
toString() {
return `${this.h}, ${this.s}%, ${this.v}%, ${this.a}`;
}
}

@@ -24,2 +38,4 @@

*
* @static
* @example let colorData = new ColorItem.HSVAColor(360, 100, 100, 1);
* @returns {HSVAColor}

@@ -32,22 +48,35 @@ */

/**
* Applies a method of the QixColor API and returns a new Color object.
* Applies a method of the QixColor API and returns a new Color object or
* the return value of the method call.
*
* If no argument is provided, the internal QixColor object is returned.
*
* @param {String} fn QixColor function name
* @param args
* @returns {ColorItem|*}
* @param args QixColor function arguments
* @example let darkerColor = color.api('darken', 0.25);
* @example let luminosity = color.api('luminosity');
* @example color = color.api('negate');
* @example let qColor = color.api().negate();
* @returns {ColorItem|QixColor|*}
*/
api(fn, ...args) {
let newColor = this._color[fn].apply(this._color, args);
if (arguments.length === 0) {
return this._color;
}
if (!(newColor instanceof QixColor)) {
return newColor;
let result = this._color[fn].apply(this._color, args);
if (!(result instanceof QixColor)) {
// return result of the method call
return result;
}
return new ColorItem(newColor, this.format);
return new ColorItem(result, this.format);
}
/**
* Returns the original constructor data
* Returns the original ColorItem constructor data,
* plus a 'valid' flag to know if it's valid or not.
*
* @returns {{color: *, format: String}}
* @returns {{color: *, format: String, valid: boolean}}
*/

@@ -60,3 +89,3 @@ get original() {

* @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data
* @param {String|null} format Color model to convert to by default
* @param {String|null} format Color model to convert to by default. Supported: 'rgb', 'hsl', 'hex'.
*/

@@ -68,4 +97,9 @@ constructor(color = null, format = null) {

/**
* @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data
* @param {String|null} format Color model to convert to by default
* Replaces the internal QixColor object with a new one.
* This also replaces the internal original color data.
*
* @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data to be parsed (if needed)
* @param {String|null} format Color model to convert to by default. Supported: 'rgb', 'hsl', 'hex'.
* @example color.replace('rgb(255,0,0)', 'hsl');
* @example color.replace(hsvaColorData);
*/

@@ -111,3 +145,5 @@ replace(color, format = null) {

* @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data
* @returns {QixColor}
* @example let qColor = ColorItem.parse('rgb(255,0,0)');
* @static
* @returns {QixColor|null}
*/

@@ -142,2 +178,11 @@ static parse(color) {

/**
* Sanitizes a color string, adding missing hash to hexadecimal colors
* and converting 'transparent' to a color code.
*
* @param {String|*} str Color string
* @example let colorStr = ColorItem.sanitizeString('ffaa00');
* @static
* @returns {String|*}
*/
static sanitizeString(str) {

@@ -159,2 +204,12 @@ if (!(typeof str === 'string' || str instanceof String)) {

/**
* Detects if a value is a string and a color in hexadecimal format (in any variant).
*
* @param {String} str
* @example ColorItem.isHex('rgba(0,0,0)'); // false
* @example ColorItem.isHex('ffaa00'); // true
* @example ColorItem.isHex('#ffaa00'); // true
* @static
* @returns {boolean}
*/
static isHex(str) {

@@ -168,4 +223,14 @@ if (!(typeof str === 'string' || str instanceof String)) {

/**
* Sanitizes a color format to one supported by web browsers.
* Returns an empty string of the format can't be recognised.
*
* @param {String|*} format
* @example ColorItem.sanitizeFormat('rgba'); // 'rgb'
* @example ColorItem.isHex('hex8'); // 'hex'
* @example ColorItem.isHex('invalid'); // ''
* @static
* @returns {String} 'rgb', 'hsl', 'hex' or ''.
*/
static sanitizeFormat(format) {
// return formats only supported by web browsers
switch (format) {

@@ -187,3 +252,3 @@ case 'hex':

case 'hsva':
case 'hwb':
case 'hwb': // HWB this is supported by Qix Color, but not by browsers
case 'hwba':

@@ -196,2 +261,7 @@ return 'hsl';

/**
* Returns true if the color is valid, false if not.
*
* @returns {boolean}
*/
isValid() {

@@ -202,3 +272,5 @@ return this._original.valid === true;

/**
* @returns int
* Hue value from 0 to 360
*
* @returns {int}
*/

@@ -209,2 +281,7 @@ get hue() {

/**
* Saturation value from 0 to 100
*
* @returns {int}
*/
get saturation() {

@@ -214,2 +291,7 @@ return this._color.saturationv();

/**
* Value channel value from 0 to 100
*
* @returns {int}
*/
get value() {

@@ -219,2 +301,7 @@ return this._color.value();

/**
* Alpha value from 0.0 to 1.0
*
* @returns {number}
*/
get alpha() {

@@ -226,2 +313,7 @@ let a = this._color.alpha();

/**
* Default color format to convert to when calling toString() or string()
*
* @returns {String} 'rgb', 'hsl', 'hex' or ''
*/
get format() {

@@ -231,2 +323,7 @@ return this._format ? this._format : this._color.model;

/**
* Sets the hue value
*
* @param {int} value Integer from 0 to 360
*/
set hue(value) {

@@ -236,2 +333,17 @@ this._color = this._color.hue(value);

/**
* Sets the hue ratio, where 1.0 is 0, 0.5 is 180 and 0.0 is 360.
*
* @ignore
* @param {number} h Ratio from 1.0 to 0.0
*/
setHueRatio(h) {
this.hue = ((1 - h) * 360);
}
/**
* Sets the saturation value
*
* @param {int} value Integer from 0 to 100
*/
set saturation(value) {

@@ -241,2 +353,17 @@ this._color = this._color.saturationv(value);

/**
* Sets the saturation ratio, where 1.0 is 100 and 0.0 is 0.
*
* @ignore
* @param {number} s Ratio from 0.0 to 1.0
*/
setSaturationRatio(s) {
this.saturation = (s * 100);
}
/**
* Sets the 'value' channel value
*
* @param {int} value Integer from 0 to 100
*/
set value(value) {

@@ -246,39 +373,46 @@ this._color = this._color.value(value);

set alpha(value) {
// 2 decimals max
this._color = this._color.alpha(Math.round(value * 100) / 100);
/**
* Sets the value ratio, where 1.0 is 0 and 0.0 is 100.
*
* @ignore
* @param {number} v Ratio from 1.0 to 0.0
*/
setValueRatio(v) {
this.value = ((1 - v) * 100);
}
set format(value) {
this._format = ColorItem.sanitizeFormat(value);
}
/**
* @param {number} h Ratio from 0.0 to 1.0
* Sets the alpha value. It will be rounded to 2 decimals.
*
* @param {int} value Float from 0.0 to 1.0
*/
setHueRatio(h) {
this.hue = ((1 - h) * 360);
set alpha(value) {
// 2 decimals max
this._color = this._color.alpha(Math.round(value * 100) / 100);
}
/**
* @param {number} s Ratio from 0.0 to 1.0
* Sets the alpha ratio, where 1.0 is 0.0 and 0.0 is 1.0.
*
* @ignore
* @param {number} a Ratio from 1.0 to 0.0
*/
setSaturationRatio(s) {
this.saturation = (s * 100);
setAlphaRatio(a) {
this.alpha = 1 - a;
}
/**
* @param {number} v Ratio from 0.0 to 1.0
* Sets the default color format
*
* @param {String} value Supported: 'rgb', 'hsl', 'hex'
*/
setBrightnessRatio(l) {
this.value = (1 - l) * 100;
set format(value) {
this._format = ColorItem.sanitizeFormat(value);
}
/**
* @param {number} a Ratio from 0.0 to 1.0
* Returns true if the saturation value is zero, false otherwise
*
* @returns {boolean}
*/
setAlphaRatio(a) {
this.alpha = 1 - a;
}
isDesaturated() {

@@ -288,2 +422,7 @@ return this.saturation === 0;

/**
* Returns true if the alpha value is zero, false otherwise
*
* @returns {boolean}
*/
isTransparent() {

@@ -293,2 +432,7 @@ return this.alpha === 0;

/**
* Returns true if the alpha value is numeric and less than 1, false otherwise
*
* @returns {boolean}
*/
hasTransparency() {

@@ -298,6 +442,16 @@ return this.hasAlpha() && (this.alpha < 1);

/**
* Returns true if the alpha value is numeric, false otherwise
*
* @returns {boolean}
*/
hasAlpha() {
return (this.alpha !== false);
return !isNaN(this.alpha);
}
/**
* Returns a new HSVAColor object, based on the current color
*
* @returns {HSVAColor}
*/
toObject() {

@@ -307,2 +461,7 @@ return new HSVAColor(this.hue, this.saturation, this.value, this.alpha);

/**
* Alias of toObject()
*
* @returns {HSVAColor}
*/
toHsva() {

@@ -312,2 +471,9 @@ return this.toObject();

/**
* Returns a new HSVAColor object with the ratio values (from 0.0 to 1.0),
* based on the current color.
*
* @ignore
* @returns {HSVAColor}
*/
toHsvaRatio() {

@@ -322,2 +488,8 @@ return new HSVAColor(

/**
* Converts the current color to its string representation,
* using the internal format of this instance.
*
* @returns {String}
*/
toString() {

@@ -327,2 +499,9 @@ return this.string();

/**
* Converts the current color to its string representation,
* using the given format.
*
* @param {String|null} format Format to convert to. If empty or null, the internal format will be used.
* @returns {String}
*/
string(format = null) {

@@ -344,2 +523,11 @@ format = ColorItem.sanitizeFormat(format ? format : this.format);

/**
* Returns true if the given color values equals this one, false otherwise.
* The format is not compared.
* If any of the colors is invalid, the result will be false.
*
* @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data
*
* @returns {boolean}
*/
equals(color) {

@@ -360,2 +548,7 @@ color = (color instanceof ColorItem) ? color : new ColorItem(color);

/**
* Creates a copy of this instance
*
* @returns {ColorItem}
*/
getClone() {

@@ -365,2 +558,8 @@ return new ColorItem(this._color, this.format);

/**
* Creates a copy of this instance, only copying the hue value,
* and setting the others to its max value.
*
* @returns {ColorItem}
*/
getCloneHueOnly() {

@@ -370,2 +569,7 @@ return new ColorItem([this.hue, 100, 100, 1], this.format);

/**
* Creates a copy of this instance setting the alpha to the max.
*
* @returns {ColorItem}
*/
getCloneOpaque() {

@@ -375,2 +579,7 @@ return new ColorItem(this._color.alpha(1), this.format);

/**
* Converts the color to a RGB string
*
* @returns {String}
*/
toRgbString() {

@@ -380,2 +589,7 @@ return this.string('rgb');

/**
* Converts the color to a Hexadecimal string
*
* @returns {String}
*/
toHexString() {

@@ -385,2 +599,7 @@ return this.string('hex');

/**
* Converts the color to a HSL string
*
* @returns {String}
*/
toHslString() {

@@ -390,2 +609,8 @@ return this.string('hsl');

/**
* Returns true if the color is dark, false otherwhise.
* This is useful to decide a text color.
*
* @returns {boolean}
*/
isDark() {

@@ -395,2 +620,8 @@ return this._color.isDark();

/**
* Returns true if the color is light, false otherwhise.
* This is useful to decide a text color.
*
* @returns {boolean}
*/
isLight() {

@@ -401,10 +632,19 @@ return this._color.isLight();

/**
* @param {String} scheme One of: 'complementary', 'triad', 'tetrad', 'splitcomplement'
* Generates a list of colors using the given hue-based formula or the given array of hue values.
* Hue formulas can be extended using ColorItem.colorFormulas static property.
*
* @param {String|Number[]} formula Examples: 'complementary', 'triad', 'tetrad', 'splitcomplement', [180, 270]
* @example let colors = color.generate('triad');
* @example let colors = color.generate([45, 80, 112, 200]);
* @returns {ColorItem[]}
*/
getScheme(scheme = 'complementary') {
let hues = ColorItem.colorSchemes[scheme];
generate(formula) {
let hues = [];
if (!hues) {
throw new Error(`No scheme found named ${scheme}`);
if (Array.isArray(formula)) {
hues = formula;
} else if (!ColorItem.colorFormulas.hasOwnProperty(formula)) {
throw new Error(`No color formula found with the name '${formula}'.`);
} else {
hues = ColorItem.colorFormulas[formula];
}

@@ -429,3 +669,9 @@

ColorItem.colorSchemes = {
/**
* List of hue-based color formulas used by ColorItem.prototype.generate()
*
* @static
* @type {{complementary: number[], triad: number[], tetrad: number[], splitcomplement: number[]}}
*/
ColorItem.colorFormulas = {
complementary: [180],

@@ -438,1 +684,6 @@ triad: [0, 120, 240],

export default ColorItem;
export {
HSVAColor,
ColorItem
};

@@ -5,3 +5,3 @@ 'use strict';

import defaults from './options';
import bundledExtensions from 'extensions';
import coreExtensions from 'extensions';
import $ from 'jquery';

@@ -53,3 +53,3 @@ import SliderHandler from './SliderHandler';

/**
* Color format
* Internal color format
*

@@ -63,2 +63,3 @@ * @type {String|null}

/**
* Getter of the picker element
*

@@ -172,11 +173,5 @@ * @returns {jQuery|HTMLElement}

/**
* Colorpicker bundled extension classes
*
* @static
* @type {{Extension}}
* Initializes the plugin
* @private
*/
static getBundledExtensions() {
return bundledExtensions;
}
init() {

@@ -209,2 +204,6 @@ // Init addon

/**
* Initializes the plugin extensions
* @private
*/
initExtensions() {

@@ -221,3 +220,3 @@ if (!Array.isArray(this.options.extensions)) {

this.options.extensions.forEach((ext) => {
this.registerExtension(bundledExtensions[ext.name.toLowerCase()], ext.options || {});
this.registerExtension(Colorpicker.extensions[ext.name.toLowerCase()], ext.options || {});
});

@@ -281,3 +280,2 @@ }

* Hides the colorpicker widget.
* Hide is prevented when it is triggered by an event whose target element has been clicked/touched.
*

@@ -292,3 +290,3 @@ * @fires Colorpicker#colorpickerHide

/**
* Toggles the colorpicker between visible or hidden
* Toggles the colorpicker between visible and hidden.
*

@@ -440,3 +438,3 @@ * @fires Colorpicker#colorpickerShow

color: color ? color : this.color,
value: value
value: value ? value : this.getValue()
});

@@ -446,2 +444,10 @@ }

/**
* Colorpicker extension classes, indexed by extension name
*
* @static
* @type {Object} a map between the extension name and its class
*/
Colorpicker.extensions = coreExtensions;
export default Colorpicker;

@@ -15,2 +15,3 @@ 'use strict';

/**
* The colorpicker instance
* @type {Colorpicker}

@@ -20,2 +21,4 @@ */

/**
* Extension options
*
* @type {Object}

@@ -54,2 +57,4 @@ */

/**
* Method called after the colorpicker is created
*
* @listens Colorpicker#colorpickerCreate

@@ -63,2 +68,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is destroyed
*
* @listens Colorpicker#colorpickerDestroy

@@ -72,2 +79,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is updated
*
* @listens Colorpicker#colorpickerUpdate

@@ -81,2 +90,4 @@ * @param {Event} event

/**
* Method called after the colorpicker color is changed
*
* @listens Colorpicker#colorpickerChange

@@ -90,2 +101,4 @@ * @param {Event} event

/**
* Method called when the colorpicker color is invalid
*
* @listens Colorpicker#colorpickerInvalid

@@ -99,2 +112,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is hidden
*
* @listens Colorpicker#colorpickerHide

@@ -108,2 +123,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is shown
*
* @listens Colorpicker#colorpickerShow

@@ -117,2 +134,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is disabled
*
* @listens Colorpicker#colorpickerDisable

@@ -126,2 +145,4 @@ * @param {Event} event

/**
* Method called after the colorpicker is enabled
*
* @listens Colorpicker#colorpickerEnable

@@ -128,0 +149,0 @@ * @param {Event} event

@@ -9,2 +9,3 @@ 'use strict';

* @alias DebuggerExtension
* @ignore
*/

@@ -11,0 +12,0 @@ class Debugger extends Extension {

@@ -40,2 +40,6 @@ 'use strict';

/**
* Palette extension
* @ignore
*/
class Palette extends Extension {

@@ -42,0 +46,0 @@

@@ -6,2 +6,6 @@ 'use strict';

/**
* Color preview extension
* @ignore
*/
class Preview extends Extension {

@@ -8,0 +12,0 @@ constructor(colorpicker, options = {}) {

@@ -13,2 +13,6 @@ 'use strict';

/**
* Color swatches extension
* @ignore
*/
class Swatches extends Palette {

@@ -15,0 +19,0 @@ constructor(colorpicker, options = {}) {

@@ -8,2 +8,3 @@ 'use strict';

* Handles everything related to the colorpicker input
* @ignore
*/

@@ -10,0 +11,0 @@ class InputHandler {

@@ -210,3 +210,3 @@ 'use strict';

callLeft: 'setSaturationRatio',
callTop: 'setBrightnessRatio'
callTop: 'setValueRatio'
},

@@ -239,3 +239,3 @@ hue: {

callLeft: 'setSaturationRatio',
callTop: 'setBrightnessRatio'
callTop: 'setValueRatio'
},

@@ -242,0 +242,0 @@ hue: {

@@ -7,2 +7,3 @@ 'use strict';

* Handles everything related to the colorpicker UI
* @ignore
*/

@@ -9,0 +10,0 @@ class PickerHandler {

@@ -8,2 +8,3 @@ 'use strict';

* Handles everything related to the UI of the colorpicker popup: show, hide, position,...
* @ignore
*/

@@ -10,0 +11,0 @@ class PopupHandler {

@@ -7,2 +7,3 @@ 'use strict';

* Class that handles all configured sliders on mouse or touch events.
* @ignore
*/

@@ -9,0 +10,0 @@ class SliderHandler {

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc