@maas/vue-equipment 0.4.2 → 0.6.0
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/composables/index.js.map +1 -1
- package/dist/composables/index.mjs.map +1 -1
- package/dist/nuxt/module.json +1 -1
- package/dist/nuxt/module.mjs +23 -2
- package/dist/plugins/MagicMarquee/index.d.ts +3 -0
- package/dist/plugins/MagicMarquee/index.mjs +7 -0
- package/dist/plugins/MagicMarquee/nuxt.d.ts +2 -0
- package/dist/plugins/MagicMarquee/nuxt.mjs +5 -0
- package/dist/plugins/MagicMarquee/src/components/MagicMarquee.vue +105 -0
- package/dist/plugins/MagicMarquee/src/components/MagicMarquee.vue.d.ts +34 -0
- package/dist/plugins/MagicMarquee/src/composables/useMarqueeApi.d.ts +15 -0
- package/dist/plugins/MagicMarquee/src/composables/useMarqueeApi.mjs +84 -0
- package/dist/plugins/MagicModal/src/components/MagicModal.vue +38 -58
- package/dist/plugins/MagicModal/src/components/MagicModal.vue.d.ts +15 -15
- package/dist/plugins/MagicModal/src/composables/useModalApi.d.ts +4 -3
- package/dist/plugins/MagicModal/src/composables/useModalApi.mjs +4 -3
- package/dist/plugins/MagicModal/src/composables/useModalCallback.d.ts +22 -0
- package/dist/plugins/MagicModal/src/composables/useModalCallback.mjs +60 -0
- package/dist/plugins/MagicModal/src/types/index.d.ts +7 -5
- package/dist/plugins/MagicModal/src/utils/defaultOptions.d.ts +2 -2
- package/dist/plugins/MagicPlayer/src/composables/useControlsApi.mjs +1 -2
- package/dist/plugins/MagicPlayer/src/composables/useMediaApi.d.ts +1 -1
- package/dist/plugins/MagicPlayer/src/composables/useMediaApi.mjs +2 -3
- package/dist/plugins/MagicPlayer/src/composables/useRuntimeSourceProvider.mjs +1 -2
- package/dist/plugins/MagicPlayer/src/types/index.d.ts +1 -1
- package/dist/plugins/MagicScroll/index.mjs +2 -0
- package/dist/plugins/MagicScroll/src/components/MagicScrollCollision.vue +1 -1
- package/dist/plugins/MagicScroll/src/components/MagicScrollMotion.vue +58 -0
- package/dist/plugins/MagicScroll/src/components/MagicScrollMotion.vue.d.ts +42 -0
- package/dist/plugins/MagicScroll/src/components/MagicScrollTransform.vue.d.ts +9 -9
- package/dist/plugins/MagicScroll/src/composables/useProgress.d.ts +1 -1
- package/dist/plugins/MagicScroll/src/composables/useProgress.mjs +1 -2
- package/dist/plugins/MagicScroll/src/types/injectionKeys.d.ts +1 -2
- package/dist/plugins/MagicToast/demo/DemoToast.vue +22 -0
- package/dist/plugins/MagicToast/demo/DemoToast.vue.d.ts +14 -0
- package/dist/plugins/MagicToast/index.d.ts +5 -0
- package/dist/plugins/MagicToast/index.mjs +9 -0
- package/dist/plugins/MagicToast/nuxt.d.ts +2 -0
- package/dist/plugins/MagicToast/nuxt.mjs +5 -0
- package/dist/plugins/MagicToast/src/components/MagicToast.vue +229 -0
- package/dist/plugins/MagicToast/src/components/MagicToast.vue.d.ts +28 -0
- package/dist/plugins/MagicToast/src/components/MagicToastComponent.vue +101 -0
- package/dist/plugins/MagicToast/src/components/MagicToastComponent.vue.d.ts +48 -0
- package/dist/plugins/MagicToast/src/composables/useToastApi.d.ts +11 -0
- package/dist/plugins/MagicToast/src/composables/useToastApi.mjs +60 -0
- package/dist/plugins/MagicToast/src/composables/useToastCallback.d.ts +21 -0
- package/dist/plugins/MagicToast/src/composables/useToastCallback.mjs +43 -0
- package/dist/plugins/MagicToast/src/composables/useToastEmitter.d.ts +15 -0
- package/dist/plugins/MagicToast/src/composables/useToastEmitter.mjs +9 -0
- package/dist/plugins/MagicToast/src/composables/useToastInternalApi.d.ts +4 -0
- package/dist/plugins/MagicToast/src/composables/useToastInternalApi.mjs +26 -0
- package/dist/plugins/MagicToast/src/composables/useToastStore.d.ts +17 -0
- package/dist/plugins/MagicToast/src/composables/useToastStore.mjs +41 -0
- package/dist/plugins/MagicToast/src/types/index.d.ts +42 -0
- package/dist/plugins/MagicToast/src/types/index.mjs +0 -0
- package/dist/plugins/MagicToast/src/utils/defaultOptions.d.ts +3 -0
- package/dist/plugins/MagicToast/src/utils/defaultOptions.mjs +14 -0
- package/dist/plugins/index.d.ts +0 -3
- package/dist/plugins/index.mjs +0 -3
- package/package.json +19 -11
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../packages/composables/index.ts","../../packages/composables/useEasings/index.ts","../../packages/composables/useGlyphToSvg/index.ts","../../packages/composables/useScrollTo/index.ts","../../packages/composables/useViewportDimensions/index.ts"],"sourcesContent":["export * from './useEasings'\nexport * from './useGlyphToSvg'\nexport * from './useScrollTo'\nexport * from './useViewportDimensions'\n","export type EasingKey =\n | 'linear'\n | 'easeInQuad'\n | 'easeOutQuad'\n | 'easeInOutQuad'\n | 'easeInCubic'\n | 'easeOutCubic'\n | 'easeInOutCubic'\n | 'easeInQuart'\n | 'easeOutQuart'\n | 'easeInOutQuart'\n | 'easeInQuint'\n | 'easeOutQuint'\n | 'easeInOutQuint'\n\nexport type EasingFunction = (t: number) => number\n\nexport function useEasings() {\n const easings = {\n linear: (t: number) => t,\n easeInQuad: (t: number) => t * t,\n easeOutQuad: (t: number) => t * (2 - t),\n easeInOutQuad: (t: number) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),\n easeInCubic: (t: number) => t * t * t,\n easeOutCubic: (t: number) => --t * t * t + 1,\n easeInOutCubic: (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1,\n easeInQuart: (t: number) => t * t * t * t,\n easeOutQuart: (t: number) => 1 - --t * t * t * t,\n easeInOutQuart: (t: number) =>\n t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t,\n easeInQuint: (t: number) => t * t * t * t * t,\n easeOutQuint: (t: number) => 1 + --t * t * t * t * t,\n easeInOutQuint: (t: number) =>\n t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t,\n }\n\n return easings\n}\n","import { useClipboard } from '@vueuse/core'\nimport { unref } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Font } from 'fontkit'\n\nexport type useGlyphToSvgOptions = {\n fontSize: Ref<number> | number\n fontWeight: Ref<number> | number\n fontFile: Ref<Font> | Font\n}\n\nexport function useGlyphToSvg({\n fontSize,\n fontWeight,\n fontFile,\n}: useGlyphToSvgOptions) {\n const { copy } = useClipboard()\n const mappedFontFile = unref(fontFile)\n const mappedFontSize = unref(fontSize)\n const mappedFontWeight = unref(fontWeight)\n\n const loadVariableFont = () => {\n // @ts-ignore\n const variableFont = mappedFontFile.getVariation({\n wght: mappedFontWeight,\n })\n return variableFont\n }\n\n const convertToSvg = (glyph: any) => {\n // Scale according to current font size\n const scale = mappedFontSize / mappedFontFile.unitsPerEm\n const path = glyph.path.scale(scale, scale).scale(-1, 1).rotate(Math.PI)\n\n // Center inside square bounding box\n const bbox = path.bbox\n const minX = bbox.minX\n const minY = bbox.minY\n const height = bbox.height\n const width = bbox.width\n const dims = unref(fontSize)\n\n const centeredY = (height - dims) / 2 + minY\n const centeredX = (width - dims) / 2 + minX\n\n const viewBox = `${centeredX} ${centeredY} ${dims} ${dims}`\n\n let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"${viewBox}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">`\n svg += `<path d=\"${path.toSVG()}\" fill=\"currentColor\" />`\n svg += '</svg>'\n\n return svg\n }\n\n const renderSvg = async (codePoint: string) => {\n const font = await loadVariableFont()\n const glyph = font.glyphForCodePoint(codePoint)\n const svg = convertToSvg(glyph)\n return svg\n }\n\n const copySvg = async (codePoint: string) => {\n const svg = await renderSvg(codePoint)\n copy(svg)\n }\n\n return { copySvg, renderSvg }\n}\n","import { useEasings } from '../useEasings'\nimport { unrefElement } from '@vueuse/core'\nimport type { EasingFunction } from '../useEasings'\nimport type { MaybeComputedElementRef, MaybeElement } from '@vueuse/core'\n\nexport type ScrollToTarget =\n | string\n | Element\n | MaybeElement\n | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n parent?: Element | Window\n left: number\n top: number\n duration?: { x?: number; y?: number }\n easing?: EasingFunction\n callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n parent: Element | Window\n left: number\n top: number\n speed: number\n}\n\nexport type scrollToTargetParams = {\n target: ScrollToTarget\n parent?: ScrollToParent\n offset?: {\n x?: number\n y?: number\n }\n speed?: number\n easing?: EasingFunction\n}\n\nconst easings = useEasings()\n\nfunction min(a: number, b: number) {\n return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n if (parent === window) {\n return parent\n } else if (typeof parent === 'string') {\n return document.querySelector(parent) || document.documentElement\n } else {\n return (\n unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n document.documentElement\n )\n }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n if (typeof target === 'string') {\n const queryTarget = parentEl === window ? document : (parentEl as Element)\n return queryTarget.querySelector(target)\n } else {\n return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n }\n}\n\nexport function useScrollTo() {\n function getScrollPosition(element: Element | Window): {\n x: number\n y: number\n } {\n if (element === window) {\n return { x: window.pageXOffset, y: window.pageYOffset }\n } else if (element instanceof Element) {\n return { x: element.scrollLeft, y: element.scrollTop }\n } else {\n return { x: 0, y: 0 }\n }\n }\n\n function getDistance(element: Element): { top: number; left: number } {\n const rect = element.getBoundingClientRect()\n const scrollEl = document.scrollingElement || document.documentElement\n\n return {\n top: rect.top + scrollEl.scrollTop,\n left: rect.left + scrollEl.scrollLeft,\n }\n }\n\n function getScrollDuration({\n parent = document.documentElement || document.body,\n left = 0,\n top = 0,\n speed = 500,\n }: getScrollDurationParams) {\n const currentPos = getScrollPosition(parent)\n const distanceX = currentPos.x - left\n const distanceY = currentPos.y - top\n const durationX = Math.abs((distanceX / speed) * 100)\n const durationY = Math.abs((distanceY / speed) * 100)\n\n return { x: durationX, y: durationY }\n }\n\n function scrollTo({\n parent = document.documentElement || document.body,\n top,\n left,\n duration = {},\n easing = easings.easeOutQuad,\n callback,\n }: ScrollToParams) {\n const startTime = Date.now()\n const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n if (fromX === top && fromY === left) {\n if (callback) callback()\n return\n }\n\n const mappedDuration = { x: 500, y: 500, ...duration }\n\n const scroll = () => {\n const currentTime = Date.now()\n\n const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n const easedTimeX = easing(timeX)\n const easedTimeY = easing(timeY)\n\n // We use the min of the two times to make sure we scroll at the same speed\n const minTime = Math.min(easedTimeX, easedTimeY)\n\n parent.scroll({\n left: minTime * (left - fromX) + fromX,\n top: minTime * (top - fromY) + fromY,\n })\n\n if (easedTimeX < 1 || easedTimeY < 1) {\n requestAnimationFrame(scroll)\n } else if (callback) {\n callback()\n }\n }\n\n requestAnimationFrame(scroll)\n }\n\n function scrollToTarget({\n target,\n parent = document.documentElement || document.body,\n offset = {},\n speed = 500,\n easing = easings.easeOutQuad,\n }: scrollToTargetParams) {\n let parentEl = unwrapParent(parent)\n if (!parentEl) return\n let targetEl = unwrapTarget(target, parentEl)\n if (!targetEl) return\n\n const mappedOffset = { x: 0, y: 0, ...offset }\n const distance = getDistance(targetEl)\n const leftDistance = distance.left - mappedOffset.x\n const topDistance = distance.top - mappedOffset.y\n\n const scrollDuration = getScrollDuration({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n speed: speed,\n })\n\n scrollTo({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n duration: scrollDuration,\n easing: easing,\n })\n }\n\n return {\n getScrollPosition,\n getDistance,\n getScrollDuration,\n scrollTo,\n scrollToTarget,\n }\n}\n","import { onMounted, onUnmounted } from 'vue'\n\nexport type UseViewportDimensionsOptions = {\n width?: false | string\n height?: false | string\n initialWidth?: false | string\n initialHeight?: false | string\n}\n\nexport function useViewportDimensions(options?: UseViewportDimensionsOptions) {\n const mappedOptions = {\n width: '--vw',\n height: '--vh',\n initialWidth: '--initial-vw',\n initialHeight: '--initial-vh',\n ...options,\n }\n\n const setViewportWidth = (initial?: boolean) => {\n const vw = Number(window.innerWidth * 0.01).toFixed(2)\n\n if (mappedOptions.width) {\n document.documentElement.style.setProperty(mappedOptions.width, `${vw}px`)\n }\n\n if (initial && mappedOptions.initialWidth) {\n document.documentElement.style.setProperty(\n mappedOptions.initialWidth,\n `${vw}px`\n )\n }\n }\n\n const setViewportHeight = (initial?: boolean) => {\n const vh = Number(window.innerHeight * 0.01).toFixed(2)\n\n if (mappedOptions.height) {\n document.documentElement.style.setProperty(\n mappedOptions.height || '--vh',\n `${vh}px`\n )\n }\n\n if (initial && mappedOptions.initialHeight) {\n document.documentElement.style.setProperty(\n mappedOptions.initialHeight || '--initial-vh',\n `${vh}px`\n )\n }\n }\n\n const setDimensions = () => {\n setViewportWidth()\n setViewportHeight()\n }\n\n onMounted(() => {\n setViewportWidth(true)\n setViewportHeight(true)\n\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n\n onUnmounted(() => {\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n}\n"],"mappings":"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","names":["easings","import_core","import_vue"]}
|
|
1
|
+
{"version":3,"sources":["../../packages/composables/index.ts","../../packages/composables/useEasings/index.ts","../../packages/composables/useGlyphToSvg/index.ts","../../packages/composables/useScrollTo/index.ts","../../packages/composables/useViewportDimensions/index.ts"],"sourcesContent":["export * from './useEasings'\nexport * from './useGlyphToSvg'\nexport * from './useScrollTo'\nexport * from './useViewportDimensions'\n","export type EasingKey =\n | 'linear'\n | 'easeInQuad'\n | 'easeOutQuad'\n | 'easeInOutQuad'\n | 'easeInCubic'\n | 'easeOutCubic'\n | 'easeInOutCubic'\n | 'easeInQuart'\n | 'easeOutQuart'\n | 'easeInOutQuart'\n | 'easeInQuint'\n | 'easeOutQuint'\n | 'easeInOutQuint'\n\nexport type EasingFunction = (t: number) => number\n\nexport function useEasings() {\n const easings = {\n linear: (t: number) => t,\n easeInQuad: (t: number) => t * t,\n easeOutQuad: (t: number) => t * (2 - t),\n easeInOutQuad: (t: number) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),\n easeInCubic: (t: number) => t * t * t,\n easeOutCubic: (t: number) => --t * t * t + 1,\n easeInOutCubic: (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1,\n easeInQuart: (t: number) => t * t * t * t,\n easeOutQuart: (t: number) => 1 - --t * t * t * t,\n easeInOutQuart: (t: number) =>\n t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t,\n easeInQuint: (t: number) => t * t * t * t * t,\n easeOutQuint: (t: number) => 1 + --t * t * t * t * t,\n easeInOutQuint: (t: number) =>\n t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t,\n }\n\n return easings\n}\n","import { useClipboard } from '@vueuse/core'\nimport { unref } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Font } from 'fontkit'\n\nexport type useGlyphToSvgOptions = {\n fontSize: Ref<number> | number\n fontWeight: Ref<number> | number\n fontFile: Ref<Font> | Font\n}\n\nexport function useGlyphToSvg({\n fontSize,\n fontWeight,\n fontFile,\n}: useGlyphToSvgOptions) {\n const { copy } = useClipboard()\n const mappedFontFile = unref(fontFile)\n const mappedFontSize = unref(fontSize)\n const mappedFontWeight = unref(fontWeight)\n\n const loadVariableFont = () => {\n // @ts-ignore\n const variableFont = mappedFontFile.getVariation({\n wght: mappedFontWeight,\n })\n return variableFont\n }\n\n const convertToSvg = (glyph: any) => {\n // Scale according to current font size\n const scale = mappedFontSize / mappedFontFile.unitsPerEm\n const path = glyph.path.scale(scale, scale).scale(-1, 1).rotate(Math.PI)\n\n // Center inside square bounding box\n const bbox = path.bbox\n const minX = bbox.minX\n const minY = bbox.minY\n const height = bbox.height\n const width = bbox.width\n const dims = unref(fontSize)\n\n const centeredY = (height - dims) / 2 + minY\n const centeredX = (width - dims) / 2 + minX\n\n const viewBox = `${centeredX} ${centeredY} ${dims} ${dims}`\n\n let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"${viewBox}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">`\n svg += `<path d=\"${path.toSVG()}\" fill=\"currentColor\" />`\n svg += '</svg>'\n\n return svg\n }\n\n const renderSvg = async (codePoint: string) => {\n const font = await loadVariableFont()\n const glyph = font.glyphForCodePoint(codePoint)\n const svg = convertToSvg(glyph)\n return svg\n }\n\n const copySvg = async (codePoint: string) => {\n const svg = await renderSvg(codePoint)\n copy(svg)\n }\n\n return { copySvg, renderSvg }\n}\n","import { useEasings } from '../useEasings'\nimport { unrefElement } from '@vueuse/core'\nimport type { EasingFunction } from '../useEasings'\nimport type { MaybeComputedElementRef, MaybeElement } from '@vueuse/core'\n\nexport type ScrollToTarget =\n | string\n | Element\n | MaybeElement\n | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n parent?: Element | Window\n left: number\n top: number\n duration?: { x?: number; y?: number }\n easing?: EasingFunction\n callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n parent: Element | Window\n left: number\n top: number\n speed: number\n}\n\nexport type scrollToTargetParams = {\n target: ScrollToTarget\n parent?: ScrollToParent\n offset?: {\n x?: number\n y?: number\n }\n speed?: number\n easing?: EasingFunction\n}\n\nconst easings = useEasings()\n\nfunction min(a: number, b: number) {\n return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n if (parent === window) {\n return parent\n } else if (typeof parent === 'string') {\n return document.querySelector(parent) || document.documentElement\n } else {\n return (\n unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n document.documentElement\n )\n }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n if (typeof target === 'string') {\n const queryTarget = parentEl === window ? document : (parentEl as Element)\n return queryTarget.querySelector(target)\n } else {\n return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n }\n}\n\nexport function useScrollTo() {\n function getScrollPosition(element: Element | Window): {\n x: number\n y: number\n } {\n if (element === window) {\n return { x: window.pageXOffset, y: window.pageYOffset }\n } else if (element instanceof Element) {\n return { x: element.scrollLeft, y: element.scrollTop }\n } else {\n return { x: 0, y: 0 }\n }\n }\n\n function getDistance(element: Element): { top: number; left: number } {\n const rect = element.getBoundingClientRect()\n const scrollEl = document.scrollingElement || document.documentElement\n\n return {\n top: rect.top + scrollEl.scrollTop,\n left: rect.left + scrollEl.scrollLeft,\n }\n }\n\n function getScrollDuration({\n parent = document.documentElement || document.body,\n left = 0,\n top = 0,\n speed = 500,\n }: getScrollDurationParams) {\n const currentPos = getScrollPosition(parent)\n const distanceX = currentPos.x - left\n const distanceY = currentPos.y - top\n const durationX = Math.abs((distanceX / speed) * 100)\n const durationY = Math.abs((distanceY / speed) * 100)\n\n return { x: durationX, y: durationY }\n }\n\n function scrollTo({\n parent = document.documentElement || document.body,\n top,\n left,\n duration = {},\n easing = easings.easeOutQuad,\n callback,\n }: ScrollToParams) {\n const startTime = Date.now()\n const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n if (fromX === top && fromY === left) {\n if (callback) callback()\n return\n }\n\n const mappedDuration = { x: 500, y: 500, ...duration }\n\n const scroll = () => {\n const currentTime = Date.now()\n\n const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n const easedTimeX = easing(timeX)\n const easedTimeY = easing(timeY)\n\n // We use the min of the two times to make sure we scroll at the same speed\n const minTime = Math.min(easedTimeX, easedTimeY)\n\n parent.scroll({\n left: minTime * (left - fromX) + fromX,\n top: minTime * (top - fromY) + fromY,\n })\n\n if (easedTimeX < 1 || easedTimeY < 1) {\n requestAnimationFrame(scroll)\n } else if (callback) {\n callback()\n }\n }\n\n requestAnimationFrame(scroll)\n }\n\n function scrollToTarget({\n target,\n parent = document.documentElement || document.body,\n offset = {},\n speed = 500,\n easing = easings.easeOutQuad,\n }: scrollToTargetParams) {\n let parentEl = unwrapParent(parent)\n if (!parentEl) return\n let targetEl = unwrapTarget(target, parentEl)\n if (!targetEl) return\n\n const mappedOffset = { x: 0, y: 0, ...offset }\n const distance = getDistance(targetEl)\n const leftDistance = distance.left - mappedOffset.x\n const topDistance = distance.top - mappedOffset.y\n\n const scrollDuration = getScrollDuration({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n speed: speed,\n })\n\n scrollTo({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n duration: scrollDuration,\n easing: easing,\n })\n }\n\n return {\n getScrollPosition,\n getDistance,\n getScrollDuration,\n scrollTo,\n scrollToTarget,\n }\n}\n","import { onMounted, onUnmounted } from 'vue'\n\nexport type UseViewportDimensionsOptions = {\n width?: false | string\n height?: false | string\n initialWidth?: false | string\n initialHeight?: false | string\n}\n\nexport function useViewportDimensions(options?: UseViewportDimensionsOptions) {\n const mappedOptions = {\n width: '--vw',\n height: '--vh',\n initialWidth: '--initial-vw',\n initialHeight: '--initial-vh',\n ...options,\n }\n\n const setViewportWidth = (initial?: boolean) => {\n const vw = Number(window.innerWidth * 0.01).toFixed(2)\n\n if (mappedOptions.width) {\n document.documentElement.style.setProperty(mappedOptions.width, `${vw}px`)\n }\n\n if (initial && mappedOptions.initialWidth) {\n document.documentElement.style.setProperty(\n mappedOptions.initialWidth,\n `${vw}px`,\n )\n }\n }\n\n const setViewportHeight = (initial?: boolean) => {\n const vh = Number(window.innerHeight * 0.01).toFixed(2)\n\n if (mappedOptions.height) {\n document.documentElement.style.setProperty(\n mappedOptions.height || '--vh',\n `${vh}px`,\n )\n }\n\n if (initial && mappedOptions.initialHeight) {\n document.documentElement.style.setProperty(\n mappedOptions.initialHeight || '--initial-vh',\n `${vh}px`,\n )\n }\n }\n\n const setDimensions = () => {\n setViewportWidth()\n setViewportHeight()\n }\n\n onMounted(() => {\n setViewportWidth(true)\n setViewportHeight(true)\n\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n\n onUnmounted(() => {\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n}\n"],"mappings":"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","names":["easings","import_core","import_vue"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../packages/composables/useEasings/index.ts","../../packages/composables/useGlyphToSvg/index.ts","../../packages/composables/useScrollTo/index.ts","../../packages/composables/useViewportDimensions/index.ts"],"sourcesContent":["export type EasingKey =\n | 'linear'\n | 'easeInQuad'\n | 'easeOutQuad'\n | 'easeInOutQuad'\n | 'easeInCubic'\n | 'easeOutCubic'\n | 'easeInOutCubic'\n | 'easeInQuart'\n | 'easeOutQuart'\n | 'easeInOutQuart'\n | 'easeInQuint'\n | 'easeOutQuint'\n | 'easeInOutQuint'\n\nexport type EasingFunction = (t: number) => number\n\nexport function useEasings() {\n const easings = {\n linear: (t: number) => t,\n easeInQuad: (t: number) => t * t,\n easeOutQuad: (t: number) => t * (2 - t),\n easeInOutQuad: (t: number) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),\n easeInCubic: (t: number) => t * t * t,\n easeOutCubic: (t: number) => --t * t * t + 1,\n easeInOutCubic: (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1,\n easeInQuart: (t: number) => t * t * t * t,\n easeOutQuart: (t: number) => 1 - --t * t * t * t,\n easeInOutQuart: (t: number) =>\n t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t,\n easeInQuint: (t: number) => t * t * t * t * t,\n easeOutQuint: (t: number) => 1 + --t * t * t * t * t,\n easeInOutQuint: (t: number) =>\n t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t,\n }\n\n return easings\n}\n","import { useClipboard } from '@vueuse/core'\nimport { unref } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Font } from 'fontkit'\n\nexport type useGlyphToSvgOptions = {\n fontSize: Ref<number> | number\n fontWeight: Ref<number> | number\n fontFile: Ref<Font> | Font\n}\n\nexport function useGlyphToSvg({\n fontSize,\n fontWeight,\n fontFile,\n}: useGlyphToSvgOptions) {\n const { copy } = useClipboard()\n const mappedFontFile = unref(fontFile)\n const mappedFontSize = unref(fontSize)\n const mappedFontWeight = unref(fontWeight)\n\n const loadVariableFont = () => {\n // @ts-ignore\n const variableFont = mappedFontFile.getVariation({\n wght: mappedFontWeight,\n })\n return variableFont\n }\n\n const convertToSvg = (glyph: any) => {\n // Scale according to current font size\n const scale = mappedFontSize / mappedFontFile.unitsPerEm\n const path = glyph.path.scale(scale, scale).scale(-1, 1).rotate(Math.PI)\n\n // Center inside square bounding box\n const bbox = path.bbox\n const minX = bbox.minX\n const minY = bbox.minY\n const height = bbox.height\n const width = bbox.width\n const dims = unref(fontSize)\n\n const centeredY = (height - dims) / 2 + minY\n const centeredX = (width - dims) / 2 + minX\n\n const viewBox = `${centeredX} ${centeredY} ${dims} ${dims}`\n\n let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"${viewBox}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">`\n svg += `<path d=\"${path.toSVG()}\" fill=\"currentColor\" />`\n svg += '</svg>'\n\n return svg\n }\n\n const renderSvg = async (codePoint: string) => {\n const font = await loadVariableFont()\n const glyph = font.glyphForCodePoint(codePoint)\n const svg = convertToSvg(glyph)\n return svg\n }\n\n const copySvg = async (codePoint: string) => {\n const svg = await renderSvg(codePoint)\n copy(svg)\n }\n\n return { copySvg, renderSvg }\n}\n","import { useEasings } from '../useEasings'\nimport { unrefElement } from '@vueuse/core'\nimport type { EasingFunction } from '../useEasings'\nimport type { MaybeComputedElementRef, MaybeElement } from '@vueuse/core'\n\nexport type ScrollToTarget =\n | string\n | Element\n | MaybeElement\n | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n parent?: Element | Window\n left: number\n top: number\n duration?: { x?: number; y?: number }\n easing?: EasingFunction\n callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n parent: Element | Window\n left: number\n top: number\n speed: number\n}\n\nexport type scrollToTargetParams = {\n target: ScrollToTarget\n parent?: ScrollToParent\n offset?: {\n x?: number\n y?: number\n }\n speed?: number\n easing?: EasingFunction\n}\n\nconst easings = useEasings()\n\nfunction min(a: number, b: number) {\n return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n if (parent === window) {\n return parent\n } else if (typeof parent === 'string') {\n return document.querySelector(parent) || document.documentElement\n } else {\n return (\n unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n document.documentElement\n )\n }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n if (typeof target === 'string') {\n const queryTarget = parentEl === window ? document : (parentEl as Element)\n return queryTarget.querySelector(target)\n } else {\n return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n }\n}\n\nexport function useScrollTo() {\n function getScrollPosition(element: Element | Window): {\n x: number\n y: number\n } {\n if (element === window) {\n return { x: window.pageXOffset, y: window.pageYOffset }\n } else if (element instanceof Element) {\n return { x: element.scrollLeft, y: element.scrollTop }\n } else {\n return { x: 0, y: 0 }\n }\n }\n\n function getDistance(element: Element): { top: number; left: number } {\n const rect = element.getBoundingClientRect()\n const scrollEl = document.scrollingElement || document.documentElement\n\n return {\n top: rect.top + scrollEl.scrollTop,\n left: rect.left + scrollEl.scrollLeft,\n }\n }\n\n function getScrollDuration({\n parent = document.documentElement || document.body,\n left = 0,\n top = 0,\n speed = 500,\n }: getScrollDurationParams) {\n const currentPos = getScrollPosition(parent)\n const distanceX = currentPos.x - left\n const distanceY = currentPos.y - top\n const durationX = Math.abs((distanceX / speed) * 100)\n const durationY = Math.abs((distanceY / speed) * 100)\n\n return { x: durationX, y: durationY }\n }\n\n function scrollTo({\n parent = document.documentElement || document.body,\n top,\n left,\n duration = {},\n easing = easings.easeOutQuad,\n callback,\n }: ScrollToParams) {\n const startTime = Date.now()\n const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n if (fromX === top && fromY === left) {\n if (callback) callback()\n return\n }\n\n const mappedDuration = { x: 500, y: 500, ...duration }\n\n const scroll = () => {\n const currentTime = Date.now()\n\n const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n const easedTimeX = easing(timeX)\n const easedTimeY = easing(timeY)\n\n // We use the min of the two times to make sure we scroll at the same speed\n const minTime = Math.min(easedTimeX, easedTimeY)\n\n parent.scroll({\n left: minTime * (left - fromX) + fromX,\n top: minTime * (top - fromY) + fromY,\n })\n\n if (easedTimeX < 1 || easedTimeY < 1) {\n requestAnimationFrame(scroll)\n } else if (callback) {\n callback()\n }\n }\n\n requestAnimationFrame(scroll)\n }\n\n function scrollToTarget({\n target,\n parent = document.documentElement || document.body,\n offset = {},\n speed = 500,\n easing = easings.easeOutQuad,\n }: scrollToTargetParams) {\n let parentEl = unwrapParent(parent)\n if (!parentEl) return\n let targetEl = unwrapTarget(target, parentEl)\n if (!targetEl) return\n\n const mappedOffset = { x: 0, y: 0, ...offset }\n const distance = getDistance(targetEl)\n const leftDistance = distance.left - mappedOffset.x\n const topDistance = distance.top - mappedOffset.y\n\n const scrollDuration = getScrollDuration({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n speed: speed,\n })\n\n scrollTo({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n duration: scrollDuration,\n easing: easing,\n })\n }\n\n return {\n getScrollPosition,\n getDistance,\n getScrollDuration,\n scrollTo,\n scrollToTarget,\n }\n}\n","import { onMounted, onUnmounted } from 'vue'\n\nexport type UseViewportDimensionsOptions = {\n width?: false | string\n height?: false | string\n initialWidth?: false | string\n initialHeight?: false | string\n}\n\nexport function useViewportDimensions(options?: UseViewportDimensionsOptions) {\n const mappedOptions = {\n width: '--vw',\n height: '--vh',\n initialWidth: '--initial-vw',\n initialHeight: '--initial-vh',\n ...options,\n }\n\n const setViewportWidth = (initial?: boolean) => {\n const vw = Number(window.innerWidth * 0.01).toFixed(2)\n\n if (mappedOptions.width) {\n document.documentElement.style.setProperty(mappedOptions.width, `${vw}px`)\n }\n\n if (initial && mappedOptions.initialWidth) {\n document.documentElement.style.setProperty(\n mappedOptions.initialWidth,\n `${vw}px`\n )\n }\n }\n\n const setViewportHeight = (initial?: boolean) => {\n const vh = Number(window.innerHeight * 0.01).toFixed(2)\n\n if (mappedOptions.height) {\n document.documentElement.style.setProperty(\n mappedOptions.height || '--vh',\n `${vh}px`\n )\n }\n\n if (initial && mappedOptions.initialHeight) {\n document.documentElement.style.setProperty(\n mappedOptions.initialHeight || '--initial-vh',\n `${vh}px`\n )\n }\n }\n\n const setDimensions = () => {\n setViewportWidth()\n setViewportHeight()\n }\n\n onMounted(() => {\n setViewportWidth(true)\n setViewportHeight(true)\n\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n\n onUnmounted(() => {\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n}\n"],"mappings":"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","names":["easings"]}
|
|
1
|
+
{"version":3,"sources":["../../packages/composables/useEasings/index.ts","../../packages/composables/useGlyphToSvg/index.ts","../../packages/composables/useScrollTo/index.ts","../../packages/composables/useViewportDimensions/index.ts"],"sourcesContent":["export type EasingKey =\n | 'linear'\n | 'easeInQuad'\n | 'easeOutQuad'\n | 'easeInOutQuad'\n | 'easeInCubic'\n | 'easeOutCubic'\n | 'easeInOutCubic'\n | 'easeInQuart'\n | 'easeOutQuart'\n | 'easeInOutQuart'\n | 'easeInQuint'\n | 'easeOutQuint'\n | 'easeInOutQuint'\n\nexport type EasingFunction = (t: number) => number\n\nexport function useEasings() {\n const easings = {\n linear: (t: number) => t,\n easeInQuad: (t: number) => t * t,\n easeOutQuad: (t: number) => t * (2 - t),\n easeInOutQuad: (t: number) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),\n easeInCubic: (t: number) => t * t * t,\n easeOutCubic: (t: number) => --t * t * t + 1,\n easeInOutCubic: (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1,\n easeInQuart: (t: number) => t * t * t * t,\n easeOutQuart: (t: number) => 1 - --t * t * t * t,\n easeInOutQuart: (t: number) =>\n t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t,\n easeInQuint: (t: number) => t * t * t * t * t,\n easeOutQuint: (t: number) => 1 + --t * t * t * t * t,\n easeInOutQuint: (t: number) =>\n t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t,\n }\n\n return easings\n}\n","import { useClipboard } from '@vueuse/core'\nimport { unref } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Font } from 'fontkit'\n\nexport type useGlyphToSvgOptions = {\n fontSize: Ref<number> | number\n fontWeight: Ref<number> | number\n fontFile: Ref<Font> | Font\n}\n\nexport function useGlyphToSvg({\n fontSize,\n fontWeight,\n fontFile,\n}: useGlyphToSvgOptions) {\n const { copy } = useClipboard()\n const mappedFontFile = unref(fontFile)\n const mappedFontSize = unref(fontSize)\n const mappedFontWeight = unref(fontWeight)\n\n const loadVariableFont = () => {\n // @ts-ignore\n const variableFont = mappedFontFile.getVariation({\n wght: mappedFontWeight,\n })\n return variableFont\n }\n\n const convertToSvg = (glyph: any) => {\n // Scale according to current font size\n const scale = mappedFontSize / mappedFontFile.unitsPerEm\n const path = glyph.path.scale(scale, scale).scale(-1, 1).rotate(Math.PI)\n\n // Center inside square bounding box\n const bbox = path.bbox\n const minX = bbox.minX\n const minY = bbox.minY\n const height = bbox.height\n const width = bbox.width\n const dims = unref(fontSize)\n\n const centeredY = (height - dims) / 2 + minY\n const centeredX = (width - dims) / 2 + minX\n\n const viewBox = `${centeredX} ${centeredY} ${dims} ${dims}`\n\n let svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"${viewBox}\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">`\n svg += `<path d=\"${path.toSVG()}\" fill=\"currentColor\" />`\n svg += '</svg>'\n\n return svg\n }\n\n const renderSvg = async (codePoint: string) => {\n const font = await loadVariableFont()\n const glyph = font.glyphForCodePoint(codePoint)\n const svg = convertToSvg(glyph)\n return svg\n }\n\n const copySvg = async (codePoint: string) => {\n const svg = await renderSvg(codePoint)\n copy(svg)\n }\n\n return { copySvg, renderSvg }\n}\n","import { useEasings } from '../useEasings'\nimport { unrefElement } from '@vueuse/core'\nimport type { EasingFunction } from '../useEasings'\nimport type { MaybeComputedElementRef, MaybeElement } from '@vueuse/core'\n\nexport type ScrollToTarget =\n | string\n | Element\n | MaybeElement\n | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n parent?: Element | Window\n left: number\n top: number\n duration?: { x?: number; y?: number }\n easing?: EasingFunction\n callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n parent: Element | Window\n left: number\n top: number\n speed: number\n}\n\nexport type scrollToTargetParams = {\n target: ScrollToTarget\n parent?: ScrollToParent\n offset?: {\n x?: number\n y?: number\n }\n speed?: number\n easing?: EasingFunction\n}\n\nconst easings = useEasings()\n\nfunction min(a: number, b: number) {\n return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n if (parent === window) {\n return parent\n } else if (typeof parent === 'string') {\n return document.querySelector(parent) || document.documentElement\n } else {\n return (\n unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n document.documentElement\n )\n }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n if (typeof target === 'string') {\n const queryTarget = parentEl === window ? document : (parentEl as Element)\n return queryTarget.querySelector(target)\n } else {\n return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n }\n}\n\nexport function useScrollTo() {\n function getScrollPosition(element: Element | Window): {\n x: number\n y: number\n } {\n if (element === window) {\n return { x: window.pageXOffset, y: window.pageYOffset }\n } else if (element instanceof Element) {\n return { x: element.scrollLeft, y: element.scrollTop }\n } else {\n return { x: 0, y: 0 }\n }\n }\n\n function getDistance(element: Element): { top: number; left: number } {\n const rect = element.getBoundingClientRect()\n const scrollEl = document.scrollingElement || document.documentElement\n\n return {\n top: rect.top + scrollEl.scrollTop,\n left: rect.left + scrollEl.scrollLeft,\n }\n }\n\n function getScrollDuration({\n parent = document.documentElement || document.body,\n left = 0,\n top = 0,\n speed = 500,\n }: getScrollDurationParams) {\n const currentPos = getScrollPosition(parent)\n const distanceX = currentPos.x - left\n const distanceY = currentPos.y - top\n const durationX = Math.abs((distanceX / speed) * 100)\n const durationY = Math.abs((distanceY / speed) * 100)\n\n return { x: durationX, y: durationY }\n }\n\n function scrollTo({\n parent = document.documentElement || document.body,\n top,\n left,\n duration = {},\n easing = easings.easeOutQuad,\n callback,\n }: ScrollToParams) {\n const startTime = Date.now()\n const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n if (fromX === top && fromY === left) {\n if (callback) callback()\n return\n }\n\n const mappedDuration = { x: 500, y: 500, ...duration }\n\n const scroll = () => {\n const currentTime = Date.now()\n\n const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n const easedTimeX = easing(timeX)\n const easedTimeY = easing(timeY)\n\n // We use the min of the two times to make sure we scroll at the same speed\n const minTime = Math.min(easedTimeX, easedTimeY)\n\n parent.scroll({\n left: minTime * (left - fromX) + fromX,\n top: minTime * (top - fromY) + fromY,\n })\n\n if (easedTimeX < 1 || easedTimeY < 1) {\n requestAnimationFrame(scroll)\n } else if (callback) {\n callback()\n }\n }\n\n requestAnimationFrame(scroll)\n }\n\n function scrollToTarget({\n target,\n parent = document.documentElement || document.body,\n offset = {},\n speed = 500,\n easing = easings.easeOutQuad,\n }: scrollToTargetParams) {\n let parentEl = unwrapParent(parent)\n if (!parentEl) return\n let targetEl = unwrapTarget(target, parentEl)\n if (!targetEl) return\n\n const mappedOffset = { x: 0, y: 0, ...offset }\n const distance = getDistance(targetEl)\n const leftDistance = distance.left - mappedOffset.x\n const topDistance = distance.top - mappedOffset.y\n\n const scrollDuration = getScrollDuration({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n speed: speed,\n })\n\n scrollTo({\n parent: parentEl,\n left: leftDistance,\n top: topDistance,\n duration: scrollDuration,\n easing: easing,\n })\n }\n\n return {\n getScrollPosition,\n getDistance,\n getScrollDuration,\n scrollTo,\n scrollToTarget,\n }\n}\n","import { onMounted, onUnmounted } from 'vue'\n\nexport type UseViewportDimensionsOptions = {\n width?: false | string\n height?: false | string\n initialWidth?: false | string\n initialHeight?: false | string\n}\n\nexport function useViewportDimensions(options?: UseViewportDimensionsOptions) {\n const mappedOptions = {\n width: '--vw',\n height: '--vh',\n initialWidth: '--initial-vw',\n initialHeight: '--initial-vh',\n ...options,\n }\n\n const setViewportWidth = (initial?: boolean) => {\n const vw = Number(window.innerWidth * 0.01).toFixed(2)\n\n if (mappedOptions.width) {\n document.documentElement.style.setProperty(mappedOptions.width, `${vw}px`)\n }\n\n if (initial && mappedOptions.initialWidth) {\n document.documentElement.style.setProperty(\n mappedOptions.initialWidth,\n `${vw}px`,\n )\n }\n }\n\n const setViewportHeight = (initial?: boolean) => {\n const vh = Number(window.innerHeight * 0.01).toFixed(2)\n\n if (mappedOptions.height) {\n document.documentElement.style.setProperty(\n mappedOptions.height || '--vh',\n `${vh}px`,\n )\n }\n\n if (initial && mappedOptions.initialHeight) {\n document.documentElement.style.setProperty(\n mappedOptions.initialHeight || '--initial-vh',\n `${vh}px`,\n )\n }\n }\n\n const setDimensions = () => {\n setViewportWidth()\n setViewportHeight()\n }\n\n onMounted(() => {\n setViewportWidth(true)\n setViewportHeight(true)\n\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n\n onUnmounted(() => {\n window.addEventListener('resize', setDimensions, { passive: true })\n })\n}\n"],"mappings":";AAiBO,SAAS,aAAa;AAC3B,QAAMA,WAAU;AAAA,IACd,QAAQ,CAAC,MAAc;AAAA,IACvB,YAAY,CAAC,MAAc,IAAI;AAAA,IAC/B,aAAa,CAAC,MAAc,KAAK,IAAI;AAAA,IACrC,eAAe,CAAC,MAAe,IAAI,MAAM,IAAI,IAAI,IAAI,MAAM,IAAI,IAAI,KAAK;AAAA,IACxE,aAAa,CAAC,MAAc,IAAI,IAAI;AAAA,IACpC,cAAc,CAAC,MAAc,EAAE,IAAI,IAAI,IAAI;AAAA,IAC3C,gBAAgB,CAAC,MACf,IAAI,MAAM,IAAI,IAAI,IAAI,KAAK,IAAI,MAAM,IAAI,IAAI,MAAM,IAAI,IAAI,KAAK;AAAA,IAClE,aAAa,CAAC,MAAc,IAAI,IAAI,IAAI;AAAA,IACxC,cAAc,CAAC,MAAc,IAAI,EAAE,IAAI,IAAI,IAAI;AAAA,IAC/C,gBAAgB,CAAC,MACf,IAAI,MAAM,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,EAAE,IAAI,IAAI,IAAI;AAAA,IACtD,aAAa,CAAC,MAAc,IAAI,IAAI,IAAI,IAAI;AAAA,IAC5C,cAAc,CAAC,MAAc,IAAI,EAAE,IAAI,IAAI,IAAI,IAAI;AAAA,IACnD,gBAAgB,CAAC,MACf,IAAI,MAAM,KAAK,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,KAAK,EAAE,IAAI,IAAI,IAAI,IAAI;AAAA,EAClE;AAEA,SAAOA;AACT;;;ACtCA,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AAWf,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,EAAE,KAAK,IAAI,aAAa;AAC9B,QAAM,iBAAiB,MAAM,QAAQ;AACrC,QAAM,iBAAiB,MAAM,QAAQ;AACrC,QAAM,mBAAmB,MAAM,UAAU;AAEzC,QAAM,mBAAmB,MAAM;AAE7B,UAAM,eAAe,eAAe,aAAa;AAAA,MAC/C,MAAM;AAAA,IACR,CAAC;AACD,WAAO;AAAA,EACT;AAEA,QAAM,eAAe,CAAC,UAAe;AAEnC,UAAM,QAAQ,iBAAiB,eAAe;AAC9C,UAAM,OAAO,MAAM,KAAK,MAAM,OAAO,KAAK,EAAE,MAAM,IAAI,CAAC,EAAE,OAAO,KAAK,EAAE;AAGvE,UAAM,OAAO,KAAK;AAClB,UAAM,OAAO,KAAK;AAClB,UAAM,OAAO,KAAK;AAClB,UAAM,SAAS,KAAK;AACpB,UAAM,QAAQ,KAAK;AACnB,UAAM,OAAO,MAAM,QAAQ;AAE3B,UAAM,aAAa,SAAS,QAAQ,IAAI;AACxC,UAAM,aAAa,QAAQ,QAAQ,IAAI;AAEvC,UAAM,UAAU,GAAG,SAAS,IAAI,SAAS,IAAI,IAAI,IAAI,IAAI;AAEzD,QAAI,MAAM,oDAAoD,OAAO;AACrE,WAAO,YAAY,KAAK,MAAM,CAAC;AAC/B,WAAO;AAEP,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,OAAO,cAAsB;AAC7C,UAAM,OAAO,MAAM,iBAAiB;AACpC,UAAM,QAAQ,KAAK,kBAAkB,SAAS;AAC9C,UAAM,MAAM,aAAa,KAAK;AAC9B,WAAO;AAAA,EACT;AAEA,QAAM,UAAU,OAAO,cAAsB;AAC3C,UAAM,MAAM,MAAM,UAAU,SAAS;AACrC,SAAK,GAAG;AAAA,EACV;AAEA,SAAO,EAAE,SAAS,UAAU;AAC9B;;;ACnEA,SAAS,oBAAoB;AAuC7B,IAAM,UAAU,WAAW;AAE3B,SAAS,IAAI,GAAW,GAAW;AACjC,SAAO,IAAI,IAAI,IAAI;AACrB;AAEA,SAAS,aAAa,QAAwB;AAC5C,MAAI,WAAW,QAAQ;AACrB,WAAO;AAAA,EACT,WAAW,OAAO,WAAW,UAAU;AACrC,WAAO,SAAS,cAAc,MAAM,KAAK,SAAS;AAAA,EACpD,OAAO;AACL,WACE,aAAa,MAA+C,KAC5D,SAAS;AAAA,EAEb;AACF;AAEA,SAAS,aAAa,QAAwB,UAA4B;AACxE,MAAI,OAAO,WAAW,UAAU;AAC9B,UAAM,cAAc,aAAa,SAAS,WAAY;AACtD,WAAO,YAAY,cAAc,MAAM;AAAA,EACzC,OAAO;AACL,WAAO,aAAa,MAA+C;AAAA,EACrE;AACF;AAEO,SAAS,cAAc;AAC5B,WAAS,kBAAkB,SAGzB;AACA,QAAI,YAAY,QAAQ;AACtB,aAAO,EAAE,GAAG,OAAO,aAAa,GAAG,OAAO,YAAY;AAAA,IACxD,WAAW,mBAAmB,SAAS;AACrC,aAAO,EAAE,GAAG,QAAQ,YAAY,GAAG,QAAQ,UAAU;AAAA,IACvD,OAAO;AACL,aAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,IACtB;AAAA,EACF;AAEA,WAAS,YAAY,SAAiD;AACpE,UAAM,OAAO,QAAQ,sBAAsB;AAC3C,UAAM,WAAW,SAAS,oBAAoB,SAAS;AAEvD,WAAO;AAAA,MACL,KAAK,KAAK,MAAM,SAAS;AAAA,MACzB,MAAM,KAAK,OAAO,SAAS;AAAA,IAC7B;AAAA,EACF;AAEA,WAAS,kBAAkB;AAAA,IACzB,SAAS,SAAS,mBAAmB,SAAS;AAAA,IAC9C,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,EACV,GAA4B;AAC1B,UAAM,aAAa,kBAAkB,MAAM;AAC3C,UAAM,YAAY,WAAW,IAAI;AACjC,UAAM,YAAY,WAAW,IAAI;AACjC,UAAM,YAAY,KAAK,IAAK,YAAY,QAAS,GAAG;AACpD,UAAM,YAAY,KAAK,IAAK,YAAY,QAAS,GAAG;AAEpD,WAAO,EAAE,GAAG,WAAW,GAAG,UAAU;AAAA,EACtC;AAEA,WAAS,SAAS;AAAA,IAChB,SAAS,SAAS,mBAAmB,SAAS;AAAA,IAC9C;AAAA,IACA;AAAA,IACA,WAAW,CAAC;AAAA,IACZ,SAAS,QAAQ;AAAA,IACjB;AAAA,EACF,GAAmB;AACjB,UAAM,YAAY,KAAK,IAAI;AAC3B,UAAM,EAAE,GAAG,OAAO,GAAG,MAAM,IAAI,kBAAkB,MAAM;AAEvD,QAAI,UAAU,OAAO,UAAU,MAAM;AACnC,UAAI;AAAU,iBAAS;AACvB;AAAA,IACF;AAEA,UAAM,iBAAiB,EAAE,GAAG,KAAK,GAAG,KAAK,GAAG,SAAS;AAErD,UAAM,SAAS,MAAM;AACnB,YAAM,cAAc,KAAK,IAAI;AAE7B,YAAM,QAAQ,IAAI,IAAI,cAAc,aAAa,eAAe,CAAC;AACjE,YAAM,QAAQ,IAAI,IAAI,cAAc,aAAa,eAAe,CAAC;AACjE,YAAM,aAAa,OAAO,KAAK;AAC/B,YAAM,aAAa,OAAO,KAAK;AAG/B,YAAM,UAAU,KAAK,IAAI,YAAY,UAAU;AAE/C,aAAO,OAAO;AAAA,QACZ,MAAM,WAAW,OAAO,SAAS;AAAA,QACjC,KAAK,WAAW,MAAM,SAAS;AAAA,MACjC,CAAC;AAED,UAAI,aAAa,KAAK,aAAa,GAAG;AACpC,8BAAsB,MAAM;AAAA,MAC9B,WAAW,UAAU;AACnB,iBAAS;AAAA,MACX;AAAA,IACF;AAEA,0BAAsB,MAAM;AAAA,EAC9B;AAEA,WAAS,eAAe;AAAA,IACtB;AAAA,IACA,SAAS,SAAS,mBAAmB,SAAS;AAAA,IAC9C,SAAS,CAAC;AAAA,IACV,QAAQ;AAAA,IACR,SAAS,QAAQ;AAAA,EACnB,GAAyB;AACvB,QAAI,WAAW,aAAa,MAAM;AAClC,QAAI,CAAC;AAAU;AACf,QAAI,WAAW,aAAa,QAAQ,QAAQ;AAC5C,QAAI,CAAC;AAAU;AAEf,UAAM,eAAe,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,OAAO;AAC7C,UAAM,WAAW,YAAY,QAAQ;AACrC,UAAM,eAAe,SAAS,OAAO,aAAa;AAClD,UAAM,cAAc,SAAS,MAAM,aAAa;AAEhD,UAAM,iBAAiB,kBAAkB;AAAA,MACvC,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,IACF,CAAC;AAED,aAAS;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,KAAK;AAAA,MACL,UAAU;AAAA,MACV;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;;;AC/LA,SAAS,WAAW,mBAAmB;AAShC,SAAS,sBAAsB,SAAwC;AAC5E,QAAM,gBAAgB;AAAA,IACpB,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,eAAe;AAAA,IACf,GAAG;AAAA,EACL;AAEA,QAAM,mBAAmB,CAAC,YAAsB;AAC9C,UAAM,KAAK,OAAO,OAAO,aAAa,IAAI,EAAE,QAAQ,CAAC;AAErD,QAAI,cAAc,OAAO;AACvB,eAAS,gBAAgB,MAAM,YAAY,cAAc,OAAO,GAAG,EAAE,IAAI;AAAA,IAC3E;AAEA,QAAI,WAAW,cAAc,cAAc;AACzC,eAAS,gBAAgB,MAAM;AAAA,QAC7B,cAAc;AAAA,QACd,GAAG,EAAE;AAAA,MACP;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAAoB,CAAC,YAAsB;AAC/C,UAAM,KAAK,OAAO,OAAO,cAAc,IAAI,EAAE,QAAQ,CAAC;AAEtD,QAAI,cAAc,QAAQ;AACxB,eAAS,gBAAgB,MAAM;AAAA,QAC7B,cAAc,UAAU;AAAA,QACxB,GAAG,EAAE;AAAA,MACP;AAAA,IACF;AAEA,QAAI,WAAW,cAAc,eAAe;AAC1C,eAAS,gBAAgB,MAAM;AAAA,QAC7B,cAAc,iBAAiB;AAAA,QAC/B,GAAG,EAAE;AAAA,MACP;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB,MAAM;AAC1B,qBAAiB;AACjB,sBAAkB;AAAA,EACpB;AAEA,YAAU,MAAM;AACd,qBAAiB,IAAI;AACrB,sBAAkB,IAAI;AAEtB,WAAO,iBAAiB,UAAU,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,EACpE,CAAC;AAED,cAAY,MAAM;AAChB,WAAO,iBAAiB,UAAU,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,EACpE,CAAC;AACH;","names":["easings"]}
|
package/dist/nuxt/module.json
CHANGED
package/dist/nuxt/module.mjs
CHANGED
|
@@ -15,6 +15,13 @@ const packages = {
|
|
|
15
15
|
}
|
|
16
16
|
};
|
|
17
17
|
const functions = [
|
|
18
|
+
{
|
|
19
|
+
name: "MagicMarquee",
|
|
20
|
+
"package": "plugins",
|
|
21
|
+
lastUpdated: 1691658148000,
|
|
22
|
+
docs: "https://maas.egineering/vue-equipment/plugins/MagicMarquee/",
|
|
23
|
+
description: "marquee"
|
|
24
|
+
},
|
|
18
25
|
{
|
|
19
26
|
name: "MagicModal",
|
|
20
27
|
"package": "plugins",
|
|
@@ -32,10 +39,24 @@ const functions = [
|
|
|
32
39
|
{
|
|
33
40
|
name: "MagicScroll",
|
|
34
41
|
"package": "plugins",
|
|
35
|
-
lastUpdated:
|
|
42
|
+
lastUpdated: 1693997036000,
|
|
36
43
|
docs: "https://maas.egineering/vue-equipment/plugins/MagicScroll/",
|
|
37
44
|
description: "scroll"
|
|
38
45
|
},
|
|
46
|
+
{
|
|
47
|
+
name: "MagicToast",
|
|
48
|
+
"package": "plugins",
|
|
49
|
+
lastUpdated: 1694004931000,
|
|
50
|
+
docs: "https://maas.egineering/vue-equipment/plugins/MagicToast/",
|
|
51
|
+
description: "toast"
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
name: "useCountdown",
|
|
55
|
+
"package": "composables",
|
|
56
|
+
lastUpdated: 1693245015000,
|
|
57
|
+
docs: "https://maas.egineering/vue-equipment/composables/useCountdown/",
|
|
58
|
+
description: "counts down to a specific time and date"
|
|
59
|
+
},
|
|
39
60
|
{
|
|
40
61
|
name: "useEasings",
|
|
41
62
|
"package": "composables",
|
|
@@ -60,7 +81,7 @@ const functions = [
|
|
|
60
81
|
{
|
|
61
82
|
name: "useViewportDimensions",
|
|
62
83
|
"package": "composables",
|
|
63
|
-
lastUpdated:
|
|
84
|
+
lastUpdated: 1693245818000,
|
|
64
85
|
docs: "https://maas.egineering/vue-equipment/composables/useViewportDimensions/",
|
|
65
86
|
description: "attach viewport dimensions as css variables to the document"
|
|
66
87
|
}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="magic-marquee">
|
|
3
|
+
<div class="magic-marquee__track" ref="parentRef">
|
|
4
|
+
<div class="magic-marquee__content" ref="childRef">
|
|
5
|
+
<slot />
|
|
6
|
+
</div>
|
|
7
|
+
<div
|
|
8
|
+
v-for="_duplicate in duplicates"
|
|
9
|
+
class="magic-marquee__content"
|
|
10
|
+
:aria-hidden="true"
|
|
11
|
+
>
|
|
12
|
+
<slot />
|
|
13
|
+
</div>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
</template>
|
|
17
|
+
|
|
18
|
+
<script setup lang="ts">
|
|
19
|
+
import { ref, computed } from 'vue'
|
|
20
|
+
import { useMarqueeApi } from '../composables/useMarqueeApi'
|
|
21
|
+
|
|
22
|
+
interface Props {
|
|
23
|
+
direction?: 'reverse' | 'normal'
|
|
24
|
+
speed?: number
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const props = withDefaults(defineProps<Props>(), {
|
|
28
|
+
direction: 'normal',
|
|
29
|
+
speed: 1,
|
|
30
|
+
})
|
|
31
|
+
|
|
32
|
+
const parentRef = ref<HTMLElement | undefined>(undefined)
|
|
33
|
+
const childRef = ref<HTMLElement | undefined>(undefined)
|
|
34
|
+
|
|
35
|
+
const { duplicates, playing, play, pause } = useMarqueeApi({
|
|
36
|
+
child: childRef,
|
|
37
|
+
parent: parentRef,
|
|
38
|
+
options: {
|
|
39
|
+
speed: computed(() => props.speed),
|
|
40
|
+
direction: computed(() => props.direction),
|
|
41
|
+
},
|
|
42
|
+
})
|
|
43
|
+
|
|
44
|
+
defineExpose({
|
|
45
|
+
playing,
|
|
46
|
+
play,
|
|
47
|
+
pause,
|
|
48
|
+
})
|
|
49
|
+
</script>
|
|
50
|
+
|
|
51
|
+
<style lang="css">
|
|
52
|
+
:root {
|
|
53
|
+
--magic-marquee-gap: 1rem;
|
|
54
|
+
--magic-marquee-content-width: unset;
|
|
55
|
+
--magic-marquee-transform-target-x: -100%;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
@keyframes magicMarqueeScrollX {
|
|
59
|
+
0% {
|
|
60
|
+
transform: translate3d(0, 0, 0);
|
|
61
|
+
}
|
|
62
|
+
100% {
|
|
63
|
+
transform: translate3d(-100%, 0, 0);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
@keyframes magicMarqueeScrollY {
|
|
68
|
+
0% {
|
|
69
|
+
transform: translate3d(0, 0, 0);
|
|
70
|
+
}
|
|
71
|
+
100% {
|
|
72
|
+
transform: translate3d(0, -100%, 0);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.magic-marquee {
|
|
77
|
+
position: relative;
|
|
78
|
+
width: 100%;
|
|
79
|
+
overflow: hidden;
|
|
80
|
+
user-select: none;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.magic-marquee__track {
|
|
84
|
+
position: relative;
|
|
85
|
+
width: 100%;
|
|
86
|
+
display: flex;
|
|
87
|
+
justify-content: flex-start;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.magic-marquee__content {
|
|
91
|
+
white-space: nowrap;
|
|
92
|
+
backface-visibility: hidden;
|
|
93
|
+
padding-right: var(--magic-marquee-gap);
|
|
94
|
+
width: var(--magic-marquee-content-width);
|
|
95
|
+
animation-name: var(--magic-marquee-animation-name);
|
|
96
|
+
animation-duration: var(--magic-marquee-animation-duration);
|
|
97
|
+
animation-play-state: var(--magic-marquee-animation-play-state, running);
|
|
98
|
+
animation-direction: var(--magic-marquee-animation-direction, normal);
|
|
99
|
+
animation-timing-function: linear;
|
|
100
|
+
animation-iteration-count: infinite;
|
|
101
|
+
animation-delay: 0;
|
|
102
|
+
flex-shrink: 0;
|
|
103
|
+
flex-grow: 0;
|
|
104
|
+
}
|
|
105
|
+
</style>
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
2
|
+
direction: {
|
|
3
|
+
type: import("vue").PropType<"reverse" | "normal">;
|
|
4
|
+
default: string;
|
|
5
|
+
};
|
|
6
|
+
speed: {
|
|
7
|
+
type: import("vue").PropType<number>;
|
|
8
|
+
default: number;
|
|
9
|
+
};
|
|
10
|
+
}, {
|
|
11
|
+
playing: import("vue").Ref<boolean>;
|
|
12
|
+
play: () => void;
|
|
13
|
+
pause: () => void;
|
|
14
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
15
|
+
direction: {
|
|
16
|
+
type: import("vue").PropType<"reverse" | "normal">;
|
|
17
|
+
default: string;
|
|
18
|
+
};
|
|
19
|
+
speed: {
|
|
20
|
+
type: import("vue").PropType<number>;
|
|
21
|
+
default: number;
|
|
22
|
+
};
|
|
23
|
+
}>>, {
|
|
24
|
+
direction: "reverse" | "normal";
|
|
25
|
+
speed: number;
|
|
26
|
+
}, {}>, {
|
|
27
|
+
default?(_: {}): any;
|
|
28
|
+
}>;
|
|
29
|
+
export default _default;
|
|
30
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
31
|
+
new (): {
|
|
32
|
+
$slots: S;
|
|
33
|
+
};
|
|
34
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type MaybeRef } from '@vueuse/core';
|
|
2
|
+
export type UseMarqueeApiParams = {
|
|
3
|
+
child: MaybeRef<HTMLElement | null | undefined>;
|
|
4
|
+
parent: MaybeRef<HTMLElement | null | undefined>;
|
|
5
|
+
options?: {
|
|
6
|
+
speed?: MaybeRef<number>;
|
|
7
|
+
direction?: MaybeRef<'reverse' | 'normal'>;
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
export declare function useMarqueeApi({ child, parent, options }: UseMarqueeApiParams): {
|
|
11
|
+
duplicates: import("vue").Ref<number>;
|
|
12
|
+
playing: import("vue").Ref<boolean>;
|
|
13
|
+
play: () => void;
|
|
14
|
+
pause: () => void;
|
|
15
|
+
};
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import { ref, onMounted, computed, nextTick, watch } from "vue";
|
|
2
|
+
import {
|
|
3
|
+
useElementBounding,
|
|
4
|
+
useResizeObserver,
|
|
5
|
+
toValue
|
|
6
|
+
} from "@vueuse/core";
|
|
7
|
+
export function useMarqueeApi({ child, parent, options }) {
|
|
8
|
+
const duplicates = ref(1);
|
|
9
|
+
const childRect = useElementBounding(child);
|
|
10
|
+
const parentRect = useElementBounding(parent);
|
|
11
|
+
const duration = computed(
|
|
12
|
+
() => (childRect.width.value / toValue(speed) / 50).toFixed(2)
|
|
13
|
+
);
|
|
14
|
+
const playing = ref(true);
|
|
15
|
+
const speed = computed(() => toValue(options?.speed) || 1);
|
|
16
|
+
const direction = computed(() => toValue(options?.direction) || "normal");
|
|
17
|
+
function calculateDuplicates() {
|
|
18
|
+
const childWidth = childRect?.width.value;
|
|
19
|
+
const parentWidth = parentRect?.width.value;
|
|
20
|
+
if (childWidth && parentWidth) {
|
|
21
|
+
duplicates.value = Math.ceil(parentWidth / childWidth * 2);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
function setCssVariables() {
|
|
25
|
+
toValue(parent)?.style.setProperty(
|
|
26
|
+
"--magic-marquee-animation-duration",
|
|
27
|
+
`${toValue(duration)}s`
|
|
28
|
+
);
|
|
29
|
+
toValue(parent)?.style.setProperty(
|
|
30
|
+
"--magic-marquee-animation-name",
|
|
31
|
+
`magicMarqueeScrollX`
|
|
32
|
+
);
|
|
33
|
+
toValue(parent)?.style.setProperty(
|
|
34
|
+
"--magic-marquee-animation-direction",
|
|
35
|
+
`${toValue(options?.direction) || "normal"}`
|
|
36
|
+
);
|
|
37
|
+
}
|
|
38
|
+
function pause() {
|
|
39
|
+
playing.value = false;
|
|
40
|
+
toValue(parent)?.style.setProperty(
|
|
41
|
+
"--magic-marquee-animation-play-state",
|
|
42
|
+
"paused"
|
|
43
|
+
);
|
|
44
|
+
}
|
|
45
|
+
function play() {
|
|
46
|
+
playing.value = true;
|
|
47
|
+
toValue(parent)?.style.setProperty(
|
|
48
|
+
"--magic-marquee-animation-play-state",
|
|
49
|
+
"running"
|
|
50
|
+
);
|
|
51
|
+
}
|
|
52
|
+
onMounted(() => {
|
|
53
|
+
calculateDuplicates();
|
|
54
|
+
nextTick();
|
|
55
|
+
setCssVariables();
|
|
56
|
+
});
|
|
57
|
+
useResizeObserver(parent, () => {
|
|
58
|
+
childRect.update();
|
|
59
|
+
parentRect.update();
|
|
60
|
+
calculateDuplicates();
|
|
61
|
+
nextTick();
|
|
62
|
+
setCssVariables();
|
|
63
|
+
});
|
|
64
|
+
watch(speed, () => {
|
|
65
|
+
nextTick();
|
|
66
|
+
toValue(parent)?.style.setProperty(
|
|
67
|
+
"--magic-marquee-animation-duration",
|
|
68
|
+
`${toValue(duration)}s`
|
|
69
|
+
);
|
|
70
|
+
});
|
|
71
|
+
watch(direction, (dir) => {
|
|
72
|
+
nextTick();
|
|
73
|
+
toValue(parent)?.style.setProperty(
|
|
74
|
+
"--magic-marquee-animation-direction",
|
|
75
|
+
`${toValue(dir)}`
|
|
76
|
+
);
|
|
77
|
+
});
|
|
78
|
+
return {
|
|
79
|
+
duplicates,
|
|
80
|
+
playing,
|
|
81
|
+
play,
|
|
82
|
+
pause
|
|
83
|
+
};
|
|
84
|
+
}
|
|
@@ -25,8 +25,10 @@
|
|
|
25
25
|
<transition
|
|
26
26
|
:name="mappedOptions.transitions?.content"
|
|
27
27
|
@before-leave="onBeforeLeave"
|
|
28
|
+
@leave="onLeave"
|
|
28
29
|
@after-leave="onAfterLeave"
|
|
29
30
|
@before-enter="onBeforeEnter"
|
|
31
|
+
@enter="onEnter"
|
|
30
32
|
@after-enter="onAfterEnter"
|
|
31
33
|
>
|
|
32
34
|
<div
|
|
@@ -36,7 +38,7 @@
|
|
|
36
38
|
>
|
|
37
39
|
<component
|
|
38
40
|
v-if="component"
|
|
39
|
-
v-bind="
|
|
41
|
+
v-bind="props"
|
|
40
42
|
:is="component"
|
|
41
43
|
@close="close"
|
|
42
44
|
/>
|
|
@@ -49,21 +51,28 @@
|
|
|
49
51
|
</template>
|
|
50
52
|
|
|
51
53
|
<script setup lang="ts">
|
|
52
|
-
import {
|
|
53
|
-
|
|
54
|
+
import {
|
|
55
|
+
ref,
|
|
56
|
+
watch,
|
|
57
|
+
nextTick,
|
|
58
|
+
toValue,
|
|
59
|
+
type Component,
|
|
60
|
+
type MaybeRef,
|
|
61
|
+
} from 'vue'
|
|
54
62
|
import { onKeyStroke } from '@vueuse/core'
|
|
55
|
-
import {
|
|
63
|
+
import { defu } from 'defu'
|
|
56
64
|
import { defaultOptions } from './../utils/defaultOptions'
|
|
65
|
+
import { useModalApi } from './../composables/useModalApi'
|
|
57
66
|
import { useModalEmitter } from './../composables/useModalEmitter'
|
|
67
|
+
import { useModalCallback } from '../composables/useModalCallback'
|
|
58
68
|
|
|
59
|
-
import type {
|
|
60
|
-
import type { DefaultOptions } from './../types/index'
|
|
69
|
+
import type { Options } from './../types/index'
|
|
61
70
|
|
|
62
71
|
interface MagicModalProps {
|
|
63
72
|
id: MaybeRef<string>
|
|
64
|
-
component?:
|
|
65
|
-
|
|
66
|
-
options?:
|
|
73
|
+
component?: Component
|
|
74
|
+
props?: Record<string, unknown>
|
|
75
|
+
options?: Options
|
|
67
76
|
}
|
|
68
77
|
|
|
69
78
|
const props = withDefaults(defineProps<MagicModalProps>(), {
|
|
@@ -72,13 +81,7 @@ const props = withDefaults(defineProps<MagicModalProps>(), {
|
|
|
72
81
|
|
|
73
82
|
const modal = ref<HTMLElement | undefined>(undefined)
|
|
74
83
|
const modalApi = useModalApi(props.id, { focusTarget: modal })
|
|
75
|
-
|
|
76
|
-
const mappedOptions = {
|
|
77
|
-
...defaultOptions,
|
|
78
|
-
...props.options,
|
|
79
|
-
teleport: { ...defaultOptions.teleport, ...props.options.teleport },
|
|
80
|
-
transitions: { ...defaultOptions.transitions, ...props.options.transitions },
|
|
81
|
-
}
|
|
84
|
+
const mappedOptions = defu(props.options, defaultOptions)
|
|
82
85
|
|
|
83
86
|
const {
|
|
84
87
|
isActive,
|
|
@@ -95,6 +98,25 @@ const {
|
|
|
95
98
|
const innerActive = ref(false)
|
|
96
99
|
const wrapperActive = ref(false)
|
|
97
100
|
|
|
101
|
+
const {
|
|
102
|
+
onBeforeEnter,
|
|
103
|
+
onEnter,
|
|
104
|
+
onAfterEnter,
|
|
105
|
+
onBeforeLeave,
|
|
106
|
+
onLeave,
|
|
107
|
+
onAfterLeave,
|
|
108
|
+
} = useModalCallback({
|
|
109
|
+
id: props.id,
|
|
110
|
+
mappedOptions,
|
|
111
|
+
addScrollLockPadding,
|
|
112
|
+
removeScrollLockPadding,
|
|
113
|
+
lockScroll,
|
|
114
|
+
unlockScroll,
|
|
115
|
+
trapFocus,
|
|
116
|
+
releaseFocus,
|
|
117
|
+
wrapperActive,
|
|
118
|
+
})
|
|
119
|
+
|
|
98
120
|
// Handle state
|
|
99
121
|
async function onOpen() {
|
|
100
122
|
wrapperActive.value = true
|
|
@@ -106,48 +128,6 @@ function onClose() {
|
|
|
106
128
|
innerActive.value = false
|
|
107
129
|
}
|
|
108
130
|
|
|
109
|
-
// Transition Callbacks
|
|
110
|
-
function onBeforeEnter() {
|
|
111
|
-
useModalEmitter().emit('beforeEnter', toValue(props.id))
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
async function onAfterEnter() {
|
|
115
|
-
if (mappedOptions.scrollLock) {
|
|
116
|
-
if (mappedOptions.scrollLockPadding) {
|
|
117
|
-
addScrollLockPadding()
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
lockScroll()
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
if (mappedOptions.focusTrap) {
|
|
124
|
-
await nextTick()
|
|
125
|
-
trapFocus()
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
useModalEmitter().emit('afterEnter', toValue(props.id))
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
function onBeforeLeave() {
|
|
132
|
-
useModalEmitter().emit('beforeLeave', toValue(props.id))
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
function onAfterLeave() {
|
|
136
|
-
if (mappedOptions.scrollLock) {
|
|
137
|
-
unlockScroll()
|
|
138
|
-
if (mappedOptions.scrollLockPadding) {
|
|
139
|
-
removeScrollLockPadding()
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
if (mappedOptions.focusTrap) {
|
|
144
|
-
releaseFocus()
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
wrapperActive.value = false
|
|
148
|
-
useModalEmitter().emit('afterLeave', toValue(props.id))
|
|
149
|
-
}
|
|
150
|
-
|
|
151
131
|
onKeyStroke('Escape', (e) => {
|
|
152
132
|
e.preventDefault()
|
|
153
133
|
close()
|