@agorapulse/ui-components 15.0.20 → 15.0.21
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/agorapulse-ui-components-15.0.21.tgz +0 -0
- package/button/button.component.d.ts +8 -14
- package/directives/base-button.directive.d.ts +22 -0
- package/directives/public_api.d.ts +1 -0
- package/esm2020/add-comment/add-comment.component.mjs +1 -1
- package/esm2020/button/button.component.mjs +20 -35
- package/esm2020/confirm-modal/confirm-modal.component.mjs +2 -2
- package/esm2020/directives/base-button.directive.mjs +76 -0
- package/esm2020/directives/public_api.mjs +2 -1
- package/esm2020/icon-button/icon-button.component.mjs +23 -9
- package/esm2020/paginator/paginator-button/paginator-button.component.mjs +1 -1
- package/esm2020/social-button/social-button.component.mjs +19 -24
- package/esm2020/split-button/split-button.component.mjs +22 -36
- package/fesm2015/agorapulse-ui-components-add-comment.mjs +1 -1
- package/fesm2015/agorapulse-ui-components-add-comment.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-button.mjs +19 -34
- package/fesm2015/agorapulse-ui-components-button.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-confirm-modal.mjs +1 -1
- package/fesm2015/agorapulse-ui-components-confirm-modal.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-directives.mjs +76 -2
- package/fesm2015/agorapulse-ui-components-directives.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-icon-button.mjs +22 -8
- package/fesm2015/agorapulse-ui-components-icon-button.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-paginator.mjs +1 -1
- package/fesm2015/agorapulse-ui-components-paginator.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-social-button.mjs +18 -23
- package/fesm2015/agorapulse-ui-components-social-button.mjs.map +1 -1
- package/fesm2015/agorapulse-ui-components-split-button.mjs +21 -35
- package/fesm2015/agorapulse-ui-components-split-button.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-add-comment.mjs +1 -1
- package/fesm2020/agorapulse-ui-components-add-comment.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-button.mjs +19 -34
- package/fesm2020/agorapulse-ui-components-button.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-confirm-modal.mjs +1 -1
- package/fesm2020/agorapulse-ui-components-confirm-modal.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-directives.mjs +76 -2
- package/fesm2020/agorapulse-ui-components-directives.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-icon-button.mjs +22 -8
- package/fesm2020/agorapulse-ui-components-icon-button.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-paginator.mjs +1 -1
- package/fesm2020/agorapulse-ui-components-paginator.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-social-button.mjs +18 -23
- package/fesm2020/agorapulse-ui-components-social-button.mjs.map +1 -1
- package/fesm2020/agorapulse-ui-components-split-button.mjs +21 -35
- package/fesm2020/agorapulse-ui-components-split-button.mjs.map +1 -1
- package/icon-button/icon-button.component.d.ts +6 -3
- package/package.json +1 -1
- package/social-button/social-button.component.d.ts +7 -10
- package/split-button/split-button.component.d.ts +7 -11
- package/agorapulse-ui-components-15.0.20.tgz +0 -0
|
Binary file
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
|
2
2
|
import { MatMenuPanel } from '@angular/material/menu';
|
|
3
|
+
import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
|
|
3
4
|
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@agorapulse/ui-components/directives";
|
|
4
6
|
type ButtonConfig = {
|
|
5
7
|
style: 'primary';
|
|
6
8
|
color: 'orange' | 'blue';
|
|
@@ -18,26 +20,18 @@ type ButtonConfig = {
|
|
|
18
20
|
color: 'grey' | 'blue' | 'red';
|
|
19
21
|
};
|
|
20
22
|
export declare class ButtonComponent {
|
|
21
|
-
|
|
23
|
+
readonly baseButtonDirective: BaseButtonDirective;
|
|
22
24
|
ariaLabel: string;
|
|
23
|
-
|
|
24
|
-
disabled: boolean;
|
|
25
|
+
disabled: boolean | undefined;
|
|
25
26
|
name: string;
|
|
26
|
-
|
|
27
|
+
config: ButtonConfig;
|
|
28
|
+
loading: boolean | undefined;
|
|
27
29
|
locked: boolean;
|
|
28
30
|
menuTrigger: MatMenuPanel | null;
|
|
29
31
|
symbolPosition: 'left' | 'right';
|
|
30
|
-
buttonElement: ElementRef<HTMLButtonElement>;
|
|
31
|
-
click: EventEmitter<MouseEvent>;
|
|
32
|
-
focus: EventEmitter<FocusEvent>;
|
|
33
|
-
blur: EventEmitter<FocusEvent>;
|
|
34
32
|
menuOpened: EventEmitter<void>;
|
|
35
33
|
menuClosed: EventEmitter<void>;
|
|
36
|
-
hostDataTest: string;
|
|
37
|
-
hostType: string;
|
|
38
|
-
constructor(elementRef: ElementRef);
|
|
39
|
-
onClickHandle($event: MouseEvent): void;
|
|
40
34
|
static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
|
|
41
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "ap-button[name]", never, { "ariaLabel": "ariaLabel"; "
|
|
35
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "ap-button[name]", never, { "ariaLabel": "ariaLabel"; "disabled": "disabled"; "name": "name"; "config": "config"; "loading": "loading"; "locked": "locked"; "menuTrigger": "menuTrigger"; "symbolPosition": "symbolPosition"; }, { "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; }, never, ["*", "ap-symbol"], true, [{ directive: typeof i1.BaseButtonDirective; inputs: {}; outputs: { "click": "click"; "focus": "focus"; "blur": "blur"; }; }]>;
|
|
42
36
|
}
|
|
43
37
|
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { AfterViewInit, EventEmitter } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class BaseButtonDirective implements AfterViewInit {
|
|
4
|
+
private elementRef;
|
|
5
|
+
private changeDetectorRef;
|
|
6
|
+
buttonElement: HTMLButtonElement;
|
|
7
|
+
click: EventEmitter<MouseEvent>;
|
|
8
|
+
focus: EventEmitter<FocusEvent>;
|
|
9
|
+
blur: EventEmitter<FocusEvent>;
|
|
10
|
+
hostId: string;
|
|
11
|
+
hostDataTest: string;
|
|
12
|
+
hostType: string;
|
|
13
|
+
focused: boolean;
|
|
14
|
+
constructor();
|
|
15
|
+
ngAfterViewInit(): void;
|
|
16
|
+
onClickHandle($event: MouseEvent): void;
|
|
17
|
+
onBlurHandle($event: FocusEvent): void;
|
|
18
|
+
onFocusHandle($event: FocusEvent): void;
|
|
19
|
+
onSpaceKeyUp(event: KeyboardEvent): void;
|
|
20
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BaseButtonDirective, never>;
|
|
21
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BaseButtonDirective, "[apBaseButton]", never, {}, { "click": "click"; "focus": "focus"; "blur": "blur"; }, never, never, true, never>;
|
|
22
|
+
}
|
|
@@ -47,7 +47,7 @@ AddCommentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
47
47
|
useExisting: forwardRef(() => AddCommentComponent),
|
|
48
48
|
multi: true,
|
|
49
49
|
},
|
|
50
|
-
], ngImport: i0, template: "<div class=\"add-comment\">\n <textarea apAutosize\n dir=\"auto\"\n matInput\n rows=\"1\"\n [placeholder]=\"placeholder\"\n [value]=\"_commentValue\"\n (keyup)=\"onChange($event)\"\n (change)=\"onChange($event)\">\n </textarea>\n\n <ng-template\n #defaultTemplate\n let-action=\"action\">\n <div class=\"default-template\">\n <ap-button name=\"\"\n [config]=\"{\n style: 'stroked',\n color: 'grey'\n }\"\n (click)=\"action.emit('send')\">\n Send\n </ap-button>\n </div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n [ngTemplateOutletContext]=\"{\n action: action\n }\">\n </ng-template>\n</div>\n", styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid #ff0000}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #ffffff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:transparent}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:transparent}[border=transparent]{border:1px solid transparent}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #A566A5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #C7AB82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #F2713C}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #FFD006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94C5AA}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2A9D8F}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78ACD8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525A9E}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6A2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729E}.add-comment{border:1px solid #d6dae0;border-radius:4px;display:flex;flex-direction:column}.add-comment:focus-within{border:1px solid #178dfe}.add-comment:not(:focus-within):hover{border-color:#aeb5c1}.add-comment textarea{border:none;background:transparent;color:#858fa1;padding:0;margin:6px 16px}.add-comment textarea:focus,.add-comment input:focus{outline:none}.add-comment .default-template{display:flex;flex-direction:row-reverse}.add-comment .default-template button{background-color:#fff!important;width:90px;margin-right:8px;margin-bottom:8px;align-self:end}.add-comment .default-template button:hover{border-color:#d6dae0!important}.add-comment .default-template button:active{border-color:#aeb5c1!important}\n"], dependencies: [{ kind: "directive", type: AutosizeTextareaDirective, selector: "textarea[apAutosize]" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: i2.MatLegacyInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", exportAs: ["matInput"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "ap-button[name]", inputs: ["ariaLabel", "
|
|
50
|
+
], ngImport: i0, template: "<div class=\"add-comment\">\n <textarea apAutosize\n dir=\"auto\"\n matInput\n rows=\"1\"\n [placeholder]=\"placeholder\"\n [value]=\"_commentValue\"\n (keyup)=\"onChange($event)\"\n (change)=\"onChange($event)\">\n </textarea>\n\n <ng-template\n #defaultTemplate\n let-action=\"action\">\n <div class=\"default-template\">\n <ap-button name=\"\"\n [config]=\"{\n style: 'stroked',\n color: 'grey'\n }\"\n (click)=\"action.emit('send')\">\n Send\n </ap-button>\n </div>\n </ng-template>\n\n <ng-template\n [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n [ngTemplateOutletContext]=\"{\n action: action\n }\">\n </ng-template>\n</div>\n", styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid #ff0000}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #ffffff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:transparent}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:transparent}[border=transparent]{border:1px solid transparent}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #A566A5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #C7AB82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #F2713C}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #FFD006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94C5AA}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2A9D8F}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78ACD8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525A9E}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6A2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729E}.add-comment{border:1px solid #d6dae0;border-radius:4px;display:flex;flex-direction:column}.add-comment:focus-within{border:1px solid #178dfe}.add-comment:not(:focus-within):hover{border-color:#aeb5c1}.add-comment textarea{border:none;background:transparent;color:#858fa1;padding:0;margin:6px 16px}.add-comment textarea:focus,.add-comment input:focus{outline:none}.add-comment .default-template{display:flex;flex-direction:row-reverse}.add-comment .default-template button{background-color:#fff!important;width:90px;margin-right:8px;margin-bottom:8px;align-self:end}.add-comment .default-template button:hover{border-color:#d6dae0!important}.add-comment .default-template button:active{border-color:#aeb5c1!important}\n"], dependencies: [{ kind: "directive", type: AutosizeTextareaDirective, selector: "textarea[apAutosize]" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: i2.MatLegacyInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", exportAs: ["matInput"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "ap-button[name]", inputs: ["ariaLabel", "disabled", "name", "config", "loading", "locked", "menuTrigger", "symbolPosition"], outputs: ["menuOpened", "menuClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
51
51
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: AddCommentComponent, decorators: [{
|
|
52
52
|
type: Component,
|
|
53
53
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-add-comment', standalone: true, imports: [AutosizeTextareaDirective, MatInputModule, NgTemplateOutlet, ButtonComponent], providers: [
|
|
@@ -1,52 +1,46 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output,
|
|
1
|
+
import { ChangeDetectionStrategy, Component, EventEmitter, inject, Input, Output, ViewEncapsulation, } from '@angular/core';
|
|
2
2
|
import { CommonModule, NgIf } from '@angular/common';
|
|
3
3
|
import { SymbolComponent } from '@agorapulse/ui-symbol';
|
|
4
4
|
import { MatMenuModule } from '@angular/material/menu';
|
|
5
|
+
import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
|
|
5
6
|
import * as i0 from "@angular/core";
|
|
6
|
-
import * as i1 from "@
|
|
7
|
+
import * as i1 from "@agorapulse/ui-components/directives";
|
|
8
|
+
import * as i2 from "@angular/material/menu";
|
|
7
9
|
export class ButtonComponent {
|
|
8
|
-
constructor(
|
|
9
|
-
this.
|
|
10
|
+
constructor() {
|
|
11
|
+
this.baseButtonDirective = inject(BaseButtonDirective, { self: true });
|
|
12
|
+
this.disabled = false;
|
|
10
13
|
this.config = {
|
|
11
14
|
style: 'primary',
|
|
12
15
|
color: 'orange',
|
|
13
16
|
};
|
|
14
|
-
this.disabled = false;
|
|
15
17
|
this.loading = false;
|
|
16
18
|
this.locked = false;
|
|
17
19
|
this.menuTrigger = null;
|
|
18
20
|
this.symbolPosition = 'right';
|
|
19
|
-
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
20
|
-
this.click = new EventEmitter();
|
|
21
|
-
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
22
|
-
this.focus = new EventEmitter();
|
|
23
|
-
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
24
|
-
this.blur = new EventEmitter();
|
|
25
21
|
this.menuOpened = new EventEmitter();
|
|
26
22
|
this.menuClosed = new EventEmitter();
|
|
27
|
-
this.hostDataTest = elementRef.nativeElement.getAttribute('data-test');
|
|
28
|
-
this.hostType = elementRef.nativeElement.getAttribute('type');
|
|
29
|
-
}
|
|
30
|
-
onClickHandle($event) {
|
|
31
|
-
$event.stopImmediatePropagation();
|
|
32
|
-
this.buttonElement.nativeElement.blur();
|
|
33
|
-
this.click.emit($event);
|
|
34
|
-
this.focus.emit($event);
|
|
35
23
|
}
|
|
36
24
|
}
|
|
37
|
-
ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ButtonComponent, deps: [
|
|
38
|
-
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ButtonComponent, isStandalone: true, selector: "ap-button[name]", inputs: { ariaLabel: "ariaLabel", config: "config", disabled: "disabled", name: "name", loading: "loading", locked: "locked", menuTrigger: "menuTrigger", symbolPosition: "symbolPosition" }, outputs: { click: "click", focus: "focus", blur: "blur", menuOpened: "menuOpened", menuClosed: "menuClosed" }, providers: [], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], ngImport: i0, template: "<button\n #button\n #trigger=\"matMenuTrigger\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"hostDataTest ?? name\"\n [attr.type]=\"hostType ?? 'button'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"focus.emit($event)\"\n (blur)=\"blur.emit($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\"\n>\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div *ngIf=\"loading && !locked\" class=\"loading-bar\"></div>\n</button>\n<div *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\">\n </ap-symbol>\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-flex;position:relative}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:10px;flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:36px;min-height:36px;white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol[symbolId]", inputs: ["color", "symbolId", "size", "state"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
25
|
+
ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
+
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ButtonComponent, isStandalone: true, selector: "ap-button[name]", inputs: { ariaLabel: "ariaLabel", disabled: "disabled", name: "name", config: "config", loading: "loading", locked: "locked", menuTrigger: "menuTrigger", symbolPosition: "symbolPosition" }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed" }, providers: [], hostDirectives: [{ directive: i1.BaseButtonDirective, outputs: ["click", "click", "focus", "focus", "blur", "blur"] }], ngImport: i0, template: "<button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType ?? 'button'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"baseButtonDirective.onClickHandle($event)\"\n (focus)=\"baseButtonDirective.onFocusHandle($event)\"\n (blur)=\"baseButtonDirective.onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div *ngIf=\"loading && !locked\" class=\"loading-bar\"></div>\n</button>\n<div *ngIf=\"locked\" class=\"locked-symbol\">\n <ap-symbol symbolId=\"premium-star\" size=\"micro\"> </ap-symbol>\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-flex;position:relative}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:10px;flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:36px;min-height:36px;white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol[symbolId]", inputs: ["color", "symbolId", "size", "state"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
39
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
40
28
|
type: Component,
|
|
41
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-button[name]', standalone: true, imports: [NgIf, SymbolComponent, CommonModule, MatMenuModule], providers: [], encapsulation: ViewEncapsulation.None, template: "<button\n #button\n #trigger=\"matMenuTrigger\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"hostDataTest ?? name\"\n [attr.type]=\"hostType ?? 'button'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"focus.emit($event)\"\n (blur)=\"blur.emit($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\"\n>\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div *ngIf=\"loading && !locked\" class=\"loading-bar\"></div>\n</button>\n<div *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\">\n </ap-symbol>\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-flex;position:relative}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:10px;flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:36px;min-height:36px;white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"] }]
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
29
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-button[name]', standalone: true, imports: [NgIf, SymbolComponent, CommonModule, MatMenuModule], providers: [], encapsulation: ViewEncapsulation.None, hostDirectives: [
|
|
30
|
+
{
|
|
31
|
+
directive: BaseButtonDirective,
|
|
32
|
+
//eslint-disable-next-line
|
|
33
|
+
outputs: ['click', 'focus', 'blur'],
|
|
34
|
+
},
|
|
35
|
+
], template: "<button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType ?? 'button'\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"baseButtonDirective.onClickHandle($event)\"\n (focus)=\"baseButtonDirective.onFocusHandle($event)\"\n (blur)=\"baseButtonDirective.onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div *ngIf=\"loading && !locked\" class=\"loading-bar\"></div>\n</button>\n<div *ngIf=\"locked\" class=\"locked-symbol\">\n <ap-symbol symbolId=\"premium-star\" size=\"micro\"> </ap-symbol>\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-flex;position:relative}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:10px;flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:36px;min-height:36px;white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"] }]
|
|
36
|
+
}], propDecorators: { ariaLabel: [{
|
|
45
37
|
type: Input
|
|
46
38
|
}], disabled: [{
|
|
47
39
|
type: Input
|
|
48
40
|
}], name: [{
|
|
49
41
|
type: Input
|
|
42
|
+
}], config: [{
|
|
43
|
+
type: Input
|
|
50
44
|
}], loading: [{
|
|
51
45
|
type: Input
|
|
52
46
|
}], locked: [{
|
|
@@ -55,18 +49,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImpor
|
|
|
55
49
|
type: Input
|
|
56
50
|
}], symbolPosition: [{
|
|
57
51
|
type: Input
|
|
58
|
-
}], buttonElement: [{
|
|
59
|
-
type: ViewChild,
|
|
60
|
-
args: ['button']
|
|
61
|
-
}], click: [{
|
|
62
|
-
type: Output
|
|
63
|
-
}], focus: [{
|
|
64
|
-
type: Output
|
|
65
|
-
}], blur: [{
|
|
66
|
-
type: Output
|
|
67
52
|
}], menuOpened: [{
|
|
68
53
|
type: Output
|
|
69
54
|
}], menuClosed: [{
|
|
70
55
|
type: Output
|
|
71
56
|
}] } });
|
|
72
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
57
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9idXR0b24vc3JjL2J1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvYnV0dG9uL3NyYy9idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsWUFBWSxFQUNaLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUNOLGlCQUFpQixHQUNwQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUMsWUFBWSxFQUFFLElBQUksRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQ25ELE9BQU8sRUFBQyxlQUFlLEVBQUMsTUFBTSx1QkFBdUIsQ0FBQztBQUN0RCxPQUFPLEVBQUMsYUFBYSxFQUFlLE1BQU0sd0JBQXdCLENBQUM7QUFDbkUsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sc0NBQXNDLENBQUM7Ozs7QUEwQnpFLE1BQU0sT0FBTyxlQUFlO0lBakI1QjtRQWtCYSx3QkFBbUIsR0FBd0IsTUFBTSxDQUFDLG1CQUFtQixFQUFFLEVBQUMsSUFBSSxFQUFFLElBQUksRUFBQyxDQUFDLENBQUM7UUFHckYsYUFBUSxHQUF3QixLQUFLLENBQUM7UUFFdEMsV0FBTSxHQUFpQjtZQUM1QixLQUFLLEVBQUUsU0FBUztZQUNoQixLQUFLLEVBQUUsUUFBUTtTQUNsQixDQUFDO1FBQ08sWUFBTyxHQUF3QixLQUFLLENBQUM7UUFDckMsV0FBTSxHQUFZLEtBQUssQ0FBQztRQUN4QixnQkFBVyxHQUF3QixJQUFJLENBQUM7UUFDeEMsbUJBQWMsR0FBcUIsT0FBTyxDQUFDO1FBRTFDLGVBQVUsR0FBdUIsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUNwRCxlQUFVLEdBQXVCLElBQUksWUFBWSxFQUFFLENBQUM7S0FDakU7OzRHQWpCWSxlQUFlO2dHQUFmLGVBQWUsNlRBWGIsRUFBRSxrSkMzQmpCLGtyREFtQ0EsczJTRFRjLElBQUksNkZBQUUsZUFBZSwrR0FBRSxZQUFZLDhCQUFFLGFBQWE7MkZBWW5ELGVBQWU7a0JBakIzQixTQUFTO3NDQUNXLHVCQUF1QixDQUFDLE1BQU0sWUFDckMsaUJBQWlCLGNBRWYsSUFBSSxXQUNQLENBQUMsSUFBSSxFQUFFLGVBQWUsRUFBRSxZQUFZLEVBQUUsYUFBYSxDQUFDLGFBQ2xELEVBQUUsaUJBRUUsaUJBQWlCLENBQUMsSUFBSSxrQkFDckI7d0JBQ1o7NEJBQ0ksU0FBUyxFQUFFLG1CQUFtQjs0QkFDOUIsMEJBQTBCOzRCQUMxQixPQUFPLEVBQUUsQ0FBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sQ0FBQzt5QkFDdEM7cUJBQ0o7OEJBS1EsU0FBUztzQkFBakIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBSUcsT0FBTztzQkFBZixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTTtnQkFDRyxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDb21wb25lbnQsXG4gICAgRXZlbnRFbWl0dGVyLFxuICAgIGluamVjdCxcbiAgICBJbnB1dCxcbiAgICBPdXRwdXQsXG4gICAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtDb21tb25Nb2R1bGUsIE5nSWZ9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQge1N5bWJvbENvbXBvbmVudH0gZnJvbSAnQGFnb3JhcHVsc2UvdWktc3ltYm9sJztcbmltcG9ydCB7TWF0TWVudU1vZHVsZSwgTWF0TWVudVBhbmVsfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9tZW51JztcbmltcG9ydCB7QmFzZUJ1dHRvbkRpcmVjdGl2ZX0gZnJvbSAnQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy9kaXJlY3RpdmVzJztcblxudHlwZSBCdXR0b25Db25maWcgPVxuICAgIHwge3N0eWxlOiAncHJpbWFyeSc7IGNvbG9yOiAnb3JhbmdlJyB8ICdibHVlJ31cbiAgICB8IHtzdHlsZTogJ3NlY29uZGFyeSc7IGNvbG9yOiAnb3JhbmdlJyB8ICdibHVlJ31cbiAgICB8IHtzdHlsZTogJ3N0cm9rZWQnOyBjb2xvcjogJ2dyZXknIHwgJ2JsdWUnfVxuICAgIHwge3N0eWxlOiAnc3Ryb2tlZC10cmFuc3BhcmVudCc7IGNvbG9yOiAnZ3JleScgfCAnYmx1ZSd9XG4gICAgfCB7c3R5bGU6ICdnaG9zdCc7IGNvbG9yOiAnZ3JleScgfCAnYmx1ZScgfCAncmVkJ307XG5cbkBDb21wb25lbnQoe1xuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHNlbGVjdG9yOiAnYXAtYnV0dG9uW25hbWVdJyxcbiAgICBzdHlsZVVybHM6IFsnLi9idXR0b24uY29tcG9uZW50LnNjc3MnXSxcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIGltcG9ydHM6IFtOZ0lmLCBTeW1ib2xDb21wb25lbnQsIENvbW1vbk1vZHVsZSwgTWF0TWVudU1vZHVsZV0sXG4gICAgcHJvdmlkZXJzOiBbXSxcbiAgICB0ZW1wbGF0ZVVybDogJy4vYnV0dG9uLmNvbXBvbmVudC5odG1sJyxcbiAgICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICAgIGhvc3REaXJlY3RpdmVzOiBbXG4gICAgICAgIHtcbiAgICAgICAgICAgIGRpcmVjdGl2ZTogQmFzZUJ1dHRvbkRpcmVjdGl2ZSxcbiAgICAgICAgICAgIC8vZXNsaW50LWRpc2FibGUtbmV4dC1saW5lXG4gICAgICAgICAgICBvdXRwdXRzOiBbJ2NsaWNrJywgJ2ZvY3VzJywgJ2JsdXInXSxcbiAgICAgICAgfSxcbiAgICBdLFxufSlcbmV4cG9ydCBjbGFzcyBCdXR0b25Db21wb25lbnQge1xuICAgIHJlYWRvbmx5IGJhc2VCdXR0b25EaXJlY3RpdmU6IEJhc2VCdXR0b25EaXJlY3RpdmUgPSBpbmplY3QoQmFzZUJ1dHRvbkRpcmVjdGl2ZSwge3NlbGY6IHRydWV9KTtcblxuICAgIEBJbnB1dCgpIGFyaWFMYWJlbDogc3RyaW5nO1xuICAgIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuIHwgdW5kZWZpbmVkID0gZmFsc2U7XG4gICAgQElucHV0KCkgbmFtZTogc3RyaW5nO1xuICAgIEBJbnB1dCgpIGNvbmZpZzogQnV0dG9uQ29uZmlnID0ge1xuICAgICAgICBzdHlsZTogJ3ByaW1hcnknLFxuICAgICAgICBjb2xvcjogJ29yYW5nZScsXG4gICAgfTtcbiAgICBASW5wdXQoKSBsb2FkaW5nOiBib29sZWFuIHwgdW5kZWZpbmVkID0gZmFsc2U7XG4gICAgQElucHV0KCkgbG9ja2VkOiBib29sZWFuID0gZmFsc2U7XG4gICAgQElucHV0KCkgbWVudVRyaWdnZXI6IE1hdE1lbnVQYW5lbCB8IG51bGwgPSBudWxsO1xuICAgIEBJbnB1dCgpIHN5bWJvbFBvc2l0aW9uOiAnbGVmdCcgfCAncmlnaHQnID0gJ3JpZ2h0JztcblxuICAgIEBPdXRwdXQoKSBtZW51T3BlbmVkOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gICAgQE91dHB1dCgpIG1lbnVDbG9zZWQ6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbn1cbiIsIjxidXR0b25cbiAgICAjdHJpZ2dlcj1cIm1hdE1lbnVUcmlnZ2VyXCJcbiAgICByb2xlPVwiYnV0dG9uXCJcbiAgICBbbWF0TWVudVRyaWdnZXJGb3JdPVwibWVudVRyaWdnZXJcIlxuICAgIFtjbGFzcy5wcmltYXJ5XT1cImNvbmZpZy5zdHlsZSA9PT0gJ3ByaW1hcnknICYmICFsb2NrZWRcIlxuICAgIFtjbGFzcy5zZWNvbmRhcnldPVwiY29uZmlnLnN0eWxlID09PSAnc2Vjb25kYXJ5JyAmJiAhbG9ja2VkXCJcbiAgICBbY2xhc3MuZ2hvc3RdPVwiY29uZmlnLnN0eWxlID09PSAnZ2hvc3QnICYmICFsb2NrZWRcIlxuICAgIFtjbGFzcy5zdHJva2VkXT1cIihjb25maWcuc3R5bGUgPT09ICdzdHJva2VkJyB8fCBjb25maWcuc3R5bGUgPT09ICdzdHJva2VkLXRyYW5zcGFyZW50JykgJiYgIWxvY2tlZFwiXG4gICAgW2NsYXNzLnRyYW5zcGFyZW50XT1cImNvbmZpZy5zdHlsZSA9PT0gJ3N0cm9rZWQtdHJhbnNwYXJlbnQnICYmICFsb2NrZWRcIlxuICAgIFtjbGFzcy5vcmFuZ2VdPVwiY29uZmlnLmNvbG9yID09PSAnb3JhbmdlJyAmJiAhbG9ja2VkXCJcbiAgICBbY2xhc3MuYmx1ZV09XCJjb25maWcuY29sb3IgPT09ICdibHVlJyAmJiAhbG9ja2VkXCJcbiAgICBbY2xhc3MucmVkXT1cImNvbmZpZy5jb2xvciA9PT0gJ3JlZCcgJiYgIWxvY2tlZFwiXG4gICAgW2NsYXNzLmdyZXldPVwiY29uZmlnLmNvbG9yID09PSAnZ3JleScgJiYgIWxvY2tlZFwiXG4gICAgW2NsYXNzLmxvYWRpbmddPVwibG9hZGluZyAmJiAhbG9ja2VkXCJcbiAgICBbY2xhc3MubG9ja2VkXT1cImxvY2tlZFwiXG4gICAgW2NsYXNzLmludmVyc2VdPVwic3ltYm9sUG9zaXRpb24gPT09ICdsZWZ0J1wiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkICYmICFsb2NrZWRcIlxuICAgIFtuYW1lXT1cIm5hbWVcIlxuICAgIFthdHRyLmRhdGEtdGVzdF09XCJiYXNlQnV0dG9uRGlyZWN0aXZlLmhvc3REYXRhVGVzdCA/PyBuYW1lXCJcbiAgICBbYXR0ci5pZF09XCJiYXNlQnV0dG9uRGlyZWN0aXZlLmhvc3RJZFwiXG4gICAgW2F0dHIudHlwZV09XCJiYXNlQnV0dG9uRGlyZWN0aXZlLmhvc3RUeXBlID8/ICdidXR0b24nXCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImFyaWFMYWJlbCB8fCBudWxsXCJcbiAgICBbYXR0ci5hcmlhLWRpc2FibGVkXT1cImRpc2FibGVkPy50b1N0cmluZygpXCJcbiAgICAoY2xpY2spPVwiYmFzZUJ1dHRvbkRpcmVjdGl2ZS5vbkNsaWNrSGFuZGxlKCRldmVudClcIlxuICAgIChmb2N1cyk9XCJiYXNlQnV0dG9uRGlyZWN0aXZlLm9uRm9jdXNIYW5kbGUoJGV2ZW50KVwiXG4gICAgKGJsdXIpPVwiYmFzZUJ1dHRvbkRpcmVjdGl2ZS5vbkJsdXJIYW5kbGUoJGV2ZW50KVwiXG4gICAgKG1lbnVPcGVuZWQpPVwibWVudU9wZW5lZC5lbWl0KClcIlxuICAgIChtZW51Q2xvc2VkKT1cIm1lbnVDbG9zZWQuZW1pdCgpXCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImFwLXN5bWJvbFwiPjwvbmctY29udGVudD5cbiAgICA8ZGl2ICpuZ0lmPVwibG9hZGluZyAmJiAhbG9ja2VkXCIgY2xhc3M9XCJsb2FkaW5nLWJhclwiPjwvZGl2PlxuPC9idXR0b24+XG48ZGl2ICpuZ0lmPVwibG9ja2VkXCIgY2xhc3M9XCJsb2NrZWQtc3ltYm9sXCI+XG4gICAgPGFwLXN5bWJvbCBzeW1ib2xJZD1cInByZW1pdW0tc3RhclwiIHNpemU9XCJtaWNyb1wiPiA8L2FwLXN5bWJvbD5cbjwvZGl2PlxuIl19
|
|
@@ -40,7 +40,7 @@ export class ConfirmModalComponent {
|
|
|
40
40
|
}
|
|
41
41
|
}
|
|
42
42
|
ConfirmModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ConfirmModalComponent, deps: [{ token: i1.MatLegacyDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
43
|
-
ConfirmModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ConfirmModalComponent, isStandalone: true, selector: "ap-confirm-modal", inputs: { contentText: "contentText", footerCancelButtonId: "footerCancelButtonId", footerCancelButtonLabel: "footerCancelButtonLabel", footerConfirmButtonId: "footerConfirmButtonId", footerConfirmButtonLabel: "footerConfirmButtonLabel", headerTitle: "headerTitle" }, ngImport: i0, template: "<ng-template #headerTemplate>\n <h2>{{headerTitle}}</h2>\n</ng-template>\n\n<ng-template #mainTemplate>\n <p>{{contentText}}</p>\n</ng-template>\n\n<ng-template #footerTemplate>\n <ap-button\n name=\"confirm-modal-cancel-button\"\n [config]=\"{\n style: 'ghost',\n color: 'grey'\n }\"\n (click)=\"onCancel()\" [id]=\"footerCancelButtonId\">\n <span>\n {{ footerCancelButtonLabel }}\n </span>\n </ap-button>\n <ap-button\n name=\"confirm-modal-confirm-button\"\n [config]=\"{\n style: 'primary',\n color: 'orange'\n }\"\n cdkFocusInitial [id]=footerConfirmButtonId\n (click)=\"onConfirm()\">\n <span>\n {{ footerConfirmButtonLabel }}\n </span>\n </ap-button>\n</ng-template>\n\n<ap-modal [closable]=\"true\"\n [headerTemplate]=\"headerTemplate\"\n [mainTemplate]=\"mainTemplate\"\n [footerTemplate]=\"footerTemplate\"\n></ap-modal>\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "ap-button[name]", inputs: ["ariaLabel", "
|
|
43
|
+
ConfirmModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ConfirmModalComponent, isStandalone: true, selector: "ap-confirm-modal", inputs: { contentText: "contentText", footerCancelButtonId: "footerCancelButtonId", footerCancelButtonLabel: "footerCancelButtonLabel", footerConfirmButtonId: "footerConfirmButtonId", footerConfirmButtonLabel: "footerConfirmButtonLabel", headerTitle: "headerTitle" }, ngImport: i0, template: "<ng-template #headerTemplate>\n <h2>{{headerTitle}}</h2>\n</ng-template>\n\n<ng-template #mainTemplate>\n <p>{{contentText}}</p>\n</ng-template>\n\n<ng-template #footerTemplate>\n <ap-button\n name=\"confirm-modal-cancel-button\"\n [config]=\"{\n style: 'ghost',\n color: 'grey'\n }\"\n (click)=\"onCancel()\" [id]=\"footerCancelButtonId\">\n <span>\n {{ footerCancelButtonLabel }}\n </span>\n </ap-button>\n <ap-button\n name=\"confirm-modal-confirm-button\"\n [config]=\"{\n style: 'primary',\n color: 'orange'\n }\"\n cdkFocusInitial [id]=footerConfirmButtonId\n (click)=\"onConfirm()\">\n <span>\n {{ footerConfirmButtonLabel }}\n </span>\n </ap-button>\n</ng-template>\n\n<ap-modal [closable]=\"true\"\n [headerTemplate]=\"headerTemplate\"\n [mainTemplate]=\"mainTemplate\"\n [footerTemplate]=\"footerTemplate\"\n></ap-modal>\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "ap-button[name]", inputs: ["ariaLabel", "disabled", "name", "config", "loading", "locked", "menuTrigger", "symbolPosition"], outputs: ["menuOpened", "menuClosed"] }, { kind: "component", type: ModalComponent, selector: "ap-modal", inputs: ["closable", "headerBottomBorderEnabled", "footerTemplate", "footerVisible", "headerTemplate", "headerVisible", "mainTemplate", "config", "sidePaneTemplate", "sidePaneStyle", "containerStyle", "headerStyle", "contentStyle", "footerStyle", "defaultLayout"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
44
44
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ConfirmModalComponent, decorators: [{
|
|
45
45
|
type: Component,
|
|
46
46
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-confirm-modal', imports: [ButtonComponent, ModalComponent], standalone: true, template: "<ng-template #headerTemplate>\n <h2>{{headerTitle}}</h2>\n</ng-template>\n\n<ng-template #mainTemplate>\n <p>{{contentText}}</p>\n</ng-template>\n\n<ng-template #footerTemplate>\n <ap-button\n name=\"confirm-modal-cancel-button\"\n [config]=\"{\n style: 'ghost',\n color: 'grey'\n }\"\n (click)=\"onCancel()\" [id]=\"footerCancelButtonId\">\n <span>\n {{ footerCancelButtonLabel }}\n </span>\n </ap-button>\n <ap-button\n name=\"confirm-modal-confirm-button\"\n [config]=\"{\n style: 'primary',\n color: 'orange'\n }\"\n cdkFocusInitial [id]=footerConfirmButtonId\n (click)=\"onConfirm()\">\n <span>\n {{ footerConfirmButtonLabel }}\n </span>\n </ap-button>\n</ng-template>\n\n<ap-modal [closable]=\"true\"\n [headerTemplate]=\"headerTemplate\"\n [mainTemplate]=\"mainTemplate\"\n [footerTemplate]=\"footerTemplate\"\n></ap-modal>\n" }]
|
|
@@ -57,4 +57,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImpor
|
|
|
57
57
|
}], headerTitle: [{
|
|
58
58
|
type: Input
|
|
59
59
|
}] } });
|
|
60
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
60
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29uZmlybS1tb2RhbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvY29uZmlybS1tb2RhbC9zcmMvY29uZmlybS1tb2RhbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvY29uZmlybS1tb2RhbC9zcmMvY29uZmlybS1tb2RhbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsY0FBYyxFQUFjLE1BQU0saUNBQWlDLENBQUM7QUFFNUUsT0FBTyxFQUFDLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFHeEUsT0FBTyxFQUFDLGVBQWUsRUFBQyxNQUFNLGtDQUFrQyxDQUFDOzs7QUFTakUsTUFBTSxPQUFPLHFCQUFxQjtJQVE5QixZQUFtQixTQUEyQztRQUEzQyxjQUFTLEdBQVQsU0FBUyxDQUFrQztRQVByRCxnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQUN6Qix5QkFBb0IsR0FBVyxRQUFRLENBQUM7UUFDeEMsNEJBQXVCLEdBQVcsRUFBRSxDQUFDO1FBQ3JDLDBCQUFxQixHQUFXLFNBQVMsQ0FBQztRQUMxQyw2QkFBd0IsR0FBVyxFQUFFLENBQUM7UUFDdEMsZ0JBQVcsR0FBVyxFQUFFLENBQUM7UUFHOUIsU0FBUyxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUM7SUFDbEMsQ0FBQztJQUVELFFBQVE7UUFDSixJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNoQyxDQUFDO0lBRUQsU0FBUztRQUNMLElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQy9CLENBQUM7SUFFRCxNQUFNLENBQUMsSUFBSSxDQUFDLE1BQWlCLEVBQUUsaUJBQW9DLEVBQUUsY0FBMkIsSUFBSTtRQUNoRyxJQUFJLENBQUMsV0FBVyxFQUFFO1lBQ2QsV0FBVyxHQUFHLEVBQUUsQ0FBQztTQUNwQjtRQUNELElBQUksQ0FBQyxXQUFXLENBQUMsZUFBZSxFQUFFO1lBQzlCLFdBQVcsQ0FBQyxlQUFlLEdBQUc7Z0JBQzFCLEtBQUssRUFBRSxPQUFPO2FBQ2pCLENBQUM7U0FDTDtRQUNELE1BQU0sWUFBWSxHQUFHLGNBQWMsQ0FBQyxpQkFBaUIsQ0FBQyxNQUFNLEVBQUUsV0FBVyxFQUFFLHFCQUFxQixDQUFDLENBQUM7UUFDbEcsWUFBWSxDQUFDLGlCQUFpQixDQUFDLFdBQVcsR0FBRyxpQkFBaUIsQ0FBQyxXQUFXLENBQUM7UUFDM0UsWUFBWSxDQUFDLGlCQUFpQixDQUFDLHFCQUFxQixHQUFHLGlCQUFpQixDQUFDLHFCQUFxQixDQUFDO1FBQy9GLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyx3QkFBd0IsR0FBRyxpQkFBaUIsQ0FBQyx3QkFBd0IsQ0FBQztRQUNyRyxZQUFZLENBQUMsaUJBQWlCLENBQUMsb0JBQW9CLEdBQUcsaUJBQWlCLENBQUMsb0JBQW9CLENBQUM7UUFDN0YsWUFBWSxDQUFDLGlCQUFpQixDQUFDLHVCQUF1QixHQUFHLGlCQUFpQixDQUFDLHVCQUF1QixDQUFDO1FBQ25HLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyxXQUFXLEdBQUcsaUJBQWlCLENBQUMsV0FBVyxDQUFDO1FBQzNFLE9BQU8sWUFBWSxDQUFDO0lBQ3hCLENBQUM7O2tIQXJDUSxxQkFBcUI7c0dBQXJCLHFCQUFxQix3VkNkbEMsNGdDQXVDQSw0Q0Q1QmMsZUFBZSw4TUFBRSxjQUFjOzJGQUdoQyxxQkFBcUI7a0JBUGpDLFNBQVM7c0NBQ1csdUJBQXVCLENBQUMsTUFBTSxZQUNyQyxrQkFBa0IsV0FFbkIsQ0FBQyxlQUFlLEVBQUUsY0FBYyxDQUFDLGNBQzlCLElBQUk7eUdBR1AsV0FBVztzQkFBbkIsS0FBSztnQkFDRyxvQkFBb0I7c0JBQTVCLEtBQUs7Z0JBQ0csdUJBQXVCO3NCQUEvQixLQUFLO2dCQUNHLHFCQUFxQjtzQkFBN0IsS0FBSztnQkFDRyx3QkFBd0I7c0JBQWhDLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7TW9kYWxDb21wb25lbnQsIE1vZGFsQ29uZmlnfSBmcm9tICdAYWdvcmFwdWxzZS91aS1jb21wb25lbnRzL21vZGFsJztcbmltcG9ydCB7Q29tcG9uZW50VHlwZX0gZnJvbSAnQGFuZ3VsYXIvY2RrL3BvcnRhbCc7XG5pbXBvcnQge0NoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7TWF0TGVnYWN5RGlhbG9nIGFzIE1hdERpYWxvZywgTWF0TGVnYWN5RGlhbG9nUmVmIGFzIE1hdERpYWxvZ1JlZn0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvbGVnYWN5LWRpYWxvZyc7XG5pbXBvcnQge0NvbmZpcm1Nb2RhbFRleHRzfSBmcm9tICcuL2NvbmZpcm0tbW9kYWwtdGV4dHMubW9kZWwnO1xuaW1wb3J0IHtCdXR0b25Db21wb25lbnR9IGZyb20gXCJAYWdvcmFwdWxzZS91aS1jb21wb25lbnRzL2J1dHRvblwiO1xuXG5AQ29tcG9uZW50KHtcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgICBzZWxlY3RvcjogJ2FwLWNvbmZpcm0tbW9kYWwnLFxuICAgIHRlbXBsYXRlVXJsOiAnY29uZmlybS1tb2RhbC5jb21wb25lbnQuaHRtbCcsXG4gICAgaW1wb3J0czogW0J1dHRvbkNvbXBvbmVudCwgTW9kYWxDb21wb25lbnRdLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIENvbmZpcm1Nb2RhbENvbXBvbmVudCB7XG4gICAgQElucHV0KCkgY29udGVudFRleHQ6IHN0cmluZyA9ICcnO1xuICAgIEBJbnB1dCgpIGZvb3RlckNhbmNlbEJ1dHRvbklkOiBzdHJpbmcgPSAnY2FuY2VsJztcbiAgICBASW5wdXQoKSBmb290ZXJDYW5jZWxCdXR0b25MYWJlbDogc3RyaW5nID0gJyc7XG4gICAgQElucHV0KCkgZm9vdGVyQ29uZmlybUJ1dHRvbklkOiBzdHJpbmcgPSAnY29uZmlybSc7XG4gICAgQElucHV0KCkgZm9vdGVyQ29uZmlybUJ1dHRvbkxhYmVsOiBzdHJpbmcgPSAnJztcbiAgICBASW5wdXQoKSBoZWFkZXJUaXRsZTogc3RyaW5nID0gJyc7XG5cbiAgICBjb25zdHJ1Y3RvcihwdWJsaWMgZGlhbG9nUmVmOiBNYXREaWFsb2dSZWY8Q29tcG9uZW50VHlwZTxhbnk+Pikge1xuICAgICAgICBkaWFsb2dSZWYuZGlzYWJsZUNsb3NlID0gdHJ1ZTtcbiAgICB9XG5cbiAgICBvbkNhbmNlbCgpIHtcbiAgICAgICAgdGhpcy5kaWFsb2dSZWYuY2xvc2UoZmFsc2UpO1xuICAgIH1cblxuICAgIG9uQ29uZmlybSgpIHtcbiAgICAgICAgdGhpcy5kaWFsb2dSZWYuY2xvc2UodHJ1ZSk7XG4gICAgfVxuXG4gICAgc3RhdGljIG9wZW4oZGlhbG9nOiBNYXREaWFsb2csIGNvbmZpcm1Nb2RhbFRleHRzOiBDb25maXJtTW9kYWxUZXh0cywgbW9kYWxDb25maWc6IE1vZGFsQ29uZmlnID0gbnVsbCkge1xuICAgICAgICBpZiAoIW1vZGFsQ29uZmlnKSB7XG4gICAgICAgICAgICBtb2RhbENvbmZpZyA9IHt9O1xuICAgICAgICB9XG4gICAgICAgIGlmICghbW9kYWxDb25maWcubWF0RGlhbG9nQ29uZmlnKSB7XG4gICAgICAgICAgICBtb2RhbENvbmZpZy5tYXREaWFsb2dDb25maWcgPSB7XG4gICAgICAgICAgICAgICAgd2lkdGg6ICc1NTBweCcsXG4gICAgICAgICAgICB9O1xuICAgICAgICB9XG4gICAgICAgIGNvbnN0IGNvbmZpcm1Nb2RhbCA9IE1vZGFsQ29tcG9uZW50Lm9wZW5XaXRoQ29tcG9uZW50KGRpYWxvZywgbW9kYWxDb25maWcsIENvbmZpcm1Nb2RhbENvbXBvbmVudCk7XG4gICAgICAgIGNvbmZpcm1Nb2RhbC5jb21wb25lbnRJbnN0YW5jZS5jb250ZW50VGV4dCA9IGNvbmZpcm1Nb2RhbFRleHRzLmNvbnRlbnRUZXh0O1xuICAgICAgICBjb25maXJtTW9kYWwuY29tcG9uZW50SW5zdGFuY2UuZm9vdGVyQ29uZmlybUJ1dHRvbklkID0gY29uZmlybU1vZGFsVGV4dHMuZm9vdGVyQ29uZmlybUJ1dHRvbklkO1xuICAgICAgICBjb25maXJtTW9kYWwuY29tcG9uZW50SW5zdGFuY2UuZm9vdGVyQ29uZmlybUJ1dHRvbkxhYmVsID0gY29uZmlybU1vZGFsVGV4dHMuZm9vdGVyQ29uZmlybUJ1dHRvbkxhYmVsO1xuICAgICAgICBjb25maXJtTW9kYWwuY29tcG9uZW50SW5zdGFuY2UuZm9vdGVyQ2FuY2VsQnV0dG9uSWQgPSBjb25maXJtTW9kYWxUZXh0cy5mb290ZXJDYW5jZWxCdXR0b25JZDtcbiAgICAgICAgY29uZmlybU1vZGFsLmNvbXBvbmVudEluc3RhbmNlLmZvb3RlckNhbmNlbEJ1dHRvbkxhYmVsID0gY29uZmlybU1vZGFsVGV4dHMuZm9vdGVyQ2FuY2VsQnV0dG9uTGFiZWw7XG4gICAgICAgIGNvbmZpcm1Nb2RhbC5jb21wb25lbnRJbnN0YW5jZS5oZWFkZXJUaXRsZSA9IGNvbmZpcm1Nb2RhbFRleHRzLmhlYWRlclRpdGxlO1xuICAgICAgICByZXR1cm4gY29uZmlybU1vZGFsO1xuICAgIH1cbn1cbiIsIjxuZy10ZW1wbGF0ZSAjaGVhZGVyVGVtcGxhdGU+XG4gICAgPGgyPnt7aGVhZGVyVGl0bGV9fTwvaDI+XG48L25nLXRlbXBsYXRlPlxuXG48bmctdGVtcGxhdGUgI21haW5UZW1wbGF0ZT5cbiAgICA8cD57e2NvbnRlbnRUZXh0fX08L3A+XG48L25nLXRlbXBsYXRlPlxuXG48bmctdGVtcGxhdGUgI2Zvb3RlclRlbXBsYXRlPlxuICAgIDxhcC1idXR0b25cbiAgICAgICAgbmFtZT1cImNvbmZpcm0tbW9kYWwtY2FuY2VsLWJ1dHRvblwiXG4gICAgICAgIFtjb25maWddPVwie1xuICAgICAgICAgICAgc3R5bGU6ICdnaG9zdCcsXG4gICAgICAgICAgICBjb2xvcjogJ2dyZXknXG4gICAgICAgIH1cIlxuICAgICAgICAoY2xpY2spPVwib25DYW5jZWwoKVwiIFtpZF09XCJmb290ZXJDYW5jZWxCdXR0b25JZFwiPlxuICAgICAgICA8c3Bhbj5cbiAgICAgICAgICAgIHt7IGZvb3RlckNhbmNlbEJ1dHRvbkxhYmVsIH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICA8L2FwLWJ1dHRvbj5cbiAgICA8YXAtYnV0dG9uXG4gICAgICAgIG5hbWU9XCJjb25maXJtLW1vZGFsLWNvbmZpcm0tYnV0dG9uXCJcbiAgICAgICAgW2NvbmZpZ109XCJ7XG4gICAgICAgICAgICBzdHlsZTogJ3ByaW1hcnknLFxuICAgICAgICAgICAgY29sb3I6ICdvcmFuZ2UnXG4gICAgICAgIH1cIlxuICAgICAgICBjZGtGb2N1c0luaXRpYWwgW2lkXT1mb290ZXJDb25maXJtQnV0dG9uSWRcbiAgICAgICAgKGNsaWNrKT1cIm9uQ29uZmlybSgpXCI+XG4gICAgICAgIDxzcGFuPlxuICAgICAgICAgICAge3sgZm9vdGVyQ29uZmlybUJ1dHRvbkxhYmVsIH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICA8L2FwLWJ1dHRvbj5cbjwvbmctdGVtcGxhdGU+XG5cbjxhcC1tb2RhbCBbY2xvc2FibGVdPVwidHJ1ZVwiXG4gICAgICAgICAgW2hlYWRlclRlbXBsYXRlXT1cImhlYWRlclRlbXBsYXRlXCJcbiAgICAgICAgICBbbWFpblRlbXBsYXRlXT1cIm1haW5UZW1wbGF0ZVwiXG4gICAgICAgICAgW2Zvb3RlclRlbXBsYXRlXT1cImZvb3RlclRlbXBsYXRlXCJcbj48L2FwLW1vZGFsPlxuIl19
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { ChangeDetectorRef, Directive, ElementRef, EventEmitter, HostListener, inject, Output, } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class BaseButtonDirective {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.elementRef = inject(ElementRef);
|
|
6
|
+
this.changeDetectorRef = inject(ChangeDetectorRef);
|
|
7
|
+
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
8
|
+
this.click = new EventEmitter();
|
|
9
|
+
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
10
|
+
this.focus = new EventEmitter();
|
|
11
|
+
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
12
|
+
this.blur = new EventEmitter();
|
|
13
|
+
this.hostType = 'button';
|
|
14
|
+
this.focused = false;
|
|
15
|
+
this.hostDataTest = this.elementRef.nativeElement.getAttribute('data-test');
|
|
16
|
+
this.hostId = this.elementRef.nativeElement.getAttribute('id');
|
|
17
|
+
this.elementRef.nativeElement.removeAttribute('data-test');
|
|
18
|
+
this.elementRef.nativeElement.removeAttribute('id');
|
|
19
|
+
}
|
|
20
|
+
// Sometimes attributes like the id, or the data-test are dynamic and can change between the constructor and the initialization.
|
|
21
|
+
// In order to have the last attributes value we check if it changes, and if it does, we run a mark for check to update the view.
|
|
22
|
+
ngAfterViewInit() {
|
|
23
|
+
const hostDataTest = this.elementRef.nativeElement.getAttribute('data-test');
|
|
24
|
+
const hostId = this.elementRef.nativeElement.getAttribute('id');
|
|
25
|
+
if (hostDataTest && this.hostDataTest !== hostDataTest) {
|
|
26
|
+
this.hostDataTest = hostDataTest;
|
|
27
|
+
this.elementRef.nativeElement.removeAttribute('data-test');
|
|
28
|
+
this.changeDetectorRef.markForCheck();
|
|
29
|
+
}
|
|
30
|
+
if (hostId && this.hostId !== hostId) {
|
|
31
|
+
this.hostId = hostId;
|
|
32
|
+
this.elementRef.nativeElement.removeAttribute('id');
|
|
33
|
+
this.changeDetectorRef.markForCheck();
|
|
34
|
+
}
|
|
35
|
+
this.buttonElement = this.elementRef.nativeElement.children[0];
|
|
36
|
+
}
|
|
37
|
+
onClickHandle($event) {
|
|
38
|
+
$event.stopImmediatePropagation();
|
|
39
|
+
this.buttonElement.blur();
|
|
40
|
+
this.click.emit($event);
|
|
41
|
+
this.focus.emit($event);
|
|
42
|
+
}
|
|
43
|
+
onBlurHandle($event) {
|
|
44
|
+
this.focused = false;
|
|
45
|
+
this.blur.emit($event);
|
|
46
|
+
}
|
|
47
|
+
onFocusHandle($event) {
|
|
48
|
+
this.focused = true;
|
|
49
|
+
this.focus.emit($event);
|
|
50
|
+
}
|
|
51
|
+
onSpaceKeyUp(event) {
|
|
52
|
+
if (this.focused) {
|
|
53
|
+
event.preventDefault();
|
|
54
|
+
this.buttonElement.click();
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
BaseButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: BaseButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
59
|
+
BaseButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: BaseButtonDirective, isStandalone: true, selector: "[apBaseButton]", outputs: { click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" } }, ngImport: i0 });
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: BaseButtonDirective, decorators: [{
|
|
61
|
+
type: Directive,
|
|
62
|
+
args: [{
|
|
63
|
+
selector: '[apBaseButton]',
|
|
64
|
+
standalone: true,
|
|
65
|
+
}]
|
|
66
|
+
}], ctorParameters: function () { return []; }, propDecorators: { click: [{
|
|
67
|
+
type: Output
|
|
68
|
+
}], focus: [{
|
|
69
|
+
type: Output
|
|
70
|
+
}], blur: [{
|
|
71
|
+
type: Output
|
|
72
|
+
}], onSpaceKeyUp: [{
|
|
73
|
+
type: HostListener,
|
|
74
|
+
args: ['window:keyup.space', ['$event']]
|
|
75
|
+
}] } });
|
|
76
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFzZS1idXR0b24uZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vbGlicy91aS1jb21wb25lbnRzL2RpcmVjdGl2ZXMvc3JjL2Jhc2UtYnV0dG9uLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBRUgsaUJBQWlCLEVBQ2pCLFNBQVMsRUFDVCxVQUFVLEVBQ1YsWUFBWSxFQUNaLFlBQVksRUFDWixNQUFNLEVBQ04sTUFBTSxHQUNULE1BQU0sZUFBZSxDQUFDOztBQU12QixNQUFNLE9BQU8sbUJBQW1CO0lBaUI1QjtRQWhCUSxlQUFVLEdBQWUsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQzVDLHNCQUFpQixHQUFzQixNQUFNLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUl6RSw0REFBNEQ7UUFDbEQsVUFBSyxHQUE2QixJQUFJLFlBQVksRUFBRSxDQUFDO1FBQy9ELDREQUE0RDtRQUNsRCxVQUFLLEdBQTZCLElBQUksWUFBWSxFQUFFLENBQUM7UUFDL0QsNERBQTREO1FBQ2xELFNBQUksR0FBNkIsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUk5RCxhQUFRLEdBQVcsUUFBUSxDQUFDO1FBQzVCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFFckIsSUFBSSxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDNUUsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDL0QsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsZUFBZSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQzNELElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUN4RCxDQUFDO0lBRUQsZ0lBQWdJO0lBQ2hJLGlJQUFpSTtJQUNqSSxlQUFlO1FBQ1gsTUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQzdFLE1BQU0sTUFBTSxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUNoRSxJQUFJLFlBQVksSUFBSSxJQUFJLENBQUMsWUFBWSxLQUFLLFlBQVksRUFBRTtZQUNwRCxJQUFJLENBQUMsWUFBWSxHQUFHLFlBQVksQ0FBQztZQUNqQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxlQUFlLENBQUMsV0FBVyxDQUFDLENBQUM7WUFDM0QsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFlBQVksRUFBRSxDQUFDO1NBQ3pDO1FBQ0QsSUFBSSxNQUFNLElBQUksSUFBSSxDQUFDLE1BQU0sS0FBSyxNQUFNLEVBQUU7WUFDbEMsSUFBSSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7WUFDckIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQ3BELElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxZQUFZLEVBQUUsQ0FBQztTQUN6QztRQUNELElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ25FLENBQUM7SUFFRCxhQUFhLENBQUMsTUFBa0I7UUFDNUIsTUFBTSxDQUFDLHdCQUF3QixFQUFFLENBQUM7UUFDbEMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUMxQixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUN4QixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUM1QixDQUFDO0lBRUQsWUFBWSxDQUFDLE1BQWtCO1FBQzNCLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDO1FBQ3JCLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQzNCLENBQUM7SUFFRCxhQUFhLENBQUMsTUFBa0I7UUFDNUIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFDcEIsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDNUIsQ0FBQztJQUdELFlBQVksQ0FBQyxLQUFvQjtRQUM3QixJQUFJLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDZCxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDdkIsSUFBSSxDQUFDLGFBQWEsQ0FBQyxLQUFLLEVBQUUsQ0FBQztTQUM5QjtJQUNMLENBQUM7O2dIQWpFUSxtQkFBbUI7b0dBQW5CLG1CQUFtQjsyRkFBbkIsbUJBQW1CO2tCQUovQixTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSxnQkFBZ0I7b0JBQzFCLFVBQVUsRUFBRSxJQUFJO2lCQUNuQjswRUFRYSxLQUFLO3NCQUFkLE1BQU07Z0JBRUcsS0FBSztzQkFBZCxNQUFNO2dCQUVHLElBQUk7c0JBQWIsTUFBTTtnQkFpRFAsWUFBWTtzQkFEWCxZQUFZO3VCQUFDLG9CQUFvQixFQUFFLENBQUMsUUFBUSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBBZnRlclZpZXdJbml0LFxuICAgIENoYW5nZURldGVjdG9yUmVmLFxuICAgIERpcmVjdGl2ZSxcbiAgICBFbGVtZW50UmVmLFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBIb3N0TGlzdGVuZXIsXG4gICAgaW5qZWN0LFxuICAgIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBEaXJlY3RpdmUoe1xuICAgIHNlbGVjdG9yOiAnW2FwQmFzZUJ1dHRvbl0nLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIEJhc2VCdXR0b25EaXJlY3RpdmUgaW1wbGVtZW50cyBBZnRlclZpZXdJbml0IHtcbiAgICBwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYgPSBpbmplY3QoRWxlbWVudFJlZik7XG4gICAgcHJpdmF0ZSBjaGFuZ2VEZXRlY3RvclJlZjogQ2hhbmdlRGV0ZWN0b3JSZWYgPSBpbmplY3QoQ2hhbmdlRGV0ZWN0b3JSZWYpO1xuXG4gICAgYnV0dG9uRWxlbWVudDogSFRNTEJ1dHRvbkVsZW1lbnQ7XG5cbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L25vLW91dHB1dC1uYXRpdmVcbiAgICBAT3V0cHV0KCkgY2xpY2s6IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L25vLW91dHB1dC1uYXRpdmVcbiAgICBAT3V0cHV0KCkgZm9jdXM6IEV2ZW50RW1pdHRlcjxGb2N1c0V2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L25vLW91dHB1dC1uYXRpdmVcbiAgICBAT3V0cHV0KCkgYmx1cjogRXZlbnRFbWl0dGVyPEZvY3VzRXZlbnQ+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gICAgaG9zdElkOiBzdHJpbmc7XG4gICAgaG9zdERhdGFUZXN0OiBzdHJpbmc7XG4gICAgaG9zdFR5cGU6IHN0cmluZyA9ICdidXR0b24nO1xuICAgIGZvY3VzZWQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgICBjb25zdHJ1Y3RvcigpIHtcbiAgICAgICAgdGhpcy5ob3N0RGF0YVRlc3QgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5nZXRBdHRyaWJ1dGUoJ2RhdGEtdGVzdCcpO1xuICAgICAgICB0aGlzLmhvc3RJZCA9IHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LmdldEF0dHJpYnV0ZSgnaWQnKTtcbiAgICAgICAgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQXR0cmlidXRlKCdkYXRhLXRlc3QnKTtcbiAgICAgICAgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQXR0cmlidXRlKCdpZCcpO1xuICAgIH1cblxuICAgIC8vIFNvbWV0aW1lcyBhdHRyaWJ1dGVzIGxpa2UgdGhlIGlkLCBvciB0aGUgZGF0YS10ZXN0IGFyZSBkeW5hbWljIGFuZCBjYW4gY2hhbmdlIGJldHdlZW4gdGhlIGNvbnN0cnVjdG9yIGFuZCB0aGUgaW5pdGlhbGl6YXRpb24uXG4gICAgLy8gSW4gb3JkZXIgdG8gaGF2ZSB0aGUgbGFzdCBhdHRyaWJ1dGVzIHZhbHVlIHdlIGNoZWNrIGlmIGl0IGNoYW5nZXMsIGFuZCBpZiBpdCBkb2VzLCB3ZSBydW4gYSBtYXJrIGZvciBjaGVjayB0byB1cGRhdGUgdGhlIHZpZXcuXG4gICAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgICAgICBjb25zdCBob3N0RGF0YVRlc3QgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5nZXRBdHRyaWJ1dGUoJ2RhdGEtdGVzdCcpO1xuICAgICAgICBjb25zdCBob3N0SWQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5nZXRBdHRyaWJ1dGUoJ2lkJyk7XG4gICAgICAgIGlmIChob3N0RGF0YVRlc3QgJiYgdGhpcy5ob3N0RGF0YVRlc3QgIT09IGhvc3REYXRhVGVzdCkge1xuICAgICAgICAgICAgdGhpcy5ob3N0RGF0YVRlc3QgPSBob3N0RGF0YVRlc3Q7XG4gICAgICAgICAgICB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5yZW1vdmVBdHRyaWJ1dGUoJ2RhdGEtdGVzdCcpO1xuICAgICAgICAgICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgICAgfVxuICAgICAgICBpZiAoaG9zdElkICYmIHRoaXMuaG9zdElkICE9PSBob3N0SWQpIHtcbiAgICAgICAgICAgIHRoaXMuaG9zdElkID0gaG9zdElkO1xuICAgICAgICAgICAgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQucmVtb3ZlQXR0cmlidXRlKCdpZCcpO1xuICAgICAgICAgICAgdGhpcy5jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgICAgfVxuICAgICAgICB0aGlzLmJ1dHRvbkVsZW1lbnQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5jaGlsZHJlblswXTtcbiAgICB9XG5cbiAgICBvbkNsaWNrSGFuZGxlKCRldmVudDogTW91c2VFdmVudCk6IHZvaWQge1xuICAgICAgICAkZXZlbnQuc3RvcEltbWVkaWF0ZVByb3BhZ2F0aW9uKCk7XG4gICAgICAgIHRoaXMuYnV0dG9uRWxlbWVudC5ibHVyKCk7XG4gICAgICAgIHRoaXMuY2xpY2suZW1pdCgkZXZlbnQpO1xuICAgICAgICB0aGlzLmZvY3VzLmVtaXQoJGV2ZW50KTtcbiAgICB9XG5cbiAgICBvbkJsdXJIYW5kbGUoJGV2ZW50OiBGb2N1c0V2ZW50KTogdm9pZCB7XG4gICAgICAgIHRoaXMuZm9jdXNlZCA9IGZhbHNlO1xuICAgICAgICB0aGlzLmJsdXIuZW1pdCgkZXZlbnQpO1xuICAgIH1cblxuICAgIG9uRm9jdXNIYW5kbGUoJGV2ZW50OiBGb2N1c0V2ZW50KTogdm9pZCB7XG4gICAgICAgIHRoaXMuZm9jdXNlZCA9IHRydWU7XG4gICAgICAgIHRoaXMuZm9jdXMuZW1pdCgkZXZlbnQpO1xuICAgIH1cblxuICAgIEBIb3N0TGlzdGVuZXIoJ3dpbmRvdzprZXl1cC5zcGFjZScsIFsnJGV2ZW50J10pXG4gICAgb25TcGFjZUtleVVwKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgICAgIGlmICh0aGlzLmZvY3VzZWQpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgICB0aGlzLmJ1dHRvbkVsZW1lbnQuY2xpY2soKTtcbiAgICAgICAgfVxuICAgIH1cbn1cbiJdfQ==
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
export * from './autosize-textarea.directive';
|
|
2
|
+
export * from './base-button.directive';
|
|
2
3
|
export * from './default-image.directive';
|
|
3
4
|
export * from './ellipsis.directive';
|
|
4
5
|
export * from './equal-validator.directive';
|
|
5
6
|
export * from './frozen-gif.directive';
|
|
6
7
|
export * from './multi-style-text.directive';
|
|
7
8
|
export * from './truncate-tooltip.directive';
|
|
8
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
9
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9kaXJlY3RpdmVzL3NyYy9wdWJsaWNfYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyx5QkFBeUIsQ0FBQztBQUN4QyxjQUFjLDJCQUEyQixDQUFDO0FBQzFDLGNBQWMsc0JBQXNCLENBQUM7QUFDckMsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLHdCQUF3QixDQUFDO0FBQ3ZDLGNBQWMsOEJBQThCLENBQUM7QUFDN0MsY0FBYyw4QkFBOEIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vYXV0b3NpemUtdGV4dGFyZWEuZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vYmFzZS1idXR0b24uZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vZGVmYXVsdC1pbWFnZS5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9lbGxpcHNpcy5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9lcXVhbC12YWxpZGF0b3IuZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vZnJvemVuLWdpZi5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9tdWx0aS1zdHlsZS10ZXh0LmRpcmVjdGl2ZSc7XG5leHBvcnQgKiBmcm9tICcuL3RydW5jYXRlLXRvb2x0aXAuZGlyZWN0aXZlJztcbiJdfQ==
|