import { intersect_default } from "./chunk-3JAGB4CS.js"; import { makeDimensionProps, useDimension } from "./chunk-O7EUYO3B.js"; import { makeRoundedProps, useRounded } from "./chunk-24LK52JF.js"; import { MaybeTransition, makeTransitionProps } from "./chunk-XRWT7YWI.js"; import { useBackgroundColor } from "./chunk-ZZ55KHRR.js"; import { SUPPORTS_INTERSECTION, convertToUnit, genericComponent, getCurrentInstance, makeComponentProps, propsFactory, useRender } from "./chunk-I4KGD5X4.js"; import { Fragment, computed, createVNode, mergeProps, nextTick, onBeforeMount, onBeforeUnmount, ref, resolveDirective, shallowRef, toRef, vShow, watch, withDirectives } from "./chunk-PD2AWGJV.js"; // node_modules/vuetify/lib/components/VImg/VImg.mjs import "C:/Users/Jeremy/Documents/Dev/Projects.cloudsucks.net/Vulture/VApp/node_modules/vuetify/lib/components/VImg/VImg.css"; // node_modules/vuetify/lib/components/VResponsive/VResponsive.mjs import "C:/Users/Jeremy/Documents/Dev/Projects.cloudsucks.net/Vulture/VApp/node_modules/vuetify/lib/components/VResponsive/VResponsive.css"; function useAspectStyles(props) { return { aspectStyles: computed(() => { const ratio = Number(props.aspectRatio); return ratio ? { paddingBottom: String(1 / ratio * 100) + "%" } : void 0; }) }; } var makeVResponsiveProps = propsFactory({ aspectRatio: [String, Number], contentClass: String, inline: Boolean, ...makeComponentProps(), ...makeDimensionProps() }, "VResponsive"); var VResponsive = genericComponent()({ name: "VResponsive", props: makeVResponsiveProps(), setup(props, _ref) { let { slots } = _ref; const { aspectStyles } = useAspectStyles(props); const { dimensionStyles } = useDimension(props); useRender(() => { var _a; return createVNode("div", { "class": ["v-responsive", { "v-responsive--inline": props.inline }, props.class], "style": [dimensionStyles.value, props.style] }, [createVNode("div", { "class": "v-responsive__sizer", "style": aspectStyles.value }, null), (_a = slots.additional) == null ? void 0 : _a.call(slots), slots.default && createVNode("div", { "class": ["v-responsive__content", props.contentClass] }, [slots.default()])]); }); return {}; } }); // node_modules/vuetify/lib/components/VImg/VImg.mjs var makeVImgProps = propsFactory({ alt: String, cover: Boolean, color: String, draggable: { type: [Boolean, String], default: void 0 }, eager: Boolean, gradient: String, lazySrc: String, options: { type: Object, // For more information on types, navigate to: // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API default: () => ({ root: void 0, rootMargin: void 0, threshold: void 0 }) }, sizes: String, src: { type: [String, Object], default: "" }, crossorigin: String, referrerpolicy: String, srcset: String, position: String, ...makeVResponsiveProps(), ...makeComponentProps(), ...makeRoundedProps(), ...makeTransitionProps() }, "VImg"); var VImg = genericComponent()({ name: "VImg", directives: { intersect: intersect_default }, props: makeVImgProps(), emits: { loadstart: (value) => true, load: (value) => true, error: (value) => true }, setup(props, _ref) { let { emit, slots } = _ref; const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, "color")); const { roundedClasses } = useRounded(props); const vm = getCurrentInstance("VImg"); const currentSrc = shallowRef(""); const image = ref(); const state = shallowRef(props.eager ? "loading" : "idle"); const naturalWidth = shallowRef(); const naturalHeight = shallowRef(); const normalisedSrc = computed(() => { return props.src && typeof props.src === "object" ? { src: props.src.src, srcset: props.srcset || props.src.srcset, lazySrc: props.lazySrc || props.src.lazySrc, aspect: Number(props.aspectRatio || props.src.aspect || 0) } : { src: props.src, srcset: props.srcset, lazySrc: props.lazySrc, aspect: Number(props.aspectRatio || 0) }; }); const aspectRatio = computed(() => { return normalisedSrc.value.aspect || naturalWidth.value / naturalHeight.value || 0; }); watch(() => props.src, () => { init(state.value !== "idle"); }); watch(aspectRatio, (val, oldVal) => { if (!val && oldVal && image.value) { pollForSize(image.value); } }); onBeforeMount(() => init()); function init(isIntersecting) { if (props.eager && isIntersecting) return; if (SUPPORTS_INTERSECTION && !isIntersecting && !props.eager) return; state.value = "loading"; if (normalisedSrc.value.lazySrc) { const lazyImg = new Image(); lazyImg.src = normalisedSrc.value.lazySrc; pollForSize(lazyImg, null); } if (!normalisedSrc.value.src) return; nextTick(() => { var _a; emit("loadstart", ((_a = image.value) == null ? void 0 : _a.currentSrc) || normalisedSrc.value.src); setTimeout(() => { var _a2; if (vm.isUnmounted) return; if ((_a2 = image.value) == null ? void 0 : _a2.complete) { if (!image.value.naturalWidth) { onError(); } if (state.value === "error") return; if (!aspectRatio.value) pollForSize(image.value, null); if (state.value === "loading") onLoad(); } else { if (!aspectRatio.value) pollForSize(image.value); getSrc(); } }); }); } function onLoad() { var _a; if (vm.isUnmounted) return; getSrc(); pollForSize(image.value); state.value = "loaded"; emit("load", ((_a = image.value) == null ? void 0 : _a.currentSrc) || normalisedSrc.value.src); } function onError() { var _a; if (vm.isUnmounted) return; state.value = "error"; emit("error", ((_a = image.value) == null ? void 0 : _a.currentSrc) || normalisedSrc.value.src); } function getSrc() { const img = image.value; if (img) currentSrc.value = img.currentSrc || img.src; } let timer = -1; onBeforeUnmount(() => { clearTimeout(timer); }); function pollForSize(img) { let timeout = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 100; const poll = () => { clearTimeout(timer); if (vm.isUnmounted) return; const { naturalHeight: imgHeight, naturalWidth: imgWidth } = img; if (imgHeight || imgWidth) { naturalWidth.value = imgWidth; naturalHeight.value = imgHeight; } else if (!img.complete && state.value === "loading" && timeout != null) { timer = window.setTimeout(poll, timeout); } else if (img.currentSrc.endsWith(".svg") || img.currentSrc.startsWith("data:image/svg+xml")) { naturalWidth.value = 1; naturalHeight.value = 1; } }; poll(); } const containClasses = computed(() => ({ "v-img__img--cover": props.cover, "v-img__img--contain": !props.cover })); const __image = () => { var _a; if (!normalisedSrc.value.src || state.value === "idle") return null; const img = createVNode("img", { "class": ["v-img__img", containClasses.value], "style": { objectPosition: props.position }, "src": normalisedSrc.value.src, "srcset": normalisedSrc.value.srcset, "alt": props.alt, "crossorigin": props.crossorigin, "referrerpolicy": props.referrerpolicy, "draggable": props.draggable, "sizes": props.sizes, "ref": image, "onLoad": onLoad, "onError": onError }, null); const sources = (_a = slots.sources) == null ? void 0 : _a.call(slots); return createVNode(MaybeTransition, { "transition": props.transition, "appear": true }, { default: () => [withDirectives(sources ? createVNode("picture", { "class": "v-img__picture" }, [sources, img]) : img, [[vShow, state.value === "loaded"]])] }); }; const __preloadImage = () => createVNode(MaybeTransition, { "transition": props.transition }, { default: () => [normalisedSrc.value.lazySrc && state.value !== "loaded" && createVNode("img", { "class": ["v-img__img", "v-img__img--preload", containClasses.value], "style": { objectPosition: props.position }, "src": normalisedSrc.value.lazySrc, "alt": props.alt, "crossorigin": props.crossorigin, "referrerpolicy": props.referrerpolicy, "draggable": props.draggable }, null)] }); const __placeholder = () => { if (!slots.placeholder) return null; return createVNode(MaybeTransition, { "transition": props.transition, "appear": true }, { default: () => [(state.value === "loading" || state.value === "error" && !slots.error) && createVNode("div", { "class": "v-img__placeholder" }, [slots.placeholder()])] }); }; const __error = () => { if (!slots.error) return null; return createVNode(MaybeTransition, { "transition": props.transition, "appear": true }, { default: () => [state.value === "error" && createVNode("div", { "class": "v-img__error" }, [slots.error()])] }); }; const __gradient = () => { if (!props.gradient) return null; return createVNode("div", { "class": "v-img__gradient", "style": { backgroundImage: `linear-gradient(${props.gradient})` } }, null); }; const isBooted = shallowRef(false); { const stop = watch(aspectRatio, (val) => { if (val) { requestAnimationFrame(() => { requestAnimationFrame(() => { isBooted.value = true; }); }); stop(); } }); } useRender(() => { const responsiveProps = VResponsive.filterProps(props); return withDirectives(createVNode(VResponsive, mergeProps({ "class": ["v-img", { "v-img--booting": !isBooted.value }, backgroundColorClasses.value, roundedClasses.value, props.class], "style": [{ width: convertToUnit(props.width === "auto" ? naturalWidth.value : props.width) }, backgroundColorStyles.value, props.style] }, responsiveProps, { "aspectRatio": aspectRatio.value, "aria-label": props.alt, "role": props.alt ? "img" : void 0 }), { additional: () => createVNode(Fragment, null, [createVNode(__image, null, null), createVNode(__preloadImage, null, null), createVNode(__gradient, null, null), createVNode(__placeholder, null, null), createVNode(__error, null, null)]), default: slots.default }), [[resolveDirective("intersect"), { handler: init, options: props.options }, null, { once: true }]]); }); return { currentSrc, image, state, naturalWidth, naturalHeight }; } }); export { VImg }; //# sourceMappingURL=chunk-4HSTIW6R.js.map