@chayns-components/color-picker 5.0.0-beta.1000

package/lib/cjs/utils/color.js

@@ -0,0 +1,245 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.splitRgb = exports.rgbToHsv = exports.rgbToHex = exports.isValidRGBA = exports.isValidRGB = exports.hexToRgb = exports.getCoordinatesFromColor = exports.getColorFromCoordinates = exports.extractRgbValues = exports.extractHsl = exports.convertColorToHsl = void 0;
+var _colors = require("@chayns/colors");
+const getColorFromCoordinates = ({
+  coordinates,
+  canvas,
+  opacity,
+  scale
+}) => {
+  var _canvas$current;
+  if (!canvas.current) {
+    return undefined;
+  }
+  const xCords = coordinates.x;
+  const yCords = coordinates.y;
+  const x = (xCords - 0.5) * scale.scaleX;
+  const y = (yCords - 0.5) * scale.scaleY;
+  const ctx = (_canvas$current = canvas.current) === null || _canvas$current === void 0 ? void 0 : _canvas$current.getContext('2d', {
+    willReadFrequently: true
+  });
+  const pixels = ctx === null || ctx === void 0 ? void 0 : ctx.getImageData(x, y, 1, 1).data;
+  if (!pixels) {
+    return undefined;
+  }
+
+  // If transparency
+  if (pixels[0] === 0 && pixels[1] === 0 && pixels[2] === 0 && pixels[3] === 0) {
+    return 'transparent';
+  }
+  return `rgba(${pixels[0] ?? 0}, ${pixels[1] ?? 0}, ${pixels[2] ?? 0}, ${opacity})`;
+};
+exports.getColorFromCoordinates = getColorFromCoordinates;
+const getCoordinatesFromColor = ({
+  canvas,
+  color,
+  tolerance = 0
+}) => {
+  var _canvas$current2, _canvas$current3, _canvas$current4;
+  const ctx = (_canvas$current2 = canvas.current) === null || _canvas$current2 === void 0 ? void 0 : _canvas$current2.getContext('2d', {
+    willReadFrequently: true
+  });
+  if (!ctx) {
+    return null;
+  }
+  const height = ((_canvas$current3 = canvas.current) === null || _canvas$current3 === void 0 ? void 0 : _canvas$current3.height) ?? 150;
+  const width = ((_canvas$current4 = canvas.current) === null || _canvas$current4 === void 0 ? void 0 : _canvas$current4.width) ?? 300;
+  const imageData = ctx.getImageData(0, 0, width, height);
+  const pixels = imageData.data;
+  const rgb = splitRgb(color);
+  if (!rgb) {
+    return null;
+  }
+  const {
+    r: targetR,
+    g: targetG,
+    b: targetB
+  } = rgb;
+  for (let y = 0; y < height; y++) {
+    for (let x = 0; x < width; x++) {
+      const index = (y * width + x) * 4;
+      const r = pixels[index] ?? 0;
+      const g = pixels[index + 1] ?? 0;
+      const b = pixels[index + 2] ?? 0;
+      if (Math.abs(targetR - r) <= tolerance && Math.abs(targetG - g) <= tolerance && Math.abs(targetB - b) <= tolerance) {
+        return {
+          x,
+          y
+        };
+      }
+    }
+  }
+  return null;
+};
+exports.getCoordinatesFromColor = getCoordinatesFromColor;
+const isValidRGBA = rgbaString => {
+  if (rgbaString === '') {
+    return false;
+  }
+  const rgbaRegex = /^rgba\(\s*(\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3}),\s*((0?\.\d+)|(1|0))\s*\)$/;
+  if (!rgbaRegex.test(rgbaString)) {
+    return false;
+  }
+  const matches = rgbaString.match(rgbaRegex);
+  if (!matches) {
+    return false;
+  }
+  const red = parseInt(matches[1] ?? '', 10);
+  const green = parseInt(matches[2] ?? '', 10);
+  const blue = parseInt(matches[3] ?? '', 10);
+  const alpha = parseFloat(matches[4] ?? '');
+  return !(red < 0 || red > 255 || green < 0 || green > 255 || blue < 0 || blue > 255 || alpha < 0 || alpha > 1);
+};
+exports.isValidRGBA = isValidRGBA;
+const isValidRGB = rgbString => {
+  if (rgbString === '') {
+    return false;
+  }
+  const rgbRegex = /^rgb\(\s*(\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\s*\)$/;
+  if (!rgbRegex.test(rgbString)) {
+    return false;
+  }
+  const matches = rgbString.match(rgbRegex);
+  if (!matches) {
+    return false;
+  }
+  const red = parseInt(matches[1] ?? '', 10);
+  const green = parseInt(matches[2] ?? '', 10);
+  const blue = parseInt(matches[3] ?? '', 10);
+  return red >= 0 && red <= 255 && green >= 0 && green <= 255 && blue >= 0 && blue <= 255;
+};
+exports.isValidRGB = isValidRGB;
+const convertColorToHsl = color => {
+  const hexRegex = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/;
+  const rgbRegex = /^rgb(a)?\(\s*((25[0-5]|2[0-4]\d|1\d{2}|\d{1,2})\s*,\s*){2}(25[0-5]|2[0-4]\d|1\d{2}|\d{1,2})\s*(,\s*\d+(\.\d+)?)?\)$/i;
+  const hslRegex = /^hsla?\(\s*((360|3[0-5]\d|[12]\d{2}|[1-9]\d|\d)\s*,\s*){2}(360|3[0-5]\d|[12]\d{2}|[1-9]\d|\d)\s*(,\s*\d+(\.\d+)?)?\)$/i;
+  let rgba;
+  let hsl;
+  const newColor = color.replaceAll('%', '');
+  switch (true) {
+    case hexRegex.test(newColor):
+      hsl = (0, _colors.hexToHsl)(color);
+      if (!hsl) {
+        return undefined;
+      }
+      return `hsl(${Math.floor(hsl.h)},100%,100%)`;
+    case rgbRegex.test(newColor):
+      rgba = color.match(/[\d.]+/g);
+      if (!rgba) {
+        return undefined;
+      }
+      hsl = (0, _colors.rgb255ToHsl)({
+        r: Number(rgba[0]),
+        g: Number(rgba[1]),
+        b: Number(rgba[2])
+      });
+      if (!hsl) {
+        return undefined;
+      }
+      return `hsl(${Math.floor(hsl.h)},100%,100%)`;
+    case hslRegex.test(newColor):
+      return color;
+    default:
+      return undefined;
+  }
+};
+exports.convertColorToHsl = convertColorToHsl;
+const rgbToHsv = color => (0, _colors.rgb255ToHsv)(extractRgbValues(color ?? ''));
+exports.rgbToHsv = rgbToHsv;
+const extractHsl = hsl => {
+  const match = hsl.match(/hsl\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)%\s*,\s*(\d+(?:\.\d+)?)%\s*\)/i);
+  if (!match) {
+    return null;
+  }
+  const h = parseFloat(match[1] ?? '');
+  const s = parseFloat(match[2] ?? '') / 100;
+  const l = parseFloat(match[3] ?? '') / 100;
+  return {
+    h,
+    s,
+    l
+  };
+};
+exports.extractHsl = extractHsl;
+const splitRgb = color => {
+  const rgba = color === null || color === void 0 ? void 0 : color.match(/[\d.]+/g);
+  if (!rgba) {
+    return null;
+  }
+  return {
+    r: Number(rgba[0]),
+    g: Number(rgba[1]),
+    b: Number(rgba[2]),
+    a: Number(rgba[3])
+  };
+};
+exports.splitRgb = splitRgb;
+const extractRgbValues = rgbString => {
+  const rgbaRegex = /rgba\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,\s*([\d.]+)\s*\)/;
+  const match = rgbString.match(rgbaRegex);
+  if (match) {
+    const r = parseInt(match[1] ?? '', 10);
+    const g = parseInt(match[2] ?? '', 10);
+    const b = parseInt(match[3] ?? '', 10);
+    const a = parseFloat(match[4] ?? '');
+    return {
+      r,
+      g,
+      b,
+      a
+    };
+  }
+  return {
+    r: 255,
+    g: 255,
+    b: 255,
+    a: 1
+  };
+};
+exports.extractRgbValues = extractRgbValues;
+const hexToRgb = hex => {
+  let r;
+  let g;
+  let b;
+  let a;
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i.exec(hex);
+  if (result) {
+    r = parseInt(result[1] ?? '0', 16);
+    g = parseInt(result[2] ?? '0', 16);
+    b = parseInt(result[3] ?? '0', 16);
+    a = result[4] ? parseInt(result[4], 16) / 100 : 1;
+    return {
+      r,
+      g,
+      b,
+      a
+    };
+  }
+  return {
+    r: 255,
+    g: 255,
+    b: 255,
+    a: 1
+  };
+};
+exports.hexToRgb = hexToRgb;
+const rgbToHex = ({
+  r,
+  g,
+  b,
+  a = 1
+}) => {
+  const clamp = value => Math.max(0, Math.min(255, Math.round(value)));
+  const alpha = Math.max(0, Math.min(1, a));
+  const hex = x => {
+    const hexValue = clamp(x).toString(16);
+    return hexValue.length === 1 ? `0${hexValue}` : hexValue;
+  };
+  return `#${hex(r)}${hex(g)}${hex(b)}${alpha <= 1 ? hex(alpha * 100) : ''}`;
+};
+exports.rgbToHex = rgbToHex;
+//# sourceMappingURL=color.js.map

