@simhub2/justflipit 3.2.2 → 4.0.1

package/dist/justFlipIt-vanilla.min.js

@@ -1 +1,23 @@
-(function(root,factory){if(typeof define==="function"&&define.amd){define([],factory)}else if(typeof module==="object"&&module.exports){module.exports=factory()}else{root.justFlipIt=factory()}})(typeof self!=="undefined"?self:this,function(){"use strict";function addStyles(){if(document.querySelector('[data-justflipitstyle="justFlipIt_One"]')){return}const styleX=document.createElement("style");styleX.setAttribute("data-justflipitstyle","justFlipIt_One");styleX.textContent="._justFlipIt_panel {perspective:1000px;-webkit-perspective:1000px;-moz-perspective:1000px;}"+"._justFlipIt_panel .front{height:inherit;width:inherit;position:absolute;top:0;z-index:900;-webkit-transform:rotateX(0) rotateX(0);-moz-transform:rotateX(0) rotateX(0);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}"+"._justFlipIt_panel .back{height:inherit;width:inherit;position:absolute;top:0;z-index:1000;-webkit-transform:rotateX(-180deg);-moz-transform:rotateX(-180deg);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}"+"._justFlipIt_panel._flip_ .front{z-index:900;-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg)}"+"._justFlipIt_panel._flip_ .back{z-index:1000;-webkit-transform:rotateX(0) rotateX(0);-moz-transform:rotateX(0) rotateX(0)}";const styleY=document.createElement("style");styleY.setAttribute("data-justflipitstyle","justFlipIt_Two");styleY.textContent="._justFlipIt_panel .backY{height:inherit;width:inherit;position:absolute;top:0;z-index:1000;-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}"+"._justFlipIt_panel._flipY_ .front{z-index:900;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg)}"+"._justFlipIt_panel._flipY_ .backY{z-index:1000;-webkit-transform:rotateX(0) rotateY(0);-moz-transform:rotateX(0) rotateY(0)}";const styleTransparent=document.createElement("style");styleTransparent.setAttribute("data-justflipitstyle","justFlipIt_Transparent");styleTransparent.textContent="._justFlipIt_panel {background: transparent !important; box-shadow: none !important;}"+"._justFlipIt_panel > * {box-sizing: border-box;}";document.head.appendChild(styleX);document.head.appendChild(styleY);document.head.appendChild(styleTransparent)}function getStyle(element,property){return window.getComputedStyle(element,null).getPropertyValue(property)}function addClass(element,className){if(element.classList){element.classList.add(className)}else{element.className+=" "+className}}function removeClass(element,className){if(element.classList){element.classList.remove(className)}else{element.className=element.className.replace(new RegExp("(^|\\b)"+className.split(" ").join("|")+"(\\b|$)","gi")," ")}}function toggleClass(element,className){if(element.classList){element.classList.toggle(className)}else{var classes=element.className.split(" ");var existingIndex=classes.indexOf(className);if(existingIndex>=0){classes.splice(existingIndex,1)}else{classes.push(className)}element.className=classes.join(" ")}}function hasClass(element,className){if(element.classList){return element.classList.contains(className)}else{return new RegExp("(^| )"+className+"( |$)","gi").test(element.className)}}function copyStyles(src,dest){const computed=window.getComputedStyle(src);const properties=["background","backgroundColor","backgroundImage","backgroundPosition","backgroundRepeat","backgroundSize","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","border","borderTop","borderRight","borderBottom","borderLeft","boxShadow","color","opacity"];properties.forEach(prop=>{if(computed[prop]&&computed[prop]!=="none"&&computed[prop]!=="initial"&&computed[prop]!==""){dest.style[prop]=computed[prop]}})}function applyAnimationSettings(element,duration,easing){const transitionValue=`all ${duration/1e3}s ${easing}`;element.style.transition=transitionValue;element.style.WebkitTransition=transitionValue;element.style.MozTransition=transitionValue;element.style.msTransition=transitionValue;element.style.OTransition=transitionValue}const instanceMap=new WeakMap;class JustFlipIt{constructor(element,options={}){addStyles();this.element=element;this.settings=Object.assign({},{Template:"",Click:false,FlipX:false,Style:[],Duration:400,Easing:"ease-in-out",preserveClasses:true,preserveStyles:true},options);this.elementWidth=getStyle(element,"width");this.elementHeight=getStyle(element,"height");this.elementBackgroundColor=getStyle(element,"background-color");this.originalClassName=element.className;this.originalTagName=element.tagName.toLowerCase();this.originalId=element.id||"";if(this.settings.FlipX===true){this.flipClass="_flip_";this.backClass="back"}else{this.flipClass="_flipY_";this.backClass="backY"}this._init();if(this.settings.Tilt){this._setupTilt()}instanceMap.set(element,this)}_init(){const originalElement=this.element;const originalClassName=this.originalClassName;const hoverPanel=document.createElement(this.originalTagName);addClass(hoverPanel,"hover");addClass(hoverPanel,"_justFlipIt_panel");const frontWrapper=document.createElement("div");addClass(frontWrapper,"front");const backWrapper=document.createElement("div");addClass(backWrapper,this.backClass);if(this.settings.preserveClasses&&originalElement.classList.length){originalElement.classList.forEach(cls=>{if(!hoverPanel.classList.contains(cls)){hoverPanel.classList.add(cls)}if(frontWrapper&&!frontWrapper.classList.contains(cls)){frontWrapper.classList.add(cls)}if(backWrapper&&!backWrapper.classList.contains(cls)){backWrapper.classList.add(cls)}})}if(this.settings.preserveStyles&&originalElement.getAttribute("style")){hoverPanel.setAttribute("style",(hoverPanel.getAttribute("style")||"")+";"+originalElement.getAttribute("style"))}frontWrapper.innerHTML=originalElement.innerHTML;if(this.settings.Template){backWrapper.innerHTML=this.settings.Template}else{backWrapper.innerHTML=originalElement.innerHTML}originalElement.parentNode.insertBefore(hoverPanel,originalElement);hoverPanel.appendChild(frontWrapper);hoverPanel.appendChild(backWrapper);originalElement.parentNode.removeChild(originalElement);hoverPanel.style.width=this.elementWidth;hoverPanel.style.height=this.elementHeight;if(this.settings.Style&&this.settings.Style.length){this.settings.Style.forEach(styleObj=>{if(styleObj.el){if(styleObj.el.toLowerCase()==="self"){Object.assign(hoverPanel.style,styleObj.style)}else{const targetElements=hoverPanel.querySelectorAll(styleObj.el);targetElements.forEach(el=>{Object.assign(el.style,styleObj.style)})}}})}this._setupEvents(hoverPanel);this.hoverPanel=hoverPanel;this.frontWrapper=frontWrapper;this.backWrapper=backWrapper}_setupTilt(){const handleMove=e=>{const rect=this.hoverPanel.getBoundingClientRect();const x=(e.touches?e.touches[0].clientX:e.clientX)-rect.left;const y=(e.touches?e.touches[0].clientY:e.clientY)-rect.top;const centerX=rect.width/2;const centerY=rect.height/2;const rotateX=(y-centerY)/centerY*10;const rotateY=-(x-centerX)/centerX*10;this.hoverPanel.style.transform=`perspective(1000px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) scale3d(1.05, 1.05, 1.05)`};const handleEnter=()=>{this.hoverPanel.style.transition="all 0.2s ease-out"};const handleLeave=()=>{this.hoverPanel.style.transform=`perspective(1000px) rotateX(0) rotateY(0) scale3d(1, 1, 1)`;this.hoverPanel.style.transition="all 0.5s ease-in-out"};this.hoverPanel.addEventListener("mousemove",handleMove);this.hoverPanel.addEventListener("touchmove",handleMove);this.hoverPanel.addEventListener("mouseenter",handleEnter);this.hoverPanel.addEventListener("touchstart",handleEnter);this.hoverPanel.addEventListener("mouseleave",handleLeave);this.hoverPanel.addEventListener("touchend",handleLeave)}_setupEvents(hoverPanel){if(this.settings.Tilt==="only")return;if(this.settings.Click===true){hoverPanel.addEventListener("click",e=>{e.preventDefault();toggleClass(hoverPanel,this.flipClass)})}else if(typeof this.settings.Click==="string"){const clickElements=hoverPanel.querySelectorAll(this.settings.Click);clickElements.forEach(el=>{el.addEventListener("click",()=>{toggleClass(hoverPanel,this.flipClass)})})}else{hoverPanel.addEventListener("mouseenter",()=>{addClass(hoverPanel,this.flipClass)});hoverPanel.addEventListener("mouseleave",()=>{removeClass(hoverPanel,this.flipClass)})}}destroy(){const hoverPanel=this.hoverPanel;const originalElement=hoverPanel.querySelector(".front > *");originalElement.className=this.originalClassName;hoverPanel.parentNode.insertBefore(originalElement,hoverPanel);hoverPanel.parentNode.removeChild(hoverPanel);instanceMap.delete(this.element)}}function justFlipIt(selector,options={}){if(typeof selector==="string"){const elements=document.querySelectorAll(selector);return Array.from(elements).map(el=>new JustFlipIt(el,options))}else if(selector instanceof Element){return new JustFlipIt(selector,options)}else if(selector.length){return Array.from(selector).map(el=>new JustFlipIt(el,options))}}justFlipIt.destroy=function(selector){if(typeof selector==="string"){const elements=document.querySelectorAll(selector);Array.from(elements).forEach(el=>{const instance=instanceMap.get(el);if(instance)instance.destroy()})}else if(selector instanceof Element){const instance=instanceMap.get(selector);if(instance)instance.destroy()}else if(selector.length){Array.from(selector).forEach(el=>{const instance=instanceMap.get(el);if(instance)instance.destroy()})}};return justFlipIt});
+var JustFlipItModule=(()=>{var d=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var b=(i,t)=>{for(var e in t)d(i,e,{get:t[e],enumerable:!0})},_=(i,t,e,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of T(t))!v.call(i,s)&&s!==e&&d(i,s,{get:()=>t[s],enumerable:!(a=g(t,s))||a.enumerable});return i};var w=i=>_(d({},"__esModule",{value:!0}),i);var I={};b(I,{FlipController:()=>c,default:()=>h});var n=new WeakMap,k={Click:!1,FlipX:!1,Duration:400,Easing:"cubic-bezier(.22,.61,.36,1)",Tilt:!1,Effect:"flip",ReducedMotion:!0,preserveClasses:!0,preserveStyles:!0,Style:[]},F=`
+._justFlipIt_panel{position:relative;display:grid;perspective:var(--jfi-perspective,1000px);isolation:isolate}
+._justFlipIt_panel>[data-jfi-face]{grid-area:1/1;min-width:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform var(--jfi-duration) var(--jfi-easing),opacity var(--jfi-duration) var(--jfi-easing);transform-origin:center}
+._justFlipIt_panel>[data-jfi-face=back],._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=front]{pointer-events:none}
+._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=back]{pointer-events:auto}
+._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=front]{transform:rotateY(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=back]{transform:rotateY(-180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateY(180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateY(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=front]{transform:rotateX(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=back]{transform:rotateX(-180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateX(180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateX(0deg)}
+._justFlipIt_panel[data-jfi-effect=fade]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back]{opacity:0}
+._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=front],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{opacity:0}
+._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{opacity:1}
+._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{transform:scale(.94)}
+._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{transform:scale(1)}
+._justFlipIt_panel[data-jfi-reduced=true]>[data-jfi-face]{transition:none!important}
+@media(prefers-reduced-motion:reduce){._justFlipIt_panel:not([data-jfi-motion=allow])>[data-jfi-face]{transition:none!important}}
+`;function E(i){if(i.querySelector('style[data-justflipitstyle="v4"]'))return;let t=i.createElement("style");t.dataset.justflipitstyle="v4",t.textContent=F,i.head.append(t)}function j(i){if(i.Duration!==void 0&&(!Number.isFinite(i.Duration)||i.Duration<0))throw new TypeError("Duration must be a non-negative finite number");if(i.Effect!==void 0&&!["flip","fade","scale"].includes(i.Effect))throw new TypeError("Unknown Effect");if(i.Tilt&&typeof i.Tilt=="object"){for(let t of["max","perspective","scale"])if(i.Tilt[t]!==void 0&&(!Number.isFinite(i.Tilt[t])||i.Tilt[t]<0))throw new TypeError(`Invalid Tilt.${t}`)}}var c=class{constructor(t,e={}){if(j(e),!t||t.nodeType!==1)throw new TypeError("Expected an HTML element");this.element=t,this.settings={...k,...e},this.flipped=!1,this.destroyed=!1,this.cleanups=[],this.restores=[],this.win=t.ownerDocument.defaultView;let a=t.ownerDocument;if(E(a),this.managed=!!e.Faces,this.managed){if(this.hoverPanel=t,this.frontWrapper=t.querySelector(e.Faces.front),this.backWrapper=t.querySelector(e.Faces.back),!this.frontWrapper||!this.backWrapper||this.frontWrapper===this.backWrapper||this.frontWrapper.parentNode!==t||this.backWrapper.parentNode!==t)throw new TypeError("Faces must select two distinct direct children")}else{if(!t.parentNode)throw new TypeError("Element must have a parent");if(this.hoverPanel=a.createElement("div"),this.frontWrapper=a.createElement("div"),this.backWrapper=a.createElement("div"),this.settings.preserveClasses&&(this.hoverPanel.className=t.className),this.settings.preserveStyles&&(this.hoverPanel.style.cssText=t.style.cssText),t.before(this.hoverPanel),this.hoverPanel.append(this.frontWrapper,this.backWrapper),this.frontWrapper.append(t),e.Template!==void 0)this.backWrapper.innerHTML=e.Template;else{let r=t.cloneNode(!0);r.removeAttribute("id"),r.querySelectorAll("[id]").forEach(l=>l.removeAttribute("id")),this.backWrapper.append(r)}}let s=this.hoverPanel;for(let r of[s,this.frontWrapper,this.backWrapper]){let p=(r===s?["class","style","tabindex","data-jfi-axis","data-jfi-effect","data-jfi-motion","data-jfi-flipped","data-jfi-reduced"]:["style","data-jfi-face","aria-hidden","inert"]).map(o=>[o,r.getAttribute(o)]),y=r.inert||!1;this.restores.push(()=>{r.inert=y;for(let[o,u]of p)u===null?r.removeAttribute(o):r.setAttribute(o,u)})}s.classList.add("_justFlipIt_panel"),this.frontWrapper.dataset.jfiFace="front",this.backWrapper.dataset.jfiFace="back",this.motion=this.win.matchMedia?.("(prefers-reduced-motion: reduce)");let f=()=>{this.resetTilt(),this.render()};this.motion?.addEventListener("change",f),this.cleanups.push(()=>this.motion?.removeEventListener("change",f)),this.configure(),this.events(),this.render(),n.set(t,this),n.set(s,this)}listen(t,e,a){this.hoverPanel.addEventListener(t,e,a),this.cleanups.push(()=>this.hoverPanel.removeEventListener(t,e,a))}get reduced(){return this.settings.ReducedMotion!==!1&&!!this.motion?.matches}configure(){let t=this.settings,e=this.hoverPanel;e.style.setProperty("--jfi-duration",`${t.Duration}ms`),e.style.setProperty("--jfi-easing",t.Easing),e.dataset.jfiAxis=t.FlipX?"x":"y",e.dataset.jfiEffect=t.Effect,e.dataset.jfiMotion=t.ReducedMotion===!1?"allow":"respect";for(let a of t.Style||[])(a.el==="self"?[e]:e.querySelectorAll(a.el)).forEach(f=>Object.assign(f.style,a.style));t.Tilt!=="only"&&!e.hasAttribute("tabindex")&&(e.tabIndex=0)}events(){this.listen("click",t=>{if(this.settings.Tilt==="only")return;let e=this.settings.Click;(e===!0||e&&[].concat(e).some(a=>t.target.closest?.(a)&&this.hoverPanel.contains(t.target.closest(a))))&&this.toggle()}),this.listen("keydown",t=>{t.target!==this.hoverPanel||this.settings.Tilt==="only"||((t.key==="Enter"||t.key===" ")&&(t.preventDefault(),this.toggle()),t.key==="Escape"&&this.flip(!1))}),this.listen("pointerenter",t=>{!this.settings.Click&&this.settings.Tilt!=="only"&&t.pointerType!=="touch"&&this.flip(!0)}),this.listen("pointerleave",t=>{t.pointerType!=="touch"&&(this.resetTilt(),!this.settings.Click&&this.settings.Tilt!=="only"&&this.flip(!1))}),this.listen("pointerdown",t=>{t.pointerType!=="touch"||t.isPrimary===!1||this.touch||(this.resetTilt(),this.touch={id:t.pointerId,x:t.clientX,y:t.clientY,moved:!1},this.queueTilt(t,this.touch))},{passive:!0}),this.listen("pointermove",t=>{if(t.pointerType!=="touch"){this.touch||this.queueTilt(t);return}let e=this.touch;!e||e.id!==t.pointerId||(e.moved||(e.moved=this.touchMoved(t,e)),this.queueTilt(t,e))},{passive:!0}),this.listen("pointerup",t=>{let e=this.finishTouch(t);!e||e.moved||this.touchMoved(t,e)||!this.settings.Click&&this.settings.Tilt!=="only"&&this.toggle()}),this.listen("pointercancel",t=>{t.pointerType==="touch"?this.finishTouch(t):this.resetTilt()}),this.listen("lostpointercapture",t=>this.finishTouch(t)),this.baseTransform=this.hoverPanel.style.transform}touchMoved(t,e){return Math.hypot(t.clientX-e.x,t.clientY-e.y)>10}finishTouch(t){let e=this.touch;if(!(t.pointerType!=="touch"||!e||e.id!==t.pointerId))return this.touch=null,this.resetTilt(),e}queueTilt(t,e){!this.settings.Tilt||this.reduced||(this.point=[t.clientX,t.clientY],!this.frame&&(this.frame=this.win.requestAnimationFrame(()=>{this.frame=0;let a=e?e.rect??(e.rect=this.hoverPanel.getBoundingClientRect()):this.hoverPanel.getBoundingClientRect();if(!a.width||!a.height)return;let{max:s=10,perspective:f=1e3,scale:r=1.03}=this.settings.Tilt,l=Math.max(-1,Math.min(1,(this.point[0]-a.left)/a.width*2-1)),p=Math.max(-1,Math.min(1,(this.point[1]-a.top)/a.height*2-1));this.hoverPanel.style.transform=`perspective(${f}px) rotateX(${-p*s}deg) rotateY(${l*s}deg) scale(${r})`})))}resetTilt(){this.frame&&this.win.cancelAnimationFrame(this.frame),this.frame=0,this.hoverPanel.style.transform=this.baseTransform||""}render(){this.hoverPanel.dataset.jfiFlipped=String(this.flipped),this.hoverPanel.dataset.jfiReduced=String(this.reduced);for(let[t,e]of[[this.frontWrapper,this.flipped],[this.backWrapper,!this.flipped]])t.setAttribute("aria-hidden",String(e)),t.inert=e}flip(t=!0){if(this.destroyed||this.flipped===!!t)return this;let e=this.element.ownerDocument.activeElement;return(t?this.frontWrapper:this.backWrapper).contains(e)&&this.hoverPanel.focus({preventScroll:!0}),this.flipped=!!t,this.render(),this.hoverPanel.dispatchEvent(new this.win.CustomEvent("justflipit:change",{bubbles:!0,detail:this.getState()})),this}toggle(){return this.flip(!this.flipped)}update(t={}){if(this.destroyed)return this;if("Faces"in t)throw new TypeError("Faces cannot change after initialization");if(j(t),this.managed&&"Template"in t)throw new TypeError("Render framework face content with the framework");if(this.settings={...this.settings,...t},"Template"in t){if(this.managed)throw new TypeError("Render framework face content with the framework");this.backWrapper.innerHTML=t.Template}return this.resetTilt(),this.configure(),this.render(),this}getState(){return{flipped:this.flipped,destroyed:this.destroyed,effect:this.settings.Effect}}destroy(){this.destroyed||(this.resetTilt(),this.cleanups.forEach(t=>t()),this.restores.forEach(t=>t()),this.managed||this.hoverPanel.replaceWith(this.element),n.delete(this.element),n.delete(this.hoverPanel),this.destroyed=!0)}};function m(i){return typeof i=="string"?typeof document>"u"?[]:Array.from(document.querySelectorAll(i)):i?.nodeType===1?[i]:i?Array.from(i):[]}function h(i,t){let e=m(i).map(a=>n.get(a)||new c(a,t));return i?.nodeType===1?e[0]:e}h.destroy=i=>m(i).forEach(t=>n.get(t)?.destroy());h.get=i=>n.get(i);return w(I);})();
+globalThis.justFlipIt = JustFlipItModule.default;
+//# sourceMappingURL=justFlipIt.min.js.map

