@simhub2/justflipit 3.2.2 → 4.0.1

package/dist/justFlipIt.js.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.min.js

@@ -1 +1,23 @@
-(function(root,factory){if(typeof define==="function"&&define.amd){define(["jquery"],function(jQuery){return factory(jQuery||root.jQuery||root.$)})}else if(typeof module==="object"&&module.exports){var jQuery=typeof window!=="undefined"?window.jQuery:undefined;if(!jQuery){try{jQuery=require("jquery")}catch(e){jQuery=null}}module.exports=factory(jQuery)}else{root.justFlipIt=factory(root.jQuery||root.$)}})(typeof self!=="undefined"?self:this,function(jQuery){"use strict";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(function(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}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)}}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()})}};if(jQuery){jQuery.fn.justFlipIt=function(options){return this.each(function(){if(!jQuery.data(this,"plugin_justFlipIt")){jQuery.data(this,"plugin_justFlipIt",new JustFlipIt(this,options))}})};jQuery.fn.destroy=function(){return this.each(function(){const instance=instanceMap.get(this);if(instance){instance.destroy();jQuery.removeData(this,"plugin_justFlipIt")}})};var api=function(selector,options){if(typeof selector==="string"){return jQuery(selector).justFlipIt(options)}else if(selector instanceof Element){return jQuery(selector).justFlipIt(options)}else if(selector instanceof jQuery){return selector.justFlipIt(options)}};api.destroy=function(selector){if(typeof selector==="string"){jQuery(selector).destroy()}else if(selector instanceof Element){jQuery(selector).destroy()}else if(selector instanceof jQuery){selector.destroy()}};return api}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.min.js.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": ["core_exports", "__export", "FlipController", "justFlipIt", "instances", "defaults", "css", "styles", "doc", "style", "validate", "options", "key", "element", "clone", "node", "panel", "attrs", "name", "inert", "value", "motionChange", "type", "handler", "s", "p", "item", "event", "trigger", "selector", "touch", "rect", "max", "perspective", "scale", "x", "y", "hidden", "active", "fn", "elements", "target", "result"]
+}

package/dist/justFlipIt.mjs

@@ -0,0 +1,272 @@
+// src/core.js
+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);
+export {
+  FlipController,
+  justFlipIt as default
+};
+//# sourceMappingURL=justFlipIt.mjs.map

package/dist/justFlipIt.mjs.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/react.cjs

@@ -0,0 +1,55 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/adapters/react.js
+var react_exports = {};
+__export(react_exports, {
+  useFlip: () => useFlip
+});
+module.exports = __toCommonJS(react_exports);
+var import_react = require("react");
+var import_justflipit = __toESM(require("@simhub2/justflipit"));
+var faces = { front: "[data-flip-front]", back: "[data-flip-back]" };
+function useFlip(options = {}) {
+  const ref = (0, import_react.useRef)(null), controller = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    if (!ref.current) return;
+    const instance = (0, import_justflipit.default)(ref.current, { ...options, Faces: options.Faces || faces });
+    controller.current = instance;
+    return () => {
+      instance.destroy();
+      controller.current = null;
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const { Faces, ...settings } = options;
+    controller.current?.update(settings);
+  }, [options]);
+  return { ref, controller };
+}
+//# sourceMappingURL=react.cjs.map

package/dist/react.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/adapters/react.js"],
+  "sourcesContent": ["import { useEffect, useRef } from 'react';\nimport justFlipIt from '@simhub2/justflipit';\nconst faces = { front: '[data-flip-front]', back: '[data-flip-back]' };\nexport function useFlip(options = {}) {\n  const ref = useRef(null), controller = useRef(null);\n  useEffect(() => {\n    if (!ref.current) return;\n    const instance = justFlipIt(ref.current, { ...options, Faces: options.Faces || faces });\n    controller.current = instance;\n    return () => { instance.destroy(); controller.current = null; };\n  }, []);\n  useEffect(() => { const { Faces, ...settings } = options; controller.current?.update(settings); }, [options]);\n  return { ref, controller };\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkC;AAClC,wBAAuB;AACvB,IAAM,QAAQ,EAAE,OAAO,qBAAqB,MAAM,mBAAmB;AAC9D,SAAS,QAAQ,UAAU,CAAC,GAAG;AACpC,QAAM,UAAM,qBAAO,IAAI,GAAG,iBAAa,qBAAO,IAAI;AAClD,8BAAU,MAAM;AACd,QAAI,CAAC,IAAI,QAAS;AAClB,UAAM,eAAW,kBAAAA,SAAW,IAAI,SAAS,EAAE,GAAG,SAAS,OAAO,QAAQ,SAAS,MAAM,CAAC;AACtF,eAAW,UAAU;AACrB,WAAO,MAAM;AAAE,eAAS,QAAQ;AAAG,iBAAW,UAAU;AAAA,IAAM;AAAA,EAChE,GAAG,CAAC,CAAC;AACL,8BAAU,MAAM;AAAE,UAAM,EAAE,OAAO,GAAG,SAAS,IAAI;AAAS,eAAW,SAAS,OAAO,QAAQ;AAAA,EAAG,GAAG,CAAC,OAAO,CAAC;AAC5G,SAAO,EAAE,KAAK,WAAW;AAC3B;",
+  "names": ["justFlipIt"]
+}

package/dist/react.d.cts

@@ -0,0 +1,3 @@
+import type { RefObject } from 'react';
+import type { Options, FlipController } from './justFlipIt.mjs';
+export function useFlip<T extends HTMLElement = HTMLDivElement>(options?: Options): { ref: RefObject<T | null>; controller: RefObject<FlipController | null> };

package/dist/react.d.mts

@@ -0,0 +1,3 @@
+import type { RefObject } from 'react';
+import type { Options, FlipController } from './justFlipIt.mjs';
+export function useFlip<T extends HTMLElement = HTMLDivElement>(options?: Options): { ref: RefObject<T | null>; controller: RefObject<FlipController | null> };

package/dist/react.d.ts

@@ -0,0 +1,3 @@
+import type { RefObject } from 'react';
+import type { Options, FlipController } from './justFlipIt';
+export function useFlip<T extends HTMLElement = HTMLDivElement>(options?: Options): { ref: RefObject<T | null>; controller: RefObject<FlipController | null> };