react-science 0.32.1 → 0.32.2

package/lib/components/color-picker/gradient-select/GradientSelect.d.ts

@@ -0,0 +1,15 @@
+import * as scaleChromatic from 'd3-scale-chromatic';
+export declare const fixedGradientScales: {
+    turbo: typeof scaleChromatic.interpolateTurbo;
+    viridis: typeof scaleChromatic.interpolateViridis;
+    inferno: typeof scaleChromatic.interpolateInferno;
+    magma: typeof scaleChromatic.interpolateMagma;
+    plasma: typeof scaleChromatic.interpolatePlasma;
+};
+export type GradientScaleName = keyof typeof fixedGradientScales;
+export interface GradientSelectProps {
+    value: GradientScaleName;
+    onChange: (value: GradientScaleName) => void;
+}
+export declare function GradientSelect(props: GradientSelectProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GradientSelect.d.ts.map

package/lib/components/color-picker/gradient-select/GradientSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GradientSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker/gradient-select/GradientSelect.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,cAAc,MAAM,oBAAoB,CAAC;AAMrD,eAAO,MAAM,mBAAmB;;;;;;CAM/B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,mBAAmB,CAAC;AA4CjE,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CAC9C;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CA0BxD"}

package/lib/components/color-picker/gradient-select/GradientSelect.js

@@ -0,0 +1,87 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GradientSelect = exports.fixedGradientScales = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const styled_1 = __importDefault(require("@emotion/styled"));
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
+// @ts-ignore This import fails when compiling to CJS.
+const react_1 = require("@headlessui/react");
+const scaleChromatic = __importStar(require("d3-scale-chromatic"));
+const react_2 = require("react");
+const fa_1 = require("react-icons/fa");
+const FixedGradientPreview_1 = __importDefault(require("../preview/FixedGradientPreview"));
+exports.fixedGradientScales = {
+    turbo: scaleChromatic.interpolateTurbo,
+    viridis: scaleChromatic.interpolateViridis,
+    inferno: scaleChromatic.interpolateInferno,
+    magma: scaleChromatic.interpolateMagma,
+    plasma: scaleChromatic.interpolatePlasma,
+};
+const scaleOptions = Object.keys(exports.fixedGradientScales);
+const GradientSelectListbox = styled_1.default.div `
+  position: relative;
+  width: 100%;
+  border: 1px solid darkgray;
+  border-radius: 0.25rem;
+`;
+const GradientSelectButton = styled_1.default.button `
+  position: relative;
+  width: 100%;
+  height: 30px;
+  padding: 3px;
+`;
+const GradientSelectChevron = (0, styled_1.default)(fa_1.FaChevronDown) `
+  position: absolute;
+  height: 100%;
+  top: 0;
+  right: 0.5rem;
+`;
+const GradientSelectOptions = styled_1.default.ul `
+  position: absolute;
+  width: 100%;
+  margin-top: 5px;
+  border: 1px solid darkgray;
+  border-radius: 0.25rem;
+  padding-inline: 3px;
+  padding-bottom: 5px;
+`;
+const GradientSelectOption = styled_1.default.li `
+  display: flex;
+  flex-direction: column;
+  padding-top: 5px;
+  cursor: pointer;
+  ${(props) => !props.active && 'opacity: 0.8;'}
+  ${(props) => props.active && 'font-weight: bold;'}
+`;
+function GradientSelect(props) {
+    const { value, onChange } = props;
+    return ((0, jsx_runtime_1.jsx)(react_1.Listbox, { value: value, onChange: onChange, children: (0, jsx_runtime_1.jsxs)(GradientSelectListbox, { children: [(0, jsx_runtime_1.jsxs)(react_1.Listbox.Button, { as: GradientSelectButton, children: [(0, jsx_runtime_1.jsx)(FixedGradientPreview_1.default, { gradient: value }), (0, jsx_runtime_1.jsx)(GradientSelectChevron, {})] }), (0, jsx_runtime_1.jsx)(react_1.Listbox.Options, { as: GradientSelectOptions, children: scaleOptions.map((option) => ((0, jsx_runtime_1.jsx)(react_1.Listbox.Option, { as: react_2.Fragment, value: option, children: ({ active }) => ((0, jsx_runtime_1.jsxs)(GradientSelectOption, { active: active, children: [option, (0, jsx_runtime_1.jsx)("div", { style: { height: 15 }, children: (0, jsx_runtime_1.jsx)(FixedGradientPreview_1.default, { gradient: option }) })] })) }, option))) })] }) }));
+}
+exports.GradientSelect = GradientSelect;
+//# sourceMappingURL=GradientSelect.js.map

package/lib/components/color-picker/gradient-select/GradientSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GradientSelect.js","sourceRoot":"","sources":["../../../../src/components/color-picker/gradient-select/GradientSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6DAAqC;AACrC,wGAAwG;AACxG,sDAAsD;AACtD,6CAA4C;AAC5C,mEAAqD;AACrD,iCAAiC;AACjC,uCAA+C;AAE/C,2FAAmE;AAEtD,QAAA,mBAAmB,GAAG;IACjC,KAAK,EAAE,cAAc,CAAC,gBAAgB;IACtC,OAAO,EAAE,cAAc,CAAC,kBAAkB;IAC1C,OAAO,EAAE,cAAc,CAAC,kBAAkB;IAC1C,KAAK,EAAE,cAAc,CAAC,gBAAgB;IACtC,MAAM,EAAE,cAAc,CAAC,iBAAiB;CACzC,CAAC;AAIF,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,2BAAmB,CAAwB,CAAC;AAE7E,MAAM,qBAAqB,GAAG,gBAAM,CAAC,GAAG,CAAA;;;;;CAKvC,CAAC;AAEF,MAAM,oBAAoB,GAAG,gBAAM,CAAC,MAAM,CAAA;;;;;CAKzC,CAAC;AAEF,MAAM,qBAAqB,GAAG,IAAA,gBAAM,EAAC,kBAAa,CAAC,CAAA;;;;;CAKlD,CAAC;AAEF,MAAM,qBAAqB,GAAG,gBAAM,CAAC,EAAE,CAAA;;;;;;;;CAQtC,CAAC;AAEF,MAAM,oBAAoB,GAAG,gBAAM,CAAC,EAAE,CAAqB;;;;;IAKvD,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,eAAe;IAC3C,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,IAAI,oBAAoB;CAClD,CAAC;AAOF,SAAgB,cAAc,CAAC,KAA0B;IACvD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAClC,OAAO,CACL,uBAAC,eAAO,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,YACvC,wBAAC,qBAAqB,eACpB,wBAAC,eAAO,CAAC,MAAM,IAAC,EAAE,EAAE,oBAAoB,aACtC,uBAAC,8BAAoB,IAAC,QAAQ,EAAE,KAAK,GAAI,EACzC,uBAAC,qBAAqB,KAAG,IACV,EACjB,uBAAC,eAAO,CAAC,OAAO,IAAC,EAAE,EAAE,qBAAqB,YACvC,YAAY,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC5B,uBAAC,eAAO,CAAC,MAAM,IAAC,EAAE,EAAE,gBAAQ,EAAe,KAAK,EAAE,MAAM,YACrD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACf,wBAAC,oBAAoB,IAAC,MAAM,EAAE,MAAM,aACjC,MAAM,EACP,gCAAK,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,YACxB,uBAAC,8BAAoB,IAAC,QAAQ,EAAE,MAAM,GAAI,GACtC,IACe,CACxB,IARgC,MAAM,CASxB,CAClB,CAAC,GACc,IACI,GAChB,CACX,CAAC;AACJ,CAAC;AA1BD,wCA0BC"}

package/lib/components/color-picker/index.d.ts

@@ -0,0 +1,6 @@
+export * from './color-picker-dropdown/ColorPickerDropdown';
+export * from './gradient-select/GradientSelect';
+export * from './preview/ColorPreview';
+export * from './react-color/ColorPicker';
+export * from './palette';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/color-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/color-picker/index.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC;AAC5D,cAAc,kCAAkC,CAAC;AACjD,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,WAAW,CAAC"}

package/lib/components/color-picker/index.js

@@ -0,0 +1,22 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./color-picker-dropdown/ColorPickerDropdown"), exports);
+__exportStar(require("./gradient-select/GradientSelect"), exports);
+__exportStar(require("./preview/ColorPreview"), exports);
+__exportStar(require("./react-color/ColorPicker"), exports);
+__exportStar(require("./palette"), exports);
+//# sourceMappingURL=index.js.map

package/lib/components/color-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/color-picker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,8EAA4D;AAC5D,mEAAiD;AACjD,yDAAuC;AACvC,4DAA0C;AAC1C,4CAA0B"}

package/lib/components/color-picker/palette.d.ts

@@ -0,0 +1,2 @@
+export declare const defaultColorPalette: string[];
+//# sourceMappingURL=palette.d.ts.map

package/lib/components/color-picker/palette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../../src/components/color-picker/palette.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,mBAAmB,UAU/B,CAAC"}

package/lib/components/color-picker/palette.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultColorPalette = void 0;
+// Taken from https://personal.sron.nl/~pault/#fig:scheme_muted
+exports.defaultColorPalette = [
+    '#CC6677',
+    '#332288',
+    '#DDCC77',
+    '#117733',
+    '#88CCEE',
+    '#882255',
+    '#44AA99',
+    '#999933',
+    '#AA4499',
+];
+//# sourceMappingURL=palette.js.map

package/lib/components/color-picker/palette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"palette.js","sourceRoot":"","sources":["../../../src/components/color-picker/palette.ts"],"names":[],"mappings":";;;AAAA,+DAA+D;AAClD,QAAA,mBAAmB,GAAG;IACjC,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;CACV,CAAC"}

