@orangelogic/orange-dam-content-browser-sdk 2.2.7 → 2.2.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -283,7 +283,7 @@
|
|
|
283
283
|
display: none;
|
|
284
284
|
}
|
|
285
285
|
}
|
|
286
|
-
`,ln=e=>{let{itemKey:t,type:n,loading:r,selected:o,all:i,rest:a,mappedDisplayNames:s,collections:l,partialSyncCheckbox:c}=e;const u=(0,xt.useRef)(null),d=(0,xt.useMemo)((()=>{const e=u.current;if(!e)return;const n=Object.keys(a).some((e=>l.includes(`${t}>>${e}`)));return o||n?!o&&n?(e.indeterminate=!0,!1):o:(e.previouslySelected=!1,e.indeterminate=!1,!1)}),[o,l,a,t]);return(0,Ut.jsxs)("cx-tree-item",{ref:u,"data-value":t,"data-type":n,readonly:r,selected:d||void 0,"partial-sync-checkboxes":c,children:[s[t]," ",!!i&&`(${i})`,Object.entries(a).map((e=>{let[o,i]=e;return(0,Ut.jsxs)("cx-tree-item",{"data-value":`${t}>>${o}`,"data-type":n,readonly:r,selected:l.includes(`${t}>>${o}`),children:[s[`${t}>>${o}`]," (",i,")"]},o)}))]})},cn=e=>{let{values:t,type:n,displayName:r,collections:o,loading:i=!1}=e;const[a,s]=(0,xt.useState)(1),l=(0,xt.useMemo)((()=>t.reduce(((e,t)=>{let{value:n,count:r}=t;const[o,i]=n.split(">>");return e[o]&&"object"===typeof e[o]||(e[o]?e[o]={all:e[o]}:e[o]={}),i&&(e[o][i]=r),e[o].all=(e[o].all||0)+r,e}),{})),[t]),c=(0,xt.useMemo)((()=>{const e={};return t.forEach((t=>{e[t.value]=t.displayValue})),t.forEach((t=>{const n=t.value.split(">>");if(n.length>1){const t=n.slice(0,-1).join(">>");e[t]||(e[t]=t.split(" ").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join(" "))}})),e}),[t]),u=(0,xt.useMemo)((()=>Object.keys(l).length>20*a),[l,a]);return 0===t.length?null:(0,Ut.jsxs)("cx-details",{open:!0,className:"filter-details",children:[(0,Ut.jsxs)("cx-space",{slot:"summary","align-items":"center",spacing:"x-small",wrap:"nowrap",children:[(0,Ut.jsx)("span",{children:r}),i&&(0,Ut.jsx)("cx-spinner",{})]}),(0,Ut.jsx)("cx-space",{direction:"vertical",children:(0,Ut.jsxs)("cx-tree",{selection:"multiple","label-select-single":!0,"data-facet":n,"no-indeterminate-previously-selected":!0,children:[Object.entries(l).slice(0,20*a).map((e=>{let[t,r]=e;if("object"===typeof r){const e=o.includes(t),{all:a,...s}=r,l=Object.values(s).reduce(((e,t)=>e+t),0);return(0,Ut.jsx)(ln,{itemKey:t,type:n,loading:i,selected:e,all:a,rest:s,mappedDisplayNames:c,collections:o,partialSyncCheckbox:l<a||void 0},t)}return(0,Ut.jsxs)("cx-tree-item",{"data-value":t,"data-type":n,readonly:i,selected:o.includes(t),children:[c[t]," (",r,")"]},t)})),u&&(0,Ut.jsx)(Ht,{loadMore:()=>s((e=>e+1)),isLoading:i,disabled:i})]})})]})},un=e=>{let{allowSorting:t,availableFacets:n,currentCount:r,loading:o,facets:i,isMobile:a,isSeeThrough:s,searchValue:l,selectedFacets:c,sortDirection:u,sortOrder:d,sortOrders:h,totalCount:p,view:f,onSearchChange:g,onSettingChange:m}=e;const[v,b]=(0,xt.useState)(!1),[y,A]=(0,xt.useState)({type:void 0,value:void 0}),x=(0,xt.useRef)(null),w=(0,xt.useRef)(null),C=(0,xt.useRef)(null),E=(0,xt.useRef)(null),k=(0,xt.useRef)(null);(0,xt.useEffect)((()=>{Promise.all([customElements.whenDefined("cx-input"),customElements.whenDefined("cx-checkbox"),customElements.whenDefined("cx-dropdown")]).then((()=>b(!0)))}),[]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.target.value;l!==t&&g(t)},t=x.current;return null===t||void 0===t||t.addEventListener("cx-change",e),()=>{null===t||void 0===t||t.removeEventListener("cx-change",e)}}),[v,l,g]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.detail.item.value;"see-thru"===t?m("isSeeThrough",!s):m("view",null!==t&&void 0!==t?t:Jt.gf.Medium)},t=C.current;return null===t||void 0===t||t.addEventListener("cx-select",e),()=>{null===t||void 0===t||t.removeEventListener("cx-select",e)}}),[v,s,m]),(0,xt.useEffect)((()=>{const e=k.current;if(!v||!e)return;const t=e.closest(".cbsdk__home");t&&(e.flipBoundary=t,e.shiftBoundary=t)}),[v]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.target,n=t.dataset.type,r=t.dataset.value;if(!r||!n)return;const o={...c};o[n]&&(o[n]=o[n].filter((e=>e!==r))),m("filter",o)},t=e=>{const t=e.target.dataset.facet;if(!t)return;A({type:"filter",value:t});const n=e.detail.selection.reduce(((e,t)=>{const n=t.dataset.type,r=t.dataset.value;return r&&n?(e[n]||(e[n]=[]),e[n].push(r),e):e}),{...c,[t]:[]});m("filter",n)},n=e=>{const t=e.detail.item.dataset.type,n=e.detail.item.value;n&&("sort-direction"===t?(A({type:"sortDirection",value:n}),m("sortDirection",n)):"sort-order"===t&&(A({type:"sortOrder",value:n}),m("sortOrder",n)))},r=w.current,o=E.current;return null===r||void 0===r||r.addEventListener("cx-selection-change",t),null===r||void 0===r||r.addEventListener("cx-remove",e),null===o||void 0===o||o.addEventListener("cx-select",n),()=>{null===r||void 0===r||r.removeEventListener("cx-selection-change",t),null===r||void 0===r||r.removeEventListener("cx-remove",e),null===o||void 0===o||o.removeEventListener("cx-select",n)}}),[v,c,m]);const S=(0,xt.useMemo)((()=>an.find((e=>e.value===f))),[f]),I=(0,xt.useMemo)((()=>{var e;return null!==(e=null===i||void 0===i?void 0:i.reduce(((e,t)=>{const n=t.values.reduce(((e,t)=>{let{value:n,displayValue:r}=t;return e[n]=r,e}),{});return{...e,[t.facetDetails.facetFieldName]:n}}),{}))&&void 0!==e?e:{}}),[i]),_=(0,xt.useMemo)((()=>Object.entries(c).reduce(((e,t)=>{let[n,r]=t;return I[n]?e+r.filter((e=>I[n][e])).length:e}),0)),[c,I]),B=(0,xt.useCallback)((()=>(0,Ut.jsxs)("cx-details",{"data-cy":"applied-filters",open:!0,className:("filter-details "+(0===_?"filter-details--empty":"")).trim(),children:[(0,Ut.jsxs)("cx-space",{slot:"summary","align-items":"center",spacing:"x-small",wrap:"nowrap",children:[(0,Ut.jsxs)("span",{children:["Applied filters"," ",_>0?` (${_})`:""]}),o&&"filter"===y.type&&(0,Ut.jsx)("cx-spinner",{})]}),(0,Ut.jsx)("cx-space",{direction:"horizontal",spacing:"small",style:{maxWidth:"320px"},children:Object.entries(c).map((e=>{let[t,n]=e;return n&&0!==n.length?n.filter((e=>I[t][e])).map((e=>(0,Ut.jsxs)("cx-tag",{removable:!0,"data-value":e,"data-type":t,size:"small",children:[I[t][e],(0,Ut.jsx)("cx-icon",{slot:"suffix",name:"close"})]},e))):null}))}),_>0&&(0,Ut.jsxs)("cx-button",{variant:"text",className:"clear-all-button",onClick:()=>{m("filter",{mediaTypes:[],visibilityClasses:[],statuses:[],extensions:[]})},children:["Clear all",(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"clear",label:"Clear"})]})]})),[_,o,I,y.type,m,c]);return(0,Ut.jsxs)(sn,{children:[(0,Ut.jsxs)("cx-space",{"align-items":"center",spacing:"x-small",wrap:"nowrap",style:{flex:1},children:[(0,Ut.jsx)("cx-input",{ref:x,value:l,placeholder:"Search...",clearable:!0,className:"search-input",children:(0,Ut.jsx)("cx-icon",{name:"search",slot:"prefix",className:"icon--large"})}),(0,Ut.jsxs)("cx-dropdown",{ref:w,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"Filter",children:(0,Ut.jsx)("cx-icon-button",{name:"filter_alt",label:"Filter",outline:!0,"data-cy":"filter-button",children:_>0&&(0,Ut.jsx)("cx-badge",{slot:"badge",pill:!0,size:"small",children:_})})})}),B(),n.length>0&&(0,Ut.jsx)("cx-space",{direction:"vertical",className:"filter-details",children:n.map((e=>{const t=null===i||void 0===i?void 0:i.find((t=>t.facetDetails.facetFieldName===e.facetFieldName));return t?(0,Ut.jsx)(cn,{values:t.values,displayName:t.facetDetails.displayName,type:t.facetDetails.facetFieldName,collections:c[t.facetDetails.facetFieldName]||[]},t.facetDetails.facetFieldName):null}))})]})]}),(0,Ut.jsxs)("cx-space",{"align-items":"center",spacing:"x-small",wrap:"nowrap",style:{marginLeft:"auto"},children:[(0,Ut.jsx)(Kt,{lines:1,children:(0,Ut.jsxs)("cx-typography",{variant:"body3",children:[r," of ",p]})}),(0,Ut.jsxs)("cx-dropdown",{ref:C,"auto-width-factor":a?1:.6,"stay-open-on-select":!0,placement:"bottom-end",skidding:a?40:0,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"View",children:(0,Ut.jsx)("cx-icon-button",{name:"dashboard",label:"View",outline:!0,"data-cy":"view-button"})})}),a?(0,Ut.jsxs)("cx-menu",{variant:"multiple",children:[(0,Ut.jsxs)("cx-menu",{active:!0,name:"main",children:[(0,Ut.jsx)("cx-menu-label",{children:"View"}),(0,Ut.jsxs)("cx-menu-item",{menu:"submenu",class:S?"selected":"",children:["Grid (",null===S||void 0===S?void 0:S.label,")",(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"grid_view"})]}),(0,Ut.jsx)("cx-divider",{}),(0,Ut.jsxs)("cx-menu-item",{value:"see-thru",className:"menu-item--switch",children:[(0,Ut.jsx)(Kt,{lines:1,children:"See-thru"}),(0,Ut.jsx)("cx-switch",{checked:s,onClick:e=>e.preventDefault()})]})]}),(0,Ut.jsx)("cx-menu",{name:"submenu",back:"main",children:an.map((e=>(0,Ut.jsxs)("cx-menu-item",{value:e.value.toString(),class:e.value===f?"selected":"",children:[(0,Ut.jsx)(Kt,{lines:1,children:e.label}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:f===e.value?"check":""})]},e.value)))})]},"multiple-menu"):(0,Ut.jsxs)("cx-menu",{children:[(0,Ut.jsx)("cx-menu-label",{children:"View"}),(0,Ut.jsxs)("cx-menu-item",{ref:k,class:S?"selected":"",children:["Grid (",null===S||void 0===S?void 0:S.label,")",(0,Ut.jsx)("cx-menu",{slot:"submenu",children:an.map((e=>(0,Ut.jsxs)("cx-menu-item",{value:e.value.toString(),class:e.value===f?"selected":"",children:[(0,Ut.jsx)(Kt,{lines:1,children:e.label}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:f===e.value?"check":""})]},e.value)))}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"grid_view"})]}),(0,Ut.jsx)("cx-divider",{}),(0,Ut.jsxs)("cx-menu-item",{value:"see-thru",className:"menu-item--switch",children:[(0,Ut.jsx)(Kt,{lines:1,children:"See-thru"}),(0,Ut.jsx)("cx-switch",{checked:s,onClick:e=>e.preventDefault()})]})]},"default-menu")]}),(0,Ut.jsxs)("cx-dropdown",{ref:E,"auto-width-factor":a?1:.5,"stay-open-on-select":!0,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"Sort",children:(0,Ut.jsx)("cx-icon-button",{name:"sort",label:"Sort",outline:!0,"data-cy":"sort-button"})})}),(0,Ut.jsxs)("cx-menu",{children:[(h?on.map((e=>{var t,n;const r=null===(t=h[d])||void 0===t||null===(n=t.find((t=>t.sortDirection.toLowerCase()===e.value.toLowerCase())))||void 0===n?void 0:n.sortDirectionDisplayName;return{...e,label:null!==r&&void 0!==r?r:e.value}})):on).map((e=>(0,Ut.jsxs)("cx-menu-item",{"data-type":"sort-direction",disabled:!t,value:e.value,class:t&&u===e.value?"selected":"",children:[e.label.replace(/\b\w/g,(e=>e.toUpperCase())),o&&"sortDirection"===y.type&&y.value===e.value?(0,Ut.jsx)("cx-spinner",{slot:"prefix"}):(0,Ut.jsx)(e.icon,{})]},e.value))),(0,Ut.jsx)("cx-divider",{}),Object.keys(null!==h&&void 0!==h?h:{}).map((e=>(0,Ut.jsxs)("cx-menu-item",{"data-type":"sort-order",value:e,class:d===e?"selected":"",children:[e.replace(/\b\w/g,(e=>e.toUpperCase())),o&&"sortOrder"===y.type&&y.value===e?(0,Ut.jsx)("cx-spinner",{slot:"prefix"}):(0,Ut.jsx)("cx-icon",{slot:"prefix",name:d===e?"check":""})]},e)))]})]})]})]})};var dn=n(8743);const hn=(e,t)=>{const n=(e,t)=>0===t?e:n(t,e%t),r=Math.round(e),o=Math.round(t),i=n(r,o);return{width:r/i,height:o/i}},pn=(e,t,n)=>{const r=n*Math.PI/180;if(n%90===0)return{width:n%180===0?e:t,height:n%180===0?t:e};const o=Math.abs(Math.cos(r)),i=Math.abs(Math.sin(r)),a=e*o+t*i,s=e*i+t*o;return{width:Math.round(a),height:Math.round(s)}};var fn=function(e,t){return fn=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},fn(e,t)};function gn(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}fn(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var mn=function(){return mn=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},mn.apply(this,arguments)};Object.create;Object.create;"function"===typeof SuppressedError&&SuppressedError;var vn=n(1185),bn=n.n(vn);function yn(e,t,n,r,o){void 0===o&&(o=0);var i=Sn(t.width,t.height,o),a=i.width,s=i.height;return{x:An(e.x,a,n.width,r),y:An(e.y,s,n.height,r)}}function An(e,t,n,r){var o=t*r/2-n/2;return In(e,-o,o)}function xn(e,t){return Math.sqrt(Math.pow(e.y-t.y,2)+Math.pow(e.x-t.x,2))}function wn(e,t){return 180*Math.atan2(t.y-e.y,t.x-e.x)/Math.PI}function Cn(e,t){return Math.min(e,Math.max(0,t))}function En(e,t){return t}function kn(e,t){return{x:(t.x+e.x)/2,y:(t.y+e.y)/2}}function Sn(e,t,n){var r=n*Math.PI/180;return{width:Math.abs(Math.cos(r)*e)+Math.abs(Math.sin(r)*t),height:Math.abs(Math.sin(r)*e)+Math.abs(Math.cos(r)*t)}}function In(e,t,n){return Math.min(Math.max(e,t),n)}function _n(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter((function(e){return"string"===typeof e&&e.length>0})).join(" ").trim()}var Bn=function(e){function t(){var n=null!==e&&e.apply(this,arguments)||this;return n.cropperRef=xt.createRef(),n.imageRef=xt.createRef(),n.videoRef=xt.createRef(),n.containerPosition={x:0,y:0},n.containerRef=null,n.styleRef=null,n.containerRect=null,n.mediaSize={width:0,height:0,naturalWidth:0,naturalHeight:0},n.dragStartPosition={x:0,y:0},n.dragStartCrop={x:0,y:0},n.gestureZoomStart=0,n.gestureRotationStart=0,n.isTouching=!1,n.lastPinchDistance=0,n.lastPinchRotation=0,n.rafDragTimeout=null,n.rafPinchTimeout=null,n.wheelTimer=null,n.currentDoc="undefined"!==typeof document?document:null,n.currentWindow="undefined"!==typeof window?window:null,n.resizeObserver=null,n.state={cropSize:null,hasWheelJustStarted:!1,mediaObjectFit:void 0},n.initResizeObserver=function(){if("undefined"!==typeof window.ResizeObserver&&n.containerRef){var e=!0;n.resizeObserver=new window.ResizeObserver((function(t){e?e=!1:n.computeSizes()})),n.resizeObserver.observe(n.containerRef)}},n.preventZoomSafari=function(e){return e.preventDefault()},n.cleanEvents=function(){n.currentDoc&&(n.currentDoc.removeEventListener("mousemove",n.onMouseMove),n.currentDoc.removeEventListener("mouseup",n.onDragStopped),n.currentDoc.removeEventListener("touchmove",n.onTouchMove),n.currentDoc.removeEventListener("touchend",n.onDragStopped),n.currentDoc.removeEventListener("gesturemove",n.onGestureMove),n.currentDoc.removeEventListener("gestureend",n.onGestureEnd),n.currentDoc.removeEventListener("scroll",n.onScroll))},n.clearScrollEvent=function(){n.containerRef&&n.containerRef.removeEventListener("wheel",n.onWheel),n.wheelTimer&&clearTimeout(n.wheelTimer)},n.onMediaLoad=function(){var e=n.computeSizes();e&&(n.emitCropData(),n.setInitialCrop(e)),n.props.onMediaLoaded&&n.props.onMediaLoaded(n.mediaSize)},n.setInitialCrop=function(e){if(n.props.initialCroppedAreaPercentages){var t=function(e,t,n,r,o,i){var a=Sn(t.width,t.height,n),s=In(r.width/a.width*(100/e.width),o,i);return{crop:{x:s*a.width/2-r.width/2-a.width*s*(e.x/100),y:s*a.height/2-r.height/2-a.height*s*(e.y/100)},zoom:s}}(n.props.initialCroppedAreaPercentages,n.mediaSize,n.props.rotation,e,n.props.minZoom,n.props.maxZoom),r=t.crop,o=t.zoom;n.props.onCropChange(r),n.props.onZoomChange&&n.props.onZoomChange(o)}else if(n.props.initialCroppedAreaPixels){var i=function(e,t,n,r,o,i){void 0===n&&(n=0);var a=Sn(t.naturalWidth,t.naturalHeight,n),s=In(function(e,t,n){var r=function(e){return e.width>e.height?e.width/e.naturalWidth:e.height/e.naturalHeight}(t);return n.height>n.width?n.height/(e.height*r):n.width/(e.width*r)}(e,t,r),o,i),l=r.height>r.width?r.height/e.height:r.width/e.width;return{crop:{x:((a.width-e.width)/2-e.x)*l,y:((a.height-e.height)/2-e.y)*l},zoom:s}}(n.props.initialCroppedAreaPixels,n.mediaSize,n.props.rotation,e,n.props.minZoom,n.props.maxZoom);r=i.crop,o=i.zoom;n.props.onCropChange(r),n.props.onZoomChange&&n.props.onZoomChange(o)}},n.computeSizes=function(){var e,t,r,o,i,a,s=n.imageRef.current||n.videoRef.current;if(s&&n.containerRef){n.containerRect=n.containerRef.getBoundingClientRect(),n.saveContainerPosition();var l=n.containerRect.width/n.containerRect.height,c=(null===(e=n.imageRef.current)||void 0===e?void 0:e.naturalWidth)||(null===(t=n.videoRef.current)||void 0===t?void 0:t.videoWidth)||0,u=(null===(r=n.imageRef.current)||void 0===r?void 0:r.naturalHeight)||(null===(o=n.videoRef.current)||void 0===o?void 0:o.videoHeight)||0,d=c/u,h=void 0;if(s.offsetWidth<c||s.offsetHeight<u)switch(n.state.mediaObjectFit){default:case"contain":h=l>d?{width:n.containerRect.height*d,height:n.containerRect.height}:{width:n.containerRect.width,height:n.containerRect.width/d};break;case"horizontal-cover":h={width:n.containerRect.width,height:n.containerRect.width/d};break;case"vertical-cover":h={width:n.containerRect.height*d,height:n.containerRect.height}}else h={width:s.offsetWidth,height:s.offsetHeight};n.mediaSize=mn(mn({},h),{naturalWidth:c,naturalHeight:u}),n.props.setMediaSize&&n.props.setMediaSize(n.mediaSize);var p=n.props.cropSize?n.props.cropSize:function(e,t,n,r,o,i){void 0===i&&(i=0);var a=Sn(e,t,i),s=a.width,l=a.height,c=Math.min(s,n),u=Math.min(l,r);return c>u*o?{width:u*o,height:u}:{width:c,height:c/o}}(n.mediaSize.width,n.mediaSize.height,n.containerRect.width,n.containerRect.height,n.props.aspect,n.props.rotation);return(null===(i=n.state.cropSize)||void 0===i?void 0:i.height)===p.height&&(null===(a=n.state.cropSize)||void 0===a?void 0:a.width)===p.width||n.props.onCropSizeChange&&n.props.onCropSizeChange(p),n.setState({cropSize:p},n.recomputeCropPosition),n.props.setCropSize&&n.props.setCropSize(p),p}},n.saveContainerPosition=function(){if(n.containerRef){var e=n.containerRef.getBoundingClientRect();n.containerPosition={x:e.left,y:e.top}}},n.onMouseDown=function(e){n.currentDoc&&(e.preventDefault(),n.currentDoc.addEventListener("mousemove",n.onMouseMove),n.currentDoc.addEventListener("mouseup",n.onDragStopped),n.saveContainerPosition(),n.onDragStart(t.getMousePoint(e)))},n.onMouseMove=function(e){return n.onDrag(t.getMousePoint(e))},n.onScroll=function(e){n.currentDoc&&(e.preventDefault(),n.saveContainerPosition())},n.onTouchStart=function(e){n.currentDoc&&(n.isTouching=!0,n.props.onTouchRequest&&!n.props.onTouchRequest(e)||(n.currentDoc.addEventListener("touchmove",n.onTouchMove,{passive:!1}),n.currentDoc.addEventListener("touchend",n.onDragStopped),n.saveContainerPosition(),2===e.touches.length?n.onPinchStart(e):1===e.touches.length&&n.onDragStart(t.getTouchPoint(e.touches[0]))))},n.onTouchMove=function(e){e.preventDefault(),2===e.touches.length?n.onPinchMove(e):1===e.touches.length&&n.onDrag(t.getTouchPoint(e.touches[0]))},n.onGestureStart=function(e){n.currentDoc&&(e.preventDefault(),n.currentDoc.addEventListener("gesturechange",n.onGestureMove),n.currentDoc.addEventListener("gestureend",n.onGestureEnd),n.gestureZoomStart=n.props.zoom,n.gestureRotationStart=n.props.rotation)},n.onGestureMove=function(e){if(e.preventDefault(),!n.isTouching){var r=t.getMousePoint(e),o=n.gestureZoomStart-1+e.scale;if(n.setNewZoom(o,r,{shouldUpdatePosition:!0}),n.props.onRotationChange){var i=n.gestureRotationStart+e.rotation;n.props.onRotationChange(i)}}},n.onGestureEnd=function(e){n.cleanEvents()},n.onDragStart=function(e){var t,r,o=e.x,i=e.y;n.dragStartPosition={x:o,y:i},n.dragStartCrop=mn({},n.props.crop),null===(r=(t=n.props).onInteractionStart)||void 0===r||r.call(t)},n.onDrag=function(e){var t=e.x,r=e.y;n.currentWindow&&(n.rafDragTimeout&&n.currentWindow.cancelAnimationFrame(n.rafDragTimeout),n.rafDragTimeout=n.currentWindow.requestAnimationFrame((function(){if(n.state.cropSize&&void 0!==t&&void 0!==r){var e=t-n.dragStartPosition.x,o=r-n.dragStartPosition.y,i={x:n.dragStartCrop.x+e,y:n.dragStartCrop.y+o},a=n.props.restrictPosition?yn(i,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):i;n.props.onCropChange(a)}})))},n.onDragStopped=function(){var e,t;n.isTouching=!1,n.cleanEvents(),n.emitCropData(),null===(t=(e=n.props).onInteractionEnd)||void 0===t||t.call(e)},n.onWheel=function(e){if(n.currentWindow&&(!n.props.onWheelRequest||n.props.onWheelRequest(e))){e.preventDefault();var r=t.getMousePoint(e),o=bn()(e).pixelY,i=n.props.zoom-o*n.props.zoomSpeed/200;n.setNewZoom(i,r,{shouldUpdatePosition:!0}),n.state.hasWheelJustStarted||n.setState({hasWheelJustStarted:!0},(function(){var e,t;return null===(t=(e=n.props).onInteractionStart)||void 0===t?void 0:t.call(e)})),n.wheelTimer&&clearTimeout(n.wheelTimer),n.wheelTimer=n.currentWindow.setTimeout((function(){return n.setState({hasWheelJustStarted:!1},(function(){var e,t;return null===(t=(e=n.props).onInteractionEnd)||void 0===t?void 0:t.call(e)}))}),250)}},n.getPointOnContainer=function(e,t){var r=e.x,o=e.y;if(!n.containerRect)throw new Error("The Cropper is not mounted");return{x:n.containerRect.width/2-(r-t.x),y:n.containerRect.height/2-(o-t.y)}},n.getPointOnMedia=function(e){var t=e.x,r=e.y,o=n.props,i=o.crop,a=o.zoom;return{x:(t+i.x)/a,y:(r+i.y)/a}},n.setNewZoom=function(e,t,r){var o=(void 0===r?{}:r).shouldUpdatePosition,i=void 0===o||o;if(n.state.cropSize&&n.props.onZoomChange){var a=In(e,n.props.minZoom,n.props.maxZoom);if(i){var s=n.getPointOnContainer(t,n.containerPosition),l=n.getPointOnMedia(s),c={x:l.x*a-s.x,y:l.y*a-s.y},u=n.props.restrictPosition?yn(c,n.mediaSize,n.state.cropSize,a,n.props.rotation):c;n.props.onCropChange(u)}n.props.onZoomChange(a)}},n.getCropData=function(){return n.state.cropSize?function(e,t,n,r,o,i,a){void 0===i&&(i=0),void 0===a&&(a=!0);var s=a?Cn:En,l=Sn(t.width,t.height,i),c=Sn(t.naturalWidth,t.naturalHeight,i),u={x:s(100,((l.width-n.width/o)/2-e.x/o)/l.width*100),y:s(100,((l.height-n.height/o)/2-e.y/o)/l.height*100),width:s(100,n.width/l.width*100/o),height:s(100,n.height/l.height*100/o)},d=Math.round(s(c.width,u.width*c.width/100)),h=Math.round(s(c.height,u.height*c.height/100)),p=c.width>=c.height*r?{width:Math.round(h*r),height:h}:{width:d,height:Math.round(d/r)};return{croppedAreaPercentages:u,croppedAreaPixels:mn(mn({},p),{x:Math.round(s(c.width-p.width,u.x*c.width/100)),y:Math.round(s(c.height-p.height,u.y*c.height/100))})}}(n.props.restrictPosition?yn(n.props.crop,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):n.props.crop,n.mediaSize,n.state.cropSize,n.getAspect(),n.props.zoom,n.props.rotation,n.props.restrictPosition):null},n.emitCropData=function(){var e=n.getCropData();if(e){var t=e.croppedAreaPercentages,r=e.croppedAreaPixels;n.props.onCropComplete&&n.props.onCropComplete(t,r),n.props.onCropAreaChange&&n.props.onCropAreaChange(t,r)}},n.emitCropAreaChange=function(){var e=n.getCropData();if(e){var t=e.croppedAreaPercentages,r=e.croppedAreaPixels;n.props.onCropAreaChange&&n.props.onCropAreaChange(t,r)}},n.recomputeCropPosition=function(){if(n.state.cropSize){var e=n.props.restrictPosition?yn(n.props.crop,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):n.props.crop;n.props.onCropChange(e),n.emitCropData()}},n.onKeyDown=function(e){var t,r,o=n.props,i=o.crop,a=o.onCropChange,s=o.keyboardStep,l=o.zoom,c=o.rotation,u=s;if(n.state.cropSize){e.shiftKey&&(u*=.2);var d=mn({},i);switch(e.key){case"ArrowUp":d.y-=u,e.preventDefault();break;case"ArrowDown":d.y+=u,e.preventDefault();break;case"ArrowLeft":d.x-=u,e.preventDefault();break;case"ArrowRight":d.x+=u,e.preventDefault();break;default:return}n.props.restrictPosition&&(d=yn(d,n.mediaSize,n.state.cropSize,l,c)),e.repeat||null===(r=(t=n.props).onInteractionStart)||void 0===r||r.call(t),a(d)}},n.onKeyUp=function(e){var t,r;switch(e.key){case"ArrowUp":case"ArrowDown":case"ArrowLeft":case"ArrowRight":e.preventDefault();break;default:return}n.emitCropData(),null===(r=(t=n.props).onInteractionEnd)||void 0===r||r.call(t)},n}return gn(t,e),t.prototype.componentDidMount=function(){this.currentDoc&&this.currentWindow&&(this.containerRef&&(this.containerRef.ownerDocument&&(this.currentDoc=this.containerRef.ownerDocument),this.currentDoc.defaultView&&(this.currentWindow=this.currentDoc.defaultView),this.initResizeObserver(),"undefined"===typeof window.ResizeObserver&&this.currentWindow.addEventListener("resize",this.computeSizes),this.props.zoomWithScroll&&this.containerRef.addEventListener("wheel",this.onWheel,{passive:!1}),this.containerRef.addEventListener("gesturestart",this.onGestureStart)),this.currentDoc.addEventListener("scroll",this.onScroll),this.props.disableAutomaticStylesInjection||(this.styleRef=this.currentDoc.createElement("style"),this.styleRef.setAttribute("type","text/css"),this.props.nonce&&this.styleRef.setAttribute("nonce",this.props.nonce),this.styleRef.innerHTML=".reactEasyCrop_Container {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n overflow: hidden;\n user-select: none;\n touch-action: none;\n cursor: move;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.reactEasyCrop_Image,\n.reactEasyCrop_Video {\n will-change: transform; /* this improves performances and prevent painting issues on iOS Chrome */\n}\n\n.reactEasyCrop_Contain {\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n}\n.reactEasyCrop_Cover_Horizontal {\n width: 100%;\n height: auto;\n}\n.reactEasyCrop_Cover_Vertical {\n width: auto;\n height: 100%;\n}\n\n.reactEasyCrop_CropArea {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border: 1px solid rgba(255, 255, 255, 0.5);\n box-sizing: border-box;\n box-shadow: 0 0 0 9999em;\n color: rgba(0, 0, 0, 0.5);\n overflow: hidden;\n}\n\n.reactEasyCrop_CropAreaRound {\n border-radius: 50%;\n}\n\n.reactEasyCrop_CropAreaGrid::before {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 0;\n bottom: 0;\n left: 33.33%;\n right: 33.33%;\n border-top: 0;\n border-bottom: 0;\n}\n\n.reactEasyCrop_CropAreaGrid::after {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 33.33%;\n bottom: 33.33%;\n left: 0;\n right: 0;\n border-left: 0;\n border-right: 0;\n}\n",this.currentDoc.head.appendChild(this.styleRef)),this.imageRef.current&&this.imageRef.current.complete&&this.onMediaLoad(),this.props.setImageRef&&this.props.setImageRef(this.imageRef),this.props.setVideoRef&&this.props.setVideoRef(this.videoRef),this.props.setCropperRef&&this.props.setCropperRef(this.cropperRef))},t.prototype.componentWillUnmount=function(){var e,t;this.currentDoc&&this.currentWindow&&("undefined"===typeof window.ResizeObserver&&this.currentWindow.removeEventListener("resize",this.computeSizes),null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.containerRef&&this.containerRef.removeEventListener("gesturestart",this.preventZoomSafari),this.styleRef&&(null===(t=this.styleRef.parentNode)||void 0===t||t.removeChild(this.styleRef)),this.cleanEvents(),this.props.zoomWithScroll&&this.clearScrollEvent())},t.prototype.componentDidUpdate=function(e){var t,n,r,o,i,a,s,l,c;e.rotation!==this.props.rotation?(this.computeSizes(),this.recomputeCropPosition()):e.aspect!==this.props.aspect||e.objectFit!==this.props.objectFit?this.computeSizes():e.zoom!==this.props.zoom?this.recomputeCropPosition():(null===(t=e.cropSize)||void 0===t?void 0:t.height)!==(null===(n=this.props.cropSize)||void 0===n?void 0:n.height)||(null===(r=e.cropSize)||void 0===r?void 0:r.width)!==(null===(o=this.props.cropSize)||void 0===o?void 0:o.width)?this.computeSizes():(null===(i=e.crop)||void 0===i?void 0:i.x)===(null===(a=this.props.crop)||void 0===a?void 0:a.x)&&(null===(s=e.crop)||void 0===s?void 0:s.y)===(null===(l=this.props.crop)||void 0===l?void 0:l.y)||this.emitCropAreaChange(),e.zoomWithScroll!==this.props.zoomWithScroll&&this.containerRef&&(this.props.zoomWithScroll?this.containerRef.addEventListener("wheel",this.onWheel,{passive:!1}):this.clearScrollEvent()),e.video!==this.props.video&&(null===(c=this.videoRef.current)||void 0===c||c.load());var u=this.getObjectFit();u!==this.state.mediaObjectFit&&this.setState({mediaObjectFit:u},this.computeSizes)},t.prototype.getAspect=function(){var e=this.props,t=e.cropSize,n=e.aspect;return t?t.width/t.height:n},t.prototype.getObjectFit=function(){var e,t,n,r;if("cover"===this.props.objectFit){if((this.imageRef.current||this.videoRef.current)&&this.containerRef){this.containerRect=this.containerRef.getBoundingClientRect();var o=this.containerRect.width/this.containerRect.height;return((null===(e=this.imageRef.current)||void 0===e?void 0:e.naturalWidth)||(null===(t=this.videoRef.current)||void 0===t?void 0:t.videoWidth)||0)/((null===(n=this.imageRef.current)||void 0===n?void 0:n.naturalHeight)||(null===(r=this.videoRef.current)||void 0===r?void 0:r.videoHeight)||0)<o?"horizontal-cover":"vertical-cover"}return"horizontal-cover"}return this.props.objectFit},t.prototype.onPinchStart=function(e){var n=t.getTouchPoint(e.touches[0]),r=t.getTouchPoint(e.touches[1]);this.lastPinchDistance=xn(n,r),this.lastPinchRotation=wn(n,r),this.onDragStart(kn(n,r))},t.prototype.onPinchMove=function(e){var n=this;if(this.currentDoc&&this.currentWindow){var r=t.getTouchPoint(e.touches[0]),o=t.getTouchPoint(e.touches[1]),i=kn(r,o);this.onDrag(i),this.rafPinchTimeout&&this.currentWindow.cancelAnimationFrame(this.rafPinchTimeout),this.rafPinchTimeout=this.currentWindow.requestAnimationFrame((function(){var e=xn(r,o),t=n.props.zoom*(e/n.lastPinchDistance);n.setNewZoom(t,i,{shouldUpdatePosition:!1}),n.lastPinchDistance=e;var a=wn(r,o),s=n.props.rotation+(a-n.lastPinchRotation);n.props.onRotationChange&&n.props.onRotationChange(s),n.lastPinchRotation=a}))}},t.prototype.render=function(){var e,t=this,n=this.props,r=n.image,o=n.video,i=n.mediaProps,a=n.cropperProps,s=n.transform,l=n.crop,c=l.x,u=l.y,d=n.rotation,h=n.zoom,p=n.cropShape,f=n.showGrid,g=n.style,m=g.containerStyle,v=g.cropAreaStyle,b=g.mediaStyle,y=n.classes,A=y.containerClassName,x=y.cropAreaClassName,w=y.mediaClassName,C=null!==(e=this.state.mediaObjectFit)&&void 0!==e?e:this.getObjectFit();return xt.createElement("div",{onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,ref:function(e){return t.containerRef=e},"data-testid":"container",style:m,className:_n("reactEasyCrop_Container",A)},r?xt.createElement("img",mn({alt:"",className:_n("reactEasyCrop_Image","contain"===C&&"reactEasyCrop_Contain","horizontal-cover"===C&&"reactEasyCrop_Cover_Horizontal","vertical-cover"===C&&"reactEasyCrop_Cover_Vertical",w)},i,{src:r,ref:this.imageRef,style:mn(mn({},b),{transform:s||"translate(".concat(c,"px, ").concat(u,"px) rotate(").concat(d,"deg) scale(").concat(h,")")}),onLoad:this.onMediaLoad})):o&&xt.createElement("video",mn({autoPlay:!0,playsInline:!0,loop:!0,muted:!0,className:_n("reactEasyCrop_Video","contain"===C&&"reactEasyCrop_Contain","horizontal-cover"===C&&"reactEasyCrop_Cover_Horizontal","vertical-cover"===C&&"reactEasyCrop_Cover_Vertical",w)},i,{ref:this.videoRef,onLoadedMetadata:this.onMediaLoad,style:mn(mn({},b),{transform:s||"translate(".concat(c,"px, ").concat(u,"px) rotate(").concat(d,"deg) scale(").concat(h,")")}),controls:!1}),(Array.isArray(o)?o:[{src:o}]).map((function(e){return xt.createElement("source",mn({key:e.src},e))}))),this.state.cropSize&&xt.createElement("div",mn({ref:this.cropperRef,style:mn(mn({},v),{width:this.state.cropSize.width,height:this.state.cropSize.height}),tabIndex:0,onKeyDown:this.onKeyDown,onKeyUp:this.onKeyUp,"data-testid":"cropper",className:_n("reactEasyCrop_CropArea","round"===p&&"reactEasyCrop_CropAreaRound",f&&"reactEasyCrop_CropAreaGrid",x)},a)))},t.defaultProps={zoom:1,rotation:0,aspect:4/3,maxZoom:3,minZoom:1,cropShape:"rect",objectFit:"contain",showGrid:!0,style:{},classes:{},mediaProps:{},cropperProps:{},zoomSpeed:1,restrictPosition:!0,zoomWithScroll:!0,keyboardStep:1},t.getMousePoint=function(e){return{x:Number(e.clientX),y:Number(e.clientY)}},t.getTouchPoint=function(e){return{x:Number(e.clientX),y:Number(e.clientY)}},t}(xt.Component);const Tn=(e,t,n,r)=>{const o=n/r;let i=e,a=t;return e/t>o?i=Math.round(a*o):a=Math.round(i/o),{width:i,height:a}},On=async e=>{let{cropper:t,image:n,loadable:r,onLoadingChange:o,zoom:i}=e;const{width:a,height:s,x:l,y:c,unit:u}=t,d={x:l,y:c,width:a,height:s};if(d.x=l/100*n.width,d.y=c/100*n.height,r){if(o(!0),u===dn.Nf.AspectRatio){const{width:e,height:t}=Tn(n.width,n.height,a,s);d.width=e/i,d.height=t/i}const e=await((e,t)=>{const n=new Image;return n.src=e.url,n.crossOrigin="anonymous",new Promise((r=>{n.onload=()=>{const o=document.createElement("canvas");o.width=t.width,o.height=t.height;const i=o.getContext("2d");i?(i.drawImage(n,-t.x,-t.y,e.width,e.height),r(o.toDataURL("image/jpeg"))):r(e.url)},n.onerror=()=>{r(e.url)}}))})({url:n.url,width:n.width,height:n.height},d);return o(!1),e}return n.url},Pn=async e=>{let{image:t,loadable:n,onLoadingChange:r,rotation:o}=e;if(n){r(!0);const e=await((e,t)=>{const n=new Image;return n.src=e.url,n.crossOrigin="anonymous",new Promise((r=>{n.onload=()=>{const{width:o,height:i}=pn(e.width,e.height,t),a=document.createElement("canvas");a.width=o,a.height=i;const s=a.getContext("2d");s?(s.fillStyle="white",s.fillRect(0,0,o,i),s.translate(o/2,i/2),s.rotate(t*Math.PI/180),s.drawImage(n,-e.width/2,-e.height/2,e.width,e.height),s.rotate(-t*Math.PI/180),s.translate(-o/2,-i/2),r(a.toDataURL("image/jpeg"))):r(e.url)},n.onerror=()=>{r(e.url)}}))})({url:t.url,width:t.width,height:t.height},o);return r(!1),e}return t.url},Qn=Lt.Ay.div`
|
|
286
|
+
`,ln=e=>{let{itemKey:t,type:n,loading:r,selected:o,all:i,rest:a,mappedDisplayNames:s,collections:l,partialSyncCheckbox:c}=e;const u=(0,xt.useRef)(null),d=(0,xt.useMemo)((()=>{const e=u.current;if(!e)return;const n=Object.keys(a).some((e=>l.includes(`${t}>>${e}`)));return o||n?!o&&n?(e.indeterminate=!0,!1):o:(e.previouslySelected=!1,e.indeterminate=!1,!1)}),[o,l,a,t]);return(0,Ut.jsxs)("cx-tree-item",{ref:u,"data-value":t,"data-type":n,readonly:r,selected:d||void 0,"partial-sync-checkboxes":c,children:[s[t]," ",!!i&&`(${i})`,Object.entries(a).map((e=>{let[o,i]=e;return(0,Ut.jsxs)("cx-tree-item",{"data-value":`${t}>>${o}`,"data-type":n,readonly:r,selected:l.includes(`${t}>>${o}`),children:[s[`${t}>>${o}`]," (",i,")"]},o)}))]})},cn=e=>{let{values:t,type:n,displayName:r,collections:o,loading:i=!1}=e;const[a,s]=(0,xt.useState)(1),l=(0,xt.useMemo)((()=>t.reduce(((e,t)=>{let{value:n,count:r}=t;const[o,i]=n.split(">>");return e[o]&&"object"===typeof e[o]||(e[o]?e[o]={all:e[o]}:e[o]={}),i&&(e[o][i]=r),e[o].all=(e[o].all||0)+r,e}),{})),[t]),c=(0,xt.useMemo)((()=>{const e={};return t.forEach((t=>{e[t.value]=t.displayValue})),t.forEach((t=>{const n=t.value.split(">>");if(n.length>1){const t=n.slice(0,-1).join(">>");e[t]||(e[t]=t.split(" ").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join(" "))}})),e}),[t]),u=(0,xt.useMemo)((()=>Object.keys(l).length>20*a),[l,a]);return 0===t.length?null:(0,Ut.jsxs)("cx-details",{open:!0,className:"filter-details",children:[(0,Ut.jsxs)("cx-space",{slot:"summary","align-items":"center",spacing:"x-small",wrap:"nowrap",children:[(0,Ut.jsx)("span",{children:r}),i&&(0,Ut.jsx)("cx-spinner",{})]}),(0,Ut.jsx)("cx-space",{direction:"vertical",children:(0,Ut.jsxs)("cx-tree",{selection:"multiple","label-select-single":!0,"data-facet":n,"no-indeterminate-previously-selected":!0,children:[Object.entries(l).slice(0,20*a).map((e=>{let[t,r]=e;if("object"===typeof r){const e=o.includes(t),{all:a,...s}=r,l=Object.values(s).reduce(((e,t)=>e+t),0);return(0,Ut.jsx)(ln,{itemKey:t,type:n,loading:i,selected:e,all:a,rest:s,mappedDisplayNames:c,collections:o,partialSyncCheckbox:l<a||void 0},t)}return(0,Ut.jsxs)("cx-tree-item",{"data-value":t,"data-type":n,readonly:i,selected:o.includes(t),children:[c[t]," (",r,")"]},t)})),u&&(0,Ut.jsx)(Ht,{loadMore:()=>s((e=>e+1)),isLoading:i,disabled:i})]})})]})},un=e=>{let{allowSorting:t,availableFacets:n,currentCount:r,loading:o,facets:i,isMobile:a,isSeeThrough:s,searchValue:l,selectedFacets:c,sortDirection:u,sortOrder:d,sortOrders:h,totalCount:p,view:f,onSearchChange:g,onSettingChange:m}=e;const[v,b]=(0,xt.useState)(!1),[y,A]=(0,xt.useState)({type:void 0,value:void 0}),x=(0,xt.useRef)(null),w=(0,xt.useRef)(null),C=(0,xt.useRef)(null),E=(0,xt.useRef)(null),k=(0,xt.useRef)(null);(0,xt.useEffect)((()=>{Promise.all([customElements.whenDefined("cx-input"),customElements.whenDefined("cx-checkbox"),customElements.whenDefined("cx-dropdown")]).then((()=>b(!0)))}),[]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.target.value;l!==t&&g(t)},t=x.current;return null===t||void 0===t||t.addEventListener("cx-change",e),()=>{null===t||void 0===t||t.removeEventListener("cx-change",e)}}),[v,l,g]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.detail.item.value;"see-thru"===t?m("isSeeThrough",!s):m("view",null!==t&&void 0!==t?t:Jt.gf.Medium)},t=C.current;return null===t||void 0===t||t.addEventListener("cx-select",e),()=>{null===t||void 0===t||t.removeEventListener("cx-select",e)}}),[v,s,m]),(0,xt.useEffect)((()=>{const e=k.current;if(!v||!e)return;const t=e.closest(".cbsdk__home");t&&(e.flipBoundary=t,e.shiftBoundary=t)}),[v]),(0,xt.useEffect)((()=>{const e=e=>{const t=e.target,n=t.dataset.type,r=t.dataset.value;if(!r||!n)return;const o={...c};o[n]&&(o[n]=o[n].filter((e=>e!==r))),m("filter",o)},t=e=>{const t=e.target.dataset.facet;if(!t)return;A({type:"filter",value:t});const n=e.detail.selection.reduce(((e,t)=>{const n=t.dataset.type,r=t.dataset.value;return r&&n?(e[n]||(e[n]=[]),e[n].push(r),e):e}),{...c,[t]:[]});m("filter",n)},n=e=>{const t=e.detail.item.dataset.type,n=e.detail.item.value;n&&("sort-direction"===t?(A({type:"sortDirection",value:n}),m("sortDirection",n)):"sort-order"===t&&(A({type:"sortOrder",value:n}),m("sortOrder",n)))},r=w.current,o=E.current;return null===r||void 0===r||r.addEventListener("cx-selection-change",t),null===r||void 0===r||r.addEventListener("cx-remove",e),null===o||void 0===o||o.addEventListener("cx-select",n),()=>{null===r||void 0===r||r.removeEventListener("cx-selection-change",t),null===r||void 0===r||r.removeEventListener("cx-remove",e),null===o||void 0===o||o.removeEventListener("cx-select",n)}}),[v,c,m]);const S=(0,xt.useMemo)((()=>an.find((e=>e.value===f))),[f]),I=(0,xt.useMemo)((()=>{var e;return null!==(e=null===i||void 0===i?void 0:i.reduce(((e,t)=>{const n=t.values.reduce(((e,t)=>{let{value:n,displayValue:r}=t;return e[n]=r,e}),{});return{...e,[t.facetDetails.facetFieldName]:n}}),{}))&&void 0!==e?e:{}}),[i]),_=(0,xt.useMemo)((()=>Object.entries(c).reduce(((e,t)=>{let[n,r]=t;return I[n]?e+r.filter((e=>I[n][e])).length:e}),0)),[c,I]),B=(0,xt.useCallback)((()=>(0,Ut.jsxs)("cx-details",{"data-cy":"applied-filters",open:!0,className:("filter-details "+(0===_?"filter-details--empty":"")).trim(),children:[(0,Ut.jsxs)("cx-space",{slot:"summary","align-items":"center",spacing:"x-small",wrap:"nowrap",children:[(0,Ut.jsxs)("span",{children:["Applied filters"," ",_>0?` (${_})`:""]}),o&&"filter"===y.type&&(0,Ut.jsx)("cx-spinner",{})]}),(0,Ut.jsx)("cx-space",{direction:"horizontal",spacing:"small",style:{maxWidth:"320px"},children:Object.entries(c).map((e=>{let[t,n]=e;return n&&0!==n.length?n.filter((e=>I[t][e])).map((e=>(0,Ut.jsx)("cx-tag",{removable:!0,"data-value":e,"data-type":t,size:"small",children:I[t][e]},e))):null}))}),_>0&&(0,Ut.jsxs)("cx-button",{variant:"text",className:"clear-all-button",onClick:()=>{m("filter",{mediaTypes:[],visibilityClasses:[],statuses:[],extensions:[]})},children:["Clear all",(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"clear",label:"Clear"})]})]})),[_,o,I,y.type,m,c]);return(0,Ut.jsxs)(sn,{children:[(0,Ut.jsxs)("cx-space",{"align-items":"center",spacing:"x-small",wrap:"nowrap",style:{flex:1},children:[(0,Ut.jsx)("cx-input",{ref:x,value:l,placeholder:"Search...",clearable:!0,className:"search-input",children:(0,Ut.jsx)("cx-icon",{name:"search",slot:"prefix",className:"icon--large"})}),(0,Ut.jsxs)("cx-dropdown",{ref:w,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"Filter",children:(0,Ut.jsx)("cx-icon-button",{name:"filter_alt",label:"Filter",outline:!0,"data-cy":"filter-button",children:_>0&&(0,Ut.jsx)("cx-badge",{slot:"badge",pill:!0,size:"small",children:_})})})}),B(),n.length>0&&(0,Ut.jsx)("cx-space",{direction:"vertical",className:"filter-details",children:n.map((e=>{const t=null===i||void 0===i?void 0:i.find((t=>t.facetDetails.facetFieldName===e.facetFieldName));return t?(0,Ut.jsx)(cn,{values:t.values,displayName:t.facetDetails.displayName,type:t.facetDetails.facetFieldName,collections:c[t.facetDetails.facetFieldName]||[]},t.facetDetails.facetFieldName):null}))})]})]}),(0,Ut.jsxs)("cx-space",{"align-items":"center",spacing:"x-small",wrap:"nowrap",style:{marginLeft:"auto"},children:[(0,Ut.jsx)(Kt,{lines:1,children:(0,Ut.jsxs)("cx-typography",{variant:"body3",children:[r," of ",p]})}),(0,Ut.jsxs)("cx-dropdown",{ref:C,"auto-width-factor":a?1:.6,"stay-open-on-select":!0,placement:"bottom-end",skidding:a?40:0,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"View",children:(0,Ut.jsx)("cx-icon-button",{name:"dashboard",label:"View",outline:!0,"data-cy":"view-button"})})}),a?(0,Ut.jsxs)("cx-menu",{variant:"multiple",children:[(0,Ut.jsxs)("cx-menu",{active:!0,name:"main",children:[(0,Ut.jsx)("cx-menu-label",{children:"View"}),(0,Ut.jsxs)("cx-menu-item",{menu:"submenu",class:S?"selected":"",children:["Grid (",null===S||void 0===S?void 0:S.label,")",(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"grid_view"})]}),(0,Ut.jsx)("cx-divider",{}),(0,Ut.jsxs)("cx-menu-item",{value:"see-thru",className:"menu-item--switch",children:[(0,Ut.jsx)(Kt,{lines:1,children:"See-thru"}),(0,Ut.jsx)("cx-switch",{checked:s,onClick:e=>e.preventDefault()})]})]}),(0,Ut.jsx)("cx-menu",{name:"submenu",back:"main",children:an.map((e=>(0,Ut.jsxs)("cx-menu-item",{value:e.value.toString(),class:e.value===f?"selected":"",children:[(0,Ut.jsx)(Kt,{lines:1,children:e.label}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:f===e.value?"check":""})]},e.value)))})]},"multiple-menu"):(0,Ut.jsxs)("cx-menu",{children:[(0,Ut.jsx)("cx-menu-label",{children:"View"}),(0,Ut.jsxs)("cx-menu-item",{ref:k,class:S?"selected":"",children:["Grid (",null===S||void 0===S?void 0:S.label,")",(0,Ut.jsx)("cx-menu",{slot:"submenu",children:an.map((e=>(0,Ut.jsxs)("cx-menu-item",{value:e.value.toString(),class:e.value===f?"selected":"",children:[(0,Ut.jsx)(Kt,{lines:1,children:e.label}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:f===e.value?"check":""})]},e.value)))}),(0,Ut.jsx)("cx-icon",{slot:"prefix",name:"grid_view"})]}),(0,Ut.jsx)("cx-divider",{}),(0,Ut.jsxs)("cx-menu-item",{value:"see-thru",className:"menu-item--switch",children:[(0,Ut.jsx)(Kt,{lines:1,children:"See-thru"}),(0,Ut.jsx)("cx-switch",{checked:s,onClick:e=>e.preventDefault()})]})]},"default-menu")]}),(0,Ut.jsxs)("cx-dropdown",{ref:E,"auto-width-factor":a?1:.5,"stay-open-on-select":!0,children:[(0,Ut.jsx)("div",{slot:"trigger",children:(0,Ut.jsx)("cx-tooltip",{content:"Sort",children:(0,Ut.jsx)("cx-icon-button",{name:"sort",label:"Sort",outline:!0,"data-cy":"sort-button"})})}),(0,Ut.jsxs)("cx-menu",{children:[(h?on.map((e=>{var t,n;const r=null===(t=h[d])||void 0===t||null===(n=t.find((t=>t.sortDirection.toLowerCase()===e.value.toLowerCase())))||void 0===n?void 0:n.sortDirectionDisplayName;return{...e,label:null!==r&&void 0!==r?r:e.value}})):on).map((e=>(0,Ut.jsxs)("cx-menu-item",{"data-type":"sort-direction",disabled:!t,value:e.value,class:t&&u===e.value?"selected":"",children:[e.label.replace(/\b\w/g,(e=>e.toUpperCase())),o&&"sortDirection"===y.type&&y.value===e.value?(0,Ut.jsx)("cx-spinner",{slot:"prefix"}):(0,Ut.jsx)(e.icon,{})]},e.value))),(0,Ut.jsx)("cx-divider",{}),Object.keys(null!==h&&void 0!==h?h:{}).map((e=>(0,Ut.jsxs)("cx-menu-item",{"data-type":"sort-order",value:e,class:d===e?"selected":"",children:[e.replace(/\b\w/g,(e=>e.toUpperCase())),o&&"sortOrder"===y.type&&y.value===e?(0,Ut.jsx)("cx-spinner",{slot:"prefix"}):(0,Ut.jsx)("cx-icon",{slot:"prefix",name:d===e?"check":""})]},e)))]})]})]})]})};var dn=n(8743);const hn=(e,t)=>{const n=(e,t)=>0===t?e:n(t,e%t),r=Math.round(e),o=Math.round(t),i=n(r,o);return{width:r/i,height:o/i}},pn=(e,t,n)=>{const r=n*Math.PI/180;if(n%90===0)return{width:n%180===0?e:t,height:n%180===0?t:e};const o=Math.abs(Math.cos(r)),i=Math.abs(Math.sin(r)),a=e*o+t*i,s=e*i+t*o;return{width:Math.round(a),height:Math.round(s)}};var fn=function(e,t){return fn=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},fn(e,t)};function gn(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}fn(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var mn=function(){return mn=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},mn.apply(this,arguments)};Object.create;Object.create;"function"===typeof SuppressedError&&SuppressedError;var vn=n(1185),bn=n.n(vn);function yn(e,t,n,r,o){void 0===o&&(o=0);var i=Sn(t.width,t.height,o),a=i.width,s=i.height;return{x:An(e.x,a,n.width,r),y:An(e.y,s,n.height,r)}}function An(e,t,n,r){var o=t*r/2-n/2;return In(e,-o,o)}function xn(e,t){return Math.sqrt(Math.pow(e.y-t.y,2)+Math.pow(e.x-t.x,2))}function wn(e,t){return 180*Math.atan2(t.y-e.y,t.x-e.x)/Math.PI}function Cn(e,t){return Math.min(e,Math.max(0,t))}function En(e,t){return t}function kn(e,t){return{x:(t.x+e.x)/2,y:(t.y+e.y)/2}}function Sn(e,t,n){var r=n*Math.PI/180;return{width:Math.abs(Math.cos(r)*e)+Math.abs(Math.sin(r)*t),height:Math.abs(Math.sin(r)*e)+Math.abs(Math.cos(r)*t)}}function In(e,t,n){return Math.min(Math.max(e,t),n)}function _n(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter((function(e){return"string"===typeof e&&e.length>0})).join(" ").trim()}var Bn=function(e){function t(){var n=null!==e&&e.apply(this,arguments)||this;return n.cropperRef=xt.createRef(),n.imageRef=xt.createRef(),n.videoRef=xt.createRef(),n.containerPosition={x:0,y:0},n.containerRef=null,n.styleRef=null,n.containerRect=null,n.mediaSize={width:0,height:0,naturalWidth:0,naturalHeight:0},n.dragStartPosition={x:0,y:0},n.dragStartCrop={x:0,y:0},n.gestureZoomStart=0,n.gestureRotationStart=0,n.isTouching=!1,n.lastPinchDistance=0,n.lastPinchRotation=0,n.rafDragTimeout=null,n.rafPinchTimeout=null,n.wheelTimer=null,n.currentDoc="undefined"!==typeof document?document:null,n.currentWindow="undefined"!==typeof window?window:null,n.resizeObserver=null,n.state={cropSize:null,hasWheelJustStarted:!1,mediaObjectFit:void 0},n.initResizeObserver=function(){if("undefined"!==typeof window.ResizeObserver&&n.containerRef){var e=!0;n.resizeObserver=new window.ResizeObserver((function(t){e?e=!1:n.computeSizes()})),n.resizeObserver.observe(n.containerRef)}},n.preventZoomSafari=function(e){return e.preventDefault()},n.cleanEvents=function(){n.currentDoc&&(n.currentDoc.removeEventListener("mousemove",n.onMouseMove),n.currentDoc.removeEventListener("mouseup",n.onDragStopped),n.currentDoc.removeEventListener("touchmove",n.onTouchMove),n.currentDoc.removeEventListener("touchend",n.onDragStopped),n.currentDoc.removeEventListener("gesturemove",n.onGestureMove),n.currentDoc.removeEventListener("gestureend",n.onGestureEnd),n.currentDoc.removeEventListener("scroll",n.onScroll))},n.clearScrollEvent=function(){n.containerRef&&n.containerRef.removeEventListener("wheel",n.onWheel),n.wheelTimer&&clearTimeout(n.wheelTimer)},n.onMediaLoad=function(){var e=n.computeSizes();e&&(n.emitCropData(),n.setInitialCrop(e)),n.props.onMediaLoaded&&n.props.onMediaLoaded(n.mediaSize)},n.setInitialCrop=function(e){if(n.props.initialCroppedAreaPercentages){var t=function(e,t,n,r,o,i){var a=Sn(t.width,t.height,n),s=In(r.width/a.width*(100/e.width),o,i);return{crop:{x:s*a.width/2-r.width/2-a.width*s*(e.x/100),y:s*a.height/2-r.height/2-a.height*s*(e.y/100)},zoom:s}}(n.props.initialCroppedAreaPercentages,n.mediaSize,n.props.rotation,e,n.props.minZoom,n.props.maxZoom),r=t.crop,o=t.zoom;n.props.onCropChange(r),n.props.onZoomChange&&n.props.onZoomChange(o)}else if(n.props.initialCroppedAreaPixels){var i=function(e,t,n,r,o,i){void 0===n&&(n=0);var a=Sn(t.naturalWidth,t.naturalHeight,n),s=In(function(e,t,n){var r=function(e){return e.width>e.height?e.width/e.naturalWidth:e.height/e.naturalHeight}(t);return n.height>n.width?n.height/(e.height*r):n.width/(e.width*r)}(e,t,r),o,i),l=r.height>r.width?r.height/e.height:r.width/e.width;return{crop:{x:((a.width-e.width)/2-e.x)*l,y:((a.height-e.height)/2-e.y)*l},zoom:s}}(n.props.initialCroppedAreaPixels,n.mediaSize,n.props.rotation,e,n.props.minZoom,n.props.maxZoom);r=i.crop,o=i.zoom;n.props.onCropChange(r),n.props.onZoomChange&&n.props.onZoomChange(o)}},n.computeSizes=function(){var e,t,r,o,i,a,s=n.imageRef.current||n.videoRef.current;if(s&&n.containerRef){n.containerRect=n.containerRef.getBoundingClientRect(),n.saveContainerPosition();var l=n.containerRect.width/n.containerRect.height,c=(null===(e=n.imageRef.current)||void 0===e?void 0:e.naturalWidth)||(null===(t=n.videoRef.current)||void 0===t?void 0:t.videoWidth)||0,u=(null===(r=n.imageRef.current)||void 0===r?void 0:r.naturalHeight)||(null===(o=n.videoRef.current)||void 0===o?void 0:o.videoHeight)||0,d=c/u,h=void 0;if(s.offsetWidth<c||s.offsetHeight<u)switch(n.state.mediaObjectFit){default:case"contain":h=l>d?{width:n.containerRect.height*d,height:n.containerRect.height}:{width:n.containerRect.width,height:n.containerRect.width/d};break;case"horizontal-cover":h={width:n.containerRect.width,height:n.containerRect.width/d};break;case"vertical-cover":h={width:n.containerRect.height*d,height:n.containerRect.height}}else h={width:s.offsetWidth,height:s.offsetHeight};n.mediaSize=mn(mn({},h),{naturalWidth:c,naturalHeight:u}),n.props.setMediaSize&&n.props.setMediaSize(n.mediaSize);var p=n.props.cropSize?n.props.cropSize:function(e,t,n,r,o,i){void 0===i&&(i=0);var a=Sn(e,t,i),s=a.width,l=a.height,c=Math.min(s,n),u=Math.min(l,r);return c>u*o?{width:u*o,height:u}:{width:c,height:c/o}}(n.mediaSize.width,n.mediaSize.height,n.containerRect.width,n.containerRect.height,n.props.aspect,n.props.rotation);return(null===(i=n.state.cropSize)||void 0===i?void 0:i.height)===p.height&&(null===(a=n.state.cropSize)||void 0===a?void 0:a.width)===p.width||n.props.onCropSizeChange&&n.props.onCropSizeChange(p),n.setState({cropSize:p},n.recomputeCropPosition),n.props.setCropSize&&n.props.setCropSize(p),p}},n.saveContainerPosition=function(){if(n.containerRef){var e=n.containerRef.getBoundingClientRect();n.containerPosition={x:e.left,y:e.top}}},n.onMouseDown=function(e){n.currentDoc&&(e.preventDefault(),n.currentDoc.addEventListener("mousemove",n.onMouseMove),n.currentDoc.addEventListener("mouseup",n.onDragStopped),n.saveContainerPosition(),n.onDragStart(t.getMousePoint(e)))},n.onMouseMove=function(e){return n.onDrag(t.getMousePoint(e))},n.onScroll=function(e){n.currentDoc&&(e.preventDefault(),n.saveContainerPosition())},n.onTouchStart=function(e){n.currentDoc&&(n.isTouching=!0,n.props.onTouchRequest&&!n.props.onTouchRequest(e)||(n.currentDoc.addEventListener("touchmove",n.onTouchMove,{passive:!1}),n.currentDoc.addEventListener("touchend",n.onDragStopped),n.saveContainerPosition(),2===e.touches.length?n.onPinchStart(e):1===e.touches.length&&n.onDragStart(t.getTouchPoint(e.touches[0]))))},n.onTouchMove=function(e){e.preventDefault(),2===e.touches.length?n.onPinchMove(e):1===e.touches.length&&n.onDrag(t.getTouchPoint(e.touches[0]))},n.onGestureStart=function(e){n.currentDoc&&(e.preventDefault(),n.currentDoc.addEventListener("gesturechange",n.onGestureMove),n.currentDoc.addEventListener("gestureend",n.onGestureEnd),n.gestureZoomStart=n.props.zoom,n.gestureRotationStart=n.props.rotation)},n.onGestureMove=function(e){if(e.preventDefault(),!n.isTouching){var r=t.getMousePoint(e),o=n.gestureZoomStart-1+e.scale;if(n.setNewZoom(o,r,{shouldUpdatePosition:!0}),n.props.onRotationChange){var i=n.gestureRotationStart+e.rotation;n.props.onRotationChange(i)}}},n.onGestureEnd=function(e){n.cleanEvents()},n.onDragStart=function(e){var t,r,o=e.x,i=e.y;n.dragStartPosition={x:o,y:i},n.dragStartCrop=mn({},n.props.crop),null===(r=(t=n.props).onInteractionStart)||void 0===r||r.call(t)},n.onDrag=function(e){var t=e.x,r=e.y;n.currentWindow&&(n.rafDragTimeout&&n.currentWindow.cancelAnimationFrame(n.rafDragTimeout),n.rafDragTimeout=n.currentWindow.requestAnimationFrame((function(){if(n.state.cropSize&&void 0!==t&&void 0!==r){var e=t-n.dragStartPosition.x,o=r-n.dragStartPosition.y,i={x:n.dragStartCrop.x+e,y:n.dragStartCrop.y+o},a=n.props.restrictPosition?yn(i,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):i;n.props.onCropChange(a)}})))},n.onDragStopped=function(){var e,t;n.isTouching=!1,n.cleanEvents(),n.emitCropData(),null===(t=(e=n.props).onInteractionEnd)||void 0===t||t.call(e)},n.onWheel=function(e){if(n.currentWindow&&(!n.props.onWheelRequest||n.props.onWheelRequest(e))){e.preventDefault();var r=t.getMousePoint(e),o=bn()(e).pixelY,i=n.props.zoom-o*n.props.zoomSpeed/200;n.setNewZoom(i,r,{shouldUpdatePosition:!0}),n.state.hasWheelJustStarted||n.setState({hasWheelJustStarted:!0},(function(){var e,t;return null===(t=(e=n.props).onInteractionStart)||void 0===t?void 0:t.call(e)})),n.wheelTimer&&clearTimeout(n.wheelTimer),n.wheelTimer=n.currentWindow.setTimeout((function(){return n.setState({hasWheelJustStarted:!1},(function(){var e,t;return null===(t=(e=n.props).onInteractionEnd)||void 0===t?void 0:t.call(e)}))}),250)}},n.getPointOnContainer=function(e,t){var r=e.x,o=e.y;if(!n.containerRect)throw new Error("The Cropper is not mounted");return{x:n.containerRect.width/2-(r-t.x),y:n.containerRect.height/2-(o-t.y)}},n.getPointOnMedia=function(e){var t=e.x,r=e.y,o=n.props,i=o.crop,a=o.zoom;return{x:(t+i.x)/a,y:(r+i.y)/a}},n.setNewZoom=function(e,t,r){var o=(void 0===r?{}:r).shouldUpdatePosition,i=void 0===o||o;if(n.state.cropSize&&n.props.onZoomChange){var a=In(e,n.props.minZoom,n.props.maxZoom);if(i){var s=n.getPointOnContainer(t,n.containerPosition),l=n.getPointOnMedia(s),c={x:l.x*a-s.x,y:l.y*a-s.y},u=n.props.restrictPosition?yn(c,n.mediaSize,n.state.cropSize,a,n.props.rotation):c;n.props.onCropChange(u)}n.props.onZoomChange(a)}},n.getCropData=function(){return n.state.cropSize?function(e,t,n,r,o,i,a){void 0===i&&(i=0),void 0===a&&(a=!0);var s=a?Cn:En,l=Sn(t.width,t.height,i),c=Sn(t.naturalWidth,t.naturalHeight,i),u={x:s(100,((l.width-n.width/o)/2-e.x/o)/l.width*100),y:s(100,((l.height-n.height/o)/2-e.y/o)/l.height*100),width:s(100,n.width/l.width*100/o),height:s(100,n.height/l.height*100/o)},d=Math.round(s(c.width,u.width*c.width/100)),h=Math.round(s(c.height,u.height*c.height/100)),p=c.width>=c.height*r?{width:Math.round(h*r),height:h}:{width:d,height:Math.round(d/r)};return{croppedAreaPercentages:u,croppedAreaPixels:mn(mn({},p),{x:Math.round(s(c.width-p.width,u.x*c.width/100)),y:Math.round(s(c.height-p.height,u.y*c.height/100))})}}(n.props.restrictPosition?yn(n.props.crop,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):n.props.crop,n.mediaSize,n.state.cropSize,n.getAspect(),n.props.zoom,n.props.rotation,n.props.restrictPosition):null},n.emitCropData=function(){var e=n.getCropData();if(e){var t=e.croppedAreaPercentages,r=e.croppedAreaPixels;n.props.onCropComplete&&n.props.onCropComplete(t,r),n.props.onCropAreaChange&&n.props.onCropAreaChange(t,r)}},n.emitCropAreaChange=function(){var e=n.getCropData();if(e){var t=e.croppedAreaPercentages,r=e.croppedAreaPixels;n.props.onCropAreaChange&&n.props.onCropAreaChange(t,r)}},n.recomputeCropPosition=function(){if(n.state.cropSize){var e=n.props.restrictPosition?yn(n.props.crop,n.mediaSize,n.state.cropSize,n.props.zoom,n.props.rotation):n.props.crop;n.props.onCropChange(e),n.emitCropData()}},n.onKeyDown=function(e){var t,r,o=n.props,i=o.crop,a=o.onCropChange,s=o.keyboardStep,l=o.zoom,c=o.rotation,u=s;if(n.state.cropSize){e.shiftKey&&(u*=.2);var d=mn({},i);switch(e.key){case"ArrowUp":d.y-=u,e.preventDefault();break;case"ArrowDown":d.y+=u,e.preventDefault();break;case"ArrowLeft":d.x-=u,e.preventDefault();break;case"ArrowRight":d.x+=u,e.preventDefault();break;default:return}n.props.restrictPosition&&(d=yn(d,n.mediaSize,n.state.cropSize,l,c)),e.repeat||null===(r=(t=n.props).onInteractionStart)||void 0===r||r.call(t),a(d)}},n.onKeyUp=function(e){var t,r;switch(e.key){case"ArrowUp":case"ArrowDown":case"ArrowLeft":case"ArrowRight":e.preventDefault();break;default:return}n.emitCropData(),null===(r=(t=n.props).onInteractionEnd)||void 0===r||r.call(t)},n}return gn(t,e),t.prototype.componentDidMount=function(){this.currentDoc&&this.currentWindow&&(this.containerRef&&(this.containerRef.ownerDocument&&(this.currentDoc=this.containerRef.ownerDocument),this.currentDoc.defaultView&&(this.currentWindow=this.currentDoc.defaultView),this.initResizeObserver(),"undefined"===typeof window.ResizeObserver&&this.currentWindow.addEventListener("resize",this.computeSizes),this.props.zoomWithScroll&&this.containerRef.addEventListener("wheel",this.onWheel,{passive:!1}),this.containerRef.addEventListener("gesturestart",this.onGestureStart)),this.currentDoc.addEventListener("scroll",this.onScroll),this.props.disableAutomaticStylesInjection||(this.styleRef=this.currentDoc.createElement("style"),this.styleRef.setAttribute("type","text/css"),this.props.nonce&&this.styleRef.setAttribute("nonce",this.props.nonce),this.styleRef.innerHTML=".reactEasyCrop_Container {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n overflow: hidden;\n user-select: none;\n touch-action: none;\n cursor: move;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.reactEasyCrop_Image,\n.reactEasyCrop_Video {\n will-change: transform; /* this improves performances and prevent painting issues on iOS Chrome */\n}\n\n.reactEasyCrop_Contain {\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n}\n.reactEasyCrop_Cover_Horizontal {\n width: 100%;\n height: auto;\n}\n.reactEasyCrop_Cover_Vertical {\n width: auto;\n height: 100%;\n}\n\n.reactEasyCrop_CropArea {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border: 1px solid rgba(255, 255, 255, 0.5);\n box-sizing: border-box;\n box-shadow: 0 0 0 9999em;\n color: rgba(0, 0, 0, 0.5);\n overflow: hidden;\n}\n\n.reactEasyCrop_CropAreaRound {\n border-radius: 50%;\n}\n\n.reactEasyCrop_CropAreaGrid::before {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 0;\n bottom: 0;\n left: 33.33%;\n right: 33.33%;\n border-top: 0;\n border-bottom: 0;\n}\n\n.reactEasyCrop_CropAreaGrid::after {\n content: ' ';\n box-sizing: border-box;\n position: absolute;\n border: 1px solid rgba(255, 255, 255, 0.5);\n top: 33.33%;\n bottom: 33.33%;\n left: 0;\n right: 0;\n border-left: 0;\n border-right: 0;\n}\n",this.currentDoc.head.appendChild(this.styleRef)),this.imageRef.current&&this.imageRef.current.complete&&this.onMediaLoad(),this.props.setImageRef&&this.props.setImageRef(this.imageRef),this.props.setVideoRef&&this.props.setVideoRef(this.videoRef),this.props.setCropperRef&&this.props.setCropperRef(this.cropperRef))},t.prototype.componentWillUnmount=function(){var e,t;this.currentDoc&&this.currentWindow&&("undefined"===typeof window.ResizeObserver&&this.currentWindow.removeEventListener("resize",this.computeSizes),null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.containerRef&&this.containerRef.removeEventListener("gesturestart",this.preventZoomSafari),this.styleRef&&(null===(t=this.styleRef.parentNode)||void 0===t||t.removeChild(this.styleRef)),this.cleanEvents(),this.props.zoomWithScroll&&this.clearScrollEvent())},t.prototype.componentDidUpdate=function(e){var t,n,r,o,i,a,s,l,c;e.rotation!==this.props.rotation?(this.computeSizes(),this.recomputeCropPosition()):e.aspect!==this.props.aspect||e.objectFit!==this.props.objectFit?this.computeSizes():e.zoom!==this.props.zoom?this.recomputeCropPosition():(null===(t=e.cropSize)||void 0===t?void 0:t.height)!==(null===(n=this.props.cropSize)||void 0===n?void 0:n.height)||(null===(r=e.cropSize)||void 0===r?void 0:r.width)!==(null===(o=this.props.cropSize)||void 0===o?void 0:o.width)?this.computeSizes():(null===(i=e.crop)||void 0===i?void 0:i.x)===(null===(a=this.props.crop)||void 0===a?void 0:a.x)&&(null===(s=e.crop)||void 0===s?void 0:s.y)===(null===(l=this.props.crop)||void 0===l?void 0:l.y)||this.emitCropAreaChange(),e.zoomWithScroll!==this.props.zoomWithScroll&&this.containerRef&&(this.props.zoomWithScroll?this.containerRef.addEventListener("wheel",this.onWheel,{passive:!1}):this.clearScrollEvent()),e.video!==this.props.video&&(null===(c=this.videoRef.current)||void 0===c||c.load());var u=this.getObjectFit();u!==this.state.mediaObjectFit&&this.setState({mediaObjectFit:u},this.computeSizes)},t.prototype.getAspect=function(){var e=this.props,t=e.cropSize,n=e.aspect;return t?t.width/t.height:n},t.prototype.getObjectFit=function(){var e,t,n,r;if("cover"===this.props.objectFit){if((this.imageRef.current||this.videoRef.current)&&this.containerRef){this.containerRect=this.containerRef.getBoundingClientRect();var o=this.containerRect.width/this.containerRect.height;return((null===(e=this.imageRef.current)||void 0===e?void 0:e.naturalWidth)||(null===(t=this.videoRef.current)||void 0===t?void 0:t.videoWidth)||0)/((null===(n=this.imageRef.current)||void 0===n?void 0:n.naturalHeight)||(null===(r=this.videoRef.current)||void 0===r?void 0:r.videoHeight)||0)<o?"horizontal-cover":"vertical-cover"}return"horizontal-cover"}return this.props.objectFit},t.prototype.onPinchStart=function(e){var n=t.getTouchPoint(e.touches[0]),r=t.getTouchPoint(e.touches[1]);this.lastPinchDistance=xn(n,r),this.lastPinchRotation=wn(n,r),this.onDragStart(kn(n,r))},t.prototype.onPinchMove=function(e){var n=this;if(this.currentDoc&&this.currentWindow){var r=t.getTouchPoint(e.touches[0]),o=t.getTouchPoint(e.touches[1]),i=kn(r,o);this.onDrag(i),this.rafPinchTimeout&&this.currentWindow.cancelAnimationFrame(this.rafPinchTimeout),this.rafPinchTimeout=this.currentWindow.requestAnimationFrame((function(){var e=xn(r,o),t=n.props.zoom*(e/n.lastPinchDistance);n.setNewZoom(t,i,{shouldUpdatePosition:!1}),n.lastPinchDistance=e;var a=wn(r,o),s=n.props.rotation+(a-n.lastPinchRotation);n.props.onRotationChange&&n.props.onRotationChange(s),n.lastPinchRotation=a}))}},t.prototype.render=function(){var e,t=this,n=this.props,r=n.image,o=n.video,i=n.mediaProps,a=n.cropperProps,s=n.transform,l=n.crop,c=l.x,u=l.y,d=n.rotation,h=n.zoom,p=n.cropShape,f=n.showGrid,g=n.style,m=g.containerStyle,v=g.cropAreaStyle,b=g.mediaStyle,y=n.classes,A=y.containerClassName,x=y.cropAreaClassName,w=y.mediaClassName,C=null!==(e=this.state.mediaObjectFit)&&void 0!==e?e:this.getObjectFit();return xt.createElement("div",{onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,ref:function(e){return t.containerRef=e},"data-testid":"container",style:m,className:_n("reactEasyCrop_Container",A)},r?xt.createElement("img",mn({alt:"",className:_n("reactEasyCrop_Image","contain"===C&&"reactEasyCrop_Contain","horizontal-cover"===C&&"reactEasyCrop_Cover_Horizontal","vertical-cover"===C&&"reactEasyCrop_Cover_Vertical",w)},i,{src:r,ref:this.imageRef,style:mn(mn({},b),{transform:s||"translate(".concat(c,"px, ").concat(u,"px) rotate(").concat(d,"deg) scale(").concat(h,")")}),onLoad:this.onMediaLoad})):o&&xt.createElement("video",mn({autoPlay:!0,playsInline:!0,loop:!0,muted:!0,className:_n("reactEasyCrop_Video","contain"===C&&"reactEasyCrop_Contain","horizontal-cover"===C&&"reactEasyCrop_Cover_Horizontal","vertical-cover"===C&&"reactEasyCrop_Cover_Vertical",w)},i,{ref:this.videoRef,onLoadedMetadata:this.onMediaLoad,style:mn(mn({},b),{transform:s||"translate(".concat(c,"px, ").concat(u,"px) rotate(").concat(d,"deg) scale(").concat(h,")")}),controls:!1}),(Array.isArray(o)?o:[{src:o}]).map((function(e){return xt.createElement("source",mn({key:e.src},e))}))),this.state.cropSize&&xt.createElement("div",mn({ref:this.cropperRef,style:mn(mn({},v),{width:this.state.cropSize.width,height:this.state.cropSize.height}),tabIndex:0,onKeyDown:this.onKeyDown,onKeyUp:this.onKeyUp,"data-testid":"cropper",className:_n("reactEasyCrop_CropArea","round"===p&&"reactEasyCrop_CropAreaRound",f&&"reactEasyCrop_CropAreaGrid",x)},a)))},t.defaultProps={zoom:1,rotation:0,aspect:4/3,maxZoom:3,minZoom:1,cropShape:"rect",objectFit:"contain",showGrid:!0,style:{},classes:{},mediaProps:{},cropperProps:{},zoomSpeed:1,restrictPosition:!0,zoomWithScroll:!0,keyboardStep:1},t.getMousePoint=function(e){return{x:Number(e.clientX),y:Number(e.clientY)}},t.getTouchPoint=function(e){return{x:Number(e.clientX),y:Number(e.clientY)}},t}(xt.Component);const Tn=(e,t,n,r)=>{const o=n/r;let i=e,a=t;return e/t>o?i=Math.round(a*o):a=Math.round(i/o),{width:i,height:a}},On=async e=>{let{cropper:t,image:n,loadable:r,onLoadingChange:o,zoom:i}=e;const{width:a,height:s,x:l,y:c,unit:u}=t,d={x:l,y:c,width:a,height:s};if(d.x=l/100*n.width,d.y=c/100*n.height,r){if(o(!0),u===dn.Nf.AspectRatio){const{width:e,height:t}=Tn(n.width,n.height,a,s);d.width=e/i,d.height=t/i}const e=await((e,t)=>{const n=new Image;return n.src=e.url,n.crossOrigin="anonymous",new Promise((r=>{n.onload=()=>{const o=document.createElement("canvas");o.width=t.width,o.height=t.height;const i=o.getContext("2d");i?(i.drawImage(n,-t.x,-t.y,e.width,e.height),r(o.toDataURL("image/jpeg"))):r(e.url)},n.onerror=()=>{r(e.url)}}))})({url:n.url,width:n.width,height:n.height},d);return o(!1),e}return n.url},Pn=async e=>{let{image:t,loadable:n,onLoadingChange:r,rotation:o}=e;if(n){r(!0);const e=await((e,t)=>{const n=new Image;return n.src=e.url,n.crossOrigin="anonymous",new Promise((r=>{n.onload=()=>{const{width:o,height:i}=pn(e.width,e.height,t),a=document.createElement("canvas");a.width=o,a.height=i;const s=a.getContext("2d");s?(s.fillStyle="white",s.fillRect(0,0,o,i),s.translate(o/2,i/2),s.rotate(t*Math.PI/180),s.drawImage(n,-e.width/2,-e.height/2,e.width,e.height),s.rotate(-t*Math.PI/180),s.translate(-o/2,-i/2),r(a.toDataURL("image/jpeg"))):r(e.url)},n.onerror=()=>{r(e.url)}}))})({url:t.url,width:t.width,height:t.height},o);return r(!1),e}return t.url},Qn=Lt.Ay.div`
|
|
287
287
|
position: relative;
|
|
288
288
|
width: 100%;
|
|
289
289
|
height: 350px;
|