"use strict";(self.webpackChunkcoblocks=self.webpackChunkcoblocks||[]).push([[260],{9260:(e,t,l)=>{l.r(t),l.d(t,{default:()=>$});var o=l(7462),n=l(9307),a=l(4184),c=l.n(a),s=l(5736);const i=[{
/* translators: visual style option */
label:(0,s.__)("Dark","coblocks"),value:"dark"},{
/* translators: visual style option */
label:(0,s.__)("Light","coblocks"),value:"light"},{
/* translators: visual style option */
label:(0,s.__)("None","coblocks"),value:"none"}];var r=l(5697),b=l.n(r);const u=[{label:(0,s.__)("None","coblocks"),value:"none"},{label:(0,s.__)("Media file","coblocks"),value:"media"},{label:(0,s.__)("Attachment page","coblocks"),value:"attachment"},{label:(0,s.__)("Custom URL","coblocks"),value:"custom"}];var m=l(5609);class p extends n.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 a=o;n&&!o?a="noreferrer noopener":n||"noreferrer noopener"!==o||(a=void 0),l({rel:a,target:n})}render(){const{attributes:e,setAttributes:t}=this.props,{lightbox:l,linkTo:o,target:a,rel:c}=e;return(0,n.createElement)(n.Fragment,null,!l&&(0,n.createElement)(m.PanelBody,{initialOpen:!1,title:(0,s.__)("Link settings","coblocks")},(0,n.createElement)(m.SelectControl,{label:(0,s.__)("Link to","coblocks"),onChange:this.setLinkTo,options:u,value:o}),"none"!==o&&(0,n.createElement)(n.Fragment,null,(0,n.createElement)(m.ToggleControl,{checked:"_blank"===a,label:(0,s.__)("Open in new tab","coblocks"),onChange:this.setNewTab}),(0,n.createElement)(m.TextControl
/* translators: html attribute that specifies the relationship between two pages */,{label:(0,s.__)("Link rel","coblocks"),onChange:e=>t({rel:e}),value:c}))))}}p.propTypes={attributes:b().object,setAttributes:b().func};const _=p;var k=l(7635),g=l(2819),d=l.n(g);const h=[{
/* translators: abbreviation for small size */
label:(0,s.__)("S","coblocks"),tooltip:(0,s.__)("Small","coblocks"),value:1},{
/* translators: abbreviation for medium size */
label:(0,s.__)("M","coblocks"),tooltip:(0,s.__)("Medium","coblocks"),value:2},{
/* translators: abbreviation for large size */
label:(0,s.__)("L","coblocks"),tooltip:(0,s.__)("Large","coblocks"),value:3},{
/* translators: abbreviation for extra large size */
label:(0,s.__)("XL","coblocks"),tooltip:(0,s.__)("Extra Large","coblocks"),value:4}],v={label:(0,s.__)("None","coblocks"),tooltip:(0,s.__)("None","coblocks"),value:0},E={label:(0,n.createElement)(m.Icon,{icon:k.ewm}),tooltip:(0,s.__)("Custom","coblocks"),value:"custom"};class C extends n.Component{render(){const{advancedMaxValue:e,advancedMinValue:t,currentOption:l,label:o,onChange:a,options:s,showAdvancedControls:i,showIcons:r,showNoneOption:b,showCustomOption:u}=this.props;let p=s||h;return b&&(p=[v,...p]),u&&(p=[...p,E]),i&&!1!==t&&!1!==e?(0,n.createElement)(m.RangeControl,{label:o,max:e,min:t,onChange:e=>a(e),value:l}):(0,n.createElement)(m.BaseControl,{className:c()("coblocks-option-selector-control",{"is-custom":"custom"===l}),id:`coblocks-option-selector-${(0,g.kebabCase)(o)}`,label:o},(0,n.createElement)(m.PanelRow,null,(0,n.createElement)(m.ButtonGroup,{"aria-label":o},p.map((e=>(0,n.createElement)(m.Tooltip,{key:`option-${e.value}`,text:e.tooltip},(0,n.createElement)(m.Button,{"aria-label":e.tooltip,"aria-pressed":l===e.value,isPrimary:l===e.value,isSecondary:l!==e.value,onClick:()=>a(e.value)},r?e.icon:e.label)))))))}}C.propTypes={advancedMaxValue:b().number,advancedMinValue:b().number,currentOption:b().oneOfType([b().string,b().number]),label:b().string,onChange:b().func,options:b().array,showAdvancedControls:b().bool,showCustomOption:b().bool,showIcons:b().bool,showNoneOption:b().bool};const w=[{
/* translators: abbreviation for small size */
label:(0,s.__)("S","coblocks"),tooltip:(0,s.__)("Small","coblocks"),value:"small"},{
/* translators: abbreviation for medium size */
label:(0,s.__)("M","coblocks"),tooltip:(0,s.__)("Medium","coblocks"),value:"medium"},{
/* translators: abbreviation for large size */
label:(0,s.__)("L","coblocks"),tooltip:(0,s.__)("Large","coblocks"),value:"large"}],f=e=>{const{attributes:t,setAttributes:l}=e,{align:o,gutter:a,gutterCustom:c}=t,i="full"===o?10:5;return(0,n.useEffect)((()=>{c>i&&l({gutterCustom:i})}),[c,i]),(0,n.createElement)(n.Fragment,null,(0,n.createElement)(C,{currentOption:a,label:(0,s.__)("Gutter","coblocks"),onChange:e=>l({gutter:e}),options:w,showCustomOption:!0}),"custom"===a&&(0,n.createElement)(m.RangeControl,{initialValue:0,max:i,min:0,onChange:e=>l({gutterCustom:e.toString()}),step:.1,value:parseFloat(c)||0,withInputField:!0}))},y=f;f.propTypes={attributes:b().object,setAttributes:b().func};var N=l(2175);const S=e=>{const{attributes:t,setAttributes:l,enableGutter:o,enableCaptions:a}=e,{shadow:c,captions:r,captionStyle:b,lightbox:u}=t,p=[{value:"sm",
/* translators: abbreviation for small size */
label:(0,s.__)("S","coblocks"),tooltip:(0,s.__)("Small","coblocks")},{value:"md",
/* translators: abbreviation for medium size */
label:(0,s.__)("M","coblocks"),tooltip:(0,s.__)("Medium","coblocks")},{value:"lg",
/* translators: abbreviation for large size */
label:(0,s.__)("L","coblocks"),tooltip:(0,s.__)("Large","coblocks")}];return(0,n.createElement)(N.InspectorControls,null,(0,n.createElement)(m.PanelBody,{title:(0,s.__)("Collage settings","coblocks")},o&&(0,n.createElement)(y,e),!o&&(0,n.createElement)(C,{currentOption:c,label:(0,s.__)("Shadow","coblocks"),onChange:e=>{l({shadow:e})},options:p,showNoneOption:!0}),(0,n.createElement)(m.ToggleControl,{checked:!!u,help:e=>e?(0,s.__)("Image lightbox is enabled.","coblocks"):(0,s.__)("Toggle to enable the image lightbox.","coblocks"),label:(0,s.__)("Lightbox","coblocks"),onChange:()=>l({lightbox:!u})}),a&&(0,n.createElement)(m.ToggleControl,{checked:!!r,help:e=>e?(0,s.__)("Showing captions for each media item.","coblocks"):(0,s.__)("Toggle to show media captions.","coblocks"),label:(0,s.__)("Captions","coblocks"),onChange:()=>l({captions:!r})}),r&&(0,n.createElement)(m.SelectControl,{label:(0,s.__)("Caption style","coblocks"),onChange:e=>{l({captionStyle:e})},options:i,value:b})),(0,n.createElement)(_,e))};var T=l(9818);const L=e=>{let{hoveredFilter:t}=e;if(!t)return null;const l=d().cloneDeep((0,T.select)("core/block-editor").getSelectedBlock());return l.attributes.filter=t,(0,n.createElement)("div",{className:"block-editor-block-switcher__popover__preview__parent"},(0,n.createElement)("div",{className:"block-editor-block-switcher__popover__preview__container"},(0,n.createElement)(m.Popover,{className:"block-editor-block-switcher__preview__popover coblocks-image-filter-popover",focusOnMount:!1,position:"bottom right"},(0,n.createElement)("div",{className:"block-editor-block-switcher__preview coblocks__preview"},(0,n.createElement)("div",{className:"block-editor-block-switcher__preview-title"},(0,s.__)("Preview filter","coblocks")),(0,n.createElement)(N.BlockPreview,{autoHeight:!0,blocks:{...l}})))))},x=e=>{const[t,l]=(0,n.useState)(null),o=e=>{l(e)},{attributes:a,setAttributes:i}=e,{filter:r}=a,b=[{icon:(0,n.createElement)(m.Icon,{icon:k.mJk}),isActive:"none"===r,onClick:()=>{i({filter:"none"})},slug:"none",
/* translators: image style */
title:(0,s.__)("Original","coblocks")},{icon:(0,n.createElement)(m.Icon,{icon:k.NC1}),isActive:"grayscale"===r,onClick:()=>{i({filter:"grayscale"})},slug:"grayscale",
/* translators: image style */
title:(0,s.__)("Grayscale filter","coblocks")},{icon:(0,n.createElement)(m.Icon,{icon:k.amg}),isActive:"sepia"===r,onClick:()=>{i({filter:"sepia"})},slug:"sepia",
/* translators: image style */
title:(0,s.__)("Sepia filter","coblocks")},{icon:(0,n.createElement)(m.Icon,{icon:k.swD}),isActive:"saturation"===r,onClick:()=>{i({filter:"saturation"})},slug:"saturation",
/* translators: image style */
title:(0,s.__)("Saturation filter","coblocks")},{icon:(0,n.createElement)(m.Icon,{icon:k.tu4}),isActive:"dim"===r,onClick:()=>{i({filter:"dim"})},slug:"dim",
/* translators: image style */
title:(0,s.__)("Dim filter","coblocks")},{icon:(0,n.createElement)(m.Icon,{icon:k.jZD}),isActive:"vintage"===r,onClick:()=>{i({filter:"vintage"})},slug:"vintage",
/* translators: image style */
title:(0,s.__)("Vintage filter","coblocks")}];return(0,n.createElement)(m.ToolbarGroup,null,(0,n.createElement)(m.DropdownMenu,{className:c()("components-coblocks-media-filter","none"!==r?"has-filter":""),icon:(0,n.createElement)(m.Icon,{icon:k.AF8}),label:(0,s.__)("Apply filter","coblocks"),noIcons:!0,popoverProps:{className:"components-coblocks-dropdown"}},(()=>(0,n.createElement)(m.MenuGroup,null,(0,n.createElement)(L,{hoveredFilter:t}),b.map((e=>(0,n.createElement)(m.MenuItem,{icon:e.icon,isSelected:r===e.slug,key:`coblocks-image-filter-${e.slug}`,label:e.title,onClick:e.onClick,onMouseEnter:()=>o(e.slug),onMouseLeave:()=>o(null),role:"menuitemradio"},e.title)))))))},I=x;x.propTypes={attributes:b().object,setAttributes:b().func};const A=e=>{const{attributes:t}=e,{images:l}=t,o=!!l.filter((e=>void 0!==e.id)).length;return(0,n.createElement)(N.BlockControls,null,o&&(0,n.createElement)(I,e))};var M=l(2547),O=l(3264),B=l(2238);const D=e=>{const{noticeOperations:t,onSelect:l,label:o}=e;return(0,n.createElement)(m.DropZone,{label:o,onFilesDrop:e=>{(0,B.mediaUpload)({allowedTypes:M.o2,filesList:e,onError:t.createErrorNotice,onFileChange:e=>l(e)})}})};D.propTypes={label:b().string,noticeOperations:b().object,onSelect:b().func};const F=D;var R=l(4333),P=l(1313),G=l(444);const U=(0,n.createElement)(G.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,n.createElement)(G.Path,{d:"M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"})),$=(0,R.compose)([m.withNotices])((e=>{const{attributes:t,className:l,isSelected:a,noticeUI:i,setAttributes:r}=e,[b,u]=(0,n.useState)(null),[p,_]=(0,n.useState)(null),[k,g]=(0,n.useState)(!1),d=(0,R.usePrevious)(l),h=(0,R.usePrevious)(a);(0,n.useEffect)((()=>{l!==d&&(l.includes("is-style-layered")?(_(t.gutter),r({gutter:"small"})):(_(null),r({shadow:"none",gutter:p||t.gutter})))}),[l,d]),(0,n.useEffect)((()=>{a!==h&&!1===a&&u(null)}),[a,h]);const v=e=>t.images.find((t=>parseInt(t.index)===parseInt(e))),E=t=>{const{noticeOperations:l}=e;l.removeAllNotices(),l.createErrorNotice(t)},C=(e,l)=>{const o=[...t.images.filter((e=>parseInt(e.index)!==parseInt(l))),{...M.oj(e),index:l}];r({images:o})},w=(e,l)=>{const o=v(e),n=[...t.images.filter((t=>parseInt(t.index)!==parseInt(e))),Object.assign({},o,l)];r({images:n})},f=()=>{g(!0)},y=e=>{const o=v(e),i=a&&b===o.index,p=!l.includes("is-style-layered"),_=(0,n.createElement)(m.DropZone,{label:(0,s.__)("Drop image to replace","coblocks"),onFilesDrop:t=>((e,t)=>{(0,B.mediaUpload)({allowedTypes:["image"],filesList:e,onFileChange:e=>{let[l]=e;return C(l,t)},onError:E})})(t,e)});return(0,n.createElement)(n.Fragment,null,(0,n.createElement)("a",{onClick:()=>(e=>{b!==e&&u(e)})(o.index),role:"button",tabIndex:"0"},(0,n.createElement)("figure",{className:c()({"wp-block-coblocks-gallery-collage__figure":!0,"is-transient":(0,P.isBlobURL)(o.url),"is-selected":i,[`shadow-${t.shadow}`]:t.shadow})},i&&(0,n.createElement)(n.Fragment,null,(0,n.createElement)(m.ButtonGroup,{className:"block-library-gallery-item__inline-menu is-right is-visible"},(0,n.createElement)(N.MediaUploadCheck,null,(0,n.createElement)(N.MediaUpload,{allowedTypes:["image"],onSelect:t=>C(t,e),render:e=>{let{open:t}=e;return(0,n.createElement)(m.Button,{className:"coblocks-gallery-item__button-replace",label:(0,s.__)("Replace Image","coblocks"),onClick:t},(0,s.__)("Replace","coblocks"))},value:o.url})),(0,n.createElement)(m.Button,{disabled:!i,icon:U,label:(0,s.__)("Remove image","coblocks"),onClick:()=>(e=>{const l=[...t.images.filter((t=>parseInt(t.index)!==parseInt(e)))];r({images:l})})(e)}))),b===o.index&&"custom"===t.linkTo&&(0,n.createElement)("form",{className:"components-coblocks-gallery-item__image-link",onSubmit:e=>e.preventDefault()},(0,n.createElement)(m.Dashicon,{icon:"admin-links"}),(0,n.createElement)(N.URLInput,{onChange:t=>w(e,{imgLink:t}),value:o.imgLink}),(0,n.createElement)(m.Button,{icon:k?"saved":"editor-break",label:k?(0,s.__)("Saving","coblocks"):(0,s.__)("Apply","coblocks"),onClick:f,type:"submit"})),_,(0,P.isBlobURL)(o.url)&&(0,n.createElement)(m.Spinner,null),(0,n.createElement)("img",{alt:o.alt,src:o.url}),p&&t.captions&&(o.caption||i)&&(0,n.createElement)(N.RichText,{className:"coblocks-gallery--caption",inlineToolbar:!0,isSelected:i,onChange:t=>w(e,{caption:t}),placeholder:(0,s.__)("Write caption…","coblocks"),tagName:"figcaption",value:o.caption}))))},T=l=>{const a=!!v(l),s=c()("wp-block-coblocks-gallery-collage__figure",{[`shadow-${t.shadow}`]:t.shadow});return(0,n.createElement)(N.MediaPlaceholder,{accept:"image/*",addToGallery:!0,allowedTypes:["image"],className:s,disableDropZone:!0,disableMediaButtons:a,icon:!1,labels:{title:" ",instructions:" "},multiple:!1,onError:E,onSelect:e=>C(e,l)},(0,n.createElement)(F,(0,o.Z)({},e,{label:"Drop file to upload",onSelect:e=>{let[t]=e;return C(t,l)}})))},{animation:L,captions:x,captionStyle:I,filter:D,lightbox:G}=t,$=!l.includes("is-style-layered"),j=!l.includes("is-style-layered"),V=[];for(let e=0;e<(["is-style-tiled","is-style-layered"].includes(t.className)?4:5);e++){const t=v(e);V.push((0,n.createElement)("li",{className:c()("wp-block-coblocks-gallery-collage__item",`item-${e+1}`,{[`coblocks-animate ${L}`]:L,"is-selected":e===parseInt(b)}),key:`image-${e}`},t?y(e):T(e)))}return(0,n.createElement)(n.Fragment,null,(0,n.createElement)(A,e),(0,n.createElement)(S,(0,o.Z)({},e,{enableCaptions:j,enableGutter:$})),i,(0,n.createElement)(O.Z,t,(0,n.createElement)("div",{className:c()(l,{[`has-filter-${D}`]:"none"!==D,[`has-caption-style-${I}`]:x&&void 0!==I,"has-lightbox":G})},(0,n.createElement)("ul",null,V))))}))}}]);