package/lib/components/color-picker/preview/ColorPreview.d.ts

@@ -0,0 +1,6 @@
+import { ColorConfig } from '../../../app-data/index';
+export interface ColorPreviewProps {
+    color: ColorConfig;
+}
+export declare function ColorPreview(props: ColorPreviewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ColorPreview.d.ts.map

package/lib/components/color-picker/preview/ColorPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/ColorPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAMtD,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAYpD"}

package/lib/components/color-picker/preview/ColorPreview.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColorPreview = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const assert_1 = require("../../utils/assert");
+const FixedColorPreview_1 = __importDefault(require("./FixedColorPreview"));
+const FixedGradientPreview_1 = __importDefault(require("./FixedGradientPreview"));
+function ColorPreview(props) {
+    const { color } = props;
+    switch (color.kind) {
+        case 'fixed': {
+            return (0, jsx_runtime_1.jsx)(FixedColorPreview_1.default, { color: color.color });
+        }
+        case 'fixedGradient': {
+            return (0, jsx_runtime_1.jsx)(FixedGradientPreview_1.default, { gradient: color.gradient });
+        }
+        default:
+            (0, assert_1.assertUnreachable)(color);
+    }
+}
+exports.ColorPreview = ColorPreview;
+//# sourceMappingURL=ColorPreview.js.map

package/lib/components/color-picker/preview/ColorPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPreview.js","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/ColorPreview.tsx"],"names":[],"mappings":";;;;;;;AACA,+CAAuD;AAEvD,4EAAoD;AACpD,kFAA0D;AAM1D,SAAgB,YAAY,CAAC,KAAwB;IACnD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IACxB,QAAQ,KAAK,CAAC,IAAI,EAAE,CAAC;QACnB,KAAK,OAAO,CAAC,CAAC,CAAC;YACb,OAAO,uBAAC,2BAAiB,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC;QACnD,CAAC;QACD,KAAK,eAAe,CAAC,CAAC,CAAC;YACrB,OAAO,uBAAC,8BAAoB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAAI,CAAC;QAC5D,CAAC;QACD;YACE,IAAA,0BAAiB,EAAC,KAAK,CAAC,CAAC;IAC7B,CAAC;AACH,CAAC;AAZD,oCAYC"}

package/lib/components/color-picker/preview/FixedColorPreview.d.ts

@@ -0,0 +1,6 @@
+interface FixedColorPreviewProps {
+    color: string;
+}
+export default function FixedColorPreview(props: FixedColorPreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FixedColorPreview.d.ts.map

package/lib/components/color-picker/preview/FixedColorPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FixedColorPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/FixedColorPreview.tsx"],"names":[],"mappings":"AAAA,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,2CAKtE"}

package/lib/components/color-picker/preview/FixedColorPreview.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+function FixedColorPreview(props) {
+    const { color } = props;
+    return ((0, jsx_runtime_1.jsx)("div", { style: { width: '100%', height: '100%', backgroundColor: color } }));
+}
+exports.default = FixedColorPreview;
+//# sourceMappingURL=FixedColorPreview.js.map

package/lib/components/color-picker/preview/FixedColorPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FixedColorPreview.js","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/FixedColorPreview.tsx"],"names":[],"mappings":";;;AAIA,SAAwB,iBAAiB,CAAC,KAA6B;IACrE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IACxB,OAAO,CACL,gCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,KAAK,EAAE,GAAI,CAC1E,CAAC;AACJ,CAAC;AALD,oCAKC"}

package/lib/components/color-picker/preview/FixedGradientPreview.d.ts

@@ -0,0 +1,7 @@
+import { GradientScaleName } from '../gradient-select/GradientSelect';
+interface FixedGradientPreviewProps {
+    gradient: GradientScaleName;
+}
+export default function FixedGradientPreview(props: FixedGradientPreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FixedGradientPreview.d.ts.map

package/lib/components/color-picker/preview/FixedGradientPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FixedGradientPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/FixedGradientPreview.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,iBAAiB,EAElB,MAAM,mCAAmC,CAAC;AAE3C,UAAU,yBAAyB;IACjC,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;AAED,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CAsB5E"}

package/lib/components/color-picker/preview/FixedGradientPreview.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const GradientSelect_1 = require("../gradient-select/GradientSelect");
+function FixedGradientPreview(props) {
+    const { gradient } = props;
+    const scale = GradientSelect_1.fixedGradientScales[gradient];
+    const gradientCss = (0, react_1.useMemo)(() => {
+        const stops = [];
+        for (let i = 0; i <= 100; i++) {
+            stops.push(scale(i / 100));
+        }
+        return `linear-gradient(to right, ${stops.join(', ')})`;
+    }, [scale]);
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
+            width: '100%',
+            height: '100%',
+            borderRadius: '0.125rem',
+            background: gradientCss,
+        } }));
+}
+exports.default = FixedGradientPreview;
+//# sourceMappingURL=FixedGradientPreview.js.map