package/lib/cjs/utils/color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.js","names":["_colors","require","getColorFromCoordinates","coordinates","canvas","opacity","scale","_canvas$current","current","undefined","xCords","x","yCords","y","scaleX","scaleY","ctx","getContext","willReadFrequently","pixels","getImageData","data","exports","getCoordinatesFromColor","color","tolerance","_canvas$current2","_canvas$current3","_canvas$current4","height","width","imageData","rgb","splitRgb","r","targetR","g","targetG","b","targetB","index","Math","abs","isValidRGBA","rgbaString","rgbaRegex","test","matches","match","red","parseInt","green","blue","alpha","parseFloat","isValidRGB","rgbString","rgbRegex","convertColorToHsl","hexRegex","hslRegex","rgba","hsl","newColor","replaceAll","hexToHsl","floor","h","rgb255ToHsl","Number","rgbToHsv","rgb255ToHsv","extractRgbValues","extractHsl","s","l","a","hexToRgb","hex","result","exec","rgbToHex","clamp","value","max","min","round","hexValue","toString","length"],"sources":["../../../src/utils/color.ts"],"sourcesContent":["import type { CSSProperties, RefObject } from 'react';\n\nimport { hexToHsl, rgb255ToHsl, rgb255ToHsv } from '@chayns/colors';\nimport type { HSL, HSLA } from '@chayns/colors/lib/types/hsl';\nimport type { Coordinates, RGBA, Scale } from '../types/colorPicker';\n\ninterface GetColorFromCoordinatesOptions {\n    coordinates: Coordinates;\n    canvas: RefObject<HTMLCanvasElement>;\n    opacity: number;\n    scale: Scale;\n}\n\nexport const getColorFromCoordinates = ({\n    coordinates,\n    canvas,\n    opacity,\n    scale,\n}: GetColorFromCoordinatesOptions) => {\n    if (!canvas.current) {\n        return undefined;\n    }\n\n    const xCords = coordinates.x;\n    const yCords = coordinates.y;\n\n    const x = (xCords - 0.5) * scale.scaleX;\n    const y = (yCords - 0.5) * scale.scaleY;\n\n    const ctx = canvas.current?.getContext('2d', { willReadFrequently: true });\n    const pixels = ctx?.getImageData(x, y, 1, 1).data;\n\n    if (!pixels) {\n        return undefined;\n    }\n\n    // If transparency\n    if (pixels[0] === 0 && pixels[1] === 0 && pixels[2] === 0 && pixels[3] === 0) {\n        return 'transparent';\n    }\n\n    return `rgba(${pixels[0] ?? 0}, ${pixels[1] ?? 0}, ${pixels[2] ?? 0}, ${opacity})`;\n};\n\ninterface GetCoordinatesFromColorOptions {\n    color: CSSProperties['color'];\n    canvas: RefObject<HTMLCanvasElement>;\n    tolerance?: number;\n}\n\nexport const getCoordinatesFromColor = ({\n    canvas,\n    color,\n    tolerance = 0,\n}: GetCoordinatesFromColorOptions) => {\n    const ctx = canvas.current?.getContext('2d', { willReadFrequently: true });\n\n    if (!ctx) {\n        return null;\n    }\n\n    const height = canvas.current?.height ?? 150;\n    const width = canvas.current?.width ?? 300;\n\n    const imageData = ctx.getImageData(0, 0, width, height);\n    const pixels = imageData.data;\n\n    const rgb = splitRgb(color);\n\n    if (!rgb) {\n        return null;\n    }\n\n    const { r: targetR, g: targetG, b: targetB } = rgb;\n\n    for (let y = 0; y < height; y++) {\n        for (let x = 0; x < width; x++) {\n            const index = (y * width + x) * 4;\n            const r = pixels[index] ?? 0;\n            const g = pixels[index + 1] ?? 0;\n            const b = pixels[index + 2] ?? 0;\n\n            if (\n                Math.abs(targetR - r) <= tolerance &&\n                Math.abs(targetG - g) <= tolerance &&\n                Math.abs(targetB - b) <= tolerance\n            ) {\n                return { x, y };\n            }\n        }\n    }\n\n    return null;\n};\n\nexport const isValidRGBA = (rgbaString: string): boolean => {\n    if (rgbaString === '') {\n        return false;\n    }\n\n    const rgbaRegex = /^rgba\\(\\s*(\\d{1,3}),\\s*(\\d{1,3}),\\s*(\\d{1,3}),\\s*((0?\\.\\d+)|(1|0))\\s*\\)$/;\n    if (!rgbaRegex.test(rgbaString)) {\n        return false;\n    }\n\n    const matches = rgbaString.match(rgbaRegex);\n    if (!matches) {\n        return false;\n    }\n\n    const red = parseInt(matches[1] ?? '', 10);\n    const green = parseInt(matches[2] ?? '', 10);\n    const blue = parseInt(matches[3] ?? '', 10);\n    const alpha = parseFloat(matches[4] ?? '');\n\n    return !(\n        red < 0 ||\n        red > 255 ||\n        green < 0 ||\n        green > 255 ||\n        blue < 0 ||\n        blue > 255 ||\n        alpha < 0 ||\n        alpha > 1\n    );\n};\n\nexport const isValidRGB = (rgbString: string): boolean => {\n    if (rgbString === '') {\n        return false;\n    }\n\n    const rgbRegex = /^rgb\\(\\s*(\\d{1,3}),\\s*(\\d{1,3}),\\s*(\\d{1,3})\\s*\\)$/;\n    if (!rgbRegex.test(rgbString)) {\n        return false;\n    }\n\n    const matches = rgbString.match(rgbRegex);\n    if (!matches) {\n        return false;\n    }\n\n    const red = parseInt(matches[1] ?? '', 10);\n    const green = parseInt(matches[2] ?? '', 10);\n    const blue = parseInt(matches[3] ?? '', 10);\n\n    return red >= 0 && red <= 255 && green >= 0 && green <= 255 && blue >= 0 && blue <= 255;\n};\n\nexport const convertColorToHsl = (color: string) => {\n    const hexRegex = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/;\n    const rgbRegex =\n        /^rgb(a)?\\(\\s*((25[0-5]|2[0-4]\\d|1\\d{2}|\\d{1,2})\\s*,\\s*){2}(25[0-5]|2[0-4]\\d|1\\d{2}|\\d{1,2})\\s*(,\\s*\\d+(\\.\\d+)?)?\\)$/i;\n    const hslRegex =\n        /^hsla?\\(\\s*((360|3[0-5]\\d|[12]\\d{2}|[1-9]\\d|\\d)\\s*,\\s*){2}(360|3[0-5]\\d|[12]\\d{2}|[1-9]\\d|\\d)\\s*(,\\s*\\d+(\\.\\d+)?)?\\)$/i;\n\n    let rgba: string[] | null;\n    let hsl: HSL | HSLA | null;\n\n    const newColor = color.replaceAll('%', '');\n\n    switch (true) {\n        case hexRegex.test(newColor):\n            hsl = hexToHsl(color);\n\n            if (!hsl) {\n                return undefined;\n            }\n\n            return `hsl(${Math.floor(hsl.h)},100%,100%)`;\n        case rgbRegex.test(newColor):\n            rgba = color.match(/[\\d.]+/g);\n\n            if (!rgba) {\n                return undefined;\n            }\n\n            hsl = rgb255ToHsl({\n                r: Number(rgba[0]),\n                g: Number(rgba[1]),\n                b: Number(rgba[2]),\n            });\n\n            if (!hsl) {\n                return undefined;\n            }\n\n            return `hsl(${Math.floor(hsl.h)},100%,100%)`;\n        case hslRegex.test(newColor):\n            return color;\n        default:\n            return undefined;\n    }\n};\n\nexport const rgbToHsv = (color: CSSProperties['color']) =>\n    rgb255ToHsv(extractRgbValues(color ?? ''));\n\nexport const extractHsl = (hsl: string) => {\n    const match = hsl.match(\n        /hsl\\(\\s*(\\d+(?:\\.\\d+)?)\\s*,\\s*(\\d+(?:\\.\\d+)?)%\\s*,\\s*(\\d+(?:\\.\\d+)?)%\\s*\\)/i,\n    );\n\n    if (!match) {\n        return null;\n    }\n\n    const h = parseFloat(match[1] ?? '');\n    const s = parseFloat(match[2] ?? '') / 100;\n    const l = parseFloat(match[3] ?? '') / 100;\n\n    return { h, s, l };\n};\n\nexport const splitRgb = (color: CSSProperties['color']): null | RGBA => {\n    const rgba = color?.match(/[\\d.]+/g);\n\n    if (!rgba) {\n        return null;\n    }\n\n    return { r: Number(rgba[0]), g: Number(rgba[1]), b: Number(rgba[2]), a: Number(rgba[3]) };\n};\n\nexport const extractRgbValues = (rgbString: string): RGBA => {\n    const rgbaRegex = /rgba\\(\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*([\\d.]+)\\s*\\)/;\n    const match = rgbString.match(rgbaRegex);\n\n    if (match) {\n        const r = parseInt(match[1] ?? '', 10);\n        const g = parseInt(match[2] ?? '', 10);\n        const b = parseInt(match[3] ?? '', 10);\n        const a = parseFloat(match[4] ?? '');\n\n        return { r, g, b, a };\n    }\n\n    return {\n        r: 255,\n        g: 255,\n        b: 255,\n        a: 1,\n    };\n};\n\nexport const hexToRgb = (hex: string): RGBA => {\n    let r: number;\n    let g: number;\n    let b: number;\n    let a: number;\n\n    const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})?$/i.exec(hex);\n\n    if (result) {\n        r = parseInt(result[1] ?? '0', 16);\n        g = parseInt(result[2] ?? '0', 16);\n        b = parseInt(result[3] ?? '0', 16);\n        a = result[4] ? parseInt(result[4], 16) / 100 : 1;\n\n        return { r, g, b, a };\n    }\n\n    return {\n        r: 255,\n        g: 255,\n        b: 255,\n        a: 1,\n    };\n};\n\nexport const rgbToHex = ({ r, g, b, a = 1 }: RGBA): string => {\n    const clamp = (value: number) => Math.max(0, Math.min(255, Math.round(value)));\n    const alpha = Math.max(0, Math.min(1, a));\n    const hex = (x: number) => {\n        const hexValue = clamp(x).toString(16);\n        return hexValue.length === 1 ? `0${hexValue}` : hexValue;\n    };\n    return `#${hex(r)}${hex(g)}${hex(b)}${alpha <= 1 ? hex(alpha * 100) : ''}`;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/api/color/get.js

@@ -0,0 +1,26 @@
+import { getAccessToken, getSite } from 'chayns-api';
+import { ITEM_STORAGE_URL } from '../../constants/color';
+export const putSiteColors = async colorsArray => {
+  const {
+    accessToken
+  } = await getAccessToken();
+  const {
+    id
+  } = getSite();
+  if (!accessToken) {
+    return false;
+  }
+  const result = await fetch(`${ITEM_STORAGE_URL}/schemes/0/sites/${id}/keys/custom-colors
+`, {
+    method: 'PUT',
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${accessToken}`
+    },
+    body: JSON.stringify({
+      value: colorsArray
+    })
+  });
+  return result.status === 201;
+};
+//# sourceMappingURL=get.js.map

package/lib/esm/api/color/get.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"get.js","names":["getAccessToken","getSite","ITEM_STORAGE_URL","putSiteColors","colorsArray","accessToken","id","result","fetch","method","headers","Authorization","body","JSON","stringify","value","status"],"sources":["../../../../src/api/color/get.ts"],"sourcesContent":["import { getAccessToken, getSite } from 'chayns-api';\nimport { ITEM_STORAGE_URL } from '../../constants/color';\n\nexport const putSiteColors = async (colorsArray: string[]): Promise<boolean> => {\n    const { accessToken } = await getAccessToken();\n    const { id } = getSite();\n\n    if (!accessToken) {\n        return false;\n    }\n\n    const result = await fetch(\n        `${ITEM_STORAGE_URL}/schemes/0/sites/${id}/keys/custom-colors\n`,\n        {\n            method: 'PUT',\n            headers: {\n                'Content-Type': 'application/json',\n                Authorization: `Bearer ${accessToken}`,\n            },\n            body: JSON.stringify({ value: colorsArray }),\n        },\n    );\n\n    return result.status === 201;\n};\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,OAAO,QAAQ,YAAY;AACpD,SAASC,gBAAgB,QAAQ,uBAAuB;AAExD,OAAO,MAAMC,aAAa,GAAG,MAAOC,WAAqB,IAAuB;EAC5E,MAAM;IAAEC;EAAY,CAAC,GAAG,MAAML,cAAc,CAAC,CAAC;EAC9C,MAAM;IAAEM;EAAG,CAAC,GAAGL,OAAO,CAAC,CAAC;EAExB,IAAI,CAACI,WAAW,EAAE;IACd,OAAO,KAAK;EAChB;EAEA,MAAME,MAAM,GAAG,MAAMC,KAAK,CACtB,GAAGN,gBAAgB,oBAAoBI,EAAE;AACjD,CAAC,EACO;IACIG,MAAM,EAAE,KAAK;IACbC,OAAO,EAAE;MACL,cAAc,EAAE,kBAAkB;MAClCC,aAAa,EAAE,UAAUN,WAAW;IACxC,CAAC;IACDO,IAAI,EAAEC,IAAI,CAACC,SAAS,CAAC;MAAEC,KAAK,EAAEX;IAAY,CAAC;EAC/C,CACJ,CAAC;EAED,OAAOG,MAAM,CAACS,MAAM,KAAK,GAAG;AAChC,CAAC","ignoreList":[]}

package/lib/esm/api/color/put.js

@@ -0,0 +1,30 @@
+import { getAccessToken, getSite } from 'chayns-api';
+import { ITEM_STORAGE_URL } from '../../constants/color';
+export const getSiteColors = async () => {
+  const {
+    accessToken
+  } = await getAccessToken();
+  const {
+    id
+  } = getSite();
+  if (!accessToken) {
+    return {
+      value: []
+    };
+  }
+  const result = await fetch(`${ITEM_STORAGE_URL}/schemes/0/sites/${id}/keys/custom-colors
+`, {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${accessToken}`
+    }
+  });
+  if (result.status === 200) {
+    return await result.json();
+  }
+  return {
+    value: []
+  };
+};
+//# sourceMappingURL=put.js.map

