@bravobit/bb-foundation 0.50.9 → 0.51.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/collections/lib/collections.config.d.ts +3 -0
- package/collections/lib/collections.interfaces.d.ts +10 -0
- package/collections/lib/components/collections-actions/collections-actions.component.d.ts +3 -0
- package/collections/lib/components/collections-pager/collections-pager.component.d.ts +3 -0
- package/collections/public_api.d.ts +2 -0
- package/dialog/lib/dialog-confirm/dialog-confirm.component.d.ts +3 -5
- package/dialog/lib/dialog-header/dialog-header.component.d.ts +7 -1
- package/dialog/lib/dialog-modal/dialog-modal.component.d.ts +4 -7
- package/dialog/lib/dialog-overlay/dialog-overlay.component.d.ts +3 -2
- package/dialog/lib/dialog.insertion.d.ts +1 -2
- package/dialog/lib/dialog.interfaces.d.ts +5 -0
- package/dialog/lib/dialog.module.d.ts +5 -6
- package/dialog/lib/dialog.service.d.ts +4 -4
- package/dialog/lib/directives/confirm.directive.d.ts +2 -1
- package/dialog/public_api.d.ts +0 -1
- package/elements/lib/checkbox/checkbox.component.d.ts +3 -1
- package/elements/lib/elements.module.d.ts +22 -23
- package/elements/lib/radio-button/radio-button.component.d.ts +1 -3
- package/elements/public_api.d.ts +0 -1
- package/fesm2022/bravobit-bb-foundation-auth.mjs +19 -19
- package/fesm2022/bravobit-bb-foundation-collections.mjs +67 -49
- package/fesm2022/bravobit-bb-foundation-collections.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-combobox.mjs +15 -15
- package/fesm2022/bravobit-bb-foundation-dashboard.mjs +27 -27
- package/fesm2022/bravobit-bb-foundation-dashboard.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-dialog.mjs +95 -105
- package/fesm2022/bravobit-bb-foundation-dialog.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-elements.mjs +95 -122
- package/fesm2022/bravobit-bb-foundation-elements.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-http.mjs +10 -10
- package/fesm2022/bravobit-bb-foundation-localize.mjs +40 -16
- package/fesm2022/bravobit-bb-foundation-localize.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-masking.mjs +16 -16
- package/fesm2022/bravobit-bb-foundation-notifications.mjs +14 -14
- package/fesm2022/bravobit-bb-foundation-notifications.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-permissions.mjs +10 -10
- package/fesm2022/bravobit-bb-foundation-recaptcha.mjs +10 -10
- package/fesm2022/bravobit-bb-foundation-select.mjs +19 -19
- package/fesm2022/bravobit-bb-foundation-storage.mjs +3 -3
- package/fesm2022/bravobit-bb-foundation-table.mjs +47 -29
- package/fesm2022/bravobit-bb-foundation-table.mjs.map +1 -1
- package/fesm2022/bravobit-bb-foundation-tooltip.mjs +10 -10
- package/fesm2022/bravobit-bb-foundation-utils.mjs +16 -16
- package/fesm2022/bravobit-bb-foundation.mjs +21 -21
- package/localize/lib/localizations/dutch.localization.d.ts +6 -0
- package/localize/lib/localizations/english.localization.d.ts +6 -0
- package/localize/lib/localizations/papiamento.localization.d.ts +6 -0
- package/localize/lib/localizations/spanish.localization.d.ts +6 -0
- package/localize/lib/transforms/plural.transform.d.ts +1 -1
- package/package.json +5 -5
- package/styles/theme.scss +7 -1
- package/table/lib/components/table/table.component.d.ts +3 -0
- package/table/lib/components/table-pager/table-pager.component.d.ts +3 -0
- package/table/lib/interfaces/table.interfaces.d.ts +10 -0
- package/table/lib/table.config.d.ts +3 -0
- package/table/public_api.d.ts +1 -0
- package/dialog/lib/dialog-link/dialog-link.component.d.ts +0 -5
- package/elements/lib/directives/addon.directive.d.ts +0 -9
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { isObservable, of, combineLatest, BehaviorSubject, Subscription, merge, defer } from 'rxjs';
|
|
2
2
|
import { tap, switchMap, map, delay, shareReplay, distinctUntilChanged, catchError, startWith, debounceTime } from 'rxjs/operators';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { Directive, TemplateRef, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Input, numberAttribute, booleanAttribute, Attribute, Optional, HostListener, NgModule } from '@angular/core';
|
|
4
|
+
import { Directive, TemplateRef, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Input, InjectionToken, inject, numberAttribute, booleanAttribute, Attribute, Optional, HostListener, NgModule, makeEnvironmentProviders } from '@angular/core';
|
|
5
5
|
import { AsyncPipe, NgTemplateOutlet } from '@angular/common';
|
|
6
6
|
import { BbLocalizeString, BbLocalize, BbLocalizeTemplate } from '@bravobit/bb-foundation/localize';
|
|
7
7
|
import { combineLatestMap, getControlValue } from '@bravobit/bb-foundation/rxjs';
|
|
8
|
-
import {
|
|
8
|
+
import { BbIcon, BbInput, BbFormControl, BbSpinner, BbAvatar } from '@bravobit/bb-foundation/elements';
|
|
9
9
|
import * as i1 from '@angular/forms';
|
|
10
10
|
import { ReactiveFormsModule, FormControl } from '@angular/forms';
|
|
11
11
|
import { BbTemplate } from '@bravobit/bb-foundation/utils';
|
|
@@ -271,10 +271,10 @@ class BbCollectionsData {
|
|
|
271
271
|
static ngTemplateContextGuard(dir, ctx) {
|
|
272
272
|
return true;
|
|
273
273
|
}
|
|
274
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
275
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
274
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsData, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
275
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsData, isStandalone: true, selector: "ng-template[bbCollectionsData]", ngImport: i0 });
|
|
276
276
|
}
|
|
277
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
277
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsData, decorators: [{
|
|
278
278
|
type: Directive,
|
|
279
279
|
args: [{
|
|
280
280
|
selector: 'ng-template[bbCollectionsData]'
|
|
@@ -297,10 +297,10 @@ class BbCollectionsDataRow {
|
|
|
297
297
|
static ngTemplateContextGuard(dir, ctx) {
|
|
298
298
|
return true;
|
|
299
299
|
}
|
|
300
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
301
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
300
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsDataRow, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
301
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsDataRow, isStandalone: true, selector: "ng-template[bbCollectionsDataRow]", ngImport: i0 });
|
|
302
302
|
}
|
|
303
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
303
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsDataRow, decorators: [{
|
|
304
304
|
type: Directive,
|
|
305
305
|
args: [{
|
|
306
306
|
selector: 'ng-template[bbCollectionsDataRow]'
|
|
@@ -323,10 +323,10 @@ class BbCollectionsEmpty {
|
|
|
323
323
|
static ngTemplateContextGuard(dir, ctx) {
|
|
324
324
|
return true;
|
|
325
325
|
}
|
|
326
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
327
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
326
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsEmpty, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
327
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsEmpty, isStandalone: true, selector: "ng-template[bbCollectionsEmpty]", ngImport: i0 });
|
|
328
328
|
}
|
|
329
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsEmpty, decorators: [{
|
|
330
330
|
type: Directive,
|
|
331
331
|
args: [{
|
|
332
332
|
selector: 'ng-template[bbCollectionsEmpty]'
|
|
@@ -349,10 +349,10 @@ class BbCollectionsError {
|
|
|
349
349
|
static ngTemplateContextGuard(dir, ctx) {
|
|
350
350
|
return true;
|
|
351
351
|
}
|
|
352
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
353
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
352
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsError, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
353
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsError, isStandalone: true, selector: "ng-template[bbCollectionsError]", ngImport: i0 });
|
|
354
354
|
}
|
|
355
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsError, decorators: [{
|
|
356
356
|
type: Directive,
|
|
357
357
|
args: [{
|
|
358
358
|
selector: 'ng-template[bbCollectionsError]'
|
|
@@ -369,10 +369,10 @@ class BbCollectionsInitial {
|
|
|
369
369
|
static ngTemplateContextGuard(dir, ctx) {
|
|
370
370
|
return true;
|
|
371
371
|
}
|
|
372
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
373
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
372
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsInitial, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
373
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsInitial, isStandalone: true, selector: "ng-template[bbCollectionsInitial]", ngImport: i0 });
|
|
374
374
|
}
|
|
375
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
375
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsInitial, decorators: [{
|
|
376
376
|
type: Directive,
|
|
377
377
|
args: [{
|
|
378
378
|
selector: 'ng-template[bbCollectionsInitial]'
|
|
@@ -395,10 +395,10 @@ class BbCollectionsItem {
|
|
|
395
395
|
static ngTemplateContextGuard(dir, ctx) {
|
|
396
396
|
return true;
|
|
397
397
|
}
|
|
398
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
399
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
398
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsItem, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
399
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsItem, isStandalone: true, selector: "ng-template[bbCollectionsItem]", ngImport: i0 });
|
|
400
400
|
}
|
|
401
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
401
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsItem, decorators: [{
|
|
402
402
|
type: Directive,
|
|
403
403
|
args: [{
|
|
404
404
|
selector: 'ng-template[bbCollectionsItem]'
|
|
@@ -413,10 +413,10 @@ class BbCollectionsViewer {
|
|
|
413
413
|
initialTemplate;
|
|
414
414
|
// Inputs.
|
|
415
415
|
collection = null;
|
|
416
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
417
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
416
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsViewer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
417
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsViewer, isStandalone: true, selector: "[bb-collections-viewer]", inputs: { collection: "collection" }, host: { classAttribute: "bb-collections-viewer" }, queries: [{ propertyName: "dataTemplate", first: true, predicate: BbCollectionsData, descendants: true, read: TemplateRef }, { propertyName: "emptyTemplate", first: true, predicate: BbCollectionsEmpty, descendants: true, read: TemplateRef }, { propertyName: "errorTemplate", first: true, predicate: BbCollectionsError, descendants: true, read: TemplateRef }, { propertyName: "initialTemplate", first: true, predicate: BbCollectionsInitial, descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (collection?.data$ | async; as data) {\n @switch (data?.state) {\n @case ('initial') {\n <ng-container *ngTemplateOutlet=\"initialTemplate\"></ng-container>\n }\n @case ('empty') {\n <ng-container\n *ngTemplateOutlet=\"emptyTemplate; context: {query: data?.request?.query, loading: data?.loading}\"></ng-container>\n }\n @case ('error') {\n <ng-container\n *ngTemplateOutlet=\"errorTemplate; context: {error: data?.error, loading: data?.loading}\"></ng-container>\n }\n @default {\n <ng-container\n *ngTemplateOutlet=\"dataTemplate; context: {items: data?.response?.data, loading: data?.loading}\"></ng-container>\n }\n }\n}\n", styles: [".bb-collections-viewer{display:block}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
418
418
|
}
|
|
419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
419
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsViewer, decorators: [{
|
|
420
420
|
type: Component,
|
|
421
421
|
args: [{ selector: '[bb-collections-viewer]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'bb-collections-viewer' }, imports: [AsyncPipe, NgTemplateOutlet], template: "@if (collection?.data$ | async; as data) {\n @switch (data?.state) {\n @case ('initial') {\n <ng-container *ngTemplateOutlet=\"initialTemplate\"></ng-container>\n }\n @case ('empty') {\n <ng-container\n *ngTemplateOutlet=\"emptyTemplate; context: {query: data?.request?.query, loading: data?.loading}\"></ng-container>\n }\n @case ('error') {\n <ng-container\n *ngTemplateOutlet=\"errorTemplate; context: {error: data?.error, loading: data?.loading}\"></ng-container>\n }\n @default {\n <ng-container\n *ngTemplateOutlet=\"dataTemplate; context: {items: data?.response?.data, loading: data?.loading}\"></ng-container>\n }\n }\n}\n", styles: [".bb-collections-viewer{display:block}\n"] }]
|
|
422
422
|
}], propDecorators: { dataTemplate: [{
|
|
@@ -435,7 +435,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
|
|
|
435
435
|
type: Input
|
|
436
436
|
}] } });
|
|
437
437
|
|
|
438
|
+
const COLLECTIONS_CONFIG = new InjectionToken('collections config');
|
|
439
|
+
|
|
438
440
|
class BbCollectionsPager {
|
|
441
|
+
// Dependencies.
|
|
442
|
+
_config = inject(COLLECTIONS_CONFIG, { optional: true });
|
|
443
|
+
// Readonly data.
|
|
444
|
+
arrowPreviousIconName = this._config?.icons?.pagerArrowPrevious ?? 'material:arrow_back';
|
|
445
|
+
arrowNextIconName = this._config?.icons?.pagerArrowNext ?? 'material:arrow_forward';
|
|
439
446
|
set maxAmountOfButtons(value) {
|
|
440
447
|
this._maxAmountOfButtons$.next(Math.max(1, value));
|
|
441
448
|
}
|
|
@@ -528,12 +535,12 @@ class BbCollectionsPager {
|
|
|
528
535
|
.filter(page => page > 0 && page <= totalPages)
|
|
529
536
|
.map(page => ({ page, active: pageNumber === page }));
|
|
530
537
|
}
|
|
531
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
532
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
538
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsPager, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
539
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsPager, isStandalone: true, selector: "bb-collections-pager", inputs: { maxAmountOfButtons: ["maxAmountOfButtons", "maxAmountOfButtons", numberAttribute], collection: "collection" }, host: { classAttribute: "bb-collections-pager" }, ngImport: i0, template: "@if (data$ | async; as data) {\n <div [bb-localize-string]=\"'collection.showing_label' | bbLocalize\"\n class=\"bb-collections-pager-text\">\n <strong *bbLocalizeTemplate=\"'start'\">{{ data?.start }}</strong>\n <strong *bbLocalizeTemplate=\"'end'\">{{ data?.end }}</strong>\n <strong *bbLocalizeTemplate=\"'total'\">{{ data?.totalEntries }}</strong>\n </div>\n\n <div class=\"bb-collections-pager-container\">\n <ul class=\"bb-collections-pager-list\">\n <li class=\"bb-collections-pager-item\"\n title=\"Previous page\">\n <button [disabled]=\"data?.pageNumber <= 1\"\n (click)=\"setPage(data?.pageNumber - 1, data?.totalPages)\"\n class=\"bb-collections-pager-button arrow first\"\n type=\"button\">\n <bb-icon [src]=\"arrowPreviousIconName\"\n size=\"1.125\"></bb-icon>\n </button>\n </li>\n @for (item of data?.pages; track item?.page) {\n <li [title]=\"'Page ' + item?.page\"\n class=\"bb-collections-pager-item\">\n <button [class.active]=\"item?.active\"\n (click)=\"setPage(item?.page, data?.totalPages)\"\n class=\"bb-collections-pager-button\"\n type=\"button\">\n {{ item?.page }}\n </button>\n </li>\n }\n <li class=\"bb-collections-pager-item\"\n title=\"Next page\">\n <button [disabled]=\"data?.pageNumber >= data?.totalPages\"\n (click)=\"setPage(data?.pageNumber + 1, data?.totalPages)\"\n class=\"bb-collections-pager-button arrow last\"\n type=\"button\">\n <bb-icon [src]=\"arrowNextIconName\"\n size=\"1.125\"></bb-icon>\n </button>\n </li>\n </ul>\n </div>\n}\n", styles: [".bb-collections-pager{display:flex;align-items:center;font-size:.875rem;flex-direction:column-reverse}.bb-collections-pager-text{display:block;margin-top:.75rem}.bb-collections-pager-text>strong{font-weight:500}.bb-collections-pager-container{width:100%;display:flex;overflow-x:auto;align-items:center;justify-content:center}.bb-collections-pager-list{display:flex;align-items:center;border-radius:.5rem;background-color:#fff;border:1px solid var(--bb-collections-pager-border-color);box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-pager-item:not(:last-child){border-right:1px solid var(--bb-collections-pager-border-color)}.bb-collections-pager-button{height:2rem;border:none;display:flex;appearance:none;min-height:2rem;min-width:2.5rem;-webkit-user-select:none;user-select:none;padding:0 .25rem;align-items:center;justify-content:center;background-color:transparent;transition:color .2s cubic-bezier(0,0,.2,1),background-color .2s cubic-bezier(0,0,.2,1)}.bb-collections-pager-button:hover,.bb-collections-pager-button:focus,.bb-collections-pager-button:active,.bb-collections-pager-button.active{font-weight:400;color:var(--bb-collections-pager-color)}.bb-collections-pager-button:hover,.bb-collections-pager-button:focus{background-color:var(--bb-collections-pager-hover-background-color)}.bb-collections-pager-button:active,.bb-collections-pager-button.active{background-color:var(--bb-collections-pager-active-background-color)}.bb-collections-pager-button:not(.arrow):focus,.bb-collections-pager-button:not(.arrow):active{box-shadow:var(--bb-collections-pager-focus-box-shadow)}.bb-collections-pager-button:not(.arrow):focus,.bb-collections-pager-button:not(.arrow):active,.bb-collections-pager-button:not(.arrow).active{outline:1px solid var(--bb-collections-pager-outline-color)}.bb-collections-pager-button.arrow{font-weight:500}.bb-collections-pager-button.arrow.first{border-top-left-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px)}.bb-collections-pager-button.arrow.last{border-top-right-radius:calc(.5rem - 1px);border-bottom-right-radius:calc(.5rem - 1px)}.bb-collections-pager-button:disabled{color:#111;outline:none;opacity:.25;cursor:default;pointer-events:none;background-color:transparent}@media only screen and (min-width: 768px){.bb-collections-pager{flex-wrap:wrap;align-items:center;flex-direction:row;justify-content:space-between}.bb-collections-pager-text{margin-top:0}.bb-collections-pager-container{width:auto;overflow-x:unset}}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: BbLocalizeString, selector: "[bb-localize-string]", inputs: ["substitutions", "bb-localize-string"] }, { kind: "pipe", type: BbLocalize, name: "bbLocalize" }, { kind: "directive", type: BbLocalizeTemplate, selector: "ng-template[bbLocalizeTemplate]", inputs: ["bbLocalizeTemplate"] }, { kind: "component", type: BbIcon, selector: "bb-icon", inputs: ["alt", "size", "ariaHidden", "unit", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
533
540
|
}
|
|
534
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsPager, decorators: [{
|
|
535
542
|
type: Component,
|
|
536
|
-
args: [{ selector: 'bb-collections-pager', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'bb-collections-pager' }, imports: [AsyncPipe, BbLocalizeString, BbLocalize, BbLocalizeTemplate], template: "@if (data$ | async; as data) {\n <div [bb-localize-string]=\"'collection.showing_label' | bbLocalize\"\n class=\"bb-collections-pager-text\">\n <strong *bbLocalizeTemplate=\"'start'\">{{ data?.start }}</strong>\n <strong *bbLocalizeTemplate=\"'end'\">{{ data?.end }}</strong>\n <strong *bbLocalizeTemplate=\"'total'\">{{ data?.totalEntries }}</strong>\n </div>\n\n <div class=\"bb-collections-pager-container\">\n <ul class=\"bb-collections-pager-list\">\n <li class=\"bb-collections-pager-item\"\n title=\"Previous page\">\n <button [disabled]=\"data?.pageNumber <= 1\"\n (click)=\"setPage(data?.pageNumber - 1, data?.totalPages)\"\n class=\"bb-collections-pager-button arrow first\"\n type=\"button\">\n
|
|
543
|
+
args: [{ selector: 'bb-collections-pager', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'bb-collections-pager' }, imports: [AsyncPipe, BbLocalizeString, BbLocalize, BbLocalizeTemplate, BbIcon], template: "@if (data$ | async; as data) {\n <div [bb-localize-string]=\"'collection.showing_label' | bbLocalize\"\n class=\"bb-collections-pager-text\">\n <strong *bbLocalizeTemplate=\"'start'\">{{ data?.start }}</strong>\n <strong *bbLocalizeTemplate=\"'end'\">{{ data?.end }}</strong>\n <strong *bbLocalizeTemplate=\"'total'\">{{ data?.totalEntries }}</strong>\n </div>\n\n <div class=\"bb-collections-pager-container\">\n <ul class=\"bb-collections-pager-list\">\n <li class=\"bb-collections-pager-item\"\n title=\"Previous page\">\n <button [disabled]=\"data?.pageNumber <= 1\"\n (click)=\"setPage(data?.pageNumber - 1, data?.totalPages)\"\n class=\"bb-collections-pager-button arrow first\"\n type=\"button\">\n <bb-icon [src]=\"arrowPreviousIconName\"\n size=\"1.125\"></bb-icon>\n </button>\n </li>\n @for (item of data?.pages; track item?.page) {\n <li [title]=\"'Page ' + item?.page\"\n class=\"bb-collections-pager-item\">\n <button [class.active]=\"item?.active\"\n (click)=\"setPage(item?.page, data?.totalPages)\"\n class=\"bb-collections-pager-button\"\n type=\"button\">\n {{ item?.page }}\n </button>\n </li>\n }\n <li class=\"bb-collections-pager-item\"\n title=\"Next page\">\n <button [disabled]=\"data?.pageNumber >= data?.totalPages\"\n (click)=\"setPage(data?.pageNumber + 1, data?.totalPages)\"\n class=\"bb-collections-pager-button arrow last\"\n type=\"button\">\n <bb-icon [src]=\"arrowNextIconName\"\n size=\"1.125\"></bb-icon>\n </button>\n </li>\n </ul>\n </div>\n}\n", styles: [".bb-collections-pager{display:flex;align-items:center;font-size:.875rem;flex-direction:column-reverse}.bb-collections-pager-text{display:block;margin-top:.75rem}.bb-collections-pager-text>strong{font-weight:500}.bb-collections-pager-container{width:100%;display:flex;overflow-x:auto;align-items:center;justify-content:center}.bb-collections-pager-list{display:flex;align-items:center;border-radius:.5rem;background-color:#fff;border:1px solid var(--bb-collections-pager-border-color);box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-pager-item:not(:last-child){border-right:1px solid var(--bb-collections-pager-border-color)}.bb-collections-pager-button{height:2rem;border:none;display:flex;appearance:none;min-height:2rem;min-width:2.5rem;-webkit-user-select:none;user-select:none;padding:0 .25rem;align-items:center;justify-content:center;background-color:transparent;transition:color .2s cubic-bezier(0,0,.2,1),background-color .2s cubic-bezier(0,0,.2,1)}.bb-collections-pager-button:hover,.bb-collections-pager-button:focus,.bb-collections-pager-button:active,.bb-collections-pager-button.active{font-weight:400;color:var(--bb-collections-pager-color)}.bb-collections-pager-button:hover,.bb-collections-pager-button:focus{background-color:var(--bb-collections-pager-hover-background-color)}.bb-collections-pager-button:active,.bb-collections-pager-button.active{background-color:var(--bb-collections-pager-active-background-color)}.bb-collections-pager-button:not(.arrow):focus,.bb-collections-pager-button:not(.arrow):active{box-shadow:var(--bb-collections-pager-focus-box-shadow)}.bb-collections-pager-button:not(.arrow):focus,.bb-collections-pager-button:not(.arrow):active,.bb-collections-pager-button:not(.arrow).active{outline:1px solid var(--bb-collections-pager-outline-color)}.bb-collections-pager-button.arrow{font-weight:500}.bb-collections-pager-button.arrow.first{border-top-left-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px)}.bb-collections-pager-button.arrow.last{border-top-right-radius:calc(.5rem - 1px);border-bottom-right-radius:calc(.5rem - 1px)}.bb-collections-pager-button:disabled{color:#111;outline:none;opacity:.25;cursor:default;pointer-events:none;background-color:transparent}@media only screen and (min-width: 768px){.bb-collections-pager{flex-wrap:wrap;align-items:center;flex-direction:row;justify-content:space-between}.bb-collections-pager-text{margin-top:0}.bb-collections-pager-container{width:auto;overflow-x:unset}}\n"] }]
|
|
537
544
|
}], propDecorators: { maxAmountOfButtons: [{
|
|
538
545
|
type: Input,
|
|
539
546
|
args: [{ transform: numberAttribute }]
|
|
@@ -543,19 +550,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
|
|
|
543
550
|
}] } });
|
|
544
551
|
|
|
545
552
|
class BbCollectionsActions {
|
|
553
|
+
// Dependencies.
|
|
554
|
+
_config = inject(COLLECTIONS_CONFIG, { optional: true });
|
|
555
|
+
// Readonly data.
|
|
556
|
+
searchIconName = this._config?.icons?.actionsSearch ?? 'material:search';
|
|
557
|
+
closeIconName = this._config?.icons?.actionsClose ?? 'material:close';
|
|
546
558
|
// Inputs.
|
|
547
559
|
collection = null;
|
|
548
560
|
queryPlaceholder = null;
|
|
549
561
|
standalone = false;
|
|
550
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
551
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
562
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
563
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsActions, isStandalone: true, selector: "bb-collections-actions", inputs: { collection: "collection", queryPlaceholder: "queryPlaceholder", standalone: ["standalone", "standalone", booleanAttribute] }, host: { properties: { "class.standalone": "standalone" }, classAttribute: "bb-collections-actions" }, ngImport: i0, template: "<div class=\"bb-collections-actions-row\">\n @if (collection?.queryFieldsControl?.value?.length > 0) {\n <bb-form-control class=\"bb-collections-actions-search\">\n <bb-icon [src]=\"searchIconName\"\n bbPrefix></bb-icon>\n <input [formControl]=\"collection?.queryControl\"\n [placeholder]=\"queryPlaceholder ?? ('collection.search_label' | bbLocalize)\"\n bbInput\n autocomplete=\"off\"\n type=\"search\">\n @if (collection?.queryControl?.value?.length > 0) {\n <button (click)=\"collection?.queryControl?.setValue('')\"\n bbSuffix\n data-button\n type=\"button\">\n <bb-icon [src]=\"closeIconName\"></bb-icon>\n </button>\n }\n </bb-form-control>\n }\n <ng-content select=\"[data-collections-action]\"></ng-content>\n</div>\n<ng-content></ng-content>\n", styles: [".bb-collections-actions{gap:.75rem;display:flex;color:#111;font-size:.875rem;padding:.75rem 1rem;flex-direction:column;border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-actions.standalone{border-bottom:none;border-radius:.5rem;margin-bottom:1.5rem;background-color:#fff;box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-actions-row,[data-collections-row]{gap:.75rem;display:flex;flex-direction:column}.bb-collections-actions-search{flex:1}@media only screen and (min-width: 768px){.bb-collections-actions-row,[data-collections-row]{flex-direction:row}.bb-collections-actions-row.end,[data-collections-row].end{justify-content:flex-end}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: BbInput, selector: "input[bbInput],textarea[bbInput],select[bbInput]", inputs: ["required"] }, { kind: "pipe", type: BbLocalize, name: "bbLocalize" }, { kind: "component", type: BbIcon, selector: "bb-icon", inputs: ["alt", "size", "ariaHidden", "unit", "src"] }, { kind: "component", type: BbFormControl, selector: "bb-form-control", inputs: ["label", "hint", "grouped", "hideErrors"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
552
564
|
}
|
|
553
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
565
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsActions, decorators: [{
|
|
554
566
|
type: Component,
|
|
555
567
|
args: [{ selector: 'bb-collections-actions', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
556
568
|
'class': 'bb-collections-actions',
|
|
557
569
|
'[class.standalone]': 'standalone'
|
|
558
|
-
}, imports: [ReactiveFormsModule, BbInput, BbLocalize, BbIcon, BbFormControl
|
|
570
|
+
}, imports: [ReactiveFormsModule, BbInput, BbLocalize, BbIcon, BbFormControl], template: "<div class=\"bb-collections-actions-row\">\n @if (collection?.queryFieldsControl?.value?.length > 0) {\n <bb-form-control class=\"bb-collections-actions-search\">\n <bb-icon [src]=\"searchIconName\"\n bbPrefix></bb-icon>\n <input [formControl]=\"collection?.queryControl\"\n [placeholder]=\"queryPlaceholder ?? ('collection.search_label' | bbLocalize)\"\n bbInput\n autocomplete=\"off\"\n type=\"search\">\n @if (collection?.queryControl?.value?.length > 0) {\n <button (click)=\"collection?.queryControl?.setValue('')\"\n bbSuffix\n data-button\n type=\"button\">\n <bb-icon [src]=\"closeIconName\"></bb-icon>\n </button>\n }\n </bb-form-control>\n }\n <ng-content select=\"[data-collections-action]\"></ng-content>\n</div>\n<ng-content></ng-content>\n", styles: [".bb-collections-actions{gap:.75rem;display:flex;color:#111;font-size:.875rem;padding:.75rem 1rem;flex-direction:column;border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-actions.standalone{border-bottom:none;border-radius:.5rem;margin-bottom:1.5rem;background-color:#fff;box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-actions-row,[data-collections-row]{gap:.75rem;display:flex;flex-direction:column}.bb-collections-actions-search{flex:1}@media only screen and (min-width: 768px){.bb-collections-actions-row,[data-collections-row]{flex-direction:row}.bb-collections-actions-row.end,[data-collections-row].end{justify-content:flex-end}}\n"] }]
|
|
559
571
|
}], propDecorators: { collection: [{
|
|
560
572
|
type: Input,
|
|
561
573
|
args: [{ required: true }]
|
|
@@ -587,10 +599,10 @@ class BbCollectionsTable {
|
|
|
587
599
|
get collection() {
|
|
588
600
|
return this.collection$.getValue();
|
|
589
601
|
}
|
|
590
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
591
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: BbCollectionsTable, isStandalone: true, selector: "bb-collections-table", inputs: { queryPlaceholder: "queryPlaceholder", emptyContent: "emptyContent", noResultsContent: "noResultsContent", errorContent: "errorContent", trackByProperty: "trackByProperty", includeVerticalLines: ["includeVerticalLines", "includeVerticalLines", booleanAttribute], hideActions: ["hideActions", "hideActions", booleanAttribute], hidePager: ["hidePager", "hidePager", booleanAttribute], collection: "collection" }, host: { properties: { "class.include-vertical-lines": "includeVerticalLines" }, classAttribute: "bb-collections-table" }, queries: [{ propertyName: "dataTemplate", first: true, predicate: BbCollectionsData, descendants: true, read: TemplateRef }, { propertyName: "dataRowTemplate", first: true, predicate: BbCollectionsDataRow, descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (!hideActions) {\n <bb-collections-actions [collection]=\"collection\"\n [queryPlaceholder]=\"queryPlaceholder\">\n <ng-content ngProjectAs=\"[data-collections-action]\"\n select=\"[data-collections-action]\"></ng-content>\n <ng-content ngProjectAs=\"[data-collections-row]\"\n select=\"[data-collections-row]\"></ng-content>\n </bb-collections-actions>\n}\n\n<div [class.loading]=\"collection?.loading$ | async\"\n class=\"bb-collections-table-wrapper\">\n <div [collection]=\"collection\"\n class=\"bb-collections-table-container\"\n bb-collections-viewer>\n @if (collection?.loading$ | async) {\n <div class=\"bb-collections-table-loading\"></div>\n }\n <table *bbCollectionsData=\"let items = items; let loading = loading\">\n <ng-content select=\"thead\"></ng-content>\n @if (dataTemplate) {\n <ng-container\n *ngTemplateOutlet=\"dataTemplate; context: {items: $any(items), loading: loading}\"></ng-container>\n } @else {\n <tbody>\n @for (item of items; track (trackByProperty === null ? $index : item[trackByProperty])) {\n <ng-container\n *ngTemplateOutlet=\"dataRowTemplate; context: {$implicit: item, item: item}\"></ng-container>\n }\n </tbody>\n }\n <ng-content select=\"tfoot\"></ng-content>\n </table>\n <div *bbCollectionsEmpty=\"let query = query\"\n class=\"bb-collections-table-info\">\n <div class=\"bb-collections-table-image empty\"></div>\n @if (query?.length > 0) {\n <ng-template [bbTemplate]=\"noResultsContent\">\n <p [bb-localize-string]=\"$any(noResultsContent) ?? ('collection.no_results_label' | bbLocalize)\"\n class=\"bb-collections-table-info-text\">\n <strong *bbLocalizeTemplate=\"'query'\">{{ query ?? '...' }}</strong>\n </p>\n </ng-template>\n } @else {\n <ng-template [bbTemplate]=\"emptyContent\">\n <p class=\"bb-collections-table-info-text\">\n {{ $any(emptyContent) ?? ('collection.empty_label' | bbLocalize) }}\n </p>\n </ng-template>\n }\n </div>\n <div *bbCollectionsError=\"let error = error\"\n class=\"bb-collections-table-info\">\n <div class=\"bb-collections-table-image error\"></div>\n <ng-template [bbTemplate]=\"errorContent\">\n <p class=\"bb-collections-table-info-text\">\n {{ $any(errorContent) ?? ('collection.error_label' | bbLocalize) }}\n </p>\n </ng-template>\n </div>\n <div *bbCollectionsInitial\n class=\"bb-collections-table-info\">\n <bb-spinner class=\"block\"></bb-spinner>\n </div>\n </div>\n</div>\n\n@if (!hidePager) {\n <footer class=\"bb-collections-table-footer\">\n <bb-collections-pager [collection]=\"collection\"></bb-collections-pager>\n </footer>\n}\n", styles: ["@charset \"UTF-8\";.bb-collections-table{color:#111;display:block;position:relative;font-size:.875rem;border-radius:.5rem;background-color:#fff;box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-table>*:first-child{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.bb-collections-table>*:last-child{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem}.bb-collections-table.include-vertical-lines td:not(:last-child),.bb-collections-table.include-vertical-lines th:not(:last-child){border-right:1px solid hsl(213,8%,90%)}.bb-collections-table-footer{padding:.75rem 1rem;background-color:#fbf9f9;border-top:1px solid hsl(213,8%,90%)}.bb-collections-table-wrapper{overflow:hidden;position:relative}.bb-collections-table-wrapper.loading:after{top:0;left:0;right:0;z-index:1;opacity:0;content:\"\";display:block;height:.25rem;position:absolute;will-change:left,right;background-color:var(--bb-collections-table-loader-color);animation:collectionsFadeIn .12s cubic-bezier(.65,.815,.735,.395) .4s forwards,collectionsIndeterminate 2.1s cubic-bezier(.65,.815,.735,.395) .4s infinite}.bb-collections-table-container{overflow-x:auto;position:relative}.bb-collections-table-container.loading>table>tbody,.bb-collections-table-container.loading>.bb-collections-table-info{animation:collectionsBlink 1s linear infinite}.bb-collections-table-container>table{width:100%}.bb-collections-table-container>table th,.bb-collections-table-container>table td{padding:1rem;text-align:left;font-weight:400;font-size:.875rem}.bb-collections-table-container>table th.fit,.bb-collections-table-container>table td.fit{width:1%;white-space:nowrap}.bb-collections-table-container>table th.left,.bb-collections-table-container>table td.left{text-align:left}.bb-collections-table-container>table th.right,.bb-collections-table-container>table td.right{text-align:right}.bb-collections-table-container>table>thead{background-color:#fbf9f9;border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-table-container>table>thead>tr>th{padding:1rem;color:#525252}.bb-collections-table-container>table>tbody>tr>td{color:#111}.bb-collections-table-container>table>tbody>tr:not(:last-child){border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-table-info{padding:3rem 1.5rem}.bb-collections-table-info-text{color:#525252;margin:0 auto;display:block;line-height:2;max-width:30rem;text-align:center;font-size:.875rem}.bb-collections-table-info-text>strong{font-weight:500}.bb-collections-table-info-text>strong:before{content:\"\\201c\"}.bb-collections-table-info-text>strong:after{content:\"\\201d\"}.bb-collections-table-image{width:100%;height:auto;display:flex;max-width:7.5rem;margin:0 auto 1.5rem;background-size:contain;background-repeat:no-repeat;background-position:center center}.bb-collections-table-image.empty{aspect-ratio:154/132;mask-image:linear-gradient(to bottom,black 25%,transparent 100%);background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 154 132\"%3E%3Cg fill=\"none\" fill-rule=\"evenodd\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3Cg transform=\"translate(0 46)\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3C/g%3E%3Cg transform=\"translate(0 92)\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E')}.bb-collections-table-image.error{max-width:4rem;aspect-ratio:1;background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 132 132\"%3E%3Cpath fill=\"%23C23934\" d=\"M65.958253 98.6024096c.8892771 0 1.6486747-.3008433 2.2781928-.9025301.6295181-.6016867.9442771-1.3471687.9442771-2.2364458 0-.8892771-.3008434-1.6486747-.9025301-2.2781927-.6016868-.6295181-1.3471687-.9442771-2.2364458-.9442771-.8892771 0-1.6486747.3008433-2.2781928.9025301-.6295181.6016867-.9442771 1.3471687-.9442771 2.2364458 0 .8892771.3008434 1.6486747.9025301 2.2781927.6016868.6295181 1.3471687.9442771 2.2364458.9442771Zm-1.9462048-21.4698795h3.9759036V29.4216867h-3.9759036v47.7108434ZM66.0894578 132c-9.0716867 0-17.6205421-1.715602-25.6465662-5.146807-8.0260241-3.431205-15.0547591-8.159217-21.0862049-14.184036-6.032771-6.02482-10.76674694-13.0416269-14.20192766-21.0504221C1.71825301 83.6086145 0 75.0504819 0 65.9443373 0 56.8368675 1.71560241 48.303253 5.14680723 40.343494c3.43120482-7.9597591 8.15921687-14.9553615 14.18403617-20.9868073 6.0248193-6.032771 13.0416265-10.76674694 21.0504217-14.20192766C48.3913855 1.71825301 56.9495181 0 66.0556627 0 75.1631325 0 83.696747 1.71560241 91.656506 5.14680723c7.9597591 3.43120482 14.955361 8.15921687 20.986807 14.18403617 6.032771 6.0248193 10.766747 13.0263855 14.201928 21.0046988C130.281747 48.3138554 132 56.8388554 132 65.9105422c0 9.0716867-1.715602 17.6205421-5.146807 25.6465662-3.431205 8.0260241-8.159217 15.0547586-14.184036 21.0862046-6.02482 6.032771-13.0263859 10.766747-21.0046992 14.201928C83.6861446 130.281747 75.1611446 132 66.0894578 132ZM66 128.024096c17.2289157 0 31.873494-6.03012 43.933735-18.090361C121.993976 97.873494 128.024096 83.2289157 128.024096 66c0-17.2289157-6.03012-31.873494-18.090361-43.9337349C97.873494 10.0060241 83.2289157 3.97590361 66 3.97590361c-17.2289157 0-31.873494 6.03012049-43.9337349 18.09036149C10.0060241 34.126506 3.97590361 48.7710843 3.97590361 66c0 17.2289157 6.03012049 31.873494 18.09036149 43.933735C34.126506 121.993976 48.7710843 128.024096 66 128.024096Z\"/%3E%3C/svg%3E')}@keyframes collectionsFadeIn{0%{opacity:0}to{opacity:1}}@keyframes collectionsIndeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes collectionsBlink{25%{opacity:.6}50%{opacity:.4}75%{opacity:.6}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BbCollectionsViewer, selector: "[bb-collections-viewer]", inputs: ["collection"] }, { kind: "directive", type: BbCollectionsData, selector: "ng-template[bbCollectionsData]" }, { kind: "directive", type: BbCollectionsEmpty, selector: "ng-template[bbCollectionsEmpty]" }, { kind: "directive", type: BbCollectionsError, selector: "ng-template[bbCollectionsError]" }, { kind: "directive", type: BbCollectionsInitial, selector: "ng-template[bbCollectionsInitial]" }, { kind: "component", type: BbCollectionsActions, selector: "bb-collections-actions", inputs: ["collection", "queryPlaceholder", "standalone"] }, { kind: "component", type: BbCollectionsPager, selector: "bb-collections-pager", inputs: ["maxAmountOfButtons", "collection"] }, { kind: "component", type: BbLocalizeString, selector: "[bb-localize-string]", inputs: ["substitutions", "bb-localize-string"] }, { kind: "directive", type: BbTemplate, selector: "[bbTemplate]", inputs: ["bbTemplate"] }, { kind: "pipe", type: BbLocalize, name: "bbLocalize" }, { kind: "directive", type: BbLocalizeTemplate, selector: "ng-template[bbLocalizeTemplate]", inputs: ["bbLocalizeTemplate"] }, { kind: "component", type: BbSpinner, selector: "bb-spinner", inputs: ["color", "alt", "disabled"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
602
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
603
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsTable, isStandalone: true, selector: "bb-collections-table", inputs: { queryPlaceholder: "queryPlaceholder", emptyContent: "emptyContent", noResultsContent: "noResultsContent", errorContent: "errorContent", trackByProperty: "trackByProperty", includeVerticalLines: ["includeVerticalLines", "includeVerticalLines", booleanAttribute], hideActions: ["hideActions", "hideActions", booleanAttribute], hidePager: ["hidePager", "hidePager", booleanAttribute], collection: "collection" }, host: { properties: { "class.include-vertical-lines": "includeVerticalLines" }, classAttribute: "bb-collections-table" }, queries: [{ propertyName: "dataTemplate", first: true, predicate: BbCollectionsData, descendants: true, read: TemplateRef }, { propertyName: "dataRowTemplate", first: true, predicate: BbCollectionsDataRow, descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (!hideActions) {\n <bb-collections-actions [collection]=\"collection\"\n [queryPlaceholder]=\"queryPlaceholder\">\n <ng-content ngProjectAs=\"[data-collections-action]\"\n select=\"[data-collections-action]\"></ng-content>\n <ng-content ngProjectAs=\"[data-collections-row]\"\n select=\"[data-collections-row]\"></ng-content>\n </bb-collections-actions>\n}\n\n<div [class.loading]=\"collection?.loading$ | async\"\n class=\"bb-collections-table-wrapper\">\n <div [collection]=\"collection\"\n class=\"bb-collections-table-container\"\n bb-collections-viewer>\n @if (collection?.loading$ | async) {\n <div class=\"bb-collections-table-loading\"></div>\n }\n <table *bbCollectionsData=\"let items = items; let loading = loading\">\n <ng-content select=\"thead\"></ng-content>\n @if (dataTemplate) {\n <ng-container\n *ngTemplateOutlet=\"dataTemplate; context: {items: $any(items), loading: loading}\"></ng-container>\n } @else {\n <tbody>\n @for (item of items; track (trackByProperty === null ? $index : item[trackByProperty])) {\n <ng-container\n *ngTemplateOutlet=\"dataRowTemplate; context: {$implicit: item, item: item}\"></ng-container>\n }\n </tbody>\n }\n <ng-content select=\"tfoot\"></ng-content>\n </table>\n <div *bbCollectionsEmpty=\"let query = query\"\n class=\"bb-collections-table-info\">\n <div class=\"bb-collections-table-image empty\"></div>\n @if (query?.length > 0) {\n <ng-template [bbTemplate]=\"noResultsContent\">\n <p [bb-localize-string]=\"$any(noResultsContent) ?? ('collection.no_results_label' | bbLocalize)\"\n class=\"bb-collections-table-info-text\">\n <strong *bbLocalizeTemplate=\"'query'\">{{ query ?? '...' }}</strong>\n </p>\n </ng-template>\n } @else {\n <ng-template [bbTemplate]=\"emptyContent\">\n <p class=\"bb-collections-table-info-text\">\n {{ $any(emptyContent) ?? ('collection.empty_label' | bbLocalize) }}\n </p>\n </ng-template>\n }\n </div>\n <div *bbCollectionsError=\"let error = error\"\n class=\"bb-collections-table-info\">\n <div class=\"bb-collections-table-image error\"></div>\n <ng-template [bbTemplate]=\"errorContent\">\n <p class=\"bb-collections-table-info-text\">\n {{ $any(errorContent) ?? ('collection.error_label' | bbLocalize) }}\n </p>\n </ng-template>\n </div>\n <div *bbCollectionsInitial\n class=\"bb-collections-table-info\">\n <bb-spinner class=\"block\"></bb-spinner>\n </div>\n </div>\n</div>\n\n@if (!hidePager) {\n <footer class=\"bb-collections-table-footer\">\n <bb-collections-pager [collection]=\"collection\"></bb-collections-pager>\n </footer>\n}\n", styles: ["@charset \"UTF-8\";.bb-collections-table{color:#111;display:block;position:relative;font-size:.875rem;border-radius:.5rem;background-color:#fff;box-shadow:0 .375rem .375rem -.375rem #0000001a}.bb-collections-table>*:first-child{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.bb-collections-table>*:last-child{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem}.bb-collections-table.include-vertical-lines td:not(:last-child),.bb-collections-table.include-vertical-lines th:not(:last-child){border-right:1px solid hsl(213,8%,90%)}.bb-collections-table-footer{padding:.75rem 1rem;background-color:#fbf9f9;border-top:1px solid hsl(213,8%,90%)}.bb-collections-table-wrapper{overflow:hidden;position:relative}.bb-collections-table-wrapper.loading:after{top:0;left:0;right:0;z-index:1;opacity:0;content:\"\";display:block;height:.25rem;position:absolute;will-change:left,right;background-color:var(--bb-collections-table-loader-color);animation:collectionsFadeIn .12s cubic-bezier(.65,.815,.735,.395) .4s forwards,collectionsIndeterminate 2.1s cubic-bezier(.65,.815,.735,.395) .4s infinite}.bb-collections-table-container{overflow-x:auto;position:relative}.bb-collections-table-container.loading>table>tbody,.bb-collections-table-container.loading>.bb-collections-table-info{animation:collectionsBlink 1s linear infinite}.bb-collections-table-container>table{width:100%}.bb-collections-table-container>table th,.bb-collections-table-container>table td{padding:1rem;text-align:left;font-weight:400;font-size:.875rem}.bb-collections-table-container>table th.fit,.bb-collections-table-container>table td.fit{width:1%;white-space:nowrap}.bb-collections-table-container>table th.left,.bb-collections-table-container>table td.left{text-align:left}.bb-collections-table-container>table th.right,.bb-collections-table-container>table td.right{text-align:right}.bb-collections-table-container>table>thead{background-color:#fbf9f9;border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-table-container>table>thead>tr>th{padding:1rem;color:#525252}.bb-collections-table-container>table>tbody>tr>td{color:#111}.bb-collections-table-container>table>tbody>tr:not(:last-child){border-bottom:1px solid hsl(213,8%,90%)}.bb-collections-table-info{padding:3rem 1.5rem}.bb-collections-table-info-text{color:#525252;margin:0 auto;display:block;line-height:2;max-width:30rem;text-align:center;font-size:.875rem}.bb-collections-table-info-text>strong{font-weight:500}.bb-collections-table-info-text>strong:before{content:\"\\201c\"}.bb-collections-table-info-text>strong:after{content:\"\\201d\"}.bb-collections-table-image{width:100%;height:auto;display:flex;max-width:7.5rem;margin:0 auto 1.5rem;background-size:contain;background-repeat:no-repeat;background-position:center center}.bb-collections-table-image.empty{aspect-ratio:154/132;mask-image:linear-gradient(to bottom,black 25%,transparent 100%);background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 154 132\"%3E%3Cg fill=\"none\" fill-rule=\"evenodd\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3Cg transform=\"translate(0 46)\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3C/g%3E%3Cg transform=\"translate(0 92)\"%3E%3Crect width=\"154\" height=\"40\" fill=\"%23FFF\" fill-rule=\"nonzero\" rx=\"8\"/%3E%3Crect width=\"24\" height=\"24\" x=\"8\" y=\"8\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"4\"/%3E%3Crect width=\"60\" height=\"6\" x=\"40\" y=\"11\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"106\" height=\"6\" x=\"40\" y=\"23\" fill=\"%23E5E7EB\" fill-rule=\"nonzero\" rx=\"3\"/%3E%3Crect width=\"153\" height=\"39\" x=\".5\" y=\".5\" stroke=\"%23E5E7EB\" rx=\"7.5\"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E')}.bb-collections-table-image.error{max-width:4rem;aspect-ratio:1;background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 132 132\"%3E%3Cpath fill=\"%23C23934\" d=\"M65.958253 98.6024096c.8892771 0 1.6486747-.3008433 2.2781928-.9025301.6295181-.6016867.9442771-1.3471687.9442771-2.2364458 0-.8892771-.3008434-1.6486747-.9025301-2.2781927-.6016868-.6295181-1.3471687-.9442771-2.2364458-.9442771-.8892771 0-1.6486747.3008433-2.2781928.9025301-.6295181.6016867-.9442771 1.3471687-.9442771 2.2364458 0 .8892771.3008434 1.6486747.9025301 2.2781927.6016868.6295181 1.3471687.9442771 2.2364458.9442771Zm-1.9462048-21.4698795h3.9759036V29.4216867h-3.9759036v47.7108434ZM66.0894578 132c-9.0716867 0-17.6205421-1.715602-25.6465662-5.146807-8.0260241-3.431205-15.0547591-8.159217-21.0862049-14.184036-6.032771-6.02482-10.76674694-13.0416269-14.20192766-21.0504221C1.71825301 83.6086145 0 75.0504819 0 65.9443373 0 56.8368675 1.71560241 48.303253 5.14680723 40.343494c3.43120482-7.9597591 8.15921687-14.9553615 14.18403617-20.9868073 6.0248193-6.032771 13.0416265-10.76674694 21.0504217-14.20192766C48.3913855 1.71825301 56.9495181 0 66.0556627 0 75.1631325 0 83.696747 1.71560241 91.656506 5.14680723c7.9597591 3.43120482 14.955361 8.15921687 20.986807 14.18403617 6.032771 6.0248193 10.766747 13.0263855 14.201928 21.0046988C130.281747 48.3138554 132 56.8388554 132 65.9105422c0 9.0716867-1.715602 17.6205421-5.146807 25.6465662-3.431205 8.0260241-8.159217 15.0547586-14.184036 21.0862046-6.02482 6.032771-13.0263859 10.766747-21.0046992 14.201928C83.6861446 130.281747 75.1611446 132 66.0894578 132ZM66 128.024096c17.2289157 0 31.873494-6.03012 43.933735-18.090361C121.993976 97.873494 128.024096 83.2289157 128.024096 66c0-17.2289157-6.03012-31.873494-18.090361-43.9337349C97.873494 10.0060241 83.2289157 3.97590361 66 3.97590361c-17.2289157 0-31.873494 6.03012049-43.9337349 18.09036149C10.0060241 34.126506 3.97590361 48.7710843 3.97590361 66c0 17.2289157 6.03012049 31.873494 18.09036149 43.933735C34.126506 121.993976 48.7710843 128.024096 66 128.024096Z\"/%3E%3C/svg%3E')}@keyframes collectionsFadeIn{0%{opacity:0}to{opacity:1}}@keyframes collectionsIndeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes collectionsBlink{25%{opacity:.6}50%{opacity:.4}75%{opacity:.6}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BbCollectionsViewer, selector: "[bb-collections-viewer]", inputs: ["collection"] }, { kind: "directive", type: BbCollectionsData, selector: "ng-template[bbCollectionsData]" }, { kind: "directive", type: BbCollectionsEmpty, selector: "ng-template[bbCollectionsEmpty]" }, { kind: "directive", type: BbCollectionsError, selector: "ng-template[bbCollectionsError]" }, { kind: "directive", type: BbCollectionsInitial, selector: "ng-template[bbCollectionsInitial]" }, { kind: "component", type: BbCollectionsActions, selector: "bb-collections-actions", inputs: ["collection", "queryPlaceholder", "standalone"] }, { kind: "component", type: BbCollectionsPager, selector: "bb-collections-pager", inputs: ["maxAmountOfButtons", "collection"] }, { kind: "component", type: BbLocalizeString, selector: "[bb-localize-string]", inputs: ["substitutions", "bb-localize-string"] }, { kind: "directive", type: BbTemplate, selector: "[bbTemplate]", inputs: ["bbTemplate"] }, { kind: "pipe", type: BbLocalize, name: "bbLocalize" }, { kind: "directive", type: BbLocalizeTemplate, selector: "ng-template[bbLocalizeTemplate]", inputs: ["bbLocalizeTemplate"] }, { kind: "component", type: BbSpinner, selector: "bb-spinner", inputs: ["color", "alt", "disabled"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
592
604
|
}
|
|
593
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
605
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTable, decorators: [{
|
|
594
606
|
type: Component,
|
|
595
607
|
args: [{ selector: 'bb-collections-table', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
596
608
|
'class': 'bb-collections-table',
|
|
@@ -680,16 +692,16 @@ class BbCollectionsTableSorting {
|
|
|
680
692
|
const newIndex = (index + 1) % this.orderedOptions?.length;
|
|
681
693
|
return this.orderedOptions?.[newIndex] ?? null;
|
|
682
694
|
}
|
|
683
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
684
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
695
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTableSorting, deps: [{ token: 'bb-collections-table-sorting', attribute: true }, { token: i0.ChangeDetectorRef }, { token: BbCollectionsTable, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
696
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: BbCollectionsTableSorting, isStandalone: true, selector: "th[bb-collections-table-sorting]", host: { listeners: { "click": "onClick()" }, properties: { "class.asc": "direction === 'asc'", "class.desc": "direction === 'desc'" }, classAttribute: "bb-collections-table-sorting" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".bb-collections-table-sorting{cursor:pointer;-webkit-user-select:none;user-select:none;background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E');background-repeat:no-repeat;padding-right:2.5rem!important;background-size:.5625rem .9375rem;background-position:center right 1rem;transition:background-color .2s cubic-bezier(0,0,.2,1)}.bb-collections-table-sorting:hover,.bb-collections-table-sorting:focus{background-color:#f4f0f0}.bb-collections-table-sorting:active{background-color:#f0ebeb}.bb-collections-table-sorting.asc{background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"black\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E')}.bb-collections-table-sorting.desc{background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"black\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E')}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
685
697
|
}
|
|
686
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
698
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTableSorting, decorators: [{
|
|
687
699
|
type: Component,
|
|
688
700
|
args: [{ selector: 'th[bb-collections-table-sorting]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
689
701
|
'class': 'bb-collections-table-sorting',
|
|
690
702
|
'[class.asc]': 'direction === \'asc\'',
|
|
691
703
|
'[class.desc]': 'direction === \'desc\''
|
|
692
|
-
}, template: "<ng-content></ng-content>\n", styles: [".bb-collections-table-sorting{cursor:pointer;-webkit-user-select:none;user-select:none;background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E');background-repeat:no-repeat;padding-right:2.5rem!important;background-size:.5625rem .9375rem;background-position:center right 1rem;transition:background-color .
|
|
704
|
+
}, template: "<ng-content></ng-content>\n", styles: [".bb-collections-table-sorting{cursor:pointer;-webkit-user-select:none;user-select:none;background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E');background-repeat:no-repeat;padding-right:2.5rem!important;background-size:.5625rem .9375rem;background-position:center right 1rem;transition:background-color .2s cubic-bezier(0,0,.2,1)}.bb-collections-table-sorting:hover,.bb-collections-table-sorting:focus{background-color:#f4f0f0}.bb-collections-table-sorting:active{background-color:#f0ebeb}.bb-collections-table-sorting.asc{background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"black\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E')}.bb-collections-table-sorting.desc{background-image:url('data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 9 15\" width=\"9\" height=\"15\"%3E%3Cpath fill=\"%23dcdcdc\" d=\"M4.5 0L0 7h9z\"%3E%3C/path%3E%3Cpath fill=\"black\" d=\"M4.5 15L9 8H0z\"%3E%3C/path%3E%3C/svg%3E')}\n"] }]
|
|
693
705
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
694
706
|
type: Attribute,
|
|
695
707
|
args: ['bb-collections-table-sorting']
|
|
@@ -707,10 +719,10 @@ class BbCollectionsTableLabel {
|
|
|
707
719
|
imageUrl = null;
|
|
708
720
|
alt = null;
|
|
709
721
|
type = 'image';
|
|
710
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
711
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
722
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTableLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
723
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsTableLabel, isStandalone: true, selector: "[bb-collections-table-label]", inputs: { titleLabel: "titleLabel", descriptionLabel: "descriptionLabel", imageUrl: "imageUrl", alt: "alt", type: "type" }, host: { classAttribute: "bb-collections-table-label" }, ngImport: i0, template: "@switch (type) {\n @case ('avatar') {\n <bb-avatar [title]=\"alt ?? '...'\"\n [src]=\"imageUrl\"\n size=\"2\"\n class=\"bb-collections-table-label-avatar\">\n </bb-avatar>\n }\n @case ('content') {\n <ng-content></ng-content>\n }\n @default {\n @if (imageUrl; as src) {\n <div [style.background-image]=\"'url(' + src + ')'\"\n class=\"bb-collections-table-label-image\"></div>\n }\n }\n}\n\n<div class=\"bb-collections-table-label-content\">\n <span class=\"bb-collections-table-label-title\"><ng-template\n [bbTemplate]=\"titleLabel\">{{ titleLabel }}</ng-template></span>\n @if (descriptionLabel; as descriptionContent) {\n <small class=\"bb-collections-table-label-description\">\n <ng-template [bbTemplate]=\"descriptionContent\">{{ descriptionContent }}</ng-template>\n </small>\n }\n</div>\n", styles: [".bb-collections-table-label{align-items:center;display:inline-flex}a.bb-collections-table-label{text-decoration:none}a.bb-collections-table-label>.bb-collections-table-label-content>.bb-collections-table-label-title,a.bb-collections-table-label:visited>.bb-collections-table-label-content>.bb-collections-table-label-title{text-underline-offset:.25rem;text-decoration:dotted underline;text-decoration-thickness:1px;color:var(--bb-collections-table-label-color)}a.bb-collections-table-label>.bb-collections-table-label-content>.bb-collections-table-label-description,a.bb-collections-table-label:visited>.bb-collections-table-label-content>.bb-collections-table-label-description{color:#758795}a.bb-collections-table-label:hover>.bb-collections-table-label-content>.bb-collections-table-label-title,a.bb-collections-table-label:focus>.bb-collections-table-label-content>.bb-collections-table-label-title{text-decoration-style:solid}.bb-collections-table-label-image,.bb-collections-table-label-avatar{width:2rem;height:2rem;min-width:2rem;min-height:2rem;margin-right:.5rem}.bb-collections-table-label-image{background-size:contain;background-repeat:no-repeat;background-position:center center}.bb-collections-table-label-content{display:block}.bb-collections-table-label-title{display:block;color:#111;line-height:1.6;font-size:.875rem}.bb-collections-table-label-description{display:block;line-height:1.6;margin-top:.25rem;font-size:.8125rem;color:#758795}\n"], dependencies: [{ kind: "component", type: BbAvatar, selector: "bb-avatar", inputs: ["size", "unit", "src", "title", "tintColor"] }, { kind: "directive", type: BbTemplate, selector: "[bbTemplate]", inputs: ["bbTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
712
724
|
}
|
|
713
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
725
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsTableLabel, decorators: [{
|
|
714
726
|
type: Component,
|
|
715
727
|
args: [{ selector: '[bb-collections-table-label]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'bb-collections-table-label' }, imports: [BbAvatar, BbTemplate], template: "@switch (type) {\n @case ('avatar') {\n <bb-avatar [title]=\"alt ?? '...'\"\n [src]=\"imageUrl\"\n size=\"2\"\n class=\"bb-collections-table-label-avatar\">\n </bb-avatar>\n }\n @case ('content') {\n <ng-content></ng-content>\n }\n @default {\n @if (imageUrl; as src) {\n <div [style.background-image]=\"'url(' + src + ')'\"\n class=\"bb-collections-table-label-image\"></div>\n }\n }\n}\n\n<div class=\"bb-collections-table-label-content\">\n <span class=\"bb-collections-table-label-title\"><ng-template\n [bbTemplate]=\"titleLabel\">{{ titleLabel }}</ng-template></span>\n @if (descriptionLabel; as descriptionContent) {\n <small class=\"bb-collections-table-label-description\">\n <ng-template [bbTemplate]=\"descriptionContent\">{{ descriptionContent }}</ng-template>\n </small>\n }\n</div>\n", styles: [".bb-collections-table-label{align-items:center;display:inline-flex}a.bb-collections-table-label{text-decoration:none}a.bb-collections-table-label>.bb-collections-table-label-content>.bb-collections-table-label-title,a.bb-collections-table-label:visited>.bb-collections-table-label-content>.bb-collections-table-label-title{text-underline-offset:.25rem;text-decoration:dotted underline;text-decoration-thickness:1px;color:var(--bb-collections-table-label-color)}a.bb-collections-table-label>.bb-collections-table-label-content>.bb-collections-table-label-description,a.bb-collections-table-label:visited>.bb-collections-table-label-content>.bb-collections-table-label-description{color:#758795}a.bb-collections-table-label:hover>.bb-collections-table-label-content>.bb-collections-table-label-title,a.bb-collections-table-label:focus>.bb-collections-table-label-content>.bb-collections-table-label-title{text-decoration-style:solid}.bb-collections-table-label-image,.bb-collections-table-label-avatar{width:2rem;height:2rem;min-width:2rem;min-height:2rem;margin-right:.5rem}.bb-collections-table-label-image{background-size:contain;background-repeat:no-repeat;background-position:center center}.bb-collections-table-label-content{display:block}.bb-collections-table-label-title{display:block;color:#111;line-height:1.6;font-size:.875rem}.bb-collections-table-label-description{display:block;line-height:1.6;margin-top:.25rem;font-size:.8125rem;color:#758795}\n"] }]
|
|
716
728
|
}], propDecorators: { titleLabel: [{
|
|
@@ -741,10 +753,10 @@ class BbCollectionsGrid {
|
|
|
741
753
|
get collection() {
|
|
742
754
|
return this.collection$.getValue();
|
|
743
755
|
}
|
|
744
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
745
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
756
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsGrid, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
757
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: BbCollectionsGrid, isStandalone: true, selector: "bb-collections-grid", inputs: { queryPlaceholder: "queryPlaceholder", hideActions: ["hideActions", "hideActions", booleanAttribute], hidePager: ["hidePager", "hidePager", booleanAttribute], collection: "collection" }, host: { classAttribute: "bb-collections-grid" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: BbCollectionsItem, descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (!hideActions) {\n <bb-collections-actions [collection]=\"collection\"\n [queryPlaceholder]=\"queryPlaceholder\"\n standalone>\n <ng-content ngProjectAs=\"[data-collections-action]\"\n select=\"[data-collections-action]\"></ng-content>\n <ng-content ngProjectAs=\"[data-collections-row]\"\n select=\"[data-collections-row]\"></ng-content>\n </bb-collections-actions>\n}\n\n<div [collection]=\"collection\"\n class=\"bb-collections-grid-container\"\n bb-collections-viewer>\n <ul *bbCollectionsData=\"let items = items\"\n class=\"bb-collections-grid-list\">\n @for (item of items; track $index) {\n <li class=\"bb-collections-grid-item\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: {$implicit: item, item: item}\"></ng-container>\n </li>\n }\n </ul>\n</div>\n\n@if (!hidePager) {\n <footer class=\"bb-collections-grid-footer\">\n <bb-collections-pager [collection]=\"collection\"></bb-collections-pager>\n </footer>\n}\n", styles: [".bb-collections-grid{display:block}.bb-collections-grid-list{gap:1.5rem;display:flex;flex-wrap:wrap}.bb-collections-grid-item{width:100%;display:flex}.bb-collections-grid-footer{margin-top:1.5rem}\n"], dependencies: [{ kind: "directive", type: BbCollectionsData, selector: "ng-template[bbCollectionsData]" }, { kind: "component", type: BbCollectionsViewer, selector: "[bb-collections-viewer]", inputs: ["collection"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BbCollectionsActions, selector: "bb-collections-actions", inputs: ["collection", "queryPlaceholder", "standalone"] }, { kind: "component", type: BbCollectionsPager, selector: "bb-collections-pager", inputs: ["maxAmountOfButtons", "collection"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
746
758
|
}
|
|
747
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
759
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BbCollectionsGrid, decorators: [{
|
|
748
760
|
type: Component,
|
|
749
761
|
args: [{ selector: 'bb-collections-grid', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'bb-collections-grid' }, imports: [
|
|
750
762
|
BbCollectionsData,
|
|
@@ -871,8 +883,8 @@ class Collection {
|
|
|
871
883
|
}
|
|
872
884
|
|
|
873
885
|
class CollectionsModule {
|
|
874
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
875
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.
|
|
886
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: CollectionsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
887
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: CollectionsModule, imports: [BbCollectionsViewer,
|
|
876
888
|
BbCollectionsPager,
|
|
877
889
|
BbCollectionsTable,
|
|
878
890
|
BbCollectionsTableSorting,
|
|
@@ -897,13 +909,13 @@ class CollectionsModule {
|
|
|
897
909
|
BbCollectionsError,
|
|
898
910
|
BbCollectionsInitial,
|
|
899
911
|
BbCollectionsItem] });
|
|
900
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.
|
|
912
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: CollectionsModule, imports: [BbCollectionsPager,
|
|
901
913
|
BbCollectionsTable,
|
|
902
914
|
BbCollectionsTableLabel,
|
|
903
915
|
BbCollectionsGrid,
|
|
904
916
|
BbCollectionsActions] });
|
|
905
917
|
}
|
|
906
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
918
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: CollectionsModule, decorators: [{
|
|
907
919
|
type: NgModule,
|
|
908
920
|
args: [{
|
|
909
921
|
imports: [
|
|
@@ -939,9 +951,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
|
|
|
939
951
|
}]
|
|
940
952
|
}] });
|
|
941
953
|
|
|
954
|
+
function provideCollectionsConfig(config) {
|
|
955
|
+
return makeEnvironmentProviders([
|
|
956
|
+
{ provide: COLLECTIONS_CONFIG, useValue: config }
|
|
957
|
+
]);
|
|
958
|
+
}
|
|
959
|
+
|
|
942
960
|
/**
|
|
943
961
|
* Generated bundle index. Do not edit.
|
|
944
962
|
*/
|
|
945
963
|
|
|
946
|
-
export { ApiCollectionProvider, ArrayCollection, BbCollectionsActions, BbCollectionsData, BbCollectionsDataContext, BbCollectionsDataRow, BbCollectionsDataRowContext, BbCollectionsEmpty, BbCollectionsEmptyContext, BbCollectionsError, BbCollectionsErrorContext, BbCollectionsGrid, BbCollectionsInitial, BbCollectionsInitialContext, BbCollectionsItem, BbCollectionsItemContext, BbCollectionsPager, BbCollectionsTable, BbCollectionsTableLabel, BbCollectionsTableSorting, BbCollectionsViewer, Collection, CollectionProvider, CollectionState, CollectionsModule, LocalCollectionProvider };
|
|
964
|
+
export { ApiCollectionProvider, ArrayCollection, BbCollectionsActions, BbCollectionsData, BbCollectionsDataContext, BbCollectionsDataRow, BbCollectionsDataRowContext, BbCollectionsEmpty, BbCollectionsEmptyContext, BbCollectionsError, BbCollectionsErrorContext, BbCollectionsGrid, BbCollectionsInitial, BbCollectionsInitialContext, BbCollectionsItem, BbCollectionsItemContext, BbCollectionsPager, BbCollectionsTable, BbCollectionsTableLabel, BbCollectionsTableSorting, BbCollectionsViewer, COLLECTIONS_CONFIG, Collection, CollectionProvider, CollectionState, CollectionsModule, LocalCollectionProvider, provideCollectionsConfig };
|
|
947
965
|
//# sourceMappingURL=bravobit-bb-foundation-collections.mjs.map
|