infinity-forge 3.8.8 → 3.8.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/infinity-forge.css +0 -3
- package/dist/test/index.js +41 -1
- package/dist/test/index.js.map +1 -1
- package/dist/ui/components/form/index.d.ts +1 -0
- package/dist/ui/components/form/index.js +1 -0
- package/dist/ui/components/form/index.js.map +1 -1
- package/dist/ui/components/form/input-color/index.d.ts +2 -0
- package/dist/ui/components/form/input-color/index.js +35 -0
- package/dist/ui/components/form/input-color/index.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.d.ts +5 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.js +45 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.style.d.ts +6 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.style.js +52 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Alpha/Alpha.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.d.ts +10 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.js +45 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.style.d.ts +8 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.style.js +64 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorList/ColorList.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.d.ts +13 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.js +109 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.style.d.ts +9 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.style.js +58 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/helper.d.ts +3 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/helper.js +55 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/helper.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.d.ts +7 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.js +45 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.style.d.ts +4 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.style.js +30 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.d.ts +16 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.js +53 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.style.d.ts +5 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.style.js +38 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/PresetList/PresetList.d.ts +8 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/PresetList/PresetList.js +57 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/PresetList/PresetList.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.d.ts +7 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.js +57 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.style.d.ts +5 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.style.js +35 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.style.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/hooks/usePosition.d.ts +13 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/hooks/usePosition.js +47 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/hooks/usePosition.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/index.d.ts +7 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/index.js +14 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/index.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/themes.d.ts +7 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/themes.js +24 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/themes.js.map +1 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/types.d.ts +39 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/types.js +3 -0
- package/dist/ui/components/form/input-color/react-input-color-lib/types.js.map +1 -0
- package/package.json +2 -1
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.inputs = exports.colors = exports.ranges = exports.flex = exports.value = exports.valueWrapper = exports.checkboard = exports.container = void 0;
|
|
4
|
+
exports.container = {
|
|
5
|
+
background: 'var(--rpc-background)',
|
|
6
|
+
boxShadow: 'var(--rpc-box-shadow)',
|
|
7
|
+
borderRadius: 'var(--rpc-border-radius)',
|
|
8
|
+
width: 'var(--rpc-width)',
|
|
9
|
+
minWidth: '280px',
|
|
10
|
+
border: '1px solid var(--rpc-border-color)'
|
|
11
|
+
};
|
|
12
|
+
exports.checkboard = {
|
|
13
|
+
position: 'relative',
|
|
14
|
+
width: '25px',
|
|
15
|
+
height: '25px',
|
|
16
|
+
borderRadius: 'var(--rpc-border-radius)',
|
|
17
|
+
overflow: 'hidden',
|
|
18
|
+
boxShadow: 'inset 0 0 2px 0px rgba(0, 0, 0, .2)',
|
|
19
|
+
backgroundImage: 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAC9JREFUOBFjZGBgEAFifOANPkkmfJLEyI0awMAw8GHASERU4U0nA++FURdQISEBAFeUATP+HuV8AAAAAElFTkSuQmCC")',
|
|
20
|
+
backgroundPosition: 'left center'
|
|
21
|
+
};
|
|
22
|
+
exports.valueWrapper = {
|
|
23
|
+
background: 'var(--rpc-input-background)',
|
|
24
|
+
borderRadius: 'var(--rpc-border-radius)'
|
|
25
|
+
};
|
|
26
|
+
exports.value = {
|
|
27
|
+
position: 'absolute',
|
|
28
|
+
top: '0px',
|
|
29
|
+
right: '0px',
|
|
30
|
+
bottom: '0px',
|
|
31
|
+
left: '0px',
|
|
32
|
+
background: 'var(--rpc-rgba)',
|
|
33
|
+
zIndex: 1,
|
|
34
|
+
border: '1px solid var(--rpc-border-color)',
|
|
35
|
+
borderRadius: 'var(--rpc-border-radius)'
|
|
36
|
+
};
|
|
37
|
+
exports.flex = {
|
|
38
|
+
margin: '0.4rem 0.4rem',
|
|
39
|
+
width: 'calc(100% - 0.8rem)',
|
|
40
|
+
display: 'flex',
|
|
41
|
+
alignItems: 'center',
|
|
42
|
+
justifyContent: 'center',
|
|
43
|
+
flexWrap: 'wrap'
|
|
44
|
+
};
|
|
45
|
+
exports.ranges = {
|
|
46
|
+
flexGrow: 2,
|
|
47
|
+
marginLeft: '0.4rem'
|
|
48
|
+
};
|
|
49
|
+
exports.colors = {
|
|
50
|
+
margin: '0 0.5rem 0 0'
|
|
51
|
+
};
|
|
52
|
+
exports.inputs = {
|
|
53
|
+
margin: '0 0.3rem 0.3rem',
|
|
54
|
+
display: 'flex',
|
|
55
|
+
alignItems: 'center',
|
|
56
|
+
justifyContent: 'space-between'
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=ColorPicker.style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColorPicker.style.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/ColorPicker.style.ts"],"names":[],"mappings":";;;AAEa,QAAA,SAAS,GAAwB;IAC5C,UAAU,EAAE,uBAAuB;IACnC,SAAS,EAAE,uBAAuB;IAClC,YAAY,EAAE,0BAA0B;IACxC,KAAK,EAAE,kBAAkB;IACzB,QAAQ,EAAE,OAAO;IACjB,MAAM,EAAE,mCAAmC;CAC5C,CAAC;AAEW,QAAA,UAAU,GAAwB;IAC7C,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,0BAA0B;IACxC,QAAQ,EAAE,QAAQ;IAClB,SAAS,EAAE,qCAAqC;IAChD,eAAe,EACb,2LAA2L;IAC7L,kBAAkB,EAAE,aAAa;CAClC,CAAC;AAEW,QAAA,YAAY,GAAwB;IAC/C,UAAU,EAAE,6BAA6B;IACzC,YAAY,EAAE,0BAA0B;CACzC,CAAC;AACW,QAAA,KAAK,GAAwB;IACxC,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,KAAK;IACV,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,KAAK;IACX,UAAU,EAAE,iBAAiB;IAC7B,MAAM,EAAE,CAAC;IACT,MAAM,EAAE,mCAAmC;IAC3C,YAAY,EAAE,0BAA0B;CACzC,CAAC;AAEW,QAAA,IAAI,GAAwB;IACvC,MAAM,EAAE,eAAe;IACvB,KAAK,EAAE,qBAAqB;IAC5B,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,QAAQ;IACxB,QAAQ,EAAE,MAAM;CACjB,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,QAAQ,EAAE,CAAC;IACX,UAAU,EAAE,QAAQ;CACrB,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,MAAM,EAAE,cAAc;CACvB,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,MAAM,EAAE,iBAAiB;IACzB,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,eAAe;CAChC,CAAC"}
|
package/dist/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/helper.js
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.getColorCombination = exports.initColor = void 0;
|
|
7
|
+
var tinycolor2_1 = __importDefault(require("tinycolor2"));
|
|
8
|
+
var initColor = function (col) {
|
|
9
|
+
var color = (0, tinycolor2_1.default)(col);
|
|
10
|
+
var isValidColor = color.isValid();
|
|
11
|
+
if (!isValidColor) {
|
|
12
|
+
return {
|
|
13
|
+
hex: '#000000',
|
|
14
|
+
rgb: { r: 0, g: 0, b: 0, a: 1 },
|
|
15
|
+
hsl: { h: 0, s: 0, l: 0, a: 1 },
|
|
16
|
+
hsv: { h: 0, s: 0, v: 0, a: 1 },
|
|
17
|
+
alpha: 1
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
return {
|
|
21
|
+
hex: color.toHexString(),
|
|
22
|
+
rgb: color.toRgb(),
|
|
23
|
+
hsl: color.toHsl(),
|
|
24
|
+
hsv: color.toHsv(),
|
|
25
|
+
alpha: color.getAlpha()
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
exports.initColor = initColor;
|
|
29
|
+
var getColorCombination = function (color, comb) {
|
|
30
|
+
var hex = color.hex;
|
|
31
|
+
var col = (0, tinycolor2_1.default)(hex);
|
|
32
|
+
var all = typeof comb === 'string' ? [comb] : comb;
|
|
33
|
+
var combs = [];
|
|
34
|
+
all.forEach(function (item) {
|
|
35
|
+
if (item === 'analogous') {
|
|
36
|
+
return col.analogous().forEach(function (t) { return combs.push(t.toHexString()); });
|
|
37
|
+
}
|
|
38
|
+
if (item === 'monochromatic') {
|
|
39
|
+
return col.monochromatic().forEach(function (t) { return combs.push(t.toHexString()); });
|
|
40
|
+
}
|
|
41
|
+
if (item === 'splitcomplement') {
|
|
42
|
+
return col.splitcomplement().forEach(function (t) { return combs.push(t.toHexString()); });
|
|
43
|
+
}
|
|
44
|
+
if (item === 'tetrad') {
|
|
45
|
+
return col.tetrad().forEach(function (t) { return combs.push(t.toHexString()); });
|
|
46
|
+
}
|
|
47
|
+
if (item === 'triad') {
|
|
48
|
+
return col.triad().forEach(function (t) { return combs.push(t.toHexString()); });
|
|
49
|
+
}
|
|
50
|
+
return combs.push(col.complement().toHexString());
|
|
51
|
+
});
|
|
52
|
+
return combs;
|
|
53
|
+
};
|
|
54
|
+
exports.getColorCombination = getColorCombination;
|
|
55
|
+
//# sourceMappingURL=helper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"helper.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/ColorPicker/helper.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
+
};
|
|
28
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
30
|
+
var react_1 = __importStar(require("react"));
|
|
31
|
+
var styles = __importStar(require("./Hue.style.js"));
|
|
32
|
+
var usePosition_1 = __importDefault(require("../../hooks/usePosition.js"));
|
|
33
|
+
var Hue = function (_a) {
|
|
34
|
+
var hsl = _a.hsl, onChange = _a.onChange;
|
|
35
|
+
var handleMove = (0, react_1.useCallback)(function (_a) {
|
|
36
|
+
var left = _a.left;
|
|
37
|
+
return onChange && onChange({ h: 360 * left, s: hsl.s, l: hsl.l, a: hsl.a });
|
|
38
|
+
}, [onChange]);
|
|
39
|
+
var _b = (0, usePosition_1.default)({
|
|
40
|
+
onMove: handleMove
|
|
41
|
+
}), ref = _b.ref, handleStart = _b.handleStart;
|
|
42
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: styles.container, ref: ref, onTouchStart: handleStart, onMouseDown: handleStart, children: (0, jsx_runtime_1.jsx)("div", { style: styles.pointer, children: (0, jsx_runtime_1.jsx)("div", { style: styles.slider }) }) }));
|
|
43
|
+
};
|
|
44
|
+
exports.default = react_1.default.memo(Hue);
|
|
45
|
+
//# sourceMappingURL=Hue.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Hue.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA2C;AAI3C,kDAAsC;AACtC,wEAAgE;AAOhE,IAAM,GAAG,GAAG,UAAC,EAA2B;QAAzB,GAAG,SAAA,EAAE,QAAQ,cAAA;IAC1B,IAAM,UAAU,GAAG,IAAA,mBAAW,EAC5B,UAAC,EAAkB;YAAhB,IAAI,UAAA;QAAiB,OAAA,QAAQ,IAAI,QAAQ,CAAC,EAAE,CAAC,EAAE,GAAG,GAAG,IAAI,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC;IAArE,CAAqE,EAC7F,CAAC,QAAQ,CAAC,CACX,CAAC;IAEI,IAAA,KAAuB,IAAA,qBAAW,EAAC;QACvC,MAAM,EAAE,UAAU;KACnB,CAAC,EAFM,GAAG,SAAA,EAAE,WAAW,iBAEtB,CAAC;IAEH,OAAO,CACL,gCAAK,KAAK,EAAE,MAAM,CAAC,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,YACzF,gCAAK,KAAK,EAAE,MAAM,CAAC,OAAO,YACxB,gCAAK,KAAK,EAAE,MAAM,CAAC,MAAM,GAAI,GACzB,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,IAAI,CAAC,GAAG,CAAe,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.slider = exports.pointer = exports.container = void 0;
|
|
4
|
+
exports.container = {
|
|
5
|
+
width: '100%',
|
|
6
|
+
height: '8px',
|
|
7
|
+
background: 'linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)',
|
|
8
|
+
boxShadow: 'inset 0 0 1px rgba(0, 0, 0, .2)',
|
|
9
|
+
position: 'relative',
|
|
10
|
+
borderRadius: '4px'
|
|
11
|
+
};
|
|
12
|
+
exports.pointer = {
|
|
13
|
+
width: 'calc(100% - 8px)',
|
|
14
|
+
height: '100%',
|
|
15
|
+
position: 'relative',
|
|
16
|
+
marginLeft: '8px'
|
|
17
|
+
};
|
|
18
|
+
exports.slider = {
|
|
19
|
+
width: '12px',
|
|
20
|
+
borderRadius: '12px',
|
|
21
|
+
height: '12px',
|
|
22
|
+
boxSizing: 'border-box',
|
|
23
|
+
boxShadow: '0 0 1px rgba(0, 0, 0, .9)',
|
|
24
|
+
border: '2px solid #fff',
|
|
25
|
+
position: 'absolute',
|
|
26
|
+
transform: 'translate(-2px, -2px)',
|
|
27
|
+
cursor: 'pointer',
|
|
28
|
+
left: 'calc(var(--rpc-hue-pointer) - 8px)'
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=Hue.style.js.map
|
package/dist/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.style.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Hue.style.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Hue/Hue.style.ts"],"names":[],"mappings":";;;AAEa,QAAA,SAAS,GAAwB;IAC5C,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,KAAK;IACb,UAAU,EACR,iGAAiG;IACnG,SAAS,EAAE,iCAAiC;IAC5C,QAAQ,EAAE,UAAU;IACpB,YAAY,EAAE,KAAK;CACpB,CAAC;AAEW,QAAA,OAAO,GAAwB;IAC1C,KAAK,EAAE,kBAAkB;IACzB,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,UAAU;IACpB,UAAU,EAAE,KAAK;CAClB,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,KAAK,EAAE,MAAM;IACb,YAAY,EAAE,MAAM;IACpB,MAAM,EAAE,MAAM;IACd,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,2BAA2B;IACtC,MAAM,EAAE,gBAAgB;IACxB,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,uBAAuB;IAClC,MAAM,EAAE,SAAS;IACjB,IAAI,EAAE,oCAAoC;CAC3C,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
type InputProps = {
|
|
2
|
+
name: string;
|
|
3
|
+
value: string | number;
|
|
4
|
+
type?: 'number' | 'text';
|
|
5
|
+
label: string;
|
|
6
|
+
onChange: (value: string) => void;
|
|
7
|
+
onBlur?: (value: string) => void;
|
|
8
|
+
min?: number;
|
|
9
|
+
max?: number;
|
|
10
|
+
step?: number;
|
|
11
|
+
prefix?: string;
|
|
12
|
+
maxLength?: number;
|
|
13
|
+
size?: 'small' | 'large';
|
|
14
|
+
};
|
|
15
|
+
declare const _default: ({ name, value, type, label, prefix, min, max, step, maxLength, size, onChange, onBlur }: InputProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export default _default;
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
+
}
|
|
19
|
+
Object.defineProperty(o, k2, desc);
|
|
20
|
+
}) : (function(o, m, k, k2) {
|
|
21
|
+
if (k2 === undefined) k2 = k;
|
|
22
|
+
o[k2] = m[k];
|
|
23
|
+
}));
|
|
24
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
+
}) : function(o, v) {
|
|
27
|
+
o["default"] = v;
|
|
28
|
+
});
|
|
29
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
+
if (mod && mod.__esModule) return mod;
|
|
31
|
+
var result = {};
|
|
32
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
+
__setModuleDefault(result, mod);
|
|
34
|
+
return result;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
|
+
var react_1 = __importDefault(require("react"));
|
|
42
|
+
var styles = __importStar(require("./Input.style.js"));
|
|
43
|
+
var Input = function (_a) {
|
|
44
|
+
var name = _a.name, value = _a.value, _b = _a.type, type = _b === void 0 ? 'text' : _b, label = _a.label, prefix = _a.prefix, min = _a.min, max = _a.max, step = _a.step, maxLength = _a.maxLength, _c = _a.size, size = _c === void 0 ? 'small' : _c, onChange = _a.onChange, onBlur = _a.onBlur;
|
|
45
|
+
var width = size === 'small' ? '42px' : '54px';
|
|
46
|
+
return ((0, jsx_runtime_1.jsxs)("label", { style: styles.label, children: [(0, jsx_runtime_1.jsxs)("div", { style: styles.wrapper, children: [prefix && (0, jsx_runtime_1.jsx)("span", { style: styles.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("input", { autoComplete: "off", type: type, name: name, value: value, onChange: function (e) { return onChange(e.target.value); }, onBlur: function (e) {
|
|
47
|
+
if (onBlur)
|
|
48
|
+
return onBlur(e.target.value);
|
|
49
|
+
onChange(e.target.value);
|
|
50
|
+
}, style: __assign(__assign({}, styles.input), { width: width }), spellCheck: false, maxLength: maxLength, min: min, max: max, step: step })] }), (0, jsx_runtime_1.jsx)("span", { children: label })] }));
|
|
51
|
+
};
|
|
52
|
+
exports.default = react_1.default.memo(Input);
|
|
53
|
+
//# sourceMappingURL=Input.js.map
|
package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,oDAAwC;AAiBxC,IAAM,KAAK,GAAG,UAAC,EAaF;QAZX,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,YAAa,EAAb,IAAI,mBAAG,MAAM,KAAA,EACb,KAAK,WAAA,EACL,MAAM,YAAA,EACN,GAAG,SAAA,EACH,GAAG,SAAA,EACH,IAAI,UAAA,EACJ,SAAS,eAAA,EACT,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EACd,QAAQ,cAAA,EACR,MAAM,YAAA;IAEN,IAAM,KAAK,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC;IACjD,OAAO,CACL,mCAAO,KAAK,EAAE,MAAM,CAAC,KAAK,aACxB,iCAAK,KAAK,EAAE,MAAM,CAAC,OAAO,aACvB,MAAM,IAAI,iCAAM,KAAK,EAAE,MAAM,CAAC,MAAM,YAAG,MAAM,GAAQ,EACtD,kCACE,YAAY,EAAC,KAAK,EAClB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,UAAA,CAAC,IAAI,OAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAxB,CAAwB,EACvC,MAAM,EAAE,UAAA,CAAC;4BACP,IAAI,MAAM;gCAAE,OAAO,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;4BAC1C,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;wBAC3B,CAAC,EACD,KAAK,wBAAO,MAAM,CAAC,KAAK,KAAE,KAAK,OAAA,KAC/B,UAAU,EAAE,KAAK,EACjB,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,GACV,IACE,EAEN,2CAAO,KAAK,GAAQ,IACd,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,IAAI,CAAC,KAAK,CAAiB,CAAC"}
|
package/dist/ui/components/form/input-color/react-input-color-lib/components/Input/Input.style.js
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.label = exports.prefix = exports.input = exports.wrapper = void 0;
|
|
4
|
+
exports.wrapper = {
|
|
5
|
+
display: 'flex',
|
|
6
|
+
alignItems: 'center',
|
|
7
|
+
color: 'var(--rpc-color)',
|
|
8
|
+
border: '1px solid var(--rpc-border-color)',
|
|
9
|
+
borderRadius: 'var(--rpc-border-radius)',
|
|
10
|
+
margin: '0.1rem',
|
|
11
|
+
background: 'var(--rpc-input-background)'
|
|
12
|
+
};
|
|
13
|
+
exports.input = {
|
|
14
|
+
width: '45px',
|
|
15
|
+
background: 'none',
|
|
16
|
+
color: 'var(--rpc-color)',
|
|
17
|
+
border: 'none',
|
|
18
|
+
borderRadius: 'var(--rpc-border-radius)',
|
|
19
|
+
padding: '5px',
|
|
20
|
+
fontSize: '10px',
|
|
21
|
+
margin: '0',
|
|
22
|
+
textTransform: 'uppercase',
|
|
23
|
+
boxSizing: 'border-box'
|
|
24
|
+
};
|
|
25
|
+
exports.prefix = {
|
|
26
|
+
paddingLeft: '5px',
|
|
27
|
+
fontSize: '10px',
|
|
28
|
+
color: 'var(--rpc-borderColor)'
|
|
29
|
+
};
|
|
30
|
+
exports.label = {
|
|
31
|
+
display: 'flex',
|
|
32
|
+
flexDirection: 'column',
|
|
33
|
+
alignItems: 'center',
|
|
34
|
+
fontFamily: 'sans-serif',
|
|
35
|
+
fontSize: '10px',
|
|
36
|
+
color: 'var(--rpc-color)'
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=Input.style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.style.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Input/Input.style.ts"],"names":[],"mappings":";;;AAAa,QAAA,OAAO,GAAwB;IAC1C,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,KAAK,EAAE,kBAAkB;IACzB,MAAM,EAAE,mCAAmC;IAC3C,YAAY,EAAE,0BAA0B;IACxC,MAAM,EAAE,QAAQ;IAChB,UAAU,EAAE,6BAA6B;CAC1C,CAAC;AAEW,QAAA,KAAK,GAAwB;IACxC,KAAK,EAAE,MAAM;IACb,UAAU,EAAE,MAAM;IAClB,KAAK,EAAE,kBAAkB;IACzB,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,0BAA0B;IACxC,OAAO,EAAE,KAAK;IACd,QAAQ,EAAE,MAAM;IAChB,MAAM,EAAE,GAAG;IACX,aAAa,EAAE,WAAW;IAC1B,SAAS,EAAE,YAAY;CACxB,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,WAAW,EAAE,KAAK;IAClB,QAAQ,EAAE,MAAM;IAChB,KAAK,EAAE,wBAAwB;CAChC,CAAC;AAEW,QAAA,KAAK,GAAwB;IACxC,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,YAAY;IACxB,QAAQ,EAAE,MAAM;IAChB,KAAK,EAAE,kBAAkB;CAC1B,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { RgbColor, Color } from '../../types.js';
|
|
2
|
+
type PresetListProps = {
|
|
3
|
+
colors: Color[];
|
|
4
|
+
onClick: (color: RgbColor) => void;
|
|
5
|
+
currentColor: RgbColor;
|
|
6
|
+
};
|
|
7
|
+
declare const _default: ({ colors, onClick, currentColor }: PresetListProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default _default;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
26
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
27
|
+
if (ar || !(i in from)) {
|
|
28
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
29
|
+
ar[i] = from[i];
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
33
|
+
};
|
|
34
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
35
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
36
|
+
};
|
|
37
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
39
|
+
var react_1 = __importStar(require("react"));
|
|
40
|
+
var ColorList_1 = __importDefault(require("../ColorList/ColorList.js"));
|
|
41
|
+
var PresetList = function (_a) {
|
|
42
|
+
var colors = _a.colors, onClick = _a.onClick, currentColor = _a.currentColor;
|
|
43
|
+
var _b = (0, react_1.useState)([]), localColors = _b[0], setLocalColors = _b[1];
|
|
44
|
+
(0, react_1.useEffect)(function () {
|
|
45
|
+
var local = JSON.parse(window.localStorage.getItem('rpc-presets') || '[]');
|
|
46
|
+
if (Array.isArray(local))
|
|
47
|
+
setLocalColors(local);
|
|
48
|
+
}, []);
|
|
49
|
+
var addPreset = (0, react_1.useCallback)(function () {
|
|
50
|
+
var newPresets = __spreadArray(__spreadArray([], localColors, true), [currentColor], false);
|
|
51
|
+
window.localStorage.setItem('rpc-presets', JSON.stringify(newPresets));
|
|
52
|
+
setLocalColors(newPresets);
|
|
53
|
+
}, [colors, currentColor]);
|
|
54
|
+
return (0, jsx_runtime_1.jsx)(ColorList_1.default, { onClick: onClick, colors: __spreadArray(__spreadArray([], colors, true), localColors, true), onAdd: addPreset });
|
|
55
|
+
};
|
|
56
|
+
exports.default = react_1.default.memo(PresetList);
|
|
57
|
+
//# sourceMappingURL=PresetList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PresetList.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/PresetList/PresetList.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAgE;AAGhE,qEAA+C;AAQ/C,IAAM,UAAU,GAAG,UAAC,EAAkD;QAAhD,MAAM,YAAA,EAAE,OAAO,aAAA,EAAE,YAAY,kBAAA;IAC3C,IAAA,KAAgC,IAAA,gBAAQ,EAAa,EAAE,CAAC,EAAvD,WAAW,QAAA,EAAE,cAAc,QAA4B,CAAC;IAE/D,IAAA,iBAAS,EAAC;QACR,IAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,IAAI,CAAe,CAAC;QAE3F,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;YAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IAClD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAM,SAAS,GAAG,IAAA,mBAAW,EAAC;QAC5B,IAAM,UAAU,mCAAO,WAAW,UAAE,YAAY,SAAC,CAAC;QAClD,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;QACvE,cAAc,CAAC,UAAU,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC;IAE3B,OAAO,uBAAC,mBAAS,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAM,MAAM,SAAK,WAAW,SAAG,KAAK,EAAE,SAAS,GAAI,CAAC;AAChG,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,IAAI,CAAC,UAAU,CAAsB,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HslColor, HsvColor } from '../../types.js';
|
|
2
|
+
export type SaturationProps = {
|
|
3
|
+
hsl: HslColor;
|
|
4
|
+
onChange?: (color: HsvColor) => void;
|
|
5
|
+
};
|
|
6
|
+
declare const _default: ({ hsl, onChange }: SaturationProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
+
}
|
|
19
|
+
Object.defineProperty(o, k2, desc);
|
|
20
|
+
}) : (function(o, m, k, k2) {
|
|
21
|
+
if (k2 === undefined) k2 = k;
|
|
22
|
+
o[k2] = m[k];
|
|
23
|
+
}));
|
|
24
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
+
}) : function(o, v) {
|
|
27
|
+
o["default"] = v;
|
|
28
|
+
});
|
|
29
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
+
if (mod && mod.__esModule) return mod;
|
|
31
|
+
var result = {};
|
|
32
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
+
__setModuleDefault(result, mod);
|
|
34
|
+
return result;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
|
+
var react_1 = __importStar(require("react"));
|
|
42
|
+
var usePosition_1 = __importDefault(require("../../hooks/usePosition.js"));
|
|
43
|
+
var styles = __importStar(require("./Saturation.style.js"));
|
|
44
|
+
var Saturation = function (_a) {
|
|
45
|
+
var hsl = _a.hsl, onChange = _a.onChange;
|
|
46
|
+
var handleMove = (0, react_1.useCallback)(function (_a) {
|
|
47
|
+
var left = _a.left, top = _a.top;
|
|
48
|
+
return onChange &&
|
|
49
|
+
onChange(__assign(__assign({}, hsl), { s: left, v: 1 - top }));
|
|
50
|
+
}, [onChange]);
|
|
51
|
+
var _b = (0, usePosition_1.default)({
|
|
52
|
+
onMove: handleMove
|
|
53
|
+
}), ref = _b.ref, handleStart = _b.handleStart;
|
|
54
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: styles.color, ref: ref, onTouchStart: handleStart, onMouseDown: handleStart, children: [(0, jsx_runtime_1.jsx)("style", { children: "\n .saturation-white {\n background: -webkit-linear-gradient(to right, #fff, rgba(255,255,255,0));\n background: linear-gradient(to right, #fff, rgba(255,255,255,0));\n }\n .saturation-black {\n background: -webkit-linear-gradient(to top, #000, rgba(0,0,0,0));\n background: linear-gradient(to top, #000, rgba(0,0,0,0));\n }\n " }), (0, jsx_runtime_1.jsxs)("div", { style: styles.gradient, className: "saturation-white", children: [(0, jsx_runtime_1.jsx)("div", { style: styles.gradient, className: "saturation-black" }), (0, jsx_runtime_1.jsx)("div", { style: styles.pointer, children: (0, jsx_runtime_1.jsx)("div", { style: styles.circle }) })] })] }));
|
|
55
|
+
};
|
|
56
|
+
exports.default = react_1.default.memo(Saturation);
|
|
57
|
+
//# sourceMappingURL=Saturation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Saturation.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA2C;AAG3C,wEAAgE;AAEhE,yDAA6C;AAO7C,IAAM,UAAU,GAAG,UAAC,EAAkC;QAAhC,GAAG,SAAA,EAAE,QAAQ,cAAA;IACjC,IAAM,UAAU,GAAG,IAAA,mBAAW,EAC5B,UAAC,EAAuB;YAArB,IAAI,UAAA,EAAE,GAAG,SAAA;QACV,OAAA,QAAQ;YACR,QAAQ,uBACH,GAAG,KACN,CAAC,EAAE,IAAI,EACP,CAAC,EAAE,CAAC,GAAG,GAAG,IACV;IALF,CAKE,EACJ,CAAC,QAAQ,CAAC,CACX,CAAC;IAEI,IAAA,KAAuB,IAAA,qBAAW,EAAC;QACvC,MAAM,EAAE,UAAU;KACnB,CAAC,EAFM,GAAG,SAAA,EAAE,WAAW,iBAEtB,CAAC;IAEH,OAAO,CACL,iCAAK,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,aACrF,4CAAQ,gZASL,GAAS,EACZ,iCAAK,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,SAAS,EAAC,kBAAkB,aACvD,gCAAK,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,SAAS,EAAC,kBAAkB,GAAG,EAC5D,gCAAK,KAAK,EAAE,MAAM,CAAC,OAAO,YACxB,gCAAK,KAAK,EAAE,MAAM,CAAC,MAAM,GAAI,GACzB,IACF,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,IAAI,CAAC,UAAU,CAAsB,CAAC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.circle = exports.pointer = exports.color = exports.gradient = void 0;
|
|
4
|
+
exports.gradient = {
|
|
5
|
+
position: 'absolute',
|
|
6
|
+
top: 0,
|
|
7
|
+
left: 0,
|
|
8
|
+
bottom: 0,
|
|
9
|
+
right: 0
|
|
10
|
+
};
|
|
11
|
+
exports.color = {
|
|
12
|
+
width: 'calc(100% - 0.8rem)',
|
|
13
|
+
height: '200px',
|
|
14
|
+
margin: '0.4rem',
|
|
15
|
+
position: 'relative',
|
|
16
|
+
background: "hsl(var(--rpc-hue),100%, 50%)",
|
|
17
|
+
borderRadius: 'var(--rpc-border-radius)',
|
|
18
|
+
border: '1px solid var(--rpc-border-color)',
|
|
19
|
+
overflow: 'hidden'
|
|
20
|
+
};
|
|
21
|
+
exports.pointer = {
|
|
22
|
+
position: 'absolute',
|
|
23
|
+
cursor: 'hand',
|
|
24
|
+
top: 'var(--rpc-saturation-pointer-top)',
|
|
25
|
+
left: 'var(--rpc-saturation-pointer-left)'
|
|
26
|
+
};
|
|
27
|
+
exports.circle = {
|
|
28
|
+
width: '12px',
|
|
29
|
+
borderRadius: '12px',
|
|
30
|
+
height: '12px',
|
|
31
|
+
boxSizing: 'border-box',
|
|
32
|
+
boxShadow: '0 0 1px rgba(0, 0, 0, .9)',
|
|
33
|
+
border: '2px solid #fff'
|
|
34
|
+
};
|
|
35
|
+
//# sourceMappingURL=Saturation.style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Saturation.style.js","sourceRoot":"","sources":["../../../../../../../../src/ui/components/form/input-color/react-input-color-lib/components/Saturation/Saturation.style.ts"],"names":[],"mappings":";;;AAEa,QAAA,QAAQ,GAAwB;IAC3C,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;CACT,CAAC;AAEW,QAAA,KAAK,GAAwB;IACxC,KAAK,EAAE,qBAAqB;IAC5B,MAAM,EAAE,OAAO;IACf,MAAM,EAAE,QAAQ;IAChB,QAAQ,EAAE,UAAU;IACpB,UAAU,EAAE,+BAA+B;IAC3C,YAAY,EAAE,0BAA0B;IACxC,MAAM,EAAE,mCAAmC;IAC3C,QAAQ,EAAE,QAAQ;CACnB,CAAC;AAEW,QAAA,OAAO,GAAwB;IAC1C,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,MAAM;IACd,GAAG,EAAE,mCAAmC;IACxC,IAAI,EAAE,oCAAoC;CAC3C,CAAC;AAEW,QAAA,MAAM,GAAwB;IACzC,KAAK,EAAE,MAAM;IACb,YAAY,EAAE,MAAM;IACpB,MAAM,EAAE,MAAM;IACd,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,2BAA2B;IACtC,MAAM,EAAE,gBAAgB;CACzB,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export type Position = {
|
|
3
|
+
left: number;
|
|
4
|
+
top: number;
|
|
5
|
+
};
|
|
6
|
+
export type usePositionProps = {
|
|
7
|
+
onMove: (value: Position) => void;
|
|
8
|
+
};
|
|
9
|
+
declare const usePosition: ({ onMove }: usePositionProps) => {
|
|
10
|
+
ref: import("react").MutableRefObject<HTMLDivElement>;
|
|
11
|
+
handleStart: (e: React.MouseEvent | React.TouchEvent) => void;
|
|
12
|
+
};
|
|
13
|
+
export default usePosition;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var react_1 = require("react");
|
|
4
|
+
var limit = function (number) { return (number > 1 ? 1 : number < 0 ? 0 : number); };
|
|
5
|
+
var usePosition = function (_a) {
|
|
6
|
+
var onMove = _a.onMove;
|
|
7
|
+
var _b = (0, react_1.useState)(false), dragging = _b[0], setDragging = _b[1];
|
|
8
|
+
var ref = (0, react_1.useRef)(null);
|
|
9
|
+
var getPosition = (0, react_1.useCallback)(function (e) {
|
|
10
|
+
if (!ref.current)
|
|
11
|
+
return { left: 0, top: 0 };
|
|
12
|
+
var _a = ref.current.getBoundingClientRect(), width = _a.width, left = _a.left, top = _a.top, height = _a.height;
|
|
13
|
+
var _b = e.pageX && typeof e.pageX === 'number'
|
|
14
|
+
? e
|
|
15
|
+
: e.touches[0], pageX = _b.pageX, pageY = _b.pageY;
|
|
16
|
+
return {
|
|
17
|
+
left: limit((pageX - (left + window.pageXOffset)) / width),
|
|
18
|
+
top: limit((pageY - (top + window.pageYOffset)) / height)
|
|
19
|
+
};
|
|
20
|
+
}, []);
|
|
21
|
+
var handleMove = (0, react_1.useCallback)(function (e) {
|
|
22
|
+
e.preventDefault();
|
|
23
|
+
if (ref.current)
|
|
24
|
+
onMove(getPosition(e));
|
|
25
|
+
}, [onMove, getPosition]);
|
|
26
|
+
var handleStart = (0, react_1.useCallback)(function (e) {
|
|
27
|
+
onMove(getPosition(e));
|
|
28
|
+
setDragging(true);
|
|
29
|
+
}, [onMove, getPosition]);
|
|
30
|
+
var handleEnd = (0, react_1.useCallback)(function () { return setDragging(false); }, []);
|
|
31
|
+
var initEvents = (0, react_1.useCallback)(function (dragged) {
|
|
32
|
+
var event = dragged ? document.addEventListener : document.removeEventListener;
|
|
33
|
+
event('mousemove', handleMove);
|
|
34
|
+
event('touchmove', handleMove);
|
|
35
|
+
event('mouseup', handleEnd);
|
|
36
|
+
event('touchend', handleEnd);
|
|
37
|
+
}, [handleMove, handleEnd]);
|
|
38
|
+
(0, react_1.useLayoutEffect)(function () {
|
|
39
|
+
initEvents(dragging);
|
|
40
|
+
return function () {
|
|
41
|
+
dragging && initEvents(false);
|
|
42
|
+
};
|
|
43
|
+
}, [dragging, initEvents]);
|
|
44
|
+
return { ref: ref, handleStart: handleStart };
|
|
45
|
+
};
|
|
46
|
+
exports.default = usePosition;
|
|
47
|
+
//# sourceMappingURL=usePosition.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePosition.js","sourceRoot":"","sources":["../../../../../../../src/ui/components/form/input-color/react-input-color-lib/hooks/usePosition.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import ColorPicker from './components/ColorPicker/ColorPicker.js';
|
|
2
|
+
import themes from './themes.js';
|
|
3
|
+
import { initColor } from './components/ColorPicker/helper.js';
|
|
4
|
+
import { HslColor, HsvColor, RgbColor, Alpha, Theme, Color, ColorCombination, ColorObject } from './types.js';
|
|
5
|
+
export { themes, initColor, ColorPicker, };
|
|
6
|
+
export type { HslColor, HsvColor, RgbColor, Alpha, Theme, Color, ColorCombination, ColorObject };
|
|
7
|
+
export default ColorPicker;
|