{"version":3,"file":"FluentColorPicker.mjs","names":["React","useState","useCallback","SketchPicker","makeStyles","FluentIconButton","EyedropperIcon","useStyles","theme","buttonContainer","display","alignItems","color","width","spacing","height","borderRadius","background","props","currentColor","hex","swatch","justifyContent","boxShadow","marginLeft","popover","position","zIndex","cover","top","right","bottom","left","FluentColorPicker","$","_c","handleColorChange","onChange","value","displayColorPicker","setDisplayColorPicker","setCurrentColor","t0","classes","t1","Symbol","for","handleOpen","t2","handleClose","t3","newColor","handleChange","t4","t5","t6","t7","t8","t9"],"sources":["../../../../src/UI/inputs/pickers/FluentColorPicker.jsx"],"sourcesContent":["//JIRA: UNT-3388, Author: Mithara Silva, Date: 06/09/2023=====\nimport React, { useState, useCallback } from 'react';\nimport { SketchPicker } from 'react-color';\nimport { makeStyles } from '@material-ui/core';\nimport { FluentIconButton } from '../buttons/FluentIconButton';\nimport { EyedropperIcon } from '@fluentui/react-icons';\n\nconst useStyles = makeStyles((theme) => ({\n buttonContainer: {\n display: 'flex',\n alignItems: 'center'\n },\n color: {\n width: theme.spacing(3),\n height: theme.spacing(2),\n borderRadius: theme.spacing(0.25),\n background: (props) => props.currentColor?.hex ? props.currentColor.hex : props.currentColor\n },\n swatch: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-around',\n background: '#fff',\n width: theme.spacing(3.5),\n height: theme.spacing(2.5),\n borderRadius: theme.spacing(0.25),\n boxShadow: '0 0 0 1px rgba(0,0,0,.1)',\n marginLeft: theme.spacing(0.5)\n },\n popover: {\n position: 'absolute',\n zIndex: '2'\n },\n cover: {\n position: 'fixed',\n top: '0px',\n right: '0px',\n bottom: '0px',\n left: '0px'\n }\n}));\n\nexport const FluentColorPicker = (props) => {\n const { handleColorChange, onChange, value } = props;\n const [displayColorPicker, setDisplayColorPicker] = useState(false);\n const [currentColor, setCurrentColor] = useState(`${value ? ( value?.hex ? value.hex : value ) : ''}`);\n const classes = useStyles({ currentColor: currentColor, ...props });\n\n\n const handleOpen = () => {\n setDisplayColorPicker(true);\n };\n\n const handleClose = () => {\n setDisplayColorPicker(false);\n };\n\n const handleChange = useCallback(\n (newColor) => {\n if (handleColorChange) {\n handleColorChange(newColor);\n }\n else if (onChange) {\n onChange(newColor.hex);\n }\n setCurrentColor(newColor.hex);\n },\n [handleColorChange, onChange]\n );\n\n return (\n
\n
\n
\n \n
\n
\n
\n
\n
\n {displayColorPicker ? (\n
\n
\n \n
\n ) : null}\n
\n );\n};\n"],"mappings":"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"}