From ae80344d24ea84655d141256a189fc617892dcf3 Mon Sep 17 00:00:00 2001 From: janschoenherr Date: Thu, 30 Aug 2018 15:03:03 +0200 Subject: [PATCH 01/40] use clamp function to calculate left, top and bright values --- package-lock.json | 6 ++++++ package.json | 1 + src/components/common/Saturation.vue | 21 ++++----------------- 3 files changed, 11 insertions(+), 17 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7bbcb566..d860aba0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1861,6 +1861,12 @@ "integrity": "sha512-UZK3NBx2Mca+b5LsG7bY183pHWt5Y1xts4P3Pz7ENTwGVnJOUWbRb3ocjvX7hx9tq/yTAdclXm9sZ38gNuem4A==", "dev": true }, + "clamp": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/clamp/-/clamp-1.0.1.tgz", + "integrity": "sha1-ZqDmQBGBbjcZaCj9yMjBRzEshjQ=", + "dev": true + }, "clap": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz", diff --git a/package.json b/package.json index 1604f7e6..49af08f4 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "babel-preset-env": "^1.6.1", "babel-preset-stage-2": "^6.22.0", "chalk": "^2.4.1", + "clamp": "^1.0.1", "connect-history-api-fallback": "^1.1.0", "css-loader": "^0.28.11", "eslint": "^3.19.0", diff --git a/src/components/common/Saturation.vue b/src/components/common/Saturation.vue index 3fc4c34b..a8b81f08 100644 --- a/src/components/common/Saturation.vue +++ b/src/components/common/Saturation.vue @@ -14,6 +14,7 @@ + + diff --git a/src/index.js b/src/index.js index 6055644e..ed0a8138 100644 --- a/src/index.js +++ b/src/index.js @@ -6,6 +6,7 @@ import Swatches from './components/Swatches.vue' import Photoshop from './components/Photoshop.vue' import Sketch from './components/Sketch.vue' import Chrome from './components/Chrome.vue' +import Twitter from './components/Twitter.vue' import Alpha from './components/common/Alpha.vue' import Checkboard from './components/common/Checkboard.vue' import EditableInput from './components/common/EditableInput.vue' @@ -17,6 +18,7 @@ const VueColor = { version: '2.7.0', Compact, Grayscale, + Twitter, Material, Slider, Swatches, From 74239685f67d8de2c6a0a6b9ae0f4058e7f564be Mon Sep 17 00:00:00 2001 From: SlaneYang Date: Thu, 21 Nov 2019 20:49:22 +0800 Subject: [PATCH 19/40] fix(twitter): remove unused code --- src/components/Twitter.vue | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/Twitter.vue b/src/components/Twitter.vue index d92a56ea..e816b4f7 100644 --- a/src/components/Twitter.vue +++ b/src/components/Twitter.vue @@ -83,8 +83,6 @@ export default { return hex && hex.replace('#', '') } }, - mounted () { - }, methods: { equal (color) { return color.toLowerCase() === this.colors.hex.toLowerCase() From 592bcd006885879bc0f7d5aba64de615cf06817d Mon Sep 17 00:00:00 2001 From: SlaneYang Date: Thu, 21 Nov 2019 20:57:53 +0800 Subject: [PATCH 20/40] feat(twitter): build release --- dist/vue-color.js | 496 +++++++++++++++++++++++++++++++++--------- dist/vue-color.min.js | 2 +- 2 files changed, 390 insertions(+), 108 deletions(-) diff --git a/dist/vue-color.js b/dist/vue-color.js index a51dd1fa..0c0186bf 100644 --- a/dist/vue-color.js +++ b/dist/vue-color.js @@ -70,7 +70,7 @@ return /******/ (function(modules) { // webpackBootstrap /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = 22); +/******/ return __webpack_require__(__webpack_require__.s = 23); /******/ }) /************************************************************************/ /******/ ([ @@ -175,7 +175,7 @@ if (typeof DEBUG !== 'undefined' && DEBUG) { ) } } -var listToStyles = __webpack_require__(26) +var listToStyles = __webpack_require__(27) /* type StyleObject = { @@ -503,7 +503,7 @@ Object.defineProperty(exports, "__esModule", { value: true }); -var _tinycolor = __webpack_require__(27); +var _tinycolor = __webpack_require__(28); var _tinycolor2 = _interopRequireDefault(_tinycolor); @@ -615,11 +615,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_EditableInput_vue__ = __webpack_require__(10); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_EditableInput_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_EditableInput_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_EditableInput_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_EditableInput_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_441174dc_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_EditableInput_vue__ = __webpack_require__(30); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_441174dc_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_EditableInput_vue__ = __webpack_require__(31); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(28) + __webpack_require__(29) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -673,11 +673,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Hue_vue__ = __webpack_require__(14); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Hue_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Hue_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Hue_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Hue_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_7b9aea78_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Hue_vue__ = __webpack_require__(45); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_7b9aea78_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Hue_vue__ = __webpack_require__(46); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(43) + __webpack_require__(44) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -731,11 +731,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Saturation_vue__ = __webpack_require__(17); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Saturation_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Saturation_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Saturation_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Saturation_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_ba139894_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Saturation_vue__ = __webpack_require__(60); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_ba139894_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Saturation_vue__ = __webpack_require__(61); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(55) + __webpack_require__(56) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -789,11 +789,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Alpha_vue__ = __webpack_require__(18); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Alpha_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Alpha_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Alpha_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Alpha_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_1af1f1ac_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Alpha_vue__ = __webpack_require__(66); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_1af1f1ac_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Alpha_vue__ = __webpack_require__(67); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(61) + __webpack_require__(62) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -847,11 +847,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Checkboard_vue__ = __webpack_require__(19); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Checkboard_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Checkboard_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Checkboard_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Checkboard_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_5b6dc0c2_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Checkboard_vue__ = __webpack_require__(65); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_5b6dc0c2_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Checkboard_vue__ = __webpack_require__(66); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(63) + __webpack_require__(64) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -1333,7 +1333,7 @@ Object.defineProperty(exports, "__esModule", { value: true }); -var _materialColors = __webpack_require__(50); +var _materialColors = __webpack_require__(51); var _materialColors2 = _interopRequireDefault(_materialColors); @@ -1552,11 +1552,11 @@ Object.defineProperty(exports, "__esModule", { value: true }); -var _clamp = __webpack_require__(57); +var _clamp = __webpack_require__(58); var _clamp2 = _interopRequireDefault(_clamp); -var _lodash = __webpack_require__(58); +var _lodash = __webpack_require__(59); var _lodash2 = _interopRequireDefault(_lodash); @@ -2035,38 +2035,148 @@ exports.default = { "use strict"; -var _Compact = __webpack_require__(23); +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _EditableInput = __webpack_require__(4); + +var _EditableInput2 = _interopRequireDefault(_EditableInput); + +var _color = __webpack_require__(3); + +var _color2 = _interopRequireDefault(_color); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var defaultColors = ['#FF6900', '#FCB900', '#7BDCB5', '#00D084', '#8ED1FC', '#0693E3', '#ABB8C3', '#EB144C', '#F78DA7', '#9900EF']; + +exports.default = { + name: 'Twitter', + mixins: [_color2.default], + components: { + editableInput: _EditableInput2.default + }, + data: function data() { + return { + currentColor: '#fff' + }; + }, + + props: { + width: { + type: [String, Number], + default: 276 + }, + defaultColors: { + type: Array, + default: function _default() { + return defaultColors; + } + }, + triangle: { + default: 'top-left', + validator: function validator(value) { + return ['hide', 'top-left', 'top-right'].includes(value); + } + } + }, + computed: { + hsv: function hsv() { + var hsv = this.colors.hsv; + return { + h: hsv.h.toFixed(), + s: (hsv.s * 100).toFixed(), + v: (hsv.v * 100).toFixed() + }; + }, + hex: function hex() { + var hex = this.colors.hex; + return hex && hex.replace('#', ''); + } + }, + methods: { + equal: function equal(color) { + return color.toLowerCase() === this.colors.hex.toLowerCase(); + }, + handlerClick: function handlerClick(color) { + this.colorChange({ + hex: color, + source: 'hex' + }); + }, + inputChange: function inputChange(data) { + if (!data) { + return; + } + if (data['#']) { + this.isValidHex(data['#']) && this.colorChange({ + hex: data['#'], + source: 'hex' + }); + } else if (data.r || data.g || data.b || data.a) { + this.colorChange({ + r: data.r || this.colors.rgba.r, + g: data.g || this.colors.rgba.g, + b: data.b || this.colors.rgba.b, + a: data.a || this.colors.rgba.a, + source: 'rgba' + }); + } else if (data.h || data.s || data.v) { + this.colorChange({ + h: data.h || this.colors.hsv.h, + s: data.s / 100 || this.colors.hsv.s, + v: data.v / 100 || this.colors.hsv.v, + source: 'hsv' + }); + } + } + } +}; + +/***/ }), +/* 23 */ +/***/ (function(module, exports, __webpack_require__) { + +"use strict"; + + +var _Compact = __webpack_require__(24); var _Compact2 = _interopRequireDefault(_Compact); -var _Grayscale = __webpack_require__(32); +var _Grayscale = __webpack_require__(33); var _Grayscale2 = _interopRequireDefault(_Grayscale); -var _Material = __webpack_require__(36); +var _Material = __webpack_require__(37); var _Material2 = _interopRequireDefault(_Material); -var _Slider = __webpack_require__(40); +var _Slider = __webpack_require__(41); var _Slider2 = _interopRequireDefault(_Slider); -var _Swatches = __webpack_require__(47); +var _Swatches = __webpack_require__(48); var _Swatches2 = _interopRequireDefault(_Swatches); -var _Photoshop = __webpack_require__(52); +var _Photoshop = __webpack_require__(53); var _Photoshop2 = _interopRequireDefault(_Photoshop); -var _Sketch = __webpack_require__(68); +var _Sketch = __webpack_require__(69); var _Sketch2 = _interopRequireDefault(_Sketch); -var _Chrome = __webpack_require__(72); +var _Chrome = __webpack_require__(73); var _Chrome2 = _interopRequireDefault(_Chrome); +var _Twitter = __webpack_require__(77); + +var _Twitter2 = _interopRequireDefault(_Twitter); + var _Alpha = __webpack_require__(7); var _Alpha2 = _interopRequireDefault(_Alpha); @@ -2097,6 +2207,7 @@ var VueColor = { version: '2.7.0', Compact: _Compact2.default, Grayscale: _Grayscale2.default, + Twitter: _Twitter2.default, Material: _Material2.default, Slider: _Slider2.default, Swatches: _Swatches2.default, @@ -2114,7 +2225,7 @@ var VueColor = { module.exports = VueColor; /***/ }), -/* 23 */ +/* 24 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -2122,11 +2233,11 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Compact_vue__ = __webpack_require__(9); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Compact_vue___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Compact_vue__); /* harmony namespace reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Compact_vue__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_Compact_vue__[key]; }) }(__WEBPACK_IMPORT_KEY__)); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_648423a3_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Compact_vue__ = __webpack_require__(31); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_648423a3_hasScoped_false_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_Compact_vue__ = __webpack_require__(32); var disposed = false function injectStyle (ssrContext) { if (disposed) return - __webpack_require__(24) + __webpack_require__(25) } var normalizeComponent = __webpack_require__(2) /* script */ @@ -2172,13 +2283,13 @@ if (false) {(function () { /***/ }), -/* 24 */ +/* 25 */ /***/ (function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a