package/dist/justFlipIt.cjs

@@ -0,0 +1,293 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/core.js
+var core_exports = {};
+__export(core_exports, {
+  FlipController: () => FlipController,
+  default: () => justFlipIt
+});
+module.exports = __toCommonJS(core_exports);
+var instances = /* @__PURE__ */ new WeakMap();
+var defaults = { Click: false, FlipX: false, Duration: 400, Easing: "cubic-bezier(.22,.61,.36,1)", Tilt: false, Effect: "flip", ReducedMotion: true, preserveClasses: true, preserveStyles: true, Style: [] };
+var css = `
+._justFlipIt_panel{position:relative;display:grid;perspective:var(--jfi-perspective,1000px);isolation:isolate}
+._justFlipIt_panel>[data-jfi-face]{grid-area:1/1;min-width:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform var(--jfi-duration) var(--jfi-easing),opacity var(--jfi-duration) var(--jfi-easing);transform-origin:center}
+._justFlipIt_panel>[data-jfi-face=back],._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=front]{pointer-events:none}
+._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=back]{pointer-events:auto}
+._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=front]{transform:rotateY(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=back]{transform:rotateY(-180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateY(180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateY(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=front]{transform:rotateX(0deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=back]{transform:rotateX(-180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateX(180deg)}
+._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateX(0deg)}
+._justFlipIt_panel[data-jfi-effect=fade]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back]{opacity:0}
+._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=front],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{opacity:0}
+._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{opacity:1}
+._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{transform:scale(.94)}
+._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{transform:scale(1)}
+._justFlipIt_panel[data-jfi-reduced=true]>[data-jfi-face]{transition:none!important}
+@media(prefers-reduced-motion:reduce){._justFlipIt_panel:not([data-jfi-motion=allow])>[data-jfi-face]{transition:none!important}}
+`;
+function styles(doc) {
+  if (doc.querySelector('style[data-justflipitstyle="v4"]')) return;
+  const style = doc.createElement("style");
+  style.dataset.justflipitstyle = "v4";
+  style.textContent = css;
+  doc.head.append(style);
+}
+function validate(options) {
+  if (options.Duration !== void 0 && (!Number.isFinite(options.Duration) || options.Duration < 0)) throw new TypeError("Duration must be a non-negative finite number");
+  if (options.Effect !== void 0 && !["flip", "fade", "scale"].includes(options.Effect)) throw new TypeError("Unknown Effect");
+  if (options.Tilt && typeof options.Tilt === "object") {
+    for (const key of ["max", "perspective", "scale"]) {
+      if (options.Tilt[key] !== void 0 && (!Number.isFinite(options.Tilt[key]) || options.Tilt[key] < 0)) throw new TypeError(`Invalid Tilt.${key}`);
+    }
+  }
+}
+var FlipController = class {
+  constructor(element, options = {}) {
+    validate(options);
+    if (!element || element.nodeType !== 1) throw new TypeError("Expected an HTML element");
+    this.element = element;
+    this.settings = { ...defaults, ...options };
+    this.flipped = false;
+    this.destroyed = false;
+    this.cleanups = [];
+    this.restores = [];
+    this.win = element.ownerDocument.defaultView;
+    const doc = element.ownerDocument;
+    styles(doc);
+    this.managed = !!options.Faces;
+    if (this.managed) {
+      this.hoverPanel = element;
+      this.frontWrapper = element.querySelector(options.Faces.front);
+      this.backWrapper = element.querySelector(options.Faces.back);
+      if (!this.frontWrapper || !this.backWrapper || this.frontWrapper === this.backWrapper || this.frontWrapper.parentNode !== element || this.backWrapper.parentNode !== element) throw new TypeError("Faces must select two distinct direct children");
+    } else {
+      if (!element.parentNode) throw new TypeError("Element must have a parent");
+      this.hoverPanel = doc.createElement("div");
+      this.frontWrapper = doc.createElement("div");
+      this.backWrapper = doc.createElement("div");
+      if (this.settings.preserveClasses) this.hoverPanel.className = element.className;
+      if (this.settings.preserveStyles) this.hoverPanel.style.cssText = element.style.cssText;
+      element.before(this.hoverPanel);
+      this.hoverPanel.append(this.frontWrapper, this.backWrapper);
+      this.frontWrapper.append(element);
+      if (options.Template !== void 0) this.backWrapper.innerHTML = options.Template;
+      else {
+        const clone = element.cloneNode(true);
+        clone.removeAttribute("id");
+        clone.querySelectorAll("[id]").forEach((node) => node.removeAttribute("id"));
+        this.backWrapper.append(clone);
+      }
+    }
+    const panel = this.hoverPanel;
+    for (const node of [panel, this.frontWrapper, this.backWrapper]) {
+      const owned = node === panel ? ["class", "style", "tabindex", "data-jfi-axis", "data-jfi-effect", "data-jfi-motion", "data-jfi-flipped", "data-jfi-reduced"] : ["style", "data-jfi-face", "aria-hidden", "inert"];
+      const attrs = owned.map((name) => [name, node.getAttribute(name)]);
+      const inert = node.inert || false;
+      this.restores.push(() => {
+        node.inert = inert;
+        for (const [name, value] of attrs) {
+          if (value === null) node.removeAttribute(name);
+          else node.setAttribute(name, value);
+        }
+      });
+    }
+    panel.classList.add("_justFlipIt_panel");
+    this.frontWrapper.dataset.jfiFace = "front";
+    this.backWrapper.dataset.jfiFace = "back";
+    this.motion = this.win.matchMedia?.("(prefers-reduced-motion: reduce)");
+    const motionChange = () => {
+      this.resetTilt();
+      this.render();
+    };
+    this.motion?.addEventListener("change", motionChange);
+    this.cleanups.push(() => this.motion?.removeEventListener("change", motionChange));
+    this.configure();
+    this.events();
+    this.render();
+    instances.set(element, this);
+    instances.set(panel, this);
+  }
+  listen(type, handler, options) {
+    this.hoverPanel.addEventListener(type, handler, options);
+    this.cleanups.push(() => this.hoverPanel.removeEventListener(type, handler, options));
+  }
+  get reduced() {
+    return this.settings.ReducedMotion !== false && !!this.motion?.matches;
+  }
+  configure() {
+    const s = this.settings, p = this.hoverPanel;
+    p.style.setProperty("--jfi-duration", `${s.Duration}ms`);
+    p.style.setProperty("--jfi-easing", s.Easing);
+    p.dataset.jfiAxis = s.FlipX ? "x" : "y";
+    p.dataset.jfiEffect = s.Effect;
+    p.dataset.jfiMotion = s.ReducedMotion === false ? "allow" : "respect";
+    for (const item of s.Style || []) {
+      const targets = item.el === "self" ? [p] : p.querySelectorAll(item.el);
+      targets.forEach((node) => Object.assign(node.style, item.style));
+    }
+    if (s.Tilt !== "only" && !p.hasAttribute("tabindex")) p.tabIndex = 0;
+  }
+  events() {
+    this.listen("click", (event) => {
+      if (this.settings.Tilt === "only") return;
+      const trigger = this.settings.Click;
+      if (trigger === true || trigger && [].concat(trigger).some((selector) => event.target.closest?.(selector) && this.hoverPanel.contains(event.target.closest(selector)))) this.toggle();
+    });
+    this.listen("keydown", (event) => {
+      if (event.target !== this.hoverPanel || this.settings.Tilt === "only") return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.toggle();
+      }
+      if (event.key === "Escape") this.flip(false);
+    });
+    this.listen("pointerenter", (event) => {
+      if (!this.settings.Click && this.settings.Tilt !== "only" && event.pointerType !== "touch") this.flip(true);
+    });
+    this.listen("pointerleave", (event) => {
+      if (event.pointerType === "touch") return;
+      this.resetTilt();
+      if (!this.settings.Click && this.settings.Tilt !== "only") this.flip(false);
+    });
+    this.listen("pointerdown", (event) => {
+      if (event.pointerType !== "touch" || event.isPrimary === false || this.touch) return;
+      this.resetTilt();
+      this.touch = { id: event.pointerId, x: event.clientX, y: event.clientY, moved: false };
+      this.queueTilt(event, this.touch);
+    }, { passive: true });
+    this.listen("pointermove", (event) => {
+      if (event.pointerType !== "touch") {
+        if (!this.touch) this.queueTilt(event);
+        return;
+      }
+      const touch = this.touch;
+      if (!touch || touch.id !== event.pointerId) return;
+      touch.moved || (touch.moved = this.touchMoved(event, touch));
+      this.queueTilt(event, touch);
+    }, { passive: true });
+    this.listen("pointerup", (event) => {
+      const touch = this.finishTouch(event);
+      if (!touch || touch.moved || this.touchMoved(event, touch)) return;
+      if (!this.settings.Click && this.settings.Tilt !== "only") this.toggle();
+    });
+    this.listen("pointercancel", (event) => {
+      if (event.pointerType === "touch") this.finishTouch(event);
+      else this.resetTilt();
+    });
+    this.listen("lostpointercapture", (event) => this.finishTouch(event));
+    this.baseTransform = this.hoverPanel.style.transform;
+  }
+  touchMoved(event, touch) {
+    return Math.hypot(event.clientX - touch.x, event.clientY - touch.y) > 10;
+  }
+  finishTouch(event) {
+    const touch = this.touch;
+    if (event.pointerType !== "touch" || !touch || touch.id !== event.pointerId) return;
+    this.touch = null;
+    this.resetTilt();
+    return touch;
+  }
+  queueTilt(event, touch) {
+    if (!this.settings.Tilt || this.reduced) return;
+    this.point = [event.clientX, event.clientY];
+    if (this.frame) return;
+    this.frame = this.win.requestAnimationFrame(() => {
+      this.frame = 0;
+      const rect = touch ? touch.rect ?? (touch.rect = this.hoverPanel.getBoundingClientRect()) : this.hoverPanel.getBoundingClientRect();
+      if (!rect.width || !rect.height) return;
+      const { max = 10, perspective = 1e3, scale = 1.03 } = this.settings.Tilt;
+      const x = Math.max(-1, Math.min(1, (this.point[0] - rect.left) / rect.width * 2 - 1));
+      const y = Math.max(-1, Math.min(1, (this.point[1] - rect.top) / rect.height * 2 - 1));
+      this.hoverPanel.style.transform = `perspective(${perspective}px) rotateX(${-y * max}deg) rotateY(${x * max}deg) scale(${scale})`;
+    });
+  }
+  resetTilt() {
+    if (this.frame) this.win.cancelAnimationFrame(this.frame);
+    this.frame = 0;
+    this.hoverPanel.style.transform = this.baseTransform || "";
+  }
+  render() {
+    this.hoverPanel.dataset.jfiFlipped = String(this.flipped);
+    this.hoverPanel.dataset.jfiReduced = String(this.reduced);
+    for (const [node, hidden] of [[this.frontWrapper, this.flipped], [this.backWrapper, !this.flipped]]) {
+      node.setAttribute("aria-hidden", String(hidden));
+      node.inert = hidden;
+    }
+  }
+  flip(value = true) {
+    if (this.destroyed || this.flipped === !!value) return this;
+    const active = this.element.ownerDocument.activeElement;
+    if ((value ? this.frontWrapper : this.backWrapper).contains(active)) this.hoverPanel.focus({ preventScroll: true });
+    this.flipped = !!value;
+    this.render();
+    this.hoverPanel.dispatchEvent(new this.win.CustomEvent("justflipit:change", { bubbles: true, detail: this.getState() }));
+    return this;
+  }
+  toggle() {
+    return this.flip(!this.flipped);
+  }
+  update(options = {}) {
+    if (this.destroyed) return this;
+    if ("Faces" in options) throw new TypeError("Faces cannot change after initialization");
+    validate(options);
+    if (this.managed && "Template" in options) throw new TypeError("Render framework face content with the framework");
+    this.settings = { ...this.settings, ...options };
+    if ("Template" in options) {
+      if (this.managed) throw new TypeError("Render framework face content with the framework");
+      this.backWrapper.innerHTML = options.Template;
+    }
+    this.resetTilt();
+    this.configure();
+    this.render();
+    return this;
+  }
+  getState() {
+    return { flipped: this.flipped, destroyed: this.destroyed, effect: this.settings.Effect };
+  }
+  destroy() {
+    if (this.destroyed) return;
+    this.resetTilt();
+    this.cleanups.forEach((fn) => fn());
+    this.restores.forEach((fn) => fn());
+    if (!this.managed) {
+      this.hoverPanel.replaceWith(this.element);
+    }
+    instances.delete(this.element);
+    instances.delete(this.hoverPanel);
+    this.destroyed = true;
+  }
+};
+function elements(target) {
+  if (typeof target === "string") return typeof document === "undefined" ? [] : Array.from(document.querySelectorAll(target));
+  if (target?.nodeType === 1) return [target];
+  return target ? Array.from(target) : [];
+}
+function justFlipIt(target, options) {
+  const result = elements(target).map((element) => instances.get(element) || new FlipController(element, options));
+  return target?.nodeType === 1 ? result[0] : result;
+}
+justFlipIt.destroy = (target) => elements(target).forEach((element) => instances.get(element)?.destroy());
+justFlipIt.get = (element) => instances.get(element);
+module.exports = Object.assign(module.exports.default, module.exports);
+//# sourceMappingURL=justFlipIt.cjs.map

