\n {colors.map((hex, idx) => (\n {\n swatchRefs.current[idx] = el;\n }}\n className={`dswidgets-colorpicker-swatch-wrapper ${overlayState.isOpen && editingIndex === idx && openAbove ? \"dswidgets-colorpicker-popover-above\" : \"\"}`}\n >\n {\n if (!open) overlayState.close();\n }}\n >\n openForIndex(idx)}\n style={{ backgroundColor: hex }}\n />\n \n

\n {presetColors.length > 0 && (\n \n {presetColors.map((presetHex) => (\n \n \n \n ))}\n \n )}\n

\n \n CHOOSE\n \n \n CANCEL\n \n \n \n \n

\n \n )}\n \n \n \n

\n ))}\n {canAdd && (\n {\n swatchRefs.current[colors.length] = el;\n }}\n className={`dswidgets-colorpicker-swatch-wrapper ${overlayState.isOpen && editingIndex === colors.length && openAbove ? \"dswidgets-colorpicker-popover-above\" : \"\"}`}\n >\n {\n if (!open) overlayState.close();\n }}\n >\n {\n setEditingIndex(colors.length);\n setDraftColor(\"#000000\");\n overlayState.open();\n }}\n >\n +\n \n \n \n \n \n \n )}\n \n \n \n \n );\n}\n","deleted","label",[178,179,160],"frontend","components","permalink","https://www.val.town/x/datasketch/dswidgetsengine/code/frontend/components/ColorPicker.tsx","extension","actionData","errors"]