import { ElementRef, OnInit, OnChanges } from '@angular/core';
import { CfCoreComponent } from '../core/core.component';
import { CfCoreGalleryImage } from '../../directives/gallery/cf-core-gallery-image.model';
import { CfCoreGalleryOptions } from '../../directives/gallery/cf-core-gallery-options.model';
import { GalleryModel } from '../../models/gallery/gallery.model';
import { GalleryStylingModel } from '../../models/gallery/gallery-styling.model';
import { TemplateService } from '../../services/template-service/template.service';
/**
 * <p>CF Gallery component is created using functionality from <a href="https://github.com/lukasz-galka/ngx-gallery" target="_blank">Ngx-gallery</a></p>
 * <pre>
 * <code>
 * import { GalleryModel } from 'cedrus-fusion'
 * import { GalleryStylingModel } from 'cedrus-fusion'
 * <code><</code>cf-gallery<code>></code><code><</code><code>/</code>cf-gallery<code>></code>
 * </code>
 * </pre>
 */
export declare class CfGalleryComponent extends CfCoreComponent implements OnInit, OnChanges {
    elementRef: ElementRef;
    /** @hidden
   * It is an object with gallery images array and with needed options.
   */
    cfGallery: GalleryModel;
    /**
     * <pre>{
     *  display: boolean,                      // True or False. Default: true
     *  options: {                             // Object with specific gallery library options
     *    width: string,                       // Default value: '100%' - gallery width
     *    height: string,                      // Default value: '400px' - gallery height
     *    fullWidth: boolean,                  // Default value: false - sets the same width as browser
     *    image: boolean,                      // Default value: true - enables or disables image
     *    imagePercent: number,                // Default value: 75 - percentage height
     *    imageArrows: boolean,                // Default value: true - enables or disables arrows
     *    imageArrowsAutoHide: boolean,        // Default value: false - enables or disables arrows auto hide
     *    imageSwipe: boolean,                 // Default value: false - enables or disables swipe
     *    imageAnimation: string,              // Default value: 'fade' - animation type. Types are: 'fade', 'slide', 'rotate', 'zoom'.
     *    imageSize: string,                   // Default value: 'cover' - image size. Sizes are: 'cover' and 'contain'.
     *    thumbnails: boolean,                 // Default value: true - enables or disables thumbnails
     *    thumbnailsColumns: number,           // Default value: 4 - columns count
     *    thumbnailsRows: number,              // Default value: 1 - rows count
     *    thumbnailsPercent: number,           // Default value: 25 - percentage height
     *    thumbnailsMargin: number,            // Default value: 10 - margin between thumbnails and image
     *    thumbnailsArrows: boolean,           // Default value: true - enables or disables arrows
     *    thumbnailsArrowsAutoHide: boolean,   // Default value: false - enables or disables arrows auto hide
     *    thumbnailsSwipe: boolean,            // Default value: false - enables or disables swipe
     *    thumbnailMargin: number,             // Default value: 10 - margin between images in thumbnails
     *    preview: boolean,                    // Default value: true - enables or disables preview
     *    previewDescription: boolean,         // Default value: true - enables or disables description for images
     *    previewSwipe: boolean,               // Default value: false - enables or disables swipe
     *    previewCloseOnClick: boolean,        // Default value: false - enables or disables closing preview by click
     *    previewKeyboardNavigation: boolean,  // Default value: false - enables or disables navigation by keyboard
     *  },
     *  images: array                          // Array with image objects like in example below
     * </pre>
     * }
     * Example:
     * <pre>{
     *  options: {
     *    width: '100%',
     *    imagePercent: 75,
     *    imageArrowsAutoHide: true,
     *    thumbnailsPercent: 25,
     *    thumbnailsColumns: 3,
     *    thumbnailMargin: 8,
     *    thumbnailsMargin: 8,
     *    thumbnailsArrowsAutoHide: true,
     *    previewFullscreen: true
     *  },
     *  images: [
     *    {
     *      small: 'https://i1.wallpaperscraft.com/image/nature_waterfall_summer_lake_trees_90400_300x168.jpg',
     *      medium: 'https://i1.wallpaperscraft.com/image/nature_waterfall_summer_lake_trees_90400_602x339.jpg',
     *      big: 'https://wallpaperscraft.com/image/nature_waterfall_summer_lake_trees_90400_1920x1080.jpg',
     *      description: 'Nature waterfall summer lake_trees'
     *    },
     *    ...
     *  ]
     * }</pre>
     */
    properties: GalleryModel;
    /**
      *<p> dynamicClass: function() -> string,  // Function that returns name of the class </p>
      *<p> class: string                        // Name of the css class selector </p>
      *<pre>
      *{
      *  // Container surrounding the Gallery
      *  container:{
      *    dynamicClass,
      *    class
      *  }
      *}
      * </pre>
      */
    styling: GalleryStylingModel;
    /**
     * <p>Array with images of type CfCoreGalleryImage[]. Each image is an object with such properties:<p>
     * small: string,       // Url used in thumbnails
     * medium: string,      // Url used in image
     * big: string,         // Url used in preview
     * description: string  // Description text used in preview
     */
    images: CfCoreGalleryImage[];
    /**
     * <p>Gallery settings of type CfCoreGalleryOptions described in <b>properties</b><p>
     */
    options: CfCoreGalleryOptions;
    /** @hidden */
    constructor(elementRef: ElementRef, /**@hidden */ templateService: TemplateService);
    /** @hidden
     * It will be generated <b>cfGallery</b> object and rendered inside component template.
     */
    ngOnInit(): void;
    /** @hidden
     * <p> Update the properties object with the changes on the inputs to keep the component dynamic.</p>
     * @param changes
     */
    ngOnChanges(changes: any): void;
}
