779 lines
31 KiB
JavaScript
779 lines
31 KiB
JavaScript
(() => {
|
|
|
|
function $parcel$interopDefault(a) {
|
|
return a && a.__esModule ? a.default : a;
|
|
}
|
|
|
|
function $parcel$export(e, n, v, s) {
|
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
}
|
|
|
|
var $parcel$global = globalThis;
|
|
var parcelRequire = $parcel$global["parcelRequire2d1f"];
|
|
var parcelRegister = parcelRequire.register;
|
|
parcelRegister("6ZJcz", function(module, exports) {
|
|
|
|
$parcel$export(module.exports, "setNonce", () => $517b80b872e55072$export$c5f670b24c0ae95a);
|
|
$parcel$export(module.exports, "HexColorPicker", () => $517b80b872e55072$export$a3bc3c32746e9f3a);
|
|
$parcel$export(module.exports, "HexAlphaColorPicker", () => $517b80b872e55072$export$ac2f77823341da45);
|
|
$parcel$export(module.exports, "HslaColorPicker", () => $517b80b872e55072$export$ee0b0fc8d408da1d);
|
|
$parcel$export(module.exports, "HslaStringColorPicker", () => $517b80b872e55072$export$989f0248ad966033);
|
|
$parcel$export(module.exports, "HslColorPicker", () => $517b80b872e55072$export$c737d6c85aab3af7);
|
|
$parcel$export(module.exports, "HslStringColorPicker", () => $517b80b872e55072$export$f4f988c96ece960);
|
|
$parcel$export(module.exports, "HsvaColorPicker", () => $517b80b872e55072$export$a2298f22bee4c5fd);
|
|
$parcel$export(module.exports, "HsvaStringColorPicker", () => $517b80b872e55072$export$b2c7d62665b7ee26);
|
|
$parcel$export(module.exports, "HsvColorPicker", () => $517b80b872e55072$export$580e7249020ee39f);
|
|
$parcel$export(module.exports, "HsvStringColorPicker", () => $517b80b872e55072$export$ef09412d0ef04fda);
|
|
$parcel$export(module.exports, "RgbaColorPicker", () => $517b80b872e55072$export$e9c07ef2be187cb1);
|
|
$parcel$export(module.exports, "RgbaStringColorPicker", () => $517b80b872e55072$export$be07dcc7abc11a36);
|
|
$parcel$export(module.exports, "RgbColorPicker", () => $517b80b872e55072$export$5ac2ba36722d4bd2);
|
|
$parcel$export(module.exports, "RgbStringColorPicker", () => $517b80b872e55072$export$9d70f030bf44a214);
|
|
$parcel$export(module.exports, "HexColorInput", () => $517b80b872e55072$export$9219d762117624b6);
|
|
|
|
var $63SH6 = parcelRequire("63SH6");
|
|
function $517b80b872e55072$var$u() {
|
|
return ($517b80b872e55072$var$u = Object.assign || function(e) {
|
|
for(var r = 1; r < arguments.length; r++){
|
|
var t = arguments[r];
|
|
for(var n in t)Object.prototype.hasOwnProperty.call(t, n) && (e[n] = t[n]);
|
|
}
|
|
return e;
|
|
}).apply(this, arguments);
|
|
}
|
|
function $517b80b872e55072$var$c(e, r) {
|
|
if (null == e) return {};
|
|
var t, n, o = {}, a = Object.keys(e);
|
|
for(n = 0; n < a.length; n++)r.indexOf(t = a[n]) >= 0 || (o[t] = e[t]);
|
|
return o;
|
|
}
|
|
function $517b80b872e55072$var$i(e) {
|
|
var t = (0, $63SH6.useRef)(e), n = (0, $63SH6.useRef)(function(e) {
|
|
t.current && t.current(e);
|
|
});
|
|
return t.current = e, n.current;
|
|
}
|
|
var $517b80b872e55072$var$s = function(e, r, t) {
|
|
return void 0 === r && (r = 0), void 0 === t && (t = 1), e > t ? t : e < r ? r : e;
|
|
}, $517b80b872e55072$var$f = function(e) {
|
|
return "touches" in e;
|
|
}, $517b80b872e55072$var$v = function(e) {
|
|
return e && e.ownerDocument.defaultView || self;
|
|
}, $517b80b872e55072$var$d = function(e, r, t) {
|
|
var n = e.getBoundingClientRect(), o = $517b80b872e55072$var$f(r) ? function(e, r) {
|
|
for(var t = 0; t < e.length; t++)if (e[t].identifier === r) return e[t];
|
|
return e[0];
|
|
}(r.touches, t) : r;
|
|
return {
|
|
left: $517b80b872e55072$var$s((o.pageX - (n.left + $517b80b872e55072$var$v(e).pageXOffset)) / n.width),
|
|
top: $517b80b872e55072$var$s((o.pageY - (n.top + $517b80b872e55072$var$v(e).pageYOffset)) / n.height)
|
|
};
|
|
}, $517b80b872e55072$var$h = function(e) {
|
|
!$517b80b872e55072$var$f(e) && e.preventDefault();
|
|
}, $517b80b872e55072$var$m = (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).memo(function(o) {
|
|
var a = o.onMove, l = o.onKey, s = $517b80b872e55072$var$c(o, [
|
|
"onMove",
|
|
"onKey"
|
|
]), m = (0, $63SH6.useRef)(null), g = $517b80b872e55072$var$i(a), p = $517b80b872e55072$var$i(l), b = (0, $63SH6.useRef)(null), _ = (0, $63SH6.useRef)(!1), x = (0, $63SH6.useMemo)(function() {
|
|
var e = function(e) {
|
|
$517b80b872e55072$var$h(e), ($517b80b872e55072$var$f(e) ? e.touches.length > 0 : e.buttons > 0) && m.current ? g($517b80b872e55072$var$d(m.current, e, b.current)) : t(!1);
|
|
}, r = function() {
|
|
return t(!1);
|
|
};
|
|
function t(t) {
|
|
var n = _.current, o = $517b80b872e55072$var$v(m.current), a = t ? o.addEventListener : o.removeEventListener;
|
|
a(n ? "touchmove" : "mousemove", e), a(n ? "touchend" : "mouseup", r);
|
|
}
|
|
return [
|
|
function(e) {
|
|
var r = e.nativeEvent, n = m.current;
|
|
if (n && ($517b80b872e55072$var$h(r), !function(e, r) {
|
|
return r && !$517b80b872e55072$var$f(e);
|
|
}(r, _.current) && n)) {
|
|
if ($517b80b872e55072$var$f(r)) {
|
|
_.current = !0;
|
|
var o = r.changedTouches || [];
|
|
o.length && (b.current = o[0].identifier);
|
|
}
|
|
n.focus(), g($517b80b872e55072$var$d(n, r, b.current)), t(!0);
|
|
}
|
|
},
|
|
function(e) {
|
|
var r = e.which || e.keyCode;
|
|
r < 37 || r > 40 || (e.preventDefault(), p({
|
|
left: 39 === r ? .05 : 37 === r ? -0.05 : 0,
|
|
top: 40 === r ? .05 : 38 === r ? -0.05 : 0
|
|
}));
|
|
},
|
|
t
|
|
];
|
|
}, [
|
|
p,
|
|
g
|
|
]), C = x[0], E = x[1], H = x[2];
|
|
return (0, $63SH6.useEffect)(function() {
|
|
return H;
|
|
}, [
|
|
H
|
|
]), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", $517b80b872e55072$var$u({}, s, {
|
|
onTouchStart: C,
|
|
onMouseDown: C,
|
|
className: "react-colorful__interactive",
|
|
ref: m,
|
|
onKeyDown: E,
|
|
tabIndex: 0,
|
|
role: "slider"
|
|
}));
|
|
}), $517b80b872e55072$var$g = function(e) {
|
|
return e.filter(Boolean).join(" ");
|
|
}, $517b80b872e55072$var$p = function(r) {
|
|
var t = r.color, n = r.left, o = r.top, a = void 0 === o ? .5 : o, l = $517b80b872e55072$var$g([
|
|
"react-colorful__pointer",
|
|
r.className
|
|
]);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: l,
|
|
style: {
|
|
top: 100 * a + "%",
|
|
left: 100 * n + "%"
|
|
}
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: "react-colorful__pointer-fill",
|
|
style: {
|
|
backgroundColor: t
|
|
}
|
|
}));
|
|
}, $517b80b872e55072$var$b = function(e, r, t) {
|
|
return void 0 === r && (r = 0), void 0 === t && (t = Math.pow(10, r)), Math.round(t * e) / t;
|
|
}, $517b80b872e55072$var$_ = {
|
|
grad: .9,
|
|
turn: 360,
|
|
rad: 360 / (2 * Math.PI)
|
|
}, $517b80b872e55072$var$x = function(e) {
|
|
return $517b80b872e55072$var$L($517b80b872e55072$var$C(e));
|
|
}, $517b80b872e55072$var$C = function(e) {
|
|
return "#" === e[0] && (e = e.substring(1)), e.length < 6 ? {
|
|
r: parseInt(e[0] + e[0], 16),
|
|
g: parseInt(e[1] + e[1], 16),
|
|
b: parseInt(e[2] + e[2], 16),
|
|
a: 4 === e.length ? $517b80b872e55072$var$b(parseInt(e[3] + e[3], 16) / 255, 2) : 1
|
|
} : {
|
|
r: parseInt(e.substring(0, 2), 16),
|
|
g: parseInt(e.substring(2, 4), 16),
|
|
b: parseInt(e.substring(4, 6), 16),
|
|
a: 8 === e.length ? $517b80b872e55072$var$b(parseInt(e.substring(6, 8), 16) / 255, 2) : 1
|
|
};
|
|
}, $517b80b872e55072$var$E = function(e, r) {
|
|
return void 0 === r && (r = "deg"), Number(e) * ($517b80b872e55072$var$_[r] || 1);
|
|
}, $517b80b872e55072$var$H = function(e) {
|
|
var r = /hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);
|
|
return r ? $517b80b872e55072$var$N({
|
|
h: $517b80b872e55072$var$E(r[1], r[2]),
|
|
s: Number(r[3]),
|
|
l: Number(r[4]),
|
|
a: void 0 === r[5] ? 1 : Number(r[5]) / (r[6] ? 100 : 1)
|
|
}) : {
|
|
h: 0,
|
|
s: 0,
|
|
v: 0,
|
|
a: 1
|
|
};
|
|
}, $517b80b872e55072$var$M = $517b80b872e55072$var$H, $517b80b872e55072$var$N = function(e) {
|
|
var r = e.s, t = e.l;
|
|
return {
|
|
h: e.h,
|
|
s: (r *= (t < 50 ? t : 100 - t) / 100) > 0 ? 2 * r / (t + r) * 100 : 0,
|
|
v: t + r,
|
|
a: e.a
|
|
};
|
|
}, $517b80b872e55072$var$w = function(e) {
|
|
return $517b80b872e55072$var$K($517b80b872e55072$var$I(e));
|
|
}, $517b80b872e55072$var$y = function(e) {
|
|
var r = e.s, t = e.v, n = e.a, o = (200 - r) * t / 100;
|
|
return {
|
|
h: $517b80b872e55072$var$b(e.h),
|
|
s: $517b80b872e55072$var$b(o > 0 && o < 200 ? r * t / 100 / (o <= 100 ? o : 200 - o) * 100 : 0),
|
|
l: $517b80b872e55072$var$b(o / 2),
|
|
a: $517b80b872e55072$var$b(n, 2)
|
|
};
|
|
}, $517b80b872e55072$var$q = function(e) {
|
|
var r = $517b80b872e55072$var$y(e);
|
|
return "hsl(" + r.h + ", " + r.s + "%, " + r.l + "%)";
|
|
}, $517b80b872e55072$var$k = function(e) {
|
|
var r = $517b80b872e55072$var$y(e);
|
|
return "hsla(" + r.h + ", " + r.s + "%, " + r.l + "%, " + r.a + ")";
|
|
}, $517b80b872e55072$var$I = function(e) {
|
|
var r = e.h, t = e.s, n = e.v, o = e.a;
|
|
r = r / 360 * 6, t /= 100, n /= 100;
|
|
var a = Math.floor(r), l = n * (1 - t), u = n * (1 - (r - a) * t), c = n * (1 - (1 - r + a) * t), i = a % 6;
|
|
return {
|
|
r: $517b80b872e55072$var$b(255 * [
|
|
n,
|
|
u,
|
|
l,
|
|
l,
|
|
c,
|
|
n
|
|
][i]),
|
|
g: $517b80b872e55072$var$b(255 * [
|
|
c,
|
|
n,
|
|
n,
|
|
u,
|
|
l,
|
|
l
|
|
][i]),
|
|
b: $517b80b872e55072$var$b(255 * [
|
|
l,
|
|
l,
|
|
c,
|
|
n,
|
|
n,
|
|
u
|
|
][i]),
|
|
a: $517b80b872e55072$var$b(o, 2)
|
|
};
|
|
}, $517b80b872e55072$var$O = function(e) {
|
|
var r = /hsva?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);
|
|
return r ? $517b80b872e55072$var$A({
|
|
h: $517b80b872e55072$var$E(r[1], r[2]),
|
|
s: Number(r[3]),
|
|
v: Number(r[4]),
|
|
a: void 0 === r[5] ? 1 : Number(r[5]) / (r[6] ? 100 : 1)
|
|
}) : {
|
|
h: 0,
|
|
s: 0,
|
|
v: 0,
|
|
a: 1
|
|
};
|
|
}, $517b80b872e55072$var$j = $517b80b872e55072$var$O, $517b80b872e55072$var$z = function(e) {
|
|
var r = /rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);
|
|
return r ? $517b80b872e55072$var$L({
|
|
r: Number(r[1]) / (r[2] ? 100 / 255 : 1),
|
|
g: Number(r[3]) / (r[4] ? 100 / 255 : 1),
|
|
b: Number(r[5]) / (r[6] ? 100 / 255 : 1),
|
|
a: void 0 === r[7] ? 1 : Number(r[7]) / (r[8] ? 100 : 1)
|
|
}) : {
|
|
h: 0,
|
|
s: 0,
|
|
v: 0,
|
|
a: 1
|
|
};
|
|
}, $517b80b872e55072$var$B = $517b80b872e55072$var$z, $517b80b872e55072$var$D = function(e) {
|
|
var r = e.toString(16);
|
|
return r.length < 2 ? "0" + r : r;
|
|
}, $517b80b872e55072$var$K = function(e) {
|
|
var r = e.r, t = e.g, n = e.b, o = e.a, a = o < 1 ? $517b80b872e55072$var$D($517b80b872e55072$var$b(255 * o)) : "";
|
|
return "#" + $517b80b872e55072$var$D(r) + $517b80b872e55072$var$D(t) + $517b80b872e55072$var$D(n) + a;
|
|
}, $517b80b872e55072$var$L = function(e) {
|
|
var r = e.r, t = e.g, n = e.b, o = e.a, a = Math.max(r, t, n), l = a - Math.min(r, t, n), u = l ? a === r ? (t - n) / l : a === t ? 2 + (n - r) / l : 4 + (r - t) / l : 0;
|
|
return {
|
|
h: $517b80b872e55072$var$b(60 * (u < 0 ? u + 6 : u)),
|
|
s: $517b80b872e55072$var$b(a ? l / a * 100 : 0),
|
|
v: $517b80b872e55072$var$b(a / 255 * 100),
|
|
a: o
|
|
};
|
|
}, $517b80b872e55072$var$A = function(e) {
|
|
return {
|
|
h: $517b80b872e55072$var$b(e.h),
|
|
s: $517b80b872e55072$var$b(e.s),
|
|
v: $517b80b872e55072$var$b(e.v),
|
|
a: $517b80b872e55072$var$b(e.a, 2)
|
|
};
|
|
}, $517b80b872e55072$var$S = (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).memo(function(r) {
|
|
var t = r.hue, n = r.onChange, o = $517b80b872e55072$var$g([
|
|
"react-colorful__hue",
|
|
r.className
|
|
]);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: o
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$m, {
|
|
onMove: function(e) {
|
|
n({
|
|
h: 360 * e.left
|
|
});
|
|
},
|
|
onKey: function(e) {
|
|
n({
|
|
h: $517b80b872e55072$var$s(t + 360 * e.left, 0, 360)
|
|
});
|
|
},
|
|
"aria-label": "Hue",
|
|
"aria-valuenow": $517b80b872e55072$var$b(t),
|
|
"aria-valuemax": "360",
|
|
"aria-valuemin": "0"
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$p, {
|
|
className: "react-colorful__hue-pointer",
|
|
left: t / 360,
|
|
color: $517b80b872e55072$var$q({
|
|
h: t,
|
|
s: 100,
|
|
v: 100,
|
|
a: 1
|
|
})
|
|
})));
|
|
}), $517b80b872e55072$var$T = (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).memo(function(r) {
|
|
var t = r.hsva, n = r.onChange, o = {
|
|
backgroundColor: $517b80b872e55072$var$q({
|
|
h: t.h,
|
|
s: 100,
|
|
v: 100,
|
|
a: 1
|
|
})
|
|
};
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: "react-colorful__saturation",
|
|
style: o
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$m, {
|
|
onMove: function(e) {
|
|
n({
|
|
s: 100 * e.left,
|
|
v: 100 - 100 * e.top
|
|
});
|
|
},
|
|
onKey: function(e) {
|
|
n({
|
|
s: $517b80b872e55072$var$s(t.s + 100 * e.left, 0, 100),
|
|
v: $517b80b872e55072$var$s(t.v - 100 * e.top, 0, 100)
|
|
});
|
|
},
|
|
"aria-label": "Color",
|
|
"aria-valuetext": "Saturation " + $517b80b872e55072$var$b(t.s) + "%, Brightness " + $517b80b872e55072$var$b(t.v) + "%"
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$p, {
|
|
className: "react-colorful__saturation-pointer",
|
|
top: 1 - t.v / 100,
|
|
left: t.s / 100,
|
|
color: $517b80b872e55072$var$q(t)
|
|
})));
|
|
}), $517b80b872e55072$var$F = function(e, r) {
|
|
if (e === r) return !0;
|
|
for(var t in e)if (e[t] !== r[t]) return !1;
|
|
return !0;
|
|
}, $517b80b872e55072$var$P = function(e, r) {
|
|
return e.replace(/\s/g, "") === r.replace(/\s/g, "");
|
|
}, $517b80b872e55072$var$X = function(e, r) {
|
|
return e.toLowerCase() === r.toLowerCase() || $517b80b872e55072$var$F($517b80b872e55072$var$C(e), $517b80b872e55072$var$C(r));
|
|
};
|
|
function $517b80b872e55072$var$Y(e, t, l) {
|
|
var u = $517b80b872e55072$var$i(l), c = (0, $63SH6.useState)(function() {
|
|
return e.toHsva(t);
|
|
}), s = c[0], f = c[1], v = (0, $63SH6.useRef)({
|
|
color: t,
|
|
hsva: s
|
|
});
|
|
(0, $63SH6.useEffect)(function() {
|
|
if (!e.equal(t, v.current.color)) {
|
|
var r = e.toHsva(t);
|
|
v.current = {
|
|
hsva: r,
|
|
color: t
|
|
}, f(r);
|
|
}
|
|
}, [
|
|
t,
|
|
e
|
|
]), (0, $63SH6.useEffect)(function() {
|
|
var r;
|
|
$517b80b872e55072$var$F(s, v.current.hsva) || e.equal(r = e.fromHsva(s), v.current.color) || (v.current = {
|
|
hsva: s,
|
|
color: r
|
|
}, u(r));
|
|
}, [
|
|
s,
|
|
e,
|
|
u
|
|
]);
|
|
var d = (0, $63SH6.useCallback)(function(e) {
|
|
f(function(r) {
|
|
return Object.assign({}, r, e);
|
|
});
|
|
}, []);
|
|
return [
|
|
s,
|
|
d
|
|
];
|
|
}
|
|
var $517b80b872e55072$var$R, $517b80b872e55072$var$V = "undefined" != typeof window ? (0, $63SH6.useLayoutEffect) : (0, $63SH6.useEffect), $517b80b872e55072$var$$ = function() {
|
|
return $517b80b872e55072$var$R || ("undefined" != typeof __webpack_nonce__ ? __webpack_nonce__ : void 0);
|
|
}, $517b80b872e55072$export$c5f670b24c0ae95a = function(e) {
|
|
$517b80b872e55072$var$R = e;
|
|
}, $517b80b872e55072$var$J = new Map, $517b80b872e55072$var$Q = function(e) {
|
|
$517b80b872e55072$var$V(function() {
|
|
var r = e.current ? e.current.ownerDocument : document;
|
|
if (void 0 !== r && !$517b80b872e55072$var$J.has(r)) {
|
|
var t = r.createElement("style");
|
|
t.innerHTML = '.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>\')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}', $517b80b872e55072$var$J.set(r, t);
|
|
var n = $517b80b872e55072$var$$();
|
|
n && t.setAttribute("nonce", n), r.head.appendChild(t);
|
|
}
|
|
}, []);
|
|
}, $517b80b872e55072$var$U = function(t) {
|
|
var n = t.className, o = t.colorModel, a = t.color, l = void 0 === a ? o.defaultColor : a, i = t.onChange, s = $517b80b872e55072$var$c(t, [
|
|
"className",
|
|
"colorModel",
|
|
"color",
|
|
"onChange"
|
|
]), f = (0, $63SH6.useRef)(null);
|
|
$517b80b872e55072$var$Q(f);
|
|
var v = $517b80b872e55072$var$Y(o, l, i), d = v[0], h = v[1], m = $517b80b872e55072$var$g([
|
|
"react-colorful",
|
|
n
|
|
]);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", $517b80b872e55072$var$u({}, s, {
|
|
ref: f,
|
|
className: m
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$T, {
|
|
hsva: d,
|
|
onChange: h
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$S, {
|
|
hue: d.h,
|
|
onChange: h,
|
|
className: "react-colorful__last-control"
|
|
}));
|
|
}, $517b80b872e55072$var$W = {
|
|
defaultColor: "000",
|
|
toHsva: $517b80b872e55072$var$x,
|
|
fromHsva: function(e) {
|
|
return $517b80b872e55072$var$w({
|
|
h: e.h,
|
|
s: e.s,
|
|
v: e.v,
|
|
a: 1
|
|
});
|
|
},
|
|
equal: $517b80b872e55072$var$X
|
|
}, $517b80b872e55072$export$a3bc3c32746e9f3a = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$W
|
|
}));
|
|
}, $517b80b872e55072$var$ee = function(r) {
|
|
var t = r.className, n = r.hsva, o = r.onChange, a = {
|
|
backgroundImage: "linear-gradient(90deg, " + $517b80b872e55072$var$k(Object.assign({}, n, {
|
|
a: 0
|
|
})) + ", " + $517b80b872e55072$var$k(Object.assign({}, n, {
|
|
a: 1
|
|
})) + ")"
|
|
}, l = $517b80b872e55072$var$g([
|
|
"react-colorful__alpha",
|
|
t
|
|
]), u = $517b80b872e55072$var$b(100 * n.a);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: l
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", {
|
|
className: "react-colorful__alpha-gradient",
|
|
style: a
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$m, {
|
|
onMove: function(e) {
|
|
o({
|
|
a: e.left
|
|
});
|
|
},
|
|
onKey: function(e) {
|
|
o({
|
|
a: $517b80b872e55072$var$s(n.a + e.left)
|
|
});
|
|
},
|
|
"aria-label": "Alpha",
|
|
"aria-valuetext": u + "%",
|
|
"aria-valuenow": u,
|
|
"aria-valuemin": "0",
|
|
"aria-valuemax": "100"
|
|
}, (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$p, {
|
|
className: "react-colorful__alpha-pointer",
|
|
left: n.a,
|
|
color: $517b80b872e55072$var$k(n)
|
|
})));
|
|
}, $517b80b872e55072$var$re = function(t) {
|
|
var n = t.className, o = t.colorModel, a = t.color, l = void 0 === a ? o.defaultColor : a, i = t.onChange, s = $517b80b872e55072$var$c(t, [
|
|
"className",
|
|
"colorModel",
|
|
"color",
|
|
"onChange"
|
|
]), f = (0, $63SH6.useRef)(null);
|
|
$517b80b872e55072$var$Q(f);
|
|
var v = $517b80b872e55072$var$Y(o, l, i), d = v[0], h = v[1], m = $517b80b872e55072$var$g([
|
|
"react-colorful",
|
|
n
|
|
]);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("div", $517b80b872e55072$var$u({}, s, {
|
|
ref: f,
|
|
className: m
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$T, {
|
|
hsva: d,
|
|
onChange: h
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$S, {
|
|
hue: d.h,
|
|
onChange: h
|
|
}), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$ee, {
|
|
hsva: d,
|
|
onChange: h,
|
|
className: "react-colorful__last-control"
|
|
}));
|
|
}, $517b80b872e55072$var$te = {
|
|
defaultColor: "0001",
|
|
toHsva: $517b80b872e55072$var$x,
|
|
fromHsva: $517b80b872e55072$var$w,
|
|
equal: $517b80b872e55072$var$X
|
|
}, $517b80b872e55072$export$ac2f77823341da45 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$te
|
|
}));
|
|
}, $517b80b872e55072$var$oe = {
|
|
defaultColor: {
|
|
h: 0,
|
|
s: 0,
|
|
l: 0,
|
|
a: 1
|
|
},
|
|
toHsva: $517b80b872e55072$var$N,
|
|
fromHsva: $517b80b872e55072$var$y,
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$ee0b0fc8d408da1d = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$oe
|
|
}));
|
|
}, $517b80b872e55072$var$le = {
|
|
defaultColor: "hsla(0, 0%, 0%, 1)",
|
|
toHsva: $517b80b872e55072$var$H,
|
|
fromHsva: $517b80b872e55072$var$k,
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$989f0248ad966033 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$le
|
|
}));
|
|
}, $517b80b872e55072$var$ce = {
|
|
defaultColor: {
|
|
h: 0,
|
|
s: 0,
|
|
l: 0
|
|
},
|
|
toHsva: function(e) {
|
|
return $517b80b872e55072$var$N({
|
|
h: e.h,
|
|
s: e.s,
|
|
l: e.l,
|
|
a: 1
|
|
});
|
|
},
|
|
fromHsva: function(e) {
|
|
var r;
|
|
return {
|
|
h: (r = $517b80b872e55072$var$y(e)).h,
|
|
s: r.s,
|
|
l: r.l
|
|
};
|
|
},
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$c737d6c85aab3af7 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$ce
|
|
}));
|
|
}, $517b80b872e55072$var$se = {
|
|
defaultColor: "hsl(0, 0%, 0%)",
|
|
toHsva: $517b80b872e55072$var$M,
|
|
fromHsva: $517b80b872e55072$var$q,
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$f4f988c96ece960 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$se
|
|
}));
|
|
}, $517b80b872e55072$var$ve = {
|
|
defaultColor: {
|
|
h: 0,
|
|
s: 0,
|
|
v: 0,
|
|
a: 1
|
|
},
|
|
toHsva: function(e) {
|
|
return e;
|
|
},
|
|
fromHsva: $517b80b872e55072$var$A,
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$a2298f22bee4c5fd = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$ve
|
|
}));
|
|
}, $517b80b872e55072$var$he = {
|
|
defaultColor: "hsva(0, 0%, 0%, 1)",
|
|
toHsva: $517b80b872e55072$var$O,
|
|
fromHsva: function(e) {
|
|
var r = $517b80b872e55072$var$A(e);
|
|
return "hsva(" + r.h + ", " + r.s + "%, " + r.v + "%, " + r.a + ")";
|
|
},
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$b2c7d62665b7ee26 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$he
|
|
}));
|
|
}, $517b80b872e55072$var$ge = {
|
|
defaultColor: {
|
|
h: 0,
|
|
s: 0,
|
|
v: 0
|
|
},
|
|
toHsva: function(e) {
|
|
return {
|
|
h: e.h,
|
|
s: e.s,
|
|
v: e.v,
|
|
a: 1
|
|
};
|
|
},
|
|
fromHsva: function(e) {
|
|
var r = $517b80b872e55072$var$A(e);
|
|
return {
|
|
h: r.h,
|
|
s: r.s,
|
|
v: r.v
|
|
};
|
|
},
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$580e7249020ee39f = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$ge
|
|
}));
|
|
}, $517b80b872e55072$var$be = {
|
|
defaultColor: "hsv(0, 0%, 0%)",
|
|
toHsva: $517b80b872e55072$var$j,
|
|
fromHsva: function(e) {
|
|
var r = $517b80b872e55072$var$A(e);
|
|
return "hsv(" + r.h + ", " + r.s + "%, " + r.v + "%)";
|
|
},
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$ef09412d0ef04fda = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$be
|
|
}));
|
|
}, $517b80b872e55072$var$xe = {
|
|
defaultColor: {
|
|
r: 0,
|
|
g: 0,
|
|
b: 0,
|
|
a: 1
|
|
},
|
|
toHsva: $517b80b872e55072$var$L,
|
|
fromHsva: $517b80b872e55072$var$I,
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$e9c07ef2be187cb1 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$xe
|
|
}));
|
|
}, $517b80b872e55072$var$Ee = {
|
|
defaultColor: "rgba(0, 0, 0, 1)",
|
|
toHsva: $517b80b872e55072$var$z,
|
|
fromHsva: function(e) {
|
|
var r = $517b80b872e55072$var$I(e);
|
|
return "rgba(" + r.r + ", " + r.g + ", " + r.b + ", " + r.a + ")";
|
|
},
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$be07dcc7abc11a36 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$re, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$Ee
|
|
}));
|
|
}, $517b80b872e55072$var$Me = {
|
|
defaultColor: {
|
|
r: 0,
|
|
g: 0,
|
|
b: 0
|
|
},
|
|
toHsva: function(e) {
|
|
return $517b80b872e55072$var$L({
|
|
r: e.r,
|
|
g: e.g,
|
|
b: e.b,
|
|
a: 1
|
|
});
|
|
},
|
|
fromHsva: function(e) {
|
|
var r;
|
|
return {
|
|
r: (r = $517b80b872e55072$var$I(e)).r,
|
|
g: r.g,
|
|
b: r.b
|
|
};
|
|
},
|
|
equal: $517b80b872e55072$var$F
|
|
}, $517b80b872e55072$export$5ac2ba36722d4bd2 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$Me
|
|
}));
|
|
}, $517b80b872e55072$var$we = {
|
|
defaultColor: "rgb(0, 0, 0)",
|
|
toHsva: $517b80b872e55072$var$B,
|
|
fromHsva: function(e) {
|
|
var r = $517b80b872e55072$var$I(e);
|
|
return "rgb(" + r.r + ", " + r.g + ", " + r.b + ")";
|
|
},
|
|
equal: $517b80b872e55072$var$P
|
|
}, $517b80b872e55072$export$9d70f030bf44a214 = function(r) {
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$U, $517b80b872e55072$var$u({}, r, {
|
|
colorModel: $517b80b872e55072$var$we
|
|
}));
|
|
}, $517b80b872e55072$var$qe = /^#?([0-9A-F]{3,8})$/i, $517b80b872e55072$var$ke = function(r) {
|
|
var t = r.color, l = void 0 === t ? "" : t, s = r.onChange, f = r.onBlur, v = r.escape, d = r.validate, h = r.format, m = r.process, g = $517b80b872e55072$var$c(r, [
|
|
"color",
|
|
"onChange",
|
|
"onBlur",
|
|
"escape",
|
|
"validate",
|
|
"format",
|
|
"process"
|
|
]), p = (0, $63SH6.useState)(function() {
|
|
return v(l);
|
|
}), b = p[0], _ = p[1], x = $517b80b872e55072$var$i(s), C = $517b80b872e55072$var$i(f), E = (0, $63SH6.useCallback)(function(e) {
|
|
var r = v(e.target.value);
|
|
_(r), d(r) && x(m ? m(r) : r);
|
|
}, [
|
|
v,
|
|
m,
|
|
d,
|
|
x
|
|
]), H = (0, $63SH6.useCallback)(function(e) {
|
|
d(e.target.value) || _(v(l)), C(e);
|
|
}, [
|
|
l,
|
|
v,
|
|
d,
|
|
C
|
|
]);
|
|
return (0, $63SH6.useEffect)(function() {
|
|
_(v(l));
|
|
}, [
|
|
l,
|
|
v
|
|
]), (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement("input", $517b80b872e55072$var$u({}, g, {
|
|
value: h ? h(b) : b,
|
|
spellCheck: "false",
|
|
onChange: E,
|
|
onBlur: H
|
|
}));
|
|
}, $517b80b872e55072$var$Ie = function(e) {
|
|
return "#" + e;
|
|
}, $517b80b872e55072$export$9219d762117624b6 = function(r) {
|
|
var t = r.prefixed, n = r.alpha, o = $517b80b872e55072$var$c(r, [
|
|
"prefixed",
|
|
"alpha"
|
|
]), l = (0, $63SH6.useCallback)(function(e) {
|
|
return e.replace(/([^0-9A-F]+)/gi, "").substring(0, n ? 8 : 6);
|
|
}, [
|
|
n
|
|
]), i = (0, $63SH6.useCallback)(function(e) {
|
|
return function(e, r) {
|
|
var t = $517b80b872e55072$var$qe.exec(e), n = t ? t[1].length : 0;
|
|
return 3 === n || 6 === n || !!r && 4 === n || !!r && 8 === n;
|
|
}(e, n);
|
|
}, [
|
|
n
|
|
]);
|
|
return (0, (/*@__PURE__*/$parcel$interopDefault($63SH6))).createElement($517b80b872e55072$var$ke, $517b80b872e55072$var$u({}, o, {
|
|
escape: l,
|
|
format: t ? $517b80b872e55072$var$Ie : void 0,
|
|
process: $517b80b872e55072$var$Ie,
|
|
validate: i
|
|
}));
|
|
};
|
|
|
|
});
|
|
|
|
})();
|
|
//# sourceMappingURL=index.module.15cb72f1.js.map
|