kitchen-color-studio
Version:
an open-source color editor for designing color system
80 lines • 5.61 kB
JavaScript
function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct.bind(); } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { useThemeMode } from 'antd-style';
import chroma from 'chroma-js';
import { memo } from 'react';
import * as Three from 'three';
import { hexToHct } from "../..";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
// @ts-ignore
var GenColor3D = /*#__PURE__*/memo(function (_ref) {
var name = _ref.name,
scale = _ref.scale,
colorType = _ref.colorType,
zoom = _ref.zoom,
hueZoom = _ref.hueZoom;
var _useThemeMode = useThemeMode(),
isDarkMode = _useThemeMode.isDarkMode;
var scalePositon = function scalePositon(pos, zoomPos) {
var _pos = _slicedToArray(pos, 3),
x = _pos[0],
y = _pos[1],
z = _pos[2];
var _zoomPos = _slicedToArray(zoomPos, 3),
xZoom = _zoomPos[0],
yZoom = _zoomPos[1],
zZoom = _zoomPos[2];
return [x * xZoom, y * yZoom, z * zZoom];
};
var genPosition = function genPosition(c, midC, num) {
var position;
switch (colorType) {
case 'mix':
case 'hex':
position = scalePositon([hexToHct(midC)[0], 1 - num, 0], [1 / 3.6 * hueZoom, 100, 1]);
break;
case 'cts':
position = scalePositon([hexToHct(midC)[0], num, chroma.contrast(c, isDarkMode ? '#000' : '#fff')], [1 / 3.6 * hueZoom, 100, 20]);
break;
case 'rgb':
position = scalePositon(chroma(c).rgb(), [1 / 2.55, 1 / 2.55, 1 / 2.55]);
break;
case 'hsl':
position = scalePositon(chroma(c).hsl(), [1 / 3.6 * hueZoom, 100, 100]);
position = [position[0], position[2], position[1]];
break;
case 'hsv':
position = scalePositon(chroma(c).hsv(), [1 / 3.6 * hueZoom, 100, 100]);
position = [position[0], position[2], position[1]];
break;
default:
position = scalePositon(hexToHct(c), [1 / 3.6 * hueZoom, 1, 1]);
position = [position[0], position[2], position[1]];
break;
}
return _construct(Three.Vector3, _toConsumableArray(position));
};
return scale.map(function (c, index) {
return /*#__PURE__*/_jsxs("mesh", {
/* eslint-disable-next-line react/no-unknown-property */
position: genPosition(c, scale[Math.floor(scale.length / 2)], (index + 1) / scale.length),
scale: zoom,
children: [/*#__PURE__*/_jsx("boxGeometry", {}), /*#__PURE__*/_jsx("meshPhysicalMaterial", {
color: c
})]
}, name + index);
});
});
export default GenColor3D;