Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | 93x 93x 93x 93x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 14x 3x 3x 3x 3x 3x | import { ViewService } from '@zeedhi/core';
import { ModalService } from '../../services';
import { Component } from '../zd-component/component';
import { IModal, IModalEvents, IModalGrid } from './interfaces';
/**
* Base class for Modal component.
*/
export class Modal extends Component implements IModal {
/**
* Sets the modal's title
*/
public title = '';
/**
* If true the modal will open as fullscreen
*/
public fullscreen = false;
public grid: IModalGrid = {
cols: 11,
sm: 10,
lg: 6,
};
/**
* If true the modal won't close when overlay is clicked
*/
public persistent = false;
/**
* Allows modal to be dragged around in the screen
*/
public draggable = false;
/**
* Css selector of the drag handle
*/
public dragHandle?: string = '';
/**
* Set if esc keydown event should to stop propagation
*/
public escKeydownStop?: boolean = true;
/**
* Defines modal events.
*/
public declare events: IModalEvents;
/**
* Creates a new modal
* @param props Modal structure
*/
constructor(props: IModal) {
super(props);
this.title = this.getInitValue('title', props.title, this.title);
this.fullscreen = this.getInitValue('fullscreen', props.fullscreen, this.fullscreen);
this.grid = this.getInitValue('grid', props.grid, this.grid);
this.persistent = this.getInitValue('persistent', props.persistent, this.persistent);
this.draggable = this.getInitValue('draggable', props.draggable, this.draggable);
this.dragHandle = this.getInitValue('dragHandle', props.dragHandle, this.dragHandle);
this.escKeydownStop = this.getInitValue('escKeydownStop', props.escKeydownStop, this.escKeydownStop);
this.isVisible = false;
this.createAccessors();
}
/**
* Removes modal from modals collection
*/
public destroy() {
ModalService.delete(this);
}
/**
* Displays modal
*/
public show() {
this.isVisible = true;
ViewService.nextTick(() => this.callEvent('onShow', { component: this }));
}
/**
* Closes modal
*/
public hide() {
this.isVisible = false;
ViewService.nextTick(() => this.callEvent('onHide', { component: this }));
}
}
|