@agorapulse/ui-components 18.0.13 → 18.0.15
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-18.0.15.tgz +0 -0
- package/avatar/avatar.component.d.ts +1 -1
- package/checkbox/checkbox.component.d.ts +1 -1
- package/esm2022/add-comment/add-comment.component.mjs +3 -3
- package/esm2022/checkbox/checkbox.component.mjs +5 -4
- package/esm2022/datepicker/datepicker.component.mjs +3 -3
- package/esm2022/labels/label-list.component.mjs +3 -3
- package/esm2022/labels-selector/labels-selector.component.mjs +3 -3
- package/esm2022/media-display-overlay/media-display-overlay-dialog.component.mjs +3 -3
- package/esm2022/modal/modal.component.mjs +3 -3
- package/esm2022/nav-selector/directives/nav-selector-popover-trigger.directive.mjs +71 -0
- package/esm2022/nav-selector/nav-selector-category/nav-selector-category.component.mjs +15 -12
- package/esm2022/nav-selector/nav-selector-group/nav-selector-group.component.mjs +17 -14
- package/esm2022/nav-selector/nav-selector-leaf/nav-selector-leaf.component.mjs +38 -94
- package/esm2022/nav-selector/nav-selector-leaf/nav-selector-leaf.presenter.mjs +2 -2
- package/esm2022/nav-selector/nav-selector-leaf-detail/nav-selector-leaf-detail.component.mjs +6 -6
- package/esm2022/nav-selector/nav-selector-leaf-details/nav-selector-leaf-details.component.mjs +12 -9
- package/esm2022/nav-selector/nav-selector-popover/nav-selector-popover-item.component.mjs +14 -0
- package/esm2022/nav-selector/nav-selector-popover/nav-selector-popover.component.mjs +127 -0
- package/esm2022/nav-selector/nav-selector.component.mjs +45 -23
- package/esm2022/nav-selector/nav-selector.mjs +1 -1
- package/esm2022/nav-selector/nav-selector.state.mjs +35 -11
- package/esm2022/nav-selector/utils/leaf.utils.mjs +12 -3
- package/esm2022/nav-selector/utils/nav-selector.accessibility.mjs +22 -14
- package/esm2022/nav-selector/utils/nav-selector.builder.mjs +4 -2
- package/esm2022/nav-selector/utils/nav-selector.filter.mjs +49 -11
- package/esm2022/nav-selector/utils/nav-selector.folding.mjs +26 -23
- package/esm2022/nav-selector/utils/nav-selector.merger.mjs +76 -0
- package/esm2022/nav-selector/utils/nav-selector.minifying.mjs +14 -9
- package/esm2022/nav-selector/utils/nav-selector.multi-select.mjs +2 -2
- package/esm2022/nav-selector/utils/nav-selector.single-select.mjs +46 -23
- package/esm2022/neo-datepicker/neo-datepicker.component.mjs +3 -3
- package/esm2022/notification/notification.component.mjs +3 -3
- package/esm2022/paginator/paginator-button/paginator-button.component.mjs +2 -2
- package/esm2022/password-input/password-input.component.mjs +3 -3
- package/esm2022/popmenu/popmenu.component.mjs +3 -3
- package/esm2022/slide-toggle/slide-toggle.component.mjs +3 -3
- package/esm2022/snackbars-thread/component/snackbars-thread.component.mjs +3 -3
- package/esm2022/stepper/stepper.component.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-add-comment.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-add-comment.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-checkbox.mjs +4 -3
- package/fesm2022/agorapulse-ui-components-checkbox.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-datepicker.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-labels.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-modal.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-modal.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-nav-selector.mjs +599 -238
- package/fesm2022/agorapulse-ui-components-nav-selector.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-notification.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-notification.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-paginator.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-paginator.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-password-input.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-password-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-popmenu.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-popmenu.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-stepper.mjs +2 -2
- package/fesm2022/agorapulse-ui-components-stepper.mjs.map +1 -1
- package/nav-selector/directives/nav-selector-popover-trigger.directive.d.ts +25 -0
- package/nav-selector/nav-selector-group/nav-selector-group.component.d.ts +1 -1
- package/nav-selector/nav-selector-leaf/nav-selector-leaf.component.d.ts +5 -20
- package/nav-selector/nav-selector-leaf/nav-selector-leaf.presenter.d.ts +1 -1
- package/nav-selector/nav-selector-leaf-detail/nav-selector-leaf-detail.component.d.ts +1 -1
- package/nav-selector/nav-selector-popover/nav-selector-popover-item.component.d.ts +6 -0
- package/nav-selector/nav-selector-popover/nav-selector-popover.component.d.ts +39 -0
- package/nav-selector/nav-selector.component.d.ts +6 -4
- package/nav-selector/nav-selector.d.ts +6 -0
- package/nav-selector/nav-selector.state.d.ts +3 -2
- package/nav-selector/utils/leaf.utils.d.ts +15 -2
- package/nav-selector/utils/nav-selector.accessibility.d.ts +1 -1
- package/nav-selector/utils/nav-selector.filter.d.ts +3 -1
- package/nav-selector/utils/nav-selector.folding.d.ts +6 -3
- package/nav-selector/utils/nav-selector.merger.d.ts +23 -0
- package/nav-selector/utils/nav-selector.minifying.d.ts +4 -2
- package/nav-selector/utils/nav-selector.single-select.d.ts +2 -0
- package/package.json +1 -1
- package/agorapulse-ui-components-18.0.13.tgz +0 -0
|
@@ -93,7 +93,7 @@ class SnackbarsThreadComponent {
|
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: SnackbarsThreadComponent, deps: [{ token: SnackbarsThreadService }, { token: i2.SymbolRegistry }, { token: i3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
96
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: SnackbarsThreadComponent, isStandalone: true, selector: "ap-snackbars-thread", ngImport: i0, template: "<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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}.thread-container{position:absolute;top:68px;right:var(--ref-spacing-lg);width:var(--comp-snackbar-width);z-index:999999999;gap:var(--comp-snackbar-spacing);display:flex;flex-direction:column}.thread-container .item{align-items:center;height:auto;padding:var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal);box-sizing:border-box;box-shadow:var(--comp-snackbar-shadow);border-radius:var(--comp-snackbar-border-radius);display:flex;flex-direction:row;justify-content:space-between;gap:var(--comp-snackbar-spacing)}.thread-container .item.success{background-color:var(--comp-snackbar-success-background-color)}.thread-container .item.error{background-color:var(--comp-snackbar-error-background-color)}.thread-container .item .left,.thread-container .item .right{display:flex;gap:var(--comp-snackbar-spacing)}.thread-container .item .left .icon{display:flex;justify-content:center;align-items:center}.thread-container .item .left .icon.success{color:var(--comp-snackbar-success-icon-color)}.thread-container .item .left .icon.error{color:var(--comp-snackbar-error-icon-color)}.thread-container .item .left .text{width:auto;display:flex;font-family:var(--comp-snackbar-text-style-font-family);font-size:var(--comp-snackbar-text-style-size);font-weight:var(--comp-snackbar-text-style-font-weight);line-height:var(--comp-snackbar-text-style-line-height);justify-content:flex-start;align-items:center;overflow-wrap:anywhere;color:var(--comp-snackbar-text-color)}.thread-container .item .right .link{width:max-content}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }], animations: [
|
|
96
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: SnackbarsThreadComponent, isStandalone: true, selector: "ap-snackbars-thread", ngImport: i0, template: "<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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=reddit]{color:#ff4500}[bgcolor=reddit],[hcolor=reddit]:hover{background-color:#ff4500}[border=reddit]{border:1px solid #ff4500}[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}.thread-container{position:absolute;top:68px;right:var(--ref-spacing-lg);width:var(--comp-snackbar-width);z-index:999999999;gap:var(--comp-snackbar-spacing);display:flex;flex-direction:column}.thread-container .item{align-items:center;height:auto;padding:var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal);box-sizing:border-box;box-shadow:var(--comp-snackbar-shadow);border-radius:var(--comp-snackbar-border-radius);display:flex;flex-direction:row;justify-content:space-between;gap:var(--comp-snackbar-spacing)}.thread-container .item.success{background-color:var(--comp-snackbar-success-background-color)}.thread-container .item.error{background-color:var(--comp-snackbar-error-background-color)}.thread-container .item .left,.thread-container .item .right{display:flex;gap:var(--comp-snackbar-spacing)}.thread-container .item .left .icon{display:flex;justify-content:center;align-items:center}.thread-container .item .left .icon.success{color:var(--comp-snackbar-success-icon-color)}.thread-container .item .left .icon.error{color:var(--comp-snackbar-error-icon-color)}.thread-container .item .left .text{width:auto;display:flex;font-family:var(--comp-snackbar-text-style-font-family);font-size:var(--comp-snackbar-text-style-size);font-weight:var(--comp-snackbar-text-style-font-weight);line-height:var(--comp-snackbar-text-style-line-height);justify-content:flex-start;align-items:center;overflow-wrap:anywhere;color:var(--comp-snackbar-text-color)}.thread-container .item .right .link{width:max-content}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }], animations: [
|
|
97
97
|
trigger('fadeAnimation', [
|
|
98
98
|
transition(':enter', [
|
|
99
99
|
style({
|
|
@@ -145,7 +145,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
|
|
|
145
145
|
animate('300ms ease-out', style({ height: 0, minHeight: 0, position: 'fixed' })),
|
|
146
146
|
]),
|
|
147
147
|
]),
|
|
148
|
-
], template: "<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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}.thread-container{position:absolute;top:68px;right:var(--ref-spacing-lg);width:var(--comp-snackbar-width);z-index:999999999;gap:var(--comp-snackbar-spacing);display:flex;flex-direction:column}.thread-container .item{align-items:center;height:auto;padding:var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal);box-sizing:border-box;box-shadow:var(--comp-snackbar-shadow);border-radius:var(--comp-snackbar-border-radius);display:flex;flex-direction:row;justify-content:space-between;gap:var(--comp-snackbar-spacing)}.thread-container .item.success{background-color:var(--comp-snackbar-success-background-color)}.thread-container .item.error{background-color:var(--comp-snackbar-error-background-color)}.thread-container .item .left,.thread-container .item .right{display:flex;gap:var(--comp-snackbar-spacing)}.thread-container .item .left .icon{display:flex;justify-content:center;align-items:center}.thread-container .item .left .icon.success{color:var(--comp-snackbar-success-icon-color)}.thread-container .item .left .icon.error{color:var(--comp-snackbar-error-icon-color)}.thread-container .item .left .text{width:auto;display:flex;font-family:var(--comp-snackbar-text-style-font-family);font-size:var(--comp-snackbar-text-style-size);font-weight:var(--comp-snackbar-text-style-font-weight);line-height:var(--comp-snackbar-text-style-line-height);justify-content:flex-start;align-items:center;overflow-wrap:anywhere;color:var(--comp-snackbar-text-color)}.thread-container .item .right .link{width:max-content}\n"] }]
|
|
148
|
+
], template: "<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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=reddit]{color:#ff4500}[bgcolor=reddit],[hcolor=reddit]:hover{background-color:#ff4500}[border=reddit]{border:1px solid #ff4500}[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}.thread-container{position:absolute;top:68px;right:var(--ref-spacing-lg);width:var(--comp-snackbar-width);z-index:999999999;gap:var(--comp-snackbar-spacing);display:flex;flex-direction:column}.thread-container .item{align-items:center;height:auto;padding:var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal);box-sizing:border-box;box-shadow:var(--comp-snackbar-shadow);border-radius:var(--comp-snackbar-border-radius);display:flex;flex-direction:row;justify-content:space-between;gap:var(--comp-snackbar-spacing)}.thread-container .item.success{background-color:var(--comp-snackbar-success-background-color)}.thread-container .item.error{background-color:var(--comp-snackbar-error-background-color)}.thread-container .item .left,.thread-container .item .right{display:flex;gap:var(--comp-snackbar-spacing)}.thread-container .item .left .icon{display:flex;justify-content:center;align-items:center}.thread-container .item .left .icon.success{color:var(--comp-snackbar-success-icon-color)}.thread-container .item .left .icon.error{color:var(--comp-snackbar-error-icon-color)}.thread-container .item .left .text{width:auto;display:flex;font-family:var(--comp-snackbar-text-style-font-family);font-size:var(--comp-snackbar-text-style-size);font-weight:var(--comp-snackbar-text-style-font-weight);line-height:var(--comp-snackbar-text-style-line-height);justify-content:flex-start;align-items:center;overflow-wrap:anywhere;color:var(--comp-snackbar-text-color)}.thread-container .item .right .link{width:max-content}\n"] }]
|
|
149
149
|
}], ctorParameters: () => [{ type: SnackbarsThreadService }, { type: i2.SymbolRegistry }, { type: i3.Router }] });
|
|
150
150
|
|
|
151
151
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-snackbars-thread.mjs","sources":["../../../libs/ui-components/snackbars-thread/src/utils/const/snackbars-thread.const.ts","../../../libs/ui-components/snackbars-thread/src/service/snackbars-thread.service.ts","../../../libs/ui-components/snackbars-thread/src/component/snackbars-thread.component.ts","../../../libs/ui-components/snackbars-thread/src/component/snackbars-thread.component.html","../../../libs/ui-components/snackbars-thread/src/model/snackbars-thread.model.ts","../../../libs/ui-components/snackbars-thread/src/agorapulse-ui-components-snackbars-thread.ts"],"sourcesContent":["import { agorapulseSymbol } from '@agorapulse/ui-symbol';\n\nexport const snackbarTypesMap = {\n 0: 'info',\n 1: 'success',\n 2: 'warning',\n 3: 'error',\n};\n\nexport const snackbarIconsMap: { [k: number]: agorapulseSymbol } = {\n 0: 'messages-bubble-dot',\n 1: 'rounded-check_fill',\n 2: 'error_fill',\n 3: 'error_fill',\n};\n","import { Injectable, SecurityContext } from '@angular/core';\nimport { DomSanitizer } from '@angular/platform-browser';\nimport { BehaviorSubject } from 'rxjs';\nimport { SnackbarsThreadBase, SnackbarsThreadComplete } from '../model/snackbars-thread.model';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class SnackbarsThreadService {\n private _list: SnackbarsThreadComplete[] = [];\n snackbarList = new BehaviorSubject<SnackbarsThreadComplete[]>([]);\n\n constructor(private domSanitizer: DomSanitizer) {}\n\n private _emit() {\n this.snackbarList.next(this._list);\n }\n\n add(elem: SnackbarsThreadBase, timeout: number = 5000): void {\n const notification: SnackbarsThreadComplete = {\n actionName: elem.actionName,\n navigateInternalUrl: elem.navigateInternalUrl,\n id: Math.random().toString(36).substring(7) + Date.now().toString(),\n snackbarType: elem.snackbarType,\n snackbarText: this.domSanitizer.sanitize(SecurityContext.HTML, elem.snackbarText) ?? '',\n openUrlInNewTab: elem.openUrlInNewTab\n };\n this._list.push(notification);\n this._emit();\n\n if (timeout > 0) {\n setTimeout(() => this.remove(notification.id), timeout);\n }\n }\n\n remove(id: string | undefined): void {\n if (!id) {\n return;\n }\n const index = this._list.findIndex(el => el.id === id);\n index > -1 && this._list.splice(index, 1);\n this._emit();\n }\n}\n","import {\n SymbolComponent,\n SymbolRegistry,\n apErrorFill,\n apRoundedCheckFill,\n apClose,\n apDeleteNoCircle,\n apMessagesBubbleDot\n} from '@agorapulse/ui-symbol';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { SnackbarsThreadService } from '../service/snackbars-thread.service';\nimport { snackbarIconsMap, snackbarTypesMap } from '../utils/const/snackbars-thread.const';\nimport { SnackbarsThreadBase } from '../public_api';\nimport { CloseButtonComponent } from '@agorapulse/ui-components/close-button';\n@Component({\n selector: 'ap-snackbars-thread',\n templateUrl: './snackbars-thread.component.html',\n styleUrls: ['./snackbars-thread.component.scss'],\n standalone: true,\n imports: [SymbolComponent, AsyncPipe, CloseButtonComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('fadeAnimation', [\n transition(':enter', [\n style({\n height: 0,\n minHeight: 0,\n opacity: 0,\n transform: 'translateY(25%)',\n padding: 0,\n }),\n // padding and min-height should be the same as in scss file\n animate(\n '300ms ease-in',\n style({\n height: '*',\n minHeight: '*',\n padding: 'var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal)',\n })\n ),\n animate('200ms ease-in', style({ opacity: 0.5, transform: 'translateY(0%)' })),\n animate('200ms ease-in', style({ opacity: 1 })),\n ]),\n transition(':leave', [\n animate('300ms ease-out', style({ opacity: 0.0, transform: 'translateY(-5%)' })),\n animate('300ms ease-out', style({ height: 0, minHeight: 0, position: 'fixed' })),\n ]),\n ]),\n ],\n})\nexport class SnackbarsThreadComponent {\n SnackbarTypesMap = snackbarTypesMap;\n SnackbarIconsMap = snackbarIconsMap;\n\n constructor(\n public snackbarsThreadService: SnackbarsThreadService,\n public symbolRegistry: SymbolRegistry,\n private readonly router: Router\n ) {\n this.symbolRegistry.registerSymbols([apClose, apMessagesBubbleDot, apRoundedCheckFill, apErrorFill, apDeleteNoCircle]);\n }\n\n remove(id: string): void {\n this.snackbarsThreadService.remove(id);\n }\n\n onActionClick(snackbar: SnackbarsThreadBase, id: string): void {\n const {navigateInternalUrl, openUrlInNewTab } = snackbar\n if(openUrlInNewTab && navigateInternalUrl) {\n window.open(navigateInternalUrl, '_blank')\n } else {\n this.snackbarsThreadService.remove(id);\n if(navigateInternalUrl) {\n this.router.navigateByUrl(navigateInternalUrl);\n }\n }\n }\n}\n","<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n","import { SafeHtml } from '@angular/platform-browser';\n\n/**\n * Info - 0\n * Success - 1\n * Warning - 2\n * Error - 3\n */\nexport type externalSnackbarTypeAllowed = 'info' | 'success' | 'warning' | 'error';\ntype internalSnackbarTypeAllowed = 0 | 1 | 2 | 3;\n\n/**\n * We use enum to avoid problem with isolatedModules when export const enum\n * https://ncjamieson.com/dont-export-const-enums/\n */\nexport enum SnackbarTypeValues {\n INFO = 'info',\n SUCCESS = 'success',\n WARNING = 'warning',\n ERROR = 'error',\n}\n\nexport interface SnackbarsThreadBase {\n actionName?: string,\n navigateInternalUrl?: string,\n snackbarType: internalSnackbarTypeAllowed;\n snackbarText: string | SafeHtml;\n openUrlInNewTab?: boolean;\n}\n\nexport interface SnackbarsThreadComplete extends SnackbarsThreadBase {\n id: string;\n}\n\nexport abstract class CodeStatus {\n protected constructor(\n public snackbarText: string,\n public snackbarType: internalSnackbarTypeAllowed\n ) {}\n}\n\nclass CodeStatusSuccess extends CodeStatus {\n constructor(snackbarText: string) {\n super(snackbarText, 1);\n }\n}\n\nclass CodeStatusError extends CodeStatus {\n constructor(snackbarText: string) {\n super(snackbarText, 3);\n }\n}\n\nexport function generateCodeStatus(text: string, type: externalSnackbarTypeAllowed): CodeStatus {\n switch (type) {\n case 'info':\n return new CodeStatusSuccess(text);\n case 'success':\n return new CodeStatusSuccess(text);\n case 'warning':\n return new CodeStatusError(text);\n case 'error':\n return new CodeStatusError(text);\n default:\n return new CodeStatusSuccess(text);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1.SnackbarsThreadService"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-snackbars-thread.mjs","sources":["../../../libs/ui-components/snackbars-thread/src/utils/const/snackbars-thread.const.ts","../../../libs/ui-components/snackbars-thread/src/service/snackbars-thread.service.ts","../../../libs/ui-components/snackbars-thread/src/component/snackbars-thread.component.ts","../../../libs/ui-components/snackbars-thread/src/component/snackbars-thread.component.html","../../../libs/ui-components/snackbars-thread/src/model/snackbars-thread.model.ts","../../../libs/ui-components/snackbars-thread/src/agorapulse-ui-components-snackbars-thread.ts"],"sourcesContent":["import { agorapulseSymbol } from '@agorapulse/ui-symbol';\n\nexport const snackbarTypesMap = {\n 0: 'info',\n 1: 'success',\n 2: 'warning',\n 3: 'error',\n};\n\nexport const snackbarIconsMap: { [k: number]: agorapulseSymbol } = {\n 0: 'messages-bubble-dot',\n 1: 'rounded-check_fill',\n 2: 'error_fill',\n 3: 'error_fill',\n};\n","import { Injectable, SecurityContext } from '@angular/core';\nimport { DomSanitizer } from '@angular/platform-browser';\nimport { BehaviorSubject } from 'rxjs';\nimport { SnackbarsThreadBase, SnackbarsThreadComplete } from '../model/snackbars-thread.model';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class SnackbarsThreadService {\n private _list: SnackbarsThreadComplete[] = [];\n snackbarList = new BehaviorSubject<SnackbarsThreadComplete[]>([]);\n\n constructor(private domSanitizer: DomSanitizer) {}\n\n private _emit() {\n this.snackbarList.next(this._list);\n }\n\n add(elem: SnackbarsThreadBase, timeout: number = 5000): void {\n const notification: SnackbarsThreadComplete = {\n actionName: elem.actionName,\n navigateInternalUrl: elem.navigateInternalUrl,\n id: Math.random().toString(36).substring(7) + Date.now().toString(),\n snackbarType: elem.snackbarType,\n snackbarText: this.domSanitizer.sanitize(SecurityContext.HTML, elem.snackbarText) ?? '',\n openUrlInNewTab: elem.openUrlInNewTab\n };\n this._list.push(notification);\n this._emit();\n\n if (timeout > 0) {\n setTimeout(() => this.remove(notification.id), timeout);\n }\n }\n\n remove(id: string | undefined): void {\n if (!id) {\n return;\n }\n const index = this._list.findIndex(el => el.id === id);\n index > -1 && this._list.splice(index, 1);\n this._emit();\n }\n}\n","import {\n SymbolComponent,\n SymbolRegistry,\n apErrorFill,\n apRoundedCheckFill,\n apClose,\n apDeleteNoCircle,\n apMessagesBubbleDot\n} from '@agorapulse/ui-symbol';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { SnackbarsThreadService } from '../service/snackbars-thread.service';\nimport { snackbarIconsMap, snackbarTypesMap } from '../utils/const/snackbars-thread.const';\nimport { SnackbarsThreadBase } from '../public_api';\nimport { CloseButtonComponent } from '@agorapulse/ui-components/close-button';\n@Component({\n selector: 'ap-snackbars-thread',\n templateUrl: './snackbars-thread.component.html',\n styleUrls: ['./snackbars-thread.component.scss'],\n standalone: true,\n imports: [SymbolComponent, AsyncPipe, CloseButtonComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('fadeAnimation', [\n transition(':enter', [\n style({\n height: 0,\n minHeight: 0,\n opacity: 0,\n transform: 'translateY(25%)',\n padding: 0,\n }),\n // padding and min-height should be the same as in scss file\n animate(\n '300ms ease-in',\n style({\n height: '*',\n minHeight: '*',\n padding: 'var(--comp-snackbar-padding-vertical) var(--comp-snackbar-padding-horizontal)',\n })\n ),\n animate('200ms ease-in', style({ opacity: 0.5, transform: 'translateY(0%)' })),\n animate('200ms ease-in', style({ opacity: 1 })),\n ]),\n transition(':leave', [\n animate('300ms ease-out', style({ opacity: 0.0, transform: 'translateY(-5%)' })),\n animate('300ms ease-out', style({ height: 0, minHeight: 0, position: 'fixed' })),\n ]),\n ]),\n ],\n})\nexport class SnackbarsThreadComponent {\n SnackbarTypesMap = snackbarTypesMap;\n SnackbarIconsMap = snackbarIconsMap;\n\n constructor(\n public snackbarsThreadService: SnackbarsThreadService,\n public symbolRegistry: SymbolRegistry,\n private readonly router: Router\n ) {\n this.symbolRegistry.registerSymbols([apClose, apMessagesBubbleDot, apRoundedCheckFill, apErrorFill, apDeleteNoCircle]);\n }\n\n remove(id: string): void {\n this.snackbarsThreadService.remove(id);\n }\n\n onActionClick(snackbar: SnackbarsThreadBase, id: string): void {\n const {navigateInternalUrl, openUrlInNewTab } = snackbar\n if(openUrlInNewTab && navigateInternalUrl) {\n window.open(navigateInternalUrl, '_blank')\n } else {\n this.snackbarsThreadService.remove(id);\n if(navigateInternalUrl) {\n this.router.navigateByUrl(navigateInternalUrl);\n }\n }\n }\n}\n","<div class=\"thread-container\">\n @for (el of snackbarsThreadService.snackbarList | async; track el) {\n <div\n @fadeAnimation\n class=\"item {{ SnackbarTypesMap[el.snackbarType] }}\">\n <div class=\"left\">\n <div class=\"icon {{ SnackbarTypesMap[el.snackbarType] }}\">\n <ap-symbol\n size=\"sm\"\n [attr.aria-label]=\"SnackbarTypesMap[el.snackbarType]\"\n [symbolId]=\"SnackbarIconsMap[el.snackbarType]\" />\n </div>\n <div class=\"text\">\n <div [innerHTML]=\"el.snackbarText\"></div>\n </div>\n </div>\n <div class=\"right\">\n @if (el.navigateInternalUrl?.length && el.actionName?.length) {\n <a\n class=\"standalone link\"\n role=\"link\"\n tabindex=\"0\"\n (click)=\"onActionClick(el, el.id)\"\n (keyup)=\"onActionClick(el, el.id)\">\n {{ el.actionName }}\n </a>\n }\n <ap-close-button (closed)=\"remove(el.id)\" />\n </div>\n </div>\n }\n</div>\n","import { SafeHtml } from '@angular/platform-browser';\n\n/**\n * Info - 0\n * Success - 1\n * Warning - 2\n * Error - 3\n */\nexport type externalSnackbarTypeAllowed = 'info' | 'success' | 'warning' | 'error';\ntype internalSnackbarTypeAllowed = 0 | 1 | 2 | 3;\n\n/**\n * We use enum to avoid problem with isolatedModules when export const enum\n * https://ncjamieson.com/dont-export-const-enums/\n */\nexport enum SnackbarTypeValues {\n INFO = 'info',\n SUCCESS = 'success',\n WARNING = 'warning',\n ERROR = 'error',\n}\n\nexport interface SnackbarsThreadBase {\n actionName?: string,\n navigateInternalUrl?: string,\n snackbarType: internalSnackbarTypeAllowed;\n snackbarText: string | SafeHtml;\n openUrlInNewTab?: boolean;\n}\n\nexport interface SnackbarsThreadComplete extends SnackbarsThreadBase {\n id: string;\n}\n\nexport abstract class CodeStatus {\n protected constructor(\n public snackbarText: string,\n public snackbarType: internalSnackbarTypeAllowed\n ) {}\n}\n\nclass CodeStatusSuccess extends CodeStatus {\n constructor(snackbarText: string) {\n super(snackbarText, 1);\n }\n}\n\nclass CodeStatusError extends CodeStatus {\n constructor(snackbarText: string) {\n super(snackbarText, 3);\n }\n}\n\nexport function generateCodeStatus(text: string, type: externalSnackbarTypeAllowed): CodeStatus {\n switch (type) {\n case 'info':\n return new CodeStatusSuccess(text);\n case 'success':\n return new CodeStatusSuccess(text);\n case 'warning':\n return new CodeStatusError(text);\n case 'error':\n return new CodeStatusError(text);\n default:\n return new CodeStatusSuccess(text);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1.SnackbarsThreadService"],"mappings":"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"}
|
|
@@ -21,11 +21,11 @@ class StepperComponent {
|
|
|
21
21
|
this.stepClicked.emit(step);
|
|
22
22
|
}
|
|
23
23
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: StepperComponent, isStandalone: true, selector: "ap-stepper", inputs: { currentStep: "currentStep", steps: "steps" }, outputs: { stepClicked: "stepClicked" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
24
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.9", type: StepperComponent, isStandalone: true, selector: "ap-stepper", inputs: { currentStep: "currentStep", steps: "steps" }, outputs: { stepClicked: "stepClicked" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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=reddit]{color:#ff4500}[bgcolor=reddit],[hcolor=reddit]:hover{background-color:#ff4500}[border=reddit]{border:1px solid #ff4500}[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}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
25
25
|
}
|
|
26
26
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: StepperComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-stepper', standalone: true, imports: [SymbolComponent, NgClass], template: "<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"] }]
|
|
28
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-stepper', standalone: true, imports: [SymbolComponent, NgClass], template: "<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n", styles: ["[color=facebook]{color:#0866ff}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#0866ff}[border=facebook]{border:1px solid #0866ff}[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=reddit]{color:#ff4500}[bgcolor=reddit],[hcolor=reddit]:hover{background-color:#ff4500}[border=reddit]{border:1px solid #ff4500}[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}.active{font-weight:700}.main{display:flex}.main .item{height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:transparent;color:#178dfe}.main .item .text{padding-left:8px;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}\n"] }]
|
|
29
29
|
}], propDecorators: { currentStep: [{
|
|
30
30
|
type: Input
|
|
31
31
|
}], steps: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-stepper.mjs","sources":["../../../libs/ui-components/stepper/src/stepper.component.ts","../../../libs/ui-components/stepper/src/stepper.component.html","../../../libs/ui-components/stepper/src/agorapulse-ui-components-stepper.ts"],"sourcesContent":["import { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { NgClass } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';\nimport { Step } from './step.model';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-stepper',\n templateUrl: './stepper.component.html',\n styleUrls: ['./stepper.component.scss'],\n standalone: true,\n imports: [SymbolComponent, NgClass],\n})\nexport class StepperComponent implements OnChanges {\n @Input() currentStep: Step | undefined = undefined;\n @Input({\n required: true,\n })\n steps: Step[] = []; // Immutable after init.\n @Output() stepClicked: EventEmitter<Step> = new EventEmitter<Step>();\n\n stepTexts: { [index: number]: string } = {};\n currentIndex = 0;\n\n ngOnChanges(): void {\n if (this.steps?.length > 0 && this.currentStep) {\n this.currentIndex = this.steps.findIndex(step => step.id === this.currentStep?.id);\n } else {\n this.currentIndex = 0;\n }\n }\n\n clickCurrentStep(step: Step): void {\n this.stepClicked.emit(step);\n }\n}\n","<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;MAaa,gBAAgB,CAAA;IAChB,WAAW,GAAqB,SAAS;AAIlD,IAAA,KAAK,GAAW,EAAE,CAAC;AACT,IAAA,WAAW,GAAuB,IAAI,YAAY,EAAQ;IAEpE,SAAS,GAAgC,EAAE;IAC3C,YAAY,GAAG,CAAC;IAEhB,WAAW,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;YAC5C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;;aAC/E;AACH,YAAA,IAAI,CAAC,YAAY,GAAG,CAAC;;;AAI7B,IAAA,gBAAgB,CAAC,IAAU,EAAA;AACvB,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;;uGApBtB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,ECb7B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,+7BA0BA,EDfc,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-stepper.mjs","sources":["../../../libs/ui-components/stepper/src/stepper.component.ts","../../../libs/ui-components/stepper/src/stepper.component.html","../../../libs/ui-components/stepper/src/agorapulse-ui-components-stepper.ts"],"sourcesContent":["import { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { NgClass } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';\nimport { Step } from './step.model';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-stepper',\n templateUrl: './stepper.component.html',\n styleUrls: ['./stepper.component.scss'],\n standalone: true,\n imports: [SymbolComponent, NgClass],\n})\nexport class StepperComponent implements OnChanges {\n @Input() currentStep: Step | undefined = undefined;\n @Input({\n required: true,\n })\n steps: Step[] = []; // Immutable after init.\n @Output() stepClicked: EventEmitter<Step> = new EventEmitter<Step>();\n\n stepTexts: { [index: number]: string } = {};\n currentIndex = 0;\n\n ngOnChanges(): void {\n if (this.steps?.length > 0 && this.currentStep) {\n this.currentIndex = this.steps.findIndex(step => step.id === this.currentStep?.id);\n } else {\n this.currentIndex = 0;\n }\n }\n\n clickCurrentStep(step: Step): void {\n this.stepClicked.emit(step);\n }\n}\n","<div class=\"main\">\n @for (step of steps; track step; let index = $index; let last = $last) {\n <span class=\"item\">\n <span\n [ngClass]=\"{\n number: true,\n active: index === currentIndex,\n 'no-more-active': currentIndex > index || (index !== currentIndex && step.visited),\n 'not-yet-active': currentIndex < index && !step.visited\n }\">\n {{ index + 1 }}\n </span>\n <span\n class=\"text\"\n [ngClass]=\"{ clickable: step.clickable }\"\n (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n {{ step.name }}\n </span>\n @if (!last) {\n <ap-symbol\n symbolId=\"chevron-right\"\n size=\"sm\" />\n }\n </span>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;MAaa,gBAAgB,CAAA;IAChB,WAAW,GAAqB,SAAS;AAIlD,IAAA,KAAK,GAAW,EAAE,CAAC;AACT,IAAA,WAAW,GAAuB,IAAI,YAAY,EAAQ;IAEpE,SAAS,GAAgC,EAAE;IAC3C,YAAY,GAAG,CAAC;IAEhB,WAAW,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;YAC5C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;;aAC/E;AACH,YAAA,IAAI,CAAC,YAAY,GAAG,CAAC;;;AAI7B,IAAA,gBAAgB,CAAC,IAAU,EAAA;AACvB,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;;uGApBtB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,ECb7B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,+7BA0BA,EDfc,MAAA,EAAA,CAAA,k3MAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,eAAe,sHAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAEzB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;sCACW,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,YAAY,EAAA,UAAA,EAGV,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,OAAO,CAAC,EAAA,QAAA,EAAA,+7BAAA,EAAA,MAAA,EAAA,CAAA,k3MAAA,CAAA,EAAA;8BAG1B,WAAW,EAAA,CAAA;sBAAnB;gBAID,KAAK,EAAA,CAAA;sBAHJ,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA;AACH,wBAAA,QAAQ,EAAE,IAAI;AACjB,qBAAA;gBAES,WAAW,EAAA,CAAA;sBAApB;;;AEnBL;;AAEG;;;;"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { ElementRef, Renderer2 } from '@angular/core';
|
|
2
|
+
import { NavSelectorPopoverComponent } from '../nav-selector-popover/nav-selector-popover.component';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export type NavSelectorPopoverTriggerMode = {
|
|
5
|
+
click: boolean;
|
|
6
|
+
hover: boolean;
|
|
7
|
+
focus: boolean;
|
|
8
|
+
keyboard: ('Space' | 'Enter' | string)[];
|
|
9
|
+
};
|
|
10
|
+
export declare class NavSelectorPopoverTriggerDirective {
|
|
11
|
+
private el;
|
|
12
|
+
private renderer;
|
|
13
|
+
apNavSelectorPopoverTrigger: import("@angular/core").InputSignal<NavSelectorPopoverComponent>;
|
|
14
|
+
apNavSelectorPopoverTriggerMode: import("@angular/core").InputSignal<Partial<NavSelectorPopoverTriggerMode>>;
|
|
15
|
+
apNavSelectorPopoverDisabled: import("@angular/core").InputSignal<boolean>;
|
|
16
|
+
private readonly ACTIVE_CLASS;
|
|
17
|
+
constructor(el: ElementRef, renderer: Renderer2);
|
|
18
|
+
onClick(event: Event): void;
|
|
19
|
+
onKeydown(event: KeyboardEvent): void;
|
|
20
|
+
onMouseEnter(): void;
|
|
21
|
+
onMouseLeave(): void;
|
|
22
|
+
private toggleDisplay;
|
|
23
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorPopoverTriggerDirective, never>;
|
|
24
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<NavSelectorPopoverTriggerDirective, "[apNavSelectorPopoverTrigger]", never, { "apNavSelectorPopoverTrigger": { "alias": "apNavSelectorPopoverTrigger"; "required": true; "isSignal": true; }; "apNavSelectorPopoverTriggerMode": { "alias": "apNavSelectorPopoverTriggerMode"; "required": false; "isSignal": true; }; "apNavSelectorPopoverDisabled": { "alias": "apNavSelectorPopoverDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
25
|
+
}
|
|
@@ -20,7 +20,7 @@ export declare class NavSelectorGroupComponent {
|
|
|
20
20
|
animationState: import("@angular/core").Signal<"collapsed" | "expanded">;
|
|
21
21
|
constructor(el: ElementRef, navSelectorGroupPresenter: NavSelectorGroupPresenter);
|
|
22
22
|
maxHeight: import("@angular/core").WritableSignal<string>;
|
|
23
|
-
onKeydownSpaceOrEnter(
|
|
23
|
+
onKeydownSpaceOrEnter(event: Event): void;
|
|
24
24
|
toggleFolding(event: Event): void;
|
|
25
25
|
fold(event: Event): void;
|
|
26
26
|
unfold(event: Event): void;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { ElementRef } from '@angular/core';
|
|
2
|
-
import { MatMenuTrigger } from '@angular/material/menu';
|
|
3
2
|
import { InternalNavSelectorLeaf } from '../nav-selector';
|
|
4
3
|
import { NavSelectorLeafPresenter } from './nav-selector-leaf.presenter';
|
|
5
4
|
import * as i0 from "@angular/core";
|
|
@@ -9,9 +8,8 @@ export declare class NavSelectorLeafComponent {
|
|
|
9
8
|
leaf: import("@angular/core").InputSignal<InternalNavSelectorLeaf>;
|
|
10
9
|
initial: import("@angular/core").Signal<string>;
|
|
11
10
|
foldSymbol: import("@angular/core").Signal<"chevron-down" | "chevron-up">;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
onlyButtonDisplayed: import("@angular/core").Signal<boolean>;
|
|
11
|
+
focused: import("@angular/core").WritableSignal<boolean>;
|
|
12
|
+
detailSelected: import("@angular/core").Signal<boolean>;
|
|
15
13
|
aliasEl: import("@angular/core").Signal<ElementRef<any> | undefined>;
|
|
16
14
|
aliasBoundedClientRect: import("@angular/core").WritableSignal<{
|
|
17
15
|
offsetWidth: number;
|
|
@@ -21,31 +19,18 @@ export declare class NavSelectorLeafComponent {
|
|
|
21
19
|
}>;
|
|
22
20
|
tooltipContent: import("@angular/core").Signal<string>;
|
|
23
21
|
tooltipDisabled: import("@angular/core").Signal<boolean>;
|
|
24
|
-
minifiedEl: import("@angular/core").Signal<ElementRef<any> | undefined>;
|
|
25
|
-
menuEl: import("@angular/core").Signal<ElementRef<any> | undefined>;
|
|
26
|
-
menuTriggerEl: import("@angular/core").Signal<MatMenuTrigger | undefined>;
|
|
27
|
-
actionMenuTriggerEl: import("@angular/core").Signal<MatMenuTrigger | undefined>;
|
|
28
22
|
foldedWithDelay: import("@angular/core").WritableSignal<boolean>;
|
|
29
|
-
network: import("@angular/core").Signal<"bluesky" | "facebook" | "instagram" | "linkedin" | "twitter" | "youtube" | "meta" | "google" | "pinterest" | "threads" | "tiktok" | "webBlog" | "webNews" | "X" | null | undefined>;
|
|
23
|
+
network: import("@angular/core").Signal<"bluesky" | "facebook" | "instagram" | "linkedin" | "twitter" | "youtube" | "meta" | "google" | "pinterest" | "threads" | "tiktok" | "webBlog" | "webNews" | "X" | "reddit" | null | undefined>;
|
|
30
24
|
constructor(el: ElementRef, navSelectorLeafPresenter: NavSelectorLeafPresenter);
|
|
31
25
|
animationState: import("@angular/core").Signal<"collapsed" | "expanded">;
|
|
32
26
|
maxHeight: import("@angular/core").WritableSignal<string>;
|
|
33
|
-
onClick(
|
|
27
|
+
onClick(event: Event): void;
|
|
34
28
|
toggleFolding(event: Event): void;
|
|
35
|
-
mouseEntered(): void;
|
|
36
|
-
mouseLeft($event: MouseEvent): void;
|
|
37
|
-
mouseEnteredMenu(): void;
|
|
38
|
-
mouseLeftMenu(menuTrigger: MatMenuTrigger, $event: MouseEvent): void;
|
|
39
|
-
menuOpened(): void;
|
|
40
|
-
onActionButtonClick($event: Event): void;
|
|
41
|
-
onActionButtonKeyDownSpaceOrEnter($event: Event): void;
|
|
42
29
|
selectOnly(event: Event): void;
|
|
43
30
|
onCheckboxToggle(): void;
|
|
44
|
-
onSpaceOrEnterPressed(
|
|
31
|
+
onSpaceOrEnterPressed(event: Event): void;
|
|
45
32
|
fold(event: Event): void;
|
|
46
33
|
unfold(event: Event): void;
|
|
47
|
-
private tryCloseMenu;
|
|
48
|
-
private mouseIsHovering;
|
|
49
34
|
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorLeafComponent, never>;
|
|
50
35
|
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorLeafComponent, "ap-nav-selector-leaf", never, { "leaf": { "alias": "leaf"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
51
36
|
}
|
|
@@ -9,7 +9,7 @@ export declare class NavSelectorLeafPresenter {
|
|
|
9
9
|
leafActionProjection: import("@angular/core").Signal<readonly import("@angular/core").TemplateRef<unknown>[] | undefined>;
|
|
10
10
|
expandedAfterDelay: import("@angular/core").Signal<boolean>;
|
|
11
11
|
constructor(navSelectorState: NavSelectorState);
|
|
12
|
-
|
|
12
|
+
selectLeaf(leaf: InternalNavSelectorLeaf): void;
|
|
13
13
|
onLeafToggleFolding(leaf: InternalNavSelectorLeaf): void;
|
|
14
14
|
selectOnlyLeaf(leaf: InternalNavSelectorLeaf): void;
|
|
15
15
|
fold(leaf: InternalNavSelectorLeaf): void;
|
|
@@ -7,7 +7,7 @@ export declare class NavSelectorLeafDetailComponent {
|
|
|
7
7
|
detail: import("@angular/core").InputSignal<InternalNavSelectorLeafDetails>;
|
|
8
8
|
embedded: import("@angular/core").InputSignal<boolean>;
|
|
9
9
|
constructor(navSelectorLeafDetailPresenter: NavSelectorLeafDetailPresenter);
|
|
10
|
-
onClick(
|
|
10
|
+
onClick(event: Event): void;
|
|
11
11
|
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorLeafDetailComponent, never>;
|
|
12
12
|
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorLeafDetailComponent, "ap-nav-selector-leaf-detail", never, { "detail": { "alias": "detail"; "required": true; "isSignal": true; }; "embedded": { "alias": "embedded"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.TreeNodeAccessibilityDirective; inputs: { "apTreeNodeAccessibility": "detail"; }; outputs: {}; }]>;
|
|
13
13
|
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
export declare class NavSelectorPopoverItemComponent {
|
|
3
|
+
selected: import("@angular/core").InputSignal<boolean>;
|
|
4
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorPopoverItemComponent, never>;
|
|
5
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorPopoverItemComponent, "ap-nav-selector-popover-item", never, { "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
6
|
+
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { ElementRef, TemplateRef } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare const NavSelectorPopoverPlacement: {
|
|
4
|
+
readonly RIGHT: "right";
|
|
5
|
+
readonly BOTTOM_START: "bottom_start";
|
|
6
|
+
};
|
|
7
|
+
export type NavSelectorPopoverPlacement = (typeof NavSelectorPopoverPlacement)[keyof typeof NavSelectorPopoverPlacement];
|
|
8
|
+
export declare class NavSelectorPopoverComponent {
|
|
9
|
+
private elementRef;
|
|
10
|
+
placement: import("@angular/core").InputSignal<NavSelectorPopoverPlacement>;
|
|
11
|
+
popoverTitle: import("@angular/core").InputSignal<string | undefined>;
|
|
12
|
+
offset: import("@angular/core").InputSignal<Partial<{
|
|
13
|
+
mainAxis: number;
|
|
14
|
+
crossAxis: number;
|
|
15
|
+
}>>;
|
|
16
|
+
items: import("@angular/core").Signal<readonly TemplateRef<unknown>[]>;
|
|
17
|
+
displayed: import("@angular/core").WritableSignal<boolean>;
|
|
18
|
+
navSelectorPopoverDisplayed: import("@angular/core").Signal<boolean>;
|
|
19
|
+
position: import("@angular/core").WritableSignal<{
|
|
20
|
+
top: number;
|
|
21
|
+
left: number;
|
|
22
|
+
}>;
|
|
23
|
+
parentEl: import("@angular/core").WritableSignal<ElementRef<any> | null>;
|
|
24
|
+
mainAxisOffset: import("@angular/core").Signal<number>;
|
|
25
|
+
crossAxisOffset: import("@angular/core").Signal<number>;
|
|
26
|
+
constructor(elementRef: ElementRef);
|
|
27
|
+
display(parentEl: ElementRef): void;
|
|
28
|
+
hide(): void;
|
|
29
|
+
toggle(parentEl: ElementRef): void;
|
|
30
|
+
onClick(event: Event): void;
|
|
31
|
+
private computePosition;
|
|
32
|
+
private computeRightPosition;
|
|
33
|
+
private computeBottomPosition;
|
|
34
|
+
onAnyScroll(): void;
|
|
35
|
+
onFocusChanged(event: FocusEvent): void;
|
|
36
|
+
onAnyClick(event: Event): void;
|
|
37
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorPopoverComponent, never>;
|
|
38
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorPopoverComponent, "ap-nav-selector-popover", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "popoverTitle": { "alias": "popoverTitle"; "required": false; "isSignal": true; }; "offset": { "alias": "offset"; "required": false; "isSignal": true; }; }, {}, ["items"], ["[item]"], true, never>;
|
|
39
|
+
}
|
|
@@ -9,6 +9,7 @@ export declare class NavSelectorComponent {
|
|
|
9
9
|
translatedTexts: import("@angular/core").InputSignal<NavSelectorTranslatedTexts>;
|
|
10
10
|
multipleModeEnabled: import("@angular/core").InputSignal<boolean>;
|
|
11
11
|
detailsDisplayedLimit: import("@angular/core").InputSignal<number>;
|
|
12
|
+
embedded: import("@angular/core").InputSignal<boolean>;
|
|
12
13
|
/**
|
|
13
14
|
* If true, the nav selector will be expanded by default. Even if the width of the screen is smaller than 1280px.
|
|
14
15
|
*/
|
|
@@ -21,9 +22,10 @@ export declare class NavSelectorComponent {
|
|
|
21
22
|
expansionState: import("@angular/core").Signal<"expanded" | "minified">;
|
|
22
23
|
componentUid: string;
|
|
23
24
|
constructor(navSelectorState: NavSelectorState, el: ElementRef);
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
25
|
+
onMinifiedSearchClicked(): void;
|
|
26
|
+
onArrowDown(event: Event): void;
|
|
27
|
+
onArrowUp(event: Event): void;
|
|
28
|
+
onWindowResize(): void;
|
|
27
29
|
static ɵfac: i0.ɵɵFactoryDeclaration<NavSelectorComponent, never>;
|
|
28
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorComponent, "ap-nav-selector", never, { "navSelectorEntries": { "alias": "navSelectorEntries"; "required": true; "isSignal": true; }; "translatedTexts": { "alias": "translatedTexts"; "required": true; "isSignal": true; }; "multipleModeEnabled": { "alias": "multipleModeEnabled"; "required": false; "isSignal": true; }; "detailsDisplayedLimit": { "alias": "detailsDisplayedLimit"; "required": false; "isSignal": true; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; "isSignal": true; }; "selectedEntryUids": { "alias": "selectedEntryUids"; "required": true; "isSignal": true; }; }, { "selectedEntryUids": "selectedEntryUidsChange"; }, ["headerProjection", "footerProjection", "leafActionProjection"], never, true, never>;
|
|
30
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<NavSelectorComponent, "ap-nav-selector", never, { "navSelectorEntries": { "alias": "navSelectorEntries"; "required": true; "isSignal": true; }; "translatedTexts": { "alias": "translatedTexts"; "required": true; "isSignal": true; }; "multipleModeEnabled": { "alias": "multipleModeEnabled"; "required": false; "isSignal": true; }; "detailsDisplayedLimit": { "alias": "detailsDisplayedLimit"; "required": false; "isSignal": true; }; "embedded": { "alias": "embedded"; "required": false; "isSignal": true; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; "isSignal": true; }; "selectedEntryUids": { "alias": "selectedEntryUids"; "required": true; "isSignal": true; }; }, { "selectedEntryUids": "selectedEntryUidsChange"; }, ["headerProjection", "footerProjection", "leafActionProjection"], never, true, never>;
|
|
29
31
|
}
|
|
@@ -155,6 +155,12 @@ export type InternalNavSelectorCategory = {
|
|
|
155
155
|
* Represent final entry of the nav selector
|
|
156
156
|
*/
|
|
157
157
|
export type InternalNavSelectorLeaf = {
|
|
158
|
+
/**
|
|
159
|
+
* Indicates if the actions dropdown could be display. Should not be display if the leaf has an error status.
|
|
160
|
+
* Note: only working if actions are projected in the nav selector component
|
|
161
|
+
*/
|
|
162
|
+
actionsDisplayable: boolean;
|
|
163
|
+
/** Picture url to display on the avatar, optional */
|
|
158
164
|
pictureUrl: string | null;
|
|
159
165
|
/** Indicates if the counter could be display. The leaf should not be disabled, feature locked or has token invalid */
|
|
160
166
|
counterDisplayable: boolean;
|
|
@@ -7,13 +7,12 @@ import * as i0 from "@angular/core";
|
|
|
7
7
|
* It should be provided by the component to ensure that if many nav selectors are used in the same page, they don't share the same state.
|
|
8
8
|
*/
|
|
9
9
|
export declare class NavSelectorState {
|
|
10
|
-
|
|
10
|
+
entries: import("@angular/core").WritableSignal<InternalNavSelectorEntry[]>;
|
|
11
11
|
private multipleModeEnabled;
|
|
12
12
|
private _texts;
|
|
13
13
|
private lastSelectedUids;
|
|
14
14
|
isMultipleModeEnabled: import("@angular/core").WritableSignal<boolean>;
|
|
15
15
|
search: import("@angular/core").WritableSignal<string>;
|
|
16
|
-
filteredEntries: import("@angular/core").Signal<InternalNavSelectorEntry[]>;
|
|
17
16
|
noResults: import("@angular/core").Signal<boolean>;
|
|
18
17
|
texts: import("@angular/core").Signal<NavSelectorTranslatedTexts>;
|
|
19
18
|
leafActionProjection: import("@angular/core").WritableSignal<readonly TemplateRef<unknown>[] | undefined>;
|
|
@@ -22,6 +21,7 @@ export declare class NavSelectorState {
|
|
|
22
21
|
selectedUidsChangeCallback: ((selectedUids: string[]) => void) | null;
|
|
23
22
|
constructor();
|
|
24
23
|
updateMultiModeEnabled(enabled: boolean): void;
|
|
24
|
+
initEntries(entries: NavSelectorEntry[], initialSelectedEntryUids: string[], detailsDisplayedLimit: number): void;
|
|
25
25
|
updateEntries(entries: NavSelectorEntry[], initialSelectedEntryUids: string[], detailsDisplayedLimit: number): void;
|
|
26
26
|
onGroupToggleFolding(group: InternalNavSelectorEntry): void;
|
|
27
27
|
onNodeSelect(node: InternalNavSelectorEntry): void;
|
|
@@ -31,6 +31,7 @@ export declare class NavSelectorState {
|
|
|
31
31
|
updateTexts(texts: NavSelectorTranslatedTexts): void;
|
|
32
32
|
selectOnlyLeaf(leaf: InternalNavSelectorLeaf): void;
|
|
33
33
|
toggleExpanded(): void;
|
|
34
|
+
minify(): void;
|
|
34
35
|
onSelectionChange(uids: string[]): void;
|
|
35
36
|
registerOnSelectedUidsChange(callback: (selectedUids: string[]) => void): void;
|
|
36
37
|
onArrowDown(): void;
|
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
import { InternalNavSelectorLeaf } from '../nav-selector';
|
|
2
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Utility type to extract keys of an object that are of type string, number or symbol which are the only type allowed in a Record
|
|
4
|
+
*/
|
|
5
|
+
type AllowedKey<T> = Pick<T, {
|
|
6
|
+
[K in keyof T]: T[K] extends string | number | symbol ? K : never;
|
|
7
|
+
}[keyof T]>;
|
|
8
|
+
/**
|
|
9
|
+
* Create a Record of key/value pairs from an array of objects
|
|
10
|
+
* @param array
|
|
11
|
+
* @param key attribute of the object to use as key
|
|
12
|
+
*/
|
|
13
|
+
export declare const associateBy: <T>(array: T[], key: keyof AllowedKey<T>) => Record<string, T>;
|
|
14
|
+
export declare const isInternalNavSelectorEntryALeafFocusable: (leaf: InternalNavSelectorLeaf, { parentFolded, multipleMode }: {
|
|
3
15
|
parentFolded: boolean;
|
|
4
|
-
|
|
16
|
+
multipleMode: boolean;
|
|
5
17
|
}) => boolean;
|
|
18
|
+
export {};
|
|
@@ -36,7 +36,7 @@ export declare class NavSelectorAccessibility {
|
|
|
36
36
|
* @param entries nav selector entries
|
|
37
37
|
*/
|
|
38
38
|
static focusNext<T extends InternalNavSelectorEntry>(entries: T[]): InternalNavSelectorEntry[];
|
|
39
|
-
private static
|
|
39
|
+
private static noPreviousEntryFocusable;
|
|
40
40
|
private static focusAnEntry;
|
|
41
41
|
private static unfocusAnEntry;
|
|
42
42
|
/**
|
|
@@ -20,11 +20,13 @@ export declare class NavSelectorFilter {
|
|
|
20
20
|
*
|
|
21
21
|
* @param entries The entries to filter.
|
|
22
22
|
* @param search The search string.
|
|
23
|
+
* @param multipleMode to update the focusable state of leaves correctly.
|
|
23
24
|
* @returns The filtered entries.
|
|
24
25
|
*/
|
|
25
|
-
static filter(entries: InternalNavSelectorEntry[], search: string): InternalNavSelectorEntry[];
|
|
26
|
+
static filter(entries: InternalNavSelectorEntry[], search: string, multipleMode: boolean): InternalNavSelectorEntry[];
|
|
26
27
|
private static filterEntries;
|
|
27
28
|
private static recursivelyUnfoldEntry;
|
|
28
29
|
private static matches;
|
|
29
30
|
private static cleanValue;
|
|
31
|
+
private static resetState;
|
|
30
32
|
}
|