@agorapulse/ui-components 16.3.13 → 17.0.0-beta.1
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-17.0.0-beta.1.tgz +0 -0
- package/avatar/avatar.component.d.ts +1 -2
- package/esm2022/add-comment/add-comment.component.mjs +4 -4
- package/esm2022/autocomplete/autocomplete.component.mjs +6 -6
- package/esm2022/avatar/avatar.component.mjs +8 -10
- package/esm2022/badge/badge.component.mjs +4 -4
- package/esm2022/button/button.component.mjs +4 -4
- package/esm2022/checkbox/checkbox.component.mjs +6 -6
- package/esm2022/confirm-modal/confirm-modal.component.mjs +5 -5
- package/esm2022/counter/counter.component.mjs +5 -5
- package/esm2022/datepicker/datepicker.component.mjs +6 -6
- package/esm2022/directives/autosize-textarea.directive.mjs +5 -5
- package/esm2022/directives/base-button.directive.mjs +4 -4
- package/esm2022/directives/default-image.directive.mjs +4 -4
- package/esm2022/directives/ellipsis.directive.mjs +5 -5
- package/esm2022/directives/equal-validator.directive.mjs +6 -6
- package/esm2022/directives/frozen-gif.directive.mjs +5 -5
- package/esm2022/directives/multi-style-text.directive.mjs +5 -5
- package/esm2022/directives/truncate-tooltip.directive.mjs +5 -5
- package/esm2022/dots-stepper/dots-stepper.component.mjs +4 -4
- package/esm2022/form-field/form-field.component.mjs +4 -4
- package/esm2022/form-message/form-message.component.mjs +5 -5
- package/esm2022/icon-button/icon-button.component.mjs +5 -5
- package/esm2022/infobox/infobox.component.mjs +5 -5
- package/esm2022/input/input.directive.mjs +4 -4
- package/esm2022/input-group/input-group.component.mjs +4 -4
- package/esm2022/labels/label-list.component.mjs +5 -5
- package/esm2022/labels/label.component.mjs +6 -6
- package/esm2022/labels-selector/labels-selector.component.mjs +5 -5
- package/esm2022/legacy/input/input.component.mjs +4 -4
- package/esm2022/legacy/select/select.component.mjs +6 -6
- package/esm2022/legacy/textarea/textarea.component.mjs +5 -5
- package/esm2022/media-display-overlay/media-display-overlay-dialog.component.mjs +6 -6
- package/esm2022/modal/modal.component.mjs +5 -5
- package/esm2022/neo-datepicker/day-disabled.pipe.mjs +4 -4
- package/esm2022/neo-datepicker/neo-datepicker.component.mjs +5 -5
- package/esm2022/notification/notification.component.mjs +4 -4
- package/esm2022/paginator/paginator-button/paginator-button.component.mjs +4 -4
- package/esm2022/paginator/paginator.component.mjs +5 -5
- package/esm2022/password-input/password-input.component.mjs +5 -5
- package/esm2022/popmenu/popmenu.component.mjs +5 -5
- package/esm2022/popmenu/popmenu.directive.mjs +6 -6
- package/esm2022/popmenu/popmenu.module.mjs +5 -5
- package/esm2022/radio/radio-control.registry.mjs +4 -4
- package/esm2022/radio/radio.component.mjs +5 -5
- package/esm2022/range-slider/range-slider.component.mjs +6 -6
- package/esm2022/select/ap-select.module.mjs +5 -5
- package/esm2022/select/dropdown-group-item/dropdown-group-item.component.mjs +4 -4
- package/esm2022/select/dropdown-item-multiple-one-line/dropdown-item-multiple-one-line.component.mjs +4 -4
- package/esm2022/select/dropdown-item-multiple-two-lines/dropdown-item-multiple-two-lines.component.mjs +4 -4
- package/esm2022/select/dropdown-item-single-one-line/dropdown-item-single-one-line.component.mjs +4 -4
- package/esm2022/select/dropdown-item-single-two-lines/dropdown-item-single-two-lines.component.mjs +4 -4
- package/esm2022/select/dropdown-search-form/dropdown-search-form.component.mjs +5 -5
- package/esm2022/select/select-base.directive.mjs +5 -5
- package/esm2022/select/select-label-multiple/select-label-multiple.component.mjs +4 -4
- package/esm2022/select/select-label-single/select-label-single.component.mjs +4 -4
- package/esm2022/select/select-multiple.directive.mjs +5 -5
- package/esm2022/select/select-single.directive.mjs +5 -5
- package/esm2022/slide-toggle/slide-toggle.component.mjs +6 -6
- package/esm2022/snackbars-thread/component/snackbars-thread.component.mjs +5 -5
- package/esm2022/snackbars-thread/model/snackbars-thread.model.mjs +1 -1
- package/esm2022/snackbars-thread/service/snackbars-thread.service.mjs +5 -5
- package/esm2022/social-button/social-button.component.mjs +5 -5
- package/esm2022/split-button/split-button.component.mjs +5 -5
- package/esm2022/src/lib/agorapulse-ui-components.module.mjs +5 -5
- package/esm2022/status/status.component.mjs +5 -5
- package/esm2022/status-card/status-card.component.mjs +4 -4
- package/esm2022/stepper/stepper.component.mjs +5 -5
- package/esm2022/tag/tag.component.mjs +6 -6
- package/esm2022/text-measurement/text-measurement.service.mjs +5 -5
- package/esm2022/textarea/textarea.directive.mjs +5 -5
- package/esm2022/toggle/toggle.component.mjs +4 -4
- package/esm2022/tooltip/tooltip.directive.mjs +4 -4
- package/esm2022/tooltip/tooltip.service.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-add-comment.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-add-comment.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-autocomplete.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-autocomplete.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-avatar.mjs +7 -9
- package/fesm2022/agorapulse-ui-components-avatar.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-badge.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-badge.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-button.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-checkbox.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-checkbox.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-confirm-modal.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-confirm-modal.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-counter.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-counter.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-datepicker.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-directives.mjs +31 -31
- package/fesm2022/agorapulse-ui-components-directives.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-dots-stepper.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-dots-stepper.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-form-field.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-form-field.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-form-message.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-form-message.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-icon-button.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-icon-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-infobox.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-infobox.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-input-group.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-input-group.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-input.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-labels-selector.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-labels.mjs +9 -9
- package/fesm2022/agorapulse-ui-components-labels.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-input.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-legacy-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-select.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-legacy-select.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-legacy-textarea.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-legacy-textarea.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-media-display-overlay.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-modal.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-modal.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs +7 -7
- package/fesm2022/agorapulse-ui-components-neo-datepicker.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-notification.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-notification.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-paginator.mjs +7 -7
- package/fesm2022/agorapulse-ui-components-paginator.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-password-input.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-password-input.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-popmenu.mjs +13 -13
- package/fesm2022/agorapulse-ui-components-popmenu.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-radio.mjs +7 -7
- package/fesm2022/agorapulse-ui-components-radio.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-range-slider.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-range-slider.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-select.mjs +41 -41
- package/fesm2022/agorapulse-ui-components-select.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-slide-toggle.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs +8 -8
- package/fesm2022/agorapulse-ui-components-snackbars-thread.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-social-button.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-social-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-split-button.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-split-button.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-status-card.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-status-card.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-status.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-status.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-stepper.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-stepper.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-tag.mjs +5 -5
- package/fesm2022/agorapulse-ui-components-tag.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-text-measurement.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-text-measurement.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-textarea.mjs +4 -4
- package/fesm2022/agorapulse-ui-components-textarea.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-toggle.mjs +3 -3
- package/fesm2022/agorapulse-ui-components-toggle.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-tooltip.mjs +6 -6
- package/fesm2022/agorapulse-ui-components-tooltip.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components.mjs +4 -4
- package/fesm2022/agorapulse-ui-components.mjs.map +1 -1
- package/package.json +33 -33
- package/select/select-label-multiple/select-label-multiple.component.d.ts +1 -1
- package/snackbars-thread/component/snackbars-thread.component.d.ts +1 -1
- package/agorapulse-ui-components-16.3.13.tgz +0 -0
|
@@ -76,10 +76,10 @@ class AutocompleteComponent {
|
|
|
76
76
|
this.showResultsSignal.set(false);
|
|
77
77
|
this.resultsLoadingSignal.set(false);
|
|
78
78
|
}
|
|
79
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
80
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.10", type: AutocompleteComponent, isStandalone: true, selector: "ap-autocomplete", inputs: { placeholder: "placeholder", label: "label", inputId: "inputId", loadingText: "loadingText", notFoundText: "notFoundText", searchFn: "searchFn", trackByFn: "trackByFn", disabled: "disabled", optionLabel: "optionLabel", optionCaption: "optionCaption", optionImageUrl: "optionImageUrl", optionValue: "optionValue", optionTextTemplate: "optionTextTemplate" }, outputs: { selectOption: "selectOption" }, viewQueries: [{ propertyName: "formField", first: true, predicate: ["formField"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n size=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n", styles: ["ap-autocomplete{display:block}ap-autocomplete .input-autocomplete-wrapper{display:flex;flex-direction:column}ap-autocomplete .search-results-wrapper{position:relative}.ap-autocomplete-search-results{width:100%;display:flex;flex-direction:column;border-radius:var(--ref-border-radius-sm);box-shadow:var(--comp-select-shadow);padding:var(--comp-select-padding-vertical) 0;background-color:var(--comp-select-background-color);margin-top:var(--ref-spacing-xxxs);max-height:250px;overflow:auto}.ap-autocomplete-search-results-loading{display:flex;padding:var(--ref-spacing-sm) 0;flex-direction:column;justify-content:center;align-items:center;gap:var(--ref-spacing-xs)}.ap-autocomplete-search-results-loading .search-results-loading-label{font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80)}.ap-autocomplete-search-results-not-found{padding:var(--ref-spacing-xs) var(--ref-spacing-sm);font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item{padding:var(--ref-spacing-xxs) var(--ref-spacing-sm)}.ap-autocomplete-search-results-item .option{display:flex;align-items:center;font-size:var(--comp-select-one-line-text-size);font-weight:var(--comp-select-one-line-text-font-weight);color:var(--comp-select-one-line-text-color);line-height:var(--comp-select-one-line-text-line-height);font-family:var(--comp-select-one-line-text-font-family);gap:var(--ref-spacing-xs);min-height:24px}.ap-autocomplete-search-results-item .option .option-item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item .option .texts{flex:1;overflow:auto}.ap-autocomplete-search-results-item .option .texts .first-line{display:flex}.ap-autocomplete-search-results-item .option .texts .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item .option.with-caption .texts{display:flex;flex-direction:column}.ap-autocomplete-search-results-item .option.with-caption .texts .label{color:var(--comp-select-two-line-title-text-color);font-size:var(--comp-select-two-line-title-text-size);line-height:var(--comp-select-two-line-title-text-line-height);font-weight:var(--comp-select-two-line-title-text-font-weight)}.ap-autocomplete-search-results-item .option.with-caption .texts .caption{color:var(--comp-select-two-line-caption-text-color);font-size:var(--comp-select-two-line-caption-text-size);line-height:var(--comp-select-two-line-caption-text-line-height);font-weight:var(--comp-select-two-line-caption-text-font-weight);display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item:hover{cursor:pointer;background-color:var(--ref-color-electric-blue-10)}.ap-autocomplete-search-results-item:active{background-color:var(--ref-color-electric-blue-20)}.ap-autocomplete-search-results-item:focus{background-color:var(--ref-color-electric-blue-20)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "component", type: FormFieldComponent, selector: "ap-form-field" }, { kind: "component", type: InputGroupComponent, selector: "ap-input-group", inputs: ["symbolPosition"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "ap-loader", inputs: ["color", "diameter"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: InputDirective, selector: "[apInput]" }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["alternativeText", "anonymous", "username", "network", "online", "profilePicture", "showInitials", "alt", "rounded", "size"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
79
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
80
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: AutocompleteComponent, isStandalone: true, selector: "ap-autocomplete", inputs: { placeholder: "placeholder", label: "label", inputId: "inputId", loadingText: "loadingText", notFoundText: "notFoundText", searchFn: "searchFn", trackByFn: "trackByFn", disabled: "disabled", optionLabel: "optionLabel", optionCaption: "optionCaption", optionImageUrl: "optionImageUrl", optionValue: "optionValue", optionTextTemplate: "optionTextTemplate" }, outputs: { selectOption: "selectOption" }, viewQueries: [{ propertyName: "formField", first: true, predicate: ["formField"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n [size]=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n", styles: ["ap-autocomplete{display:block}ap-autocomplete .input-autocomplete-wrapper{display:flex;flex-direction:column}ap-autocomplete .search-results-wrapper{position:relative}.ap-autocomplete-search-results{width:100%;display:flex;flex-direction:column;border-radius:var(--ref-border-radius-sm);box-shadow:var(--comp-select-shadow);padding:var(--comp-select-padding-vertical) 0;background-color:var(--comp-select-background-color);margin-top:var(--ref-spacing-xxxs);max-height:250px;overflow:auto}.ap-autocomplete-search-results-loading{display:flex;padding:var(--ref-spacing-sm) 0;flex-direction:column;justify-content:center;align-items:center;gap:var(--ref-spacing-xs)}.ap-autocomplete-search-results-loading .search-results-loading-label{font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80)}.ap-autocomplete-search-results-not-found{padding:var(--ref-spacing-xs) var(--ref-spacing-sm);font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item{padding:var(--ref-spacing-xxs) var(--ref-spacing-sm)}.ap-autocomplete-search-results-item .option{display:flex;align-items:center;font-size:var(--comp-select-one-line-text-size);font-weight:var(--comp-select-one-line-text-font-weight);color:var(--comp-select-one-line-text-color);line-height:var(--comp-select-one-line-text-line-height);font-family:var(--comp-select-one-line-text-font-family);gap:var(--ref-spacing-xs);min-height:24px}.ap-autocomplete-search-results-item .option .option-item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item .option .texts{flex:1;overflow:auto}.ap-autocomplete-search-results-item .option .texts .first-line{display:flex}.ap-autocomplete-search-results-item .option .texts .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item .option.with-caption .texts{display:flex;flex-direction:column}.ap-autocomplete-search-results-item .option.with-caption .texts .label{color:var(--comp-select-two-line-title-text-color);font-size:var(--comp-select-two-line-title-text-size);line-height:var(--comp-select-two-line-title-text-line-height);font-weight:var(--comp-select-two-line-title-text-font-weight)}.ap-autocomplete-search-results-item .option.with-caption .texts .caption{color:var(--comp-select-two-line-caption-text-color);font-size:var(--comp-select-two-line-caption-text-size);line-height:var(--comp-select-two-line-caption-text-line-height);font-weight:var(--comp-select-two-line-caption-text-font-weight);display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item:hover{cursor:pointer;background-color:var(--ref-color-electric-blue-10)}.ap-autocomplete-search-results-item:active{background-color:var(--ref-color-electric-blue-20)}.ap-autocomplete-search-results-item:focus{background-color:var(--ref-color-electric-blue-20)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "component", type: FormFieldComponent, selector: "ap-form-field" }, { kind: "component", type: InputGroupComponent, selector: "ap-input-group", inputs: ["symbolPosition"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "ap-loader", inputs: ["color", "diameter"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: InputDirective, selector: "[apInput]" }, { kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["alternativeText", "anonymous", "username", "network", "online", "profilePicture", "showInitials", "alt", "rounded", "size"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
81
81
|
}
|
|
82
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
82
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AutocompleteComponent, decorators: [{
|
|
83
83
|
type: Component,
|
|
84
84
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-autocomplete', standalone: true, imports: [
|
|
85
85
|
NgIf,
|
|
@@ -92,8 +92,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.10", ngImpo
|
|
|
92
92
|
InputDirective,
|
|
93
93
|
AvatarComponent,
|
|
94
94
|
OverlayModule,
|
|
95
|
-
], encapsulation: ViewEncapsulation.None, template: "<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n size=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n", styles: ["ap-autocomplete{display:block}ap-autocomplete .input-autocomplete-wrapper{display:flex;flex-direction:column}ap-autocomplete .search-results-wrapper{position:relative}.ap-autocomplete-search-results{width:100%;display:flex;flex-direction:column;border-radius:var(--ref-border-radius-sm);box-shadow:var(--comp-select-shadow);padding:var(--comp-select-padding-vertical) 0;background-color:var(--comp-select-background-color);margin-top:var(--ref-spacing-xxxs);max-height:250px;overflow:auto}.ap-autocomplete-search-results-loading{display:flex;padding:var(--ref-spacing-sm) 0;flex-direction:column;justify-content:center;align-items:center;gap:var(--ref-spacing-xs)}.ap-autocomplete-search-results-loading .search-results-loading-label{font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80)}.ap-autocomplete-search-results-not-found{padding:var(--ref-spacing-xs) var(--ref-spacing-sm);font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item{padding:var(--ref-spacing-xxs) var(--ref-spacing-sm)}.ap-autocomplete-search-results-item .option{display:flex;align-items:center;font-size:var(--comp-select-one-line-text-size);font-weight:var(--comp-select-one-line-text-font-weight);color:var(--comp-select-one-line-text-color);line-height:var(--comp-select-one-line-text-line-height);font-family:var(--comp-select-one-line-text-font-family);gap:var(--ref-spacing-xs);min-height:24px}.ap-autocomplete-search-results-item .option .option-item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item .option .texts{flex:1;overflow:auto}.ap-autocomplete-search-results-item .option .texts .first-line{display:flex}.ap-autocomplete-search-results-item .option .texts .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item .option.with-caption .texts{display:flex;flex-direction:column}.ap-autocomplete-search-results-item .option.with-caption .texts .label{color:var(--comp-select-two-line-title-text-color);font-size:var(--comp-select-two-line-title-text-size);line-height:var(--comp-select-two-line-title-text-line-height);font-weight:var(--comp-select-two-line-title-text-font-weight)}.ap-autocomplete-search-results-item .option.with-caption .texts .caption{color:var(--comp-select-two-line-caption-text-color);font-size:var(--comp-select-two-line-caption-text-size);line-height:var(--comp-select-two-line-caption-text-line-height);font-weight:var(--comp-select-two-line-caption-text-font-weight);display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item:hover{cursor:pointer;background-color:var(--ref-color-electric-blue-10)}.ap-autocomplete-search-results-item:active{background-color:var(--ref-color-electric-blue-20)}.ap-autocomplete-search-results-item:focus{background-color:var(--ref-color-electric-blue-20)}\n"] }]
|
|
96
|
-
}], ctorParameters:
|
|
95
|
+
], encapsulation: ViewEncapsulation.None, template: "<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n [size]=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n", styles: ["ap-autocomplete{display:block}ap-autocomplete .input-autocomplete-wrapper{display:flex;flex-direction:column}ap-autocomplete .search-results-wrapper{position:relative}.ap-autocomplete-search-results{width:100%;display:flex;flex-direction:column;border-radius:var(--ref-border-radius-sm);box-shadow:var(--comp-select-shadow);padding:var(--comp-select-padding-vertical) 0;background-color:var(--comp-select-background-color);margin-top:var(--ref-spacing-xxxs);max-height:250px;overflow:auto}.ap-autocomplete-search-results-loading{display:flex;padding:var(--ref-spacing-sm) 0;flex-direction:column;justify-content:center;align-items:center;gap:var(--ref-spacing-xs)}.ap-autocomplete-search-results-loading .search-results-loading-label{font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80)}.ap-autocomplete-search-results-not-found{padding:var(--ref-spacing-xs) var(--ref-spacing-sm);font-style:italic;font-size:var(--ref-font-size-sm);color:var(--ref-color-grey-80);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item{padding:var(--ref-spacing-xxs) var(--ref-spacing-sm)}.ap-autocomplete-search-results-item .option{display:flex;align-items:center;font-size:var(--comp-select-one-line-text-size);font-weight:var(--comp-select-one-line-text-font-weight);color:var(--comp-select-one-line-text-color);line-height:var(--comp-select-one-line-text-line-height);font-family:var(--comp-select-one-line-text-font-family);gap:var(--ref-spacing-xs);min-height:24px}.ap-autocomplete-search-results-item .option .option-item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ap-autocomplete-search-results-item .option .texts{flex:1;overflow:auto}.ap-autocomplete-search-results-item .option .texts .first-line{display:flex}.ap-autocomplete-search-results-item .option .texts .label{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item .option.with-caption .texts{display:flex;flex-direction:column}.ap-autocomplete-search-results-item .option.with-caption .texts .label{color:var(--comp-select-two-line-title-text-color);font-size:var(--comp-select-two-line-title-text-size);line-height:var(--comp-select-two-line-title-text-line-height);font-weight:var(--comp-select-two-line-title-text-font-weight)}.ap-autocomplete-search-results-item .option.with-caption .texts .caption{color:var(--comp-select-two-line-caption-text-color);font-size:var(--comp-select-two-line-caption-text-size);line-height:var(--comp-select-two-line-caption-text-line-height);font-weight:var(--comp-select-two-line-caption-text-font-weight);display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.ap-autocomplete-search-results-item:hover{cursor:pointer;background-color:var(--ref-color-electric-blue-10)}.ap-autocomplete-search-results-item:active{background-color:var(--ref-color-electric-blue-20)}.ap-autocomplete-search-results-item:focus{background-color:var(--ref-color-electric-blue-20)}\n"] }]
|
|
96
|
+
}], ctorParameters: () => [], propDecorators: { placeholder: [{
|
|
97
97
|
type: Input
|
|
98
98
|
}], label: [{
|
|
99
99
|
type: Input
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-autocomplete.mjs","sources":["../../../libs/ui-components/autocomplete/src/autocomplete.component.ts","../../../libs/ui-components/autocomplete/src/autocomplete.component.html","../../../libs/ui-components/autocomplete/src/agorapulse-ui-components-autocomplete.ts"],"sourcesContent":["import { LoaderComponent } from '@agorapulse/ui-animations';\nimport { AvatarComponent } from '@agorapulse/ui-components/avatar';\nimport { FormFieldComponent } from '@agorapulse/ui-components/form-field';\nimport { InputDirective } from '@agorapulse/ui-components/input';\nimport { InputGroupComponent } from '@agorapulse/ui-components/input-group';\nimport { SymbolComponent, SymbolRegistry, apSearchAlternate } from '@agorapulse/ui-symbol';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { NgForOf, NgIf } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n Input,\n NgZone,\n Output,\n TemplateRef,\n ViewChild,\n ViewEncapsulation,\n inject,\n signal,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { FormsModule } from '@angular/forms';\nimport { BehaviorSubject, Observable, debounceTime, distinctUntilChanged, filter, fromEvent, skip, switchMap, tap } from 'rxjs';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-autocomplete',\n styleUrls: ['./autocomplete.component.scss'],\n standalone: true,\n imports: [\n NgIf,\n SymbolComponent,\n FormFieldComponent,\n InputGroupComponent,\n FormsModule,\n LoaderComponent,\n NgForOf,\n InputDirective,\n AvatarComponent,\n OverlayModule,\n ],\n templateUrl: './autocomplete.component.html',\n encapsulation: ViewEncapsulation.None,\n})\nexport class AutocompleteComponent<T extends Record<string, unknown> | string> implements AfterViewInit {\n @Input() placeholder = 'Search...';\n @Input() label = '';\n @Input() inputId = '';\n @Input() loadingText = 'Loading Items';\n @Input() notFoundText = 'No result found';\n @Input({ required: true }) searchFn!: (term: string) => Observable<T[]>;\n @Input() trackByFn: (index: number, item: T) => T | T[keyof T] = (_: number, item: T) => item;\n @Input() set disabled(value: boolean) {\n this.disabledSignal.set(value);\n }\n @Input() optionLabel?: string;\n @Input() optionCaption?: string;\n @Input() optionImageUrl?: string;\n @Input() optionValue?: string;\n @Input() optionTextTemplate?: TemplateRef<{ option: T }>;\n\n @ViewChild('formField', { read: ElementRef }) formField!: ElementRef<FormFieldComponent>;\n\n @Output()\n selectOption: EventEmitter<unknown> = new EventEmitter<unknown>();\n\n readonly disabledSignal = signal(false);\n readonly symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n readonly searchTerm$ = new BehaviorSubject<string>('');\n readonly searchTermSignal = toSignal(this.searchTerm$);\n readonly showResultsSignal = signal(false);\n readonly resultsLoadingSignal = signal(false);\n readonly searchResultsSignal = toSignal<any[]>(\n this.searchTerm$.pipe(\n skip(1),\n debounceTime(250),\n distinctUntilChanged(),\n tap(() => this.showResultsSignal.set(false)),\n filter(term => term.length > 0),\n tap(() => this.showResultsSignal.set(true)),\n tap(() => this.resultsLoadingSignal.set(true)),\n switchMap(term => {\n return this.searchFn(term);\n }),\n tap(() => this.resultsLoadingSignal.set(false))\n )\n );\n private readonly ngZone = inject(NgZone);\n private readonly el = inject(ElementRef);\n readonly inputWidthSignal = signal(0);\n\n constructor() {\n this.symbolRegistry.registerSymbols([apSearchAlternate]);\n this.ngZone.runOutsideAngular(() => {\n fromEvent(document, 'click')\n .pipe(takeUntilDestroyed())\n .subscribe(e => {\n const clickedInside = this.el.nativeElement.contains(e.target);\n if (!clickedInside) {\n this.ngZone.run(() => {\n this.resetAutocomplete();\n });\n }\n });\n });\n }\n\n ngAfterViewInit(): void {\n this.inputWidthSignal.set((this.formField.nativeElement as HTMLElement).offsetWidth);\n }\n\n onSelectOption(option: T) {\n if (typeof option !== 'string' && this.optionValue && option[this.optionValue]) {\n this.selectOption.emit(option[this.optionValue]);\n } else {\n this.selectOption.emit(option);\n }\n this.resetAutocomplete();\n }\n\n private resetAutocomplete() {\n this.searchTerm$.next('');\n this.showResultsSignal.set(false);\n this.resultsLoadingSignal.set(false);\n }\n}\n","<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n size=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-autocomplete.mjs","sources":["../../../libs/ui-components/autocomplete/src/autocomplete.component.ts","../../../libs/ui-components/autocomplete/src/autocomplete.component.html","../../../libs/ui-components/autocomplete/src/agorapulse-ui-components-autocomplete.ts"],"sourcesContent":["import { LoaderComponent } from '@agorapulse/ui-animations';\nimport { AvatarComponent } from '@agorapulse/ui-components/avatar';\nimport { FormFieldComponent } from '@agorapulse/ui-components/form-field';\nimport { InputDirective } from '@agorapulse/ui-components/input';\nimport { InputGroupComponent } from '@agorapulse/ui-components/input-group';\nimport { SymbolComponent, SymbolRegistry, apSearchAlternate } from '@agorapulse/ui-symbol';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { NgForOf, NgIf } from '@angular/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n Input,\n NgZone,\n Output,\n TemplateRef,\n ViewChild,\n ViewEncapsulation,\n inject,\n signal,\n} from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { FormsModule } from '@angular/forms';\nimport { BehaviorSubject, Observable, debounceTime, distinctUntilChanged, filter, fromEvent, skip, switchMap, tap } from 'rxjs';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-autocomplete',\n styleUrls: ['./autocomplete.component.scss'],\n standalone: true,\n imports: [\n NgIf,\n SymbolComponent,\n FormFieldComponent,\n InputGroupComponent,\n FormsModule,\n LoaderComponent,\n NgForOf,\n InputDirective,\n AvatarComponent,\n OverlayModule,\n ],\n templateUrl: './autocomplete.component.html',\n encapsulation: ViewEncapsulation.None,\n})\nexport class AutocompleteComponent<T extends Record<string, unknown> | string> implements AfterViewInit {\n @Input() placeholder = 'Search...';\n @Input() label = '';\n @Input() inputId = '';\n @Input() loadingText = 'Loading Items';\n @Input() notFoundText = 'No result found';\n @Input({ required: true }) searchFn!: (term: string) => Observable<T[]>;\n @Input() trackByFn: (index: number, item: T) => T | T[keyof T] = (_: number, item: T) => item;\n @Input() set disabled(value: boolean) {\n this.disabledSignal.set(value);\n }\n @Input() optionLabel?: string;\n @Input() optionCaption?: string;\n @Input() optionImageUrl?: string;\n @Input() optionValue?: string;\n @Input() optionTextTemplate?: TemplateRef<{ option: T }>;\n\n @ViewChild('formField', { read: ElementRef }) formField!: ElementRef<FormFieldComponent>;\n\n @Output()\n selectOption: EventEmitter<unknown> = new EventEmitter<unknown>();\n\n readonly disabledSignal = signal(false);\n readonly symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n readonly searchTerm$ = new BehaviorSubject<string>('');\n readonly searchTermSignal = toSignal(this.searchTerm$);\n readonly showResultsSignal = signal(false);\n readonly resultsLoadingSignal = signal(false);\n readonly searchResultsSignal = toSignal<any[]>(\n this.searchTerm$.pipe(\n skip(1),\n debounceTime(250),\n distinctUntilChanged(),\n tap(() => this.showResultsSignal.set(false)),\n filter(term => term.length > 0),\n tap(() => this.showResultsSignal.set(true)),\n tap(() => this.resultsLoadingSignal.set(true)),\n switchMap(term => {\n return this.searchFn(term);\n }),\n tap(() => this.resultsLoadingSignal.set(false))\n )\n );\n private readonly ngZone = inject(NgZone);\n private readonly el = inject(ElementRef);\n readonly inputWidthSignal = signal(0);\n\n constructor() {\n this.symbolRegistry.registerSymbols([apSearchAlternate]);\n this.ngZone.runOutsideAngular(() => {\n fromEvent(document, 'click')\n .pipe(takeUntilDestroyed())\n .subscribe(e => {\n const clickedInside = this.el.nativeElement.contains(e.target);\n if (!clickedInside) {\n this.ngZone.run(() => {\n this.resetAutocomplete();\n });\n }\n });\n });\n }\n\n ngAfterViewInit(): void {\n this.inputWidthSignal.set((this.formField.nativeElement as HTMLElement).offsetWidth);\n }\n\n onSelectOption(option: T) {\n if (typeof option !== 'string' && this.optionValue && option[this.optionValue]) {\n this.selectOption.emit(option[this.optionValue]);\n } else {\n this.selectOption.emit(option);\n }\n this.resetAutocomplete();\n }\n\n private resetAutocomplete() {\n this.searchTerm$.next('');\n this.showResultsSignal.set(false);\n this.resultsLoadingSignal.set(false);\n }\n}\n","<div class=\"input-autocomplete-wrapper\">\n <ap-form-field\n #formField\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin>\n <label [for]=\"inputId\">\n {{ label }}\n </label>\n <ap-input-group>\n <ap-symbol symbolId=\"search-alternate\" />\n <input\n apInput\n [id]=\"inputId\"\n [disabled]=\"disabledSignal()\"\n [placeholder]=\"placeholder\"\n [ngModel]=\"searchTermSignal()\"\n (ngModelChange)=\"searchTerm$.next($event)\" />\n </ap-input-group>\n </ap-form-field>\n <div class=\"search-results-wrapper\">\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayWidth]=\"inputWidthSignal()\"\n [cdkConnectedOverlayOpen]=\"showResultsSignal()\">\n <div class=\"ap-autocomplete-search-results\">\n <ng-container *ngIf=\"resultsLoadingSignal(); else results\">\n <div class=\"ap-autocomplete-search-results-loading\">\n <ap-loader [diameter]=\"30\" />\n <span class=\"search-results-loading-label\">{{ loadingText }}</span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </div>\n</div>\n<ng-template #results>\n <ng-container *ngIf=\"searchResultsSignal()?.length; else noResults\">\n <div\n *ngFor=\"let option of searchResultsSignal(); trackBy: trackByFn\"\n class=\"ap-autocomplete-search-results-item\"\n tabindex=\"0\"\n (keydown.enter)=\"onSelectOption(option)\"\n (click)=\"onSelectOption(option)\">\n <ng-container *ngIf=\"!optionTextTemplate; else customTemplate\">\n <ng-container *ngIf=\"!optionLabel || !option[optionLabel]\">\n <div class=\"option\">\n <span\n class=\"option-item\"\n [title]=\"option\">\n {{ option }}\n </span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div\n class=\"option\"\n [class.with-caption]=\"optionLabel && optionCaption && option[optionCaption]\">\n <ng-container *ngIf=\"!optionLabel\">\n <span class=\"item\">\n {{ option }}\n </span>\n </ng-container>\n <ng-container *ngIf=\"optionImageUrl\">\n <ap-avatar\n [size]=\"24\"\n [showInitials]=\"true\"\n [username]=\"optionLabel ? option[optionLabel] : option\"\n [profilePicture]=\"option[optionImageUrl]\" />\n </ng-container>\n <ng-container *ngIf=\"optionLabel && option[optionLabel]\">\n <div class=\"texts\">\n <div class=\"first-line\">\n <span\n class=\"label\"\n [title]=\"option[optionLabel]\">\n {{ option[optionLabel] }}\n </span>\n </div>\n <ng-container *ngIf=\"optionCaption && option[optionCaption]\">\n <span\n class=\"caption\"\n [title]=\"option[optionCaption]\">\n {{ option[optionCaption] }}\n </span>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #customTemplate>\n <ng-container *ngTemplateOutlet=\"optionTextTemplate; context: { option: option }\" />\n </ng-template>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #noResults>\n <div class=\"ap-autocomplete-search-results-not-found\">\n {{ notFoundText }}\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -100,8 +100,9 @@ class AvatarComponent {
|
|
|
100
100
|
this.roundedAvatar = rounded;
|
|
101
101
|
this.rounded$.next(rounded);
|
|
102
102
|
}
|
|
103
|
+
// TODO - migrate to signal input and remove size input
|
|
103
104
|
set size(size) {
|
|
104
|
-
this.size$.next(size);
|
|
105
|
+
this.size$.next(+size);
|
|
105
106
|
this.elementRef.nativeElement.style.setProperty('--ap-avatar-size', `${size}px`);
|
|
106
107
|
this.elementRef.nativeElement.style.setProperty('--ap-avatar-symbol-size', `${symbolSizeByAvatarSize[size]}px`);
|
|
107
108
|
this.elementRef.nativeElement.style.setProperty('--ap-avatar-online-icon-size', `${onlineIconSizeByAvatarSize[size]}px`);
|
|
@@ -184,13 +185,13 @@ class AvatarComponent {
|
|
|
184
185
|
onImageError() {
|
|
185
186
|
this.imageError$.next(true);
|
|
186
187
|
}
|
|
187
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "
|
|
188
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AvatarComponent, deps: [{ token: i1.SymbolRegistry }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
189
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.3", type: AvatarComponent, isStandalone: true, selector: "ap-avatar", inputs: { alternativeText: "alternativeText", anonymous: "anonymous", username: "username", network: "network", online: "online", profilePicture: "profilePicture", showInitials: "showInitials", alt: "alt", rounded: ["rounded", "rounded", booleanAttribute], size: "size" }, host: { properties: { "class.rounded-avatar": "this.roundedAvatar" } }, ngImport: i0, template: "<ng-container\n *ngrxLet=\"{\n displayProfilePicture: displayProfilePicture$,\n displaySingleNeutralSvg: displaySingleNeutralSvg$,\n displayInitials: displayInitials$,\n displayAnonymous: displayAnonymous$,\n displayOnline: displayOnline$,\n displayNetwork: displayNetwork$,\n initials: initials$,\n profilePicture: profilePicture$,\n size: size$,\n network: network$\n } as avatarViewModel\">\n <img\n *ngIf=\"avatarViewModel.displayProfilePicture\"\n [src]=\"avatarViewModel.profilePicture\"\n [width]=\"avatarViewModel.size\"\n [height]=\"avatarViewModel.size\"\n [alt]=\"alt\"\n (error)=\"onImageError()\" />\n <div\n *ngIf=\"avatarViewModel.displaySingleNeutralSvg\"\n class=\"no-profile-picture\">\n <ap-symbol symbolId=\"single-neutral\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayAnonymous\"\n class=\"anonymous\">\n <ap-symbol symbolId=\"show-theater-mask-happy\" />\n </div>\n <div\n *ngIf=\"avatarViewModel.displayOnline\"\n class=\"online\"></div>\n <div\n *ngIf=\"avatarViewModel.displayNetwork\"\n class=\"network\"\n [class.facebook]=\"avatarViewModel.network === 'facebook'\"\n [class.linkedin]=\"avatarViewModel.network === 'linkedin'\"\n [class.twitter]=\"avatarViewModel.network === 'twitter'\"\n [class.x]=\"avatarViewModel.network === 'X'\"\n [class.youtube]=\"avatarViewModel.network === 'youtube'\"\n [class.googleMyBusiness]=\"avatarViewModel.network === 'googleMyBusiness' || avatarViewModel.network === 'google'\"\n [class.instagram]=\"avatarViewModel.network === 'instagram'\"\n [class.tiktok]=\"avatarViewModel.network === 'tiktok'\"\n [class.pinterest]=\"avatarViewModel.network === 'pinterest'\"\n [class.web]=\"avatarViewModel.network === 'webBlog' || avatarViewModel.network === 'webNews'\">\n <ap-symbol\n *ngIf=\"avatarViewModel.network\"\n [symbolId]=\"networkSymbolByNetwork[avatarViewModel.network]\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayInitials\"\n class=\"initials\">\n {{ avatarViewModel.initials }}\n </div>\n</ng-container>\n", styles: ["ap-avatar{display:flex;justify-content:center;align-items:center;height:var(--ap-avatar-size);min-height:var(--ap-avatar-size);max-height:var(--ap-avatar-size);width:var(--ap-avatar-size);min-width:var(--ap-avatar-size);max-width:var(--ap-avatar-size);border-radius:var(--sys-border-radius-sm);background:var(--ref-color-grey-40);box-sizing:border-box;position:relative;box-shadow:0 0 0 1px var(--ref-color-grey-10)}ap-avatar.rounded-avatar{border-radius:100%}ap-avatar.rounded-avatar img,ap-avatar.rounded-avatar .no-profile-picture,ap-avatar.rounded-avatar .anonymous{border-radius:100%}ap-avatar img{overflow:hidden;border-radius:var(--sys-border-radius-sm);box-sizing:border-box}ap-avatar .no-profile-picture,ap-avatar .anonymous{display:flex;justify-content:center;align-items:center;background:var(--ref-color-grey-40);border-radius:var(--sys-border-radius-sm)}ap-avatar .no-profile-picture ap-symbol,ap-avatar .anonymous ap-symbol{color:var(--ref-color-white);width:var(--ap-avatar-symbol-size);min-width:var(--ap-avatar-symbol-size);max-width:var(--ap-avatar-symbol-size);height:var(--ap-avatar-symbol-size);min-height:var(--ap-avatar-symbol-size);max-height:var(--ap-avatar-symbol-size)}ap-avatar .anonymous{margin-top:7%}ap-avatar .online{position:absolute;height:var(--ap-avatar-online-icon-size);min-height:var(--ap-avatar-online-icon-size);max-height:var(--ap-avatar-online-icon-size);width:var(--ap-avatar-online-icon-size);min-width:var(--ap-avatar-online-icon-size);max-width:var(--ap-avatar-online-icon-size);border-radius:100%;overflow:hidden;background:var(--ref-color-grey-40);box-sizing:border-box;border:1px solid var(--ref-color-white);bottom:0;right:0;background:var(--ref-color-green-100)}ap-avatar .initials{font-weight:var(--ref-font-weight-bold);font-size:var(--ap-avatar-initials-size);line-height:var(--ref-font-line-height-xl);font-family:Averta;color:var(--ref-color-white)}ap-avatar .network{position:absolute;height:var(--ap-avatar-online-icon-size);min-height:var(--ap-avatar-network-size);max-height:var(--ap-avatar-network-size);width:var(--ap-avatar-network-size);min-width:var(--ap-avatar-network-size);max-width:var(--ap-avatar-network-size);overflow:hidden;box-sizing:border-box;bottom:0;right:0;box-shadow:0 0 0 1px var(--ref-color-grey-10)}ap-avatar .network.facebook,ap-avatar .network.twitter,ap-avatar .network.youtube,ap-avatar .network.tiktok,ap-avatar .network.x,ap-avatar .network.pinterest,ap-avatar .network.web{border-radius:100%}ap-avatar .network.instagram{border-radius:28%}ap-avatar .network.linkedin{border-radius:6%}ap-avatar .network.googleMyBusiness,ap-avatar .network.google{box-shadow:none;border-radius:unset}ap-avatar .network ap-symbol img{border-radius:0;border:none}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "directive", type: LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet", "ngrxLetSuspenseTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
189
190
|
}
|
|
190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
191
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: AvatarComponent, decorators: [{
|
|
191
192
|
type: Component,
|
|
192
193
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-avatar', standalone: true, imports: [NgIf, NgForOf, NgOptimizedImage, SymbolComponent, LetDirective], encapsulation: ViewEncapsulation.None, template: "<ng-container\n *ngrxLet=\"{\n displayProfilePicture: displayProfilePicture$,\n displaySingleNeutralSvg: displaySingleNeutralSvg$,\n displayInitials: displayInitials$,\n displayAnonymous: displayAnonymous$,\n displayOnline: displayOnline$,\n displayNetwork: displayNetwork$,\n initials: initials$,\n profilePicture: profilePicture$,\n size: size$,\n network: network$\n } as avatarViewModel\">\n <img\n *ngIf=\"avatarViewModel.displayProfilePicture\"\n [src]=\"avatarViewModel.profilePicture\"\n [width]=\"avatarViewModel.size\"\n [height]=\"avatarViewModel.size\"\n [alt]=\"alt\"\n (error)=\"onImageError()\" />\n <div\n *ngIf=\"avatarViewModel.displaySingleNeutralSvg\"\n class=\"no-profile-picture\">\n <ap-symbol symbolId=\"single-neutral\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayAnonymous\"\n class=\"anonymous\">\n <ap-symbol symbolId=\"show-theater-mask-happy\" />\n </div>\n <div\n *ngIf=\"avatarViewModel.displayOnline\"\n class=\"online\"></div>\n <div\n *ngIf=\"avatarViewModel.displayNetwork\"\n class=\"network\"\n [class.facebook]=\"avatarViewModel.network === 'facebook'\"\n [class.linkedin]=\"avatarViewModel.network === 'linkedin'\"\n [class.twitter]=\"avatarViewModel.network === 'twitter'\"\n [class.x]=\"avatarViewModel.network === 'X'\"\n [class.youtube]=\"avatarViewModel.network === 'youtube'\"\n [class.googleMyBusiness]=\"avatarViewModel.network === 'googleMyBusiness' || avatarViewModel.network === 'google'\"\n [class.instagram]=\"avatarViewModel.network === 'instagram'\"\n [class.tiktok]=\"avatarViewModel.network === 'tiktok'\"\n [class.pinterest]=\"avatarViewModel.network === 'pinterest'\"\n [class.web]=\"avatarViewModel.network === 'webBlog' || avatarViewModel.network === 'webNews'\">\n <ap-symbol\n *ngIf=\"avatarViewModel.network\"\n [symbolId]=\"networkSymbolByNetwork[avatarViewModel.network]\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayInitials\"\n class=\"initials\">\n {{ avatarViewModel.initials }}\n </div>\n</ng-container>\n", styles: ["ap-avatar{display:flex;justify-content:center;align-items:center;height:var(--ap-avatar-size);min-height:var(--ap-avatar-size);max-height:var(--ap-avatar-size);width:var(--ap-avatar-size);min-width:var(--ap-avatar-size);max-width:var(--ap-avatar-size);border-radius:var(--sys-border-radius-sm);background:var(--ref-color-grey-40);box-sizing:border-box;position:relative;box-shadow:0 0 0 1px var(--ref-color-grey-10)}ap-avatar.rounded-avatar{border-radius:100%}ap-avatar.rounded-avatar img,ap-avatar.rounded-avatar .no-profile-picture,ap-avatar.rounded-avatar .anonymous{border-radius:100%}ap-avatar img{overflow:hidden;border-radius:var(--sys-border-radius-sm);box-sizing:border-box}ap-avatar .no-profile-picture,ap-avatar .anonymous{display:flex;justify-content:center;align-items:center;background:var(--ref-color-grey-40);border-radius:var(--sys-border-radius-sm)}ap-avatar .no-profile-picture ap-symbol,ap-avatar .anonymous ap-symbol{color:var(--ref-color-white);width:var(--ap-avatar-symbol-size);min-width:var(--ap-avatar-symbol-size);max-width:var(--ap-avatar-symbol-size);height:var(--ap-avatar-symbol-size);min-height:var(--ap-avatar-symbol-size);max-height:var(--ap-avatar-symbol-size)}ap-avatar .anonymous{margin-top:7%}ap-avatar .online{position:absolute;height:var(--ap-avatar-online-icon-size);min-height:var(--ap-avatar-online-icon-size);max-height:var(--ap-avatar-online-icon-size);width:var(--ap-avatar-online-icon-size);min-width:var(--ap-avatar-online-icon-size);max-width:var(--ap-avatar-online-icon-size);border-radius:100%;overflow:hidden;background:var(--ref-color-grey-40);box-sizing:border-box;border:1px solid var(--ref-color-white);bottom:0;right:0;background:var(--ref-color-green-100)}ap-avatar .initials{font-weight:var(--ref-font-weight-bold);font-size:var(--ap-avatar-initials-size);line-height:var(--ref-font-line-height-xl);font-family:Averta;color:var(--ref-color-white)}ap-avatar .network{position:absolute;height:var(--ap-avatar-online-icon-size);min-height:var(--ap-avatar-network-size);max-height:var(--ap-avatar-network-size);width:var(--ap-avatar-network-size);min-width:var(--ap-avatar-network-size);max-width:var(--ap-avatar-network-size);overflow:hidden;box-sizing:border-box;bottom:0;right:0;box-shadow:0 0 0 1px var(--ref-color-grey-10)}ap-avatar .network.facebook,ap-avatar .network.twitter,ap-avatar .network.youtube,ap-avatar .network.tiktok,ap-avatar .network.x,ap-avatar .network.pinterest,ap-avatar .network.web{border-radius:100%}ap-avatar .network.instagram{border-radius:28%}ap-avatar .network.linkedin{border-radius:6%}ap-avatar .network.googleMyBusiness,ap-avatar .network.google{box-shadow:none;border-radius:unset}ap-avatar .network ap-symbol img{border-radius:0;border:none}\n"] }]
|
|
193
|
-
}], ctorParameters:
|
|
194
|
+
}], ctorParameters: () => [{ type: i1.SymbolRegistry }, { type: i0.ElementRef }], propDecorators: { alternativeText: [{
|
|
194
195
|
type: Input
|
|
195
196
|
}], anonymous: [{
|
|
196
197
|
type: Input
|
|
@@ -215,10 +216,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.10", ngImpo
|
|
|
215
216
|
transform: booleanAttribute,
|
|
216
217
|
}]
|
|
217
218
|
}], size: [{
|
|
218
|
-
type: Input
|
|
219
|
-
args: [{
|
|
220
|
-
transform: avatarSizeAttribute,
|
|
221
|
-
}]
|
|
219
|
+
type: Input
|
|
222
220
|
}] } });
|
|
223
221
|
|
|
224
222
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-avatar.mjs","sources":["../../../libs/ui-components/avatar/src/avatar.component.ts","../../../libs/ui-components/avatar/src/avatar.component.html","../../../libs/ui-components/avatar/src/agorapulse-ui-components-avatar.ts"],"sourcesContent":["import {\n SymbolComponent,\n SymbolRegistry,\n apFacebookOfficial,\n apGoogleMyBusinessOfficial,\n apLinkedinOfficial,\n apPinterestOfficial,\n apShowTheaterMaskHappy,\n apSingleNeutral,\n apTiktokOfficial,\n apWebBlogs,\n apWebNews,\n apXOfficial,\n apYoutubeOfficial,\n} from '@agorapulse/ui-symbol';\nimport { NgForOf, NgIf, NgOptimizedImage } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n HostBinding,\n Input,\n OnInit,\n ViewEncapsulation,\n booleanAttribute,\n} from '@angular/core';\nimport { LetDirective } from '@ngrx/component';\nimport { BehaviorSubject, Observable, combineLatest, map, of } from 'rxjs';\n\nexport type AvatarSize = 56 | 48 | 40 | 36 | 32 | 24 | 16;\nexport type AvatarNetwork =\n | 'facebook'\n | 'instagram'\n | 'twitter'\n | 'linkedin'\n | 'tiktok'\n | 'youtube'\n | 'pinterest'\n | 'googleMyBusiness'\n | 'google'\n | 'webNews'\n | 'webBlog'\n | 'X';\n\nconst onlineIconSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 16,\n 48: 12,\n 40: 12,\n 36: 8,\n 32: 8,\n 24: 6,\n 16: 6,\n};\n\nconst symbolSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 28,\n 48: 24,\n 40: 20,\n 36: 18,\n 32: 16,\n 24: 12,\n 16: 8,\n};\n\nconst networkSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 16,\n 48: 16,\n 40: 16,\n 36: 16,\n 32: 12,\n 24: 12,\n 16: 8,\n};\n\nconst initialSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 28,\n 48: 24,\n 40: 22,\n 36: 18,\n 32: 18,\n 24: 14,\n 16: 10,\n};\n\nfunction avatarSizeAttribute(value: AvatarSize | `${AvatarSize}`): AvatarSize {\n return +value as AvatarSize;\n}\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-avatar',\n styleUrls: ['./avatar.component.scss'],\n standalone: true,\n imports: [NgIf, NgForOf, NgOptimizedImage, SymbolComponent, LetDirective],\n templateUrl: './avatar.component.html',\n encapsulation: ViewEncapsulation.None,\n})\nexport class AvatarComponent implements OnInit {\n readonly networkSymbolByNetwork: Record<AvatarNetwork, string> = {\n facebook: 'facebook-official',\n instagram: 'instagram-official',\n X: 'x-official',\n twitter: 'x-official',\n linkedin: 'linkedin-official',\n tiktok: 'tiktok-official',\n youtube: 'youtube-official',\n pinterest: 'pinterest-official',\n googleMyBusiness: 'google-my-business-official',\n google: 'google-my-business-official',\n webNews: 'web-news',\n webBlog: 'web-blogs',\n };\n\n size$: BehaviorSubject<AvatarSize> = new BehaviorSubject<AvatarSize>(40);\n profilePicture$: BehaviorSubject<string | undefined> = new BehaviorSubject<string | undefined>('');\n network$: BehaviorSubject<AvatarNetwork | undefined> = new BehaviorSubject<AvatarNetwork | undefined>(undefined);\n\n private alternativeText$: BehaviorSubject<string> = new BehaviorSubject<string>('');\n private anonymous$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private username$: BehaviorSubject<string> = new BehaviorSubject<string>('');\n private online$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private showInitials$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private rounded$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);\n\n @Input() set alternativeText(alternativeText: string) {\n this.alternativeText$.next(alternativeText);\n }\n\n @Input() set anonymous(anonymous: boolean) {\n this.anonymous$.next(anonymous);\n }\n\n @Input() set username(username: string) {\n this.username$.next(username);\n }\n\n @Input() set network(network: AvatarNetwork | undefined) {\n this.network$.next(network);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-network-size', `${networkSizeByAvatarSize[this.size$.value]}px`);\n }\n\n @Input() set online(online: boolean) {\n this.online$.next(online);\n }\n\n @Input() set profilePicture(profilePicture: string | undefined) {\n this.profilePicture$.next(profilePicture);\n this.imageError$.next(false);\n }\n\n @Input() set showInitials(showInitials: boolean) {\n this.showInitials$.next(showInitials);\n }\n @Input() alt = '';\n\n @HostBinding('class.rounded-avatar')\n roundedAvatar = true;\n\n @Input({\n transform: booleanAttribute,\n })\n set rounded(rounded: boolean) {\n this.roundedAvatar = rounded;\n this.rounded$.next(rounded);\n }\n\n @Input({\n transform: avatarSizeAttribute,\n })\n set size(size: AvatarSize) {\n this.size$.next(size);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-size', `${size}px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-symbol-size', `${symbolSizeByAvatarSize[size]}px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-online-icon-size', `${onlineIconSizeByAvatarSize[size]}px`);\n }\n\n displayProfilePicture$: Observable<boolean> = new Observable<boolean>();\n displaySingleNeutralSvg$: Observable<boolean> = new Observable<boolean>();\n displayInitials$: Observable<boolean> = new Observable<boolean>();\n displayAnonymous$: Observable<boolean> = new Observable<boolean>();\n displayNetwork$: Observable<boolean> = new Observable<boolean>();\n displayOnline$: Observable<boolean> = new Observable<boolean>();\n imageError$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n initials$: Observable<string> = new Observable<string>();\n initialsAvailable$: Observable<boolean> = of(false);\n\n constructor(private symbolRegistry: SymbolRegistry, private elementRef: ElementRef) {\n this.symbolRegistry.registerSymbols([\n apSingleNeutral,\n apShowTheaterMaskHappy,\n apFacebookOfficial,\n apLinkedinOfficial,\n apYoutubeOfficial,\n apTiktokOfficial,\n apGoogleMyBusinessOfficial,\n apPinterestOfficial,\n apXOfficial,\n apWebBlogs,\n apWebNews,\n ]);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-size', `40px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-symbol-size', `${symbolSizeByAvatarSize[this.size$.value]}px`);\n }\n\n ngOnInit(): void {\n this.initialsAvailable$ = this.username$.pipe(\n map(username => {\n return !!username;\n })\n );\n\n this.displayProfilePicture$ = combineLatest([this.profilePicture$, this.anonymous$, this.imageError$, this.showInitials$]).pipe(\n map(([profilePicture, anonymous, imageError]) => {\n return !!profilePicture && !anonymous && !imageError;\n })\n );\n\n this.displayInitials$ = combineLatest([\n this.showInitials$,\n this.anonymous$,\n this.initialsAvailable$,\n this.displayProfilePicture$,\n ]).pipe(\n map(([showInitials, anonymous, initialsAvailable, displayProfilePicture]) => {\n return showInitials && !anonymous && initialsAvailable && !displayProfilePicture;\n })\n );\n\n this.displaySingleNeutralSvg$ = combineLatest([\n this.profilePicture$,\n this.imageError$,\n this.initialsAvailable$,\n this.showInitials$,\n this.anonymous$,\n this.displayInitials$,\n this.displayProfilePicture$,\n ]).pipe(\n map(([profilePicture, imageError, initialsAvailable, showInitials, anonymous, displayInitials, displayProfilePicture]) => {\n return (\n (!profilePicture || imageError || !initialsAvailable || (initialsAvailable && !showInitials)) &&\n !anonymous &&\n !displayInitials &&\n !displayProfilePicture\n );\n })\n );\n\n this.displayAnonymous$ = combineLatest([this.anonymous$, this.rounded$]).pipe(\n map(([anonymous, rounded]) => {\n return anonymous && rounded;\n })\n );\n\n this.displayOnline$ = combineLatest([this.online$, this.rounded$]).pipe(\n map(([online, rounded]) => {\n return online && rounded;\n })\n );\n\n this.displayNetwork$ = combineLatest([this.network$, this.rounded$]).pipe(\n map(([network, rounded]) => {\n return !!network && rounded;\n })\n );\n\n this.initials$ = combineLatest([this.displayInitials$, this.username$]).pipe(\n map(([displayInitials, username]) => {\n if ((displayInitials && !username) || !displayInitials) {\n return '';\n }\n this.elementRef.nativeElement.style.setProperty(\n '--ap-avatar-initials-size',\n `${initialSizeByAvatarSize[this.size$.value]}px`\n );\n const names = username?.split(' ');\n return `${names[0].charAt(0).toUpperCase()}`;\n })\n );\n }\n\n onImageError(): void {\n this.imageError$.next(true);\n }\n}\n","<ng-container\n *ngrxLet=\"{\n displayProfilePicture: displayProfilePicture$,\n displaySingleNeutralSvg: displaySingleNeutralSvg$,\n displayInitials: displayInitials$,\n displayAnonymous: displayAnonymous$,\n displayOnline: displayOnline$,\n displayNetwork: displayNetwork$,\n initials: initials$,\n profilePicture: profilePicture$,\n size: size$,\n network: network$\n } as avatarViewModel\">\n <img\n *ngIf=\"avatarViewModel.displayProfilePicture\"\n [src]=\"avatarViewModel.profilePicture\"\n [width]=\"avatarViewModel.size\"\n [height]=\"avatarViewModel.size\"\n [alt]=\"alt\"\n (error)=\"onImageError()\" />\n <div\n *ngIf=\"avatarViewModel.displaySingleNeutralSvg\"\n class=\"no-profile-picture\">\n <ap-symbol symbolId=\"single-neutral\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayAnonymous\"\n class=\"anonymous\">\n <ap-symbol symbolId=\"show-theater-mask-happy\" />\n </div>\n <div\n *ngIf=\"avatarViewModel.displayOnline\"\n class=\"online\"></div>\n <div\n *ngIf=\"avatarViewModel.displayNetwork\"\n class=\"network\"\n [class.facebook]=\"avatarViewModel.network === 'facebook'\"\n [class.linkedin]=\"avatarViewModel.network === 'linkedin'\"\n [class.twitter]=\"avatarViewModel.network === 'twitter'\"\n [class.x]=\"avatarViewModel.network === 'X'\"\n [class.youtube]=\"avatarViewModel.network === 'youtube'\"\n [class.googleMyBusiness]=\"avatarViewModel.network === 'googleMyBusiness' || avatarViewModel.network === 'google'\"\n [class.instagram]=\"avatarViewModel.network === 'instagram'\"\n [class.tiktok]=\"avatarViewModel.network === 'tiktok'\"\n [class.pinterest]=\"avatarViewModel.network === 'pinterest'\"\n [class.web]=\"avatarViewModel.network === 'webBlog' || avatarViewModel.network === 'webNews'\">\n <ap-symbol\n *ngIf=\"avatarViewModel.network\"\n [symbolId]=\"networkSymbolByNetwork[avatarViewModel.network]\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayInitials\"\n class=\"initials\">\n {{ avatarViewModel.initials }}\n </div>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-avatar.mjs","sources":["../../../libs/ui-components/avatar/src/avatar.component.ts","../../../libs/ui-components/avatar/src/avatar.component.html","../../../libs/ui-components/avatar/src/agorapulse-ui-components-avatar.ts"],"sourcesContent":["import {\n SymbolComponent,\n SymbolRegistry,\n apFacebookOfficial,\n apGoogleMyBusinessOfficial,\n apLinkedinOfficial,\n apPinterestOfficial,\n apShowTheaterMaskHappy,\n apSingleNeutral,\n apTiktokOfficial,\n apWebBlogs,\n apWebNews,\n apXOfficial,\n apYoutubeOfficial,\n} from '@agorapulse/ui-symbol';\nimport { NgForOf, NgIf, NgOptimizedImage } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n HostBinding,\n Input,\n OnInit,\n ViewEncapsulation,\n booleanAttribute,\n} from '@angular/core';\nimport { LetDirective } from '@ngrx/component';\nimport { BehaviorSubject, Observable, combineLatest, map, of } from 'rxjs';\n\nexport type AvatarSize = 56 | 48 | 40 | 36 | 32 | 24 | 16;\nexport type AvatarNetwork =\n | 'facebook'\n | 'instagram'\n | 'twitter'\n | 'linkedin'\n | 'tiktok'\n | 'youtube'\n | 'pinterest'\n | 'googleMyBusiness'\n | 'google'\n | 'webNews'\n | 'webBlog'\n | 'X';\n\nconst onlineIconSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 16,\n 48: 12,\n 40: 12,\n 36: 8,\n 32: 8,\n 24: 6,\n 16: 6,\n};\n\nconst symbolSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 28,\n 48: 24,\n 40: 20,\n 36: 18,\n 32: 16,\n 24: 12,\n 16: 8,\n};\n\nconst networkSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 16,\n 48: 16,\n 40: 16,\n 36: 16,\n 32: 12,\n 24: 12,\n 16: 8,\n};\n\nconst initialSizeByAvatarSize: Record<AvatarSize, number> = {\n 56: 28,\n 48: 24,\n 40: 22,\n 36: 18,\n 32: 18,\n 24: 14,\n 16: 10,\n};\n\nfunction avatarSizeAttribute(value: AvatarSize | `${AvatarSize}`): any {\n return +value as any;\n}\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-avatar',\n styleUrls: ['./avatar.component.scss'],\n standalone: true,\n imports: [NgIf, NgForOf, NgOptimizedImage, SymbolComponent, LetDirective],\n templateUrl: './avatar.component.html',\n encapsulation: ViewEncapsulation.None,\n})\nexport class AvatarComponent implements OnInit {\n readonly networkSymbolByNetwork: Record<AvatarNetwork, string> = {\n facebook: 'facebook-official',\n instagram: 'instagram-official',\n X: 'x-official',\n twitter: 'x-official',\n linkedin: 'linkedin-official',\n tiktok: 'tiktok-official',\n youtube: 'youtube-official',\n pinterest: 'pinterest-official',\n googleMyBusiness: 'google-my-business-official',\n google: 'google-my-business-official',\n webNews: 'web-news',\n webBlog: 'web-blogs',\n };\n\n size$: BehaviorSubject<AvatarSize> = new BehaviorSubject<AvatarSize>(40);\n profilePicture$: BehaviorSubject<string | undefined> = new BehaviorSubject<string | undefined>('');\n network$: BehaviorSubject<AvatarNetwork | undefined> = new BehaviorSubject<AvatarNetwork | undefined>(undefined);\n\n private alternativeText$: BehaviorSubject<string> = new BehaviorSubject<string>('');\n private anonymous$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private username$: BehaviorSubject<string> = new BehaviorSubject<string>('');\n private online$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private showInitials$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n private rounded$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);\n\n @Input() set alternativeText(alternativeText: string) {\n this.alternativeText$.next(alternativeText);\n }\n\n @Input() set anonymous(anonymous: boolean) {\n this.anonymous$.next(anonymous);\n }\n\n @Input() set username(username: string) {\n this.username$.next(username);\n }\n\n @Input() set network(network: AvatarNetwork | undefined) {\n this.network$.next(network);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-network-size', `${networkSizeByAvatarSize[this.size$.value]}px`);\n }\n\n @Input() set online(online: boolean) {\n this.online$.next(online);\n }\n\n @Input() set profilePicture(profilePicture: string | undefined) {\n this.profilePicture$.next(profilePicture);\n this.imageError$.next(false);\n }\n\n @Input() set showInitials(showInitials: boolean) {\n this.showInitials$.next(showInitials);\n }\n @Input() alt = '';\n\n @HostBinding('class.rounded-avatar')\n roundedAvatar = true;\n\n @Input({\n transform: booleanAttribute,\n })\n set rounded(rounded: boolean) {\n this.roundedAvatar = rounded;\n this.rounded$.next(rounded);\n }\n\n // TODO - migrate to signal input and remove size input\n @Input()\n set size(size: AvatarSize | `${AvatarSize}`) {\n this.size$.next(+size as AvatarSize);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-size', `${size}px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-symbol-size', `${symbolSizeByAvatarSize[size]}px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-online-icon-size', `${onlineIconSizeByAvatarSize[size]}px`);\n }\n\n displayProfilePicture$: Observable<boolean> = new Observable<boolean>();\n displaySingleNeutralSvg$: Observable<boolean> = new Observable<boolean>();\n displayInitials$: Observable<boolean> = new Observable<boolean>();\n displayAnonymous$: Observable<boolean> = new Observable<boolean>();\n displayNetwork$: Observable<boolean> = new Observable<boolean>();\n displayOnline$: Observable<boolean> = new Observable<boolean>();\n imageError$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n initials$: Observable<string> = new Observable<string>();\n initialsAvailable$: Observable<boolean> = of(false);\n\n constructor(private symbolRegistry: SymbolRegistry, private elementRef: ElementRef) {\n this.symbolRegistry.registerSymbols([\n apSingleNeutral,\n apShowTheaterMaskHappy,\n apFacebookOfficial,\n apLinkedinOfficial,\n apYoutubeOfficial,\n apTiktokOfficial,\n apGoogleMyBusinessOfficial,\n apPinterestOfficial,\n apXOfficial,\n apWebBlogs,\n apWebNews,\n ]);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-size', `40px`);\n this.elementRef.nativeElement.style.setProperty('--ap-avatar-symbol-size', `${symbolSizeByAvatarSize[this.size$.value]}px`);\n }\n\n ngOnInit(): void {\n this.initialsAvailable$ = this.username$.pipe(\n map(username => {\n return !!username;\n })\n );\n\n this.displayProfilePicture$ = combineLatest([this.profilePicture$, this.anonymous$, this.imageError$, this.showInitials$]).pipe(\n map(([profilePicture, anonymous, imageError]) => {\n return !!profilePicture && !anonymous && !imageError;\n })\n );\n\n this.displayInitials$ = combineLatest([\n this.showInitials$,\n this.anonymous$,\n this.initialsAvailable$,\n this.displayProfilePicture$,\n ]).pipe(\n map(([showInitials, anonymous, initialsAvailable, displayProfilePicture]) => {\n return showInitials && !anonymous && initialsAvailable && !displayProfilePicture;\n })\n );\n\n this.displaySingleNeutralSvg$ = combineLatest([\n this.profilePicture$,\n this.imageError$,\n this.initialsAvailable$,\n this.showInitials$,\n this.anonymous$,\n this.displayInitials$,\n this.displayProfilePicture$,\n ]).pipe(\n map(([profilePicture, imageError, initialsAvailable, showInitials, anonymous, displayInitials, displayProfilePicture]) => {\n return (\n (!profilePicture || imageError || !initialsAvailable || (initialsAvailable && !showInitials)) &&\n !anonymous &&\n !displayInitials &&\n !displayProfilePicture\n );\n })\n );\n\n this.displayAnonymous$ = combineLatest([this.anonymous$, this.rounded$]).pipe(\n map(([anonymous, rounded]) => {\n return anonymous && rounded;\n })\n );\n\n this.displayOnline$ = combineLatest([this.online$, this.rounded$]).pipe(\n map(([online, rounded]) => {\n return online && rounded;\n })\n );\n\n this.displayNetwork$ = combineLatest([this.network$, this.rounded$]).pipe(\n map(([network, rounded]) => {\n return !!network && rounded;\n })\n );\n\n this.initials$ = combineLatest([this.displayInitials$, this.username$]).pipe(\n map(([displayInitials, username]) => {\n if ((displayInitials && !username) || !displayInitials) {\n return '';\n }\n this.elementRef.nativeElement.style.setProperty(\n '--ap-avatar-initials-size',\n `${initialSizeByAvatarSize[this.size$.value]}px`\n );\n const names = username?.split(' ');\n return `${names[0].charAt(0).toUpperCase()}`;\n })\n );\n }\n\n onImageError(): void {\n this.imageError$.next(true);\n }\n}\n","<ng-container\n *ngrxLet=\"{\n displayProfilePicture: displayProfilePicture$,\n displaySingleNeutralSvg: displaySingleNeutralSvg$,\n displayInitials: displayInitials$,\n displayAnonymous: displayAnonymous$,\n displayOnline: displayOnline$,\n displayNetwork: displayNetwork$,\n initials: initials$,\n profilePicture: profilePicture$,\n size: size$,\n network: network$\n } as avatarViewModel\">\n <img\n *ngIf=\"avatarViewModel.displayProfilePicture\"\n [src]=\"avatarViewModel.profilePicture\"\n [width]=\"avatarViewModel.size\"\n [height]=\"avatarViewModel.size\"\n [alt]=\"alt\"\n (error)=\"onImageError()\" />\n <div\n *ngIf=\"avatarViewModel.displaySingleNeutralSvg\"\n class=\"no-profile-picture\">\n <ap-symbol symbolId=\"single-neutral\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayAnonymous\"\n class=\"anonymous\">\n <ap-symbol symbolId=\"show-theater-mask-happy\" />\n </div>\n <div\n *ngIf=\"avatarViewModel.displayOnline\"\n class=\"online\"></div>\n <div\n *ngIf=\"avatarViewModel.displayNetwork\"\n class=\"network\"\n [class.facebook]=\"avatarViewModel.network === 'facebook'\"\n [class.linkedin]=\"avatarViewModel.network === 'linkedin'\"\n [class.twitter]=\"avatarViewModel.network === 'twitter'\"\n [class.x]=\"avatarViewModel.network === 'X'\"\n [class.youtube]=\"avatarViewModel.network === 'youtube'\"\n [class.googleMyBusiness]=\"avatarViewModel.network === 'googleMyBusiness' || avatarViewModel.network === 'google'\"\n [class.instagram]=\"avatarViewModel.network === 'instagram'\"\n [class.tiktok]=\"avatarViewModel.network === 'tiktok'\"\n [class.pinterest]=\"avatarViewModel.network === 'pinterest'\"\n [class.web]=\"avatarViewModel.network === 'webBlog' || avatarViewModel.network === 'webNews'\">\n <ap-symbol\n *ngIf=\"avatarViewModel.network\"\n [symbolId]=\"networkSymbolByNetwork[avatarViewModel.network]\" />\n </div>\n\n <div\n *ngIf=\"avatarViewModel.displayInitials\"\n class=\"initials\">\n {{ avatarViewModel.initials }}\n </div>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -3,10 +3,10 @@ import { Component, ChangeDetectionStrategy, ViewEncapsulation, HostBinding, Inp
|
|
|
3
3
|
|
|
4
4
|
class BadgeComponent {
|
|
5
5
|
color = 'blue';
|
|
6
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
6
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: BadgeComponent, isStandalone: true, selector: "ap-badge", inputs: { color: "color" }, host: { properties: { "class": "this.color" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["ap-badge{display:flex;padding:0 var(--comp-badge-padding-right) 0 var(--comp-badge-padding-left);font-weight:var(--comp-badge-text-style-font-weight);font-family:var(--comp-badge-text-style-font-family);line-height:var(--comp-badge-text-style-line-height);font-size:var(--comp-badge-text-style-size);height:var(--comp-badge-height);max-height:var(--comp-badge-height);border-radius:2px}ap-badge.blue{background-color:var(--comp-badge-blue-background-color);color:var(--comp-badge-blue-color)}ap-badge.orange{text-transform:uppercase;background-color:var(--comp-badge-orange-background-color);color:var(--comp-badge-orange-color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
8
8
|
}
|
|
9
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-badge', standalone: true, imports: [], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: ["ap-badge{display:flex;padding:0 var(--comp-badge-padding-right) 0 var(--comp-badge-padding-left);font-weight:var(--comp-badge-text-style-font-weight);font-family:var(--comp-badge-text-style-font-family);line-height:var(--comp-badge-text-style-line-height);font-size:var(--comp-badge-text-style-size);height:var(--comp-badge-height);max-height:var(--comp-badge-height);border-radius:2px}ap-badge.blue{background-color:var(--comp-badge-blue-background-color);color:var(--comp-badge-blue-color)}ap-badge.orange{text-transform:uppercase;background-color:var(--comp-badge-orange-background-color);color:var(--comp-badge-orange-color)}\n"] }]
|
|
12
12
|
}], propDecorators: { color: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-badge.mjs","sources":["../../../libs/ui-components/badge/src/badge.component.ts","../../../libs/ui-components/badge/src/badge.component.html","../../../libs/ui-components/badge/src/agorapulse-ui-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';\n\nexport type BadgeColor = 'blue' | 'orange';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-badge',\n standalone: true,\n templateUrl: './badge.component.html',\n imports: [],\n styleUrls: ['./badge.component.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class BadgeComponent {\n @HostBinding('class')\n @Input()\n color: BadgeColor = 'blue';\n}\n","<ng-content></ng-content>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;MAaa,cAAc,CAAA;IAGvB,KAAK,GAAe,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-badge.mjs","sources":["../../../libs/ui-components/badge/src/badge.component.ts","../../../libs/ui-components/badge/src/badge.component.html","../../../libs/ui-components/badge/src/agorapulse-ui-components-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';\n\nexport type BadgeColor = 'blue' | 'orange';\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-badge',\n standalone: true,\n templateUrl: './badge.component.html',\n imports: [],\n styleUrls: ['./badge.component.scss'],\n encapsulation: ViewEncapsulation.None,\n})\nexport class BadgeComponent {\n @HostBinding('class')\n @Input()\n color: BadgeColor = 'blue';\n}\n","<ng-content></ng-content>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;MAaa,cAAc,CAAA;IAGvB,KAAK,GAAe,MAAM,CAAC;uGAHlB,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,iJCb3B,6BACA,EAAA,MAAA,EAAA,CAAA,ynBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDYa,cAAc,EAAA,UAAA,EAAA,CAAA;kBAT1B,SAAS;sCACW,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,UAAU,EAAA,UAAA,EACR,IAAI,EAAA,OAAA,EAEP,EAAE,EAAA,aAAA,EAEI,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,ynBAAA,CAAA,EAAA,CAAA;8BAKrC,KAAK,EAAA,CAAA;sBAFJ,WAAW;uBAAC,OAAO,CAAA;;sBACnB,KAAK;;;AEfV;;AAEG;;;;"}
|
|
@@ -59,10 +59,10 @@ class ButtonComponent {
|
|
|
59
59
|
this.buttonElement.nativeElement.click();
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
63
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.10", type: ButtonComponent, isStandalone: true, selector: "ap-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", form: "form", config: "config", loading: "loading", locked: "locked", menuTrigger: "menuTrigger", symbolPosition: "symbolPosition", ionicModalEnabled: "ionicModalEnabled" }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "disabled || null" } }, providers: [], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div\n *ngIf=\"loading && !locked\"\n class=\"loading-bar\"></div>\n</button>\n<div\n *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\" />\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
62
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
63
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.3", type: ButtonComponent, isStandalone: true, selector: "ap-button", inputs: { ariaLabel: "ariaLabel", disabled: ["disabled", "disabled", booleanAttribute], name: "name", form: "form", config: "config", loading: "loading", locked: "locked", menuTrigger: "menuTrigger", symbolPosition: "symbolPosition", ionicModalEnabled: "ionicModalEnabled" }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "disabled || null" } }, providers: [], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div\n *ngIf=\"loading && !locked\"\n class=\"loading-bar\"></div>\n</button>\n<div\n *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\" />\n</div>\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:4px;padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid;color:var(--ref-color-grey-80)}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading{color:var(--ref-color-red-40)}ap-button button.ghost.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80);border:1px solid var(--ref-color-purple-20)}ap-button button.locked:hover{border-color:var(--ref-color-purple-40);background-color:var(--ref-color-purple-20)}ap-button button.locked:focus:not(:disabled):not(:active){border-color:var(--ref-color-purple-20);background-color:var(--ref-color-purple-20)}ap-button button.locked:active{border-color:var(--ref-color-purple-60);background-color:var(--ref-color-purple-40)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
64
64
|
}
|
|
65
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
66
66
|
type: Component,
|
|
67
67
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-button', standalone: true, imports: [NgIf, SymbolComponent, CommonModule, MatMenuModule], providers: [], encapsulation: ViewEncapsulation.None, hostDirectives: [BaseButtonDirective], host: {
|
|
68
68
|
'[attr.disabled]': 'disabled || null',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-button.mjs","sources":["../../../libs/ui-components/button/src/button.component.ts","../../../libs/ui-components/button/src/button.component.html","../../../libs/ui-components/button/src/agorapulse-ui-components-button.ts"],"sourcesContent":["import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostListener,\n inject,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { CommonModule, NgIf } from '@angular/common';\nimport { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { MatMenuModule, MatMenuPanel } from '@angular/material/menu';\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\n\ntype ButtonConfig =\n | { style: 'primary'; color: 'orange' | 'blue' }\n | { style: 'secondary'; color: 'orange' | 'blue' }\n | { style: 'stroked'; color: 'grey' | 'blue' }\n | { style: 'stroked-transparent'; color: 'grey' | 'blue' }\n | { style: 'ghost'; color: 'grey' | 'blue' | 'red' };\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-button',\n styleUrls: ['./button.component.scss'],\n standalone: true,\n imports: [NgIf, SymbolComponent, CommonModule, MatMenuModule],\n providers: [],\n templateUrl: './button.component.html',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [BaseButtonDirective],\n // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n host: {\n '[attr.disabled]': 'disabled || null',\n },\n})\nexport class ButtonComponent {\n readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n @Input() ariaLabel: string = '';\n @Input({\n transform: booleanAttribute,\n }) disabled: boolean | undefined = false;\n @Input({\n required: true,\n })\n name: string = '';\n @Input() form: string | undefined = undefined;\n @Input() config: ButtonConfig = {\n style: 'primary',\n color: 'orange',\n };\n @Input() loading: boolean | undefined = false;\n @Input() locked: boolean = false;\n @Input() menuTrigger: MatMenuPanel | null = null;\n @Input() symbolPosition: 'left' | 'right' = 'right';\n\n @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() click: EventEmitter<MouseEvent> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n // Specific ionic behaviour with modal trigger on html side. We cannot use stopImmediatePropagation otherwise the modal doesn't open.\n // Maybe we can remove this hack once we rename click event by onClick\n @Input() ionicModalEnabled: boolean = false;\n\n focused: boolean = false;\n\n onClickHandle($event: MouseEvent): void {\n if (this.disabled || this.loading) {\n return;\n }\n if (!this.ionicModalEnabled) {\n $event.stopImmediatePropagation();\n }\n this.click.emit($event);\n this.buttonElement.nativeElement.blur();\n this.blur.emit($event);\n }\n\n onBlurHandle($event: FocusEvent): void {\n this.focused = false;\n this.blur.emit($event);\n }\n\n onFocusHandle($event: FocusEvent): void {\n this.focused = true;\n this.focus.emit($event);\n }\n\n @HostListener('window:keyup.space', ['$event'])\n onSpaceKeyUp(event: KeyboardEvent) {\n if (this.focused && !this.disabled && !this.loading) {\n event.preventDefault();\n this.buttonElement.nativeElement.click();\n }\n }\n}\n","<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div\n *ngIf=\"loading && !locked\"\n class=\"loading-bar\"></div>\n</button>\n<div\n *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\" />\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-button.mjs","sources":["../../../libs/ui-components/button/src/button.component.ts","../../../libs/ui-components/button/src/button.component.html","../../../libs/ui-components/button/src/agorapulse-ui-components-button.ts"],"sourcesContent":["import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostListener,\n inject,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { CommonModule, NgIf } from '@angular/common';\nimport { SymbolComponent } from '@agorapulse/ui-symbol';\nimport { MatMenuModule, MatMenuPanel } from '@angular/material/menu';\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\n\ntype ButtonConfig =\n | { style: 'primary'; color: 'orange' | 'blue' }\n | { style: 'secondary'; color: 'orange' | 'blue' }\n | { style: 'stroked'; color: 'grey' | 'blue' }\n | { style: 'stroked-transparent'; color: 'grey' | 'blue' }\n | { style: 'ghost'; color: 'grey' | 'blue' | 'red' };\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-button',\n styleUrls: ['./button.component.scss'],\n standalone: true,\n imports: [NgIf, SymbolComponent, CommonModule, MatMenuModule],\n providers: [],\n templateUrl: './button.component.html',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [BaseButtonDirective],\n // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n host: {\n '[attr.disabled]': 'disabled || null',\n },\n})\nexport class ButtonComponent {\n readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n @Input() ariaLabel: string = '';\n @Input({\n transform: booleanAttribute,\n }) disabled: boolean | undefined = false;\n @Input({\n required: true,\n })\n name: string = '';\n @Input() form: string | undefined = undefined;\n @Input() config: ButtonConfig = {\n style: 'primary',\n color: 'orange',\n };\n @Input() loading: boolean | undefined = false;\n @Input() locked: boolean = false;\n @Input() menuTrigger: MatMenuPanel | null = null;\n @Input() symbolPosition: 'left' | 'right' = 'right';\n\n @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() click: EventEmitter<MouseEvent> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n // Specific ionic behaviour with modal trigger on html side. We cannot use stopImmediatePropagation otherwise the modal doesn't open.\n // Maybe we can remove this hack once we rename click event by onClick\n @Input() ionicModalEnabled: boolean = false;\n\n focused: boolean = false;\n\n onClickHandle($event: MouseEvent): void {\n if (this.disabled || this.loading) {\n return;\n }\n if (!this.ionicModalEnabled) {\n $event.stopImmediatePropagation();\n }\n this.click.emit($event);\n this.buttonElement.nativeElement.blur();\n this.blur.emit($event);\n }\n\n onBlurHandle($event: FocusEvent): void {\n this.focused = false;\n this.blur.emit($event);\n }\n\n onFocusHandle($event: FocusEvent): void {\n this.focused = true;\n this.focus.emit($event);\n }\n\n @HostListener('window:keyup.space', ['$event'])\n onSpaceKeyUp(event: KeyboardEvent) {\n if (this.focused && !this.disabled && !this.loading) {\n event.preventDefault();\n this.buttonElement.nativeElement.click();\n }\n }\n}\n","<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content></ng-content>\n <ng-content select=\"ap-symbol\"></ng-content>\n <div\n *ngIf=\"loading && !locked\"\n class=\"loading-bar\"></div>\n</button>\n<div\n *ngIf=\"locked\"\n class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"premium-star\"\n size=\"micro\" />\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|