Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@ncstate/sat-popover

Package Overview
Dependencies
Maintainers
2
Versions
36
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@ncstate/sat-popover - npm Package Compare versions

Comparing version 1.0.0-beta.4 to 1.0.0-beta.5

popover/popover-anchoring.service.d.ts
popover/popover-delegation.service.d.ts

539

@ncstate/sat-popover.es5.js

@@ -9,8 +9,9 @@ import { Component, Directive, ElementRef, EventEmitter, Inject, Injectable, InjectionToken, Input, NgModule, NgZone, Optional, Output, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';

import { Subject as Subject$1 } from 'rxjs/Subject';
import { merge as merge$1 } from 'rxjs/observable/merge';
import { tap as tap$1 } from 'rxjs/operators/tap';
import { takeUntil as takeUntil$1 } from 'rxjs/operators/takeUntil';
import { ESCAPE } from '@angular/cdk/keycodes';
import { TemplatePortal } from '@angular/cdk/portal';
import { ESCAPE } from '@angular/cdk/keycodes';
import { take as take$1 } from 'rxjs/operators/take';
import { takeUntil as takeUntil$1 } from 'rxjs/operators/takeUntil';
import { filter as filter$1 } from 'rxjs/operators/filter';
import { tap as tap$1 } from 'rxjs/operators/tap';

@@ -255,2 +256,14 @@ /**

};
/** Complete event stream. */
/**
* Complete event stream.
* @return {?}
*/
PopoverNotificationService.prototype.dispose = /**
* Complete event stream.
* @return {?}
*/
function () {
this.store.complete();
};
PopoverNotificationService.decorators = [

@@ -327,4 +340,6 @@ { type: Injectable },

this._verticalAlign = 'center';
this._autoFocus = true;
this._scrollStrategy = 'reposition';
this._hasBackdrop = false;
this._interactiveClose = true;
this._openTransition = DEFAULT_TRANSITION;

@@ -437,2 +452,18 @@ this._closeTransition = DEFAULT_TRANSITION;

});
Object.defineProperty(SatPopover.prototype, "autoFocus", {
get: /**
* Whether the first focusable element should be focused on open.
* @return {?}
*/
function () { return this._autoFocus; },
set: /**
* @param {?} val
* @return {?}
*/
function (val) {
this._autoFocus = coerceBooleanProperty(val);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SatPopover.prototype, "scrollStrategy", {

@@ -474,2 +505,18 @@ get: /**

});
Object.defineProperty(SatPopover.prototype, "interactiveClose", {
get: /**
* Whether the popover should close when the user clicks the backdrop or presses ESC.
* @return {?}
*/
function () { return this._interactiveClose; },
set: /**
* @param {?} val
* @return {?}
*/
function (val) {
this._interactiveClose = coerceBooleanProperty(val);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SatPopover.prototype, "openTransition", {

@@ -520,2 +567,13 @@ get: /**

};
/**
* @return {?}
*/
SatPopover.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
if (this._notifications) {
this._notifications.dispose();
}
};
/** Open this popover. */

@@ -649,3 +707,5 @@ /**

}
this._focusTrap.focusInitialElementWhenReady();
if (this.autoFocus) {
this._focusTrap.focusInitialElementWhenReady();
}
};

@@ -780,4 +840,6 @@ /**

"yAlign": [{ type: Input },],
"autoFocus": [{ type: Input },],
"scrollStrategy": [{ type: Input },],
"hasBackdrop": [{ type: Input },],
"interactiveClose": [{ type: Input },],
"openTransition": [{ type: Input },],

@@ -802,8 +864,5 @@ "closeTransition": [{ type: Input },],

*/
var SatPopoverAnchor = (function () {
function SatPopoverAnchor(_overlay, _elementRef, _viewContainerRef, _notifications, _ngZone, _dir) {
var PopoverAnchoringService = (function () {
function PopoverAnchoringService(_overlay, _ngZone, _dir) {
this._overlay = _overlay;
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._notifications = _notifications;
this._ngZone = _ngZone;

@@ -814,7 +873,7 @@ this._dir = _dir;

*/
this.popoverOpened = new EventEmitter();
this.popoverOpened = new Subject$1();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new EventEmitter();
this.popoverClosed = new Subject$1();
/**

@@ -829,55 +888,62 @@ * Whether the popover is presently open.

}
Object.defineProperty(SatPopoverAnchor.prototype, "attachedPopover", {
get: /**
* Reference to the popover instance.
* @return {?}
*/
function () { return this._attachedPopover; },
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
// ensure that value is a popover
this._validateAttachedPopover(value);
// store value and provide notification service as a communication
// channel between popover and anchor
this._attachedPopover = value;
this._attachedPopover._notifications = this._notifications;
},
enumerable: true,
configurable: true
});
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
PopoverAnchoringService.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
return this._popoverOpen;
// Destroy popover before terminating subscriptions so that any resulting
// detachments update 'closed state'
this._destroyPopover();
// Terminate subscriptions
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._onDestroy.next();
this._onDestroy.complete();
this.popoverOpened.complete();
this.popoverClosed.complete();
};
/** Anchor a popover instance to a view and connection element. */
/**
* Anchor a popover instance to a view and connection element.
* @param {?} popover
* @param {?} viewContainerRef
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnInit = /**
PopoverAnchoringService.prototype.anchor = /**
* Anchor a popover instance to a view and connection element.
* @param {?} popover
* @param {?} viewContainerRef
* @param {?} anchor
* @return {?}
*/
function () {
function (popover, viewContainerRef, anchor) {
// Destroy any previous popovers
this._destroyPopover();
// Assign local refs
this._popover = popover;
this._viewContainerRef = viewContainerRef;
this._anchor = anchor;
// Provide notification service as a communication channel between popover and anchor.
// Then subscribe to notifications to take appropriate actions.
this._popover._notifications = this._notifications = new PopoverNotificationService();
this._subscribeToNotifications();
this._validateAttachedPopover(this.attachedPopover);
};
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnDestroy = /**
PopoverAnchoringService.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
* @return {?}
*/
function () {
this._onDestroy.next();
this._onDestroy.complete();
this._destroyPopover();
return this._popoverOpen;
};

@@ -889,3 +955,3 @@ /** Toggles the popover between the open and closed states. */

*/
SatPopoverAnchor.prototype.togglePopover = /**
PopoverAnchoringService.prototype.togglePopover = /**
* Toggles the popover between the open and closed states.

@@ -902,3 +968,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype.openPopover = /**
PopoverAnchoringService.prototype.openPopover = /**
* Opens the popover.

@@ -909,4 +975,3 @@ * @return {?}

if (!this._popoverOpen) {
this._createOverlay();
this._overlayRef.attach(this._portal);
this.createOverlay();
this._subscribeToBackdrop();

@@ -924,3 +989,3 @@ this._subscribeToEscape();

*/
SatPopoverAnchor.prototype.closePopover = /**
PopoverAnchoringService.prototype.closePopover = /**
* Closes the popover.

@@ -936,12 +1001,29 @@ * @param {?=} value

};
/** Create an overlay to be attached to the portal. */
/**
* Gets the text direction of the containing app.
* Create an overlay to be attached to the portal.
* @return {?}
*/
SatPopoverAnchor.prototype._getDirection = /**
* Gets the text direction of the containing app.
PopoverAnchoringService.prototype.createOverlay = /**
* Create an overlay to be attached to the portal.
* @return {?}
*/
function () {
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
// Create overlay if it doesn't yet exist
if (!this._overlayRef) {
this._portal = new TemplatePortal(this._popover._templateRef, this._viewContainerRef);
var /** @type {?} */ popoverConfig = {
horizontalAlign: this._popover.horizontalAlign,
verticalAlign: this._popover.verticalAlign,
hasBackdrop: this._popover.hasBackdrop,
backdropClass: this._popover.backdropClass,
scrollStrategy: this._popover.scrollStrategy,
};
var /** @type {?} */ overlayConfig = this._getOverlayConfig(popoverConfig, this._anchor);
this._subscribeToPositionChanges(/** @type {?} */ (overlayConfig.positionStrategy));
this._overlayRef = this._overlay.create(overlayConfig);
}
// Actually open the popover
this._overlayRef.attach(this._portal);
return this._overlayRef;
};

@@ -952,3 +1034,3 @@ /**

*/
SatPopoverAnchor.prototype._destroyPopover = /**
PopoverAnchoringService.prototype._destroyPopover = /**
* Removes the popover from the DOM. Does NOT update open state.

@@ -968,3 +1050,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype._destroyPopoverOnceClosed = /**
PopoverAnchoringService.prototype._destroyPopoverOnceClosed = /**
* Destroys the popover immediately if it is closed, or waits until it

@@ -984,17 +1066,2 @@ * has been closed to destroy it.

/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
SatPopoverAnchor.prototype._validateAttachedPopover = /**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
function (popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
};
/**
* Call appropriate anchor method when an event is dispatched through

@@ -1004,3 +1071,3 @@ * the notification service.

*/
SatPopoverAnchor.prototype._subscribeToNotifications = /**
PopoverAnchoringService.prototype._subscribeToNotifications = /**
* Call appropriate anchor method when an event is dispatched through

@@ -1012,4 +1079,6 @@ * the notification service.

var _this = this;
this._notifications.events()
.pipe(takeUntil$1(this._onDestroy))
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
this._notificationsSubscription = this._notifications.events()
.subscribe(function (event) {

@@ -1038,3 +1107,3 @@ switch (event.action) {

*/
SatPopoverAnchor.prototype._subscribeToBackdrop = /**
PopoverAnchoringService.prototype._subscribeToBackdrop = /**
* Close popover when backdrop is clicked.

@@ -1047,7 +1116,4 @@ * @return {?}

.backdropClick()
.pipe(takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(function () {
_this.attachedPopover.backdropClicked.emit();
_this.closePopover();
});
.pipe(tap$1(function () { return _this._popover.backdropClicked.emit(); }), filter$1(function () { return _this._popover.interactiveClose; }), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(function () { return _this.closePopover(); });
};

@@ -1058,3 +1124,3 @@ /**

*/
SatPopoverAnchor.prototype._subscribeToEscape = /**
PopoverAnchoringService.prototype._subscribeToEscape = /**
* Close popover when escape keydown event occurs.

@@ -1067,3 +1133,3 @@ * @return {?}

.keydownEvents()
.pipe(tap$1(function (event) { return _this.attachedPopover.overlayKeydown.emit(event); }), filter$1(function (event) { return event.keyCode === ESCAPE; }), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.pipe(tap$1(function (event) { return _this._popover.overlayKeydown.emit(event); }), filter$1(function (event) { return event.keyCode === ESCAPE; }), filter$1(function () { return _this._popover.interactiveClose; }), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(function () { return _this.closePopover(); });

@@ -1075,3 +1141,3 @@ };

*/
SatPopoverAnchor.prototype._subscribeToDetachments = /**
PopoverAnchoringService.prototype._subscribeToDetachments = /**
* Set state back to closed when detached.

@@ -1091,3 +1157,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype._saveOpenedState = /**
PopoverAnchoringService.prototype._saveOpenedState = /**
* Save the opened state of the popover and emit.

@@ -1098,5 +1164,5 @@ * @return {?}

if (!this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = true;
this.popoverOpened.emit();
this.attachedPopover.opened.emit();
this._popover._open = this._popoverOpen = true;
this.popoverOpened.next();
this._popover.opened.emit();
}

@@ -1109,3 +1175,3 @@ };

*/
SatPopoverAnchor.prototype._saveClosedState = /**
PopoverAnchoringService.prototype._saveClosedState = /**
* Save the closed state of the popover and emit.

@@ -1117,40 +1183,38 @@ * @param {?=} value

if (this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = false;
this.popoverClosed.emit(value);
this.attachedPopover.closed.emit(value);
this._popover._open = this._popoverOpen = false;
this.popoverClosed.next(value);
this._popover.closed.emit(value);
}
};
/**
* Create an overlay to be attached to the portal.
* Gets the text direction of the containing app.
* @return {?}
*/
SatPopoverAnchor.prototype._createOverlay = /**
* Create an overlay to be attached to the portal.
PopoverAnchoringService.prototype._getDirection = /**
* Gets the text direction of the containing app.
* @return {?}
*/
function () {
if (!this._overlayRef) {
this._portal = new TemplatePortal(this.attachedPopover._templateRef, this._viewContainerRef);
var /** @type {?} */ config = this._getOverlayConfig();
this._subscribeToPositionChanges(/** @type {?} */ (config.positionStrategy));
this._overlayRef = this._overlay.create(config);
}
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
};
/**
* Create and return a config for creating the overlay.
* @param {?} config
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype._getOverlayConfig = /**
PopoverAnchoringService.prototype._getOverlayConfig = /**
* Create and return a config for creating the overlay.
* @param {?} config
* @param {?} anchor
* @return {?}
*/
function () {
var /** @type {?} */ config = new OverlayConfig({
positionStrategy: this._getPositionStrategy(),
hasBackdrop: this.attachedPopover.hasBackdrop,
backdropClass: this.attachedPopover.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(this.attachedPopover.scrollStrategy),
function (config, anchor) {
return new OverlayConfig({
positionStrategy: this._getPositionStrategy(config.horizontalAlign, config.verticalAlign, anchor),
hasBackdrop: config.hasBackdrop,
backdropClass: config.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(config.scrollStrategy),
direction: this._getDirection(),
});
return config;
};

@@ -1163,3 +1227,3 @@ /**

*/
SatPopoverAnchor.prototype._subscribeToPositionChanges = /**
PopoverAnchoringService.prototype._subscribeToPositionChanges = /**
* Listen to changes in the position of the overlay and set the correct alignment classes,

@@ -1172,3 +1236,6 @@ * ensuring that the animation origin is correct, even with a fallback position.

var _this = this;
position.onPositionChange
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._positionChangeSubscription = position.onPositionChange
.pipe(takeUntil$1(this._onDestroy))

@@ -1179,3 +1246,3 @@ .subscribe(function (change) {

_this._ngZone.run(function () {
_this.attachedPopover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
_this._popover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
});

@@ -1189,3 +1256,3 @@ });

*/
SatPopoverAnchor.prototype._getScrollStrategyInstance = /**
PopoverAnchoringService.prototype._getScrollStrategyInstance = /**
* Map a scroll strategy string type to an instance of a scroll strategy.

@@ -1196,3 +1263,2 @@ * @param {?} strategy

function (strategy) {
// TODO support 'close' on resolution of https://github.com/angular/material2/issues/7922
switch (strategy) {

@@ -1212,11 +1278,15 @@ case 'block':

* Create and return a position strategy based on config provided to the component instance.
* @param {?} horizontalTarget
* @param {?} verticalTarget
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype._getPositionStrategy = /**
PopoverAnchoringService.prototype._getPositionStrategy = /**
* Create and return a position strategy based on config provided to the component instance.
* @param {?} horizontalTarget
* @param {?} verticalTarget
* @param {?} anchor
* @return {?}
*/
function () {
var /** @type {?} */ horizontalTarget = this.attachedPopover.horizontalAlign;
var /** @type {?} */ verticalTarget = this.attachedPopover.verticalAlign;
function (horizontalTarget, verticalTarget, anchor) {
// Attach the overlay at the preferred position

@@ -1226,3 +1296,3 @@ var _a = getHorizontalConnectionPosPair(horizontalTarget), originX = _a.originX, overlayX = _a.overlayX;

var /** @type {?} */ strategy = this._overlay.position()
.connectedTo(this._elementRef, { originX: originX, originY: originY }, { overlayX: overlayX, overlayY: overlayY })
.connectedTo(anchor, { originX: originX, originY: originY }, { overlayX: overlayX, overlayY: overlayY })
.withDirection(this._getDirection());

@@ -1240,3 +1310,3 @@ // Add fallbacks based on the preferred positions

*/
SatPopoverAnchor.prototype._addFallbacks = /**
PopoverAnchoringService.prototype._addFallbacks = /**
* Add fallbacks to a given strategy based around target alignments.

@@ -1283,3 +1353,3 @@ * @param {?} strategy

*/
SatPopoverAnchor.prototype._applyFallback = /**
PopoverAnchoringService.prototype._applyFallback = /**
* Convert a specific horizontal and vertical alignment into a fallback and apply it to

@@ -1297,26 +1367,42 @@ * the strategy.

};
SatPopoverAnchor.decorators = [
{ type: Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverNotificationService],
},] },
PopoverAnchoringService.decorators = [
{ type: Injectable },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = function () { return [
PopoverAnchoringService.ctorParameters = function () { return [
{ type: Overlay, },
{ type: ElementRef, },
{ type: ViewContainerRef, },
{ type: PopoverNotificationService, },
{ type: NgZone, },
{ type: Directionality, decorators: [{ type: Optional },] },
]; };
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: Output },],
"popoverClosed": [{ type: Output },],
};
return SatPopoverAnchor;
return PopoverAnchoringService;
}());
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function to convert alignment to origin/overlay position pair.

@@ -1360,30 +1446,2 @@ * @param {?} h

/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function that takes an ordered array options and returns a reorderded

@@ -1427,2 +1485,154 @@ * array around the target item. e.g.:

*/
var SatPopoverAnchor = (function () {
function SatPopoverAnchor(_elementRef, _viewContainerRef, _anchoring) {
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._anchoring = _anchoring;
/**
* Emits when the popover is opened.
*/
this.popoverOpened = new EventEmitter();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new EventEmitter();
/**
* Emits when the directive is destroyed.
*/
this._onDestroy = new Subject$1();
}
Object.defineProperty(SatPopoverAnchor.prototype, "attachedPopover", {
get: /**
* Reference to the popover instance.
* @return {?}
*/
function () { return this._attachedPopover; },
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._validateAttachedPopover(value);
this._attachedPopover = value;
// Anchor the popover to the element ref
this._anchoring.anchor(this.attachedPopover, this._viewContainerRef, this._elementRef);
},
enumerable: true,
configurable: true
});
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
* @return {?}
*/
function () {
return this._anchoring.isPopoverOpen();
};
/**
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
// Re-emit open and close events
var /** @type {?} */ opened$ = this._anchoring.popoverOpened
.pipe(tap$1(function () { return _this.popoverOpened.emit(); }));
var /** @type {?} */ closed$ = this._anchoring.popoverClosed
.pipe(tap$1(function (value) { return _this.popoverClosed.emit(value); }));
merge$1(opened$, closed$).pipe(takeUntil$1(this._onDestroy)).subscribe();
};
/**
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this._onDestroy.next();
this._onDestroy.complete();
};
/** Toggles the popover between the open and closed states. */
/**
* Toggles the popover between the open and closed states.
* @return {?}
*/
SatPopoverAnchor.prototype.togglePopover = /**
* Toggles the popover between the open and closed states.
* @return {?}
*/
function () {
this._anchoring.togglePopover();
};
/** Opens the popover. */
/**
* Opens the popover.
* @return {?}
*/
SatPopoverAnchor.prototype.openPopover = /**
* Opens the popover.
* @return {?}
*/
function () {
this._anchoring.openPopover();
};
/** Closes the popover. */
/**
* Closes the popover.
* @param {?=} value
* @return {?}
*/
SatPopoverAnchor.prototype.closePopover = /**
* Closes the popover.
* @param {?=} value
* @return {?}
*/
function (value) {
this._anchoring.closePopover(value);
};
/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
SatPopoverAnchor.prototype._validateAttachedPopover = /**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
function (popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
};
SatPopoverAnchor.decorators = [
{ type: Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverAnchoringService],
},] },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = function () { return [
{ type: ElementRef, },
{ type: ViewContainerRef, },
{ type: PopoverAnchoringService, },
]; };
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: Output },],
"popoverClosed": [{ type: Output },],
};
return SatPopoverAnchor;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var SatPopoverModule = (function () {

@@ -1446,2 +1656,3 @@ function SatPopoverModule() {

SatPopoverAnchor,
BidiModule,
]

@@ -1468,3 +1679,3 @@ },] },

export { SatPopoverModule, SatPopoverAnchor, SatPopover, PopoverNotificationService as ɵb, transformPopover as ɵa };
export { SatPopoverModule, SatPopoverAnchor, SatPopover, PopoverAnchoringService as ɵb, transformPopover as ɵa };
//# sourceMappingURL=sat-popover.es5.js.map

425

@ncstate/sat-popover.js

@@ -9,8 +9,9 @@ import { Component, Directive, ElementRef, EventEmitter, Inject, Injectable, InjectionToken, Input, NgModule, NgZone, Optional, Output, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';

import { Subject as Subject$1 } from 'rxjs/Subject';
import { merge as merge$1 } from 'rxjs/observable/merge';
import { tap as tap$1 } from 'rxjs/operators/tap';
import { takeUntil as takeUntil$1 } from 'rxjs/operators/takeUntil';
import { ESCAPE } from '@angular/cdk/keycodes';
import { TemplatePortal } from '@angular/cdk/portal';
import { ESCAPE } from '@angular/cdk/keycodes';
import { take as take$1 } from 'rxjs/operators/take';
import { takeUntil as takeUntil$1 } from 'rxjs/operators/takeUntil';
import { filter as filter$1 } from 'rxjs/operators/filter';
import { tap as tap$1 } from 'rxjs/operators/tap';

@@ -247,2 +248,9 @@ /**

}
/**
* Complete event stream.
* @return {?}
*/
dispose() {
this.store.complete();
}
}

@@ -322,4 +330,6 @@ PopoverNotificationService.decorators = [

this._verticalAlign = 'center';
this._autoFocus = true;
this._scrollStrategy = 'reposition';
this._hasBackdrop = false;
this._interactiveClose = true;
this._openTransition = DEFAULT_TRANSITION;

@@ -417,2 +427,14 @@ this._closeTransition = DEFAULT_TRANSITION;

/**
* Whether the first focusable element should be focused on open.
* @return {?}
*/
get autoFocus() { return this._autoFocus; }
/**
* @param {?} val
* @return {?}
*/
set autoFocus(val) {
this._autoFocus = coerceBooleanProperty(val);
}
/**
* How the popover should handle scrolling.

@@ -446,2 +468,14 @@ * @return {?}

/**
* Whether the popover should close when the user clicks the backdrop or presses ESC.
* @return {?}
*/
get interactiveClose() { return this._interactiveClose; }
/**
* @param {?} val
* @return {?}
*/
set interactiveClose(val) {
this._interactiveClose = coerceBooleanProperty(val);
}
/**
* Custom transition to use while opening.

@@ -481,2 +515,10 @@ * @return {?}

/**
* @return {?}
*/
ngOnDestroy() {
if (this._notifications) {
this._notifications.dispose();
}
}
/**
* Open this popover.

@@ -564,3 +606,5 @@ * @return {?}

}
this._focusTrap.focusInitialElementWhenReady();
if (this.autoFocus) {
this._focusTrap.focusInitialElementWhenReady();
}
}

@@ -663,4 +707,6 @@ /**

"yAlign": [{ type: Input },],
"autoFocus": [{ type: Input },],
"scrollStrategy": [{ type: Input },],
"hasBackdrop": [{ type: Input },],
"interactiveClose": [{ type: Input },],
"openTransition": [{ type: Input },],

@@ -683,16 +729,10 @@ "closeTransition": [{ type: Input },],

*/
class SatPopoverAnchor {
class PopoverAnchoringService {
/**
* @param {?} _overlay
* @param {?} _elementRef
* @param {?} _viewContainerRef
* @param {?} _notifications
* @param {?} _ngZone
* @param {?} _dir
*/
constructor(_overlay, _elementRef, _viewContainerRef, _notifications, _ngZone, _dir) {
constructor(_overlay, _ngZone, _dir) {
this._overlay = _overlay;
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._notifications = _notifications;
this._ngZone = _ngZone;

@@ -703,7 +743,7 @@ this._dir = _dir;

*/
this.popoverOpened = new EventEmitter();
this.popoverOpened = new Subject$1();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new EventEmitter();
this.popoverClosed = new Subject$1();
/**

@@ -719,17 +759,38 @@ * Whether the popover is presently open.

/**
* Reference to the popover instance.
* @return {?}
*/
get attachedPopover() { return this._attachedPopover; }
ngOnDestroy() {
// Destroy popover before terminating subscriptions so that any resulting
// detachments update 'closed state'
this._destroyPopover();
// Terminate subscriptions
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._onDestroy.next();
this._onDestroy.complete();
this.popoverOpened.complete();
this.popoverClosed.complete();
}
/**
* @param {?} value
* Anchor a popover instance to a view and connection element.
* @param {?} popover
* @param {?} viewContainerRef
* @param {?} anchor
* @return {?}
*/
set attachedPopover(value) {
// ensure that value is a popover
this._validateAttachedPopover(value);
// store value and provide notification service as a communication
// channel between popover and anchor
this._attachedPopover = value;
this._attachedPopover._notifications = this._notifications;
anchor(popover, viewContainerRef, anchor) {
// Destroy any previous popovers
this._destroyPopover();
// Assign local refs
this._popover = popover;
this._viewContainerRef = viewContainerRef;
this._anchor = anchor;
// Provide notification service as a communication channel between popover and anchor.
// Then subscribe to notifications to take appropriate actions.
this._popover._notifications = this._notifications = new PopoverNotificationService();
this._subscribeToNotifications();
}

@@ -744,17 +805,2 @@ /**

/**
* @return {?}
*/
ngOnInit() {
this._subscribeToNotifications();
this._validateAttachedPopover(this.attachedPopover);
}
/**
* @return {?}
*/
ngOnDestroy() {
this._onDestroy.next();
this._onDestroy.complete();
this._destroyPopover();
}
/**
* Toggles the popover between the open and closed states.

@@ -772,4 +818,3 @@ * @return {?}

if (!this._popoverOpen) {
this._createOverlay();
this._overlayRef.attach(this._portal);
this.createOverlay();
this._subscribeToBackdrop();

@@ -793,7 +838,23 @@ this._subscribeToEscape();

/**
* Gets the text direction of the containing app.
* Create an overlay to be attached to the portal.
* @return {?}
*/
_getDirection() {
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
createOverlay() {
// Create overlay if it doesn't yet exist
if (!this._overlayRef) {
this._portal = new TemplatePortal(this._popover._templateRef, this._viewContainerRef);
const /** @type {?} */ popoverConfig = {
horizontalAlign: this._popover.horizontalAlign,
verticalAlign: this._popover.verticalAlign,
hasBackdrop: this._popover.hasBackdrop,
backdropClass: this._popover.backdropClass,
scrollStrategy: this._popover.scrollStrategy,
};
const /** @type {?} */ overlayConfig = this._getOverlayConfig(popoverConfig, this._anchor);
this._subscribeToPositionChanges(/** @type {?} */ (overlayConfig.positionStrategy));
this._overlayRef = this._overlay.create(overlayConfig);
}
// Actually open the popover
this._overlayRef.attach(this._portal);
return this._overlayRef;
}

@@ -824,12 +885,2 @@ /**

/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
_validateAttachedPopover(popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
}
/**
* Call appropriate anchor method when an event is dispatched through

@@ -840,4 +891,6 @@ * the notification service.

_subscribeToNotifications() {
this._notifications.events()
.pipe(takeUntil$1(this._onDestroy))
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
this._notificationsSubscription = this._notifications.events()
.subscribe(event => {

@@ -869,7 +922,4 @@ switch (event.action) {

.backdropClick()
.pipe(takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(() => {
this.attachedPopover.backdropClicked.emit();
this.closePopover();
});
.pipe(tap$1(() => this._popover.backdropClicked.emit()), filter$1(() => this._popover.interactiveClose), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(() => this.closePopover());
}

@@ -883,3 +933,3 @@ /**

.keydownEvents()
.pipe(tap$1(event => this.attachedPopover.overlayKeydown.emit(event)), filter$1(event => event.keyCode === ESCAPE), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.pipe(tap$1(event => this._popover.overlayKeydown.emit(event)), filter$1(event => event.keyCode === ESCAPE), filter$1(() => this._popover.interactiveClose), takeUntil$1(this.popoverClosed), takeUntil$1(this._onDestroy))
.subscribe(() => this.closePopover());

@@ -903,5 +953,5 @@ }

if (!this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = true;
this.popoverOpened.emit();
this.attachedPopover.opened.emit();
this._popover._open = this._popoverOpen = true;
this.popoverOpened.next();
this._popover.opened.emit();
}

@@ -916,32 +966,28 @@ }

if (this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = false;
this.popoverClosed.emit(value);
this.attachedPopover.closed.emit(value);
this._popover._open = this._popoverOpen = false;
this.popoverClosed.next(value);
this._popover.closed.emit(value);
}
}
/**
* Create an overlay to be attached to the portal.
* Gets the text direction of the containing app.
* @return {?}
*/
_createOverlay() {
if (!this._overlayRef) {
this._portal = new TemplatePortal(this.attachedPopover._templateRef, this._viewContainerRef);
const /** @type {?} */ config = this._getOverlayConfig();
this._subscribeToPositionChanges(/** @type {?} */ (config.positionStrategy));
this._overlayRef = this._overlay.create(config);
}
_getDirection() {
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
}
/**
* Create and return a config for creating the overlay.
* @param {?} config
* @param {?} anchor
* @return {?}
*/
_getOverlayConfig() {
const /** @type {?} */ config = new OverlayConfig({
positionStrategy: this._getPositionStrategy(),
hasBackdrop: this.attachedPopover.hasBackdrop,
backdropClass: this.attachedPopover.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(this.attachedPopover.scrollStrategy),
_getOverlayConfig(config, anchor) {
return new OverlayConfig({
positionStrategy: this._getPositionStrategy(config.horizontalAlign, config.verticalAlign, anchor),
hasBackdrop: config.hasBackdrop,
backdropClass: config.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(config.scrollStrategy),
direction: this._getDirection(),
});
return config;
}

@@ -955,3 +1001,6 @@ /**

_subscribeToPositionChanges(position) {
position.onPositionChange
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._positionChangeSubscription = position.onPositionChange
.pipe(takeUntil$1(this._onDestroy))

@@ -961,3 +1010,3 @@ .subscribe(change => {

this._ngZone.run(() => {
this.attachedPopover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
this._popover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
});

@@ -972,3 +1021,2 @@ });

_getScrollStrategyInstance(strategy) {
// TODO support 'close' on resolution of https://github.com/angular/material2/issues/7922
switch (strategy) {

@@ -988,7 +1036,8 @@ case 'block':

* Create and return a position strategy based on config provided to the component instance.
* @param {?} horizontalTarget
* @param {?} verticalTarget
* @param {?} anchor
* @return {?}
*/
_getPositionStrategy() {
const /** @type {?} */ horizontalTarget = this.attachedPopover.horizontalAlign;
const /** @type {?} */ verticalTarget = this.attachedPopover.verticalAlign;
_getPositionStrategy(horizontalTarget, verticalTarget, anchor) {
// Attach the overlay at the preferred position

@@ -998,3 +1047,3 @@ const { originX, overlayX } = getHorizontalConnectionPosPair(horizontalTarget);

const /** @type {?} */ strategy = this._overlay.position()
.connectedTo(this._elementRef, { originX, originY }, { overlayX, overlayY })
.connectedTo(anchor, { originX, originY }, { overlayX, overlayY })
.withDirection(this._getDirection());

@@ -1049,24 +1098,40 @@ // Add fallbacks based on the preferred positions

}
SatPopoverAnchor.decorators = [
{ type: Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverNotificationService],
},] },
PopoverAnchoringService.decorators = [
{ type: Injectable },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = () => [
PopoverAnchoringService.ctorParameters = () => [
{ type: Overlay, },
{ type: ElementRef, },
{ type: ViewContainerRef, },
{ type: PopoverNotificationService, },
{ type: NgZone, },
{ type: Directionality, decorators: [{ type: Optional },] },
];
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: Output },],
"popoverClosed": [{ type: Output },],
};
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function to convert alignment to origin/overlay position pair.

@@ -1110,30 +1175,2 @@ * @param {?} h

/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function that takes an ordered array options and returns a reorderded

@@ -1177,2 +1214,121 @@ * array around the target item. e.g.:

*/
class SatPopoverAnchor {
/**
* @param {?} _elementRef
* @param {?} _viewContainerRef
* @param {?} _anchoring
*/
constructor(_elementRef, _viewContainerRef, _anchoring) {
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._anchoring = _anchoring;
/**
* Emits when the popover is opened.
*/
this.popoverOpened = new EventEmitter();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new EventEmitter();
/**
* Emits when the directive is destroyed.
*/
this._onDestroy = new Subject$1();
}
/**
* Reference to the popover instance.
* @return {?}
*/
get attachedPopover() { return this._attachedPopover; }
/**
* @param {?} value
* @return {?}
*/
set attachedPopover(value) {
this._validateAttachedPopover(value);
this._attachedPopover = value;
// Anchor the popover to the element ref
this._anchoring.anchor(this.attachedPopover, this._viewContainerRef, this._elementRef);
}
/**
* Gets whether the popover is presently open.
* @return {?}
*/
isPopoverOpen() {
return this._anchoring.isPopoverOpen();
}
/**
* @return {?}
*/
ngOnInit() {
// Re-emit open and close events
const /** @type {?} */ opened$ = this._anchoring.popoverOpened
.pipe(tap$1(() => this.popoverOpened.emit()));
const /** @type {?} */ closed$ = this._anchoring.popoverClosed
.pipe(tap$1(value => this.popoverClosed.emit(value)));
merge$1(opened$, closed$).pipe(takeUntil$1(this._onDestroy)).subscribe();
}
/**
* @return {?}
*/
ngOnDestroy() {
this._onDestroy.next();
this._onDestroy.complete();
}
/**
* Toggles the popover between the open and closed states.
* @return {?}
*/
togglePopover() {
this._anchoring.togglePopover();
}
/**
* Opens the popover.
* @return {?}
*/
openPopover() {
this._anchoring.openPopover();
}
/**
* Closes the popover.
* @param {?=} value
* @return {?}
*/
closePopover(value) {
this._anchoring.closePopover(value);
}
/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
_validateAttachedPopover(popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
}
}
SatPopoverAnchor.decorators = [
{ type: Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverAnchoringService],
},] },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = () => [
{ type: ElementRef, },
{ type: ViewContainerRef, },
{ type: PopoverAnchoringService, },
];
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: Output },],
"popoverClosed": [{ type: Output },],
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
class SatPopoverModule {

@@ -1195,2 +1351,3 @@ }

SatPopoverAnchor,
BidiModule,
]

@@ -1215,3 +1372,3 @@ },] },

export { SatPopoverModule, SatPopoverAnchor, SatPopover, PopoverNotificationService as ɵb, transformPopover as ɵa };
export { SatPopoverModule, SatPopoverAnchor, SatPopover, PopoverAnchoringService as ɵb, transformPopover as ɵa };
//# sourceMappingURL=sat-popover.js.map

540

bundles/sat-popover.umd.js
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/cdk/overlay'), require('@angular/cdk/a11y'), require('@angular/platform-browser'), require('@angular/cdk/coercion'), require('@angular/animations'), require('rxjs/Subject'), require('@angular/cdk/portal'), require('@angular/cdk/keycodes'), require('rxjs/operators/take'), require('rxjs/operators/takeUntil'), require('rxjs/operators/filter'), require('rxjs/operators/tap')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@angular/cdk/overlay', '@angular/cdk/a11y', '@angular/platform-browser', '@angular/cdk/coercion', '@angular/animations', 'rxjs/Subject', '@angular/cdk/portal', '@angular/cdk/keycodes', 'rxjs/operators/take', 'rxjs/operators/takeUntil', 'rxjs/operators/filter', 'rxjs/operators/tap'], factory) :
(factory((global.popover = {}),global.ng.core,global.ng.common,global.ng.cdk.overlay,global.ng.cdk.a11y,global.ng.platformBrowser,global.ng.cdk.coercion,global.ng.animations,global.Rx,global.ng.cdk.portal,global.ng.cdk.keycodes,global.Rx.operators,global.Rx.operators,global.Rx.operators,global.Rx.operators));
}(this, (function (exports,core,common,overlay,a11y,platformBrowser,coercion,animations,Subject,portal,keycodes,take,takeUntil,filter,tap) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/cdk/overlay'), require('@angular/cdk/a11y'), require('@angular/platform-browser'), require('@angular/cdk/coercion'), require('@angular/animations'), require('rxjs/Subject'), require('rxjs/observable/merge'), require('rxjs/operators/tap'), require('rxjs/operators/takeUntil'), require('@angular/cdk/keycodes'), require('@angular/cdk/portal'), require('rxjs/operators/take'), require('rxjs/operators/filter')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@angular/cdk/overlay', '@angular/cdk/a11y', '@angular/platform-browser', '@angular/cdk/coercion', '@angular/animations', 'rxjs/Subject', 'rxjs/observable/merge', 'rxjs/operators/tap', 'rxjs/operators/takeUntil', '@angular/cdk/keycodes', '@angular/cdk/portal', 'rxjs/operators/take', 'rxjs/operators/filter'], factory) :
(factory((global.popover = {}),global.ng.core,global.ng.common,global.ng.cdk.overlay,global.ng.cdk.a11y,global.ng.platformBrowser,global.ng.cdk.coercion,global.ng.animations,global.Rx,global.Rx.Observable,global.Rx.operators,global.Rx.operators,global.ng.cdk.keycodes,global.ng.cdk.portal,global.Rx.operators,global.Rx.operators));
}(this, (function (exports,core,common,overlay,a11y,platformBrowser,coercion,animations,Subject,merge,tap,takeUntil,keycodes,portal,take,filter) { 'use strict';

@@ -245,2 +245,14 @@ /**

};
/** Complete event stream. */
/**
* Complete event stream.
* @return {?}
*/
PopoverNotificationService.prototype.dispose = /**
* Complete event stream.
* @return {?}
*/
function () {
this.store.complete();
};
PopoverNotificationService.decorators = [

@@ -317,4 +329,6 @@ { type: core.Injectable },

this._verticalAlign = 'center';
this._autoFocus = true;
this._scrollStrategy = 'reposition';
this._hasBackdrop = false;
this._interactiveClose = true;
this._openTransition = DEFAULT_TRANSITION;

@@ -427,2 +441,18 @@ this._closeTransition = DEFAULT_TRANSITION;

});
Object.defineProperty(SatPopover.prototype, "autoFocus", {
get: /**
* Whether the first focusable element should be focused on open.
* @return {?}
*/
function () { return this._autoFocus; },
set: /**
* @param {?} val
* @return {?}
*/
function (val) {
this._autoFocus = coercion.coerceBooleanProperty(val);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SatPopover.prototype, "scrollStrategy", {

@@ -464,2 +494,18 @@ get: /**

});
Object.defineProperty(SatPopover.prototype, "interactiveClose", {
get: /**
* Whether the popover should close when the user clicks the backdrop or presses ESC.
* @return {?}
*/
function () { return this._interactiveClose; },
set: /**
* @param {?} val
* @return {?}
*/
function (val) {
this._interactiveClose = coercion.coerceBooleanProperty(val);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SatPopover.prototype, "openTransition", {

@@ -510,2 +556,13 @@ get: /**

};
/**
* @return {?}
*/
SatPopover.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
if (this._notifications) {
this._notifications.dispose();
}
};
/** Open this popover. */

@@ -639,3 +696,5 @@ /**

}
this._focusTrap.focusInitialElementWhenReady();
if (this.autoFocus) {
this._focusTrap.focusInitialElementWhenReady();
}
};

@@ -770,4 +829,6 @@ /**

"yAlign": [{ type: core.Input },],
"autoFocus": [{ type: core.Input },],
"scrollStrategy": [{ type: core.Input },],
"hasBackdrop": [{ type: core.Input },],
"interactiveClose": [{ type: core.Input },],
"openTransition": [{ type: core.Input },],

@@ -792,8 +853,5 @@ "closeTransition": [{ type: core.Input },],

*/
var SatPopoverAnchor = (function () {
function SatPopoverAnchor(_overlay, _elementRef, _viewContainerRef, _notifications, _ngZone, _dir) {
var PopoverAnchoringService = (function () {
function PopoverAnchoringService(_overlay, _ngZone, _dir) {
this._overlay = _overlay;
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._notifications = _notifications;
this._ngZone = _ngZone;

@@ -804,7 +862,7 @@ this._dir = _dir;

*/
this.popoverOpened = new core.EventEmitter();
this.popoverOpened = new Subject.Subject();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new core.EventEmitter();
this.popoverClosed = new Subject.Subject();
/**

@@ -819,55 +877,62 @@ * Whether the popover is presently open.

}
Object.defineProperty(SatPopoverAnchor.prototype, "attachedPopover", {
get: /**
* Reference to the popover instance.
* @return {?}
*/
function () { return this._attachedPopover; },
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
// ensure that value is a popover
this._validateAttachedPopover(value);
// store value and provide notification service as a communication
// channel between popover and anchor
this._attachedPopover = value;
this._attachedPopover._notifications = this._notifications;
},
enumerable: true,
configurable: true
});
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
PopoverAnchoringService.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
return this._popoverOpen;
// Destroy popover before terminating subscriptions so that any resulting
// detachments update 'closed state'
this._destroyPopover();
// Terminate subscriptions
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._onDestroy.next();
this._onDestroy.complete();
this.popoverOpened.complete();
this.popoverClosed.complete();
};
/** Anchor a popover instance to a view and connection element. */
/**
* Anchor a popover instance to a view and connection element.
* @param {?} popover
* @param {?} viewContainerRef
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnInit = /**
PopoverAnchoringService.prototype.anchor = /**
* Anchor a popover instance to a view and connection element.
* @param {?} popover
* @param {?} viewContainerRef
* @param {?} anchor
* @return {?}
*/
function () {
function (popover, viewContainerRef, anchor) {
// Destroy any previous popovers
this._destroyPopover();
// Assign local refs
this._popover = popover;
this._viewContainerRef = viewContainerRef;
this._anchor = anchor;
// Provide notification service as a communication channel between popover and anchor.
// Then subscribe to notifications to take appropriate actions.
this._popover._notifications = this._notifications = new PopoverNotificationService();
this._subscribeToNotifications();
this._validateAttachedPopover(this.attachedPopover);
};
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnDestroy = /**
PopoverAnchoringService.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
* @return {?}
*/
function () {
this._onDestroy.next();
this._onDestroy.complete();
this._destroyPopover();
return this._popoverOpen;
};

@@ -879,3 +944,3 @@ /** Toggles the popover between the open and closed states. */

*/
SatPopoverAnchor.prototype.togglePopover = /**
PopoverAnchoringService.prototype.togglePopover = /**
* Toggles the popover between the open and closed states.

@@ -892,3 +957,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype.openPopover = /**
PopoverAnchoringService.prototype.openPopover = /**
* Opens the popover.

@@ -899,4 +964,3 @@ * @return {?}

if (!this._popoverOpen) {
this._createOverlay();
this._overlayRef.attach(this._portal);
this.createOverlay();
this._subscribeToBackdrop();

@@ -914,3 +978,3 @@ this._subscribeToEscape();

*/
SatPopoverAnchor.prototype.closePopover = /**
PopoverAnchoringService.prototype.closePopover = /**
* Closes the popover.

@@ -926,12 +990,29 @@ * @param {?=} value

};
/** Create an overlay to be attached to the portal. */
/**
* Gets the text direction of the containing app.
* Create an overlay to be attached to the portal.
* @return {?}
*/
SatPopoverAnchor.prototype._getDirection = /**
* Gets the text direction of the containing app.
PopoverAnchoringService.prototype.createOverlay = /**
* Create an overlay to be attached to the portal.
* @return {?}
*/
function () {
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
// Create overlay if it doesn't yet exist
if (!this._overlayRef) {
this._portal = new portal.TemplatePortal(this._popover._templateRef, this._viewContainerRef);
var /** @type {?} */ popoverConfig = {
horizontalAlign: this._popover.horizontalAlign,
verticalAlign: this._popover.verticalAlign,
hasBackdrop: this._popover.hasBackdrop,
backdropClass: this._popover.backdropClass,
scrollStrategy: this._popover.scrollStrategy,
};
var /** @type {?} */ overlayConfig = this._getOverlayConfig(popoverConfig, this._anchor);
this._subscribeToPositionChanges(/** @type {?} */ (overlayConfig.positionStrategy));
this._overlayRef = this._overlay.create(overlayConfig);
}
// Actually open the popover
this._overlayRef.attach(this._portal);
return this._overlayRef;
};

@@ -942,3 +1023,3 @@ /**

*/
SatPopoverAnchor.prototype._destroyPopover = /**
PopoverAnchoringService.prototype._destroyPopover = /**
* Removes the popover from the DOM. Does NOT update open state.

@@ -958,3 +1039,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype._destroyPopoverOnceClosed = /**
PopoverAnchoringService.prototype._destroyPopoverOnceClosed = /**
* Destroys the popover immediately if it is closed, or waits until it

@@ -974,17 +1055,2 @@ * has been closed to destroy it.

/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
SatPopoverAnchor.prototype._validateAttachedPopover = /**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
function (popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
};
/**
* Call appropriate anchor method when an event is dispatched through

@@ -994,3 +1060,3 @@ * the notification service.

*/
SatPopoverAnchor.prototype._subscribeToNotifications = /**
PopoverAnchoringService.prototype._subscribeToNotifications = /**
* Call appropriate anchor method when an event is dispatched through

@@ -1002,4 +1068,6 @@ * the notification service.

var _this = this;
this._notifications.events()
.pipe(takeUntil.takeUntil(this._onDestroy))
if (this._notificationsSubscription) {
this._notificationsSubscription.unsubscribe();
}
this._notificationsSubscription = this._notifications.events()
.subscribe(function (event) {

@@ -1028,3 +1096,3 @@ switch (event.action) {

*/
SatPopoverAnchor.prototype._subscribeToBackdrop = /**
PopoverAnchoringService.prototype._subscribeToBackdrop = /**
* Close popover when backdrop is clicked.

@@ -1037,7 +1105,4 @@ * @return {?}

.backdropClick()
.pipe(takeUntil.takeUntil(this.popoverClosed), takeUntil.takeUntil(this._onDestroy))
.subscribe(function () {
_this.attachedPopover.backdropClicked.emit();
_this.closePopover();
});
.pipe(tap.tap(function () { return _this._popover.backdropClicked.emit(); }), filter.filter(function () { return _this._popover.interactiveClose; }), takeUntil.takeUntil(this.popoverClosed), takeUntil.takeUntil(this._onDestroy))
.subscribe(function () { return _this.closePopover(); });
};

@@ -1048,3 +1113,3 @@ /**

*/
SatPopoverAnchor.prototype._subscribeToEscape = /**
PopoverAnchoringService.prototype._subscribeToEscape = /**
* Close popover when escape keydown event occurs.

@@ -1057,3 +1122,3 @@ * @return {?}

.keydownEvents()
.pipe(tap.tap(function (event) { return _this.attachedPopover.overlayKeydown.emit(event); }), filter.filter(function (event) { return event.keyCode === keycodes.ESCAPE; }), takeUntil.takeUntil(this.popoverClosed), takeUntil.takeUntil(this._onDestroy))
.pipe(tap.tap(function (event) { return _this._popover.overlayKeydown.emit(event); }), filter.filter(function (event) { return event.keyCode === keycodes.ESCAPE; }), filter.filter(function () { return _this._popover.interactiveClose; }), takeUntil.takeUntil(this.popoverClosed), takeUntil.takeUntil(this._onDestroy))
.subscribe(function () { return _this.closePopover(); });

@@ -1065,3 +1130,3 @@ };

*/
SatPopoverAnchor.prototype._subscribeToDetachments = /**
PopoverAnchoringService.prototype._subscribeToDetachments = /**
* Set state back to closed when detached.

@@ -1081,3 +1146,3 @@ * @return {?}

*/
SatPopoverAnchor.prototype._saveOpenedState = /**
PopoverAnchoringService.prototype._saveOpenedState = /**
* Save the opened state of the popover and emit.

@@ -1088,5 +1153,5 @@ * @return {?}

if (!this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = true;
this.popoverOpened.emit();
this.attachedPopover.opened.emit();
this._popover._open = this._popoverOpen = true;
this.popoverOpened.next();
this._popover.opened.emit();
}

@@ -1099,3 +1164,3 @@ };

*/
SatPopoverAnchor.prototype._saveClosedState = /**
PopoverAnchoringService.prototype._saveClosedState = /**
* Save the closed state of the popover and emit.

@@ -1107,40 +1172,38 @@ * @param {?=} value

if (this._popoverOpen) {
this.attachedPopover._open = this._popoverOpen = false;
this.popoverClosed.emit(value);
this.attachedPopover.closed.emit(value);
this._popover._open = this._popoverOpen = false;
this.popoverClosed.next(value);
this._popover.closed.emit(value);
}
};
/**
* Create an overlay to be attached to the portal.
* Gets the text direction of the containing app.
* @return {?}
*/
SatPopoverAnchor.prototype._createOverlay = /**
* Create an overlay to be attached to the portal.
PopoverAnchoringService.prototype._getDirection = /**
* Gets the text direction of the containing app.
* @return {?}
*/
function () {
if (!this._overlayRef) {
this._portal = new portal.TemplatePortal(this.attachedPopover._templateRef, this._viewContainerRef);
var /** @type {?} */ config = this._getOverlayConfig();
this._subscribeToPositionChanges(/** @type {?} */ (config.positionStrategy));
this._overlayRef = this._overlay.create(config);
}
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
};
/**
* Create and return a config for creating the overlay.
* @param {?} config
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype._getOverlayConfig = /**
PopoverAnchoringService.prototype._getOverlayConfig = /**
* Create and return a config for creating the overlay.
* @param {?} config
* @param {?} anchor
* @return {?}
*/
function () {
var /** @type {?} */ config = new overlay.OverlayConfig({
positionStrategy: this._getPositionStrategy(),
hasBackdrop: this.attachedPopover.hasBackdrop,
backdropClass: this.attachedPopover.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(this.attachedPopover.scrollStrategy),
function (config, anchor) {
return new overlay.OverlayConfig({
positionStrategy: this._getPositionStrategy(config.horizontalAlign, config.verticalAlign, anchor),
hasBackdrop: config.hasBackdrop,
backdropClass: config.backdropClass || 'cdk-overlay-transparent-backdrop',
scrollStrategy: this._getScrollStrategyInstance(config.scrollStrategy),
direction: this._getDirection(),
});
return config;
};

@@ -1153,3 +1216,3 @@ /**

*/
SatPopoverAnchor.prototype._subscribeToPositionChanges = /**
PopoverAnchoringService.prototype._subscribeToPositionChanges = /**
* Listen to changes in the position of the overlay and set the correct alignment classes,

@@ -1162,3 +1225,6 @@ * ensuring that the animation origin is correct, even with a fallback position.

var _this = this;
position.onPositionChange
if (this._positionChangeSubscription) {
this._positionChangeSubscription.unsubscribe();
}
this._positionChangeSubscription = position.onPositionChange
.pipe(takeUntil.takeUntil(this._onDestroy))

@@ -1169,3 +1235,3 @@ .subscribe(function (change) {

_this._ngZone.run(function () {
_this.attachedPopover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
_this._popover._setAlignmentClasses(getHorizontalPopoverAlignment(change.connectionPair.overlayX), getVerticalPopoverAlignment(change.connectionPair.overlayY));
});

@@ -1179,3 +1245,3 @@ });

*/
SatPopoverAnchor.prototype._getScrollStrategyInstance = /**
PopoverAnchoringService.prototype._getScrollStrategyInstance = /**
* Map a scroll strategy string type to an instance of a scroll strategy.

@@ -1186,3 +1252,2 @@ * @param {?} strategy

function (strategy) {
// TODO support 'close' on resolution of https://github.com/angular/material2/issues/7922
switch (strategy) {

@@ -1202,11 +1267,15 @@ case 'block':

* Create and return a position strategy based on config provided to the component instance.
* @param {?} horizontalTarget
* @param {?} verticalTarget
* @param {?} anchor
* @return {?}
*/
SatPopoverAnchor.prototype._getPositionStrategy = /**
PopoverAnchoringService.prototype._getPositionStrategy = /**
* Create and return a position strategy based on config provided to the component instance.
* @param {?} horizontalTarget
* @param {?} verticalTarget
* @param {?} anchor
* @return {?}
*/
function () {
var /** @type {?} */ horizontalTarget = this.attachedPopover.horizontalAlign;
var /** @type {?} */ verticalTarget = this.attachedPopover.verticalAlign;
function (horizontalTarget, verticalTarget, anchor) {
// Attach the overlay at the preferred position

@@ -1216,3 +1285,3 @@ var _a = getHorizontalConnectionPosPair(horizontalTarget), originX = _a.originX, overlayX = _a.overlayX;

var /** @type {?} */ strategy = this._overlay.position()
.connectedTo(this._elementRef, { originX: originX, originY: originY }, { overlayX: overlayX, overlayY: overlayY })
.connectedTo(anchor, { originX: originX, originY: originY }, { overlayX: overlayX, overlayY: overlayY })
.withDirection(this._getDirection());

@@ -1230,3 +1299,3 @@ // Add fallbacks based on the preferred positions

*/
SatPopoverAnchor.prototype._addFallbacks = /**
PopoverAnchoringService.prototype._addFallbacks = /**
* Add fallbacks to a given strategy based around target alignments.

@@ -1273,3 +1342,3 @@ * @param {?} strategy

*/
SatPopoverAnchor.prototype._applyFallback = /**
PopoverAnchoringService.prototype._applyFallback = /**
* Convert a specific horizontal and vertical alignment into a fallback and apply it to

@@ -1287,26 +1356,42 @@ * the strategy.

};
SatPopoverAnchor.decorators = [
{ type: core.Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverNotificationService],
},] },
PopoverAnchoringService.decorators = [
{ type: core.Injectable },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = function () { return [
PopoverAnchoringService.ctorParameters = function () { return [
{ type: overlay.Overlay, },
{ type: core.ElementRef, },
{ type: core.ViewContainerRef, },
{ type: PopoverNotificationService, },
{ type: core.NgZone, },
{ type: Directionality, decorators: [{ type: core.Optional },] },
]; };
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: core.Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: core.Output },],
"popoverClosed": [{ type: core.Output },],
};
return SatPopoverAnchor;
return PopoverAnchoringService;
}());
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function to convert alignment to origin/overlay position pair.

@@ -1350,30 +1435,2 @@ * @param {?} h

/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} h
* @return {?}
*/
function getHorizontalPopoverAlignment(h) {
if (h === 'start') {
return 'after';
}
if (h === 'end') {
return 'before';
}
return 'center';
}
/**
* Helper function to convert an overlay connection position to equivalent popover alignment.
* @param {?} v
* @return {?}
*/
function getVerticalPopoverAlignment(v) {
if (v === 'top') {
return 'below';
}
if (v === 'bottom') {
return 'above';
}
return 'center';
}
/**
* Helper function that takes an ordered array options and returns a reorderded

@@ -1417,2 +1474,154 @@ * array around the target item. e.g.:

*/
var SatPopoverAnchor = (function () {
function SatPopoverAnchor(_elementRef, _viewContainerRef, _anchoring) {
this._elementRef = _elementRef;
this._viewContainerRef = _viewContainerRef;
this._anchoring = _anchoring;
/**
* Emits when the popover is opened.
*/
this.popoverOpened = new core.EventEmitter();
/**
* Emits when the popover is closed.
*/
this.popoverClosed = new core.EventEmitter();
/**
* Emits when the directive is destroyed.
*/
this._onDestroy = new Subject.Subject();
}
Object.defineProperty(SatPopoverAnchor.prototype, "attachedPopover", {
get: /**
* Reference to the popover instance.
* @return {?}
*/
function () { return this._attachedPopover; },
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._validateAttachedPopover(value);
this._attachedPopover = value;
// Anchor the popover to the element ref
this._anchoring.anchor(this.attachedPopover, this._viewContainerRef, this._elementRef);
},
enumerable: true,
configurable: true
});
/** Gets whether the popover is presently open. */
/**
* Gets whether the popover is presently open.
* @return {?}
*/
SatPopoverAnchor.prototype.isPopoverOpen = /**
* Gets whether the popover is presently open.
* @return {?}
*/
function () {
return this._anchoring.isPopoverOpen();
};
/**
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
// Re-emit open and close events
var /** @type {?} */ opened$ = this._anchoring.popoverOpened
.pipe(tap.tap(function () { return _this.popoverOpened.emit(); }));
var /** @type {?} */ closed$ = this._anchoring.popoverClosed
.pipe(tap.tap(function (value) { return _this.popoverClosed.emit(value); }));
merge.merge(opened$, closed$).pipe(takeUntil.takeUntil(this._onDestroy)).subscribe();
};
/**
* @return {?}
*/
SatPopoverAnchor.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this._onDestroy.next();
this._onDestroy.complete();
};
/** Toggles the popover between the open and closed states. */
/**
* Toggles the popover between the open and closed states.
* @return {?}
*/
SatPopoverAnchor.prototype.togglePopover = /**
* Toggles the popover between the open and closed states.
* @return {?}
*/
function () {
this._anchoring.togglePopover();
};
/** Opens the popover. */
/**
* Opens the popover.
* @return {?}
*/
SatPopoverAnchor.prototype.openPopover = /**
* Opens the popover.
* @return {?}
*/
function () {
this._anchoring.openPopover();
};
/** Closes the popover. */
/**
* Closes the popover.
* @param {?=} value
* @return {?}
*/
SatPopoverAnchor.prototype.closePopover = /**
* Closes the popover.
* @param {?=} value
* @return {?}
*/
function (value) {
this._anchoring.closePopover(value);
};
/**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
SatPopoverAnchor.prototype._validateAttachedPopover = /**
* Throws an error if the popover instance is not provided.
* @param {?} popover
* @return {?}
*/
function (popover) {
if (!popover || !(popover instanceof SatPopover)) {
throw getInvalidPopoverError();
}
};
SatPopoverAnchor.decorators = [
{ type: core.Directive, args: [{
selector: '[satPopoverAnchorFor]',
exportAs: 'satPopoverAnchor',
providers: [PopoverAnchoringService],
},] },
];
/** @nocollapse */
SatPopoverAnchor.ctorParameters = function () { return [
{ type: core.ElementRef, },
{ type: core.ViewContainerRef, },
{ type: PopoverAnchoringService, },
]; };
SatPopoverAnchor.propDecorators = {
"attachedPopover": [{ type: core.Input, args: ['satPopoverAnchorFor',] },],
"popoverOpened": [{ type: core.Output },],
"popoverClosed": [{ type: core.Output },],
};
return SatPopoverAnchor;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var SatPopoverModule = (function () {

@@ -1436,2 +1645,3 @@ function SatPopoverModule() {

SatPopoverAnchor,
BidiModule,
]

@@ -1461,3 +1671,3 @@ },] },

exports.SatPopover = SatPopover;
exports.ɵb = PopoverNotificationService;
exports.ɵb = PopoverAnchoringService;
exports.ɵa = transformPopover;

@@ -1464,0 +1674,0 @@

2

bundles/sat-popover.umd.min.js

@@ -1,2 +0,2 @@

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/cdk/overlay"),require("@angular/cdk/a11y"),require("@angular/platform-browser"),require("@angular/cdk/coercion"),require("@angular/animations"),require("rxjs/Subject"),require("@angular/cdk/portal"),require("@angular/cdk/keycodes"),require("rxjs/operators/take"),require("rxjs/operators/takeUntil"),require("rxjs/operators/filter"),require("rxjs/operators/tap")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/cdk/overlay","@angular/cdk/a11y","@angular/platform-browser","@angular/cdk/coercion","@angular/animations","rxjs/Subject","@angular/cdk/portal","@angular/cdk/keycodes","rxjs/operators/take","rxjs/operators/takeUntil","rxjs/operators/filter","rxjs/operators/tap"],e):e(t.popover={},t.ng.core,t.ng.common,t.ng.cdk.overlay,t.ng.cdk.a11y,t.ng.platformBrowser,t.ng.cdk.coercion,t.ng.animations,t.Rx,t.ng.cdk.portal,t.ng.cdk.keycodes,t.Rx.operators,t.Rx.operators,t.Rx.operators,t.Rx.operators)}(this,function(t,e,o,r,n,i,a,s,p,c,l,u,h,f,v){"use strict";function d(){return Error("SatPopoverAnchor must be provided an SatPopover component instance.")}function y(){return Error("SatPopover is not anchored to any SatPopoverAnchor.")}function g(t){return Error(m("horizontalAlign/xAlign",t,D))}function _(t){return Error(m("verticalAlign/yAlign",t,F))}function b(t){return Error(m("scrollStrategy",t,N))}function m(t,e,o){return"Invalid "+t+": '"+e+"'. Valid options are "+o.map(function(t){return"'"+t+"'"}).join(", ")+"."}function P(t){switch(t){case"before":return{originX:"start",overlayX:"end"};case"start":return{originX:"start",overlayX:"start"};case"end":return{originX:"end",overlayX:"end"};case"after":return{originX:"end",overlayX:"start"};default:return{originX:"center",overlayX:"center"}}}function O(t){switch(t){case"above":return{originY:"top",overlayY:"bottom"};case"start":return{originY:"top",overlayY:"top"};case"end":return{originY:"bottom",overlayY:"bottom"};case"below":return{originY:"bottom",overlayY:"top"};default:return{originY:"center",overlayY:"center"}}}function k(t){return"start"===t?"after":"end"===t?"before":"center"}function E(t){return"top"===t?"below":"bottom"===t?"above":"center"}function w(t,e){for(var o=e.indexOf(t),r=[t],n=e.slice(0,o),i=e.slice(o+1,e.length).reverse();n.length&&i.length;)r.push(i.pop()),r.push(n.pop());for(;i.length;)r.push(i.pop());for(;n.length;)r.push(n.pop());return r}var T=new e.InjectionToken("cdk-dir-doc"),A=function(){function t(t){if(this.value="ltr",this.change=new e.EventEmitter,t){var o=t.body?t.body.dir:null,r=t.documentElement?t.documentElement.dir:null;this.value=o||r||"ltr"}}return t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:void 0,decorators:[{type:e.Optional},{type:e.Inject,args:[T]}]}]},t}(),C=function(){function t(){this._dir="ltr",this._isInitialized=!1,this.change=new e.EventEmitter}return Object.defineProperty(t.prototype,"dir",{get:function(){return this._dir},set:function(t){var e=this._dir;this._dir=t,e!==this._dir&&this._isInitialized&&this.change.emit(this._dir)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"value",{get:function(){return this.dir},enumerable:!0,configurable:!0}),t.prototype.ngAfterContentInit=function(){this._isInitialized=!0},t.decorators=[{type:e.Directive,args:[{selector:"[dir]",providers:[{provide:A,useExisting:t}],host:{"[dir]":"dir"},exportAs:"dir"}]}],t.ctorParameters=function(){return[]},t.propDecorators={change:[{type:e.Output,args:["dirChange"]}],dir:[{type:e.Input,args:["dir"]}]},t}(),S=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{exports:[C],declarations:[C],providers:[{provide:T,useExisting:o.DOCUMENT},A]}]}],t.ctorParameters=function(){return[]},t}(),x=s.trigger("transformPopover",[s.transition(":enter",[s.style({opacity:0,transform:"scale(0.3)"}),s.animate("{{openTransition}}",s.style({opacity:1,transform:"scale(1)"}))]),s.transition(":leave",[s.animate("{{closeTransition}}",s.style({opacity:0,transform:"scale(0.5)"}))])]),I={OPEN:0,CLOSE:1,TOGGLE:2,REPOSITION:3,UPDATE_CONFIG:4};I[I.OPEN]="OPEN",I[I.CLOSE]="CLOSE",I[I.TOGGLE]="TOGGLE",I[I.REPOSITION]="REPOSITION",I[I.UPDATE_CONFIG]="UPDATE_CONFIG";var R=function(){return function(t,e){this.action=t,this.value=e}}(),j=function(){function t(){this.store=new p.Subject}return t.prototype.dispatch=function(t){this.store.next(t)},t.prototype.events=function(){return this.store.asObservable()},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[]},t}(),N=["noop","block","reposition","close"],D=["before","start","center","end","after"],F=["above","start","center","end","below"],z="200ms cubic-bezier(0.25, 0.8, 0.25, 1)",X=function(){function t(t,o){this._focusTrapFactory=t,this._document=o,this._horizontalAlign="center",this._verticalAlign="center",this._scrollStrategy="reposition",this._hasBackdrop=!1,this._openTransition=z,this._closeTransition=z,this.backdropClass="",this.opened=new e.EventEmitter,this.closed=new e.EventEmitter,this.afterOpen=new e.EventEmitter,this.afterClose=new e.EventEmitter,this.backdropClicked=new e.EventEmitter,this.overlayKeydown=new e.EventEmitter,this._classList={},this._open=!1}return Object.defineProperty(t.prototype,"horizontalAlign",{get:function(){return this._horizontalAlign},set:function(t){this._validateHorizontalAlign(t),this._horizontalAlign!==t&&(this._horizontalAlign=t,this._dispatchConfigNotification(new R(I.REPOSITION)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"xAlign",{get:function(){return this.horizontalAlign},set:function(t){this.horizontalAlign=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"verticalAlign",{get:function(){return this._verticalAlign},set:function(t){this._validateVerticalAlign(t),this._verticalAlign!==t&&(this._verticalAlign=t,this._dispatchConfigNotification(new R(I.REPOSITION)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"yAlign",{get:function(){return this.verticalAlign},set:function(t){this.verticalAlign=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"scrollStrategy",{get:function(){return this._scrollStrategy},set:function(t){this._validateScrollStrategy(t),this._scrollStrategy!==t&&(this._scrollStrategy=t,this._dispatchConfigNotification(new R(I.UPDATE_CONFIG)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"hasBackdrop",{get:function(){return this._hasBackdrop},set:function(t){this._hasBackdrop=a.coerceBooleanProperty(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"openTransition",{get:function(){return this._openTransition},set:function(t){t&&(this._openTransition=t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"closeTransition",{get:function(){return this._closeTransition},set:function(t){t&&(this._closeTransition=t)},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){this._setAlignmentClasses()},t.prototype.open=function(){var t=new R(I.OPEN);this._dispatchActionNotification(t)},t.prototype.close=function(t){var e=new R(I.CLOSE,t);this._dispatchActionNotification(e)},t.prototype.toggle=function(){var t=new R(I.TOGGLE);this._dispatchActionNotification(t)},t.prototype.isOpen=function(){return this._open},t.prototype._getAnimation=function(){return{value:"visible",params:{openTransition:this.openTransition,closeTransition:this.closeTransition}}},t.prototype._onAnimationDone=function(t){"visible"===t.toState?(this._trapFocus(),this.afterOpen.emit()):"void"===t.toState&&(this._restoreFocus(),this.afterClose.emit())},t.prototype._setAlignmentClasses=function(t,e){void 0===t&&(t=this.horizontalAlign),void 0===e&&(e=this.verticalAlign),this._classList["sat-popover-before"]="before"===t||"end"===t,this._classList["sat-popover-after"]="after"===t||"start"===t,this._classList["sat-popover-above"]="above"===e||"end"===e,this._classList["sat-popover-below"]="below"===e||"start"===e,this._classList["sat-popover-center"]="center"===t||"center"===e},t.prototype._trapFocus=function(){this._savePreviouslyFocusedElement(),this._focusTrapElement&&(!this._focusTrap&&this._focusTrapElement&&(this._focusTrap=this._focusTrapFactory.create(this._focusTrapElement.nativeElement)),this._focusTrap.focusInitialElementWhenReady())},t.prototype._restoreFocus=function(){var t=this._previouslyFocusedElement;t&&"focus"in t&&this._previouslyFocusedElement.focus(),this._previouslyFocusedElement=null,this._focusTrap&&(this._focusTrap.destroy(),this._focusTrap=void 0)},t.prototype._savePreviouslyFocusedElement=function(){this._document&&(this._previouslyFocusedElement=this._document.activeElement)},t.prototype._dispatchConfigNotification=function(t){this._notifications&&this._notifications.dispatch(t)},t.prototype._dispatchActionNotification=function(t){if(!this._notifications)throw y();this._notifications.dispatch(t)},t.prototype._validateHorizontalAlign=function(t){if(-1===D.indexOf(t))throw g(t)},t.prototype._validateVerticalAlign=function(t){if(-1===F.indexOf(t))throw _(t)},t.prototype._validateScrollStrategy=function(t){if(-1===N.indexOf(t))throw b(t)},t.decorators=[{type:e.Component,args:[{selector:"sat-popover",encapsulation:e.ViewEncapsulation.None,animations:[x],styles:["/** * Applies styles for users in high contrast mode. Note that this only applies * to Microsoft browsers. Chrome can be included by checking for the `html[hc]` * attribute, however Chrome handles high contrast differently. */ /* Theme for the ripple elements.*/ /** The mixins below are shared between mat-menu and mat-select */ /** * This mixin adds the correct panel transform styles based * on the direction that the menu panel opens. */ /* stylelint-disable material/no-prefixes */ /* stylelint-enable */ /** * This mixin contains shared option styles between the select and * autocomplete components. */ .cdk-overlay-container, .cdk-global-overlay-wrapper { pointer-events: none; top: 0; left: 0; height: 100%; width: 100%; } .cdk-overlay-container { position: fixed; z-index: 1000; } .cdk-global-overlay-wrapper { display: flex; position: absolute; z-index: 1000; } .cdk-overlay-pane { position: absolute; pointer-events: auto; box-sizing: border-box; z-index: 1000; } .cdk-overlay-backdrop { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1000; pointer-events: auto; -webkit-tap-highlight-color: transparent; transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 0; } .cdk-overlay-backdrop.cdk-overlay-backdrop-showing { opacity: 0.48; } .cdk-overlay-dark-backdrop { background: rgba(0, 0, 0, 0.6); } .cdk-overlay-transparent-backdrop { background: none; } .cdk-global-scrollblock { position: fixed; width: 100%; overflow-y: scroll; } .sat-popover-container.sat-popover-before.sat-popover-above { transform-origin: right bottom; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-above { transform-origin: left bottom; } .sat-popover-container.sat-popover-before.sat-popover-center { transform-origin: right center; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-center { transform-origin: left center; } .sat-popover-container.sat-popover-before.sat-popover-below { transform-origin: right top; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-below { transform-origin: left top; } .sat-popover-container.sat-popover-center.sat-popover-above { transform-origin: center bottom; } .sat-popover-container.sat-popover-center.sat-popover-below { transform-origin: center top; } .sat-popover-container.sat-popover-after.sat-popover-above { transform-origin: left bottom; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-above { transform-origin: right bottom; } .sat-popover-container.sat-popover-after.sat-popover-center { transform-origin: left center; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-center { transform-origin: right center; } .sat-popover-container.sat-popover-after.sat-popover-below { transform-origin: left top; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-below { transform-origin: right top; } "],template:'<ng-template> <div class="sat-popover-container" #focusTrapElement [ngClass]="_classList" [@transformPopover]="_getAnimation()" (@transformPopover.done)="_onAnimationDone($event)"> <ng-content></ng-content> </div> </ng-template> '}]}],t.ctorParameters=function(){return[{type:n.FocusTrapFactory},{type:void 0,decorators:[{type:e.Optional},{type:e.Inject,args:[i.DOCUMENT]}]}]},t.propDecorators={horizontalAlign:[{type:e.Input}],xAlign:[{type:e.Input}],verticalAlign:[{type:e.Input}],yAlign:[{type:e.Input}],scrollStrategy:[{type:e.Input}],hasBackdrop:[{type:e.Input}],openTransition:[{type:e.Input}],closeTransition:[{type:e.Input}],backdropClass:[{type:e.Input}],opened:[{type:e.Output}],closed:[{type:e.Output}],afterOpen:[{type:e.Output}],afterClose:[{type:e.Output}],backdropClicked:[{type:e.Output}],overlayKeydown:[{type:e.Output}],_templateRef:[{type:e.ViewChild,args:[e.TemplateRef]}],_focusTrapElement:[{type:e.ViewChild,args:["focusTrapElement"]}]},t}(),Y=function(){function t(t,o,r,n,i,a){this._overlay=t,this._elementRef=o,this._viewContainerRef=r,this._notifications=n,this._ngZone=i,this._dir=a,this.popoverOpened=new e.EventEmitter,this.popoverClosed=new e.EventEmitter,this._popoverOpen=!1,this._onDestroy=new p.Subject}return Object.defineProperty(t.prototype,"attachedPopover",{get:function(){return this._attachedPopover},set:function(t){this._validateAttachedPopover(t),this._attachedPopover=t,this._attachedPopover._notifications=this._notifications},enumerable:!0,configurable:!0}),t.prototype.isPopoverOpen=function(){return this._popoverOpen},t.prototype.ngOnInit=function(){this._subscribeToNotifications(),this._validateAttachedPopover(this.attachedPopover)},t.prototype.ngOnDestroy=function(){this._onDestroy.next(),this._onDestroy.complete(),this._destroyPopover()},t.prototype.togglePopover=function(){return this._popoverOpen?this.closePopover():this.openPopover()},t.prototype.openPopover=function(){this._popoverOpen||(this._createOverlay(),this._overlayRef.attach(this._portal),this._subscribeToBackdrop(),this._subscribeToEscape(),this._subscribeToDetachments(),this._saveOpenedState())},t.prototype.closePopover=function(t){this._overlayRef&&(this._saveClosedState(t),this._overlayRef.detach())},t.prototype._getDirection=function(){return this._dir&&"rtl"===this._dir.value?"rtl":"ltr"},t.prototype._destroyPopover=function(){this._overlayRef&&(this._overlayRef.dispose(),this._overlayRef=null)},t.prototype._destroyPopoverOnceClosed=function(){var t=this;this.isPopoverOpen()&&this._overlayRef?this._overlayRef.detachments().pipe(u.take(1),h.takeUntil(this._onDestroy)).subscribe(function(){return t._destroyPopover()}):this._destroyPopover()},t.prototype._validateAttachedPopover=function(t){if(!(t&&t instanceof X))throw d()},t.prototype._subscribeToNotifications=function(){var t=this;this._notifications.events().pipe(h.takeUntil(this._onDestroy)).subscribe(function(e){switch(e.action){case I.OPEN:t.openPopover();break;case I.CLOSE:t.closePopover(e.value);break;case I.TOGGLE:t.togglePopover();break;case I.REPOSITION:case I.UPDATE_CONFIG:t._destroyPopoverOnceClosed()}})},t.prototype._subscribeToBackdrop=function(){var t=this;this._overlayRef.backdropClick().pipe(h.takeUntil(this.popoverClosed),h.takeUntil(this._onDestroy)).subscribe(function(){t.attachedPopover.backdropClicked.emit(),t.closePopover()})},t.prototype._subscribeToEscape=function(){var t=this;this._overlayRef.keydownEvents().pipe(v.tap(function(e){return t.attachedPopover.overlayKeydown.emit(e)}),f.filter(function(t){return t.keyCode===l.ESCAPE}),h.takeUntil(this.popoverClosed),h.takeUntil(this._onDestroy)).subscribe(function(){return t.closePopover()})},t.prototype._subscribeToDetachments=function(){var t=this;this._overlayRef.detachments().pipe(h.takeUntil(this._onDestroy)).subscribe(function(){return t._saveClosedState()})},t.prototype._saveOpenedState=function(){this._popoverOpen||(this.attachedPopover._open=this._popoverOpen=!0,this.popoverOpened.emit(),this.attachedPopover.opened.emit())},t.prototype._saveClosedState=function(t){this._popoverOpen&&(this.attachedPopover._open=this._popoverOpen=!1,this.popoverClosed.emit(t),this.attachedPopover.closed.emit(t))},t.prototype._createOverlay=function(){if(!this._overlayRef){this._portal=new c.TemplatePortal(this.attachedPopover._templateRef,this._viewContainerRef);var t=this._getOverlayConfig();this._subscribeToPositionChanges(t.positionStrategy),this._overlayRef=this._overlay.create(t)}},t.prototype._getOverlayConfig=function(){return new r.OverlayConfig({positionStrategy:this._getPositionStrategy(),hasBackdrop:this.attachedPopover.hasBackdrop,backdropClass:this.attachedPopover.backdropClass||"cdk-overlay-transparent-backdrop",scrollStrategy:this._getScrollStrategyInstance(this.attachedPopover.scrollStrategy),direction:this._getDirection()})},t.prototype._subscribeToPositionChanges=function(t){var e=this;t.onPositionChange.pipe(h.takeUntil(this._onDestroy)).subscribe(function(t){e._ngZone.run(function(){e.attachedPopover._setAlignmentClasses(k(t.connectionPair.overlayX),E(t.connectionPair.overlayY))})})},t.prototype._getScrollStrategyInstance=function(t){switch(t){case"block":return this._overlay.scrollStrategies.block();case"reposition":return this._overlay.scrollStrategies.reposition();case"close":return this._overlay.scrollStrategies.close();case"noop":default:return this._overlay.scrollStrategies.noop()}},t.prototype._getPositionStrategy=function(){var t=this.attachedPopover.horizontalAlign,e=this.attachedPopover.verticalAlign,o=P(t),r=o.originX,n=o.overlayX,i=O(e),a=i.originY,s=i.overlayY,p=this._overlay.position().connectedTo(this._elementRef,{originX:r,originY:a},{overlayX:n,overlayY:s}).withDirection(this._getDirection());return this._addFallbacks(p,t,e),p},t.prototype._addFallbacks=function(t,e,o){var r=this,n="before"!==e&&"after"!==e,i="above"!==o&&"below"!==o,a=n?["before","start","center","end","after"]:["before","after"],s=i?["above","start","center","end","below"]:["above","below"],p=[];w(e,a).forEach(function(t){w(o,s).forEach(function(e){p.push({h:t,v:e})})}),p.slice(1,p.length).forEach(function(e){var o=e.h,n=e.v;return r._applyFallback(t,o,n)})},t.prototype._applyFallback=function(t,e,o){var r=P(e),n=r.originX,i=r.overlayX,a=O(o),s=a.originY,p=a.overlayY;t.withFallbackPosition({originX:n,originY:s},{overlayX:i,overlayY:p})},t.decorators=[{type:e.Directive,args:[{selector:"[satPopoverAnchorFor]",exportAs:"satPopoverAnchor",providers:[j]}]}],t.ctorParameters=function(){return[{type:r.Overlay},{type:e.ElementRef},{type:e.ViewContainerRef},{type:j},{type:e.NgZone},{type:A,decorators:[{type:e.Optional}]}]},t.propDecorators={attachedPopover:[{type:e.Input,args:["satPopoverAnchorFor"]}],popoverOpened:[{type:e.Output}],popoverClosed:[{type:e.Output}]},t}(),L=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{imports:[o.CommonModule,r.OverlayModule,n.A11yModule,S],declarations:[X,Y],exports:[X,Y]}]}],t.ctorParameters=function(){return[]},t}();t.SatPopoverModule=L,t.SatPopoverAnchor=Y,t.SatPopover=X,t.ɵb=j,t.ɵa=x,Object.defineProperty(t,"__esModule",{value:!0})});
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/cdk/overlay"),require("@angular/cdk/a11y"),require("@angular/platform-browser"),require("@angular/cdk/coercion"),require("@angular/animations"),require("rxjs/Subject"),require("rxjs/observable/merge"),require("rxjs/operators/tap"),require("rxjs/operators/takeUntil"),require("@angular/cdk/keycodes"),require("@angular/cdk/portal"),require("rxjs/operators/take"),require("rxjs/operators/filter")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/cdk/overlay","@angular/cdk/a11y","@angular/platform-browser","@angular/cdk/coercion","@angular/animations","rxjs/Subject","rxjs/observable/merge","rxjs/operators/tap","rxjs/operators/takeUntil","@angular/cdk/keycodes","@angular/cdk/portal","rxjs/operators/take","rxjs/operators/filter"],e):e(t.popover={},t.ng.core,t.ng.common,t.ng.cdk.overlay,t.ng.cdk.a11y,t.ng.platformBrowser,t.ng.cdk.coercion,t.ng.animations,t.Rx,t.Rx.Observable,t.Rx.operators,t.Rx.operators,t.ng.cdk.keycodes,t.ng.cdk.portal,t.Rx.operators,t.Rx.operators)}(this,function(t,e,o,r,n,i,s,a,p,c,l,u,h,f,v,d){"use strict";function y(){return Error("SatPopoverAnchor must be provided an SatPopover component instance.")}function g(){return Error("SatPopover is not anchored to any SatPopoverAnchor.")}function _(t){return Error(O("horizontalAlign/xAlign",t,F))}function b(t){return Error(O("verticalAlign/yAlign",t,z))}function m(t){return Error(O("scrollStrategy",t,N))}function O(t,e,o){return"Invalid "+t+": '"+e+"'. Valid options are "+o.map(function(t){return"'"+t+"'"}).join(", ")+"."}function P(t){return"start"===t?"after":"end"===t?"before":"center"}function k(t){return"top"===t?"below":"bottom"===t?"above":"center"}function E(t){switch(t){case"before":return{originX:"start",overlayX:"end"};case"start":return{originX:"start",overlayX:"start"};case"end":return{originX:"end",overlayX:"end"};case"after":return{originX:"end",overlayX:"start"};default:return{originX:"center",overlayX:"center"}}}function C(t){switch(t){case"above":return{originY:"top",overlayY:"bottom"};case"start":return{originY:"top",overlayY:"top"};case"end":return{originY:"bottom",overlayY:"bottom"};case"below":return{originY:"bottom",overlayY:"top"};default:return{originY:"center",overlayY:"center"}}}function w(t,e){for(var o=e.indexOf(t),r=[t],n=e.slice(0,o),i=e.slice(o+1,e.length).reverse();n.length&&i.length;)r.push(i.pop()),r.push(n.pop());for(;i.length;)r.push(i.pop());for(;n.length;)r.push(n.pop());return r}var S=new e.InjectionToken("cdk-dir-doc"),T=function(){function t(t){if(this.value="ltr",this.change=new e.EventEmitter,t){var o=t.body?t.body.dir:null,r=t.documentElement?t.documentElement.dir:null;this.value=o||r||"ltr"}}return t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:void 0,decorators:[{type:e.Optional},{type:e.Inject,args:[S]}]}]},t}(),A=function(){function t(){this._dir="ltr",this._isInitialized=!1,this.change=new e.EventEmitter}return Object.defineProperty(t.prototype,"dir",{get:function(){return this._dir},set:function(t){var e=this._dir;this._dir=t,e!==this._dir&&this._isInitialized&&this.change.emit(this._dir)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"value",{get:function(){return this.dir},enumerable:!0,configurable:!0}),t.prototype.ngAfterContentInit=function(){this._isInitialized=!0},t.decorators=[{type:e.Directive,args:[{selector:"[dir]",providers:[{provide:T,useExisting:t}],host:{"[dir]":"dir"},exportAs:"dir"}]}],t.ctorParameters=function(){return[]},t.propDecorators={change:[{type:e.Output,args:["dirChange"]}],dir:[{type:e.Input,args:["dir"]}]},t}(),x=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{exports:[A],declarations:[A],providers:[{provide:S,useExisting:o.DOCUMENT},T]}]}],t.ctorParameters=function(){return[]},t}(),I=a.trigger("transformPopover",[a.transition(":enter",[a.style({opacity:0,transform:"scale(0.3)"}),a.animate("{{openTransition}}",a.style({opacity:1,transform:"scale(1)"}))]),a.transition(":leave",[a.animate("{{closeTransition}}",a.style({opacity:0,transform:"scale(0.5)"}))])]),j={OPEN:0,CLOSE:1,TOGGLE:2,REPOSITION:3,UPDATE_CONFIG:4};j[j.OPEN]="OPEN",j[j.CLOSE]="CLOSE",j[j.TOGGLE]="TOGGLE",j[j.REPOSITION]="REPOSITION",j[j.UPDATE_CONFIG]="UPDATE_CONFIG";var R=function(){return function(t,e){this.action=t,this.value=e}}(),D=function(){function t(){this.store=new p.Subject}return t.prototype.dispatch=function(t){this.store.next(t)},t.prototype.events=function(){return this.store.asObservable()},t.prototype.dispose=function(){this.store.complete()},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[]},t}(),N=["noop","block","reposition","close"],F=["before","start","center","end","after"],z=["above","start","center","end","below"],X="200ms cubic-bezier(0.25, 0.8, 0.25, 1)",Y=function(){function t(t,o){this._focusTrapFactory=t,this._document=o,this._horizontalAlign="center",this._verticalAlign="center",this._autoFocus=!0,this._scrollStrategy="reposition",this._hasBackdrop=!1,this._interactiveClose=!0,this._openTransition=X,this._closeTransition=X,this.backdropClass="",this.opened=new e.EventEmitter,this.closed=new e.EventEmitter,this.afterOpen=new e.EventEmitter,this.afterClose=new e.EventEmitter,this.backdropClicked=new e.EventEmitter,this.overlayKeydown=new e.EventEmitter,this._classList={},this._open=!1}return Object.defineProperty(t.prototype,"horizontalAlign",{get:function(){return this._horizontalAlign},set:function(t){this._validateHorizontalAlign(t),this._horizontalAlign!==t&&(this._horizontalAlign=t,this._dispatchConfigNotification(new R(j.REPOSITION)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"xAlign",{get:function(){return this.horizontalAlign},set:function(t){this.horizontalAlign=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"verticalAlign",{get:function(){return this._verticalAlign},set:function(t){this._validateVerticalAlign(t),this._verticalAlign!==t&&(this._verticalAlign=t,this._dispatchConfigNotification(new R(j.REPOSITION)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"yAlign",{get:function(){return this.verticalAlign},set:function(t){this.verticalAlign=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"autoFocus",{get:function(){return this._autoFocus},set:function(t){this._autoFocus=s.coerceBooleanProperty(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"scrollStrategy",{get:function(){return this._scrollStrategy},set:function(t){this._validateScrollStrategy(t),this._scrollStrategy!==t&&(this._scrollStrategy=t,this._dispatchConfigNotification(new R(j.UPDATE_CONFIG)))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"hasBackdrop",{get:function(){return this._hasBackdrop},set:function(t){this._hasBackdrop=s.coerceBooleanProperty(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"interactiveClose",{get:function(){return this._interactiveClose},set:function(t){this._interactiveClose=s.coerceBooleanProperty(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"openTransition",{get:function(){return this._openTransition},set:function(t){t&&(this._openTransition=t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"closeTransition",{get:function(){return this._closeTransition},set:function(t){t&&(this._closeTransition=t)},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){this._setAlignmentClasses()},t.prototype.ngOnDestroy=function(){this._notifications&&this._notifications.dispose()},t.prototype.open=function(){var t=new R(j.OPEN);this._dispatchActionNotification(t)},t.prototype.close=function(t){var e=new R(j.CLOSE,t);this._dispatchActionNotification(e)},t.prototype.toggle=function(){var t=new R(j.TOGGLE);this._dispatchActionNotification(t)},t.prototype.isOpen=function(){return this._open},t.prototype._getAnimation=function(){return{value:"visible",params:{openTransition:this.openTransition,closeTransition:this.closeTransition}}},t.prototype._onAnimationDone=function(t){"visible"===t.toState?(this._trapFocus(),this.afterOpen.emit()):"void"===t.toState&&(this._restoreFocus(),this.afterClose.emit())},t.prototype._setAlignmentClasses=function(t,e){void 0===t&&(t=this.horizontalAlign),void 0===e&&(e=this.verticalAlign),this._classList["sat-popover-before"]="before"===t||"end"===t,this._classList["sat-popover-after"]="after"===t||"start"===t,this._classList["sat-popover-above"]="above"===e||"end"===e,this._classList["sat-popover-below"]="below"===e||"start"===e,this._classList["sat-popover-center"]="center"===t||"center"===e},t.prototype._trapFocus=function(){this._savePreviouslyFocusedElement(),this._focusTrapElement&&(!this._focusTrap&&this._focusTrapElement&&(this._focusTrap=this._focusTrapFactory.create(this._focusTrapElement.nativeElement)),this.autoFocus&&this._focusTrap.focusInitialElementWhenReady())},t.prototype._restoreFocus=function(){var t=this._previouslyFocusedElement;t&&"focus"in t&&this._previouslyFocusedElement.focus(),this._previouslyFocusedElement=null,this._focusTrap&&(this._focusTrap.destroy(),this._focusTrap=void 0)},t.prototype._savePreviouslyFocusedElement=function(){this._document&&(this._previouslyFocusedElement=this._document.activeElement)},t.prototype._dispatchConfigNotification=function(t){this._notifications&&this._notifications.dispatch(t)},t.prototype._dispatchActionNotification=function(t){if(!this._notifications)throw g();this._notifications.dispatch(t)},t.prototype._validateHorizontalAlign=function(t){if(-1===F.indexOf(t))throw _(t)},t.prototype._validateVerticalAlign=function(t){if(-1===z.indexOf(t))throw b(t)},t.prototype._validateScrollStrategy=function(t){if(-1===N.indexOf(t))throw m(t)},t.decorators=[{type:e.Component,args:[{selector:"sat-popover",encapsulation:e.ViewEncapsulation.None,animations:[I],styles:["/** * Applies styles for users in high contrast mode. Note that this only applies * to Microsoft browsers. Chrome can be included by checking for the `html[hc]` * attribute, however Chrome handles high contrast differently. */ /* Theme for the ripple elements.*/ /** The mixins below are shared between mat-menu and mat-select */ /** * This mixin adds the correct panel transform styles based * on the direction that the menu panel opens. */ /* stylelint-disable material/no-prefixes */ /* stylelint-enable */ /** * This mixin contains shared option styles between the select and * autocomplete components. */ .cdk-overlay-container, .cdk-global-overlay-wrapper { pointer-events: none; top: 0; left: 0; height: 100%; width: 100%; } .cdk-overlay-container { position: fixed; z-index: 1000; } .cdk-global-overlay-wrapper { display: flex; position: absolute; z-index: 1000; } .cdk-overlay-pane { position: absolute; pointer-events: auto; box-sizing: border-box; z-index: 1000; } .cdk-overlay-backdrop { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1000; pointer-events: auto; -webkit-tap-highlight-color: transparent; transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 0; } .cdk-overlay-backdrop.cdk-overlay-backdrop-showing { opacity: 0.48; } .cdk-overlay-dark-backdrop { background: rgba(0, 0, 0, 0.6); } .cdk-overlay-transparent-backdrop { background: none; } .cdk-global-scrollblock { position: fixed; width: 100%; overflow-y: scroll; } .sat-popover-container.sat-popover-before.sat-popover-above { transform-origin: right bottom; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-above { transform-origin: left bottom; } .sat-popover-container.sat-popover-before.sat-popover-center { transform-origin: right center; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-center { transform-origin: left center; } .sat-popover-container.sat-popover-before.sat-popover-below { transform-origin: right top; } [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-below { transform-origin: left top; } .sat-popover-container.sat-popover-center.sat-popover-above { transform-origin: center bottom; } .sat-popover-container.sat-popover-center.sat-popover-below { transform-origin: center top; } .sat-popover-container.sat-popover-after.sat-popover-above { transform-origin: left bottom; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-above { transform-origin: right bottom; } .sat-popover-container.sat-popover-after.sat-popover-center { transform-origin: left center; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-center { transform-origin: right center; } .sat-popover-container.sat-popover-after.sat-popover-below { transform-origin: left top; } [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-below { transform-origin: right top; } "],template:'<ng-template> <div class="sat-popover-container" #focusTrapElement [ngClass]="_classList" [@transformPopover]="_getAnimation()" (@transformPopover.done)="_onAnimationDone($event)"> <ng-content></ng-content> </div> </ng-template> '}]}],t.ctorParameters=function(){return[{type:n.FocusTrapFactory},{type:void 0,decorators:[{type:e.Optional},{type:e.Inject,args:[i.DOCUMENT]}]}]},t.propDecorators={horizontalAlign:[{type:e.Input}],xAlign:[{type:e.Input}],verticalAlign:[{type:e.Input}],yAlign:[{type:e.Input}],autoFocus:[{type:e.Input}],scrollStrategy:[{type:e.Input}],hasBackdrop:[{type:e.Input}],interactiveClose:[{type:e.Input}],openTransition:[{type:e.Input}],closeTransition:[{type:e.Input}],backdropClass:[{type:e.Input}],opened:[{type:e.Output}],closed:[{type:e.Output}],afterOpen:[{type:e.Output}],afterClose:[{type:e.Output}],backdropClicked:[{type:e.Output}],overlayKeydown:[{type:e.Output}],_templateRef:[{type:e.ViewChild,args:[e.TemplateRef]}],_focusTrapElement:[{type:e.ViewChild,args:["focusTrapElement"]}]},t}(),L=function(){function t(t,e,o){this._overlay=t,this._ngZone=e,this._dir=o,this.popoverOpened=new p.Subject,this.popoverClosed=new p.Subject,this._popoverOpen=!1,this._onDestroy=new p.Subject}return t.prototype.ngOnDestroy=function(){this._destroyPopover(),this._notificationsSubscription&&this._notificationsSubscription.unsubscribe(),this._positionChangeSubscription&&this._positionChangeSubscription.unsubscribe(),this._onDestroy.next(),this._onDestroy.complete(),this.popoverOpened.complete(),this.popoverClosed.complete()},t.prototype.anchor=function(t,e,o){this._destroyPopover(),this._popover=t,this._viewContainerRef=e,this._anchor=o,this._popover._notifications=this._notifications=new D,this._subscribeToNotifications()},t.prototype.isPopoverOpen=function(){return this._popoverOpen},t.prototype.togglePopover=function(){return this._popoverOpen?this.closePopover():this.openPopover()},t.prototype.openPopover=function(){this._popoverOpen||(this.createOverlay(),this._subscribeToBackdrop(),this._subscribeToEscape(),this._subscribeToDetachments(),this._saveOpenedState())},t.prototype.closePopover=function(t){this._overlayRef&&(this._saveClosedState(t),this._overlayRef.detach())},t.prototype.createOverlay=function(){if(!this._overlayRef){this._portal=new f.TemplatePortal(this._popover._templateRef,this._viewContainerRef);var t={horizontalAlign:this._popover.horizontalAlign,verticalAlign:this._popover.verticalAlign,hasBackdrop:this._popover.hasBackdrop,backdropClass:this._popover.backdropClass,scrollStrategy:this._popover.scrollStrategy},e=this._getOverlayConfig(t,this._anchor);this._subscribeToPositionChanges(e.positionStrategy),this._overlayRef=this._overlay.create(e)}return this._overlayRef.attach(this._portal),this._overlayRef},t.prototype._destroyPopover=function(){this._overlayRef&&(this._overlayRef.dispose(),this._overlayRef=null)},t.prototype._destroyPopoverOnceClosed=function(){var t=this;this.isPopoverOpen()&&this._overlayRef?this._overlayRef.detachments().pipe(v.take(1),u.takeUntil(this._onDestroy)).subscribe(function(){return t._destroyPopover()}):this._destroyPopover()},t.prototype._subscribeToNotifications=function(){var t=this;this._notificationsSubscription&&this._notificationsSubscription.unsubscribe(),this._notificationsSubscription=this._notifications.events().subscribe(function(e){switch(e.action){case j.OPEN:t.openPopover();break;case j.CLOSE:t.closePopover(e.value);break;case j.TOGGLE:t.togglePopover();break;case j.REPOSITION:case j.UPDATE_CONFIG:t._destroyPopoverOnceClosed()}})},t.prototype._subscribeToBackdrop=function(){var t=this;this._overlayRef.backdropClick().pipe(l.tap(function(){return t._popover.backdropClicked.emit()}),d.filter(function(){return t._popover.interactiveClose}),u.takeUntil(this.popoverClosed),u.takeUntil(this._onDestroy)).subscribe(function(){return t.closePopover()})},t.prototype._subscribeToEscape=function(){var t=this;this._overlayRef.keydownEvents().pipe(l.tap(function(e){return t._popover.overlayKeydown.emit(e)}),d.filter(function(t){return t.keyCode===h.ESCAPE}),d.filter(function(){return t._popover.interactiveClose}),u.takeUntil(this.popoverClosed),u.takeUntil(this._onDestroy)).subscribe(function(){return t.closePopover()})},t.prototype._subscribeToDetachments=function(){var t=this;this._overlayRef.detachments().pipe(u.takeUntil(this._onDestroy)).subscribe(function(){return t._saveClosedState()})},t.prototype._saveOpenedState=function(){this._popoverOpen||(this._popover._open=this._popoverOpen=!0,this.popoverOpened.next(),this._popover.opened.emit())},t.prototype._saveClosedState=function(t){this._popoverOpen&&(this._popover._open=this._popoverOpen=!1,this.popoverClosed.next(t),this._popover.closed.emit(t))},t.prototype._getDirection=function(){return this._dir&&"rtl"===this._dir.value?"rtl":"ltr"},t.prototype._getOverlayConfig=function(t,e){return new r.OverlayConfig({positionStrategy:this._getPositionStrategy(t.horizontalAlign,t.verticalAlign,e),hasBackdrop:t.hasBackdrop,backdropClass:t.backdropClass||"cdk-overlay-transparent-backdrop",scrollStrategy:this._getScrollStrategyInstance(t.scrollStrategy),direction:this._getDirection()})},t.prototype._subscribeToPositionChanges=function(t){var e=this;this._positionChangeSubscription&&this._positionChangeSubscription.unsubscribe(),this._positionChangeSubscription=t.onPositionChange.pipe(u.takeUntil(this._onDestroy)).subscribe(function(t){e._ngZone.run(function(){e._popover._setAlignmentClasses(P(t.connectionPair.overlayX),k(t.connectionPair.overlayY))})})},t.prototype._getScrollStrategyInstance=function(t){switch(t){case"block":return this._overlay.scrollStrategies.block();case"reposition":return this._overlay.scrollStrategies.reposition();case"close":return this._overlay.scrollStrategies.close();case"noop":default:return this._overlay.scrollStrategies.noop()}},t.prototype._getPositionStrategy=function(t,e,o){var r=E(t),n=r.originX,i=r.overlayX,s=C(e),a=s.originY,p=s.overlayY,c=this._overlay.position().connectedTo(o,{originX:n,originY:a},{overlayX:i,overlayY:p}).withDirection(this._getDirection());return this._addFallbacks(c,t,e),c},t.prototype._addFallbacks=function(t,e,o){var r=this,n="before"!==e&&"after"!==e,i="above"!==o&&"below"!==o,s=n?["before","start","center","end","after"]:["before","after"],a=i?["above","start","center","end","below"]:["above","below"],p=[];w(e,s).forEach(function(t){w(o,a).forEach(function(e){p.push({h:t,v:e})})}),p.slice(1,p.length).forEach(function(e){var o=e.h,n=e.v;return r._applyFallback(t,o,n)})},t.prototype._applyFallback=function(t,e,o){var r=E(e),n=r.originX,i=r.overlayX,s=C(o),a=s.originY,p=s.overlayY;t.withFallbackPosition({originX:n,originY:a},{overlayX:i,overlayY:p})},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:r.Overlay},{type:e.NgZone},{type:T,decorators:[{type:e.Optional}]}]},t}(),U=function(){function t(t,o,r){this._elementRef=t,this._viewContainerRef=o,this._anchoring=r,this.popoverOpened=new e.EventEmitter,this.popoverClosed=new e.EventEmitter,this._onDestroy=new p.Subject}return Object.defineProperty(t.prototype,"attachedPopover",{get:function(){return this._attachedPopover},set:function(t){this._validateAttachedPopover(t),this._attachedPopover=t,this._anchoring.anchor(this.attachedPopover,this._viewContainerRef,this._elementRef)},enumerable:!0,configurable:!0}),t.prototype.isPopoverOpen=function(){return this._anchoring.isPopoverOpen()},t.prototype.ngOnInit=function(){var t=this,e=this._anchoring.popoverOpened.pipe(l.tap(function(){return t.popoverOpened.emit()})),o=this._anchoring.popoverClosed.pipe(l.tap(function(e){return t.popoverClosed.emit(e)}));c.merge(e,o).pipe(u.takeUntil(this._onDestroy)).subscribe()},t.prototype.ngOnDestroy=function(){this._onDestroy.next(),this._onDestroy.complete()},t.prototype.togglePopover=function(){this._anchoring.togglePopover()},t.prototype.openPopover=function(){this._anchoring.openPopover()},t.prototype.closePopover=function(t){this._anchoring.closePopover(t)},t.prototype._validateAttachedPopover=function(t){if(!(t&&t instanceof Y))throw y()},t.decorators=[{type:e.Directive,args:[{selector:"[satPopoverAnchorFor]",exportAs:"satPopoverAnchor",providers:[L]}]}],t.ctorParameters=function(){return[{type:e.ElementRef},{type:e.ViewContainerRef},{type:L}]},t.propDecorators={attachedPopover:[{type:e.Input,args:["satPopoverAnchorFor"]}],popoverOpened:[{type:e.Output}],popoverClosed:[{type:e.Output}]},t}(),q=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{imports:[o.CommonModule,r.OverlayModule,n.A11yModule,x],declarations:[Y,U],exports:[Y,U,x]}]}],t.ctorParameters=function(){return[]},t}();t.SatPopoverModule=q,t.SatPopoverAnchor=U,t.SatPopover=Y,t.ɵb=L,t.ɵa=I,Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=sat-popover.umd.min.js.map

2

package.json
{
"name": "@ncstate/sat-popover",
"version": "1.0.0-beta.4",
"version": "1.0.0-beta.5",
"description": "Popover component for Angular",

@@ -5,0 +5,0 @@ "author": "Will Howell",

2

popover.d.ts

@@ -5,3 +5,3 @@ /**

export * from './public_api';
export { PopoverNotificationService as ɵb } from './popover/notification.service';
export { PopoverAnchoringService as ɵb } from './popover/popover-anchoring.service';
export { transformPopover as ɵa } from './popover/popover.animations';

2

popover.metadata.json

@@ -1,1 +0,1 @@

{"__symbolic":"module","version":4,"metadata":{"SatPopoverModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule"},{"__symbolic":"reference","module":"@angular/cdk/a11y","name":"A11yModule"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"BidiModule"}],"declarations":[{"__symbolic":"reference","name":"SatPopover"},{"__symbolic":"reference","name":"SatPopoverAnchor"}],"exports":[{"__symbolic":"reference","name":"SatPopover"},{"__symbolic":"reference","name":"SatPopoverAnchor"}]}]}],"members":{}},"SatPopoverAnchor":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[satPopoverAnchorFor]","exportAs":"satPopoverAnchor","providers":[{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{"attachedPopover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["satPopoverAnchorFor"]}]}],"popoverOpened":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"popoverClosed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"isPopoverOpen":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}}]],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"togglePopover":[{"__symbolic":"method"}],"openPopover":[{"__symbolic":"method"}],"closePopover":[{"__symbolic":"method"}],"_getDirection":[{"__symbolic":"method"}],"_destroyPopover":[{"__symbolic":"method"}],"_destroyPopoverOnceClosed":[{"__symbolic":"method"}],"_validateAttachedPopover":[{"__symbolic":"method"}],"_subscribeToNotifications":[{"__symbolic":"method"}],"_subscribeToBackdrop":[{"__symbolic":"method"}],"_subscribeToEscape":[{"__symbolic":"method"}],"_subscribeToDetachments":[{"__symbolic":"method"}],"_saveOpenedState":[{"__symbolic":"method"}],"_saveClosedState":[{"__symbolic":"method"}],"_createOverlay":[{"__symbolic":"method"}],"_getOverlayConfig":[{"__symbolic":"method"}],"_subscribeToPositionChanges":[{"__symbolic":"method"}],"_getScrollStrategyInstance":[{"__symbolic":"method"}],"_getPositionStrategy":[{"__symbolic":"method"}],"_addFallbacks":[{"__symbolic":"method"}],"_applyFallback":[{"__symbolic":"method"}]}},"SatPopover":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sat-popover","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation"},"member":"None"},"animations":[{"__symbolic":"reference","name":"ɵa"}],"template":"<ng-template>\n <div class=\"sat-popover-container\"\n #focusTrapElement\n [ngClass]=\"_classList\"\n [@transformPopover]=\"_getAnimation()\"\n (@transformPopover.done)=\"_onAnimationDone($event)\">\n <ng-content></ng-content>\n </div>\n</ng-template>\n","styles":["/**\n * Applies styles for users in high contrast mode. Note that this only applies\n * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n * attribute, however Chrome handles high contrast differently.\n */\n/* Theme for the ripple elements.*/\n/** The mixins below are shared between mat-menu and mat-select */\n/**\n * This mixin adds the correct panel transform styles based\n * on the direction that the menu panel opens.\n */\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n/**\n * This mixin contains shared option styles between the select and\n * autocomplete components.\n */\n.cdk-overlay-container, .cdk-global-overlay-wrapper {\n pointer-events: none;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%; }\n\n.cdk-overlay-container {\n position: fixed;\n z-index: 1000; }\n\n.cdk-global-overlay-wrapper {\n display: flex;\n position: absolute;\n z-index: 1000; }\n\n.cdk-overlay-pane {\n position: absolute;\n pointer-events: auto;\n box-sizing: border-box;\n z-index: 1000; }\n\n.cdk-overlay-backdrop {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n pointer-events: auto;\n -webkit-tap-highlight-color: transparent;\n transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n opacity: 0; }\n .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n opacity: 0.48; }\n\n.cdk-overlay-dark-backdrop {\n background: rgba(0, 0, 0, 0.6); }\n\n.cdk-overlay-transparent-backdrop {\n background: none; }\n\n.cdk-global-scrollblock {\n position: fixed;\n width: 100%;\n overflow-y: scroll; }\n\n.sat-popover-container.sat-popover-before.sat-popover-above {\n transform-origin: right bottom; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-above {\n transform-origin: left bottom; }\n\n.sat-popover-container.sat-popover-before.sat-popover-center {\n transform-origin: right center; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-center {\n transform-origin: left center; }\n\n.sat-popover-container.sat-popover-before.sat-popover-below {\n transform-origin: right top; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-below {\n transform-origin: left top; }\n\n.sat-popover-container.sat-popover-center.sat-popover-above {\n transform-origin: center bottom; }\n\n.sat-popover-container.sat-popover-center.sat-popover-below {\n transform-origin: center top; }\n\n.sat-popover-container.sat-popover-after.sat-popover-above {\n transform-origin: left bottom; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-above {\n transform-origin: right bottom; }\n\n.sat-popover-container.sat-popover-after.sat-popover-center {\n transform-origin: left center; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-center {\n transform-origin: right center; }\n\n.sat-popover-container.sat-popover-after.sat-popover-below {\n transform-origin: left top; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-below {\n transform-origin: right top; }\n"]}]}],"members":{"horizontalAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"xAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"verticalAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"yAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"scrollStrategy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hasBackdrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"openTransition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"closeTransition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"backdropClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"opened":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"closed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"afterOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"afterClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"backdropClicked":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"overlayKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"_templateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"_focusTrapElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["focusTrapElement"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DOCUMENT"}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/a11y","name":"FocusTrapFactory"},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}],"isOpen":[{"__symbolic":"method"}],"_getAnimation":[{"__symbolic":"method"}],"_onAnimationDone":[{"__symbolic":"method"}],"_setAlignmentClasses":[{"__symbolic":"method"}],"_trapFocus":[{"__symbolic":"method"}],"_restoreFocus":[{"__symbolic":"method"}],"_savePreviouslyFocusedElement":[{"__symbolic":"method"}],"_dispatchConfigNotification":[{"__symbolic":"method"}],"_dispatchActionNotification":[{"__symbolic":"method"}],"_validateHorizontalAlign":[{"__symbolic":"method"}],"_validateVerticalAlign":[{"__symbolic":"method"}],"_validateScrollStrategy":[{"__symbolic":"method"}]}},"SatPopoverHorizontalAlign":{"__symbolic":"interface"},"SatPopoverVerticalAlign":{"__symbolic":"interface"},"SatPopoverScrollStrategy":{"__symbolic":"interface"},"ɵa":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["transformPopover",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0,"transform":"scale(0.3)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":["{{openTransition}}",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1)"}]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":["{{closeTransition}}",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0,"transform":"scale(0.5)"}]}]}]]}]]},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"dispatch":[{"__symbolic":"method"}],"events":[{"__symbolic":"method"}]}}},"origins":{"SatPopoverModule":"./popover/popover.module","SatPopoverAnchor":"./popover/popover-anchor.directive","SatPopover":"./popover/popover.component","SatPopoverHorizontalAlign":"./popover/popover.component","SatPopoverVerticalAlign":"./popover/popover.component","SatPopoverScrollStrategy":"./popover/popover.component","ɵa":"./popover/popover.animations","ɵb":"./popover/notification.service"},"importAs":"@ncstate/sat-popover"}
{"__symbolic":"module","version":4,"metadata":{"SatPopoverModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"OverlayModule"},{"__symbolic":"reference","module":"@angular/cdk/a11y","name":"A11yModule"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"BidiModule"}],"declarations":[{"__symbolic":"reference","name":"SatPopover"},{"__symbolic":"reference","name":"SatPopoverAnchor"}],"exports":[{"__symbolic":"reference","name":"SatPopover"},{"__symbolic":"reference","name":"SatPopoverAnchor"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"BidiModule"}]}]}],"members":{}},"SatPopoverAnchor":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[satPopoverAnchorFor]","exportAs":"satPopoverAnchor","providers":[{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{"attachedPopover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["satPopoverAnchorFor"]}]}],"popoverOpened":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"popoverClosed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"isPopoverOpen":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","name":"ɵb"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"togglePopover":[{"__symbolic":"method"}],"openPopover":[{"__symbolic":"method"}],"closePopover":[{"__symbolic":"method"}],"_validateAttachedPopover":[{"__symbolic":"method"}]}},"SatPopover":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sat-popover","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation"},"member":"None"},"animations":[{"__symbolic":"reference","name":"ɵa"}],"template":"<ng-template>\n <div class=\"sat-popover-container\"\n #focusTrapElement\n [ngClass]=\"_classList\"\n [@transformPopover]=\"_getAnimation()\"\n (@transformPopover.done)=\"_onAnimationDone($event)\">\n <ng-content></ng-content>\n </div>\n</ng-template>\n","styles":["/**\n * Applies styles for users in high contrast mode. Note that this only applies\n * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n * attribute, however Chrome handles high contrast differently.\n */\n/* Theme for the ripple elements.*/\n/** The mixins below are shared between mat-menu and mat-select */\n/**\n * This mixin adds the correct panel transform styles based\n * on the direction that the menu panel opens.\n */\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n/**\n * This mixin contains shared option styles between the select and\n * autocomplete components.\n */\n.cdk-overlay-container, .cdk-global-overlay-wrapper {\n pointer-events: none;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%; }\n\n.cdk-overlay-container {\n position: fixed;\n z-index: 1000; }\n\n.cdk-global-overlay-wrapper {\n display: flex;\n position: absolute;\n z-index: 1000; }\n\n.cdk-overlay-pane {\n position: absolute;\n pointer-events: auto;\n box-sizing: border-box;\n z-index: 1000; }\n\n.cdk-overlay-backdrop {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n pointer-events: auto;\n -webkit-tap-highlight-color: transparent;\n transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n opacity: 0; }\n .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n opacity: 0.48; }\n\n.cdk-overlay-dark-backdrop {\n background: rgba(0, 0, 0, 0.6); }\n\n.cdk-overlay-transparent-backdrop {\n background: none; }\n\n.cdk-global-scrollblock {\n position: fixed;\n width: 100%;\n overflow-y: scroll; }\n\n.sat-popover-container.sat-popover-before.sat-popover-above {\n transform-origin: right bottom; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-above {\n transform-origin: left bottom; }\n\n.sat-popover-container.sat-popover-before.sat-popover-center {\n transform-origin: right center; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-center {\n transform-origin: left center; }\n\n.sat-popover-container.sat-popover-before.sat-popover-below {\n transform-origin: right top; }\n [dir='rtl'] .sat-popover-container.sat-popover-before.sat-popover-below {\n transform-origin: left top; }\n\n.sat-popover-container.sat-popover-center.sat-popover-above {\n transform-origin: center bottom; }\n\n.sat-popover-container.sat-popover-center.sat-popover-below {\n transform-origin: center top; }\n\n.sat-popover-container.sat-popover-after.sat-popover-above {\n transform-origin: left bottom; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-above {\n transform-origin: right bottom; }\n\n.sat-popover-container.sat-popover-after.sat-popover-center {\n transform-origin: left center; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-center {\n transform-origin: right center; }\n\n.sat-popover-container.sat-popover-after.sat-popover-below {\n transform-origin: left top; }\n [dir='rtl'] .sat-popover-container.sat-popover-after.sat-popover-below {\n transform-origin: right top; }\n"]}]}],"members":{"horizontalAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"xAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"verticalAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"yAlign":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autoFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"scrollStrategy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hasBackdrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"interactiveClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"openTransition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"closeTransition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"backdropClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"opened":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"closed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"afterOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"afterClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"backdropClicked":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"overlayKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"_templateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"_focusTrapElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["focusTrapElement"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DOCUMENT"}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/a11y","name":"FocusTrapFactory"},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}],"isOpen":[{"__symbolic":"method"}],"_getAnimation":[{"__symbolic":"method"}],"_onAnimationDone":[{"__symbolic":"method"}],"_setAlignmentClasses":[{"__symbolic":"method"}],"_trapFocus":[{"__symbolic":"method"}],"_restoreFocus":[{"__symbolic":"method"}],"_savePreviouslyFocusedElement":[{"__symbolic":"method"}],"_dispatchConfigNotification":[{"__symbolic":"method"}],"_dispatchActionNotification":[{"__symbolic":"method"}],"_validateHorizontalAlign":[{"__symbolic":"method"}],"_validateVerticalAlign":[{"__symbolic":"method"}],"_validateScrollStrategy":[{"__symbolic":"method"}]}},"SatPopoverHorizontalAlign":{"__symbolic":"interface"},"SatPopoverVerticalAlign":{"__symbolic":"interface"},"SatPopoverScrollStrategy":{"__symbolic":"interface"},"ɵa":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger"},"arguments":["transformPopover",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0,"transform":"scale(0.3)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":["{{openTransition}}",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":1,"transform":"scale(1)"}]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate"},"arguments":["{{closeTransition}}",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style"},"arguments":[{"opacity":0,"transform":"scale(0.5)"}]}]}]]}]]},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}}]],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"Overlay"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality"}]}],"ngOnDestroy":[{"__symbolic":"method"}],"anchor":[{"__symbolic":"method"}],"isPopoverOpen":[{"__symbolic":"method"}],"togglePopover":[{"__symbolic":"method"}],"openPopover":[{"__symbolic":"method"}],"closePopover":[{"__symbolic":"method"}],"createOverlay":[{"__symbolic":"method"}],"_destroyPopover":[{"__symbolic":"method"}],"_destroyPopoverOnceClosed":[{"__symbolic":"method"}],"_subscribeToNotifications":[{"__symbolic":"method"}],"_subscribeToBackdrop":[{"__symbolic":"method"}],"_subscribeToEscape":[{"__symbolic":"method"}],"_subscribeToDetachments":[{"__symbolic":"method"}],"_saveOpenedState":[{"__symbolic":"method"}],"_saveClosedState":[{"__symbolic":"method"}],"_getDirection":[{"__symbolic":"method"}],"_getOverlayConfig":[{"__symbolic":"method"}],"_subscribeToPositionChanges":[{"__symbolic":"method"}],"_getScrollStrategyInstance":[{"__symbolic":"method"}],"_getPositionStrategy":[{"__symbolic":"method"}],"_addFallbacks":[{"__symbolic":"method"}],"_applyFallback":[{"__symbolic":"method"}]}}},"origins":{"SatPopoverModule":"./popover/popover.module","SatPopoverAnchor":"./popover/popover-anchor.directive","SatPopover":"./popover/popover.component","SatPopoverHorizontalAlign":"./popover/popover.component","SatPopoverVerticalAlign":"./popover/popover.component","SatPopoverScrollStrategy":"./popover/popover.component","ɵa":"./popover/popover.animations","ɵb":"./popover/popover-anchoring.service"},"importAs":"@ncstate/sat-popover"}

2

popover/notification.service.d.ts

@@ -33,2 +33,4 @@ import { Observable } from 'rxjs/Observable';

events(): Observable<PopoverNotification>;
/** Complete event stream. */
dispose(): void;
}

63

popover/popover-anchor.directive.d.ts

@@ -1,13 +0,8 @@

import { ElementRef, EventEmitter, NgZone, OnInit, OnDestroy, ViewContainerRef } from '@angular/core';
import { Overlay, OverlayRef } from '@angular/cdk/overlay';
import { Directionality } from '@angular/cdk/bidi';
import { ElementRef, EventEmitter, OnInit, OnDestroy, ViewContainerRef } from '@angular/core';
import { SatPopover } from './popover.component';
import { PopoverNotificationService } from './notification.service';
import { PopoverAnchoringService } from './popover-anchoring.service';
export declare class SatPopoverAnchor implements OnInit, OnDestroy {
private _overlay;
private _elementRef;
private _viewContainerRef;
private _notifications;
private _ngZone;
private _dir;
_anchoring: PopoverAnchoringService;
/** Reference to the popover instance. */

@@ -22,11 +17,5 @@ attachedPopover: SatPopover;

isPopoverOpen(): boolean;
/** Reference to the overlay containing the popover component. */
_overlayRef: OverlayRef;
/** Whether the popover is presently open. */
private _popoverOpen;
/** Reference to a template portal where the overlay will be attached. */
private _portal;
/** Emits when the directive is destroyed. */
private _onDestroy;
constructor(_overlay: Overlay, _elementRef: ElementRef, _viewContainerRef: ViewContainerRef, _notifications: PopoverNotificationService, _ngZone: NgZone, _dir: Directionality);
constructor(_elementRef: ElementRef, _viewContainerRef: ViewContainerRef, _anchoring: PopoverAnchoringService);
ngOnInit(): void;

@@ -40,48 +29,4 @@ ngOnDestroy(): void;

closePopover(value?: any): void;
/** Gets the text direction of the containing app. */
private _getDirection();
/** Removes the popover from the DOM. Does NOT update open state. */
private _destroyPopover();
/**
* Destroys the popover immediately if it is closed, or waits until it
* has been closed to destroy it.
*/
private _destroyPopoverOnceClosed();
/** Throws an error if the popover instance is not provided. */
private _validateAttachedPopover(popover);
/**
* Call appropriate anchor method when an event is dispatched through
* the notification service.
*/
private _subscribeToNotifications();
/** Close popover when backdrop is clicked. */
private _subscribeToBackdrop();
/** Close popover when escape keydown event occurs. */
private _subscribeToEscape();
/** Set state back to closed when detached. */
private _subscribeToDetachments();
/** Save the opened state of the popover and emit. */
private _saveOpenedState();
/** Save the closed state of the popover and emit. */
private _saveClosedState(value?);
/** Create an overlay to be attached to the portal. */
private _createOverlay();
/** Create and return a config for creating the overlay. */
private _getOverlayConfig();
/**
* Listen to changes in the position of the overlay and set the correct alignment classes,
* ensuring that the animation origin is correct, even with a fallback position.
*/
private _subscribeToPositionChanges(position);
/** Map a scroll strategy string type to an instance of a scroll strategy. */
private _getScrollStrategyInstance(strategy);
/** Create and return a position strategy based on config provided to the component instance. */
private _getPositionStrategy();
/** Add fallbacks to a given strategy based around target alignments. */
private _addFallbacks(strategy, hTarget, vTarget);
/**
* Convert a specific horizontal and vertical alignment into a fallback and apply it to
* the strategy.
*/
private _applyFallback(strategy, horizontalAlign, verticalAlign);
}

11

popover/popover.component.d.ts

@@ -1,2 +0,2 @@

import { EventEmitter, TemplateRef, OnInit } from '@angular/core';
import { EventEmitter, TemplateRef, OnDestroy, OnInit } from '@angular/core';
import { AnimationEvent } from '@angular/animations';

@@ -11,3 +11,3 @@ import { FocusTrapFactory } from '@angular/cdk/a11y';

export declare const VALID_VERT_ALIGN: SatPopoverVerticalAlign[];
export declare class SatPopover implements OnInit {
export declare class SatPopover implements OnInit, OnDestroy {
private _focusTrapFactory;

@@ -25,2 +25,5 @@ private _document;

yAlign: SatPopoverVerticalAlign;
/** Whether the first focusable element should be focused on open. */
autoFocus: boolean;
private _autoFocus;
/** How the popover should handle scrolling. */

@@ -32,2 +35,5 @@ scrollStrategy: SatPopoverScrollStrategy;

private _hasBackdrop;
/** Whether the popover should close when the user clicks the backdrop or presses ESC. */
interactiveClose: boolean;
private _interactiveClose;
/** Custom transition to use while opening. */

@@ -69,2 +75,3 @@ openTransition: string;

ngOnInit(): void;
ngOnDestroy(): void;
/** Open this popover. */

@@ -71,0 +78,0 @@ open(): void;

39

README.md

@@ -141,2 +141,19 @@ # Popover Component for Angular

### Focus behavior
By default, the popover will apply focus to the first tabbable element when opened and trap focus
within the popover until closed. If the popover does not contain any focusable elements, focus
will remain on the most recently focused element.
You can target a different element for initial focus using the `cdkFocusInitial` attribute.
To prevent focus from automatically moving into the popover, you can set the `autoFocus` property
to `false`.
```html
<sat-popover [autoFocus]="false">
<!-- ... -->
</sat-popover>
```
### Backdrop

@@ -167,2 +184,24 @@

### Interactive Closing
If your popover has a backdrop, it will automatically close when clicked. The popover will also
automatically close when <kbd>esc</kbd> is pressed. These two behaviors are wrapped in the
`interactiveClose` property, which defaults to `true`. Set `interactiveClose` to `false` to prevent
the popover from automatically closing on these user interactions.
```html
<sat-popover hasBackdrop [interactiveClose]="false">
<!-- ... -->
</sat-popover>
```
If you wish to only disable the automatic <kbd>esc</kbd> behavior, you must disable all
interactive close options and then manually react to `backdropClicked` events.
```html
<sat-popover #p hasBackdrop [interactiveClose]="false" (backdropClicked)="p.close()">
<!-- ... -->
</sat-popover>
```
### Scrolling

@@ -169,0 +208,0 @@ 

@ncstate/sat-popover.es5.js.map

Sorry, the diff of this file is not supported yet

@ncstate/sat-popover.js.map

Sorry, the diff of this file is not supported yet

bundles/sat-popover.umd.js.map

Sorry, the diff of this file is not supported yet

bundles/sat-popover.umd.min.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc