FileMaster

Edit File: product-gallery-thumbnails.js

(()=>{"use strict";var e,t,o,r={2928:(e,t,o)=>{const r=window.wp.blocks;var l=o(790);const i=window.wc.wcSettings,a=window.wp.blockEditor;var s=o(6087);const c=window.wp.coreData,n=window.wp.data;var u=o(4921),m=o(7723);const p=window.wp.components,d=({attributes:e,setAttributes:t})=>{const{thumbnailSize:o,aspectRatio:r}=e,i=[{value:"",label:(0,m.__)("Select Aspect Ratio","woocommerce"),disabled:!0},{value:"auto",label:(0,m.__)("Auto","woocommerce")},{value:"1",label:(0,m.__)("Square - 1:1","woocommerce")},{value:"4/3",label:(0,m.__)("Standard - 4:3","woocommerce")},{value:"3/4",label:(0,m.__)("Portrait - 3:4","woocommerce")},{value:"3/2",label:(0,m.__)("Classic - 3:2","woocommerce")},{value:"2/3",label:(0,m.__)("Classic Portrait - 2:3","woocommerce")},{value:"16/9",label:(0,m.__)("Wide - 16:9","woocommerce")},{value:"9/16",label:(0,m.__)("Tall - 9:16","woocommerce")}];return(0,l.jsxs)(p.PanelBody,{children:[(0,l.jsx)(p.__experimentalUnitControl,{label:(0,m.__)("Thumbnail Size","woocommerce"),value:o,onChange:e=>{const o=Number(e?.replace("%","")||25),r=Math.min(Math.max(o,10),50);t({thumbnailSize:r+"%"})},units:[{value:"%",label:"%"}],min:10,max:50,step:1,size:"default",__next40pxDefaultSize:!0,help:(0,m.__)("Choose the size of each thumbnail in respect to the product image. If thumbnails container size gets bigger than the product image, thumbnails will turn to slider.","woocommerce")}),(0,l.jsx)(p.SelectControl,{__next40pxDefaultSize:!0,multiple:!1,value:r,options:i,label:(0,m.__)("Aspect Ratio","woocommerce"),onChange:e=>{t({aspectRatio:e})},help:(0,m.__)("Applies the selected aspect ratio to product thumbnails.","woocommerce")})]})},b=JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"woocommerce/product-gallery-thumbnails","title":"Thumbnails","description":"Display the Thumbnails of a product.","category":"woocommerce","keywords":["WooCommerce"],"usesContext":["postId"],"textdomain":"woocommerce","ancestor":["woocommerce/product-gallery"],"attributes":{"thumbnailSize":{"type":"string","default":"25%"},"aspectRatio":{"type":"string","default":"1"}},"supports":{"spacing":{"margin":true},"interactivity":true},"editorStyle":"file:../woocommerce/product-gallery-thumbnails-editor.css"}');(0,r.registerBlockType)(b,{icon:()=>(0,l.jsx)("svg",{width:"19",height:"19",viewBox:"0 0 19 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,l.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M13.375 1.5H1.625C1.55596 1.5 1.5 1.55596 1.5 1.625V9.87895L4.35871 8.33965C4.5696 8.22609 4.82204 8.22009 5.03808 8.3235L7.42329 9.46513L10.3126 7.39076C10.574 7.20308 10.926 7.20308 11.1874 7.39076L13.5 9.05108V1.625C13.5 1.55596 13.444 1.5 13.375 1.5ZM13.5 10.8976L10.75 8.92328L7.93741 10.9426C7.71497 11.1023 7.42319 11.1281 7.1762 11.0098L4.73428 9.84105L1.5 11.5826V13.375C1.5 13.444 1.55596 13.5 1.625 13.5H13.375C13.444 13.5 13.5 13.444 13.5 13.375V10.8976ZM1.625 0C0.727537 0 0 0.727538 0 1.625V13.375C0 14.2725 0.727538 15 1.625 15H13.375C14.2725 15 15 14.2725 15 13.375V1.625C15 0.727537 14.2725 0 13.375 0H1.625ZM17.25 5V16C17.25 16.6909 16.6909 17.25 16.0011 17.25H3V18.75H16.0011C17.5204 18.75 18.75 17.5183 18.75 16V5H17.25Z",fill:"#1E1E1E"})}),edit:({attributes:e,setAttributes:t,context:o})=>{const{thumbnailSize:r,aspectRatio:m}=e,{product:p}=(b=o.postId,(0,n.useSelect)((e=>{if(!b)return{product:void 0,isResolving:!1};const t="string"==typeof b?parseInt(b,10):b;return{product:e(c.store).getEditedEntityRecord("root","product",t),isResolving:e(c.store).isResolving("getEditedEntityRecord",["root","product",t]),isResolutionFinished:e(c.store).hasFinishedResolution("getEditedEntityRecord",["root","product",t])}}),[b]));var b;const h=p&&p.images&&p.images.length>0?p.images.slice(0,10).map((e=>({src:e?.src,alt:e?.alt}))):Array(10).fill({src:i.PLACEHOLDER_IMG_SRC,alt:""}),w=h.length>1,g=(0,s.useRef)(null),[f,v]=(0,s.useState)({bottom:!1,right:!1});(0,s.useEffect)((()=>{const e=g.current;if(!e)return;const t=new ResizeObserver((()=>{const t=(e=>{if(!e)return{top:!1,bottom:!1,left:!1,right:!1};const{scrollTop:t,scrollHeight:o,clientHeight:r,scrollLeft:l,scrollWidth:i,clientWidth:a}=e;return{top:t>3,bottom:t+r<o-3,left:l>3,right:l+a<i-3}})(e);v(t)}));return t.observe(e),e.parentElement&&t.observe(e.parentElement),()=>{t.disconnect()}}),[r]);const _=Number(r.replace("%","")),y=(0,u.A)("wc-block-product-gallery-thumbnails",{"wc-block-product-gallery-thumbnails--overflow-right":f.right,"wc-block-product-gallery-thumbnails--overflow-bottom":f.bottom}),x=(0,a.useBlockProps)({className:y,style:{"--wc-block-product-gallery-thumbnails-size":_}}),C={aspectRatio:m};return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(a.InspectorControls,{children:(0,l.jsx)(d,{attributes:e,setAttributes:t})}),w&&(0,l.jsx)("div",{...x,children:(0,l.jsx)("div",{ref:g,className:"wc-block-product-gallery-thumbnails__scrollable",children:h.map((({src:e,alt:t},o)=>{const r=(0,u.A)("wc-block-product-gallery-thumbnails__thumbnail__image",{"wc-block-product-gallery-thumbnails__thumbnail__image--is-active":0===o});return(0,l.jsx)("div",{className:"wc-block-product-gallery-thumbnails__thumbnail",children:(0,l.jsx)("img",{className:r,src:e,alt:t,loading:"lazy",style:C})},o)}))})})]})},save:()=>null})},790:e=>{e.exports=window.ReactJSXRuntime},6087:e=>{e.exports=window.wp.element},7723:e=>{e.exports=window.wp.i18n}},l={};function i(e){var t=l[e];if(void 0!==t)return t.exports;var o=l[e]={exports:{}};return r[e](o,o.exports,i),o.exports}i.m=r,e=[],i.O=(t,o,r,l)=>{if(!o){var a=1/0;for(u=0;u<e.length;u++){for(var[o,r,l]=e[u],s=!0,c=0;c<o.length;c++)(!1&l||a>=l)&&Object.keys(i.O).every((e=>i.O[e](o[c])))?o.splice(c--,1):(s=!1,l<a&&(a=l));if(s){e.splice(u--,1);var n=r();void 0!==n&&(t=n)}}return t}l=l||0;for(var u=e.length;u>0&&e[u-1][2]>l;u--)e[u]=e[u-1];e[u]=[o,r,l]},i.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},o=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,i.t=function(e,r){if(1&r&&(e=this(e)),8&r)return e;if("object"==typeof e&&e){if(4&r&&e.__esModule)return e;if(16&r&&"function"==typeof e.then)return e}var l=Object.create(null);i.r(l);var a={};t=t||[null,o({}),o([]),o(o)];for(var s=2&r&&e;"object"==typeof s&&!~t.indexOf(s);s=o(s))Object.getOwnPropertyNames(s).forEach((t=>a[t]=()=>e[t]));return a.default=()=>e,i.d(l,a),l},i.d=(e,t)=>{for(var o in t)i.o(t,o)&&!i.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.j=6565,(()=>{var e={6565:0};i.O.j=t=>0===e[t];var t=(t,o)=>{var r,l,[a,s,c]=o,n=0;if(a.some((t=>0!==e[t]))){for(r in s)i.o(s,r)&&(i.m[r]=s[r]);if(c)var u=c(i)}for(t&&t(o);n<a.length;n++)l=a[n],i.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return i.O(u)},o=globalThis.webpackChunkwebpackWcBlocksMainJsonp=globalThis.webpackChunkwebpackWcBlocksMainJsonp||[];o.forEach(t.bind(null,0)),o.push=t.bind(null,o.push.bind(o))})();var a=i.O(void 0,[94],(()=>i(2928)));a=i.O(a),((this.wc=this.wc||{}).blocks=this.wc.blocks||{})["product-gallery-thumbnails"]=a})();

Back