vue3-flashcards/dist/flashcards.umd.cjs

Tinder-like flashcards component with dragging and flipping

(function(){try{if(typeof document<`u`){var e=document.createElement(`style`);e.appendChild(document.createTextNode(`.flash-card[data-v-28f9555f]{will-change:transform;overscroll-behavior:none;border-radius:8px;width:100%;position:relative}.flash-card[data-v-28f9555f]:not(.flash-card--drag-disabled){touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.flash-card__transform[data-v-28f9555f]{touch-action:inherit;border-radius:8px;position:relative}.flash-card[data-v-28f9555f]:not(.flash-card--dragging),.flash-card:not(.flash-card--dragging) .flash-card__transform[data-v-28f9555f]{transition:transform .4s cubic-bezier(.4,0,.2,1)}.flash-card--resetting[data-v-28f9555f],.flash-card--resetting .flash-card__transform[data-v-28f9555f]{transition:none!important}.flash-card__indicator[data-v-28f9555f]{pointer-events:none;z-index:10;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.flash-card__transform--skip[data-v-28f9555f],.flash-card__transform--skip-restore[data-v-28f9555f]{overflow:hidden}.flash-card__transform--skip[data-v-28f9555f]:before,.flash-card__transform--skip-restore[data-v-28f9555f]:before{content:"";z-index:1;background:linear-gradient(90deg,#0000 0%,#fffc 50%,#0000 100%);border-radius:8px;width:100%;height:100%;position:absolute;top:0;left:-100%}.flash-card__transform--skip[data-v-28f9555f]:before{animation:.4s cubic-bezier(.4,0,.2,1) forwards flash-card-skip-wave-28f9555f}.flash-card__transform--skip-restore[data-v-28f9555f]:before{animation:.4s cubic-bezier(.4,0,.2,1) reverse forwards flash-card-skip-wave-28f9555f}@keyframes flash-card-skip-wave-28f9555f{to{left:100%}}.flashcards[data-v-e9a18173]{isolation:isolate;display:grid;position:relative;overflow:visible}.flashcards__card-wrapper[data-v-e9a18173]{pointer-events:none;contain:layout;grid-area:1/1;transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .4s cubic-bezier(.4,0,.2,1)}.flashcards__card--active[data-v-e9a18173]{pointer-events:all}.flashcards-empty-state[data-v-e9a18173]{grid-area:1/1;justify-content:center;align-items:center;display:flex}.flashcards[data-v-e9a18173]:focus{outline:none}.flashcards[data-v-e9a18173]:focus-visible{outline-offset:2px;outline:2px solid highlight}.flashcards__sr-only[data-v-e9a18173]{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.flip-card[data-v-d01483e2]{perspective:1000px;cursor:pointer;width:100%}.flip-card__inner[data-v-d01483e2]{text-align:center;width:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1);position:relative}.flip-card__inner--x.flip-card__inner--flipped[data-v-d01483e2]{transform:rotateX(180deg)}.flip-card__inner--y.flip-card__inner--flipped[data-v-d01483e2]{transform:rotateY(180deg)}.flip-card__front[data-v-d01483e2],.flip-card__back[data-v-d01483e2]{backface-visibility:hidden;width:100%}.flip-card__front[data-v-d01483e2]{transform:rotateY(0)}.flip-card__back[data-v-d01483e2]{height:100%;position:absolute;top:0;left:0}.flip-card__inner--y .flip-card__back[data-v-d01483e2]{transform:rotateY(180deg)}.flip-card__inner--x .flip-card__back[data-v-d01483e2]{transform:rotateX(180deg)}
/*$vite$:1*/`)),document.head.appendChild(e)}}catch(e){console.error(`vite-plugin-css-injected-by-js`,e)}})();(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.FlashCards={},e.Vue))})(this,function(exports,t){var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),c(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t);let l={TOP:`top`,BOTTOM:`bottom`,LEFT:`left`,RIGHT:`right`};function u(e){let n=(0,t.computed)(()=>(0,t.toValue)(e));return{getCardStyle:e=>{let{stack:t,stackOffset:r,stackScale:i}=n.value;if(!t)return``;let a=e<=t,o=a?e*r:(e-1)*r,s=1-e*i,c=`transform: translate3D(0, 0, 0) scale(1)`;switch(n.value.stackDirection){case l.TOP:c=`transform: translate3D(0, -${o}px, 0) scale(${s})`;break;case l.BOTTOM:c=`transform: translate3D(0, ${o}px, 0) scale(${s})`;break;case l.LEFT:c=`transform: translate3D(-${o}px, 0, 0) scale(${s})`;break;case l.RIGHT:c=`transform: translate3D(${o}px, 0, 0) scale(${s})`;break}return`${c}; opacity: ${a?1:0};`}}}let d={renderLimit:3,swipeThreshold:150,dragThreshold:5,swipeDirection:`horizontal`,maxRotation:20,stack:0,stackOffset:20,stackScale:.05,stackDirection:l.BOTTOM,itemKey:`id`,loop:void 0,waitAnimationEnd:void 0,resistance:null,velocity:void 0,a11y:void 0},f={threshold:150,strength:.3},p={enabled:!0,threshold:.5},m={enabled:!0,keyboard:!0,confirmOnKey:!1,manageFocus:!0,liveMode:`polite`,labels:{deck:`Card deck`,card:`Card`,top:`up`,left:`left`,right:`right`,bottom:`down`,skip:`skipped`,restore:`restored`,empty:`No more cards`,instructions:`Use arrow keys to swipe the card, Enter to confirm.`}};var h=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},g={},_={width:`80px`,height:`80px`,viewBox:`0 0 28 28`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`};function v(e,n){return(0,t.openBlock)(),(0,t.createElementBlock)(`svg`,_,[...n[0]||=[(0,t.createElementVNode)(`path`,{d:`M6.65263 14.0304C6.29251 13.6703 6.29251 13.0864 6.65263 12.7263C7.01276 12.3662 7.59663 12.3662 7.95676 12.7263L11.6602 16.4297L19.438 8.65183C19.7981 8.29171 20.382 8.29171 20.7421 8.65183C21.1023 9.01195 21.1023 9.59583 20.7421 9.95596L12.3667 18.3314C11.9762 18.7219 11.343 18.7219 10.9525 18.3314L6.65263 14.0304Z`,fill:`green`},null,-1),(0,t.createElementVNode)(`path`,{"clip-rule":`evenodd`,d:`M14 1C6.8203 1 1 6.8203 1 14C1 21.1797 6.8203 27 14 27C21.1797 27 27 21.1797 27 14C27 6.8203 21.1797 1 14 1ZM3 14C3 7.92487 7.92487 3 14 3C20.0751 3 25 7.92487 25 14C25 20.0751 20.0751 25 14 25C7.92487 25 3 20.0751 3 14Z`,fill:`green`,"fill-rule":`evenodd`},null,-1)]])}var y=h(g,[[`render`,v]]),b={},x={fill:`#000000`,width:`80px`,height:`80px`,viewBox:`0 0 64 64`,version:`1.1`,xmlns:`http://www.w3.org/2000/svg`,"xmlns:xlink":`http://www.w3.org/1999/xlink`,"xml:space":`preserve`,"xmlns:serif":`http://www.serif.com/`,style:{"fill-rule":`evenodd`,"clip-rule":`evenodd`,"stroke-linejoin":`round`,"stroke-miterlimit":`2`}};function S(e,n){return(0,t.openBlock)(),(0,t.createElementBlock)(`svg`,x,[...n[0]||=[(0,t.createElementVNode)(`path`,{d:`M32.266,7.951c13.246,0 24,10.754 24,24c0,13.246 -10.754,24 -24,24c-13.246,0 -24,-10.754 -24,-24c0,-13.246 10.754,-24 24,-24Zm-15.616,11.465c-2.759,3.433 -4.411,7.792 -4.411,12.535c0,11.053 8.974,20.027 20.027,20.027c4.743,0 9.102,-1.652 12.534,-4.411l-28.15,-28.151Zm31.048,25.295c2.87,-3.466 4.596,-7.913 4.596,-12.76c0,-11.054 -8.974,-20.028 -20.028,-20.028c-4.847,0 -9.294,1.726 -12.76,4.596l28.192,28.192Z`,fill:`red`},null,-1)]])}var C=h(b,[[`render`,S]]),w=320,T=15;let E={transform:`translate(0px, 0px) rotate(0deg) scale(1)`,opacity:1},D=({type:e})=>{switch(e){case`right`:return{transform:`translate(${w}px, 0px) rotate(${T}deg) scale(1)`,opacity:0};case`left`:return{transform:`translate(-${w}px, 0px) rotate(-${T}deg) scale(1)`,opacity:0};case`top`:return{transform:`translate(0px, -${w}px) rotate(0deg) scale(0.8)`,opacity:0};case`bottom`:return{transform:`translate(0px, ${w}px) rotate(0deg) scale(0.8)`,opacity:0};case`skip`:default:return{transform:`translate(0px, 0px) rotate(0deg) scale(1)`,opacity:0}}},O={TOP:`top`,LEFT:`left`,RIGHT:`right`,BOTTOM:`bottom`,SKIP:`skip`};function k(e,t){return e===0&&t===0?null:Math.abs(e)>=Math.abs(t)?e>0?`right`:`left`:t>0?`bottom`:`top`}function A(e,t,n,r){if(Math.abs(e)>Math.abs(t)){if(n.includes(`right`)&&e>r)return`right`;if(n.includes(`left`)&&e<-r)return`left`}else{if(n.includes(`top`)&&t<-r)return`top`;if(n.includes(`bottom`)&&t>r)return`bottom`}return null}function j(e,t,n,r,i,a){let o=Math.abs(n),s=Math.abs(r);if(o>=s){if(o<a)return null;if(i.includes(`right`)&&n>0&&e>0)return`right`;if(i.includes(`left`)&&n<0&&e<0)return`left`}else{if(s<a)return null;if(i.includes(`top`)&&r<0&&t<0)return`top`;if(i.includes(`bottom`)&&r>0&&t>0)return`bottom`}return null}let M=Symbol(`is-dragging-key`);function N(e,n){let r=(0,t.toRef)(e),i=(0,t.computed)(()=>(0,t.toValue)(n)),{onDragStart:a=()=>{},onDragMove:o=()=>{},onDragEnd:s=()=>{},onDragComplete:c=()=>{}}=i.value,l=(0,t.computed)(()=>i.value.swipeThreshold??d.swipeThreshold),u=(0,t.computed)(()=>i.value.dragThreshold??d.dragThreshold),m=(0,t.computed)(()=>i.value.maxDragY??null),h=(0,t.computed)(()=>i.value.maxDragX??null),g=(0,t.computed)(()=>i.value.direction),_=(0,t.computed)(()=>g.value),v=(0,t.computed)(()=>!!i.value.resistance),y=(0,t.computed)(()=>{let e=i.value.resistance;return(e&&e.threshold)??f.threshold}),b=(0,t.computed)(()=>{let e=i.value.resistance;return(e&&e.strength)??f.strength}),x=(0,t.computed)(()=>i.value.velocity!==null),S=(0,t.computed)(()=>{let e=i.value.velocity;return(e&&e.threshold)??p.threshold}),C=(0,t.ref)(!1),w=(0,t.ref)(!1),T=(0,t.ref)(null),E=0,D=0,O=[];function N(){return typeof performance<`u`?performance.now():Date.now()}function P(e,t){let n=N();for(O.push({x:e,y:t,t:n});O.length>1&&n-O[0].t>100;)O.shift()}function F(){if(O.length<2)return{vx:0,vy:0};let e=O[0],t=O[O.length-1],n=t.t-e.t;return n<5?{vx:0,vy:0}:{vx:(t.x-e.x)/n,vy:(t.y-e.y)/n}}(0,t.provide)(M,(0,t.readonly)(w));let I=i.value.initialPosition,L=(0,t.reactive)({x:I?.x||0,y:I?.y||0,delta:I?.delta||0,type:I?.type??k(I?.x??0,I?.y??0)});function R(){Object.assign(L,{x:0,y:0,delta:0,type:null})}function ee(e,t){if(!(_.value||[]).includes(t))return;let n=t,r=Math.max(0,Math.min(1,e));if(r===0){R();return}let i=r*l.value,a=n===`left`||n===`right`;a&&h.value!==null&&(i=Math.min(i,h.value)),!a&&m.value!==null&&(i=Math.min(i,m.value));let o=0,s=0;switch(n){case`right`:o=i;break;case`left`:o=-i;break;case`bottom`:s=i;break;case`top`:s=-i;break}let c=n===`right`||n===`top`?1:-1;Object.assign(L,{x:o,y:s,delta:c*r,type:n})}function z(e,t,n){let r=n.includes(`left`)||n.includes(`right`),i=n.includes(`top`)||n.includes(`bottom`);return r&&!i?`horizontal`:!r&&i?`vertical`:e>=t?`horizontal`:`vertical`}function B(e){C.value=!0,T.value=e.pointerId,E=e.clientX-L.x,D=e.clientY-L.y,O=[],P(L.x,L.y),a()}function V(e){if(!C.value||T.value!==null&&e.pointerId!==T.value)return;let t=e.clientX,n=e.clientY,r=t-E,i=n-D;if(Math.sqrt(r*r+i*i)<u.value)return;e.preventDefault(),e.stopPropagation(),w.value=!0;let a=r,s=i;h.value!==null&&(a=Math.max(-h.value,Math.min(h.value,r))),m.value!==null&&(s=Math.max(-m.value,Math.min(m.value,i)));let c=Math.abs(a),d=Math.abs(s),f=z(c,d,_.value||[])===`horizontal`,p=f?a:-s,g=null;if((c>u.value||d>u.value)&&(g=f?a>0?`right`:`left`:s>0?`bottom`:`top`),v.value&&Math.abs(p)>y.value){let e=Math.abs(p)-y.value,t=1/(1+e*b.value/35),n=e*t,r=p>=0?1:-1,i=y.value+n;f?(a=i*r,p=a):(s=-i*r,p=-s)}let x=Math.max(-1,Math.min(1,p/l.value));L.x=a,L.y=s,L.delta=x,L.type=g,P(a,s),o(L.type,L.delta)}function H(){if(!C.value)return;C.value=!1,w.value=!1,T.value=null;let e=A(L.x,L.y,_.value||[],l.value);if(!e&&x.value){let{vx:t,vy:n}=F();e=j(L.x,L.y,t,n,_.value||[],S.value)}if(O=[],e){switch(c(e),e){case`right`:L.delta=1;break;case`left`:L.delta=-1;break;case`top`:L.delta=1;break;case`bottom`:L.delta=-1;break}L.type=e}else R();s()}function U(e){w.value&&(e.preventDefault(),e.stopPropagation())}function W(e){w.value&&(e.preventDefault(),e.stopPropagation())}function G({applyInitialPosition:e=!0}={}){if(e){let e=i.value.initialPosition;Object.assign(L,{x:e?.x||0,y:e?.y||0,delta:e?.delta||0,type:e?.type??k(e?.x??0,e?.y??0)})}i.value.disableDrag||(r.value?.addEventListener(`pointerdown`,B,{passive:!1}),window.addEventListener(`pointermove`,V,{passive:!1}),window.addEventListener(`pointerup`,H,{passive:!0}),document.addEventListener(`touchmove`,U,{passive:!1}),document.addEventListener(`wheel`,W,{passive:!1}))}(0,t.onMounted)(async()=>{await(0,t.nextTick)(),G()});function K(){r.value?.removeEventListener(`pointerdown`,B),window.removeEventListener(`pointermove`,V),window.removeEventListener(`pointerup`,H),document.removeEventListener(`touchmove`,U),document.removeEventListener(`wheel`,W)}return(0,t.onUnmounted)(()=>{K()}),{setupInteract:G,cleanupInteract:K,position:L,isDragging:w,restore:R,peek:ee,getDominantAxis:z}}function P(){let e=(0,t.ref)(!1);if(typeof window>`u`||!window.matchMedia)return e;let n=window.matchMedia(`(prefers-reduced-motion: reduce)`);e.value=n.matches;let r=t=>{e.value=t.matches};return n.addEventListener?n.addEventListener(`change`,r):n.addListener(r),(0,t.onScopeDispose)(()=>{n.removeEventListener?n.removeEventListener(`change`,r):n.removeListener(r)}),e}var F={class:`flash-card__animation-wrapper`},I=(0,t.defineComponent)({__name:`FlashCard`,props:{disableDrag:{type:Boolean},maxRotation:{default:0},transformStyle:{type:Function},flight:{},animation:{},swipeThreshold:{},dragThreshold:{},maxDragY:{},maxDragX:{},direction:{default:()=>[`left`,`right`]},initialPosition:{},resistance:{},velocity:{}},emits:[`complete`,`mounted`,`animationend`,`dragstart`,`dragmove`,`dragend`],setup(e,{expose:n,emit:r}){let i=(0,t.createPropsRestProxy)(e,[`maxRotation`,`transformStyle`,`flight`,`animation`,`direction`]),a=r,o=e.animation?.keyframes??D,s=e.animation?.easing??`cubic-bezier(0.4, 0, 0.2, 1)`,c=P(),l=e.animation?.duration??400,u=(0,t.computed)(()=>c.value?1:l),d=(0,t.useTemplateRef)(`flash-card`),{position:f,isDragging:p,setupInteract:m,cleanupInteract:h,getDominantAxis:g,peek:_,restore:v}=N(d,()=>({...i,direction:e.direction,...e.flight,onDragStart(){a(`dragstart`)},onDragMove(e,t){a(`dragmove`,e,t)},onDragEnd(){a(`dragend`)},onDragComplete(e){a(`complete`,e,{...f})}}));function b(t){if(e.transformStyle)return e.transformStyle(t);let{x:n,y:r,delta:i}=t,a=Math.abs(n),o=Math.abs(r);if(a===0&&o===0)return`transform: rotate(0deg)`;let s=e.direction||[],c=g(a,o,s),l=s.includes(`left`)||s.includes(`right`),u=s.includes(`top`)||s.includes(`bottom`),d=n>0?`right`:`left`,f=r>0?`bottom`:`top`,p=()=>`transform: rotate(${i*e.maxRotation}deg)`,m=()=>`transform: scale(${1-Math.abs(i)/5})`;return l&&u?c===`horizontal`&&s.includes(d)?p():c===`vertical`&&s.includes(f)?m():`transform: rotate(0deg)`:l?p():m()}(0,t.watch)(()=>i.disableDrag,()=>{h(),m({applyInitialPosition:!1})});let x=null,S=null,w=(0,t.ref)(!1);function T(){x?.cancel(),x=null}function k(){if(d.value){for(let e of d.value.getAnimations())e.cancel();x=null}}function A(t){if(!d.value)return;T(),S=t;let n=o({type:t.type,direction:e.direction||[],maxRotation:e.maxRotation}),r=Array.isArray(n)?n:[n],i;if(t.isRestoring)i=[...r].reverse(),i.push({...E});else{let e=t.initialPosition;i=[e&&(e.x!==0||e.y!==0)?{transform:`translate(${e.x}px, ${e.y}px)`,opacity:1}:{...E},...r]}let c=d.value.animate(i,{duration:u.value,easing:s,fill:`forwards`});x=c,c.finished.then(()=>{x===c&&(x=null,t.isRestoring&&c.cancel(),a(`animationend`))}).catch(()=>{})}function j(){if(e.flight?.type)e.flight!==S&&A(e.flight);else{S=null,k(),w.value=!0,v();let e=()=>{w.value=!1};typeof requestAnimationFrame==`function`?requestAnimationFrame(()=>requestAnimationFrame(e)):(0,t.nextTick)(e)}}(0,t.watch)(()=>e.flight,j,{flush:`post`}),(0,t.onMounted)(()=>{d.value?.offsetHeight&&a(`mounted`,d.value.offsetHeight),j()}),(0,t.onBeforeUnmount)(()=>{T()});let M=(0,t.computed)(()=>e.flight?.type===O.SKIP&&!c.value),I=(0,t.computed)(()=>M.value&&!!e.flight?.isRestoring);return n({position:f,peek:_}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref:`flash-card`,class:(0,t.normalizeClass)([`flash-card`,{"flash-card--dragging":(0,t.unref)(p),"flash-card--resetting":w.value,"flash-card--drag-disabled":i.disableDrag}]),style:(0,t.normalizeStyle)({transform:`translate3D(${(0,t.unref)(f).x}px, ${(0,t.unref)(f).y}px, 0)`})},[(0,t.createElementVNode)(`div`,F,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`flash-card__transform`,{"flash-card__transform--skip":M.value&&!I.value,"flash-card__transform--skip-restore":I.value}]),style:(0,t.normalizeStyle)(b((0,t.unref)(f)))},[(0,t.renderSlot)(e.$slots,`default`,{isDragging:(0,t.unref)(p),delta:(0,t.unref)(f).delta},void 0,!0),(0,t.withDirectives)((0,t.createElementVNode)(`div`,null,[(0,t.renderSlot)(e.$slots,`top`,{delta:(0,t.unref)(f).delta},()=>[(0,t.createVNode)(y,{class:`flash-card__indicator`,style:(0,t.normalizeStyle)({opacity:Math.abs((0,t.unref)(f).delta)})},null,8,[`style`])],!0)],512),[[t.vShow,(0,t.unref)(f).type===(0,t.unref)(O).TOP&&e.direction?.includes(`top`)]]),(0,t.withDirectives)((0,t.createElementVNode)(`div`,null,[(0,t.renderSlot)(e.$slots,`left`,{delta:(0,t.unref)(f).delta},()=>[(0,t.createVNode)(C,{class:`flash-card__indicator`,style:(0,t.normalizeStyle)({opacity:Math.abs((0,t.unref)(f).delta)})},null,8,[`style`])],!0)],512),[[t.vShow,(0,t.unref)(f).type===(0,t.unref)(O).LEFT&&e.direction?.includes(`left`)]]),(0,t.withDirectives)((0,t.createElementVNode)(`div`,null,[(0,t.renderSlot)(e.$slots,`right`,{delta:(0,t.unref)(f).delta},()=>[(0,t.createVNode)(y,{class:`flash-card__indicator`,style:(0,t.normalizeStyle)({opacity:Math.abs((0,t.unref)(f).delta)})},null,8,[`style`])],!0)],512),[[t.vShow,(0,t.unref)(f).type===(0,t.unref)(O).RIGHT&&e.direction?.includes(`right`)]]),(0,t.withDirectives)((0,t.createElementVNode)(`div`,null,[(0,t.renderSlot)(e.$slots,`bottom`,{delta:(0,t.unref)(f).delta},()=>[(0,t.createVNode)(C,{class:`flash-card__indicator`,style:(0,t.normalizeStyle)({opacity:Math.abs((0,t.unref)(f).delta)})},null,8,[`style`])],!0)],512),[[t.vShow,(0,t.unref)(f).type===(0,t.unref)(O).BOTTOM&&e.direction?.includes(`bottom`)]])],6)])],6))}}),L=h(I,[[`__scopeId`,`data-v-28f9555f`]]);function R(e){let n=(0,t.computed)(()=>{let n=(0,t.toValue)(e);return n===void 0?{}:typeof n==`boolean`?{enabled:n}:n}),r=(0,t.computed)(()=>n.value.enabled??m.enabled),i=(0,t.computed)(()=>r.value&&(n.value.keyboard??m.keyboard)),a=(0,t.computed)(()=>n.value.confirmOnKey??m.confirmOnKey),o=(0,t.computed)(()=>r.value&&(n.value.manageFocus??m.manageFocus)),s=(0,t.computed)(()=>n.value.liveMode??m.liveMode),c=(0,t.computed)(()=>({...m.labels,...n.value.labels})),l=(0,t.ref)(``);function u(e){let{type:t,action:n,remaining:r,labels:i}=e,a=`${r} remaining`;if(t===`empty`)return i.empty;if(t===`restore`)return`${i.card} ${i.restore}, ${a}`;let o=n?i[n]??n:``;return`${i.card} ${o}, ${a}`}function d(e,t,i){if(!r.value)return;let a={type:e,action:i,remaining:t,labels:c.value},o=n.value.announce?n.value.announce(a):u(a);o&&(l.value=``,Promise.resolve().then(()=>{l.value=o}))}function f(e,t){return`${c.value.card} ${e+1} ${t?`of ${t}`:``}`.trim()}return{enabled:r,keyboard:i,confirmOnKey:a,manageFocus:o,liveMode:s,labels:c,announcement:l,announce:d,cardLabel:f}}function ee(e,t){let n={ArrowUp:`top`,ArrowDown:`bottom`,ArrowLeft:`left`,ArrowRight:`right`}[e];return n&&t.includes(n)?n:null}let z=Symbol(`flashcardsConfig`),B=Symbol(`flipCardConfig`);function V(e,n){return(0,t.computed)(()=>({...e,...Object.fromEntries(Object.entries((0,t.toValue)(n)).filter(([e,t])=>t!==void 0))}))}function H(e){let n=(0,t.inject)(z,{});return V(n,e)}function U(e){let n=(0,t.inject)(B,{});return V(n,e)}function W(e){let n=(0,t.computed)(()=>(0,t.toValue)(e)),r=(0,t.reactive)(new Map),i=(0,t.reactive)(new Map),a=(0,t.ref)(0),o=(0,t.computed)(()=>r.size>0);function s(e,t){if(!e)return t;let r=n.value.itemKey||`id`;return e[r]??t}let c=(0,t.computed)(()=>{let{items:e}=n.value,t=new Map;for(let n=0;n<e.length;n++)t.set(s(e[n],n),n);return t});function l(e){return c.value.get(e)??-1}function u(e){if(i.has(e))return!0;let t=r.get(e);return t?.state===`swiping`&&!d(t)}function d(e){return e.cycle!==void 0&&e.cycle!==a.value}let f=(0,t.ref)(null);function p(e){let{items:t}=n.value;for(let n=Math.max(0,e);n<t.length;n++)if(!u(s(t[n],n)))return n;return t.length}let m=(0,t.computed)(()=>{let e=f.value===null?0:l(f.value);return p(e===-1?0:e)}),h=(0,t.computed)(()=>{let{items:e}=n.value;return s(e[m.value],m.value)});function g(){let{items:e}=n.value,t=m.value;f.value=t<e.length?s(e[t],t):null}let _=new Map;function v(e,t){let r=_.get(e);if(r&&r.rec.state===t.state&&r.rec.action===t.action&&r.rec.initialPosition===t.initialPosition)return r.stackItem;let i=l(e),a={item:n.value.items[i],itemId:e,stackIndex:0,isAnimating:!0,flight:{type:t.action,isRestoring:t.state===`restoring`,initialPosition:t.initialPosition}};return _.set(e,{rec:t,stackItem:a}),a}let y=(0,t.computed)(()=>{let e=[];for(let[t,n]of r){if(d(n)&&t===h.value)continue;l(t)!==-1&&e.push(v(t,n))}if(_.size>r.size)for(let e of _.keys())r.has(e)||_.delete(e);return e}),b=(0,t.computed)(()=>{let e=0;for(let t of r.values())t.state===`restoring`&&e++;return e}),x=(0,t.computed)(()=>m.value-b.value);(0,t.watch)(x,e=>{let{loop:t,items:r,onLoop:o}=n.value;t&&e===r.length&&(i.clear(),f.value=null,a.value++,o?.())});function S(e,t,n,r){let i=[],a=n.length,o=new Set;for(let e of y.value)i.push(e),o.add(e.itemId);for(let c=0;c<t;c++){let t=r?(e+c+a)%a:e+c;if(!r&&t>=a)break;let l=n[t],u=s(l,t);o.has(u)||i.push({item:l,itemId:u,stackIndex:c,isAnimating:!1})}return i}let C=(0,t.computed)(()=>{let{renderLimit:e,items:t,loop:r=!1}=n.value;return t.length?S(m.value,e,t,r):[]}),w=(0,t.computed)(()=>x.value===0),T=(0,t.computed)(()=>x.value>=n.value.items.length),E=(0,t.computed)(()=>{if(n.value.items.length<=1||x.value===0)return!1;let{items:e}=n.value;for(let t=x.value-1;t>=0;t--){let n=s(e[t],t),a=r.get(n);if(i.has(n)||a?.state===`swiping`&&!d(a))return!0}return!1});function D(e,t,s){let{items:c,waitAnimationEnd:u}=n.value;if(o.value&&u)return;let d=l(e);if(d===-1)return;let f=c[d];return r.set(e,{state:`swiping`,action:t,initialPosition:s,cycle:a.value}),i.delete(e),g(),f}function O(e){let t;for(let[e,n]of r)n.state===`restoring`&&(t=e);if(t!==void 0)return D(t,e);let n=h.value;if(l(n)!==-1&&!r.has(n))return D(n,e)}function k(){if(!E.value)return;let{items:e}=n.value;for(let t=x.value-1;t>=0;t--){let n=s(e[t],t),a=r.get(n);if(a?.state===`restoring`)continue;let o=a?.state===`swiping`?a.action:i.get(n);if(o)return r.set(n,{state:`restoring`,action:o,initialPosition:a?.initialPosition}),e[t]}}function A(e){let t=r.get(e);t&&(t.state===`restoring`?(r.delete(e),i.delete(e),M(e)):t.state===`swiping`&&(d(t)?r.delete(e):j(e,t),g()))}function j(e,t){r.delete(e),i.set(e,t.action)}function M(e){f.value=e}async function N(e){if(e?.animate){let t=[...i.keys()];for(let n=0;n<t.length;n++)k()&&await new Promise(t=>setTimeout(t,e?.delay??90))}else r.clear(),i.clear(),f.value=null}return{history:i,currentIndex:m,isStart:w,isEnd:T,canRestore:E,stackList:C,swipeCard:D,swipeActive:O,restoreCard:k,removeAnimatingCard:A,reset:N,hasCardsInTransition:o,currentItemId:h,cardsInTransition:y}}var G=[`role`,`aria-roledescription`,`aria-label`,`tabindex`,`aria-keyshortcuts`],K=[`aria-live`],te={key:1,class:`flashcards__sr-only`},ne={key:`empty-state`,class:`flashcards-empty-state`},re=[`data-item-id`,`data-active-card`,`role`,`aria-roledescription`,`aria-label`,`aria-hidden`,`tabindex`],q=(0,t.defineComponent)({__name:`FlashCards`,props:(0,t.mergeDefaults)({items:{},swipeDirection:{},loop:{type:Boolean},renderLimit:{},stack:{},stackOffset:{},stackScale:{},stackDirection:{},itemKey:{},waitAnimationEnd:{type:Boolean},a11y:{type:[Object,Boolean]},disableDrag:{type:Boolean},maxRotation:{},transformStyle:{type:Function},flight:{},animation:{},swipeThreshold:{},dragThreshold:{},maxDragY:{},maxDragX:{},initialPosition:{},resistance:{},velocity:{}},{items:()=>[],...d}),emits:[`swipeTop`,`swipeLeft`,`swipeRight`,`swipeBottom`,`restore`,`skip`,`loop`,`dragstart`,`dragmove`,`dragend`],setup(e,{expose:n,emit:r}){let i=e,a=r,o=(0,t.computed)(()=>{let{items:e,swipeDirection:t,loop:n,renderLimit:r,stack:a,stackOffset:o,stackScale:s,stackDirection:c,itemKey:l,waitAnimationEnd:u,a11y:d,...f}=i;return f}),s=(0,t.ref)(0),c=H(()=>i),l=(0,t.computed)(()=>i.swipeDirection===`horizontal`?[`left`,`right`]:i.swipeDirection===`vertical`?[`top`,`bottom`]:Array.isArray(i.swipeDirection)?i.swipeDirection:[`left`,`right`]),d=(0,t.computed)(()=>{let e=c.value.stack>0?c.value.stack+2:c.value.renderLimit;return Math.max(e,1)}),{currentIndex:f,isEnd:p,isStart:m,canRestore:h,stackList:g,hasCardsInTransition:_,swipeCard:v,swipeActive:y,restoreCard:b,removeAnimatingCard:x,reset:S,currentItemId:C}=W(()=>({...c.value,items:i.items,renderLimit:d.value,swipeDirection:l.value,onLoop:()=>a(`loop`)})),{getCardStyle:w}=u(()=>({...c.value,swipeDirection:l.value})),T=R(()=>i.a11y),{announce:E}=T,D=(0,t.computed)(()=>Math.max(i.items.length-f.value,0)),k=(0,t.useTemplateRef)(`deck`),A=(0,t.ref)(null);function j(e,t,n){e===C.value&&!t&&(A.value=n)}let M=(0,t.computed)(()=>i.disableDrag||c.value.waitAnimationEnd&&_.value);function N(e,t){e===O.TOP?a(`swipeTop`,t):e===O.LEFT?a(`swipeLeft`,t):e===O.RIGHT?a(`swipeRight`,t):e===O.BOTTOM?a(`swipeBottom`,t):e===O.SKIP&&a(`skip`,t)}function P(e,t,n={x:0,y:0,delta:0,type:null}){let r=v(e,t,n);r&&(N(t,r),F(t))}function F(e){(0,t.nextTick)(()=>{p.value?E(`empty`,D.value):E(`swipe`,D.value,e)})}function I(e,t,n){a(`dragmove`,e,t,n)}function z(e){let t=y(e);t&&(N(e,t),F(e))}function B(){if(_.value&&c.value.waitAnimationEnd)return;let e=b();return e&&(a(`restore`,e),(0,t.nextTick)(()=>E(`restore`,D.value))),e}let V=()=>z(O.TOP),U=()=>z(O.LEFT),q=()=>z(O.RIGHT),J=()=>z(O.BOTTOM),ie=e=>z(e),Y=()=>z(O.SKIP);function X(e,t){A.value?.peek(e,t)}let Z=(0,t.ref)(null),Q=(0,t.computed)(()=>{let e=l.value;return e.includes(`right`)?`right`:e[0]??`right`});function $(){Z.value&&=(X(0,Z.value),null)}function ae(e){if(!T.keyboard.value||p.value)return;let t=ee(e.key,l.value);if(e.key===`Backspace`||e.key===`z`||e.key===`Z`){h.value&&(e.preventDefault(),$(),B());return}if(e.key===`Escape`){Z.value&&(e.preventDefault(),$());return}if(e.key===`Enter`||e.key===` `||e.key===`Spacebar`){e.preventDefault();let t=Z.value??Q.value;Z.value=null,z(t);return}t&&(e.preventDefault(),T.confirmOnKey.value?Z.value===t?(Z.value=null,z(t)):(Z.value=t,X(1,t)):z(t))}function oe(){return!!k.value&&k.value.contains(document.activeElement)}function se(){!T.manageFocus.value||!oe()||(0,t.nextTick)(()=>{let e=k.value?.querySelector(`[data-active-card="true"]`);e?e.focus():k.value?.focus()})}return(0,t.watch)(C,()=>se()),n({swipe:ie,swipeTop:V,swipeLeft:U,swipeRight:q,swipeBottom:J,skip:Y,restore:B,reset:S,peek:X,canRestore:h,isEnd:p,isStart:m}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,null,[(0,t.createElementVNode)(`div`,{ref:`deck`,class:`flashcards`,style:(0,t.normalizeStyle)({height:s.value?`${s.value}px`:`auto`}),role:(0,t.unref)(T).enabled.value?`group`:void 0,"aria-roledescription":(0,t.unref)(T).enabled.value?(0,t.unref)(T).labels.value.deck:void 0,"aria-label":(0,t.unref)(T).enabled.value?(0,t.unref)(T).labels.value.deck:void 0,tabindex:(0,t.unref)(T).enabled.value&&(0,t.unref)(T).keyboard.value?0:void 0,"aria-keyshortcuts":(0,t.unref)(T).enabled.value&&(0,t.unref)(T).keyboard.value?`ArrowLeft ArrowRight ArrowUp ArrowDown Enter`:void 0,onKeydown:ae},[(0,t.unref)(T).enabled.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`flashcards__sr-only`,"aria-live":(0,t.unref)(T).liveMode.value,"aria-atomic":`true`,role:`status`},(0,t.toDisplayString)((0,t.unref)(T).announcement.value),9,K)):(0,t.createCommentVNode)(``,!0),(0,t.unref)(T).enabled.value&&(0,t.unref)(T).keyboard.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,te,(0,t.toDisplayString)((0,t.unref)(T).labels.value.instructions),1)):(0,t.createCommentVNode)(``,!0),!e.loop&&(0,t.unref)(f)>=e.items.length-1?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,ne,[(0,t.renderSlot)(e.$slots,`empty`,{reset:(0,t.unref)(S)},()=>[n[1]||=(0,t.createTextVNode)(` No more cards! `,-1)],!0)])):(0,t.createCommentVNode)(``,!0),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)((0,t.unref)(g),({item:r,itemId:i,stackIndex:c,isAnimating:u,flight:d},p)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:`card-${i}`,"data-item-id":i,"data-active-card":(0,t.unref)(T).enabled.value&&i===(0,t.unref)(C)&&!u?`true`:void 0,class:(0,t.normalizeClass)([`flashcards__card-wrapper`,{"flashcards__card-wrapper--animating":u}]),style:(0,t.normalizeStyle)([{zIndex:u?(0,t.unref)(g).length*2+p:(0,t.unref)(g).length-p},(0,t.unref)(w)(c)]),role:(0,t.unref)(T).enabled.value?`group`:void 0,"aria-roledescription":(0,t.unref)(T).enabled.value?(0,t.unref)(T).labels.value.card:void 0,"aria-label":(0,t.unref)(T).enabled.value?(0,t.unref)(T).cardLabel((0,t.unref)(f),e.items.length):void 0,"aria-hidden":(0,t.unref)(T).enabled.value&&!(i===(0,t.unref)(C)&&!u)?`true`:void 0,tabindex:(0,t.unref)(T).enabled.value&&i===(0,t.unref)(C)&&!u?-1:void 0},[(0,t.createVNode)(L,(0,t.mergeProps)({ref_for:!0,ref:e=>j(i,u,e)},{ref_for:!0},o.value,{direction:l.value,class:[`flashcards__card`,{"flashcards__card--active":i===(0,t.unref)(C)&&!u,"flashcards__card--animating":u}],flight:u?d:void 0,"disable-drag":M.value||u,onComplete:(e,t)=>P(i,e,t),onMounted:n[0]||=e=>s.value=Math.max(e,0),onAnimationend:()=>(0,t.unref)(x)(i),onDragstart:e=>a(`dragstart`,r),onDragmove:(e,t)=>I(r,e,t),onDragend:e=>a(`dragend`,r)}),{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(e.$slots,`default`,{item:r,activeItemKey:(0,t.unref)(C)},void 0,!0)]),top:(0,t.withCtx)(n=>[e.$slots.top?(0,t.renderSlot)(e.$slots,`top`,{key:0,item:r,delta:n.delta},void 0,!0):(0,t.createCommentVNode)(``,!0)]),bottom:(0,t.withCtx)(n=>[e.$slots.bottom?(0,t.renderSlot)(e.$slots,`bottom`,{key:0,item:r,delta:n.delta},void 0,!0):(0,t.createCommentVNode)(``,!0)]),left:(0,t.withCtx)(n=>[e.$slots.left?(0,t.renderSlot)(e.$slots,`left`,{key:0,item:r,delta:n.delta},void 0,!0):(0,t.createCommentVNode)(``,!0)]),right:(0,t.withCtx)(n=>[e.$slots.right?(0,t.renderSlot)(e.$slots,`right`,{key:0,item:r,delta:n.delta},void 0,!0):(0,t.createCommentVNode)(``,!0)]),_:2},1040,[`direction`,`class`,`flight`,`disable-drag`,`onComplete`,`onAnimationend`,`onDragstart`,`onDragmove`,`onDragend`])],14,re))),128))],44,G),(0,t.renderSlot)(e.$slots,`actions`,{restore:B,skip:Y,reset:(0,t.unref)(S),swipeTop:V,swipeLeft:U,swipeRight:q,swipeBottom:J,isEnd:(0,t.unref)(p),isStart:(0,t.unref)(m),canRestore:(0,t.unref)(h)},void 0,!0)]))}}),J=h(q,[[`__scopeId`,`data-v-e9a18173`]]);let ie={disabled:void 0,waitAnimationEnd:!0,flipAxis:`y`};var Y={class:`flip-card__front`},X={class:`flip-card__back`},Z=(0,t.defineComponent)({__name:`FlipCard`,props:(0,t.mergeDefaults)({disabled:{type:Boolean},waitAnimationEnd:{type:Boolean},flipAxis:{}},ie),emits:[`flip`],setup(e,{expose:n,emit:r}){let i=e,a=r,o=U(()=>i),s=(0,t.inject)(M,(0,t.ref)(!1)),c=(0,t.ref)(!1),l=(0,t.ref)(!1);function u(){o.value.disabled||s.value||o.value.waitAnimationEnd&&l.value||(l.value=!0,c.value=!c.value,a(`flip`,c.value))}function d(){l.value=!1}return n({flip:u}),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`flip-card`,onPointerup:u},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`flip-card__inner`,[`flip-card__inner--${(0,t.unref)(o).flipAxis}`,{"flip-card__inner--flipped":c.value}]]),onTransitionend:d},[(0,t.createElementVNode)(`div`,Y,[(0,t.renderSlot)(e.$slots,`front`,{flip:u},void 0,!0)]),(0,t.createElementVNode)(`div`,X,[(0,t.renderSlot)(e.$slots,`back`,{flip:u},void 0,!0)])],34)],32))}}),Q=h(Z,[[`__scopeId`,`data-v-d01483e2`]]);function $(e,t={}){let{flashCards:n={},flipCard:r={},registerComponents:i=!0}=t;e.provide(z,n),e.provide(B,r),i&&(e.component(`FlashCards`,J),e.component(`FlipCard`,Q))}exports.FlashCards=J,exports.FlashCardsConfigKey=z,exports.FlashCardsPlugin=$,exports.FlipCard=Q,exports.FlipCardConfigKey=B,exports.defaultAnimationKeyframes=D});