@fynd-design-engineering/fynd-one-v2 3.3.30 → 3.3.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/accordians/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(()=>{document.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll('[fynd-faq-element="wrapper"]').forEach(
|
|
1
|
+
"use strict";(()=>{document.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll('[fynd-faq-element="wrapper"]').forEach(t=>{let e=t.querySelector('[fynd-faq-element="toggle"]'),n=t.querySelector('[fynd-faq-element="content"]'),i=t.querySelector('[fynd-faq-element="content-inner"]'),l=e?.querySelector('[fynd-faq-element="x-line"]')||null,u=e?.querySelector('[fynd-faq-element="y-line"]')||null;if(!e||!n||!i||!l||!u){console.warn("Required FAQ elements not found in wrapper");return}let a=t.closest("[fynd-faq-group]"),r=a?.getAttribute("fynd-faq-group")||null,s=a?.getAttribute("fynd-faq-type")||"one-at-a-time";t.getAttribute("fynd-faq-initialopen")==="true"?(gsap.set(n,{height:"auto",overflow:"hidden"}),gsap.set(i,{opacity:1}),gsap.set(l,{rotation:180}),gsap.set(u,{rotation:270}),e.setAttribute("data-state","open"),g(t,r),q(t,r),p(t,r),h(t,r)):(gsap.set(n,{height:0}),gsap.set(i,{opacity:0}),gsap.set(l,{rotation:0}),gsap.set(u,{rotation:0}),e.setAttribute("data-state","closed"));let c=!1;e.addEventListener("click",()=>{if(c)return;c=!0;let f=e.getAttribute("data-state")==="open";if(s==="one-at-a-time"&&a){let E=a.querySelectorAll('[fynd-faq-element="wrapper"] [data-state="open"]');if(f&&E.length===1){c=!1;return}}f?y(t,()=>{c=!1}):(s==="one-at-a-time"&&a&&L(a),A(t,r,()=>{c=!1}))})}),m(),T(),setTimeout(H,500)});window.addEventListener("resize",()=>{m()});function m(){if(window.innerWidth<992)return;document.querySelectorAll("[fynd-faq-image-target]").forEach(e=>{let n=e.parentElement;!n||n.getAttribute("ratio-height")!=="true"||(n.style.height="auto",requestAnimationFrame(()=>{let l=n.offsetHeight;n.style.height=`${l}px`}))}),document.querySelectorAll('[fynd-faq-tabgroup][ratio-height="true"]').forEach(e=>{e.style.height="auto",requestAnimationFrame(()=>{let n=e.offsetHeight;e.style.height=`${n}px`})})}function A(o,t,e){let n=o.querySelector('[fynd-faq-element="toggle"]'),i=o.querySelector('[fynd-faq-element="content"]'),l=o.querySelector('[fynd-faq-element="content-inner"]'),u=n?.querySelector('[fynd-faq-element="x-line"]')||null,a=n?.querySelector('[fynd-faq-element="y-line"]')||null;if(!n||!i||!l||!u||!a){console.warn("Required elements not found for opening accordion");return}i.gsapAnimation&&i.gsapAnimation.kill();let r=gsap.timeline({onComplete:()=>e&&e()});gsap.set(i,{height:"auto",visibility:"hidden",opacity:0});let s=i.offsetHeight;gsap.set(i,{height:0,visibility:"visible",opacity:1}),r.to(u,{rotation:180,duration:.4,ease:"power2.inOut"},0),r.to(a,{rotation:270,duration:.4,ease:"power2.inOut"},0),r.to(i,{height:s,duration:.5,ease:"power3.inOut",clearProps:"height",onComplete:()=>{i.style.height="auto"}},0),r.to(l,{opacity:1,duration:.4,ease:"power2.out"},"-=0.35"),i.gsapAnimation=r,n.setAttribute("data-state","open"),window.innerWidth<992&&setTimeout(()=>{b(o)},600);let c=n.querySelector('[fynd-faq-element="chevron"]');c&&gsap.to(c,{rotation:180,duration:.4,ease:"back.out(1.7)"}),g(o,t),q(o,t),p(o,t),h(o,t)}function y(o,t){let e=o.querySelector('[fynd-faq-element="toggle"]'),n=o.querySelector('[fynd-faq-element="content"]'),i=o.querySelector('[fynd-faq-element="content-inner"]'),l=e?.querySelector('[fynd-faq-element="x-line"]')||null,u=e?.querySelector('[fynd-faq-element="y-line"]')||null;if(!e||!n||!i||!l||!u){console.warn("Required elements not found for closing accordion");return}n.gsapAnimation&&n.gsapAnimation.kill();let a=n.offsetHeight;n.style.height=`${a}px`;let r=gsap.timeline({onComplete:()=>t&&t()});r.to(l,{rotation:0,duration:.4,ease:"power2.inOut"},0),r.to(u,{rotation:0,duration:.4,ease:"power2.inOut"},0),r.to(i,{opacity:0,duration:.3,ease:"power2.in"},0),r.to(n,{height:0,duration:.4,ease:"power3.inOut"},"-=0.25"),n.gsapAnimation=r,e.setAttribute("data-state","closed");let s=e.querySelector('[fynd-faq-element="chevron"]');s&&gsap.to(s,{rotation:0,duration:.4,ease:"back.out(1.7)"})}function L(o){o.querySelectorAll('[fynd-faq-element="wrapper"] [data-state="open"]').forEach(e=>{let n=e.closest('[fynd-faq-element="wrapper"]');n&&y(n)})}function g(o,t){if(!t)return;let e=document.querySelector(`[fynd-faq-image-target="${t}"]`);if(!e)return;let n=o.querySelector("[fynd-faq-image-source]");if(!n)return;let i=n.getAttribute("src"),l=n.getAttribute("srcset");i&&e.setAttribute("src",i),l&&e.setAttribute("srcset","")}function q(o,t){if(!t)return;let e=document.querySelector(`[fynd-faq-text-target="${t}"]`);if(!e)return;let n=o.querySelector("[fynd-faq-text-source]");n&&(e.textContent=n.textContent)}function p(o,t){if(!t)return;let e=document.querySelector(`[fynd-faq-button-text-target="${t}"]`),n=document.querySelector(`[fynd-faq-button-link-target="${t}"]`),i=o.querySelector("[fynd-faq-link-source]");if(i&&(e&&(e.textContent=i.textContent),n))for(let l=0;l<i.attributes.length;l++){let u=i.attributes[l];n.setAttribute(u.name,u.value)}}function h(o,t){if(!t)return;let e=document.querySelector(`[fynd-faq-video-target="${t}"]`);if(!e)return;let n=o.querySelector("[fynd-faq-video]");if(!n)return;let i=o.querySelector("[fynd-faq-image]");if(!i)return;let l=o.querySelector("[fynd-faq-video-source]");if(l)window.innerWidth<992&&(n.style.display="block",i.style.display="none",l.setAttribute("loop",""),l.setAttribute("autoplay",""),l.setAttribute("muted",""),l.setAttribute("playsinline",""),d(l));else{e.style.display="none",window.innerWidth<992&&(n.style.display="none",i.style.display="block");return}let u=l.querySelector("source"),a=u?.getAttribute("src")||null,r=u?.getAttribute("type")||null;if(a&&a.trim()!==""){let s=e.querySelector("source");s||(s=document.createElement("source"),e.appendChild(s)),s.setAttribute("src",a),s.setAttribute("type",r||"video/mp4"),e.setAttribute("loop",""),e.setAttribute("autoplay",""),e.setAttribute("muted",""),e.setAttribute("playsinline",""),window.innerWidth<992&&(l.setAttribute("loop",""),l.setAttribute("autoplay",""),l.setAttribute("muted",""),l.setAttribute("playsinline",""),l.play());try{e.load()}catch{}d(e),e.style.display="block"}else{e.style.display="none";let s=e.querySelector("source");if(s){s.removeAttribute("src"),s.removeAttribute("type");try{e.load()}catch{}}}}function d(o){!o.isConnected||o.style.display==="none"||requestAnimationFrame(()=>{let t=o.play();t&&typeof t.catch=="function"&&t.catch(()=>{})})}function T(){let o=document.querySelectorAll("[fynd-faq-video-target]");if(!o.length)return;let t=new IntersectionObserver(e=>{e.forEach(n=>{let i=n.target;if(!(!i.querySelector("source[src]")||i.style.display==="none"))if(n.isIntersecting&&n.intersectionRatio>=.5)i.setAttribute("autoplay",""),i.setAttribute("muted",""),i.setAttribute("playsinline",""),i.setAttribute("loop",""),d(i);else try{i.pause()}catch{}})},{threshold:[0,.5,1]});o.forEach(e=>t.observe(e))}async function H(){let o=document.querySelectorAll("video[fynd-faq-video-target], video.fynd-faq-video-target, video[data-fynd-faq-video-target], video[fynd-faq-video-source]");for(let t of o)if(t.src||t.querySelector("source[src]")){t.setAttribute("muted",""),t.setAttribute("playsinline",""),t.setAttribute("autoplay",""),t.setAttribute("loop",""),t.preload="auto",t.muted=!0;try{await t.play()}catch{}}}function b(o){if(!o)return;let t=o.querySelector('[fynd-faq-element="scroll-trigger"]');if(!t){console.warn('No element with [fynd-faq-element="scroll-trigger"] found inside the wrapper:',o);return}t.scrollIntoView({behavior:"smooth"})}})();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../bin/live-reload.js", "../../src/accordians/index.ts"],
|
|
4
|
-
"sourcesContent": ["// Only enable live reload when running on localhost\nif (\n window.location.hostname === \"localhost\" ||\n window.location.hostname === \"127.0.0.1\"\n) {\n new EventSource(`${SERVE_ORIGIN}/esbuild`).addEventListener(\"change\", () =>\n location.reload()\n );\n} else {\n // console.log(\"Live reload disabled: not running on localhost\");\n}\n", "import { isElementAccessExpression } from \"typescript\";\n\n// Type definitions\ninterface GSAPElement extends HTMLElement {\n gsapAnimation?: { kill(): void };\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", (): void => {\n const faqWrappers: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-element=\"wrapper\"]');\n\n faqWrappers.forEach((wrapper: HTMLElement): void => {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required FAQ elements not found in wrapper');\n return;\n }\n\n const groupContainer: HTMLElement | null = wrapper.closest(\"[fynd-faq-group]\");\n const groupName: string | null = groupContainer?.getAttribute(\"fynd-faq-group\") || null;\n\n // Get the FAQ type - either \"one-at-a-time\" or \"multiple-at-a-time\"\n const faqType: string = groupContainer?.getAttribute(\"fynd-faq-type\") || \"one-at-a-time\";\n\n if (wrapper.getAttribute(\"fynd-faq-initialopen\") === \"true\") {\n gsap.set(content, { height: \"auto\", overflow: \"hidden\" });\n gsap.set(contentInner, { opacity: 1 });\n gsap.set(xLine, { rotation: 180 });\n gsap.set(yLine, { rotation: 270 });\n toggle.setAttribute(\"data-state\", \"open\");\n\n // openening the accordion\n console.log(\"this accordion is open\", wrapper);\n // if (window.innerWidth < 992) {\n // setTimeout(() => {\n // scrollToAccordion(wrapper);\n // }, 200);\n // }\n\n updateFaqGroupImage(wrapper, groupName); // image\n updateFaqGroupText(wrapper, groupName); // text\n updateFaqGroupButton(wrapper, groupName); // button\n updateFaqGroupVideo(wrapper, groupName); // \u2705 video (sets loop+autoplay and tries to play)\n } else {\n gsap.set(content, { height: 0 });\n gsap.set(contentInner, { opacity: 0 });\n gsap.set(xLine, { rotation: 0 });\n gsap.set(yLine, { rotation: 0 });\n toggle.setAttribute(\"data-state\", \"closed\");\n }\n\n let isAnimating: boolean = false;\n toggle.addEventListener(\"click\", (): void => {\n if (isAnimating) return;\n isAnimating = true;\n const isOpen: boolean = toggle.getAttribute(\"data-state\") === \"open\";\n\n // For \"one-at-a-time\" type, check if this is the last open FAQ\n if (faqType === \"one-at-a-time\" && groupContainer) {\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n\n if (isOpen && openFAQs.length === 1) {\n // Don't allow closing the last open FAQ in \"one-at-a-time\" mode\n isAnimating = false;\n return;\n }\n }\n\n if (isOpen) {\n closeAccordion(wrapper, (): void => {\n isAnimating = false;\n });\n } else {\n if (faqType === \"one-at-a-time\" && groupContainer) {\n closeOtherAccordions(groupContainer);\n }\n openAccordion(wrapper, groupName, (): void => {\n isAnimating = false;\n });\n }\n });\n });\n\n // Initialize ratio heights on page load\n handleRatioHeights();\n\n // \u2705 Set up viewport-based autoplay/pause for all video targets\n initFaqVideoAutoplayObserver();\n\n setTimeout(playAllFaqVideos, 500);\n});\n\n// Handle window resize\nwindow.addEventListener(\"resize\", (): void => {\n handleRatioHeights();\n});\n\n// Function to handle ratio heights for FAQ image targets and tabgroups\nfunction handleRatioHeights(): void {\n // Run only if viewport width is >= 992px\n if (window.innerWidth < 992) return;\n\n // Find all FAQ image targets\n const imageTargets: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-image-target]');\n \n imageTargets.forEach((imageTarget: HTMLElement): void => {\n const wrapper: HTMLElement | null = imageTarget.parentElement;\n if (!wrapper) return;\n const ratioHeight: string | null = wrapper.getAttribute(\"ratio-height\");\n if (ratioHeight !== \"true\") return;\n wrapper.style.height = \"auto\";\n requestAnimationFrame((): void => {\n const renderedHeight: number = wrapper.offsetHeight;\n wrapper.style.height = `${renderedHeight}px`;\n });\n });\n\n // Handle tab groups\n const tabGroups: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-tabgroup][ratio-height=\"true\"]');\n tabGroups.forEach((tabGroup: HTMLElement): void => {\n tabGroup.style.height = \"auto\";\n requestAnimationFrame((): void => {\n const renderedHeight: number = tabGroup.offsetHeight;\n tabGroup.style.height = `${renderedHeight}px`;\n });\n });\n}\n\nfunction openAccordion(wrapper: HTMLElement, groupName: string | null, callback?: () => void): void {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required elements not found for opening accordion');\n return;\n }\n\n if (content.gsapAnimation) {\n content.gsapAnimation.kill();\n }\n\n const timeline = gsap.timeline({ onComplete: (): void => callback && callback() });\n\n gsap.set(content, { height: \"auto\", visibility: \"hidden\", opacity: 0 });\n const height: number = content.offsetHeight;\n gsap.set(content, { height: 0, visibility: \"visible\", opacity: 1 });\n\n timeline.to(xLine, { rotation: 180, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(yLine, { rotation: 270, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(\n content,\n {\n height,\n duration: 0.5,\n ease: \"power3.inOut\",\n clearProps: \"height\",\n onComplete: (): void => {\n (content as HTMLElement).style.height = \"auto\";\n },\n },\n 0\n );\n timeline.to(contentInner, { opacity: 1, duration: 0.4, ease: \"power2.out\" }, \"-=0.35\");\n\n content.gsapAnimation = timeline;\n toggle.setAttribute(\"data-state\", \"open\");\n // scroll to the accordion on tablet and below\n console.log(\"this accordion is open\", wrapper);\n if (window.innerWidth < 992) {\n setTimeout(() => {\n scrollToAccordion(wrapper);\n }, 600);\n }\n\n const icon: HTMLElement | null = toggle.querySelector('[fynd-faq-element=\"chevron\"]');\n if (icon) gsap.to(icon, { rotation: 180, duration: 0.4, ease: \"back.out(1.7)\" });\n\n // Update group-level UIs\n updateFaqGroupImage(wrapper, groupName);\n updateFaqGroupText(wrapper, groupName);\n updateFaqGroupButton(wrapper, groupName);\n updateFaqGroupVideo(wrapper, groupName); // \u2705 ensures autoplay on change\n}\n\nfunction closeAccordion(wrapper: HTMLElement, callback?: () => void): void {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required elements not found for closing accordion');\n return;\n }\n\n if (content.gsapAnimation) content.gsapAnimation.kill();\n\n const height: number = content.offsetHeight;\n (content as HTMLElement).style.height = `${height}px`;\n\n const timeline = gsap.timeline({ onComplete: (): void => callback && callback() });\n\n timeline.to(xLine, { rotation: 0, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(yLine, { rotation: 0, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(contentInner, { opacity: 0, duration: 0.3, ease: \"power2.in\" }, 0);\n timeline.to(content, { height: 0, duration: 0.4, ease: \"power3.inOut\" }, \"-=0.25\");\n\n content.gsapAnimation = timeline;\n toggle.setAttribute(\"data-state\", \"closed\");\n\n const icon: HTMLElement | null = toggle.querySelector('[fynd-faq-element=\"chevron\"]');\n if (icon) gsap.to(icon, { rotation: 0, duration: 0.4, ease: \"back.out(1.7)\" });\n}\n\n// Function to close all other accordions in the same group\nfunction closeOtherAccordions(groupContainer: HTMLElement): void {\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n openFAQs.forEach((openToggle: HTMLElement): void => {\n const wrapper: HTMLElement | null = openToggle.closest('[fynd-faq-element=\"wrapper\"]');\n if (wrapper) closeAccordion(wrapper);\n });\n}\n\n// Function to update the group image\nfunction updateFaqGroupImage(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n const groupImage: HTMLImageElement | null = document.querySelector(\n `[fynd-faq-image-target=\"${groupName}\"]`\n );\n if (!groupImage) return;\n\n const imageSource: HTMLImageElement | null = wrapper.querySelector(\"[fynd-faq-image-source]\");\n if (!imageSource) return;\n\n const newSrc: string | null = imageSource.getAttribute(\"src\");\n const newSrcset: string | null = imageSource.getAttribute(\"srcset\");\n\n if (newSrc) groupImage.setAttribute(\"src\", newSrc);\n if (newSrcset) groupImage.setAttribute(\"srcset\", \"\");\n // removing srcset for now\n}\n\n// Function to update the group text\nfunction updateFaqGroupText(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n const groupText: HTMLElement | null = document.querySelector(\n `[fynd-faq-text-target=\"${groupName}\"]`\n );\n if (!groupText) return;\n\n const textSource: HTMLElement | null = wrapper.querySelector(\"[fynd-faq-text-source]\");\n if (!textSource) return;\n\n groupText.textContent = textSource.textContent;\n}\n\n// Function to update the group button\nfunction updateFaqGroupButton(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n\n const buttonTextTarget: HTMLElement | null = document.querySelector(\n `[fynd-faq-button-text-target=\"${groupName}\"]`\n );\n const buttonLinkTarget: HTMLElement | null = document.querySelector(\n `[fynd-faq-button-link-target=\"${groupName}\"]`\n );\n\n const linkSource: HTMLAnchorElement | null = wrapper.querySelector(\"[fynd-faq-link-source]\");\n if (!linkSource) return;\n\n if (buttonTextTarget) buttonTextTarget.textContent = linkSource.textContent;\n\n if (buttonLinkTarget) {\n for (let i = 0; i < linkSource.attributes.length; i++) {\n const attr = linkSource.attributes[i];\n buttonLinkTarget.setAttribute(attr.name, attr.value);\n }\n }\n}\n\n// \u2705 Always-loop + autoplay video updater\nfunction updateFaqGroupVideo(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n\n const groupVideo: HTMLVideoElement | null = document.querySelector(\n `[fynd-faq-video-target=\"${groupName}\"]`\n );\n if (!groupVideo) return;\n const groupVideoWrapper: HTMLElement | null = wrapper.querySelector(`[fynd-faq-video]`);\n if (!groupVideoWrapper) return;\n const groupImageWrapper: HTMLElement | null = wrapper.querySelector(`[fynd-faq-image]`);\n if (!groupImageWrapper) return;\n \n\n const sourceVideo: HTMLVideoElement | null = wrapper.querySelector(\"[fynd-faq-video-source]\");\n if (!sourceVideo) {\n groupVideo.style.display = \"none\";\n if(window.innerWidth < 992){\n groupVideoWrapper.style.display = \"none\";\n groupImageWrapper.style.display = \"block\";\n }\n return;\n }\n else{\n // groupVideo.style.display = \"block\";\n if(window.innerWidth < 992){\n groupVideoWrapper.style.display = \"block\";\n groupImageWrapper.style.display = \"none\";\n sourceVideo.setAttribute(\"loop\", \"\");\n sourceVideo.setAttribute(\"autoplay\", \"\");\n sourceVideo.setAttribute(\"muted\", \"\"); \n sourceVideo.setAttribute(\"playsinline\", \"\");\n autoplayVideo(sourceVideo);\n }\n }\n\n const sourceEl: HTMLSourceElement | null = sourceVideo.querySelector(\"source\");\n const newSrc: string | null = sourceEl?.getAttribute(\"src\") || null;\n const newType: string | null = sourceEl?.getAttribute(\"type\") || null;\n\n if (newSrc && newSrc.trim() !== \"\") {\n let targetSourceEl: HTMLSourceElement | null = groupVideo.querySelector(\"source\");\n if (!targetSourceEl) {\n targetSourceEl = document.createElement(\"source\");\n groupVideo.appendChild(targetSourceEl);\n }\n\n targetSourceEl.setAttribute(\"src\", newSrc);\n targetSourceEl.setAttribute(\"type\", newType || \"video/mp4\");\n\n // \u2705 Force desired playback behavior\n groupVideo.setAttribute(\"loop\", \"\");\n groupVideo.setAttribute(\"autoplay\", \"\");\n groupVideo.setAttribute(\"muted\", \"\"); // required for autoplay on most browsers\n groupVideo.setAttribute(\"playsinline\", \"\"); // iOS inline autoplay\n\n if(window.innerWidth < 992){\n sourceVideo.setAttribute(\"loop\", \"\");\n sourceVideo.setAttribute(\"autoplay\", \"\");\n sourceVideo.setAttribute(\"muted\", \"\"); \n sourceVideo.setAttribute(\"playsinline\", \"\");\n sourceVideo.play();\n }\n\n // Apply new source\n try { groupVideo.load(); } catch (e) { /* no-op */ }\n\n // Try to autoplay immediately\n autoplayVideo(groupVideo);\n\n groupVideo.style.display = \"block\";\n } else {\n groupVideo.style.display = \"none\";\n const targetSourceEl: HTMLSourceElement | null = groupVideo.querySelector(\"source\");\n if (targetSourceEl) {\n targetSourceEl.removeAttribute(\"src\");\n targetSourceEl.removeAttribute(\"type\");\n try { groupVideo.load(); } catch (e) { /* no-op */ }\n }\n }\n}\n\n// \uD83D\uDD38 Robust autoplay helper (handles Promise and race conditions)\nfunction autoplayVideo(video: HTMLVideoElement): void {\n // If not in DOM or hidden, defer to IntersectionObserver\n if (!video.isConnected || video.style.display === \"none\") return;\n\n // Some browsers need a tiny delay after .load()\n requestAnimationFrame(() => {\n const playPromise = video.play();\n if (playPromise && typeof (playPromise as Promise<void>).catch === \"function\") {\n (playPromise as Promise<void>).catch(() => {\n // If autoplay fails (rare with muted+playsinline), we silently ignore.\n });\n }\n });\n}\n\n// \uD83D\uDD38 Observe visibility to autoplay on entering viewport (and pause when out)\nfunction initFaqVideoAutoplayObserver(): void {\n const videos: NodeListOf<HTMLVideoElement> = document.querySelectorAll('[fynd-faq-video-target]');\n if (!videos.length) return;\n\n const io = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const video = entry.target as HTMLVideoElement;\n // Only act if video has a valid source set\n const hasSrc = !!video.querySelector('source[src]');\n if (!hasSrc || video.style.display === \"none\") return;\n\n if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {\n // Ensure autoplay attributes are present (defensive)\n video.setAttribute(\"autoplay\", \"\");\n video.setAttribute(\"muted\", \"\");\n video.setAttribute(\"playsinline\", \"\");\n video.setAttribute(\"loop\", \"\");\n autoplayVideo(video);\n } else {\n // Pause when scrolled out to save resources\n try { video.pause(); } catch (e) { /* no-op */ }\n }\n });\n }, { threshold: [0, 0.5, 1] });\n\n videos.forEach((v) => io.observe(v));\n}\n\n// Function to ensure at least one FAQ is open in \"one-at-a-time\" mode\nfunction ensureOneFaqOpen(groupContainer: HTMLElement | null): void {\n if (!groupContainer) return;\n\n const faqType: string = groupContainer.getAttribute(\"fynd-faq-type\") || \"one-at-a-time\";\n if (faqType !== \"one-at-a-time\") return;\n\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n\n if (openFAQs.length === 0) {\n const firstFaq: HTMLElement | null = groupContainer.querySelector('[fynd-faq-element=\"wrapper\"]');\n if (firstFaq) {\n const firstToggle: HTMLElement | null = firstFaq.querySelector('[fynd-faq-element=\"toggle\"]');\n if (firstToggle) {\n const groupName: string | null = groupContainer.getAttribute(\"fynd-faq-group\");\n openAccordion(firstFaq, groupName);\n }\n }\n }\n}\n\n// 1) include mobile sources in the global kickstart\nasync function playAllFaqVideos(): Promise<void> {\n const videos: NodeListOf<HTMLVideoElement> = document.querySelectorAll(\n 'video[fynd-faq-video-target], video.fynd-faq-video-target, video[data-fynd-faq-video-target], video[fynd-faq-video-source]'\n );\n for (const v of videos) {\n const hasSrc = !!v.src || v.querySelector('source[src]');\n if (!hasSrc) continue;\n v.setAttribute('muted', '');\n v.setAttribute('playsinline', '');\n v.setAttribute('autoplay', '');\n v.setAttribute('loop', '');\n v.preload = 'auto';\n v.muted = true;\n try { await v.play(); } catch {}\n }\n}\n\n\n// Function to scroll smoothly to the \"scroll-trigger\" element inside the wrapper\nfunction scrollToAccordion(wrapper: HTMLElement): void {\n if (!wrapper) return;\n\n const scrollTarget: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"scroll-trigger\"]');\n\n if (!scrollTarget) {\n console.warn('No element with [fynd-faq-element=\"scroll-trigger\"] found inside the wrapper:', wrapper);\n return;\n }\n\n // Smooth scroll to the element\n scrollTarget.scrollIntoView({\n behavior: 'smooth',\n // block: 'center',\n });\n}"],
|
|
5
|
-
"mappings": ";;;AACA,MACE,OAAO,SAAS,aAAa,eAC7B,OAAO,SAAS,aAAa,aAC7B;AACA,QAAI,YAAY,GAAG,uBAAY,UAAU,EAAE;AAAA,MAAiB;AAAA,MAAU,MACpE,SAAS,OAAO;AAAA,IAClB;AAAA,EACF,OAAO;AAAA,EAEP;;;ACHA,WAAS,iBAAiB,oBAAoB,MAAY;AACxD,UAAM,cAAuC,SAAS,iBAAiB,8BAA8B;AAErG,gBAAY,QAAQ,CAAC,YAA+B;AAClD,YAAM,SAA6B,QAAQ,cAAc,6BAA6B;AACtF,YAAM,UAA8B,QAAQ,cAAc,8BAA8B;AACxF,YAAM,eAAmC,QAAQ,cAAc,oCAAoC;AACnG,YAAM,QAA4B,QAAQ,cAAc,6BAA6B,KAAK;AAC1F,YAAM,QAA4B,QAAQ,cAAc,6BAA6B,KAAK;AAE1F,UAAI,CAAC,UAAU,CAAC,WAAW,CAAC,gBAAgB,CAAC,SAAS,CAAC,OAAO;AAC5D,gBAAQ,KAAK,4CAA4C;AACzD;AAAA,MACF;AAEA,YAAM,iBAAqC,QAAQ,QAAQ,kBAAkB;AAC7E,YAAM,YAA2B,gBAAgB,aAAa,gBAAgB,KAAK;AAGnF,YAAM,UAAkB,gBAAgB,aAAa,eAAe,KAAK;AAEzE,UAAI,QAAQ,aAAa,sBAAsB,MAAM,QAAQ;AAC3D,aAAK,IAAI,SAAS,EAAE,QAAQ,QAAQ,UAAU,SAAS,CAAC;AACxD,aAAK,IAAI,cAAc,EAAE,SAAS,EAAE,CAAC;AACrC,aAAK,IAAI,OAAO,EAAE,UAAU,IAAI,CAAC;AACjC,aAAK,IAAI,OAAO,EAAE,UAAU,IAAI,CAAC;AACjC,eAAO,aAAa,cAAc,MAAM;
|
|
4
|
+
"sourcesContent": ["// Only enable live reload when running on localhost\nif (\n window.location.hostname === \"localhost\" ||\n window.location.hostname === \"127.0.0.1\"\n) {\n new EventSource(`${SERVE_ORIGIN}/esbuild`).addEventListener(\"change\", () =>\n location.reload()\n );\n} else {\n // console.log(\"Live reload disabled: not running on localhost\");\n}\n", "import { isElementAccessExpression } from \"typescript\";\n\n// Type definitions\ninterface GSAPElement extends HTMLElement {\n gsapAnimation?: { kill(): void };\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", (): void => {\n const faqWrappers: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-element=\"wrapper\"]');\n\n faqWrappers.forEach((wrapper: HTMLElement): void => {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required FAQ elements not found in wrapper');\n return;\n }\n\n const groupContainer: HTMLElement | null = wrapper.closest(\"[fynd-faq-group]\");\n const groupName: string | null = groupContainer?.getAttribute(\"fynd-faq-group\") || null;\n\n // Get the FAQ type - either \"one-at-a-time\" or \"multiple-at-a-time\"\n const faqType: string = groupContainer?.getAttribute(\"fynd-faq-type\") || \"one-at-a-time\";\n\n if (wrapper.getAttribute(\"fynd-faq-initialopen\") === \"true\") {\n gsap.set(content, { height: \"auto\", overflow: \"hidden\" });\n gsap.set(contentInner, { opacity: 1 });\n gsap.set(xLine, { rotation: 180 });\n gsap.set(yLine, { rotation: 270 });\n toggle.setAttribute(\"data-state\", \"open\");\n\n // openening the accordion\n // console.log(\"this accordion is open\", wrapper);\n // if (window.innerWidth < 992) {\n // setTimeout(() => {\n // scrollToAccordion(wrapper);\n // }, 200);\n // }\n\n updateFaqGroupImage(wrapper, groupName); // image\n updateFaqGroupText(wrapper, groupName); // text\n updateFaqGroupButton(wrapper, groupName); // button\n updateFaqGroupVideo(wrapper, groupName); // \u2705 video (sets loop+autoplay and tries to play)\n } else {\n gsap.set(content, { height: 0 });\n gsap.set(contentInner, { opacity: 0 });\n gsap.set(xLine, { rotation: 0 });\n gsap.set(yLine, { rotation: 0 });\n toggle.setAttribute(\"data-state\", \"closed\");\n }\n\n let isAnimating: boolean = false;\n toggle.addEventListener(\"click\", (): void => {\n if (isAnimating) return;\n isAnimating = true;\n const isOpen: boolean = toggle.getAttribute(\"data-state\") === \"open\";\n\n // For \"one-at-a-time\" type, check if this is the last open FAQ\n if (faqType === \"one-at-a-time\" && groupContainer) {\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n\n if (isOpen && openFAQs.length === 1) {\n // Don't allow closing the last open FAQ in \"one-at-a-time\" mode\n isAnimating = false;\n return;\n }\n }\n\n if (isOpen) {\n closeAccordion(wrapper, (): void => {\n isAnimating = false;\n });\n } else {\n if (faqType === \"one-at-a-time\" && groupContainer) {\n closeOtherAccordions(groupContainer);\n }\n openAccordion(wrapper, groupName, (): void => {\n isAnimating = false;\n });\n }\n });\n });\n\n // Initialize ratio heights on page load\n handleRatioHeights();\n\n // \u2705 Set up viewport-based autoplay/pause for all video targets\n initFaqVideoAutoplayObserver();\n\n setTimeout(playAllFaqVideos, 500);\n});\n\n// Handle window resize\nwindow.addEventListener(\"resize\", (): void => {\n handleRatioHeights();\n});\n\n// Function to handle ratio heights for FAQ image targets and tabgroups\nfunction handleRatioHeights(): void {\n // Run only if viewport width is >= 992px\n if (window.innerWidth < 992) return;\n\n // Find all FAQ image targets\n const imageTargets: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-image-target]');\n \n imageTargets.forEach((imageTarget: HTMLElement): void => {\n const wrapper: HTMLElement | null = imageTarget.parentElement;\n if (!wrapper) return;\n const ratioHeight: string | null = wrapper.getAttribute(\"ratio-height\");\n if (ratioHeight !== \"true\") return;\n wrapper.style.height = \"auto\";\n requestAnimationFrame((): void => {\n const renderedHeight: number = wrapper.offsetHeight;\n wrapper.style.height = `${renderedHeight}px`;\n });\n });\n\n // Handle tab groups\n const tabGroups: NodeListOf<HTMLElement> = document.querySelectorAll('[fynd-faq-tabgroup][ratio-height=\"true\"]');\n tabGroups.forEach((tabGroup: HTMLElement): void => {\n tabGroup.style.height = \"auto\";\n requestAnimationFrame((): void => {\n const renderedHeight: number = tabGroup.offsetHeight;\n tabGroup.style.height = `${renderedHeight}px`;\n });\n });\n}\n\nfunction openAccordion(wrapper: HTMLElement, groupName: string | null, callback?: () => void): void {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required elements not found for opening accordion');\n return;\n }\n\n if (content.gsapAnimation) {\n content.gsapAnimation.kill();\n }\n\n const timeline = gsap.timeline({ onComplete: (): void => callback && callback() });\n\n gsap.set(content, { height: \"auto\", visibility: \"hidden\", opacity: 0 });\n const height: number = content.offsetHeight;\n gsap.set(content, { height: 0, visibility: \"visible\", opacity: 1 });\n\n timeline.to(xLine, { rotation: 180, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(yLine, { rotation: 270, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(\n content,\n {\n height,\n duration: 0.5,\n ease: \"power3.inOut\",\n clearProps: \"height\",\n onComplete: (): void => {\n (content as HTMLElement).style.height = \"auto\";\n },\n },\n 0\n );\n timeline.to(contentInner, { opacity: 1, duration: 0.4, ease: \"power2.out\" }, \"-=0.35\");\n\n content.gsapAnimation = timeline;\n toggle.setAttribute(\"data-state\", \"open\");\n // scroll to the accordion on tablet and below\n // console.log(\"this accordion is open\", wrapper);\n if (window.innerWidth < 992) {\n setTimeout(() => {\n scrollToAccordion(wrapper);\n }, 600);\n }\n\n const icon: HTMLElement | null = toggle.querySelector('[fynd-faq-element=\"chevron\"]');\n if (icon) gsap.to(icon, { rotation: 180, duration: 0.4, ease: \"back.out(1.7)\" });\n\n // Update group-level UIs\n updateFaqGroupImage(wrapper, groupName);\n updateFaqGroupText(wrapper, groupName);\n updateFaqGroupButton(wrapper, groupName);\n updateFaqGroupVideo(wrapper, groupName); // \u2705 ensures autoplay on change\n}\n\nfunction closeAccordion(wrapper: HTMLElement, callback?: () => void): void {\n const toggle: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"toggle\"]');\n const content: GSAPElement | null = wrapper.querySelector('[fynd-faq-element=\"content\"]');\n const contentInner: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"content-inner\"]');\n const xLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"x-line\"]') || null;\n const yLine: HTMLElement | null = toggle?.querySelector('[fynd-faq-element=\"y-line\"]') || null;\n\n if (!toggle || !content || !contentInner || !xLine || !yLine) {\n console.warn('Required elements not found for closing accordion');\n return;\n }\n\n if (content.gsapAnimation) content.gsapAnimation.kill();\n\n const height: number = content.offsetHeight;\n (content as HTMLElement).style.height = `${height}px`;\n\n const timeline = gsap.timeline({ onComplete: (): void => callback && callback() });\n\n timeline.to(xLine, { rotation: 0, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(yLine, { rotation: 0, duration: 0.4, ease: \"power2.inOut\" }, 0);\n timeline.to(contentInner, { opacity: 0, duration: 0.3, ease: \"power2.in\" }, 0);\n timeline.to(content, { height: 0, duration: 0.4, ease: \"power3.inOut\" }, \"-=0.25\");\n\n content.gsapAnimation = timeline;\n toggle.setAttribute(\"data-state\", \"closed\");\n\n const icon: HTMLElement | null = toggle.querySelector('[fynd-faq-element=\"chevron\"]');\n if (icon) gsap.to(icon, { rotation: 0, duration: 0.4, ease: \"back.out(1.7)\" });\n}\n\n// Function to close all other accordions in the same group\nfunction closeOtherAccordions(groupContainer: HTMLElement): void {\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n openFAQs.forEach((openToggle: HTMLElement): void => {\n const wrapper: HTMLElement | null = openToggle.closest('[fynd-faq-element=\"wrapper\"]');\n if (wrapper) closeAccordion(wrapper);\n });\n}\n\n// Function to update the group image\nfunction updateFaqGroupImage(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n const groupImage: HTMLImageElement | null = document.querySelector(\n `[fynd-faq-image-target=\"${groupName}\"]`\n );\n if (!groupImage) return;\n\n const imageSource: HTMLImageElement | null = wrapper.querySelector(\"[fynd-faq-image-source]\");\n if (!imageSource) return;\n\n const newSrc: string | null = imageSource.getAttribute(\"src\");\n const newSrcset: string | null = imageSource.getAttribute(\"srcset\");\n\n if (newSrc) groupImage.setAttribute(\"src\", newSrc);\n if (newSrcset) groupImage.setAttribute(\"srcset\", \"\");\n // removing srcset for now\n}\n\n// Function to update the group text\nfunction updateFaqGroupText(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n const groupText: HTMLElement | null = document.querySelector(\n `[fynd-faq-text-target=\"${groupName}\"]`\n );\n if (!groupText) return;\n\n const textSource: HTMLElement | null = wrapper.querySelector(\"[fynd-faq-text-source]\");\n if (!textSource) return;\n\n groupText.textContent = textSource.textContent;\n}\n\n// Function to update the group button\nfunction updateFaqGroupButton(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n\n const buttonTextTarget: HTMLElement | null = document.querySelector(\n `[fynd-faq-button-text-target=\"${groupName}\"]`\n );\n const buttonLinkTarget: HTMLElement | null = document.querySelector(\n `[fynd-faq-button-link-target=\"${groupName}\"]`\n );\n\n const linkSource: HTMLAnchorElement | null = wrapper.querySelector(\"[fynd-faq-link-source]\");\n if (!linkSource) return;\n\n if (buttonTextTarget) buttonTextTarget.textContent = linkSource.textContent;\n\n if (buttonLinkTarget) {\n for (let i = 0; i < linkSource.attributes.length; i++) {\n const attr = linkSource.attributes[i];\n buttonLinkTarget.setAttribute(attr.name, attr.value);\n }\n }\n}\n\n// \u2705 Always-loop + autoplay video updater\nfunction updateFaqGroupVideo(wrapper: HTMLElement, groupName: string | null): void {\n if (!groupName) return;\n\n const groupVideo: HTMLVideoElement | null = document.querySelector(\n `[fynd-faq-video-target=\"${groupName}\"]`\n );\n if (!groupVideo) return;\n const groupVideoWrapper: HTMLElement | null = wrapper.querySelector(`[fynd-faq-video]`);\n if (!groupVideoWrapper) return;\n const groupImageWrapper: HTMLElement | null = wrapper.querySelector(`[fynd-faq-image]`);\n if (!groupImageWrapper) return;\n \n\n const sourceVideo: HTMLVideoElement | null = wrapper.querySelector(\"[fynd-faq-video-source]\");\n if (!sourceVideo) {\n groupVideo.style.display = \"none\";\n if(window.innerWidth < 992){\n groupVideoWrapper.style.display = \"none\";\n groupImageWrapper.style.display = \"block\";\n }\n return;\n }\n else{\n // groupVideo.style.display = \"block\";\n if(window.innerWidth < 992){\n groupVideoWrapper.style.display = \"block\";\n groupImageWrapper.style.display = \"none\";\n sourceVideo.setAttribute(\"loop\", \"\");\n sourceVideo.setAttribute(\"autoplay\", \"\");\n sourceVideo.setAttribute(\"muted\", \"\"); \n sourceVideo.setAttribute(\"playsinline\", \"\");\n autoplayVideo(sourceVideo);\n }\n }\n\n const sourceEl: HTMLSourceElement | null = sourceVideo.querySelector(\"source\");\n const newSrc: string | null = sourceEl?.getAttribute(\"src\") || null;\n const newType: string | null = sourceEl?.getAttribute(\"type\") || null;\n\n if (newSrc && newSrc.trim() !== \"\") {\n let targetSourceEl: HTMLSourceElement | null = groupVideo.querySelector(\"source\");\n if (!targetSourceEl) {\n targetSourceEl = document.createElement(\"source\");\n groupVideo.appendChild(targetSourceEl);\n }\n\n targetSourceEl.setAttribute(\"src\", newSrc);\n targetSourceEl.setAttribute(\"type\", newType || \"video/mp4\");\n\n // \u2705 Force desired playback behavior\n groupVideo.setAttribute(\"loop\", \"\");\n groupVideo.setAttribute(\"autoplay\", \"\");\n groupVideo.setAttribute(\"muted\", \"\"); // required for autoplay on most browsers\n groupVideo.setAttribute(\"playsinline\", \"\"); // iOS inline autoplay\n\n if(window.innerWidth < 992){\n sourceVideo.setAttribute(\"loop\", \"\");\n sourceVideo.setAttribute(\"autoplay\", \"\");\n sourceVideo.setAttribute(\"muted\", \"\"); \n sourceVideo.setAttribute(\"playsinline\", \"\");\n sourceVideo.play();\n }\n\n // Apply new source\n try { groupVideo.load(); } catch (e) { /* no-op */ }\n\n // Try to autoplay immediately\n autoplayVideo(groupVideo);\n\n groupVideo.style.display = \"block\";\n } else {\n groupVideo.style.display = \"none\";\n const targetSourceEl: HTMLSourceElement | null = groupVideo.querySelector(\"source\");\n if (targetSourceEl) {\n targetSourceEl.removeAttribute(\"src\");\n targetSourceEl.removeAttribute(\"type\");\n try { groupVideo.load(); } catch (e) { /* no-op */ }\n }\n }\n}\n\n// \uD83D\uDD38 Robust autoplay helper (handles Promise and race conditions)\nfunction autoplayVideo(video: HTMLVideoElement): void {\n // If not in DOM or hidden, defer to IntersectionObserver\n if (!video.isConnected || video.style.display === \"none\") return;\n\n // Some browsers need a tiny delay after .load()\n requestAnimationFrame(() => {\n const playPromise = video.play();\n if (playPromise && typeof (playPromise as Promise<void>).catch === \"function\") {\n (playPromise as Promise<void>).catch(() => {\n // If autoplay fails (rare with muted+playsinline), we silently ignore.\n });\n }\n });\n}\n\n// \uD83D\uDD38 Observe visibility to autoplay on entering viewport (and pause when out)\nfunction initFaqVideoAutoplayObserver(): void {\n const videos: NodeListOf<HTMLVideoElement> = document.querySelectorAll('[fynd-faq-video-target]');\n if (!videos.length) return;\n\n const io = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const video = entry.target as HTMLVideoElement;\n // Only act if video has a valid source set\n const hasSrc = !!video.querySelector('source[src]');\n if (!hasSrc || video.style.display === \"none\") return;\n\n if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {\n // Ensure autoplay attributes are present (defensive)\n video.setAttribute(\"autoplay\", \"\");\n video.setAttribute(\"muted\", \"\");\n video.setAttribute(\"playsinline\", \"\");\n video.setAttribute(\"loop\", \"\");\n autoplayVideo(video);\n } else {\n // Pause when scrolled out to save resources\n try { video.pause(); } catch (e) { /* no-op */ }\n }\n });\n }, { threshold: [0, 0.5, 1] });\n\n videos.forEach((v) => io.observe(v));\n}\n\n// Function to ensure at least one FAQ is open in \"one-at-a-time\" mode\nfunction ensureOneFaqOpen(groupContainer: HTMLElement | null): void {\n if (!groupContainer) return;\n\n const faqType: string = groupContainer.getAttribute(\"fynd-faq-type\") || \"one-at-a-time\";\n if (faqType !== \"one-at-a-time\") return;\n\n const openFAQs: NodeListOf<HTMLElement> = groupContainer.querySelectorAll(\n '[fynd-faq-element=\"wrapper\"] [data-state=\"open\"]'\n );\n\n if (openFAQs.length === 0) {\n const firstFaq: HTMLElement | null = groupContainer.querySelector('[fynd-faq-element=\"wrapper\"]');\n if (firstFaq) {\n const firstToggle: HTMLElement | null = firstFaq.querySelector('[fynd-faq-element=\"toggle\"]');\n if (firstToggle) {\n const groupName: string | null = groupContainer.getAttribute(\"fynd-faq-group\");\n openAccordion(firstFaq, groupName);\n }\n }\n }\n}\n\n// 1) include mobile sources in the global kickstart\nasync function playAllFaqVideos(): Promise<void> {\n const videos: NodeListOf<HTMLVideoElement> = document.querySelectorAll(\n 'video[fynd-faq-video-target], video.fynd-faq-video-target, video[data-fynd-faq-video-target], video[fynd-faq-video-source]'\n );\n for (const v of videos) {\n const hasSrc = !!v.src || v.querySelector('source[src]');\n if (!hasSrc) continue;\n v.setAttribute('muted', '');\n v.setAttribute('playsinline', '');\n v.setAttribute('autoplay', '');\n v.setAttribute('loop', '');\n v.preload = 'auto';\n v.muted = true;\n try { await v.play(); } catch {}\n }\n}\n\n\n// Function to scroll smoothly to the \"scroll-trigger\" element inside the wrapper\nfunction scrollToAccordion(wrapper: HTMLElement): void {\n if (!wrapper) return;\n\n const scrollTarget: HTMLElement | null = wrapper.querySelector('[fynd-faq-element=\"scroll-trigger\"]');\n\n if (!scrollTarget) {\n console.warn('No element with [fynd-faq-element=\"scroll-trigger\"] found inside the wrapper:', wrapper);\n return;\n }\n\n // Smooth scroll to the element\n scrollTarget.scrollIntoView({\n behavior: 'smooth',\n // block: 'center',\n });\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|