package/dist/justFlipIt.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/core.js"],
+  "sourcesContent": ["const instances = new WeakMap();\nconst defaults = { Click: false, FlipX: false, Duration: 400, Easing: 'cubic-bezier(.22,.61,.36,1)', Tilt: false, Effect: 'flip', ReducedMotion: true, preserveClasses: true, preserveStyles: true, Style: [] };\nconst css = `\n._justFlipIt_panel{position:relative;display:grid;perspective:var(--jfi-perspective,1000px);isolation:isolate}\n._justFlipIt_panel>[data-jfi-face]{grid-area:1/1;min-width:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform var(--jfi-duration) var(--jfi-easing),opacity var(--jfi-duration) var(--jfi-easing);transform-origin:center}\n._justFlipIt_panel>[data-jfi-face=back],._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=front]{pointer-events:none}\n._justFlipIt_panel[data-jfi-flipped=true]>[data-jfi-face=back]{pointer-events:auto}\n._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=front]{transform:rotateY(0deg)}\n._justFlipIt_panel[data-jfi-effect=flip]>[data-jfi-face=back]{transform:rotateY(-180deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateY(180deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateY(0deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=front]{transform:rotateX(0deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x]>[data-jfi-face=back]{transform:rotateX(-180deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=front]{transform:rotateX(180deg)}\n._justFlipIt_panel[data-jfi-effect=flip][data-jfi-axis=x][data-jfi-flipped=true]>[data-jfi-face=back]{transform:rotateX(0deg)}\n._justFlipIt_panel[data-jfi-effect=fade]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back]{opacity:0}\n._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=front],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{opacity:0}\n._justFlipIt_panel[data-jfi-effect=fade][data-jfi-flipped=true]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{opacity:1}\n._justFlipIt_panel[data-jfi-effect=scale]>[data-jfi-face=back],._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=front]{transform:scale(.94)}\n._justFlipIt_panel[data-jfi-effect=scale][data-jfi-flipped=true]>[data-jfi-face=back]{transform:scale(1)}\n._justFlipIt_panel[data-jfi-reduced=true]>[data-jfi-face]{transition:none!important}\n@media(prefers-reduced-motion:reduce){._justFlipIt_panel:not([data-jfi-motion=allow])>[data-jfi-face]{transition:none!important}}\n`;\nfunction styles(doc) {\n  if (doc.querySelector('style[data-justflipitstyle=\"v4\"]')) return;\n  const style = doc.createElement('style');\n  style.dataset.justflipitstyle = 'v4'; style.textContent = css; doc.head.append(style);\n}\nfunction validate(options) {\n  if (options.Duration !== undefined && (!Number.isFinite(options.Duration) || options.Duration < 0)) throw new TypeError('Duration must be a non-negative finite number');\n  if (options.Effect !== undefined && !['flip', 'fade', 'scale'].includes(options.Effect)) throw new TypeError('Unknown Effect');\n  if (options.Tilt && typeof options.Tilt === 'object') {\n    for (const key of ['max', 'perspective', 'scale']) {\n      if (options.Tilt[key] !== undefined && (!Number.isFinite(options.Tilt[key]) || options.Tilt[key] < 0)) throw new TypeError(`Invalid Tilt.${key}`);\n    }\n  }\n}\nexport class FlipController {\n  constructor(element, options = {}) {\n    validate(options);\n    if (!element || element.nodeType !== 1) throw new TypeError('Expected an HTML element');\n    this.element = element; this.settings = { ...defaults, ...options }; this.flipped = false; this.destroyed = false;\n    this.cleanups = []; this.restores = []; this.win = element.ownerDocument.defaultView;\n    const doc = element.ownerDocument; styles(doc);\n    this.managed = !!options.Faces;\n    if (this.managed) {\n      this.hoverPanel = element;\n      this.frontWrapper = element.querySelector(options.Faces.front);\n      this.backWrapper = element.querySelector(options.Faces.back);\n      if (!this.frontWrapper || !this.backWrapper || this.frontWrapper === this.backWrapper || this.frontWrapper.parentNode !== element || this.backWrapper.parentNode !== element) throw new TypeError('Faces must select two distinct direct children');\n    } else {\n      if (!element.parentNode) throw new TypeError('Element must have a parent');\n      this.hoverPanel = doc.createElement('div');\n      this.frontWrapper = doc.createElement('div'); this.backWrapper = doc.createElement('div');\n      if (this.settings.preserveClasses) this.hoverPanel.className = element.className;\n      if (this.settings.preserveStyles) this.hoverPanel.style.cssText = element.style.cssText;\n      element.before(this.hoverPanel); this.hoverPanel.append(this.frontWrapper, this.backWrapper);\n      this.frontWrapper.append(element);\n      if (options.Template !== undefined) this.backWrapper.innerHTML = options.Template;\n      else {\n        const clone = element.cloneNode(true);\n        clone.removeAttribute('id'); clone.querySelectorAll('[id]').forEach(node => node.removeAttribute('id'));\n        this.backWrapper.append(clone);\n      }\n    }\n    const panel = this.hoverPanel;\n    for (const node of [panel, this.frontWrapper, this.backWrapper]) {\n      const owned = node === panel ? ['class', 'style', 'tabindex', 'data-jfi-axis', 'data-jfi-effect', 'data-jfi-motion', 'data-jfi-flipped', 'data-jfi-reduced'] : ['style', 'data-jfi-face', 'aria-hidden', 'inert'];\n      const attrs = owned.map(name => [name, node.getAttribute(name)]);\n      const inert = node.inert || false;\n      this.restores.push(() => { node.inert = inert; for (const [name, value] of attrs) { if (value === null) node.removeAttribute(name); else node.setAttribute(name, value); } });\n    }\n    panel.classList.add('_justFlipIt_panel');\n    this.frontWrapper.dataset.jfiFace = 'front'; this.backWrapper.dataset.jfiFace = 'back';\n    this.motion = this.win.matchMedia?.('(prefers-reduced-motion: reduce)');\n    const motionChange = () => { this.resetTilt(); this.render(); };\n    this.motion?.addEventListener('change', motionChange);\n    this.cleanups.push(() => this.motion?.removeEventListener('change', motionChange));\n    this.configure(); this.events(); this.render();\n    instances.set(element, this); instances.set(panel, this);\n  }\n  listen(type, handler, options) { this.hoverPanel.addEventListener(type, handler, options); this.cleanups.push(() => this.hoverPanel.removeEventListener(type, handler, options)); }\n  get reduced() { return this.settings.ReducedMotion !== false && !!this.motion?.matches; }\n  configure() {\n    const s = this.settings, p = this.hoverPanel;\n    p.style.setProperty('--jfi-duration', `${s.Duration}ms`); p.style.setProperty('--jfi-easing', s.Easing);\n    p.dataset.jfiAxis = s.FlipX ? 'x' : 'y'; p.dataset.jfiEffect = s.Effect;\n    p.dataset.jfiMotion = s.ReducedMotion === false ? 'allow' : 'respect';\n    for (const item of s.Style || []) {\n      const targets = item.el === 'self' ? [p] : p.querySelectorAll(item.el);\n      targets.forEach(node => Object.assign(node.style, item.style));\n    }\n    // A generic keyboard focus target avoids button roles around interactive children.\n    if (s.Tilt !== 'only' && !p.hasAttribute('tabindex')) p.tabIndex = 0;\n  }\n  events() {\n    this.listen('click', event => {\n      if (this.settings.Tilt === 'only') return;\n      const trigger = this.settings.Click;\n      if (trigger === true || (trigger && [].concat(trigger).some(selector => event.target.closest?.(selector) && this.hoverPanel.contains(event.target.closest(selector))))) this.toggle();\n    });\n    this.listen('keydown', event => {\n      if (event.target !== this.hoverPanel || this.settings.Tilt === 'only') return;\n      if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); this.toggle(); }\n      if (event.key === 'Escape') this.flip(false);\n    });\n    this.listen('pointerenter', event => { if (!this.settings.Click && this.settings.Tilt !== 'only' && event.pointerType !== 'touch') this.flip(true); });\n    this.listen('pointerleave', event => {\n      // Touch release also emits pointerleave. The tap must survive it.\n      if (event.pointerType === 'touch') return;\n      this.resetTilt();\n      if (!this.settings.Click && this.settings.Tilt !== 'only') this.flip(false);\n    });\n    this.listen('pointerdown', event => {\n      if (event.pointerType !== 'touch' || event.isPrimary === false || this.touch) return;\n      this.resetTilt();\n      this.touch = { id: event.pointerId, x: event.clientX, y: event.clientY, moved: false };\n      this.queueTilt(event, this.touch);\n    }, { passive: true });\n    this.listen('pointermove', event => {\n      if (event.pointerType !== 'touch') {\n        if (!this.touch) this.queueTilt(event);\n        return;\n      }\n      const touch = this.touch;\n      if (!touch || touch.id !== event.pointerId) return;\n      touch.moved ||= this.touchMoved(event, touch);\n      this.queueTilt(event, touch);\n    }, { passive: true });\n    this.listen('pointerup', event => {\n      const touch = this.finishTouch(event);\n      if (!touch || touch.moved || this.touchMoved(event, touch)) return;\n      // Explicit click triggers continue to use the browser's click event.\n      if (!this.settings.Click && this.settings.Tilt !== 'only') this.toggle();\n    });\n    this.listen('pointercancel', event => {\n      if (event.pointerType === 'touch') this.finishTouch(event);\n      else this.resetTilt();\n    });\n    this.listen('lostpointercapture', event => this.finishTouch(event));\n    this.baseTransform = this.hoverPanel.style.transform;\n  }\n  touchMoved(event, touch) {\n    return Math.hypot(event.clientX - touch.x, event.clientY - touch.y) > 10;\n  }\n  finishTouch(event) {\n    const touch = this.touch;\n    if (event.pointerType !== 'touch' || !touch || touch.id !== event.pointerId) return;\n    this.touch = null;\n    this.resetTilt();\n    return touch;\n  }\n  queueTilt(event, touch) {\n    if (!this.settings.Tilt || this.reduced) return;\n    this.point = [event.clientX, event.clientY];\n    if (this.frame) return;\n    this.frame = this.win.requestAnimationFrame(() => {\n      this.frame = 0;\n      // Keep the touch reference box stable as the panel rotates.\n      const rect = touch\n        ? (touch.rect ??= this.hoverPanel.getBoundingClientRect())\n        : this.hoverPanel.getBoundingClientRect();\n      if (!rect.width || !rect.height) return;\n      const { max = 10, perspective = 1000, scale = 1.03 } = this.settings.Tilt;\n      const x = Math.max(-1, Math.min(1, (this.point[0] - rect.left) / rect.width * 2 - 1));\n      const y = Math.max(-1, Math.min(1, (this.point[1] - rect.top) / rect.height * 2 - 1));\n      this.hoverPanel.style.transform = `perspective(${perspective}px) rotateX(${-y * max}deg) rotateY(${x * max}deg) scale(${scale})`;\n    });\n  }\n  resetTilt() { if (this.frame) this.win.cancelAnimationFrame(this.frame); this.frame = 0; this.hoverPanel.style.transform = this.baseTransform || ''; }\n  render() {\n    this.hoverPanel.dataset.jfiFlipped = String(this.flipped); this.hoverPanel.dataset.jfiReduced = String(this.reduced);\n    for (const [node, hidden] of [[this.frontWrapper, this.flipped], [this.backWrapper, !this.flipped]]) { node.setAttribute('aria-hidden', String(hidden)); node.inert = hidden; }\n  }\n  flip(value = true) {\n    if (this.destroyed || this.flipped === !!value) return this;\n    const active = this.element.ownerDocument.activeElement;\n    if ((value ? this.frontWrapper : this.backWrapper).contains(active)) this.hoverPanel.focus({ preventScroll: true });\n    this.flipped = !!value; this.render();\n    this.hoverPanel.dispatchEvent(new this.win.CustomEvent('justflipit:change', { bubbles: true, detail: this.getState() }));\n    return this;\n  }\n  toggle() { return this.flip(!this.flipped); }\n  update(options = {}) {\n    if (this.destroyed) return this;\n    if ('Faces' in options) throw new TypeError('Faces cannot change after initialization');\n    validate(options);\n    if (this.managed && 'Template' in options) throw new TypeError('Render framework face content with the framework');\n    this.settings = { ...this.settings, ...options };\n    if ('Template' in options) {\n      if (this.managed) throw new TypeError('Render framework face content with the framework');\n      this.backWrapper.innerHTML = options.Template;\n    }\n    this.resetTilt(); this.configure(); this.render(); return this;\n  }\n  getState() { return { flipped: this.flipped, destroyed: this.destroyed, effect: this.settings.Effect }; }\n  destroy() {\n    if (this.destroyed) return;\n    this.resetTilt(); this.cleanups.forEach(fn => fn());\n    this.restores.forEach(fn => fn());\n    if (!this.managed) { this.hoverPanel.replaceWith(this.element); }\n    instances.delete(this.element); instances.delete(this.hoverPanel); this.destroyed = true;\n  }\n}\nfunction elements(target) {\n  if (typeof target === 'string') return typeof document === 'undefined' ? [] : Array.from(document.querySelectorAll(target));\n  if (target?.nodeType === 1) return [target];\n  return target ? Array.from(target) : [];\n}\nexport default function justFlipIt(target, options) {\n  const result = elements(target).map(element => instances.get(element) || new FlipController(element, options));\n  return target?.nodeType === 1 ? result[0] : result;\n}\njustFlipIt.destroy = target => elements(target).forEach(element => instances.get(element)?.destroy());\njustFlipIt.get = element => instances.get(element);\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/justFlipIt.d.cts

@@ -0,0 +1,4 @@
+import type Core from './justFlipIt.mjs';
+import type { FlipController } from './justFlipIt.mjs';
+declare const justFlipIt: typeof Core & { FlipController: typeof FlipController; default: typeof Core };
+export = justFlipIt;

package/dist/justFlipIt.d.mts

@@ -0,0 +1,38 @@
+export interface Options {
+  Template?: string;
+  Click?: boolean | string | string[];
+  FlipX?: boolean;
+  Duration?: number;
+  Easing?: string;
+  Effect?: 'flip' | 'fade' | 'scale';
+  ReducedMotion?: boolean;
+  Tilt?: boolean | 'only' | { max?: number; perspective?: number; scale?: number };
+  Faces?: { front: string; back: string };
+  preserveClasses?: boolean;
+  preserveStyles?: boolean;
+  Style?: { el: string; style: Partial<CSSStyleDeclaration> }[];
+}
+export interface FlipState { flipped: boolean; destroyed: boolean; effect: 'flip' | 'fade' | 'scale' }
+export class FlipController {
+  constructor(element: HTMLElement, options?: Options);
+  readonly element: HTMLElement;
+  readonly hoverPanel: HTMLElement;
+  readonly frontWrapper: HTMLElement;
+  readonly backWrapper: HTMLElement;
+  readonly flipped: boolean;
+  readonly destroyed: boolean;
+  readonly managed: boolean;
+  flip(value?: boolean): this;
+  toggle(): this;
+  update(options?: Omit<Options, 'Faces'>): this;
+  getState(): FlipState;
+  destroy(): void;
+}
+type Targets = string | Iterable<HTMLElement> | ArrayLike<HTMLElement>;
+declare function justFlipIt(target: HTMLElement, options?: Options): FlipController;
+declare function justFlipIt(target: Targets, options?: Options): FlipController[];
+declare namespace justFlipIt {
+  function destroy(target: HTMLElement | Targets): void;
+  function get(element: HTMLElement): FlipController | undefined;
+}
+export default justFlipIt;

package/dist/justFlipIt.d.ts

@@ -0,0 +1,38 @@
+export interface Options {
+  Template?: string;
+  Click?: boolean | string | string[];
+  FlipX?: boolean;
+  Duration?: number;
+  Easing?: string;
+  Effect?: 'flip' | 'fade' | 'scale';
+  ReducedMotion?: boolean;
+  Tilt?: boolean | 'only' | { max?: number; perspective?: number; scale?: number };
+  Faces?: { front: string; back: string };
+  preserveClasses?: boolean;
+  preserveStyles?: boolean;
+  Style?: { el: string; style: Partial<CSSStyleDeclaration> }[];
+}
+export interface FlipState { flipped: boolean; destroyed: boolean; effect: 'flip' | 'fade' | 'scale' }
+export class FlipController {
+  constructor(element: HTMLElement, options?: Options);
+  readonly element: HTMLElement;
+  readonly hoverPanel: HTMLElement;
+  readonly frontWrapper: HTMLElement;
+  readonly backWrapper: HTMLElement;
+  readonly flipped: boolean;
+  readonly destroyed: boolean;
+  readonly managed: boolean;
+  flip(value?: boolean): this;
+  toggle(): this;
+  update(options?: Omit<Options, 'Faces'>): this;
+  getState(): FlipState;
+  destroy(): void;
+}
+type Targets = string | Iterable<HTMLElement> | ArrayLike<HTMLElement>;
+declare function justFlipIt(target: HTMLElement, options?: Options): FlipController;
+declare function justFlipIt(target: Targets, options?: Options): FlipController[];
+declare namespace justFlipIt {
+  function destroy(target: HTMLElement | Targets): void;
+  function get(element: HTMLElement): FlipController | undefined;
+}
+export default justFlipIt;