package/lib/components/color-picker/preview/FixedGradientPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FixedGradientPreview.js","sourceRoot":"","sources":["../../../../src/components/color-picker/preview/FixedGradientPreview.tsx"],"names":[],"mappings":";;;AAAA,iCAAgC;AAEhC,sEAG2C;AAM3C,SAAwB,oBAAoB,CAAC,KAAgC;IAC3E,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,MAAM,KAAK,GAAG,oCAAmB,CAAC,QAAQ,CAAC,CAAC;IAE5C,MAAM,WAAW,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;QAC3B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC;YAC9B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;QAC7B,CAAC;QACD,OAAO,6BAA6B,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;IAC1D,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,gCACE,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,YAAY,EAAE,UAAU;YACxB,UAAU,EAAE,WAAW;SACxB,GACD,CACH,CAAC;AACJ,CAAC;AAtBD,uCAsBC"}

package/lib/components/color-picker/react-color/ColorPicker.d.ts

@@ -0,0 +1,43 @@
+import { CSSProperties } from 'react';
+export interface RGB {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+export interface HSL {
+    h: number;
+    l: number;
+    s: number;
+    a: number;
+}
+export interface HSV {
+    h: number;
+    s: number;
+    v: number;
+    a: number;
+}
+interface ChangeCallbackProps {
+    hex: string;
+    hsl: HSL;
+    hsv: HSV;
+    oldHue: number;
+    rgb: RGB;
+    source: 'hsv' | 'hsl' | 'rgb' | 'hex';
+}
+export interface ColorPickerProps {
+    width?: string | number;
+    className?: string;
+    presetColors?: string[];
+    color?: {
+        hex: string;
+    } | RGB | HSL | HSV;
+    disableAlpha?: boolean;
+    onChange?: (props: ChangeCallbackProps, event?: Event) => void;
+    onChangeComplete?: (props: ChangeCallbackProps, event?: Event) => void;
+    onSwatchHover?: (props: ChangeCallbackProps, event?: Event) => void;
+    style?: CSSProperties;
+}
+export declare function ColorPicker(props: ColorPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ColorPicker.d.ts.map

package/lib/components/color-picker/react-color/ColorPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker/react-color/ColorPicker.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAA4C,MAAM,OAAO,CAAC;AAShF,MAAM,WAAW,GAAG;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AACD,MAAM,WAAW,GAAG;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AACD,MAAM,WAAW,GAAG;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,UAAU,mBAAmB;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,GAAG,CAAC;IACT,GAAG,EAAE,GAAG,CAAC;IACT,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,GAAG,CAAC;IACT,MAAM,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CACvC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,KAAK,CAAC,EACF;QACE,GAAG,EAAE,MAAM,CAAC;KACb,GACD,GAAG,GACH,GAAG,GACH,GAAG,CAAC;IACR,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAC/D,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IACvE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IACpE,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAsFD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CA+FlD"}

package/lib/components/color-picker/react-color/ColorPicker.js

@@ -0,0 +1,140 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColorPicker = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const debounce_1 = __importDefault(require("lodash/debounce"));
+const react_1 = require("react");
+const palette_1 = require("../palette");
+const common_1 = require("./common");
+const colorHelper = __importStar(require("./helpers/color"));
+const SketchFields_1 = __importDefault(require("./sketch/SketchFields"));
+const SketchPresetColors_1 = __importDefault(require("./sketch/SketchPresetColors"));
+const defaultColor = {
+    h: 250,
+    s: 0.5,
+    l: 0.2,
+    a: 1,
+};
+const styles = {
+    picker: (width) => ({
+        width: typeof width === 'string' ? width : `${width}px`,
+        padding: '10px 10px 0',
+        boxSizing: 'initial',
+        background: '#fff',
+        borderRadius: '4px',
+        boxShadow: '0 0 0 1px rgba(0,0,0,.15), 0 8px 16px rgba(0,0,0,.15)',
+    }),
+    controls: {
+        display: 'flex',
+    },
+    sliders: {
+        padding: '4px 0',
+        flex: '1',
+    },
+    color: (disableAlpha) => ({
+        width: '24px',
+        height: disableAlpha ? '10px' : '24px',
+        position: 'relative',
+        marginTop: '4px',
+        marginLeft: '4px',
+        borderRadius: '3px',
+    }),
+    activeColor: (rgb) => ({
+        position: 'absolute',
+        left: 0,
+        top: 0,
+        right: 0,
+        bottom: 0,
+        borderRadius: '2px',
+        background: `rgba(${rgb.r},${rgb.g},${rgb.b},${rgb.a})`,
+        boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15), inset 0 0 4px rgba(0,0,0,.25)',
+    }),
+    saturationContainer: {
+        width: '100%',
+        paddingBottom: '75%',
+        position: 'relative',
+        overflow: 'hidden',
+    },
+    hueContainer: {
+        position: 'relative',
+        height: '10px',
+        overflow: 'hidden',
+    },
+    hueElement: {
+        borderRadius: '2px',
+        boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15), inset 0 0 4px rgba(0,0,0,.25)',
+    },
+    alphaContainer: (disableAlpha) => ({
+        position: 'relative',
+        height: '10px',
+        marginTop: '4px',
+        overflow: 'hidden',
+        ...(disableAlpha && { display: 'none' }),
+    }),
+    alphaElement: {
+        borderRadius: '2px',
+        boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15), inset 0 0 4px rgba(0,0,0,.25)',
+    },
+};
+function ColorPicker(props) {
+    const { width = 200, onChange, onSwatchHover, disableAlpha = false, presetColors = palette_1.defaultColorPalette, className = '', color = defaultColor, onChangeComplete, style = {}, } = props;
+    const [state, setState] = (0, react_1.useState)(colorHelper.toState(color, 0));
+    const debounce = (0, react_1.useRef)((0, debounce_1.default)((fn, data, event) => {
+        fn(data, event);
+    }, 100)).current;
+    (0, react_1.useEffect)(() => {
+        setState((prevState) => colorHelper.toState(color, prevState.oldHue));
+    }, [color]);
+    const handleChange = (0, react_1.useCallback)((data, event) => {
+        const isValidColor = colorHelper.simpleCheckForValidColor(data);
+        if (isValidColor) {
+            const colors = colorHelper.toState(data, data.h || state.oldHue);
+            setState(colors);
+            if (onChangeComplete) {
+                debounce(onChangeComplete, colors, event);
+            }
+            if (onChange) {
+                onChange(colors, event);
+            }
+        }
+    }, [debounce, onChange, onChangeComplete, state.oldHue]);
+    const handleSwatchHover = (0, react_1.useCallback)((data, event) => {
+        const isValidColor = colorHelper.simpleCheckForValidColor(data);
+        if (isValidColor) {
+            const colors = colorHelper.toState(data, data.h || state.oldHue);
+            if (onSwatchHover) {
+                onSwatchHover(colors, event);
+            }
+        }
+    }, [onSwatchHover, state.oldHue]);
+    const { rgb, hex, hsv, hsl } = state;
+    return ((0, jsx_runtime_1.jsxs)("div", { style: { ...styles.picker(width), ...style }, className: className, children: [(0, jsx_runtime_1.jsx)("div", { style: styles.saturationContainer, children: (0, jsx_runtime_1.jsx)(common_1.Saturation, { hsl: hsl, hsv: hsv, onChange: handleChange }) }), (0, jsx_runtime_1.jsxs)("div", { style: styles.controls, children: [(0, jsx_runtime_1.jsxs)("div", { style: styles.sliders, children: [(0, jsx_runtime_1.jsx)("div", { style: styles.hueContainer, children: (0, jsx_runtime_1.jsx)(common_1.Hue, { style: styles.hueElement, hsl: hsl, onChange: handleChange }) }), (0, jsx_runtime_1.jsx)("div", { style: styles.alphaContainer(disableAlpha), children: (0, jsx_runtime_1.jsx)(common_1.Alpha, { style: styles.alphaElement, rgb: rgb, hsl: hsl, onChange: handleChange }) })] }), (0, jsx_runtime_1.jsxs)("div", { style: styles.color(disableAlpha), children: [(0, jsx_runtime_1.jsx)(common_1.CheckBoard, {}), (0, jsx_runtime_1.jsx)("div", { style: styles.activeColor(rgb) })] })] }), (0, jsx_runtime_1.jsx)(SketchFields_1.default, { hsl: hsl, hex: hex, rgb: rgb, onChange: handleChange, disableAlpha: disableAlpha }), (0, jsx_runtime_1.jsx)(SketchPresetColors_1.default, { colors: presetColors, onClick: (data, e) => handleChange?.(data, e), onSwatchHover: handleSwatchHover })] }));
+}
+exports.ColorPicker = ColorPicker;
+//# sourceMappingURL=ColorPicker.js.map

