@10up/block-components
Version:
10up Components built for the WordPress Block Editor.
13 lines (12 loc) • 3.93 kB
JavaScript
!function(){"use strict";var e={1007:function(e){e.exports=require("@emotion/react")},2627:function(e){e.exports=require("@wordpress/block-editor")},9416:function(e){e.exports=require("@wordpress/blocks")},5214:function(e){e.exports=require("@wordpress/data")},7966:function(e){e.exports=require("@wordpress/element")}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var s=t[n]={exports:{}};return e[n](s,s.exports,r),s.exports}r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,{a:t}),t},r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};r.r(n),r.d(n,{InnerBlockSlider:function(){return f}});var o=r(7966),s=r(5214),l=r(9416),i=r(2627),a=require("@wordpress/deprecated"),c=r.n(a),u=r(1007);const d=()=>(0,o.createElement)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"40",height:"40",fill:"none",viewBox:"0 0 14.4 23.7"},(0,o.createElement)("path",{stroke:"currentColor",strokeWidth:"3",d:"M11.19,1.81l-9.12,10,9.12,10"})),p=()=>(0,o.createElement)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"40",height:"40",fill:"none",viewBox:"0 0 14.4 23.7"},(0,o.createElement)("path",{stroke:"currentColor",strokeWidth:"3",d:"M2.1,21.9l9.1-10l-9.1-10"}));function h(){return h=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)({}).hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},h.apply(null,arguments)}const f=({parentBlockId:e,slidesPerPage:t=1,allowedBlock:r,template:n=null,slideHeight:a=null})=>{const[f,v]=(0,o.useState)(1);c()("InnerBlockSlider",{since:"1.15.12",version:"1.16",alternative:"the useInnerBlocksProps hook to render the inner blocks and then use the same JS library that powers the slider on the frontend in the editor",plugin:"10up Block Components"});let x=n;x||(x=[[r]]);const g=(0,s.useSelect)(t=>t("core/block-editor").getBlock(e).innerBlocks),{insertBlock:w}=(0,s.useDispatch)("core/editor"),b=(0,o.useRef)(),m=(0,o.useRef)(),k=Math.ceil(g.length/t),y=100/t*g.length,j=100/g.length,B=j*(f-1)*t;(0,o.useEffect)(()=>{v(1)},[t]),(0,o.useEffect)(()=>{m.current?g.length>m.current?(m.current=g.length,v(k)):g.length<m.current&&(m.current=g.length,f>k&&v(k)):m.current=g.length},[g.length]);const S=u.css`
/* stylelint-disable */
width: ${y}%;
transform: translate3d(-${B}%, 0px, 0px);
${a?`height: ${a};`:""}
display: flex;
flex-wrap: nowrap;
& > .wp-block {
width: ${j}%;
}
`,N=(0,i.useInnerBlocksProps)({className:"slides",ref:b},{template:x,orientation:"horizontal",allowedBlocks:[r]}),P=f>1,O=f<k;return(0,u.jsx)("div",{className:"inner-block-slider"},(0,u.jsx)("div",{className:"slides-outer",style:{overflow:"hidden"}},(0,u.jsx)("div",h({},N,{css:S}))),(0,u.jsx)("div",{className:"navigation"},[...Array(k).keys()].map(e=>(0,u.jsx)("button",{"aria-label":`Slide ${e+1}`,onClick:()=>{v(e+1)},type:"button",key:e+1,className:"dot "+(f===e+1?"current":"")})),(0,u.jsx)("button",{"aria-label":"Add new slide",onClick:()=>{(()=>{const t=(0,l.createBlock)(r);w(t,void 0,e)})()},type:"button",className:"add"},(0,u.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",role:"img"},(0,u.jsx)("path",{d:"M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z"})))),(0,u.jsx)("div",{className:"controls"},(0,u.jsx)("div",{className:"prev-container "+(P?"":"disable")},(0,u.jsx)("button",{onClick:()=>{P&&v(f-1)},type:"button"},(0,u.jsx)(d,null))),(0,u.jsx)("div",{className:"next-container "+(O?"":"disable")},(0,u.jsx)("button",{onClick:()=>{O&&v(f+1)},type:"button"},(0,u.jsx)(p,null)))))};module.exports=n}();
//# sourceMappingURL=index.js.map