@frsource/tiny-carousel-plugin-scroll-snap-fallback/dist/index.mjs.map

Add CSS Scroll Snap fallback polyfill to your @frsource/tiny-carousel 🧩

{"version":3,"file":"index.mjs","sources":["../src/useFallback.ts","../src/index.ts"],"sourcesContent":["import type { TinyCarousel } from '@frsource/tiny-carousel-core';\nimport { on } from '@frsource/tiny-carousel-utils';\n\nexport const useFallback = (\n    carousel: Pick<TinyCarousel, 'config' | 'carouselElement'>,\n    config: { scrollTimeout?: number }\n  ) => {\n    // TODO: remove ignore when E2E test are in place\n    /* istanbul ignore next */\n    if (config.scrollTimeout === void 0) config.scrollTimeout = 45;\n\n    let timeoutId: number | undefined = void 0;\n    let initialScrollLeft: number | undefined = void 0;\n    let preventScrollEvent = 2;\n    // TODO: cover this method with tests\n    /* istanbul ignore next */\n    const timeoutedOnScroll = (e: Event) => {\n      if (--preventScrollEvent) return;\n      initialScrollLeft = initialScrollLeft || (e.target as TinyCarousel['carouselElement']).scrollLeft;\n      clearTimeout(timeoutId);\n  \n      timeoutId = (setTimeout as Window['setTimeout'])(onScroll.bind(carousel, initialScrollLeft), config.scrollTimeout, e)\n    };\n  \n    on(carousel.carouselElement, 'scroll', timeoutedOnScroll, { passive: true });\n  \n    //\n    // TODO: cover this method with tests (Playwright/Puppeteer/cypress E2E?)\n    /* istanbul ignore next */\n    function onScroll (oldInitialScrollLeft: number, e: Event) {\n      initialScrollLeft = void 0;\n  \n      const scrollLeft = carousel.carouselElement.scrollLeft;\n      const children = [...carousel.config.items];\n      const direction = oldInitialScrollLeft > scrollLeft ? -1 : 0;\n      let offset = 0;\n      let elementToSnap: HTMLElement;\n      let elementToSnapOffsetWidth: number;\n  \n      do {\n        elementToSnap = children.shift() as HTMLElement;\n        elementToSnapOffsetWidth = elementToSnap.offsetWidth;\n        offset += elementToSnapOffsetWidth;\n      } while (children.length && offset + elementToSnapOffsetWidth < scrollLeft);\n  \n      preventScrollEvent = 2;\n      (e.target as TinyCarousel['carouselElement']).scrollLeft = offset + (direction * elementToSnapOffsetWidth);\n    }\n  };","import type { PluginDefinition } from '@frsource/tiny-carousel-core';\nimport { useFallback } from './useFallback';\n\nexport const pluginScrollSnapFallback = {\n  install: (instance, config = {}) => {\n    if (\n      config.force || \n      !(\n        // if does not support modern scroll-snap API\n        typeof CSS !== 'undefined' && CSS.supports?.('scroll-snap-align', 'start') || \n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        typeof InstallTrigger !== 'undefined' // or is not Firefox, based on https://stackoverflow.com/a/9851769\n      )\n    ) useFallback(instance, config);\n  }\n} as PluginDefinition<[{ force?: boolean; scrollTimeout?: number }?]>;\n"],"names":["useFallback","carousel","config","scrollTimeout","timeoutId","initialScrollLeft","preventScrollEvent","onScroll","oldInitialScrollLeft","e","elementToSnapOffsetWidth","scrollLeft","carouselElement","children","items","direction","offset","shift","offsetWidth","length","target","on","clearTimeout","setTimeout","bind","passive","pluginScrollSnapFallback","install","instance","force","CSS","supports","InstallTrigger"],"mappings":"uDAGaA,EAAc,SACvBC,EACAC,QAI6B,IAAzBA,EAAOC,gBAA0BD,EAAOC,cAAgB,IAE5D,IAAIC,OAAgC,EAChCC,OAAwC,EACxCC,EAAqB,EAgBzB,SAASC,EAAUC,EAA8BC,GAC/CJ,OAAoB,EAEpB,IAKIK,EALEC,EAAaV,EAASW,gBAAgBD,WACtCE,YAAeZ,EAASC,OAAOY,OAC/BC,EAAYP,EAAuBG,GAAc,EAAI,EACvDK,EAAS,EAIb,GAGEA,GADAN,EADgBG,EAASI,QACgBC,kBAElCL,EAASM,QAAUH,EAASN,EAA2BC,GAEhEL,EAAqB,EACpBG,EAAEW,OAA2CT,WAAaK,EAAUD,EAAYL,EAtBnFW,EAAGpB,EAASW,gBAAiB,SARH,SAACH,KACnBH,IACND,EAAoBA,GAAsBI,EAAEW,OAA2CT,WACvFW,aAAalB,GAEbA,EAAamB,WAAoChB,EAASiB,KAAKvB,EAAUI,GAAoBH,EAAOC,cAAeM,KAG3D,CAAEgB,SAAS,KCrB5DC,EAA2B,CACtCC,QAAS,SAACC,EAAU1B,YAAAA,IAAAA,EAAS,KAEzBA,EAAO2B,QAGU,oBAARC,WAAuBA,IAAIC,UAAJD,IAAIC,SAAW,oBAAqB,UAGxC,oBAAnBC,iBAEThC,EAAY4B,EAAU1B"}