carhop__plugins__PROD-DEV/plugins/carhop-blocks/build/image-stack/index.js

(()=>{"use strict";var e,a={4864:()=>{const e=window.wp.blocks,a=window.wp.i18n,t=window.wp.blockEditor,i=window.wp.components,l=window.wp.element,s=window.ReactJSXRuntime,n=JSON.parse('{"UU":"carhop-blocks/image-stack"}');(0,e.registerBlockType)(n.UU,{edit:function({attributes:e,setAttributes:n}){const{images:o,height:r}=e,[c,d]=(0,l.useState)(null),m=(0,t.useBlockProps)(),g=e=>{const a=e.map(e=>({id:e.id,url:e.url,alt:e.alt||"",focalPoint:{x:.5,y:.5},scale:.8,rotation:0}));n({images:[...o,...a]})},h=(e,a)=>{const t=[...o],i=e+a;i>=0&&i<o.length&&([t[e],t[i]]=[t[i],t[e]],n({images:t}),d(i))},p=e=>{const a=e.focalPoint||{x:.5,y:.5},t=e.scale||.8,i=e.rotation||0;return{left:100*a.x+"%",top:100*a.y+"%",transform:` rotate(${i}deg) scale(${t})`}};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.BlockControls,{children:(0,s.jsx)(i.ToolbarGroup,{children:(0,s.jsx)(t.MediaUploadCheck,{children:(0,s.jsx)(t.MediaUpload,{onSelect:g,allowedTypes:["image"],multiple:!0,gallery:!0,value:o.map(e=>e.id),render:({open:e})=>(0,s.jsx)(i.ToolbarButton,{onClick:e,children:(0,a.__)("Add Images","image-stack")})})})})}),(0,s.jsxs)(t.InspectorControls,{children:[(0,s.jsx)(i.PanelBody,{title:(0,a.__)("Container Settings","image-stack"),children:(0,s.jsx)(i.RangeControl,{label:(0,a.__)("Container Height","image-stack"),value:r,onChange:e=>n({height:e}),min:200,max:800,step:10})}),o.length>0&&(0,s.jsx)(i.PanelBody,{title:(0,a.__)("Images","image-stack"),initialOpen:!0,children:o.map((e,t)=>(0,s.jsxs)(i.PanelBody,{title:`${(0,a.__)("Image","image-stack")} ${t+1}`,initialOpen:c===t,onToggle:()=>d(c===t?null:t),children:[(0,s.jsx)("div",{className:"image-stack-image-preview",children:(0,s.jsx)("img",{src:e.url,alt:e.alt})}),(0,s.jsx)(i.FocalPointPicker,{label:(0,a.__)("Focal Point","image-stack"),url:e.url,value:e.focalPoint||{x:.5,y:.5},onChange:e=>((e,a)=>{const t=[...o];t[e]={...t[e],focalPoint:a},n({images:t})})(t,e)}),(0,s.jsx)(i.RangeControl,{label:(0,a.__)("Scale","image-stack"),value:e.scale||.8,onChange:e=>((e,a)=>{const t=[...o];t[e]={...t[e],scale:a},n({images:t})})(t,e),min:.1,max:3,step:.05}),(0,s.jsx)(i.RangeControl,{label:(0,a.__)("Rotation (deg)","image-stack"),value:e.rotation||0,onChange:e=>((e,a)=>{const t=[...o];t[e]={...t[e],rotation:a},n({images:t})})(t,e),min:-180,max:180,step:1}),(0,s.jsxs)("div",{className:"image-stack-image-controls",children:[(0,s.jsx)(i.Button,{isSecondary:!0,isSmall:!0,disabled:0===t,onClick:()=>h(t,-1),children:(0,a.__)("↑ Move Up","image-stack")}),(0,s.jsx)(i.Button,{isSecondary:!0,isSmall:!0,disabled:t===o.length-1,onClick:()=>h(t,1),children:(0,a.__)("↓ Move Down","image-stack")}),(0,s.jsx)(i.Button,{isDestructive:!0,isSmall:!0,onClick:()=>(e=>{const a=o.filter((a,t)=>t!==e);n({images:a}),c===e&&d(null)})(t),children:(0,a.__)("Remove","image-stack")})]})]},e.id))})]}),(0,s.jsx)("div",{...m,children:(0,s.jsxs)("div",{className:"image-stack-container",style:{height:`${r}px`},children:[0===o.length&&(0,s.jsx)("div",{className:"image-stack-placeholder",children:(0,s.jsx)(t.MediaUploadCheck,{children:(0,s.jsx)(t.MediaUpload,{onSelect:g,allowedTypes:["image"],multiple:!0,gallery:!0,render:({open:e})=>(0,s.jsx)(i.Button,{variant:"primary",onClick:e,children:(0,a.__)("Ajouter une Image","image-stack")})})})}),o.map((e,a)=>(0,s.jsx)("div",{className:"image-stack-item "+(c===a?"is-selected":""),onClick:()=>d(a),role:"button",tabIndex:0,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||d(a)},style:p(e),children:(0,s.jsx)("img",{src:e.url,alt:e.alt})},e.id))]})})]})},save:function({attributes:e}){const{images:a,height:i}=e,l=t.useBlockProps.save(),n=e=>{const a=e.focalPoint||{x:.5,y:.5},t=e.scale||.8,i=e.rotation||0;return{left:100*a.x+"%",top:100*a.y+"%",transform:`rotate(${i}deg) scale(${t})`}};return(0,s.jsx)("div",{...l,children:(0,s.jsx)("div",{className:"image-stack-container",style:{height:`${i}px`},children:a.map(e=>(0,s.jsx)("div",{className:"image-stack-item",style:n(e),children:(0,s.jsx)("img",{src:e.url,alt:e.alt})},e.id))})})}})}},t={};function i(e){var l=t[e];if(void 0!==l)return l.exports;var s=t[e]={exports:{}};return a[e](s,s.exports,i),s.exports}i.m=a,e=[],i.O=(a,t,l,s)=>{if(!t){var n=1/0;for(d=0;d<e.length;d++){for(var[t,l,s]=e[d],o=!0,r=0;r<t.length;r++)(!1&s||n>=s)&&Object.keys(i.O).every(e=>i.O[e](t[r]))?t.splice(r--,1):(o=!1,s<n&&(n=s));if(o){e.splice(d--,1);var c=l();void 0!==c&&(a=c)}}return a}s=s||0;for(var d=e.length;d>0&&e[d-1][2]>s;d--)e[d]=e[d-1];e[d]=[t,l,s]},i.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),(()=>{var e={6788:0,7020:0};i.O.j=a=>0===e[a];var a=(a,t)=>{var l,s,[n,o,r]=t,c=0;if(n.some(a=>0!==e[a])){for(l in o)i.o(o,l)&&(i.m[l]=o[l]);if(r)var d=r(i)}for(a&&a(t);c<n.length;c++)s=n[c],i.o(e,s)&&e[s]&&e[s][0](),e[s]=0;return i.O(d)},t=globalThis.webpackChunkcarhop_blocks=globalThis.webpackChunkcarhop_blocks||[];t.forEach(a.bind(null,0)),t.push=a.bind(null,t.push.bind(t))})();var l=i.O(void 0,[7020],()=>i(4864));l=i.O(l)})();