package/lib/esm/api/color/put.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"put.js","names":["getAccessToken","getSite","ITEM_STORAGE_URL","getSiteColors","accessToken","id","value","result","fetch","method","headers","Authorization","status","json"],"sources":["../../../../src/api/color/put.ts"],"sourcesContent":["import { getAccessToken, getSite } from 'chayns-api';\nimport { ITEM_STORAGE_URL } from '../../constants/color';\nimport { ItemStorageResult } from '../../types/colorPicker';\n\nexport const getSiteColors = async (): Promise<ItemStorageResult> => {\n    const { accessToken } = await getAccessToken();\n    const { id } = getSite();\n\n    if (!accessToken) {\n        return { value: [] };\n    }\n\n    const result = await fetch(\n        `${ITEM_STORAGE_URL}/schemes/0/sites/${id}/keys/custom-colors\n`,\n        {\n            method: 'GET',\n            headers: {\n                'Content-Type': 'application/json',\n                Authorization: `Bearer ${accessToken}`,\n            },\n        },\n    );\n\n    if (result.status === 200) {\n        return (await result.json()) as unknown as ItemStorageResult;\n    }\n\n    return { value: [] };\n};\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,OAAO,QAAQ,YAAY;AACpD,SAASC,gBAAgB,QAAQ,uBAAuB;AAGxD,OAAO,MAAMC,aAAa,GAAG,MAAAA,CAAA,KAAwC;EACjE,MAAM;IAAEC;EAAY,CAAC,GAAG,MAAMJ,cAAc,CAAC,CAAC;EAC9C,MAAM;IAAEK;EAAG,CAAC,GAAGJ,OAAO,CAAC,CAAC;EAExB,IAAI,CAACG,WAAW,EAAE;IACd,OAAO;MAAEE,KAAK,EAAE;IAAG,CAAC;EACxB;EAEA,MAAMC,MAAM,GAAG,MAAMC,KAAK,CACtB,GAAGN,gBAAgB,oBAAoBG,EAAE;AACjD,CAAC,EACO;IACII,MAAM,EAAE,KAAK;IACbC,OAAO,EAAE;MACL,cAAc,EAAE,kBAAkB;MAClCC,aAAa,EAAE,UAAUP,WAAW;IACxC;EACJ,CACJ,CAAC;EAED,IAAIG,MAAM,CAACK,MAAM,KAAK,GAAG,EAAE;IACvB,OAAQ,MAAML,MAAM,CAACM,IAAI,CAAC,CAAC;EAC/B;EAEA,OAAO;IAAEP,KAAK,EAAE;EAAG,CAAC;AACxB,CAAC","ignoreList":[]}

