@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
87 lines (86 loc) • 2.77 kB
TypeScript
import type { NeonCarouselImage } from '@/common/models/NeonCarouselImage';
/**
* <p>
* The <strong>NeonImageCarousel</strong> is used to display a carousel of images for the user to swipe
* through. NOTE: It is recommended to explicitly set the width & height of the carousel via CSS, this will
* ensure it will not be impacted by images with different aspect ratios. Images are automatically resized to fit the
* carousel dimensions.
* </p>
*/
declare const _default: import("vue").DefineComponent<{
/**
* The images to be displayed in the carousel.
*/
images: {
type: () => Array<NeonCarouselImage>;
required: true;
};
/**
* Provide an alternative image count label. This can be useful for translations. The default is e.g.
* <em>2 images</em>.
*/
imageCountLabel: {
type: StringConstructor;
default: undefined;
};
/**
* Provide an alternative label for the Previous button.
*/
previousLabel: {
type: StringConstructor;
default: string;
};
/**
* Provide an alternative label for the Next button.
*/
nextLabel: {
type: StringConstructor;
default: string;
};
}, {
emit: (event: "current-image", ...args: any[]) => void;
currentImage: import("vue").Ref<number>;
carouselItem: import("vue").Ref<HTMLLIElement[]>;
carouselItems: import("vue").Ref<HTMLUListElement | null>;
initialised: import("vue").Ref<boolean>;
next: () => void;
previous: () => void;
scrollTo: (index: number) => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "current-image"[], "current-image", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
/**
* The images to be displayed in the carousel.
*/
images: {
type: () => Array<NeonCarouselImage>;
required: true;
};
/**
* Provide an alternative image count label. This can be useful for translations. The default is e.g.
* <em>2 images</em>.
*/
imageCountLabel: {
type: StringConstructor;
default: undefined;
};
/**
* Provide an alternative label for the Previous button.
*/
previousLabel: {
type: StringConstructor;
default: string;
};
/**
* Provide an alternative label for the Next button.
*/
nextLabel: {
type: StringConstructor;
default: string;
};
}>> & {
"onCurrent-image"?: ((...args: any[]) => any) | undefined;
}, {
imageCountLabel: string;
previousLabel: string;
nextLabel: string;
}, {}>;
export default _default;