"use strict";(globalThis.webpackChunkcoblocks=globalThis.webpackChunkcoblocks||[]).push([[69],{1069:(e,t,l)=>{l.r(t),l.d(t,{default:()=>R});var o=l(1609),n=l(2485),c=l.n(n),a=l(7723);const i=[{
/* translators: visual style option */
label:(0,a.__)("Dark","coblocks"),value:"dark"},{
/* translators: visual style option */
label:(0,a.__)("Light","coblocks"),value:"light"},{
/* translators: visual style option */
label:(0,a.__)("None","coblocks"),value:"none"}];var s=l(5556),r=l.n(s);const b=[{label:(0,a.__)("None","coblocks"),value:"none"},{label:(0,a.__)("Media file","coblocks"),value:"media"},{label:(0,a.__)("Attachment page","coblocks"),value:"attachment"},{label:(0,a.__)("Custom URL","coblocks"),value:"custom"}];var u=l(6087),m=l(6427);class p extends u.Component{constructor(){super(...arguments),this.setNewTab=this.setNewTab.bind(this),this.setLinkRel=this.setLinkRel.bind(this),this.setLinkTo=this.setLinkTo.bind(this)}componentDidUpdate(e){const{attributes:t,setAttributes:l}=this.props,{lightbox:o}=t;"none"!==e.attributes.linkTo&&o&&l({linkTo:"none"})}setLinkTo(e){const{setAttributes:t}=this.props;t({linkTo:e})}setLinkRel(e){const{setAttributes:t}=this.props;t({rel:e})}setNewTab(e){const{attributes:t,setAttributes:l}=this.props,{rel:o}=t,n=e?"_blank":void 0;let c=o;n&&!o?c="noreferrer noopener":n||"noreferrer noopener"!==o||(c=void 0),l({rel:c,target:n})}render(){const{attributes:e,setAttributes:t}=this.props,{lightbox:l,linkTo:n,target:c,rel:i}=e;return(0,o.createElement)(u.Fragment,null,!l&&(0,o.createElement)(m.PanelBody,{initialOpen:!1,title:(0,a.__)("Link settings","coblocks")},(0,o.createElement)(m.SelectControl,{label:(0,a.__)("Link to","coblocks"),onChange:this.setLinkTo,options:b,value:n}),"none"!==n&&(0,o.createElement)(u.Fragment,null,(0,o.createElement)(m.ToggleControl,{checked:"_blank"===c,label:(0,a.__)("Open in new tab","coblocks"),onChange:this.setNewTab}),(0,o.createElement)(m.TextControl
/* translators: html attribute that specifies the relationship between two pages */,{label:(0,a.__)("Link rel","coblocks"),onChange:e=>t({rel:e}),value:i}))))}}p.propTypes={attributes:r().object,setAttributes:r().func};const _=p;var g=l(4527);const k=[{
/* translators: abbreviation for small size */
label:(0,a.__)("S","coblocks"),tooltip:(0,a.__)("Small","coblocks"),value:"small"},{
/* translators: abbreviation for medium size */
label:(0,a.__)("M","coblocks"),tooltip:(0,a.__)("Medium","coblocks"),value:"medium"},{
/* translators: abbreviation for large size */
label:(0,a.__)("L","coblocks"),tooltip:(0,a.__)("Large","coblocks"),value:"large"}],d=e=>{const{attributes:t,setAttributes:l}=e,{align:n,gutter:c,gutterCustom:i}=t,s="full"===n?10:5;return(0,u.useEffect)((()=>{i>s&&l({gutterCustom:s})}),[i,s]),(0,o.createElement)(o.Fragment,null,(0,o.createElement)(g.A,{currentOption:c,label:(0,a.__)("Gutter","coblocks"),onChange:e=>l({gutter:e}),options:k,showCustomOption:!0}),"custom"===c&&(0,o.createElement)(m.RangeControl,{initialValue:0,max:s,min:0,onChange:e=>l({gutterCustom:e.toString()}),step:.1,value:parseFloat(i)||0,withInputField:!0}))},h=d;d.propTypes={attributes:r().object,setAttributes:r().func};var E=l(4715);const v=e=>{const{attributes:t,setAttributes:l,enableGutter:n,enableCaptions:c}=e,{shadow:s,captions:r,captionStyle:b,lightbox:u}=t,p=[{value:"sm",
/* translators: abbreviation for small size */
label:(0,a.__)("S","coblocks"),tooltip:(0,a.__)("Small","coblocks")},{value:"md",
/* translators: abbreviation for medium size */
label:(0,a.__)("M","coblocks"),tooltip:(0,a.__)("Medium","coblocks")},{value:"lg",
/* translators: abbreviation for large size */
label:(0,a.__)("L","coblocks"),tooltip:(0,a.__)("Large","coblocks")}];return(0,o.createElement)(E.InspectorControls,null,(0,o.createElement)(m.PanelBody,{title:(0,a.__)("Collage settings","coblocks")},n&&(0,o.createElement)(h,{...e}),!n&&(0,o.createElement)(g.A,{currentOption:s,label:(0,a.__)("Shadow","coblocks"),onChange:e=>{l({shadow:e})},options:p,showNoneOption:!0}),(0,o.createElement)(m.ToggleControl,{checked:!!u,help:e=>e?(0,a.__)("Image lightbox is enabled.","coblocks"):(0,a.__)("Toggle to enable the image lightbox.","coblocks"),label:(0,a.__)("Lightbox","coblocks"),onChange:()=>l({lightbox:!u})}),c&&(0,o.createElement)(m.ToggleControl,{checked:!!r,help:e=>e?(0,a.__)("Showing captions for each media item.","coblocks"):(0,a.__)("Toggle to show media captions.","coblocks"),label:(0,a.__)("Captions","coblocks"),onChange:()=>l({captions:!r})}),r&&(0,o.createElement)(m.SelectControl,{label:(0,a.__)("Caption style","coblocks"),onChange:e=>{l({captionStyle:e})},options:i,value:b})),(0,o.createElement)(_,{...e}))};var f=l(8468),C=l.n(f),w=l(9668),y=l(7143);const T=({hoveredFilter:e})=>{if(!e)return null;const t=C().cloneDeep((0,y.select)("core/block-editor").getSelectedBlock());return t.attributes.filter=e,(0,o.createElement)("div",{className:"block-editor-block-switcher__popover__preview__parent"},(0,o.createElement)("div",{className:"block-editor-block-switcher__popover__preview__container"},(0,o.createElement)(m.Popover,{className:"block-editor-block-switcher__preview__popover coblocks-image-filter-popover",focusOnMount:!1,position:"bottom right"},(0,o.createElement)("div",{className:"block-editor-block-switcher__preview coblocks__preview"},(0,o.createElement)("div",{className:"block-editor-block-switcher__preview-title"},(0,a.__)("Preview filter","coblocks")),(0,o.createElement)(E.BlockPreview,{autoHeight:!0,blocks:{...t}})))))},N=e=>{const[t,l]=(0,u.useState)(null),n=e=>{l(e)},{attributes:i,setAttributes:s}=e,{filter:r}=i,b=[{icon:(0,o.createElement)(m.Icon,{icon:w.cN3}),isActive:"none"===r,onClick:()=>{s({filter:"none"})},slug:"none",
/* translators: image style */
title:(0,a.__)("Original","coblocks")},{icon:(0,o.createElement)(m.Icon,{icon:w.vIu}),isActive:"grayscale"===r,onClick:()=>{s({filter:"grayscale"})},slug:"grayscale",
/* translators: image style */
title:(0,a.__)("Grayscale filter","coblocks")},{icon:(0,o.createElement)(m.Icon,{icon:w.mZe}),isActive:"sepia"===r,onClick:()=>{s({filter:"sepia"})},slug:"sepia",
/* translators: image style */
title:(0,a.__)("Sepia filter","coblocks")},{icon:(0,o.createElement)(m.Icon,{icon:w.UKw}),isActive:"saturation"===r,onClick:()=>{s({filter:"saturation"})},slug:"saturation",
/* translators: image style */
title:(0,a.__)("Saturation filter","coblocks")},{icon:(0,o.createElement)(m.Icon,{icon:w.GVY}),isActive:"dim"===r,onClick:()=>{s({filter:"dim"})},slug:"dim",
/* translators: image style */
title:(0,a.__)("Dim filter","coblocks")},{icon:(0,o.createElement)(m.Icon,{icon:w.u5Q}),isActive:"vintage"===r,onClick:()=>{s({filter:"vintage"})},slug:"vintage",
/* translators: image style */
title:(0,a.__)("Vintage filter","coblocks")}];return(0,o.createElement)(m.ToolbarGroup,null,(0,o.createElement)(m.DropdownMenu,{className:c()("components-coblocks-media-filter","none"!==r?"has-filter":""),icon:(0,o.createElement)(m.Icon,{icon:w.x7G}),label:(0,a.__)("Apply filter","coblocks"),noIcons:!0,popoverProps:{className:"components-coblocks-dropdown"}},(()=>(0,o.createElement)(m.MenuGroup,null,(0,o.createElement)(T,{hoveredFilter:t}),b.map((e=>(0,o.createElement)(m.MenuItem,{icon:e.icon,isSelected:r===e.slug,key:`coblocks-image-filter-${e.slug}`,label:e.title,onClick:e.onClick,onMouseEnter:()=>n(e.slug),onMouseLeave:()=>n(null),role:"menuitemradio"},e.title)))))))},S=N;N.propTypes={attributes:r().object,setAttributes:r().func};const A=e=>{const{attributes:t}=e,{images:l}=t,n=!!l.filter((e=>void 0!==e.id)).length;return(0,o.createElement)(E.BlockControls,null,n&&(0,o.createElement)(S,{...e}))};var I=l(6168),L=l(632),x=l(1275);const M=e=>{const{noticeOperations:t,onSelect:l,label:n}=e;return(0,o.createElement)(m.DropZone,{label:n,onFilesDrop:e=>{(0,x.mediaUpload)({allowedTypes:I.j0,filesList:e,onError:t.createErrorNotice,onFileChange:e=>l(e)})}})};M.propTypes={label:r().string,noticeOperations:r().object,onSelect:r().func};const D=M;var F=l(9491),O=l(3162),B=l(8053);const R=(0,F.compose)([m.withNotices])((e=>{const{attributes:t,className:l,isSelected:n,noticeUI:i,setAttributes:s}=e,[r,b]=(0,u.useState)(null),[p,_]=(0,u.useState)(null),[g,k]=(0,u.useState)(!1),d=(0,F.usePrevious)(l),h=(0,F.usePrevious)(n);(0,u.useEffect)((()=>{l!==d&&(l.includes("is-style-layered")?(_(t.gutter),s({gutter:"small"})):(_(null),s({shadow:"none",gutter:p||t.gutter})))}),[l,d]),(0,u.useEffect)((()=>{n!==h&&!1===n&&b(null)}),[n,h]);const f=e=>t.images.find((t=>parseInt(t.index)===parseInt(e))),C=t=>{const{noticeOperations:l}=e;l.removeAllNotices(),l.createErrorNotice(t)},w=(e,l)=>{const o=[...t.images.filter((e=>parseInt(e.index)!==parseInt(l))),{...I.Od(e),index:l}];s({images:o})},y=(e,l)=>{const o=f(e),n=[...t.images.filter((t=>parseInt(t.index)!==parseInt(e))),Object.assign({},o,l)];s({images:n})},T=()=>{k(!0)},N=e=>{const i=f(e),u=n&&r===i.index,p=!l.includes("is-style-layered"),_=(0,o.createElement)(m.DropZone,{label:(0,a.__)("Drop image to replace","coblocks"),onFilesDrop:t=>((e,t)=>{(0,x.mediaUpload)({allowedTypes:["image"],filesList:e,onFileChange:([e])=>w(e,t),onError:C})})(t,e)});return(0,o.createElement)(o.Fragment,null,(0,o.createElement)("a",{onClick:()=>(e=>{r!==e&&b(e)})(i.index),role:"button",tabIndex:"0"},(0,o.createElement)("figure",{className:c()({"wp-block-coblocks-gallery-collage__figure":!0,"is-transient":(0,O.isBlobURL)(i.url),"is-selected":u,[`shadow-${t.shadow}`]:t.shadow})},u&&(0,o.createElement)(o.Fragment,null,(0,o.createElement)(m.ButtonGroup,{className:"block-library-gallery-item__inline-menu is-right is-visible"},(0,o.createElement)(E.MediaUploadCheck,null,(0,o.createElement)(E.MediaUpload,{allowedTypes:["image"],onSelect:t=>w(t,e),render:({open:e})=>(0,o.createElement)(m.Button,{className:"coblocks-gallery-item__button-replace",label:(0,a.__)("Replace Image","coblocks"),onClick:e},(0,a.__)("Replace","coblocks")),value:i.url})),(0,o.createElement)(m.Button,{disabled:!u,icon:B.A,label:(0,a.__)("Remove image","coblocks"),onClick:()=>(e=>{const l=[...t.images.filter((t=>parseInt(t.index)!==parseInt(e)))];s({images:l})})(e)}))),r===i.index&&"custom"===t.linkTo&&(0,o.createElement)("form",{className:"components-coblocks-gallery-item__image-link",onSubmit:e=>e.preventDefault()},(0,o.createElement)(m.Dashicon,{icon:"admin-links"}),(0,o.createElement)(E.URLInput,{onChange:t=>y(e,{imgLink:t}),value:i.imgLink}),(0,o.createElement)(m.Button,{icon:g?"saved":"editor-break",label:g?(0,a.__)("Saving","coblocks"):(0,a.__)("Apply","coblocks"),onClick:T,type:"submit"})),_,(0,O.isBlobURL)(i.url)&&(0,o.createElement)(m.Spinner,null),(0,o.createElement)("img",{alt:i.alt,src:i.url}),p&&t.captions&&(i.caption||u)&&(0,o.createElement)(E.RichText,{className:"coblocks-gallery--caption",inlineToolbar:!0,isSelected:u,onChange:t=>y(e,{caption:t}),placeholder:(0,a.__)("Write caption…","coblocks"),tagName:"figcaption",value:i.caption}))))},S=l=>{const n=!!f(l),a=c()("wp-block-coblocks-gallery-collage__figure",{[`shadow-${t.shadow}`]:t.shadow});return(0,o.createElement)(E.MediaPlaceholder,{accept:"image/*",addToGallery:!0,allowedTypes:["image"],className:a,disableDropZone:!0,disableMediaButtons:n,icon:!1,labels:{title:" ",instructions:" "},multiple:!1,onError:C,onSelect:e=>w(e,l)},(0,o.createElement)(D,{...e,label:"Drop file to upload",onSelect:([e])=>w(e,l)}))},{animation:M,captions:R,captionStyle:U,filter:G,lightbox:P}=t,$=!l.includes("is-style-layered"),j=!l.includes("is-style-layered"),Z=[];for(let e=0;e<(["is-style-tiled","is-style-layered"].includes(t.className)?4:5);e++){const t=f(e);Z.push((0,o.createElement)("li",{className:c()("wp-block-coblocks-gallery-collage__item",`item-${e+1}`,{[`coblocks-animate ${M}`]:M,"is-selected":e===parseInt(r)}),key:`image-${e}`},t?N(e):S(e)))}return(0,o.createElement)(o.Fragment,null,(0,o.createElement)(A,{...e}),(0,o.createElement)(v,{...e,enableCaptions:j,enableGutter:$}),i,(0,o.createElement)(L.A,{...t},(0,o.createElement)("div",{className:c()(l,{[`has-filter-${G}`]:"none"!==G,[`has-caption-style-${U}`]:R&&void 0!==U,"has-lightbox":P})},(0,o.createElement)("ul",null,Z))))}))}}]);