package/lib/esm/components/ColorPickerProvider.js

@@ -0,0 +1,89 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { hexToRgb, isValidRGBA } from '../utils/color';
+export const ColorPickerContext = /*#__PURE__*/React.createContext({
+  selectedColor: undefined,
+  updateSelectedColor: undefined,
+  hueColor: undefined,
+  updateHueColor: undefined,
+  isPresetColor: undefined,
+  updateIsPresetColor: undefined,
+  shouldGetCoordinates: undefined,
+  updateShouldGetCoordinates: undefined,
+  shouldCallOnSelect: undefined,
+  updateShouldCallOnSelect: undefined,
+  canGetColorFromArea: undefined,
+  updateCanGetColorFromArea: undefined
+});
+ColorPickerContext.displayName = 'ColorPickerContext';
+const ColorPickerProvider = _ref => {
+  let {
+    children,
+    selectedColor,
+    onSelect
+  } = _ref;
+  const [internalSelectedColor, setInternalSelectedColor] = useState();
+  const [internalHueColor, setInternalHueColor] = useState();
+  const [internalIsPresetColor, setInternalIsPresetColor] = useState(false);
+  const [internalShouldGetCoordinates, setInternalShouldGetCoordinates] = useState(true);
+  const [internalShouldCallOnSelect, setInternalShouldCallOnSelect] = useState(false);
+  const [internalCanGetColorFromArea, setInternalCanGetColorFromArea] = useState(false);
+  const updateSelectedColor = useCallback(color => {
+    setInternalSelectedColor(color);
+  }, []);
+  const updateHueColor = useCallback(color => {
+    setInternalHueColor(color);
+  }, []);
+  const updateIsPresetColor = useCallback(isPresetColor => {
+    setInternalIsPresetColor(isPresetColor);
+  }, []);
+  const updateShouldGetCoordinates = useCallback(shouldGetCoordinates => {
+    setInternalShouldGetCoordinates(shouldGetCoordinates);
+  }, []);
+  const updateShouldCallOnSelect = useCallback(shouldCallOnSelect => {
+    setInternalShouldCallOnSelect(shouldCallOnSelect);
+  }, []);
+  const updateCanGetColorFromArea = useCallback(canGetColorFromArea => {
+    setInternalCanGetColorFromArea(canGetColorFromArea);
+  }, []);
+  useEffect(() => {
+    let newColor = selectedColor;
+    if (newColor && !isValidRGBA(newColor)) {
+      const {
+        r,
+        g,
+        b,
+        a
+      } = hexToRgb(newColor);
+      newColor = `rgba(${r},${g},${b},${a})`;
+    }
+    setInternalSelectedColor(newColor);
+    setInternalHueColor(newColor);
+    setInternalIsPresetColor(true);
+  }, [selectedColor]);
+  useEffect(() => {
+    if (typeof onSelect === 'function' && internalShouldCallOnSelect && internalSelectedColor) {
+      onSelect(internalSelectedColor);
+      setInternalShouldCallOnSelect(false);
+    }
+  }, [internalSelectedColor, internalShouldCallOnSelect, onSelect]);
+  const providerValue = useMemo(() => ({
+    selectedColor: internalSelectedColor,
+    updateSelectedColor,
+    hueColor: internalHueColor,
+    updateHueColor,
+    isPresetColor: internalIsPresetColor,
+    updateIsPresetColor,
+    shouldGetCoordinates: internalShouldGetCoordinates,
+    updateShouldGetCoordinates,
+    shouldCallOnSelect: internalShouldCallOnSelect,
+    updateShouldCallOnSelect,
+    canGetColorFromArea: internalCanGetColorFromArea,
+    updateCanGetColorFromArea
+  }), [internalCanGetColorFromArea, internalHueColor, internalIsPresetColor, internalSelectedColor, internalShouldCallOnSelect, internalShouldGetCoordinates, updateCanGetColorFromArea, updateHueColor, updateIsPresetColor, updateSelectedColor, updateShouldCallOnSelect, updateShouldGetCoordinates]);
+  return /*#__PURE__*/React.createElement(ColorPickerContext.Provider, {
+    value: providerValue
+  }, children);
+};
+ColorPickerProvider.displayName = 'ColorPickerProvider';
+export default ColorPickerProvider;
+//# sourceMappingURL=ColorPickerProvider.js.map

