Liferay.Loader.define("@liferay/layout-content-page-editor-web@3.0.179/page_editor/app/components/fragment_configuration_fields/ColorPickerField",["module","exports","require","@liferay/layout-js-components-web","liferay!frontend-js-react-web$prop-types","liferay!frontend-js-react-web$react","../../../plugins/page_design_options/hooks/useStyleBook","../../../prop_types/index","../../contexts/ControlsContext","../../contexts/GlobalContext","../../contexts/StoreContext","../../selectors/selectCanDetachTokenValues","../../utils/getLayoutDataItemUniqueClassName","../../utils/getResetLabelByViewport","./ColorPaletteField"],(function(e,t,o){window;{Object.defineProperty(t,"__esModule",{value:!0}),t.ColorPickerField=function ColorPickerField({field:e,isCustomStyle:t,onValueSelect:o,value:p}){const y=(0,a.useActiveItemId)(),g=(0,i.useSelector)(s.default),[C,_]=(0,l.useState)(null),b=(0,u.useGlobalContext)(),w=(0,i.useSelector)((e=>e.selectedViewportSize)),{tokenValues:k}=(0,n.useStyleBook)(),v=(0,l.useMemo)((()=>(0,d.getResetLabelByViewport)(w)),[w]);return(0,l.useEffect)((()=>{if(!e.cssProperty)return void _(null);if(p)return void _(null);const t=b.document.querySelector(".".concat((0,c.default)(y)));if(!t)return void _(null);const o=b.window.getComputedStyle(t).getPropertyValue(e.cssProperty);_(o?(0,r.convertRGBtoHex)(o):null)}),[y,e.cssProperty,b,p]),Object.keys(k).length?l.default.createElement(r.ColorPicker,{activeItemId:y,canDetachTokenValues:g,defaultTokenLabel:C||r.DEFAULT_TOKEN_LABEL,defaultTokenValue:C,field:e,onValueSelect:o,restoreButtonLabel:v,selectedViewportSize:w,showLabel:t,tokenValues:k,value:p}):l.default.createElement(f.ColorPaletteField,{field:e,onValueSelect:(e,t)=>{var r;return o(e,null!==(r=null==t?void 0:t.rgbValue)&&void 0!==r?r:"")},value:p})};var r=o("@liferay/layout-js-components-web"),l=(_interopRequireDefault(o("liferay!frontend-js-react-web$prop-types")),function _interopRequireWildcard(e){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache();if(t&&t.has(e))return t.get(e);var o={},r=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if(Object.prototype.hasOwnProperty.call(e,l)){var n=r?Object.getOwnPropertyDescriptor(e,l):null;n&&(n.get||n.set)?Object.defineProperty(o,l,n):o[l]=e[l]}o.default=e,t&&t.set(e,o);return o}(o("liferay!frontend-js-react-web$react"))),n=o("../../../plugins/page_design_options/hooks/useStyleBook"),a=(o("../../../prop_types/index"),o("../../contexts/ControlsContext")),u=o("../../contexts/GlobalContext"),i=o("../../contexts/StoreContext"),s=_interopRequireDefault(o("../../selectors/selectCanDetachTokenValues")),c=_interopRequireDefault(o("../../utils/getLayoutDataItemUniqueClassName")),d=o("../../utils/getResetLabelByViewport"),f=o("./ColorPaletteField");function _getRequireWildcardCache(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return _getRequireWildcardCache=function _getRequireWildcardCache(){return e},e}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}}}));
//# sourceMappingURL=ColorPickerField.js.map