{
  "version": 3,
  "sources": ["../../../src/components/dataform-controls/color.tsx"],
  "sourcesContent": ["/**\n * External dependencies\n */\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tColorPicker,\n\tDropdown,\n\tprivateApis,\n\t__experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedInputControl } = unlock( privateApis );\n\nconst ColorPickerDropdown = ( {\n\tcolor,\n\tonColorChange,\n}: {\n\tcolor: string;\n\tonColorChange: ( newColor: string ) => void;\n} ) => {\n\tconst validColor = color && colord( color ).isValid() ? color : '#ffffff';\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName=\"dataviews-controls__color-picker-dropdown\"\n\t\t\tpopoverProps={ { resize: false } }\n\t\t\trenderToggle={ ( { onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\taria-label={ __( 'Open color picker' ) }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\ticon={ () => <ColorIndicator colorValue={ validColor } /> }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\tcolor={ validColor }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t/>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n};\n\nexport default function Color< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { label, placeholder, description, setValue, isValid } = field;\n\tconst value = field.getValue( { item: data } ) || '';\n\n\tconst handleColorChange = useCallback(\n\t\t( newColor: string ) => {\n\t\t\tonChange( setValue( { item: data, value: newColor } ) );\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst handleInputChange = useCallback(\n\t\t( newValue: string | undefined ) => {\n\t\t\tonChange( setValue( { item: data, value: newValue || '' } ) );\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\treturn (\n\t\t<ValidatedInputControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tplaceholder={ placeholder }\n\t\t\tvalue={ value }\n\t\t\thelp={ description }\n\t\t\tonChange={ handleInputChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\ttype=\"text\"\n\t\t\tprefix={\n\t\t\t\t<InputControlPrefixWrapper variant=\"control\">\n\t\t\t\t\t<ColorPickerDropdown\n\t\t\t\t\t\tcolor={ value }\n\t\t\t\t\t\tonColorChange={ handleColorChange }\n\t\t\t\t\t/>\n\t\t\t\t</InputControlPrefixWrapper>\n\t\t\t}\n\t\t/>\n\t);\n}\n"],
  "mappings": ";AAGA,SAAS,cAAc;AAKvB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,2CAA2C;AAAA,EAC3C,wCAAwC;AAAA,OAClC;AACP,SAAS,mBAAmB;AAC5B,SAAS,UAAU;AAMnB,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAsBZ;AApBlB,IAAM,EAAE,sBAAsB,IAAI,OAAQ,WAAY;AAEtD,IAAM,sBAAsB,CAAE;AAAA,EAC7B;AAAA,EACA;AACD,MAGO;AACN,QAAM,aAAa,SAAS,OAAQ,KAAM,EAAE,QAAQ,IAAI,QAAQ;AAEhE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,cAAe,EAAE,QAAQ,MAAM;AAAA,MAC/B,cAAe,CAAE,EAAE,SAAS,MAC3B;AAAA,QAAC;AAAA;AAAA,UACA,SAAU;AAAA,UACV,cAAa,GAAI,mBAAoB;AAAA,UACrC,MAAK;AAAA,UACL,MAAO,MAAM,oBAAC,kBAAe,YAAa,YAAa;AAAA;AAAA,MACxD;AAAA,MAED,eAAgB,MACf,oBAAC,0BAAuB,aAAY,QACnC;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ;AAAA,UACR,UAAW;AAAA,UACX,aAAW;AAAA;AAAA,MACZ,GACD;AAAA;AAAA,EAEF;AAEF;AAEe,SAAR,MAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,aAAa,aAAa,UAAU,QAAQ,IAAI;AAC/D,QAAM,QAAQ,MAAM,SAAU,EAAE,MAAM,KAAK,CAAE,KAAK;AAElD,QAAM,oBAAoB;AAAA,IACzB,CAAE,aAAsB;AACvB,eAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD;AAAA,IACA,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,QAAM,oBAAoB;AAAA,IACzB,CAAE,aAAkC;AACnC,eAAU,SAAU,EAAE,MAAM,MAAM,OAAO,YAAY,GAAG,CAAE,CAAE;AAAA,IAC7D;AAAA,IACA,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAO;AAAA,MACP,UAAW;AAAA,MACX;AAAA,MACA,MAAK;AAAA,MACL,QACC,oBAAC,6BAA0B,SAAQ,WAClC;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ;AAAA,UACR,eAAgB;AAAA;AAAA,MACjB,GACD;AAAA;AAAA,EAEF;AAEF;",
  "names": []
}