@skyux/popovers 5.6.0 → 5.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/skyux-popovers.umd.js +9 -6
- package/documentation.json +138 -225
- package/esm2015/lib/modules/popover/popover-content.component.js +8 -5
- package/esm2015/lib/modules/popover/popover-content.component.js.map +1 -1
- package/esm2015/lib/modules/shared/sky-popovers-resources.module.js +1 -1
- package/esm2015/lib/modules/shared/sky-popovers-resources.module.js.map +1 -1
- package/fesm2015/skyux-popovers.js +9 -6
- package/fesm2015/skyux-popovers.js.map +1 -1
- package/lib/modules/popover/popover-content.component.d.ts +1 -0
- package/lib/modules/shared/sky-popovers-resources.module.d.ts +1 -1
- package/package.json +15 -14
|
@@ -188,6 +188,13 @@ export class SkyPopoverContentComponent {
|
|
|
188
188
|
this.arrowTop = top;
|
|
189
189
|
this.arrowLeft = left;
|
|
190
190
|
}
|
|
191
|
+
isFocusLeavingElement(event) {
|
|
192
|
+
const focusableItems = this.coreAdapterService.getFocusableChildren(this.elementRef.nativeElement);
|
|
193
|
+
const isFirstItem = focusableItems[0] === event.target && event.shiftKey;
|
|
194
|
+
const isLastItem = focusableItems[focusableItems.length - 1] === event.target &&
|
|
195
|
+
!event.shiftKey;
|
|
196
|
+
return focusableItems.length === 0 || isFirstItem || isLastItem;
|
|
197
|
+
}
|
|
191
198
|
addEventListeners() {
|
|
192
199
|
const hostElement = this.elementRef.nativeElement;
|
|
193
200
|
observableFromEvent(hostElement, 'mouseenter')
|
|
@@ -215,12 +222,8 @@ export class SkyPopoverContentComponent {
|
|
|
215
222
|
if (!this.dismissOnBlur) {
|
|
216
223
|
return;
|
|
217
224
|
}
|
|
218
|
-
const focusableItems = this.coreAdapterService.getFocusableChildren(hostElement);
|
|
219
|
-
const isFirstItem = focusableItems[0] === event.target && event.shiftKey;
|
|
220
|
-
const isLastItem = focusableItems[focusableItems.length - 1] === event.target &&
|
|
221
|
-
!event.shiftKey;
|
|
222
225
|
/*istanbul ignore else*/
|
|
223
|
-
if (
|
|
226
|
+
if (this.isFocusLeavingElement(event)) {
|
|
224
227
|
this.close();
|
|
225
228
|
this.caller.nativeElement.focus();
|
|
226
229
|
event.preventDefault();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-content.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/popovers/src/lib/modules/popover/popover-content.component.ts","../../../../../../../../libs/components/popovers/src/lib/modules/popover/popover-content.component.html"],"names":[],"mappings":"AACA,OAAO,EACL,iBAAiB,EACjB,SAAS,EACT,UAAU,EAGV,QAAQ,EACR,SAAS,EACT,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,sBAAsB,EAEtB,eAAe,EAEf,qBAAqB,GACtB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAc,OAAO,EAAE,SAAS,IAAI,mBAAmB,EAAE,MAAM,MAAM,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EACL,6BAA6B,EAC7B,mBAAmB,GACpB,MAAM,sBAAsB,CAAC;;;;;;;AAI9B;;GAEG;AAQH,MAAM,OAAO,0BAA0B;IAmErC,YACU,cAAiC,EACjC,UAAsB,EACtB,YAA6B,EAC7B,kBAAyC,EACzC,cAAwC,EAC5B,OAA2B,EAC3B,QAA0B;QANtC,mBAAc,GAAd,cAAc,CAAmB;QACjC,eAAU,GAAV,UAAU,CAAY;QACtB,iBAAY,GAAZ,YAAY,CAAiB;QAC7B,uBAAkB,GAAlB,kBAAkB,CAAuB;QACzC,mBAAc,GAAd,cAAc,CAA0B;QAC5B,YAAO,GAAP,OAAO,CAAoB;QAC3B,aAAQ,GAAR,QAAQ,CAAkB;QAnDzC,kBAAa,GAAG,IAAI,CAAC;QAErB,qBAAgB,GAAG,IAAI,CAAC;QAIxB,WAAM,GAAG,KAAK,CAAC;QAMf,gBAAW,GAAsB,MAAM,CAAC;QAwBvC,kBAAa,GAAG,IAAI,OAAO,EAAQ,CAAC;QAEpC,YAAO,GAAG,IAAI,OAAO,EAAQ,CAAC;QAE9B,kBAAa,GAAG,IAAI,OAAO,EAAW,CAAC;QAEvC,YAAO,GAAG,IAAI,OAAO,EAAQ,CAAC;IAUnC,CAAC;IA1EJ,IAAW,cAAc;QACvB,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;IACzC,CAAC;IAED,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAED,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAED,IAAW,YAAY;QACrB,OAAO,IAAI,CAAC,aAAa,CAAC,YAAY,EAAE,CAAC;IAC3C,CAAC;IA8DM,QAAQ;;QACb,wBAAwB;QACxB,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC,MAAA,IAAI,CAAC,OAAO,0CAAE,kBAAkB,CAAC,CAAC;QACxE,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAEzB,wBAAwB;QACxB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,cAAc;iBACzB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;iBACnC,SAAS,CAAC,CAAC,aAAa,EAAE,EAAE;;gBAC3B,wBAAwB;gBACxB,IAAI,CAAC,SAAS,GAAG,MAAA,MAAA,aAAa,CAAC,eAAe,0CAAE,KAAK,0CAAE,IAAI,CAAC;YAC9D,CAAC,CAAC,CAAC;SACN;IACH,CAAC;IAEM,WAAW;QAChB,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC;QAE9B,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;QACxB,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC;QAC9B,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;QAExB,0BAA0B;QAC1B,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;SACxB;QAED,IAAI,CAAC,OAAO;YACV,IAAI,CAAC,aAAa;gBAClB,IAAI,CAAC,OAAO;oBACZ,IAAI,CAAC,OAAO;wBACZ,IAAI,CAAC,aAAa;4BAChB,SAAS,CAAC;IAChB,CAAC;IAEM,gBAAgB,CAAC,KAAqB;;QAC3C,IAAI,KAAK,CAAC,SAAS,KAAK,MAAM,EAAE;YAC9B,OAAO;SACR;QAED,IAAI,KAAK,CAAC,SAAS,KAAK,MAAM,EAAE;YAC9B,IAAI,KAAK,CAAC,OAAO,KAAK,MAAM,EAAE;gBAC5B,wBAAwB;gBACxB,MAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;aACtB;iBAAM;gBACL,wBAAwB;gBACxB,MAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;aACtB;SACF;IACH,CAAC;IAEM,IAAI,CACT,MAAkB,EAClB,MAQC;QAED,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,aAAa,CAAC;QAC1C,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC,gBAAgB,CAAC;QAChD,IAAI,CAAC,mBAAmB,GAAG,MAAM,CAAC,mBAAmB,CAAC;QACtD,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;QAClC,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC;QACxC,IAAI,MAAM,CAAC,WAAW,EAAE;YACtB,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;SACvC;QAED,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QAEnC,2DAA2D;QAC3D,8FAA8F;QAC9F,iEAAiE;QACjE,wBAAwB;QACxB,IAAI,MAAM,CAAC,QAAQ,EAAE;YACnB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;YACnB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;YACnC,OAAO;SACR;QAED,6DAA6D;QAC7D,UAAU,CAAC,GAAG,EAAE;;YACd,wBAAwB;YACxB,IACE,CAAC,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAA;gBAC/B,CAAC,IAAI,CAAC,aAAa;gBACnB,IAAI,CAAC,aAAa,CAAC,SAAS,EAC5B;gBACA,OAAO;aACR;YAED,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;gBACjB,IAAI,CAAC,YAAY,EAAE,CAAC;aACrB;YAED,MAAM,YAAY,GAAmB;gBACnC,cAAc,EAAE,sBAAsB,CAAC,QAAQ;gBAC/C,aAAa,EAAE,IAAI;gBACnB,mBAAmB,EAAE,6BAA6B,CAChD,IAAI,CAAC,mBAAmB,CACzB;gBACD,QAAQ,EAAE,IAAI;gBACd,SAAS,EAAE,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC;aAC/C,CAAC;YAEF,yEAAyE;YACzE,wFAAwF;YACxF,IACE,YAAY,CAAC,SAAS,KAAK,MAAM;gBACjC,YAAY,CAAC,SAAS,KAAK,OAAO,EAClC;gBACA,YAAY,CAAC,iBAAiB,GAAG,QAAQ,CAAC;aAC3C;iBAAM,IAAI,YAAY,CAAC,SAAS,KAAK,OAAO,EAAE;gBAC7C,YAAY,CAAC,iBAAiB,GAAG,QAAQ,CAAC;aAC3C;iBAAM;gBACL,YAAY,CAAC,iBAAiB,GAAG,KAAK,CAAC;aACxC;YAED,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;YAE9D,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAEzB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;YACnB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QACrC,CAAC,CAAC,CAAC;IACL,CAAC;IAEM,KAAK;QACV,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAEM,UAAU;QACf,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,IAAI,CAAC,kBAAkB,CAAC,iCAAiC,CACvD,IAAI,CAAC,UAAU,EACf,cAAc,EACd,IAAI,CACL,CAAC;SACH;IACH,CAAC;IAEO,YAAY;QAClB,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAEjE,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,EAAE;YACtE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QACrC,CAAC,CAAC,CAAC;QAEH,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,EAAE;YACxE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QACrC,CAAC,CAAC,CAAC;QAEH,OAAO,CAAC,eAAe;aACpB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,CAAC,MAAM,EAAE,EAAE;YACpB,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;YAClC,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QACrC,CAAC,CAAC,CAAC;QAEL,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,CAAC;IAEO,iBAAiB;QACvB,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,cAAc,CAAC,mBAAmB,CAC3D;YACE,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,OAAO,EAAE,IAAI,CAAC,UAAU;YACxB,YAAY,EAAE,IAAI,CAAC,QAAQ;SAC5B,EACD,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,SAAS,CACf,CAAC;QAEF,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;QACpB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IACxB,CAAC;IAEO,iBAAiB;QACvB,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;QAElD,mBAAmB,CAAC,WAAW,EAAE,YAAY,CAAC;aAC3C,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAElD,mBAAmB,CAAC,WAAW,EAAE,YAAY,CAAC;aAC3C,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QAEnD,mBAAmB,CAAC,WAAW,EAAE,SAAS,CAAC;aACxC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,CAAC,KAAoB,EAAE,EAAE;YAClC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;YAEpC,6CAA6C;YAC7C,QAAQ,GAAG,EAAE;gBACX,KAAK,QAAQ;oBACX,IAAI,CAAC,KAAK,EAAE,CAAC;oBACb,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;oBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;oBACxB,MAAM;gBAER,wFAAwF;gBACxF,oFAAoF;gBACpF,cAAc;gBACd,KAAK,KAAK;oBACR,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;wBACvB,OAAO;qBACR;oBAED,MAAM,cAAc,GAClB,IAAI,CAAC,kBAAkB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC;oBAE5D,MAAM,WAAW,GACf,cAAc,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,QAAQ,CAAC;oBAEvD,MAAM,UAAU,GACd,cAAc,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,KAAK,CAAC,MAAM;wBAC1D,CAAC,KAAK,CAAC,QAAQ,CAAC;oBAElB,wBAAwB;oBACxB,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,IAAI,WAAW,IAAI,UAAU,EAAE;wBAC5D,IAAI,CAAC,KAAK,EAAE,CAAC;wBACb,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;wBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;wBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;qBACzB;oBACD,MAAM;aACT;QACH,CAAC,CAAC,CAAC;IACP,CAAC;;wHA7TU,0BAA0B;4GAA1B,0BAA0B,8CAF1B,CAAC,wBAAwB,CAAC,2GA0C7B,UAAU,iHAMV,UAAU,uHAMV,gBAAgB,2CChG1B,2kDA2DA,y+QDlBc,CAAC,mBAAmB,CAAC;4FAGtB,0BAA0B;kBAPtC,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,WAAW,EAAE,kCAAkC;oBAC/C,SAAS,EAAE,CAAC,kCAAkC,CAAC;oBAC/C,UAAU,EAAE,CAAC,mBAAmB,CAAC;oBACjC,SAAS,EAAE,CAAC,wBAAwB,CAAC;iBACtC;;0BA0EI,QAAQ;;0BACR,QAAQ;4CA/BH,QAAQ;sBAJf,SAAS;uBAAC,UAAU,EAAE;wBACrB,IAAI,EAAE,UAAU;wBAChB,MAAM,EAAE,IAAI;qBACb;gBAOO,UAAU;sBAJjB,SAAS;uBAAC,YAAY,EAAE;wBACvB,IAAI,EAAE,UAAU;wBAChB,MAAM,EAAE,IAAI;qBACb;gBAOO,aAAa;sBAJpB,SAAS;uBAAC,eAAe,EAAE;wBAC1B,IAAI,EAAE,gBAAgB;wBACtB,MAAM,EAAE,IAAI;qBACb","sourcesContent":["import { AnimationEvent } from '@angular/animations';\nimport {\n ChangeDetectorRef,\n Component,\n ElementRef,\n OnDestroy,\n OnInit,\n Optional,\n ViewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport {\n SkyAffixAutoFitContext,\n SkyAffixConfig,\n SkyAffixService,\n SkyAffixer,\n SkyCoreAdapterService,\n} from '@skyux/core';\nimport { SkyThemeService } from '@skyux/theme';\n\nimport { Observable, Subject, fromEvent as observableFromEvent } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyPopoverAdapterService } from './popover-adapter.service';\nimport { skyPopoverAnimation } from './popover-animation';\nimport { SkyPopoverAnimationState } from './popover-animation-state';\nimport { SkyPopoverContext } from './popover-context';\nimport {\n parseAffixHorizontalAlignment,\n parseAffixPlacement,\n} from './popover-extensions';\nimport { SkyPopoverAlignment } from './types/popover-alignment';\nimport { SkyPopoverPlacement } from './types/popover-placement';\n\n/**\n * @internal\n */\n@Component({\n selector: 'sky-popover-content',\n templateUrl: './popover-content.component.html',\n styleUrls: ['./popover-content.component.scss'],\n animations: [skyPopoverAnimation],\n providers: [SkyPopoverAdapterService],\n})\nexport class SkyPopoverContentComponent implements OnInit, OnDestroy {\n public get animationState(): SkyPopoverAnimationState {\n return this.isOpen ? 'open' : 'closed';\n }\n\n public get closed(): Observable<void> {\n return this._closed.asObservable();\n }\n\n public get opened(): Observable<void> {\n return this._opened.asObservable();\n }\n\n public get isMouseEnter(): Observable<boolean> {\n return this._isMouseEnter.asObservable();\n }\n\n public affixer: SkyAffixer;\n\n public arrowLeft: number;\n\n public arrowTop: number;\n\n public dismissOnBlur = true;\n\n public enableAnimations = true;\n\n public horizontalAlignment: SkyPopoverAlignment;\n\n public isOpen = false;\n\n public placement: SkyPopoverPlacement;\n\n public popoverTitle: string;\n\n public popoverType: 'danger' | 'info' = 'info';\n\n public themeName: string;\n\n @ViewChild('arrowRef', {\n read: ElementRef,\n static: true,\n })\n private arrowRef: ElementRef;\n\n @ViewChild('popoverRef', {\n read: ElementRef,\n static: true,\n })\n private popoverRef: ElementRef;\n\n @ViewChild('contentTarget', {\n read: ViewContainerRef,\n static: true,\n })\n private contentTarget: ViewContainerRef;\n\n private caller: ElementRef;\n\n private ngUnsubscribe = new Subject<void>();\n\n private _closed = new Subject<void>();\n\n private _isMouseEnter = new Subject<boolean>();\n\n private _opened = new Subject<void>();\n\n constructor(\n private changeDetector: ChangeDetectorRef,\n private elementRef: ElementRef,\n private affixService: SkyAffixService,\n private coreAdapterService: SkyCoreAdapterService,\n private adapterService: SkyPopoverAdapterService,\n @Optional() private context?: SkyPopoverContext,\n @Optional() private themeSvc?: SkyThemeService\n ) {}\n\n public ngOnInit(): void {\n /*istanbul ignore next*/\n this.contentTarget.createEmbeddedView(this.context?.contentTemplateRef);\n this.addEventListeners();\n\n /*istanbul ignore else*/\n if (this.themeSvc) {\n this.themeSvc.settingsChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((themeSettings) => {\n /*istanbul ignore next*/\n this.themeName = themeSettings.currentSettings?.theme?.name;\n });\n }\n }\n\n public ngOnDestroy(): void {\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n\n this._closed.complete();\n this._isMouseEnter.complete();\n this._opened.complete();\n\n /* istanbul ignore else */\n if (this.affixer) {\n this.affixer.destroy();\n }\n\n this._closed =\n this._isMouseEnter =\n this._opened =\n this.affixer =\n this.ngUnsubscribe =\n undefined;\n }\n\n public onAnimationEvent(event: AnimationEvent): void {\n if (event.fromState === 'void') {\n return;\n }\n\n if (event.phaseName === 'done') {\n if (event.toState === 'open') {\n /*istanbul ignore next*/\n this._opened?.next();\n } else {\n /*istanbul ignore next*/\n this._closed?.next();\n }\n }\n }\n\n public open(\n caller: ElementRef,\n config: {\n dismissOnBlur: boolean;\n enableAnimations: boolean;\n horizontalAlignment: SkyPopoverAlignment;\n isStatic: boolean;\n placement: SkyPopoverPlacement;\n popoverTitle: string;\n popoverType?: 'danger' | 'info';\n }\n ): void {\n this.caller = caller;\n this.dismissOnBlur = config.dismissOnBlur;\n this.enableAnimations = config.enableAnimations;\n this.horizontalAlignment = config.horizontalAlignment;\n this.placement = config.placement;\n this.popoverTitle = config.popoverTitle;\n if (config.popoverType) {\n this.popoverType = config.popoverType;\n }\n\n this.changeDetector.markForCheck();\n\n // Indicates if the popover should be displayed statically.\n // Please note: This feature is internal-only and used by the visual tests to capture multiple\n // states simultaneously without the overhead of event listeners.\n /* istanbul ignore if */\n if (config.isStatic) {\n this.isOpen = true;\n this.changeDetector.markForCheck();\n return;\n }\n\n // Let the styles render before gauging the affix dimensions.\n setTimeout(() => {\n /*istanbul ignore next*/\n if (\n !this.popoverRef?.nativeElement ||\n !this.ngUnsubscribe ||\n this.ngUnsubscribe.isStopped\n ) {\n return;\n }\n\n if (!this.affixer) {\n this.setupAffixer();\n }\n\n const affixOptions: SkyAffixConfig = {\n autoFitContext: SkyAffixAutoFitContext.Viewport,\n enableAutoFit: true,\n horizontalAlignment: parseAffixHorizontalAlignment(\n this.horizontalAlignment\n ),\n isSticky: true,\n placement: parseAffixPlacement(this.placement),\n };\n\n // Ensure that we are positioning the vertical alginment correctly. These\n // are the default alignments for all popovers but ensure that we are future proof here.\n if (\n affixOptions.placement === 'left' ||\n affixOptions.placement === 'right'\n ) {\n affixOptions.verticalAlignment = 'middle';\n } else if (affixOptions.placement === 'above') {\n affixOptions.verticalAlignment = 'bottom';\n } else {\n affixOptions.verticalAlignment = 'top';\n }\n\n this.affixer.affixTo(this.caller.nativeElement, affixOptions);\n\n this.updateArrowOffset();\n\n this.isOpen = true;\n this.changeDetector.markForCheck();\n });\n }\n\n public close(): void {\n this.isOpen = false;\n this.changeDetector.markForCheck();\n }\n\n public applyFocus(): void {\n if (this.isOpen) {\n this.coreAdapterService.getFocusableChildrenAndApplyFocus(\n this.popoverRef,\n '.sky-popover',\n true\n );\n }\n }\n\n private setupAffixer(): void {\n const affixer = this.affixService.createAffixer(this.popoverRef);\n\n affixer.offsetChange.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n this.updateArrowOffset();\n this.changeDetector.markForCheck();\n });\n\n affixer.overflowScroll.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n this.updateArrowOffset();\n this.changeDetector.markForCheck();\n });\n\n affixer.placementChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((change) => {\n this.placement = change.placement;\n this.changeDetector.markForCheck();\n });\n\n this.affixer = affixer;\n }\n\n private updateArrowOffset(): void {\n const { top, left } = this.adapterService.getArrowCoordinates(\n {\n caller: this.caller,\n popover: this.popoverRef,\n popoverArrow: this.arrowRef,\n },\n this.placement,\n this.themeName\n );\n\n this.arrowTop = top;\n this.arrowLeft = left;\n }\n\n private addEventListeners(): void {\n const hostElement = this.elementRef.nativeElement;\n\n observableFromEvent(hostElement, 'mouseenter')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => this._isMouseEnter.next(true));\n\n observableFromEvent(hostElement, 'mouseleave')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => this._isMouseEnter.next(false));\n\n observableFromEvent(hostElement, 'keydown')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((event: KeyboardEvent) => {\n const key = event.key.toLowerCase();\n\n /* tslint:disable-next-line:switch-default */\n switch (key) {\n case 'escape':\n this.close();\n this.caller.nativeElement.focus();\n event.preventDefault();\n event.stopPropagation();\n break;\n\n // Since the popover now lives in an overlay at the bottom of the document body, we need\n // to handle the tab key ourselves. Otherwise, focus would be moved to the browser's\n // search bar.\n case 'tab':\n if (!this.dismissOnBlur) {\n return;\n }\n\n const focusableItems =\n this.coreAdapterService.getFocusableChildren(hostElement);\n\n const isFirstItem =\n focusableItems[0] === event.target && event.shiftKey;\n\n const isLastItem =\n focusableItems[focusableItems.length - 1] === event.target &&\n !event.shiftKey;\n\n /*istanbul ignore else*/\n if (focusableItems.length === 0 || isFirstItem || isLastItem) {\n this.close();\n this.caller.nativeElement.focus();\n event.preventDefault();\n event.stopPropagation();\n }\n break;\n }\n });\n }\n}\n","<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-emphasized': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n"]}
|
|
1
|
+
{"version":3,"file":"popover-content.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/popovers/src/lib/modules/popover/popover-content.component.ts","../../../../../../../../libs/components/popovers/src/lib/modules/popover/popover-content.component.html"],"names":[],"mappings":"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","sourcesContent":["import { AnimationEvent } from '@angular/animations';\nimport {\n ChangeDetectorRef,\n Component,\n ElementRef,\n OnDestroy,\n OnInit,\n Optional,\n ViewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport {\n SkyAffixAutoFitContext,\n SkyAffixConfig,\n SkyAffixService,\n SkyAffixer,\n SkyCoreAdapterService,\n} from '@skyux/core';\nimport { SkyThemeService } from '@skyux/theme';\n\nimport { Observable, Subject, fromEvent as observableFromEvent } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyPopoverAdapterService } from './popover-adapter.service';\nimport { skyPopoverAnimation } from './popover-animation';\nimport { SkyPopoverAnimationState } from './popover-animation-state';\nimport { SkyPopoverContext } from './popover-context';\nimport {\n parseAffixHorizontalAlignment,\n parseAffixPlacement,\n} from './popover-extensions';\nimport { SkyPopoverAlignment } from './types/popover-alignment';\nimport { SkyPopoverPlacement } from './types/popover-placement';\n\n/**\n * @internal\n */\n@Component({\n selector: 'sky-popover-content',\n templateUrl: './popover-content.component.html',\n styleUrls: ['./popover-content.component.scss'],\n animations: [skyPopoverAnimation],\n providers: [SkyPopoverAdapterService],\n})\nexport class SkyPopoverContentComponent implements OnInit, OnDestroy {\n public get animationState(): SkyPopoverAnimationState {\n return this.isOpen ? 'open' : 'closed';\n }\n\n public get closed(): Observable<void> {\n return this._closed.asObservable();\n }\n\n public get opened(): Observable<void> {\n return this._opened.asObservable();\n }\n\n public get isMouseEnter(): Observable<boolean> {\n return this._isMouseEnter.asObservable();\n }\n\n public affixer: SkyAffixer;\n\n public arrowLeft: number;\n\n public arrowTop: number;\n\n public dismissOnBlur = true;\n\n public enableAnimations = true;\n\n public horizontalAlignment: SkyPopoverAlignment;\n\n public isOpen = false;\n\n public placement: SkyPopoverPlacement;\n\n public popoverTitle: string;\n\n public popoverType: 'danger' | 'info' = 'info';\n\n public themeName: string;\n\n @ViewChild('arrowRef', {\n read: ElementRef,\n static: true,\n })\n private arrowRef: ElementRef;\n\n @ViewChild('popoverRef', {\n read: ElementRef,\n static: true,\n })\n private popoverRef: ElementRef;\n\n @ViewChild('contentTarget', {\n read: ViewContainerRef,\n static: true,\n })\n private contentTarget: ViewContainerRef;\n\n private caller: ElementRef;\n\n private ngUnsubscribe = new Subject<void>();\n\n private _closed = new Subject<void>();\n\n private _isMouseEnter = new Subject<boolean>();\n\n private _opened = new Subject<void>();\n\n constructor(\n private changeDetector: ChangeDetectorRef,\n private elementRef: ElementRef,\n private affixService: SkyAffixService,\n private coreAdapterService: SkyCoreAdapterService,\n private adapterService: SkyPopoverAdapterService,\n @Optional() private context?: SkyPopoverContext,\n @Optional() private themeSvc?: SkyThemeService\n ) {}\n\n public ngOnInit(): void {\n /*istanbul ignore next*/\n this.contentTarget.createEmbeddedView(this.context?.contentTemplateRef);\n this.addEventListeners();\n\n /*istanbul ignore else*/\n if (this.themeSvc) {\n this.themeSvc.settingsChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((themeSettings) => {\n /*istanbul ignore next*/\n this.themeName = themeSettings.currentSettings?.theme?.name;\n });\n }\n }\n\n public ngOnDestroy(): void {\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n\n this._closed.complete();\n this._isMouseEnter.complete();\n this._opened.complete();\n\n /* istanbul ignore else */\n if (this.affixer) {\n this.affixer.destroy();\n }\n\n this._closed =\n this._isMouseEnter =\n this._opened =\n this.affixer =\n this.ngUnsubscribe =\n undefined;\n }\n\n public onAnimationEvent(event: AnimationEvent): void {\n if (event.fromState === 'void') {\n return;\n }\n\n if (event.phaseName === 'done') {\n if (event.toState === 'open') {\n /*istanbul ignore next*/\n this._opened?.next();\n } else {\n /*istanbul ignore next*/\n this._closed?.next();\n }\n }\n }\n\n public open(\n caller: ElementRef,\n config: {\n dismissOnBlur: boolean;\n enableAnimations: boolean;\n horizontalAlignment: SkyPopoverAlignment;\n isStatic: boolean;\n placement: SkyPopoverPlacement;\n popoverTitle: string;\n popoverType?: 'danger' | 'info';\n }\n ): void {\n this.caller = caller;\n this.dismissOnBlur = config.dismissOnBlur;\n this.enableAnimations = config.enableAnimations;\n this.horizontalAlignment = config.horizontalAlignment;\n this.placement = config.placement;\n this.popoverTitle = config.popoverTitle;\n if (config.popoverType) {\n this.popoverType = config.popoverType;\n }\n\n this.changeDetector.markForCheck();\n\n // Indicates if the popover should be displayed statically.\n // Please note: This feature is internal-only and used by the visual tests to capture multiple\n // states simultaneously without the overhead of event listeners.\n /* istanbul ignore if */\n if (config.isStatic) {\n this.isOpen = true;\n this.changeDetector.markForCheck();\n return;\n }\n\n // Let the styles render before gauging the affix dimensions.\n setTimeout(() => {\n /*istanbul ignore next*/\n if (\n !this.popoverRef?.nativeElement ||\n !this.ngUnsubscribe ||\n this.ngUnsubscribe.isStopped\n ) {\n return;\n }\n\n if (!this.affixer) {\n this.setupAffixer();\n }\n\n const affixOptions: SkyAffixConfig = {\n autoFitContext: SkyAffixAutoFitContext.Viewport,\n enableAutoFit: true,\n horizontalAlignment: parseAffixHorizontalAlignment(\n this.horizontalAlignment\n ),\n isSticky: true,\n placement: parseAffixPlacement(this.placement),\n };\n\n // Ensure that we are positioning the vertical alginment correctly. These\n // are the default alignments for all popovers but ensure that we are future proof here.\n if (\n affixOptions.placement === 'left' ||\n affixOptions.placement === 'right'\n ) {\n affixOptions.verticalAlignment = 'middle';\n } else if (affixOptions.placement === 'above') {\n affixOptions.verticalAlignment = 'bottom';\n } else {\n affixOptions.verticalAlignment = 'top';\n }\n\n this.affixer.affixTo(this.caller.nativeElement, affixOptions);\n\n this.updateArrowOffset();\n\n this.isOpen = true;\n this.changeDetector.markForCheck();\n });\n }\n\n public close(): void {\n this.isOpen = false;\n this.changeDetector.markForCheck();\n }\n\n public applyFocus(): void {\n if (this.isOpen) {\n this.coreAdapterService.getFocusableChildrenAndApplyFocus(\n this.popoverRef,\n '.sky-popover',\n true\n );\n }\n }\n\n private setupAffixer(): void {\n const affixer = this.affixService.createAffixer(this.popoverRef);\n\n affixer.offsetChange.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n this.updateArrowOffset();\n this.changeDetector.markForCheck();\n });\n\n affixer.overflowScroll.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n this.updateArrowOffset();\n this.changeDetector.markForCheck();\n });\n\n affixer.placementChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((change) => {\n this.placement = change.placement;\n this.changeDetector.markForCheck();\n });\n\n this.affixer = affixer;\n }\n\n private updateArrowOffset(): void {\n const { top, left } = this.adapterService.getArrowCoordinates(\n {\n caller: this.caller,\n popover: this.popoverRef,\n popoverArrow: this.arrowRef,\n },\n this.placement,\n this.themeName\n );\n\n this.arrowTop = top;\n this.arrowLeft = left;\n }\n\n private isFocusLeavingElement(event: KeyboardEvent): boolean {\n const focusableItems = this.coreAdapterService.getFocusableChildren(\n this.elementRef.nativeElement\n );\n\n const isFirstItem = focusableItems[0] === event.target && event.shiftKey;\n\n const isLastItem =\n focusableItems[focusableItems.length - 1] === event.target &&\n !event.shiftKey;\n\n return focusableItems.length === 0 || isFirstItem || isLastItem;\n }\n\n private addEventListeners(): void {\n const hostElement = this.elementRef.nativeElement;\n\n observableFromEvent(hostElement, 'mouseenter')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => this._isMouseEnter.next(true));\n\n observableFromEvent(hostElement, 'mouseleave')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => this._isMouseEnter.next(false));\n\n observableFromEvent(hostElement, 'keydown')\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((event: KeyboardEvent) => {\n const key = event.key.toLowerCase();\n\n /* tslint:disable-next-line:switch-default */\n switch (key) {\n case 'escape':\n this.close();\n this.caller.nativeElement.focus();\n event.preventDefault();\n event.stopPropagation();\n break;\n\n // Since the popover now lives in an overlay at the bottom of the document body, we need\n // to handle the tab key ourselves. Otherwise, focus would be moved to the browser's\n // search bar.\n case 'tab':\n if (!this.dismissOnBlur) {\n return;\n }\n\n /*istanbul ignore else*/\n if (this.isFocusLeavingElement(event)) {\n this.close();\n this.caller.nativeElement.focus();\n event.preventDefault();\n event.stopPropagation();\n }\n break;\n }\n });\n }\n}\n","<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-emphasized': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* NOTICE: DO NOT MODIFY THIS FILE!
|
|
3
3
|
* The contents of this file were automatically generated by
|
|
4
|
-
* the 'ng generate @skyux/i18n:lib-resources-module modules/shared/sky-popovers' schematic.
|
|
4
|
+
* the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-popovers' schematic.
|
|
5
5
|
* To update this file, simply rerun the command.
|
|
6
6
|
*/
|
|
7
7
|
import { NgModule } from '@angular/core';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sky-popovers-resources.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/popovers/src/lib/modules/shared/sky-popovers-resources.module.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EACL,2BAA2B,EAE3B,aAAa,EAGb,qBAAqB,GACtB,MAAM,aAAa,CAAC;;AAErB,MAAM,SAAS,GAA0C;IACvD,OAAO,EAAE;QACP,yCAAyC,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE;KACvE;CACF,CAAC;AAEF,MAAM,OAAO,4BAA4B;IAChC,SAAS,
|
|
1
|
+
{"version":3,"file":"sky-popovers-resources.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/popovers/src/lib/modules/shared/sky-popovers-resources.module.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EACL,2BAA2B,EAE3B,aAAa,EAGb,qBAAqB,GACtB,MAAM,aAAa,CAAC;;AAErB,MAAM,SAAS,GAA0C;IACvD,OAAO,EAAE;QACP,yCAAyC,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE;KACvE;CACF,CAAC;AAEF,MAAM,OAAO,4BAA4B;IAChC,SAAS,CACd,UAA4B,EAC5B,IAAY;QAEZ,OAAO,qBAAqB,CAAC,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACnE,CAAC;CACF;AAED;;GAEG;AAWH,MAAM,OAAO,0BAA0B;;wHAA1B,0BAA0B;yHAA1B,0BAA0B,YAT3B,aAAa;yHASZ,0BAA0B,aAR1B;QACT;YACE,OAAO,EAAE,2BAA2B;YACpC,QAAQ,EAAE,4BAA4B;YACtC,KAAK,EAAE,IAAI;SACZ;KACF,YAPS,aAAa;4FASZ,0BAA0B;kBAVtC,QAAQ;mBAAC;oBACR,OAAO,EAAE,CAAC,aAAa,CAAC;oBACxB,SAAS,EAAE;wBACT;4BACE,OAAO,EAAE,2BAA2B;4BACpC,QAAQ,EAAE,4BAA4B;4BACtC,KAAK,EAAE,IAAI;yBACZ;qBACF;iBACF","sourcesContent":["/**\n * NOTICE: DO NOT MODIFY THIS FILE!\n * The contents of this file were automatically generated by\n * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-popovers' schematic.\n * To update this file, simply rerun the command.\n */\nimport { NgModule } from '@angular/core';\nimport {\n SKY_LIB_RESOURCES_PROVIDERS,\n SkyAppLocaleInfo,\n SkyI18nModule,\n SkyLibResources,\n SkyLibResourcesProvider,\n getLibStringForLocale,\n} from '@skyux/i18n';\n\nconst RESOURCES: { [locale: string]: SkyLibResources } = {\n 'EN-US': {\n skyux_dropdown_context_menu_default_label: { message: 'Context menu' },\n },\n};\n\nexport class SkyPopoversResourcesProvider implements SkyLibResourcesProvider {\n public getString(\n localeInfo: SkyAppLocaleInfo,\n name: string\n ): string | undefined {\n return getLibStringForLocale(RESOURCES, localeInfo.locale, name);\n }\n}\n\n/**\n * Import into any component library module that needs to use resource strings.\n */\n@NgModule({\n exports: [SkyI18nModule],\n providers: [\n {\n provide: SKY_LIB_RESOURCES_PROVIDERS,\n useClass: SkyPopoversResourcesProvider,\n multi: true,\n },\n ],\n})\nexport class SkyPopoversResourcesModule {}\n"]}
|
|
@@ -54,7 +54,7 @@ var SkyDropdownMessageType;
|
|
|
54
54
|
/**
|
|
55
55
|
* NOTICE: DO NOT MODIFY THIS FILE!
|
|
56
56
|
* The contents of this file were automatically generated by
|
|
57
|
-
* the 'ng generate @skyux/i18n:lib-resources-module modules/shared/sky-popovers' schematic.
|
|
57
|
+
* the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-popovers' schematic.
|
|
58
58
|
* To update this file, simply rerun the command.
|
|
59
59
|
*/
|
|
60
60
|
const RESOURCES = {
|
|
@@ -1189,6 +1189,13 @@ class SkyPopoverContentComponent {
|
|
|
1189
1189
|
this.arrowTop = top;
|
|
1190
1190
|
this.arrowLeft = left;
|
|
1191
1191
|
}
|
|
1192
|
+
isFocusLeavingElement(event) {
|
|
1193
|
+
const focusableItems = this.coreAdapterService.getFocusableChildren(this.elementRef.nativeElement);
|
|
1194
|
+
const isFirstItem = focusableItems[0] === event.target && event.shiftKey;
|
|
1195
|
+
const isLastItem = focusableItems[focusableItems.length - 1] === event.target &&
|
|
1196
|
+
!event.shiftKey;
|
|
1197
|
+
return focusableItems.length === 0 || isFirstItem || isLastItem;
|
|
1198
|
+
}
|
|
1192
1199
|
addEventListeners() {
|
|
1193
1200
|
const hostElement = this.elementRef.nativeElement;
|
|
1194
1201
|
fromEvent(hostElement, 'mouseenter')
|
|
@@ -1216,12 +1223,8 @@ class SkyPopoverContentComponent {
|
|
|
1216
1223
|
if (!this.dismissOnBlur) {
|
|
1217
1224
|
return;
|
|
1218
1225
|
}
|
|
1219
|
-
const focusableItems = this.coreAdapterService.getFocusableChildren(hostElement);
|
|
1220
|
-
const isFirstItem = focusableItems[0] === event.target && event.shiftKey;
|
|
1221
|
-
const isLastItem = focusableItems[focusableItems.length - 1] === event.target &&
|
|
1222
|
-
!event.shiftKey;
|
|
1223
1226
|
/*istanbul ignore else*/
|
|
1224
|
-
if (
|
|
1227
|
+
if (this.isFocusLeavingElement(event)) {
|
|
1225
1228
|
this.close();
|
|
1226
1229
|
this.caller.nativeElement.focus();
|
|
1227
1230
|
event.preventDefault();
|