@empathyco/x-components
Version:
Empathy X Components
78 lines • 3.28 kB
TypeScript
import { Result } from '@empathyco/x-types';
import { PropType, Ref } from 'vue';
/**
* Component to be reused that renders an `<img>`.
*
* @public
*/
declare const _default: import("vue").DefineComponent<{
/** (Required) The {@link @empathyco/x-types#Result} information. */
result: {
type: PropType<Result>;
required: true;
};
/**
* Animation to use when switching between the placeholder, the loaded image, or the failed
* image fallback.
*/
loadAnimation: {
type: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
default: () => import("vue").DefineComponent<{}, {}, any, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
};
/** Animation to use when switching between the loaded image and the hover image. */
hoverAnimation: {
type: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
};
/**
* Indicates if the next valid image should be displayed on hover.
*
* @public
*/
showNextImageOnHover: {
type: BooleanConstructor;
default: boolean;
};
}, {
pendingImages: Ref<string[]>;
loadedImages: Ref<string[]>;
isHovering: Ref<boolean>;
userHasHoveredImage: Ref<boolean>;
loaderStyles: Partial<CSSStyleDeclaration>;
animation: import("vue").ComputedRef<string | Record<string, any>>;
imageSrc: import("vue").ComputedRef<string>;
shouldLoadNextImage: import("vue").ComputedRef<boolean>;
flagImageAsFailed: () => void;
flagImageLoaded: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
/** (Required) The {@link @empathyco/x-types#Result} information. */
result: {
type: PropType<Result>;
required: true;
};
/**
* Animation to use when switching between the placeholder, the loaded image, or the failed
* image fallback.
*/
loadAnimation: {
type: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
default: () => import("vue").DefineComponent<{}, {}, any, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
};
/** Animation to use when switching between the loaded image and the hover image. */
hoverAnimation: {
type: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
};
/**
* Indicates if the next valid image should be displayed on hover.
*
* @public
*/
showNextImageOnHover: {
type: BooleanConstructor;
default: boolean;
};
}>>, {
loadAnimation: string | Function | Record<string, any>;
showNextImageOnHover: boolean;
}, {}>;
export default _default;
//# sourceMappingURL=base-result-image.vue?vue&type=script&lang.d.ts.map