1 line
7.5 KiB
JSON
1 line
7.5 KiB
JSON
|
{"ast":null,"code":"import * as React from 'react';\nimport { useEvent, useMergedState } from 'rc-util';\nimport { useLocale } from '../../locale';\nimport { generateColor } from '../util';\n/**\n * Combine the `color` and `mode` to make sure sync of state.\n */\nexport default function useModeColor(defaultValue, value, mode) {\n const [locale] = useLocale('ColorPicker');\n // ======================== Base ========================\n // Color\n const [mergedColor, setMergedColor] = useMergedState(defaultValue, {\n value\n });\n // Mode\n const [modeState, setModeState] = React.useState('single');\n const [modeOptionList, modeSet] = React.useMemo(() => {\n const list = (Array.isArray(mode) ? mode : [mode]).filter(m => m);\n if (!list.length) {\n list.push('single');\n }\n const modes = new Set(list);\n const optionList = [];\n const pushOption = (modeType, localeTxt) => {\n if (modes.has(modeType)) {\n optionList.push({\n label: localeTxt,\n value: modeType\n });\n }\n };\n pushOption('single', locale.singleColor);\n pushOption('gradient', locale.gradientColor);\n return [optionList, modes];\n }, [mode]);\n // ======================== Post ========================\n // We need align `mode` with `color` state\n // >>>>> Color\n const [cacheColor, setCacheColor] = React.useState(null);\n const setColor = useEvent(nextColor => {\n setCacheColor(nextColor);\n setMergedColor(nextColor);\n });\n const postColor = React.useMemo(() => {\n const colorObj = generateColor(mergedColor || '');\n // Use `cacheColor` in case the color is `cleared`\n return colorObj.equals(cacheColor) ? cacheColor : colorObj;\n }, [mergedColor, cacheColor]);\n // >>>>> Mode\n const postMode = React.useMemo(() => {\n var _a;\n if (modeSet.has(modeState)) {\n return modeState;\n }\n return (_a = modeOptionList[0]) === null || _a === void 0 ? void 0 : _a.value;\n }, [modeSet, modeState, modeOptionList]);\n // ======================= Effect =======================\n // Dynamic update mode when color change\n React.useEffect(() => {\n setModeState(postColor.isGradient() ? 'gradient' : 'single');\n }, [postColor]);\n // ======================= Return =======================\n return [postColor, setColor, postMode, setModeState, modeOptionList];\n}","map":{"version":3,"names":["React","useEvent","useMergedState","useLocale","generateColor","useModeColor","defaultValue","value","mode","locale","mergedColor","setMergedColor","modeState","setModeState","useState","modeOptionList","modeSet","useMemo","list","Array","isArray","filter","m","length","push","modes","Set","optionList","pushOption","modeType","localeTxt","has","label","singleColor","gradientColor","cacheColor","setCacheColor","setColor","nextColor","postColor","colorObj","equals","postMode","_a","useEffect","isGradient"],"sources":["C:/Users/Аришина)/source/repos/PromoCursed/node_modules/antd/es/color-picker/hooks/useModeColor.js"],"sourcesContent":["import * as React from 'react';\nimport { useEvent, useMergedState } from 'rc-util';\nimport { useLocale } from '../../locale';\nimport { generateColor } from '../util';\n/**\n * Combine the `color` and `mode` to make sure sync of state.\n */\nexport default function useModeColor(defaultValue, value, mode) {\n const [locale] = useLocale('ColorPicker');\n // ======================== Base ========================\n // Color\n const [mergedColor, setMergedColor] = useMergedState(defaultValue, {\n value\n });\n // Mode\n const [modeState, setModeState] = React.useState('single');\n const [modeOptionList, modeSet] = React.useMemo(() => {\n const list = (Array.isArray(mode) ? mode : [mode]).filter(m => m);\n if (!list.length) {\n list.push('single');\n }\n const modes = new Set(list);\n const optionList = [];\n const pushOption = (modeType, localeTxt) => {\n if (modes.has(modeType)) {\n optionList.push({\n label: localeTxt,\n value: modeType\n });\n
|