Liferay.Loader.define("@liferay/layout-content-page-editor-web@3.0.132/page_editor/common/components/ImageSelectorSize",["module","exports","require","@frontend-taglib-clay$clayui/form","@liferay/frontend-js-react-web","liferay!frontend-js-react-web$prop-types","liferay!frontend-js-react-web$react","../../app/contexts/CollectionItemContext","../../app/contexts/GlobalContext","../../app/contexts/StoreContext","../../app/selectors/selectLanguageId","../../app/services/ImageService","../../app/utils/editable-value/isMapped","../../app/utils/editable-value/resolveEditableValue","../../core/hooks/useId"],(function(e,t,a){window;{Object.defineProperty(t,"__esModule",{value:!0}),t.ImageSelectorSize=function({fieldValue:t,getEditableElement:a=E,imageSizeId:m,onImageSizeIdChanged:b=null}){const[y,g]=(0,l.useState)(t.fileEntryId||""),w=(0,o.useGetFieldValue)(),O=(0,i.useGlobalContext)(),h=(0,p.useId)(),[j,S]=(0,l.useState)(I),[x,C]=(0,l.useState)([]),L=(0,r.useIsMounted)(),P=(0,u.useSelector)(c.default),_=(0,u.useSelector)((e=>e.selectedViewportSize));return(0,l.useEffect)((()=>{t.fileEntryId?g(t.fileEntryId):(0,d.default)(t)&&(0,f.default)(t,P,w).then((e=>{L()&&g((null==e?void 0:e.fileEntryId)||"")}))}),[t,w,L,P]),(0,l.useEffect)((()=>{const t=x.find((e=>e.value===m))||I;if(t.value===e){const t=a(),n=()=>{null==t||t.removeEventListener("load",n);const a=x.find((({mediaQuery:e})=>{const t=O.window;return!e||t.matchMedia(e).matches}))||x.find((({value:t})=>t===e))||I;S(v(v({},a),{},{width:parseInt(a.width||(null==t?void 0:t.naturalWidth)||(null==t?void 0:t.getBoundingClientRect().width)||O.document.body.getBoundingClientRect().width,10)}))};if(t&&!t.complete&&"IMG"===t.tagName)return t.addEventListener("load",n),()=>{t.removeEventListener("load",n)};n()}else S(t)}),[a,O,m,x,_]),(0,l.useEffect)((()=>{y?s.default.getAvailableImageConfigurations({fileEntryId:y,onNetworkStatus:()=>{}}).then((e=>{C([...e].sort(((e,t)=>e.width-t.width)))})):C([])}),[y]),l.default.createElement(n.default.Group,{className:"mb-3"},b&&l.default.createElement(n.default.Group,{className:"mb-2"},l.default.createElement("label",{htmlFor:h},Liferay.Language.get("resolution")),l.default.createElement(n.ClaySelectWithOption,{className:"form-control form-control-sm",id:h,name:h,onChange:e=>b(e.target.value),options:x.map((({label:e,value:t})=>({label:e,value:t}))),value:m||e})),!!j.width&&l.default.createElement("p",{className:"m-0 small text-secondary"},l.default.createElement("b",null,Liferay.Language.get("width"),":"),l.default.createElement("span",{className:"ml-1"},j.width,"px")),!!j.size&&l.default.createElement("p",{className:"m-0 small text-secondary"},l.default.createElement("b",null,Liferay.Language.get("file-size"),":"),l.default.createElement("span",{className:"ml-1"},Number(j.size).toFixed(2),"kB")))},t.DEFAULT_IMAGE_SIZE_ID=void 0;var n=y(a("@frontend-taglib-clay$clayui/form")),r=a("@liferay/frontend-js-react-web"),l=(m(a("liferay!frontend-js-react-web$prop-types")),y(a("liferay!frontend-js-react-web$react"))),o=a("../../app/contexts/CollectionItemContext"),i=a("../../app/contexts/GlobalContext"),u=a("../../app/contexts/StoreContext"),c=m(a("../../app/selectors/selectLanguageId")),s=m(a("../../app/services/ImageService")),d=m(a("../../app/utils/editable-value/isMapped")),f=m(a("../../app/utils/editable-value/resolveEditableValue")),p=a("../../core/hooks/useId");function m(e){return e&&e.__esModule?e:{default:e}}function b(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return b=function(){return e},e}function y(e){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=b();if(t&&t.has(e))return t.get(e);var a={},n=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var r in e)if(Object.prototype.hasOwnProperty.call(e,r)){var l=n?Object.getOwnPropertyDescriptor(e,r):null;l&&(l.get||l.set)?Object.defineProperty(a,r,l):a[r]=e[r]}return a.default=e,t&&t.set(e,a),a}function g(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,n)}return a}function v(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?g(Object(a),!0).forEach((function(t){w(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):g(Object(a)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}function w(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const e="auto";t.DEFAULT_IMAGE_SIZE_ID=e;const E=()=>null,I={size:null,value:e,width:null}}}));
//# sourceMappingURL=ImageSelectorSize.js.map