package/lib/components/color-picker/react-color/ColorPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../../src/components/color-picker/react-color/ColorPicker.tsx"],"names":[],"mappings":"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"}

package/lib/components/color-picker/react-color/common/Alpha.d.ts

@@ -0,0 +1,3 @@
+export default Alpha;
+declare function Alpha(props: any): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Alpha.d.ts.map

package/lib/components/color-picker/react-color/common/Alpha.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alpha.d.ts","sourceRoot":"","sources":["../../../../../src/components/color-picker/react-color/common/Alpha.jsx"],"names":[],"mappings":";AA0EA,4EA2CC"}

package/lib/components/color-picker/react-color/common/Alpha.js

@@ -0,0 +1,111 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const alpha = __importStar(require("../helpers/alpha"));
+const CheckBoard_1 = __importDefault(require("./CheckBoard"));
+const useOnChange_1 = require("./useOnChange");
+const styles = {
+    alpha: (borderRadius) => ({
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        borderRadius,
+    }),
+    checkerboard: (borderRadius) => ({
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        overflow: 'hidden',
+        borderRadius,
+    }),
+    gradient: (direction, boxShadow, borderRadius, rgb) => {
+        let gradientDirection = 'right';
+        if (direction === 'vertical') {
+            gradientDirection = 'bottom';
+        }
+        return {
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            boxShadow,
+            borderRadius,
+            background: `linear-gradient(to ${gradientDirection}, rgba(${rgb.r},${rgb.g},${rgb.b}, 0) 0%,
+      rgba(${rgb.r},${rgb.g},${rgb.b}, 1) 100%)`,
+        };
+    },
+    container: {
+        position: 'relative',
+        height: '100%',
+        margin: '0 3px',
+    },
+    pointer: (direction, rgb) => {
+        if (direction === 'vertical') {
+            return {
+                position: 'absolute',
+                left: 0,
+                top: `${rgb.a * 100}%`,
+            };
+        }
+        return {
+            position: 'absolute',
+            left: `${rgb.a * 100}%`,
+        };
+    },
+    slider: {
+        width: '4px',
+        borderRadius: '1px',
+        height: '8px',
+        boxShadow: '0 0 2px rgba(0, 0, 0, .6)',
+        background: '#fff',
+        marginTop: '1px',
+        transform: 'translateX(-2px)',
+    },
+};
+const Alpha = (props) => {
+    const containerRef = (0, react_1.useRef)();
+    const handleChange = (0, react_1.useCallback)((e) => {
+        const change = alpha.calculateChange(e, props.hsl, props.direction, props.a, containerRef.current);
+        if (change && typeof props.onChange === 'function') {
+            props.onChange(change, e);
+        }
+    }, [props]);
+    const mouseDownHandler = (0, useOnChange_1.useOnChange)(handleChange);
+    const rgb = props.rgb;
+    const { borderRadius, boxShadow, direction } = props.style;
+    return ((0, jsx_runtime_1.jsxs)("div", { style: styles.alpha(borderRadius), children: [(0, jsx_runtime_1.jsx)("div", { style: styles.checkerboard(borderRadius), children: (0, jsx_runtime_1.jsx)(CheckBoard_1.default, { renderers: props.renderers }) }), (0, jsx_runtime_1.jsx)("div", { style: styles.gradient(direction, boxShadow, borderRadius, rgb) }), (0, jsx_runtime_1.jsx)("div", { style: styles.container, ref: containerRef, onMouseDown: mouseDownHandler, onTouchMove: handleChange, onTouchStart: handleChange, children: (0, jsx_runtime_1.jsx)("div", { style: styles.pointer(direction, rgb), children: props.pointer ? ((0, jsx_runtime_1.jsx)(props.pointer, { ...props })) : ((0, jsx_runtime_1.jsx)("div", { style: styles.slider })) }) })] }));
+};
+exports.default = Alpha;
+//# sourceMappingURL=Alpha.js.map

package/lib/components/color-picker/react-color/common/Alpha.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alpha.js","sourceRoot":"","sources":["../../../../../src/components/color-picker/react-color/common/Alpha.jsx"],"names":[],"mappings":"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"}

package/lib/components/color-picker/react-color/common/CheckBoard.d.ts

@@ -0,0 +1,3 @@
+export default CheckBoard;
+declare function CheckBoard(props: any): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CheckBoard.d.ts.map

package/lib/components/color-picker/react-color/common/CheckBoard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckBoard.d.ts","sourceRoot":"","sources":["../../../../../src/components/color-picker/react-color/common/CheckBoard.jsx"],"names":[],"mappings":";AAiCA,iFAWC"}