@hmcts/ccd-case-ui-toolkit 7.1.51-ongoing-accessibility-v1.6 → 7.1.51-ongoing-accessibility-v1.7
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/esm2022/lib/shared/components/palette/case-file-view/components/shared/case-file-view-overlay-menu/case-file-view-overlay-menu.component.mjs +11 -4
- package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs +10 -3
- package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs.map +1 -1
- package/lib/shared/components/palette/case-file-view/components/shared/case-file-view-overlay-menu/case-file-view-overlay-menu.component.d.ts +1 -0
- package/lib/shared/components/palette/case-file-view/components/shared/case-file-view-overlay-menu/case-file-view-overlay-menu.component.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -54,6 +54,13 @@ export class CaseFileViewOverlayMenuComponent {
|
|
|
54
54
|
menuItems;
|
|
55
55
|
isOpen = false;
|
|
56
56
|
isOpenChange = new EventEmitter();
|
|
57
|
+
setOpen() {
|
|
58
|
+
this.isOpen = !this.isOpen;
|
|
59
|
+
if (this.isOpen) {
|
|
60
|
+
const firstFocusableElement = document.querySelector('.overlay-menu > li:first-child');
|
|
61
|
+
firstFocusableElement.focus();
|
|
62
|
+
}
|
|
63
|
+
}
|
|
57
64
|
closeOverlay() {
|
|
58
65
|
const isOpen = false;
|
|
59
66
|
this.isOpen = isOpen;
|
|
@@ -64,11 +71,11 @@ export class CaseFileViewOverlayMenuComponent {
|
|
|
64
71
|
this.closeOverlay();
|
|
65
72
|
}
|
|
66
73
|
static ɵfac = function CaseFileViewOverlayMenuComponent_Factory(t) { return new (t || CaseFileViewOverlayMenuComponent)(); };
|
|
67
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewOverlayMenuComponent, selectors: [["ccd-case-file-view-overlay-menu"]], inputs: { title: "title", menuItems: "menuItems", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngContentSelectors: _c1, decls: 5, vars: 4, consts: [["trigger", "cdkOverlayOrigin"], ["type", "button", "cdkOverlayOrigin", "", 1, "overlay-toggle", 3, "click"], ["cdkConnectedOverlay", "", 3, "backdropClick", "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass"], [1, "overlay-menu"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "overlay-menu__title"], [1, "overlay-menu__item", 3, "click", "keyup"], ["class", "overlay-menu__itemIcon", 3, "src", "alt", 4, "ngIf"], [1, "overlay-menu__actionText"], [1, "overlay-menu__itemIcon", 3, "src", "alt"]], template: function CaseFileViewOverlayMenuComponent_Template(rf, ctx) { if (rf & 1) {
|
|
74
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewOverlayMenuComponent, selectors: [["ccd-case-file-view-overlay-menu"]], inputs: { title: "title", menuItems: "menuItems", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngContentSelectors: _c1, decls: 5, vars: 4, consts: [["trigger", "cdkOverlayOrigin"], ["type", "button", "cdkOverlayOrigin", "", 1, "overlay-toggle", 3, "click"], ["cdkConnectedOverlay", "", 3, "backdropClick", "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass"], [1, "overlay-menu"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "overlay-menu__title"], ["tabindex", "0", 1, "overlay-menu__item", 3, "click", "keyup"], ["class", "overlay-menu__itemIcon", 3, "src", "alt", 4, "ngIf"], [1, "overlay-menu__actionText"], [1, "overlay-menu__itemIcon", 3, "src", "alt"]], template: function CaseFileViewOverlayMenuComponent_Template(rf, ctx) { if (rf & 1) {
|
|
68
75
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
69
76
|
i0.ɵɵprojectionDef(_c0);
|
|
70
77
|
i0.ɵɵelementStart(0, "div")(1, "button", 1, 0);
|
|
71
|
-
i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.stopPropagation(); return i0.ɵɵresetView(ctx.
|
|
78
|
+
i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.stopPropagation(); return i0.ɵɵresetView(ctx.setOpen()); });
|
|
72
79
|
i0.ɵɵprojection(3);
|
|
73
80
|
i0.ɵɵelementEnd();
|
|
74
81
|
i0.ɵɵtemplate(4, CaseFileViewOverlayMenuComponent_ng_template_4_Template, 3, 2, "ng-template", 2);
|
|
@@ -82,7 +89,7 @@ export class CaseFileViewOverlayMenuComponent {
|
|
|
82
89
|
}
|
|
83
90
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewOverlayMenuComponent, [{
|
|
84
91
|
type: Component,
|
|
85
|
-
args: [{ selector: 'ccd-case-file-view-overlay-menu', template: "<div>\n <button type=\"button\" class=\"overlay-toggle\"\n (click)=\"$event.stopPropagation();
|
|
92
|
+
args: [{ selector: 'ccd-case-file-view-overlay-menu', template: "<div>\n <button type=\"button\" class=\"overlay-toggle\"\n (click)=\"$event.stopPropagation(); setOpen()\"\n cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\n <ng-content select=\"[trigger]\"></ng-content>\n </button>\n\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"isOpen\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n (backdropClick)=\"closeOverlay()\"\n >\n <div class=\"overlay-menu\">\n <ng-container *ngIf=\"title\">\n <div class=\"overlay-menu__title\">{{title}}</div>\n </ng-container>\n\n <menu *ngFor=\"let item of menuItems\">\n <li class=\"overlay-menu__item\" tabindex=\"0\" (click)=\"item.actionFn(); closeOverlay();\" (keyup)=\"$event.key === 'Enter' ? actionAndClose(item.actionFn()) : null\">\n <img *ngIf=\"item.iconSrc\" [src]=\"item.iconSrc\" class=\"overlay-menu__itemIcon\" alt=\"{{title}} icon'\" />\n <span class=\"overlay-menu__actionText\">{{item.actionText}}</span>\n </li>\n </menu>\n </div>\n </ng-template>\n</div>\n", styles: [".overlay-toggle{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title,.overlay-menu__item{padding:10px;border-bottom:1px solid grey}.overlay-menu__title:last-child,.overlay-menu__item:last-child{border:none}.overlay-menu__title{padding-left:6px;padding-right:6px}.overlay-menu__item{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item:hover{background-color:#fff2cc}.overlay-menu__itemIcon{height:1.25em;width:1.25em;margin-right:6px}\n"] }]
|
|
86
93
|
}], null, { title: [{
|
|
87
94
|
type: Input
|
|
88
95
|
}], menuItems: [{
|
|
@@ -93,4 +100,4 @@ export class CaseFileViewOverlayMenuComponent {
|
|
|
93
100
|
type: Output
|
|
94
101
|
}] }); })();
|
|
95
102
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFileViewOverlayMenuComponent, { className: "CaseFileViewOverlayMenuComponent", filePath: "lib/shared/components/palette/case-file-view/components/shared/case-file-view-overlay-menu/case-file-view-overlay-menu.component.ts", lineNumber: 9 }); })();
|
|
96
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
103
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FzZS1maWxlLXZpZXctb3ZlcmxheS1tZW51LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NjZC1jYXNlLXVpLXRvb2xraXQvc3JjL2xpYi9zaGFyZWQvY29tcG9uZW50cy9wYWxldHRlL2Nhc2UtZmlsZS12aWV3L2NvbXBvbmVudHMvc2hhcmVkL2Nhc2UtZmlsZS12aWV3LW92ZXJsYXktbWVudS9jYXNlLWZpbGUtdmlldy1vdmVybGF5LW1lbnUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2NkLWNhc2UtdWktdG9vbGtpdC9zcmMvbGliL3NoYXJlZC9jb21wb25lbnRzL3BhbGV0dGUvY2FzZS1maWxlLXZpZXcvY29tcG9uZW50cy9zaGFyZWQvY2FzZS1maWxlLXZpZXctb3ZlcmxheS1tZW51L2Nhc2UtZmlsZS12aWV3LW92ZXJsYXktbWVudS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7Ozs7O0lDZ0JqRSw2QkFBNEI7SUFDMUIsOEJBQWlDO0lBQUEsWUFBUztJQUFBLGlCQUFNOzs7O0lBQWYsZUFBUztJQUFULGtDQUFTOzs7SUFLeEMsMEJBQXNHOzs7O0lBQXhCLDREQUFxQjtJQUF6RSx1REFBb0I7Ozs7SUFEaEQsQUFERiw0QkFBcUMsWUFDOEg7SUFBMUUsQUFBM0MsNE1BQVMsa0JBQWUsd0JBQUUscUJBQWMsS0FBRSwwT0FBeUIsT0FBTyxHQUFHLHNCQUFlLGtCQUFlLENBQUMsR0FBRyxJQUFJLEtBQUM7SUFDOUosc0dBQXNHO0lBQ3RHLCtCQUF1QztJQUFBLFlBQW1CO0lBRTlELEFBREUsQUFENEQsaUJBQU8sRUFDOUQsRUFDQTs7O0lBSEcsZUFBa0I7SUFBbEIsc0NBQWtCO0lBQ2UsZUFBbUI7SUFBbkIsd0NBQW1COzs7SUFSaEUsOEJBQTBCO0lBS3hCLEFBSkEsaUhBQTRCLG9GQUlTO0lBTXZDLGlCQUFNOzs7SUFWVyxjQUFXO0lBQVgsbUNBQVc7SUFJSCxjQUFZO0lBQVosMENBQVk7O0FEWnpDLE1BQU0sT0FBTyxnQ0FBZ0M7SUFDM0IsS0FBSyxHQUFXLEVBQUUsQ0FBQztJQUNuQixTQUFTLENBQWdDO0lBRXpDLE1BQU0sR0FBRyxLQUFLLENBQUM7SUFDZCxZQUFZLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQUVyRCxPQUFPO1FBQ1osSUFBSSxDQUFDLE1BQU0sR0FBRyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUM7UUFDM0IsSUFBRyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7WUFDaEIsTUFBTSxxQkFBcUIsR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLGdDQUFnQyxDQUFnQixDQUFDO1lBQ3RHLHFCQUFxQixDQUFDLEtBQUssRUFBRSxDQUFDO1FBQy9CLENBQUM7SUFDSCxDQUFDO0lBRU0sWUFBWTtRQUNqQixNQUFNLE1BQU0sR0FBRyxLQUFLLENBQUM7UUFFckIsSUFBSSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7UUFDckIsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDakMsQ0FBQztJQUVNLGNBQWMsQ0FBQyxJQUFTO1FBQzdCLElBQUksRUFBRSxDQUFDO1FBQ1AsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3RCLENBQUM7MEZBekJVLGdDQUFnQzs2REFBaEMsZ0NBQWdDOzs7WUNQM0MsQUFERiwyQkFBSyxtQkFHa0Q7WUFEN0MsbUlBQVMsd0JBQXdCLHdCQUFFLGFBQVMsS0FBQztZQUVuRCxrQkFBNEM7WUFDOUMsaUJBQVM7WUFFVCxpR0FPQztZQURDLHdLQUFpQixrQkFBYyxLQUFDO1lBZXBDLGlCQUFNOzs7WUFuQkYsZUFBcUM7WUFHckMsQUFEQSxBQURBLEFBREEsc0RBQXFDLHVDQUNILHdDQUNLLHdFQUNnQzs7O2lGREo5RCxnQ0FBZ0M7Y0FMNUMsU0FBUzsyQkFDRSxpQ0FBaUM7Z0JBSzNCLEtBQUs7a0JBQXBCLEtBQUs7WUFDVSxTQUFTO2tCQUF4QixLQUFLO1lBRVUsTUFBTTtrQkFBckIsS0FBSztZQUNXLFlBQVk7a0JBQTVCLE1BQU07O2tGQUxJLGdDQUFnQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDYXNlRmlsZVZpZXdPdmVybGF5TWVudUl0ZW0gfSBmcm9tICcuL2Nhc2UtZmlsZS12aWV3LW92ZXJsYXktbWVudS1pdGVtLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY2NkLWNhc2UtZmlsZS12aWV3LW92ZXJsYXktbWVudScsXG4gIHRlbXBsYXRlVXJsOiAnLi9jYXNlLWZpbGUtdmlldy1vdmVybGF5LW1lbnUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jYXNlLWZpbGUtdmlldy1vdmVybGF5LW1lbnUuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBDYXNlRmlsZVZpZXdPdmVybGF5TWVudUNvbXBvbmVudCB7XG4gIEBJbnB1dCgpIHB1YmxpYyB0aXRsZTogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgpIHB1YmxpYyBtZW51SXRlbXM6IENhc2VGaWxlVmlld092ZXJsYXlNZW51SXRlbVtdO1xuXG4gIEBJbnB1dCgpIHB1YmxpYyBpc09wZW4gPSBmYWxzZTtcbiAgQE91dHB1dCgpIHB1YmxpYyBpc09wZW5DaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgcHVibGljIHNldE9wZW4oKSB7XG4gICAgdGhpcy5pc09wZW4gPSAhdGhpcy5pc09wZW47XG4gICAgaWYodGhpcy5pc09wZW4pIHtcbiAgICAgY29uc3QgZmlyc3RGb2N1c2FibGVFbGVtZW50ID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcignLm92ZXJsYXktbWVudSA+IGxpOmZpcnN0LWNoaWxkJykgYXMgSFRNTEVsZW1lbnQ7XG4gICAgIGZpcnN0Rm9jdXNhYmxlRWxlbWVudC5mb2N1cygpO1xuICAgIH1cbiAgfVxuXG4gIHB1YmxpYyBjbG9zZU92ZXJsYXkoKTogdm9pZCB7XG4gICAgY29uc3QgaXNPcGVuID0gZmFsc2U7XG5cbiAgICB0aGlzLmlzT3BlbiA9IGlzT3BlbjtcbiAgICB0aGlzLmlzT3BlbkNoYW5nZS5lbWl0KGlzT3Blbik7XG4gIH1cblxuICBwdWJsaWMgYWN0aW9uQW5kQ2xvc2UoZnVuYzogYW55KTogdm9pZCB7XG4gICAgZnVuYygpO1xuICAgIHRoaXMuY2xvc2VPdmVybGF5KCk7XG4gIH1cbn1cbiIsIjxkaXY+XG4gIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIGNsYXNzPVwib3ZlcmxheS10b2dnbGVcIlxuICAgICAgICAgIChjbGljayk9XCIkZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7IHNldE9wZW4oKVwiXG4gICAgICAgICAgY2RrT3ZlcmxheU9yaWdpbiAjdHJpZ2dlcj1cImNka092ZXJsYXlPcmlnaW5cIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbdHJpZ2dlcl1cIj48L25nLWNvbnRlbnQ+XG4gIDwvYnV0dG9uPlxuXG4gIDxuZy10ZW1wbGF0ZVxuICAgIGNka0Nvbm5lY3RlZE92ZXJsYXlcbiAgICBbY2RrQ29ubmVjdGVkT3ZlcmxheU9yaWdpbl09XCJ0cmlnZ2VyXCJcbiAgICBbY2RrQ29ubmVjdGVkT3ZlcmxheU9wZW5dPVwiaXNPcGVuXCJcbiAgICBbY2RrQ29ubmVjdGVkT3ZlcmxheUhhc0JhY2tkcm9wXT1cInRydWVcIlxuICAgIFtjZGtDb25uZWN0ZWRPdmVybGF5QmFja2Ryb3BDbGFzc109XCInY2RrLW92ZXJsYXktdHJhbnNwYXJlbnQtYmFja2Ryb3AnXCJcbiAgICAoYmFja2Ryb3BDbGljayk9XCJjbG9zZU92ZXJsYXkoKVwiXG4gID5cbiAgICA8ZGl2IGNsYXNzPVwib3ZlcmxheS1tZW51XCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwidGl0bGVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cIm92ZXJsYXktbWVudV9fdGl0bGVcIj57e3RpdGxlfX08L2Rpdj5cbiAgICAgIDwvbmctY29udGFpbmVyPlxuXG4gICAgICA8bWVudSAqbmdGb3I9XCJsZXQgaXRlbSBvZiBtZW51SXRlbXNcIj5cbiAgICAgICAgPGxpIGNsYXNzPVwib3ZlcmxheS1tZW51X19pdGVtXCIgdGFiaW5kZXg9XCIwXCIgKGNsaWNrKT1cIml0ZW0uYWN0aW9uRm4oKTsgY2xvc2VPdmVybGF5KCk7XCIgKGtleXVwKT1cIiRldmVudC5rZXkgPT09ICdFbnRlcicgPyBhY3Rpb25BbmRDbG9zZShpdGVtLmFjdGlvbkZuKCkpIDogbnVsbFwiPlxuICAgICAgICAgIDxpbWcgKm5nSWY9XCJpdGVtLmljb25TcmNcIiBbc3JjXT1cIml0ZW0uaWNvblNyY1wiIGNsYXNzPVwib3ZlcmxheS1tZW51X19pdGVtSWNvblwiIGFsdD1cInt7dGl0bGV9fSBpY29uJ1wiIC8+XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJvdmVybGF5LW1lbnVfX2FjdGlvblRleHRcIj57e2l0ZW0uYWN0aW9uVGV4dH19PC9zcGFuPlxuICAgICAgICA8L2xpPlxuICAgICAgPC9tZW51PlxuICAgIDwvZGl2PlxuICA8L25nLXRlbXBsYXRlPlxuPC9kaXY+XG4iXX0=
|
|
@@ -23772,6 +23772,13 @@ class CaseFileViewOverlayMenuComponent {
|
|
|
23772
23772
|
menuItems;
|
|
23773
23773
|
isOpen = false;
|
|
23774
23774
|
isOpenChange = new EventEmitter();
|
|
23775
|
+
setOpen() {
|
|
23776
|
+
this.isOpen = !this.isOpen;
|
|
23777
|
+
if (this.isOpen) {
|
|
23778
|
+
const firstFocusableElement = document.querySelector('.overlay-menu > li:first-child');
|
|
23779
|
+
firstFocusableElement.focus();
|
|
23780
|
+
}
|
|
23781
|
+
}
|
|
23775
23782
|
closeOverlay() {
|
|
23776
23783
|
const isOpen = false;
|
|
23777
23784
|
this.isOpen = isOpen;
|
|
@@ -23782,11 +23789,11 @@ class CaseFileViewOverlayMenuComponent {
|
|
|
23782
23789
|
this.closeOverlay();
|
|
23783
23790
|
}
|
|
23784
23791
|
static ɵfac = function CaseFileViewOverlayMenuComponent_Factory(t) { return new (t || CaseFileViewOverlayMenuComponent)(); };
|
|
23785
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewOverlayMenuComponent, selectors: [["ccd-case-file-view-overlay-menu"]], inputs: { title: "title", menuItems: "menuItems", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngContentSelectors: _c1$9, decls: 5, vars: 4, consts: [["trigger", "cdkOverlayOrigin"], ["type", "button", "cdkOverlayOrigin", "", 1, "overlay-toggle", 3, "click"], ["cdkConnectedOverlay", "", 3, "backdropClick", "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass"], [1, "overlay-menu"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "overlay-menu__title"], [1, "overlay-menu__item", 3, "click", "keyup"], ["class", "overlay-menu__itemIcon", 3, "src", "alt", 4, "ngIf"], [1, "overlay-menu__actionText"], [1, "overlay-menu__itemIcon", 3, "src", "alt"]], template: function CaseFileViewOverlayMenuComponent_Template(rf, ctx) { if (rf & 1) {
|
|
23792
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewOverlayMenuComponent, selectors: [["ccd-case-file-view-overlay-menu"]], inputs: { title: "title", menuItems: "menuItems", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngContentSelectors: _c1$9, decls: 5, vars: 4, consts: [["trigger", "cdkOverlayOrigin"], ["type", "button", "cdkOverlayOrigin", "", 1, "overlay-toggle", 3, "click"], ["cdkConnectedOverlay", "", 3, "backdropClick", "cdkConnectedOverlayOrigin", "cdkConnectedOverlayOpen", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayBackdropClass"], [1, "overlay-menu"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "overlay-menu__title"], ["tabindex", "0", 1, "overlay-menu__item", 3, "click", "keyup"], ["class", "overlay-menu__itemIcon", 3, "src", "alt", 4, "ngIf"], [1, "overlay-menu__actionText"], [1, "overlay-menu__itemIcon", 3, "src", "alt"]], template: function CaseFileViewOverlayMenuComponent_Template(rf, ctx) { if (rf & 1) {
|
|
23786
23793
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
23787
23794
|
i0.ɵɵprojectionDef(_c0$t);
|
|
23788
23795
|
i0.ɵɵelementStart(0, "div")(1, "button", 1, 0);
|
|
23789
|
-
i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.stopPropagation(); return i0.ɵɵresetView(ctx.
|
|
23796
|
+
i0.ɵɵlistener("click", function CaseFileViewOverlayMenuComponent_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.stopPropagation(); return i0.ɵɵresetView(ctx.setOpen()); });
|
|
23790
23797
|
i0.ɵɵprojection(3);
|
|
23791
23798
|
i0.ɵɵelementEnd();
|
|
23792
23799
|
i0.ɵɵtemplate(4, CaseFileViewOverlayMenuComponent_ng_template_4_Template, 3, 2, "ng-template", 2);
|
|
@@ -23800,7 +23807,7 @@ class CaseFileViewOverlayMenuComponent {
|
|
|
23800
23807
|
}
|
|
23801
23808
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewOverlayMenuComponent, [{
|
|
23802
23809
|
type: Component,
|
|
23803
|
-
args: [{ selector: 'ccd-case-file-view-overlay-menu', template: "<div>\n <button type=\"button\" class=\"overlay-toggle\"\n (click)=\"$event.stopPropagation();
|
|
23810
|
+
args: [{ selector: 'ccd-case-file-view-overlay-menu', template: "<div>\n <button type=\"button\" class=\"overlay-toggle\"\n (click)=\"$event.stopPropagation(); setOpen()\"\n cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\n <ng-content select=\"[trigger]\"></ng-content>\n </button>\n\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"isOpen\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n (backdropClick)=\"closeOverlay()\"\n >\n <div class=\"overlay-menu\">\n <ng-container *ngIf=\"title\">\n <div class=\"overlay-menu__title\">{{title}}</div>\n </ng-container>\n\n <menu *ngFor=\"let item of menuItems\">\n <li class=\"overlay-menu__item\" tabindex=\"0\" (click)=\"item.actionFn(); closeOverlay();\" (keyup)=\"$event.key === 'Enter' ? actionAndClose(item.actionFn()) : null\">\n <img *ngIf=\"item.iconSrc\" [src]=\"item.iconSrc\" class=\"overlay-menu__itemIcon\" alt=\"{{title}} icon'\" />\n <span class=\"overlay-menu__actionText\">{{item.actionText}}</span>\n </li>\n </menu>\n </div>\n </ng-template>\n</div>\n", styles: [".overlay-toggle{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title,.overlay-menu__item{padding:10px;border-bottom:1px solid grey}.overlay-menu__title:last-child,.overlay-menu__item:last-child{border:none}.overlay-menu__title{padding-left:6px;padding-right:6px}.overlay-menu__item{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item:hover{background-color:#fff2cc}.overlay-menu__itemIcon{height:1.25em;width:1.25em;margin-right:6px}\n"] }]
|
|
23804
23811
|
}], null, { title: [{
|
|
23805
23812
|
type: Input
|
|
23806
23813
|
}], menuItems: [{
|