package/lib/esm/components/ColorPickerProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPickerProvider.js","names":["React","useCallback","useEffect","useMemo","useState","hexToRgb","isValidRGBA","ColorPickerContext","createContext","selectedColor","undefined","updateSelectedColor","hueColor","updateHueColor","isPresetColor","updateIsPresetColor","shouldGetCoordinates","updateShouldGetCoordinates","shouldCallOnSelect","updateShouldCallOnSelect","canGetColorFromArea","updateCanGetColorFromArea","displayName","ColorPickerProvider","_ref","children","onSelect","internalSelectedColor","setInternalSelectedColor","internalHueColor","setInternalHueColor","internalIsPresetColor","setInternalIsPresetColor","internalShouldGetCoordinates","setInternalShouldGetCoordinates","internalShouldCallOnSelect","setInternalShouldCallOnSelect","internalCanGetColorFromArea","setInternalCanGetColorFromArea","color","newColor","r","g","b","a","providerValue","createElement","Provider","value"],"sources":["../../../src/components/ColorPickerProvider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState, type ReactNode } from 'react';\nimport { hexToRgb, isValidRGBA } from '../utils/color';\n\ninterface IColorPickerContext {\n    selectedColor?: string;\n    updateSelectedColor?: (color: string | undefined) => void;\n    hueColor?: string;\n    updateHueColor?: (color: string | undefined) => void;\n    isPresetColor?: boolean;\n    updateIsPresetColor?: (isPresetColor: boolean) => void;\n    shouldGetCoordinates?: boolean;\n    updateShouldGetCoordinates?: (shouldGetCoordinates: boolean) => void;\n    shouldCallOnSelect?: boolean;\n    updateShouldCallOnSelect?: (shouldCallOnSelect: boolean) => void;\n    canGetColorFromArea?: boolean;\n    updateCanGetColorFromArea?: (canGetColorFromArea: boolean) => void;\n}\n\nexport const ColorPickerContext = React.createContext<IColorPickerContext>({\n    selectedColor: undefined,\n    updateSelectedColor: undefined,\n    hueColor: undefined,\n    updateHueColor: undefined,\n    isPresetColor: undefined,\n    updateIsPresetColor: undefined,\n    shouldGetCoordinates: undefined,\n    updateShouldGetCoordinates: undefined,\n    shouldCallOnSelect: undefined,\n    updateShouldCallOnSelect: undefined,\n    canGetColorFromArea: undefined,\n    updateCanGetColorFromArea: undefined,\n});\n\nColorPickerContext.displayName = 'ColorPickerContext';\n\ninterface ColorPickerProviderProps {\n    /**\n     * The children of the provider.\n     */\n    children: ReactNode;\n    /**\n     * Function to be executed when a color is selected.\n     */\n    onSelect?: (color: string) => void;\n    /**\n     * The color that should be preselected.\n     */\n    selectedColor?: string;\n}\n\nconst ColorPickerProvider = ({ children, selectedColor, onSelect }: ColorPickerProviderProps) => {\n    const [internalSelectedColor, setInternalSelectedColor] = useState<string>();\n    const [internalHueColor, setInternalHueColor] = useState<string>();\n    const [internalIsPresetColor, setInternalIsPresetColor] = useState<boolean>(false);\n    const [internalShouldGetCoordinates, setInternalShouldGetCoordinates] = useState<boolean>(true);\n    const [internalShouldCallOnSelect, setInternalShouldCallOnSelect] = useState<boolean>(false);\n    const [internalCanGetColorFromArea, setInternalCanGetColorFromArea] = useState<boolean>(false);\n\n    const updateSelectedColor = useCallback((color: string | undefined) => {\n        setInternalSelectedColor(color);\n    }, []);\n\n    const updateHueColor = useCallback((color: string | undefined) => {\n        setInternalHueColor(color);\n    }, []);\n\n    const updateIsPresetColor = useCallback((isPresetColor: boolean) => {\n        setInternalIsPresetColor(isPresetColor);\n    }, []);\n\n    const updateShouldGetCoordinates = useCallback((shouldGetCoordinates: boolean) => {\n        setInternalShouldGetCoordinates(shouldGetCoordinates);\n    }, []);\n\n    const updateShouldCallOnSelect = useCallback((shouldCallOnSelect: boolean) => {\n        setInternalShouldCallOnSelect(shouldCallOnSelect);\n    }, []);\n\n    const updateCanGetColorFromArea = useCallback((canGetColorFromArea: boolean) => {\n        setInternalCanGetColorFromArea(canGetColorFromArea);\n    }, []);\n\n    useEffect(() => {\n        let newColor = selectedColor;\n\n        if (newColor && !isValidRGBA(newColor)) {\n            const { r, g, b, a } = hexToRgb(newColor);\n\n            newColor = `rgba(${r},${g},${b},${a})`;\n        }\n\n        setInternalSelectedColor(newColor);\n        setInternalHueColor(newColor);\n        setInternalIsPresetColor(true);\n    }, [selectedColor]);\n\n    useEffect(() => {\n        if (typeof onSelect === 'function' && internalShouldCallOnSelect && internalSelectedColor) {\n            onSelect(internalSelectedColor);\n\n            setInternalShouldCallOnSelect(false);\n        }\n    }, [internalSelectedColor, internalShouldCallOnSelect, onSelect]);\n\n    const providerValue = useMemo<IColorPickerContext>(\n        () => ({\n            selectedColor: internalSelectedColor,\n            updateSelectedColor,\n            hueColor: internalHueColor,\n            updateHueColor,\n            isPresetColor: internalIsPresetColor,\n            updateIsPresetColor,\n            shouldGetCoordinates: internalShouldGetCoordinates,\n            updateShouldGetCoordinates,\n            shouldCallOnSelect: internalShouldCallOnSelect,\n            updateShouldCallOnSelect,\n            canGetColorFromArea: internalCanGetColorFromArea,\n            updateCanGetColorFromArea,\n        }),\n        [\n            internalCanGetColorFromArea,\n            internalHueColor,\n            internalIsPresetColor,\n            internalSelectedColor,\n            internalShouldCallOnSelect,\n            internalShouldGetCoordinates,\n            updateCanGetColorFromArea,\n            updateHueColor,\n            updateIsPresetColor,\n            updateSelectedColor,\n            updateShouldCallOnSelect,\n            updateShouldGetCoordinates,\n        ],\n    );\n\n    return (\n        <ColorPickerContext.Provider value={providerValue}>{children}</ColorPickerContext.Provider>\n    );\n};\n\nColorPickerProvider.displayName = 'ColorPickerProvider';\n\nexport default ColorPickerProvider;\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,39 @@
+import React from 'react';
+import ColorPickerProvider from '../ColorPickerProvider';
+import ColorPickerWrapper from './color-picker-wrapper/ColorPickerWrapper';
+import { StyledColorPicker } from './ColorPicker.styles';
+const ColorPicker = _ref => {
+  let {
+    children,
+    onPresetColorAdd,
+    onPresetColorRemove,
+    onSelect,
+    presetColors,
+    selectedColor = 'rgba(0, 94, 184, 1)',
+    shouldShowAsPopup = true,
+    shouldShowMoreOptions = false,
+    shouldShowPresetColors = false,
+    shouldShowPreviewColorString = true,
+    shouldShowRoundPreviewColor = true,
+    shouldShowTransparencySlider = false,
+    shouldUseSiteColors = false
+  } = _ref;
+  return /*#__PURE__*/React.createElement(ColorPickerProvider, {
+    selectedColor: selectedColor,
+    onSelect: onSelect
+  }, /*#__PURE__*/React.createElement(StyledColorPicker, null, /*#__PURE__*/React.createElement(ColorPickerWrapper, {
+    onPresetColorAdd: onPresetColorAdd,
+    onPresetColorRemove: onPresetColorRemove,
+    presetColors: presetColors,
+    shouldShowAsPopup: shouldShowAsPopup,
+    shouldShowMoreOptions: shouldShowMoreOptions,
+    shouldShowPresetColors: shouldShowPresetColors,
+    shouldShowPreviewColorString: shouldShowPreviewColorString,
+    shouldShowRoundPreviewColor: shouldShowRoundPreviewColor,
+    shouldShowTransparencySlider: shouldShowTransparencySlider,
+    shouldUseSiteColors: shouldUseSiteColors
+  }, children)));
+};
+ColorPicker.displayName = 'ColorPicker';
+export default ColorPicker;
+//# sourceMappingURL=ColorPicker.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.js","names":["React","ColorPickerProvider","ColorPickerWrapper","StyledColorPicker","ColorPicker","_ref","children","onPresetColorAdd","onPresetColorRemove","onSelect","presetColors","selectedColor","shouldShowAsPopup","shouldShowMoreOptions","shouldShowPresetColors","shouldShowPreviewColorString","shouldShowRoundPreviewColor","shouldShowTransparencySlider","shouldUseSiteColors","createElement","displayName"],"sources":["../../../../src/components/color-picker/ColorPicker.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport type { IPresetColor } from '../../types/colorPicker';\nimport ColorPickerProvider from '../ColorPickerProvider';\nimport ColorPickerWrapper from './color-picker-wrapper/ColorPickerWrapper';\nimport { StyledColorPicker } from './ColorPicker.styles';\n\ninterface ColorPickerProps {\n    /**\n     * The element that should be rendered to trigger the ColorPicker popup on click.\n     */\n    children?: ReactNode;\n    /**\n     * Function to be executed when a preset color is added.\n     */\n    onPresetColorAdd?: (presetColor: IPresetColor) => void;\n    /**\n     * Function to be executed when a preset color is removed.\n     */\n    onPresetColorRemove?: (presetColorId: IPresetColor['id']) => void;\n    /**\n     * Function to be executed when a color is selected.\n     */\n    onSelect?: (color: string) => void;\n    /**\n     * Colors the user can select from.\n     */\n    presetColors?: IPresetColor[];\n    /**\n     * The color that should be preselected.\n     */\n    selectedColor?: string;\n    /**\n     * Whether the ColorPicker should be displayed inside a popup.\n     */\n    shouldShowAsPopup?: boolean;\n    /**\n     * Whether the more options accordion should be displayed.\n     */\n    shouldShowMoreOptions?: boolean;\n    /**\n     * Whether the preset colors should be displayed.\n     */\n    shouldShowPresetColors?: boolean;\n    /**\n     * Whether the preview color should be displayed as text.\n     */\n    shouldShowPreviewColorString?: boolean;\n    /**\n     * Whether the preview color should be displayed round.\n     */\n    shouldShowRoundPreviewColor?: boolean;\n    /**\n     * Whether the transparency slider should be displayed.\n     */\n    shouldShowTransparencySlider?: boolean;\n    /**\n     * Whether presetColors should be got and uploaded to the site storage.\n     */\n    shouldUseSiteColors?: boolean;\n}\n\nconst ColorPicker = ({\n    children,\n    onPresetColorAdd,\n    onPresetColorRemove,\n    onSelect,\n    presetColors,\n    selectedColor = 'rgba(0, 94, 184, 1)',\n    shouldShowAsPopup = true,\n    shouldShowMoreOptions = false,\n    shouldShowPresetColors = false,\n    shouldShowPreviewColorString = true,\n    shouldShowRoundPreviewColor = true,\n    shouldShowTransparencySlider = false,\n    shouldUseSiteColors = false,\n}: ColorPickerProps) => (\n    <ColorPickerProvider selectedColor={selectedColor} onSelect={onSelect}>\n        <StyledColorPicker>\n            <ColorPickerWrapper\n                onPresetColorAdd={onPresetColorAdd}\n                onPresetColorRemove={onPresetColorRemove}\n                presetColors={presetColors}\n                shouldShowAsPopup={shouldShowAsPopup}\n                shouldShowMoreOptions={shouldShowMoreOptions}\n                shouldShowPresetColors={shouldShowPresetColors}\n                shouldShowPreviewColorString={shouldShowPreviewColorString}\n                shouldShowRoundPreviewColor={shouldShowRoundPreviewColor}\n                shouldShowTransparencySlider={shouldShowTransparencySlider}\n                shouldUseSiteColors={shouldUseSiteColors}\n            >\n                {children}\n            </ColorPickerWrapper>\n        </StyledColorPicker>\n    </ColorPickerProvider>\n);\n\nColorPicker.displayName = 'ColorPicker';\n\nexport default ColorPicker;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AAExC,OAAOC,mBAAmB,MAAM,wBAAwB;AACxD,OAAOC,kBAAkB,MAAM,2CAA2C;AAC1E,SAASC,iBAAiB,QAAQ,sBAAsB;AAyDxD,MAAMC,WAAW,GAAGC,IAAA;EAAA,IAAC;IACjBC,QAAQ;IACRC,gBAAgB;IAChBC,mBAAmB;IACnBC,QAAQ;IACRC,YAAY;IACZC,aAAa,GAAG,qBAAqB;IACrCC,iBAAiB,GAAG,IAAI;IACxBC,qBAAqB,GAAG,KAAK;IAC7BC,sBAAsB,GAAG,KAAK;IAC9BC,4BAA4B,GAAG,IAAI;IACnCC,2BAA2B,GAAG,IAAI;IAClCC,4BAA4B,GAAG,KAAK;IACpCC,mBAAmB,GAAG;EACR,CAAC,GAAAb,IAAA;EAAA,oBACfL,KAAA,CAAAmB,aAAA,CAAClB,mBAAmB;IAACU,aAAa,EAAEA,aAAc;IAACF,QAAQ,EAAEA;EAAS,gBAClET,KAAA,CAAAmB,aAAA,CAAChB,iBAAiB,qBACdH,KAAA,CAAAmB,aAAA,CAACjB,kBAAkB;IACfK,gBAAgB,EAAEA,gBAAiB;IACnCC,mBAAmB,EAAEA,mBAAoB;IACzCE,YAAY,EAAEA,YAAa;IAC3BE,iBAAiB,EAAEA,iBAAkB;IACrCC,qBAAqB,EAAEA,qBAAsB;IAC7CC,sBAAsB,EAAEA,sBAAuB;IAC/CC,4BAA4B,EAAEA,4BAA6B;IAC3DC,2BAA2B,EAAEA,2BAA4B;IACzDC,4BAA4B,EAAEA,4BAA6B;IAC3DC,mBAAmB,EAAEA;EAAoB,GAExCZ,QACe,CACL,CACF,CAAC;AAAA,CACzB;AAEDF,WAAW,CAACgB,WAAW,GAAG,aAAa;AAEvC,eAAehB,WAAW","ignoreList":[]}

package/lib/esm/components/color-picker/ColorPicker.styles.js

@@ -0,0 +1,5 @@
+import styled from 'styled-components';
+export const StyledColorPicker = styled.div`
+    // width: 100%;
+`;
+//# sourceMappingURL=ColorPicker.styles.js.map

package/lib/esm/components/color-picker/ColorPicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.styles.js","names":["styled","StyledColorPicker","div"],"sources":["../../../../src/components/color-picker/ColorPicker.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledColorPicker = styled.div`\n    // width: 100%;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,iBAAiB,GAAGD,MAAM,CAACE,GAAG;AAC3C;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/color-picker/color-picker-wrapper/ColorPickerWrapper.js

@@ -0,0 +1,42 @@
+import { Popup } from '@chayns-components/core';
+import React, { useContext, useMemo } from 'react';
+import ColorPickerPopup from '../../color-picker-popup/ColorPickerPopup';
+import { ColorPickerContext } from '../../ColorPickerProvider';
+import { StyledColorPickerWrapper, StyledColorPickerWrapperInfo, StyledColorPickerWrapperInfoColor, StyledColorPickerWrapperInfoColorWrapper, StyledColorPickerWrapperInfoText } from './ColorPickerWrapper.styles';
+const ColorPickerWrapper = _ref => {
+  let {
+    children,
+    onPresetColorAdd,
+    onPresetColorRemove,
+    presetColors,
+    shouldShowAsPopup,
+    shouldShowMoreOptions,
+    shouldShowPresetColors,
+    shouldShowPreviewColorString,
+    shouldShowRoundPreviewColor,
+    shouldShowTransparencySlider,
+    shouldUseSiteColors
+  } = _ref;
+  const {
+    selectedColor
+  } = useContext(ColorPickerContext);
+  const content = useMemo(() => /*#__PURE__*/React.createElement(ColorPickerPopup, {
+    shouldShowPresetColors: shouldShowPresetColors,
+    onPresetColorRemove: onPresetColorRemove,
+    onPresetColorAdd: onPresetColorAdd,
+    presetColors: presetColors,
+    shouldUseSiteColors: shouldUseSiteColors,
+    shouldShowMoreOptions: shouldShowMoreOptions,
+    shouldShowTransparencySlider: shouldShowTransparencySlider
+  }), [onPresetColorAdd, onPresetColorRemove, presetColors, shouldShowMoreOptions, shouldShowPresetColors, shouldShowTransparencySlider, shouldUseSiteColors]);
+  return /*#__PURE__*/React.createElement(StyledColorPickerWrapper, null, shouldShowAsPopup ? /*#__PURE__*/React.createElement(Popup, {
+    content: content
+  }, children ?? /*#__PURE__*/React.createElement(StyledColorPickerWrapperInfo, null, /*#__PURE__*/React.createElement(StyledColorPickerWrapperInfoColorWrapper, {
+    $shouldShowRoundPreviewColor: shouldShowRoundPreviewColor
+  }, /*#__PURE__*/React.createElement(StyledColorPickerWrapperInfoColor, {
+    $color: selectedColor
+  })), shouldShowPreviewColorString && /*#__PURE__*/React.createElement(StyledColorPickerWrapperInfoText, null, selectedColor))) : content);
+};
+ColorPickerWrapper.displayName = 'ColorPickerWrapper';
+export default ColorPickerWrapper;
+//# sourceMappingURL=ColorPickerWrapper.js.map

package/lib/esm/components/color-picker/color-picker-wrapper/ColorPickerWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPickerWrapper.js","names":["Popup","React","useContext","useMemo","ColorPickerPopup","ColorPickerContext","StyledColorPickerWrapper","StyledColorPickerWrapperInfo","StyledColorPickerWrapperInfoColor","StyledColorPickerWrapperInfoColorWrapper","StyledColorPickerWrapperInfoText","ColorPickerWrapper","_ref","children","onPresetColorAdd","onPresetColorRemove","presetColors","shouldShowAsPopup","shouldShowMoreOptions","shouldShowPresetColors","shouldShowPreviewColorString","shouldShowRoundPreviewColor","shouldShowTransparencySlider","shouldUseSiteColors","selectedColor","content","createElement","$shouldShowRoundPreviewColor","$color","displayName"],"sources":["../../../../../src/components/color-picker/color-picker-wrapper/ColorPickerWrapper.tsx"],"sourcesContent":["import { Popup } from '@chayns-components/core';\nimport React, { ReactNode, useContext, useMemo } from 'react';\nimport type { IPresetColor } from '../../../types/colorPicker';\nimport ColorPickerPopup from '../../color-picker-popup/ColorPickerPopup';\nimport { ColorPickerContext } from '../../ColorPickerProvider';\nimport {\n    StyledColorPickerWrapper,\n    StyledColorPickerWrapperInfo,\n    StyledColorPickerWrapperInfoColor,\n    StyledColorPickerWrapperInfoColorWrapper,\n    StyledColorPickerWrapperInfoText,\n} from './ColorPickerWrapper.styles';\n\ninterface ColorPickerWrapperProps {\n    children?: ReactNode;\n    onPresetColorAdd?: (presetColor: IPresetColor) => void;\n    onPresetColorRemove?: (presetColorId: IPresetColor['id']) => void;\n    presetColors?: IPresetColor[];\n    shouldShowAsPopup: boolean;\n    shouldShowMoreOptions: boolean;\n    shouldShowPresetColors: boolean;\n    shouldShowPreviewColorString: boolean;\n    shouldShowRoundPreviewColor: boolean;\n    shouldShowTransparencySlider: boolean;\n    shouldUseSiteColors: boolean;\n}\n\nconst ColorPickerWrapper = ({\n    children,\n    onPresetColorAdd,\n    onPresetColorRemove,\n    presetColors,\n    shouldShowAsPopup,\n    shouldShowMoreOptions,\n    shouldShowPresetColors,\n    shouldShowPreviewColorString,\n    shouldShowRoundPreviewColor,\n    shouldShowTransparencySlider,\n    shouldUseSiteColors,\n}: ColorPickerWrapperProps) => {\n    const { selectedColor } = useContext(ColorPickerContext);\n\n    const content = useMemo(\n        () => (\n            <ColorPickerPopup\n                shouldShowPresetColors={shouldShowPresetColors}\n                onPresetColorRemove={onPresetColorRemove}\n                onPresetColorAdd={onPresetColorAdd}\n                presetColors={presetColors}\n                shouldUseSiteColors={shouldUseSiteColors}\n                shouldShowMoreOptions={shouldShowMoreOptions}\n                shouldShowTransparencySlider={shouldShowTransparencySlider}\n            />\n        ),\n        [\n            onPresetColorAdd,\n            onPresetColorRemove,\n            presetColors,\n            shouldShowMoreOptions,\n            shouldShowPresetColors,\n            shouldShowTransparencySlider,\n            shouldUseSiteColors,\n        ],\n    );\n\n    return (\n        <StyledColorPickerWrapper>\n            {shouldShowAsPopup ? (\n                <Popup content={content}>\n                    {children ?? (\n                        <StyledColorPickerWrapperInfo>\n                            <StyledColorPickerWrapperInfoColorWrapper\n                                $shouldShowRoundPreviewColor={shouldShowRoundPreviewColor}\n                            >\n                                <StyledColorPickerWrapperInfoColor $color={selectedColor} />\n                            </StyledColorPickerWrapperInfoColorWrapper>\n\n                            {shouldShowPreviewColorString && (\n                                <StyledColorPickerWrapperInfoText>\n                                    {selectedColor}\n                                </StyledColorPickerWrapperInfoText>\n                            )}\n                        </StyledColorPickerWrapperInfo>\n                    )}\n                </Popup>\n            ) : (\n                content\n            )}\n        </StyledColorPickerWrapper>\n    );\n};\n\nColorPickerWrapper.displayName = 'ColorPickerWrapper';\n\nexport default ColorPickerWrapper;\n"],"mappings":"AAAA,SAASA,KAAK,QAAQ,yBAAyB;AAC/C,OAAOC,KAAK,IAAeC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAE7D,OAAOC,gBAAgB,MAAM,2CAA2C;AACxE,SAASC,kBAAkB,QAAQ,2BAA2B;AAC9D,SACIC,wBAAwB,EACxBC,4BAA4B,EAC5BC,iCAAiC,EACjCC,wCAAwC,EACxCC,gCAAgC,QAC7B,6BAA6B;AAgBpC,MAAMC,kBAAkB,GAAGC,IAAA,IAYI;EAAA,IAZH;IACxBC,QAAQ;IACRC,gBAAgB;IAChBC,mBAAmB;IACnBC,YAAY;IACZC,iBAAiB;IACjBC,qBAAqB;IACrBC,sBAAsB;IACtBC,4BAA4B;IAC5BC,2BAA2B;IAC3BC,4BAA4B;IAC5BC;EACqB,CAAC,GAAAX,IAAA;EACtB,MAAM;IAAEY;EAAc,CAAC,GAAGtB,UAAU,CAACG,kBAAkB,CAAC;EAExD,MAAMoB,OAAO,GAAGtB,OAAO,CACnB,mBACIF,KAAA,CAAAyB,aAAA,CAACtB,gBAAgB;IACbe,sBAAsB,EAAEA,sBAAuB;IAC/CJ,mBAAmB,EAAEA,mBAAoB;IACzCD,gBAAgB,EAAEA,gBAAiB;IACnCE,YAAY,EAAEA,YAAa;IAC3BO,mBAAmB,EAAEA,mBAAoB;IACzCL,qBAAqB,EAAEA,qBAAsB;IAC7CI,4BAA4B,EAAEA;EAA6B,CAC9D,CACJ,EACD,CACIR,gBAAgB,EAChBC,mBAAmB,EACnBC,YAAY,EACZE,qBAAqB,EACrBC,sBAAsB,EACtBG,4BAA4B,EAC5BC,mBAAmB,CAE3B,CAAC;EAED,oBACItB,KAAA,CAAAyB,aAAA,CAACpB,wBAAwB,QACpBW,iBAAiB,gBACdhB,KAAA,CAAAyB,aAAA,CAAC1B,KAAK;IAACyB,OAAO,EAAEA;EAAQ,GACnBZ,QAAQ,iBACLZ,KAAA,CAAAyB,aAAA,CAACnB,4BAA4B,qBACzBN,KAAA,CAAAyB,aAAA,CAACjB,wCAAwC;IACrCkB,4BAA4B,EAAEN;EAA4B,gBAE1DpB,KAAA,CAAAyB,aAAA,CAAClB,iCAAiC;IAACoB,MAAM,EAAEJ;EAAc,CAAE,CACrB,CAAC,EAE1CJ,4BAA4B,iBACzBnB,KAAA,CAAAyB,aAAA,CAAChB,gCAAgC,QAC5Bc,aAC6B,CAEZ,CAE/B,CAAC,GAERC,OAEkB,CAAC;AAEnC,CAAC;AAEDd,kBAAkB,CAACkB,WAAW,GAAG,oBAAoB;AAErD,eAAelB,kBAAkB","ignoreList":[]}