@bravobit/bb-foundation 0.21.5 → 0.21.6
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/elements/lib/directives/form-submitter.directive.d.ts +9 -0
- package/elements/lib/elements.module.d.ts +25 -24
- package/elements/lib/form-error/form-error.component.d.ts +9 -5
- package/elements/public_api.d.ts +1 -0
- package/esm2020/elements/lib/directives/form-submitter.directive.mjs +25 -0
- package/esm2020/elements/lib/elements.module.mjs +5 -1
- package/esm2020/elements/lib/form-error/form-error.component.mjs +21 -6
- package/esm2020/elements/public_api.mjs +2 -1
- package/fesm2015/bravobit-bb-foundation-elements.mjs +47 -8
- package/fesm2015/bravobit-bb-foundation-elements.mjs.map +1 -1
- package/fesm2020/bravobit-bb-foundation-elements.mjs +47 -8
- package/fesm2020/bravobit-bb-foundation-elements.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -9,7 +9,7 @@ import { mixinDisabled, mixinLoad, mixinGrouped, mixinFocused, mixinReadonly, mi
|
|
|
9
9
|
import * as i2 from '@angular/forms';
|
|
10
10
|
import { NG_VALUE_ACCESSOR, NgControl, NG_VALIDATORS, Validators, FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';
|
|
11
11
|
import { map, startWith, distinctUntilChanged, shareReplay, tap, delay } from 'rxjs/operators';
|
|
12
|
-
import * as
|
|
12
|
+
import * as i1$2 from '@bravobit/bb-foundation/localize';
|
|
13
13
|
import { LocalizeModule } from '@bravobit/bb-foundation/localize';
|
|
14
14
|
import * as i2$1 from '@angular/platform-browser';
|
|
15
15
|
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
@@ -112,6 +112,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImpor
|
|
|
112
112
|
const ELEMENTS_ICONS = new InjectionToken('elements_icons');
|
|
113
113
|
const ELEMENTS_ERRORS = new InjectionToken('elements_errors');
|
|
114
114
|
|
|
115
|
+
class BbFormSubmitter {
|
|
116
|
+
constructor() {
|
|
117
|
+
// State.
|
|
118
|
+
this.submitted$ = new BehaviorSubject(false);
|
|
119
|
+
}
|
|
120
|
+
submit() {
|
|
121
|
+
this.submitted$.next(true);
|
|
122
|
+
}
|
|
123
|
+
reset() {
|
|
124
|
+
this.submitted$.next(false);
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
BbFormSubmitter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbFormSubmitter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
128
|
+
BbFormSubmitter.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.5", type: BbFormSubmitter, selector: "[bbFormSubmitter]", exportAs: ["bbFormSubmitter"], ngImport: i0 });
|
|
129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbFormSubmitter, decorators: [{
|
|
130
|
+
type: Directive,
|
|
131
|
+
args: [{
|
|
132
|
+
selector: '[bbFormSubmitter]',
|
|
133
|
+
exportAs: 'bbFormSubmitter'
|
|
134
|
+
}]
|
|
135
|
+
}] });
|
|
136
|
+
|
|
115
137
|
class BbSpinnerBase {
|
|
116
138
|
}
|
|
117
139
|
const BbSpinnerMixinBase = mixinDisabled(BbSpinnerBase);
|
|
@@ -360,9 +382,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImpor
|
|
|
360
382
|
}] }]; } });
|
|
361
383
|
|
|
362
384
|
class BbFormError {
|
|
363
|
-
constructor(_form, _control, _errors) {
|
|
385
|
+
constructor(_form, _control, _formSubmitter, _errors) {
|
|
364
386
|
this._form = _form;
|
|
365
387
|
this._control = _control;
|
|
388
|
+
this._formSubmitter = _formSubmitter;
|
|
366
389
|
this._errors = _errors;
|
|
367
390
|
// Outputs.
|
|
368
391
|
this.errorChange = new EventEmitter();
|
|
@@ -421,11 +444,22 @@ class BbFormError {
|
|
|
421
444
|
return errorFunction(error);
|
|
422
445
|
}
|
|
423
446
|
submitStatusChanges() {
|
|
447
|
+
const native$ = this.getNativeFormSubmit();
|
|
448
|
+
const manual$ = this.getManualFormSubmit();
|
|
449
|
+
return combineLatest([native$, manual$]).pipe(map(([native, manual]) => native || manual), distinctUntilChanged());
|
|
450
|
+
}
|
|
451
|
+
getNativeFormSubmit() {
|
|
424
452
|
if (!this._form) {
|
|
425
453
|
return of(true);
|
|
426
454
|
}
|
|
427
455
|
return this._form.submitStatus$;
|
|
428
456
|
}
|
|
457
|
+
getManualFormSubmit() {
|
|
458
|
+
if (!this._formSubmitter) {
|
|
459
|
+
return of(false);
|
|
460
|
+
}
|
|
461
|
+
return this._formSubmitter.submitted$.pipe(distinctUntilChanged());
|
|
462
|
+
}
|
|
429
463
|
statusChanges() {
|
|
430
464
|
if (!this.control) {
|
|
431
465
|
return EMPTY;
|
|
@@ -436,8 +470,8 @@ class BbFormError {
|
|
|
436
470
|
return this.control.statusChanges.pipe(startWith(this.control.status), delay(0));
|
|
437
471
|
}
|
|
438
472
|
}
|
|
439
|
-
BbFormError.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbFormError, deps: [{ token: BbFormSubmit, optional: true }, { token: i2.NgControl, optional: true }, { token: ELEMENTS_ERRORS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
440
|
-
BbFormError.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.5", type: BbFormError, selector: "bb-form-error", inputs: { control: "control" }, outputs: { errorChange: "errorChange" }, host: { classAttribute: "bb-form-error" }, ngImport: i0, template: "<ng-container *ngIf=\"error$ | async as error\">\n <p *ngIf=\"error?.token | bbLocalize:{optional: true, data: error?.data} as message\"\n class=\"bb-form-error-message\">\n {{ message }}\n </p>\n</ng-container>", styles: [".bb-form-error{display:block}.bb-form-error-message{color:#c23934;display:block;font-size:13px;margin-top:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type:
|
|
473
|
+
BbFormError.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbFormError, deps: [{ token: BbFormSubmit, optional: true }, { token: i2.NgControl, optional: true }, { token: BbFormSubmitter, optional: true }, { token: ELEMENTS_ERRORS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
474
|
+
BbFormError.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.5", type: BbFormError, selector: "bb-form-error", inputs: { control: "control" }, outputs: { errorChange: "errorChange" }, host: { classAttribute: "bb-form-error" }, ngImport: i0, template: "<ng-container *ngIf=\"error$ | async as error\">\n <p *ngIf=\"error?.token | bbLocalize:{optional: true, data: error?.data} as message\"\n class=\"bb-form-error-message\">\n {{ message }}\n </p>\n</ng-container>", styles: [".bb-form-error{display:block}.bb-form-error-message{color:#c23934;display:block;font-size:13px;margin-top:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.BbLocalize, name: "bbLocalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
441
475
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbFormError, decorators: [{
|
|
442
476
|
type: Component,
|
|
443
477
|
args: [{ selector: 'bb-form-error', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
@@ -447,6 +481,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImpor
|
|
|
447
481
|
type: Optional
|
|
448
482
|
}] }, { type: i2.NgControl, decorators: [{
|
|
449
483
|
type: Optional
|
|
484
|
+
}] }, { type: BbFormSubmitter, decorators: [{
|
|
485
|
+
type: Optional
|
|
450
486
|
}] }, { type: undefined, decorators: [{
|
|
451
487
|
type: Optional
|
|
452
488
|
}, {
|
|
@@ -715,7 +751,7 @@ BbFilePicker.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
|
|
|
715
751
|
useExisting: BbFilePicker,
|
|
716
752
|
multi: true
|
|
717
753
|
}
|
|
718
|
-
], queries: [{ propertyName: "extraTemplate", first: true, predicate: ["extra"], descendants: true }], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!-- The label of the input. -->\n<label *ngIf=\"label as labelContent\"\n [for]=\"labelId\"\n class=\"bb-file-picker-label\">\n <ng-template [bbTemplate]=\"labelContent\">\n {{ labelContent }}\n </ng-template>\n</label>\n\n<!-- The input that can open the file picker. -->\n<input #fileInput\n [accept]=\"accept\"\n [disabled]=\"disabled\"\n (change)=\"onFileChange($event)\"\n class=\"bb-file-picker-input\"\n type=\"file\"\n tabindex=\"-1\">\n\n<div *ngIf=\"value$ | async as data\"\n class=\"bb-file-picker-wrapper\">\n <!-- The button that accepts files. -->\n <div class=\"bb-file-picker-container\">\n <button [class.destructive]=\"!!data?.file\"\n [class.standalone]=\"!allowDragging\"\n [disabled]=\"disabled\"\n [id]=\"labelId\"\n (click)=\"onButtonPressed(data?.file)\"\n type=\"button\"\n class=\"bb-file-picker-button\">\n <ng-container *ngTemplateOutlet=\"data?.file ? closeIcon : uploadIcon\"></ng-container>\n {{ (data?.file ? 'file-picker.remove' : 'file-picker.choose') | bbLocalize }}\n </button>\n <div *ngIf=\"allowDragging\"\n class=\"bb-file-picker-zone\">\n {{ 'file-picker.drop' | bbLocalize }}\n </div>\n </div>\n\n <ng-container *ngIf=\"!!extraTemplate\">\n <ng-container *ngTemplateOutlet=\"extraTemplate; context: {$implicit: data?.file}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"showImages\">\n <div *ngIf=\"data?.file | bbFileImage | async as image\"\n class=\"bb-file-picker-image-container\">\n <div class=\"bb-file-picker-image-wrapper\">\n <div [@bbFilePickerImageAnimation]=\"true\"\n [style.padding-top.%]=\"image?.aspectRatio * 100\"\n [style.background-image]=\"image?.background\"\n class=\"bb-file-picker-image\">\n </div>\n </div>\n </div>\n </ng-container>\n\n <!-- Extra information of the file. -->\n <div [class.visible]=\"!!data?.file\"\n class=\"bb-file-picker-info\">\n <span *ngIf=\"data?.file?.name as name\">{{ name }}</span>\n <span *ngIf=\"data?.file?.size as size\">{{ size | bbFileSize }}</span>\n </div>\n</div>\n\n<bb-form-error *ngIf=\"!hideErrors\"\n (errorChange)=\"onErrorChange($event)\">\n</bb-form-error>\n\n<!-- The file picker hint. -->\n<p *ngIf=\"hint as hintContent\"\n class=\"bb-file-picker-hint\">\n <ng-template [bbTemplate]=\"hintContent\">\n {{ hintContent }}\n </ng-template>\n</p>\n\n<!-- Upload icon. -->\n<ng-template #uploadIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n class=\"bb-file-picker-icon\"\n width=\"24\"\n height=\"24\">\n <path fill=\"currentColor\"\n d=\"M2 12.5C2 9.46 4.46 7 7.5 7H18c2.21 0 4 1.79 4 4s-1.79 4-4 4H9.5a2.5 2.5 0 010-5H17v2H9.41c-.55 0-.55 1 0 1H18c1.1 0 2-.9 2-2s-.9-2-2-2H7.5C5.57 9 4 10.57 4 12.5S5.57 16 7.5 16H17v2H7.5C4.46 18 2 15.54 2 12.5z\"></path>\n <path fill=\"none\" d=\"M0 0h24v24H0V0z\"></path>\n </svg>\n</ng-template>\n\n<!-- Close icon. -->\n<ng-template #closeIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n class=\"bb-file-picker-icon\"\n width=\"24\"\n height=\"24\">\n <path fill=\"currentColor\"\n d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"></path>\n <path d=\"M0 0h24v24H0z\" fill=\"none\"></path>\n </svg>\n</ng-template>\n", styles: [".bb-file-picker{display:block}.bb-file-picker.disabled>.bb-file-picker-wrapper{cursor:default;background-color:#cccccca3}.bb-file-picker.grouped{margin-bottom:20px}.bb-file-picker.full>.bb-file-picker-wrapper{width:100%}.bb-file-picker:not(.disabled) .bb-file-picker-button{background-color:#fff}.bb-file-picker:not(.disabled):focus>.bb-file-picker-wrapper,.bb-file-picker:not(.disabled).hovered>.bb-file-picker-wrapper{box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a,0 0 0 3px #007bff33}.bb-file-picker.required>.bb-file-picker-label:after{content:\"*\";color:#c23934;font-size:12px;line-height:1.5}.bb-file-picker.error>.bb-file-picker-label{color:#c23934}.bb-file-picker.error>.bb-file-picker-hint{display:none}.bb-file-picker.error>.bb-file-picker-wrapper{border:1px solid #962b26;background-color:#c2393440!important;box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a,0 0 0 3px #c2393466!important}.bb-file-picker.error .bb-file-picker-button{background-color:transparent}.bb-file-picker-wrapper{max-width:100%;-webkit-user-select:none;user-select:none;border-radius:3px;display:inline-flex;flex-direction:column;border:1px solid #b6bbc1;background-color:#fff8ff;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a}.bb-file-picker-label{color:#000;display:block;position:relative;margin-bottom:4px}.bb-file-picker-input{opacity:0;z-index:-1;width:.1px;height:.1px;overflow:hidden;position:absolute}.bb-file-picker-container{min-height:38px;display:inline-flex}.bb-file-picker-button{margin:0;z-index:1;border:none;color:#2196f3;line-height:1;cursor:pointer;padding:0 12px;-webkit-appearance:none;appearance:none;font-weight:500;align-items:center;white-space:nowrap;display:inline-flex;border-top-left-radius:3px;border-bottom-left-radius:3px;border-right:1px solid #b6bbc1;background-color:#ffffff80;transition:box-shadow .2s cubic-bezier(0,0,.2,1)}.bb-file-picker-button:focus{box-shadow:0 0 0 3px #007bff33}.bb-file-picker-button:disabled{cursor:default}.bb-file-picker-button.destructive{color:#f55656}.bb-file-picker-button.standalone{width:100%;border-right:none;border-top-right-radius:3px;border-bottom-right-radius:3px}.bb-file-picker-icon{margin-right:4px}.bb-file-picker-zone{flex:1;color:#848f99;font-size:14px;padding:8px 12px;line-height:18px;align-items:center;display:inline-flex;justify-content:center}.bb-file-picker-info{height:0;color:#848f99;padding:0 12px;overflow:hidden;line-height:36px;align-items:center;display:inline-flex;background-color:#fff8ff;border-top:0 solid #b6bbc1;transition:height .2s cubic-bezier(0,0,.2,1)}.bb-file-picker-info.visible{height:38px;border-top-width:1px}.bb-file-picker-info>span{opacity:.4;max-width:100%;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bb-file-picker-info>span:first-child{flex:1}.bb-file-picker-info>span:last-child{margin-left:12px}.bb-file-picker-image-container{overflow:hidden;border-top:1px solid #b6bbc1}.bb-file-picker-image-wrapper{width:100%;max-width:40%;margin:20px auto}.bb-file-picker-image{width:100%;display:flex;overflow:hidden;position:relative;border-radius:4px;will-change:opacity;background-size:cover;background-position:center;background-repeat:no-repeat}.bb-file-picker-hint{display:block;color:#738694;font-size:13px;margin-top:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: BbTemplate, selector: "[bbTemplate]", inputs: ["bbTemplate"] }, { kind: "component", type: BbFormError, selector: "bb-form-error", inputs: ["control"], outputs: ["errorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type:
|
|
754
|
+
], queries: [{ propertyName: "extraTemplate", first: true, predicate: ["extra"], descendants: true }], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!-- The label of the input. -->\n<label *ngIf=\"label as labelContent\"\n [for]=\"labelId\"\n class=\"bb-file-picker-label\">\n <ng-template [bbTemplate]=\"labelContent\">\n {{ labelContent }}\n </ng-template>\n</label>\n\n<!-- The input that can open the file picker. -->\n<input #fileInput\n [accept]=\"accept\"\n [disabled]=\"disabled\"\n (change)=\"onFileChange($event)\"\n class=\"bb-file-picker-input\"\n type=\"file\"\n tabindex=\"-1\">\n\n<div *ngIf=\"value$ | async as data\"\n class=\"bb-file-picker-wrapper\">\n <!-- The button that accepts files. -->\n <div class=\"bb-file-picker-container\">\n <button [class.destructive]=\"!!data?.file\"\n [class.standalone]=\"!allowDragging\"\n [disabled]=\"disabled\"\n [id]=\"labelId\"\n (click)=\"onButtonPressed(data?.file)\"\n type=\"button\"\n class=\"bb-file-picker-button\">\n <ng-container *ngTemplateOutlet=\"data?.file ? closeIcon : uploadIcon\"></ng-container>\n {{ (data?.file ? 'file-picker.remove' : 'file-picker.choose') | bbLocalize }}\n </button>\n <div *ngIf=\"allowDragging\"\n class=\"bb-file-picker-zone\">\n {{ 'file-picker.drop' | bbLocalize }}\n </div>\n </div>\n\n <ng-container *ngIf=\"!!extraTemplate\">\n <ng-container *ngTemplateOutlet=\"extraTemplate; context: {$implicit: data?.file}\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"showImages\">\n <div *ngIf=\"data?.file | bbFileImage | async as image\"\n class=\"bb-file-picker-image-container\">\n <div class=\"bb-file-picker-image-wrapper\">\n <div [@bbFilePickerImageAnimation]=\"true\"\n [style.padding-top.%]=\"image?.aspectRatio * 100\"\n [style.background-image]=\"image?.background\"\n class=\"bb-file-picker-image\">\n </div>\n </div>\n </div>\n </ng-container>\n\n <!-- Extra information of the file. -->\n <div [class.visible]=\"!!data?.file\"\n class=\"bb-file-picker-info\">\n <span *ngIf=\"data?.file?.name as name\">{{ name }}</span>\n <span *ngIf=\"data?.file?.size as size\">{{ size | bbFileSize }}</span>\n </div>\n</div>\n\n<bb-form-error *ngIf=\"!hideErrors\"\n (errorChange)=\"onErrorChange($event)\">\n</bb-form-error>\n\n<!-- The file picker hint. -->\n<p *ngIf=\"hint as hintContent\"\n class=\"bb-file-picker-hint\">\n <ng-template [bbTemplate]=\"hintContent\">\n {{ hintContent }}\n </ng-template>\n</p>\n\n<!-- Upload icon. -->\n<ng-template #uploadIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n class=\"bb-file-picker-icon\"\n width=\"24\"\n height=\"24\">\n <path fill=\"currentColor\"\n d=\"M2 12.5C2 9.46 4.46 7 7.5 7H18c2.21 0 4 1.79 4 4s-1.79 4-4 4H9.5a2.5 2.5 0 010-5H17v2H9.41c-.55 0-.55 1 0 1H18c1.1 0 2-.9 2-2s-.9-2-2-2H7.5C5.57 9 4 10.57 4 12.5S5.57 16 7.5 16H17v2H7.5C4.46 18 2 15.54 2 12.5z\"></path>\n <path fill=\"none\" d=\"M0 0h24v24H0V0z\"></path>\n </svg>\n</ng-template>\n\n<!-- Close icon. -->\n<ng-template #closeIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n class=\"bb-file-picker-icon\"\n width=\"24\"\n height=\"24\">\n <path fill=\"currentColor\"\n d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"></path>\n <path d=\"M0 0h24v24H0z\" fill=\"none\"></path>\n </svg>\n</ng-template>\n", styles: [".bb-file-picker{display:block}.bb-file-picker.disabled>.bb-file-picker-wrapper{cursor:default;background-color:#cccccca3}.bb-file-picker.grouped{margin-bottom:20px}.bb-file-picker.full>.bb-file-picker-wrapper{width:100%}.bb-file-picker:not(.disabled) .bb-file-picker-button{background-color:#fff}.bb-file-picker:not(.disabled):focus>.bb-file-picker-wrapper,.bb-file-picker:not(.disabled).hovered>.bb-file-picker-wrapper{box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a,0 0 0 3px #007bff33}.bb-file-picker.required>.bb-file-picker-label:after{content:\"*\";color:#c23934;font-size:12px;line-height:1.5}.bb-file-picker.error>.bb-file-picker-label{color:#c23934}.bb-file-picker.error>.bb-file-picker-hint{display:none}.bb-file-picker.error>.bb-file-picker-wrapper{border:1px solid #962b26;background-color:#c2393440!important;box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a,0 0 0 3px #c2393466!important}.bb-file-picker.error .bb-file-picker-button{background-color:transparent}.bb-file-picker-wrapper{max-width:100%;-webkit-user-select:none;user-select:none;border-radius:3px;display:inline-flex;flex-direction:column;border:1px solid #b6bbc1;background-color:#fff8ff;transition:box-shadow .2s cubic-bezier(0,0,.2,1);box-shadow:inset 0 3px #b7bcc233,0 6px 6px -6px #0000001a}.bb-file-picker-label{color:#000;display:block;position:relative;margin-bottom:4px}.bb-file-picker-input{opacity:0;z-index:-1;width:.1px;height:.1px;overflow:hidden;position:absolute}.bb-file-picker-container{min-height:38px;display:inline-flex}.bb-file-picker-button{margin:0;z-index:1;border:none;color:#2196f3;line-height:1;cursor:pointer;padding:0 12px;-webkit-appearance:none;appearance:none;font-weight:500;align-items:center;white-space:nowrap;display:inline-flex;border-top-left-radius:3px;border-bottom-left-radius:3px;border-right:1px solid #b6bbc1;background-color:#ffffff80;transition:box-shadow .2s cubic-bezier(0,0,.2,1)}.bb-file-picker-button:focus{box-shadow:0 0 0 3px #007bff33}.bb-file-picker-button:disabled{cursor:default}.bb-file-picker-button.destructive{color:#f55656}.bb-file-picker-button.standalone{width:100%;border-right:none;border-top-right-radius:3px;border-bottom-right-radius:3px}.bb-file-picker-icon{margin-right:4px}.bb-file-picker-zone{flex:1;color:#848f99;font-size:14px;padding:8px 12px;line-height:18px;align-items:center;display:inline-flex;justify-content:center}.bb-file-picker-info{height:0;color:#848f99;padding:0 12px;overflow:hidden;line-height:36px;align-items:center;display:inline-flex;background-color:#fff8ff;border-top:0 solid #b6bbc1;transition:height .2s cubic-bezier(0,0,.2,1)}.bb-file-picker-info.visible{height:38px;border-top-width:1px}.bb-file-picker-info>span{opacity:.4;max-width:100%;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bb-file-picker-info>span:first-child{flex:1}.bb-file-picker-info>span:last-child{margin-left:12px}.bb-file-picker-image-container{overflow:hidden;border-top:1px solid #b6bbc1}.bb-file-picker-image-wrapper{width:100%;max-width:40%;margin:20px auto}.bb-file-picker-image{width:100%;display:flex;overflow:hidden;position:relative;border-radius:4px;will-change:opacity;background-size:cover;background-position:center;background-repeat:no-repeat}.bb-file-picker-hint{display:block;color:#738694;font-size:13px;margin-top:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: BbTemplate, selector: "[bbTemplate]", inputs: ["bbTemplate"] }, { kind: "component", type: BbFormError, selector: "bb-form-error", inputs: ["control"], outputs: ["errorChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.BbLocalize, name: "bbLocalize" }, { kind: "pipe", type: BbFileSize, name: "bbFileSize" }, { kind: "pipe", type: BbFileImage, name: "bbFileImage" }], animations: [
|
|
719
755
|
trigger('bbFilePickerImageAnimation', [
|
|
720
756
|
transition(':enter', [
|
|
721
757
|
style({ opacity: 0 }),
|
|
@@ -1471,14 +1507,14 @@ class BbRelativeTime {
|
|
|
1471
1507
|
});
|
|
1472
1508
|
}
|
|
1473
1509
|
}
|
|
1474
|
-
BbRelativeTime.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbRelativeTime, deps: [{ token:
|
|
1510
|
+
BbRelativeTime.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbRelativeTime, deps: [{ token: i1$2.Localize, optional: true }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1475
1511
|
BbRelativeTime.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.0.5", ngImport: i0, type: BbRelativeTime, name: "bbRelativeTime" });
|
|
1476
1512
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.5", ngImport: i0, type: BbRelativeTime, decorators: [{
|
|
1477
1513
|
type: Pipe,
|
|
1478
1514
|
args: [{
|
|
1479
1515
|
name: 'bbRelativeTime'
|
|
1480
1516
|
}]
|
|
1481
|
-
}], ctorParameters: function () { return [{ type:
|
|
1517
|
+
}], ctorParameters: function () { return [{ type: i1$2.Localize, decorators: [{
|
|
1482
1518
|
type: Optional
|
|
1483
1519
|
}] }, { type: undefined, decorators: [{
|
|
1484
1520
|
type: Inject,
|
|
@@ -1846,6 +1882,7 @@ const DECLARATIONS_EXPORTS = [
|
|
|
1846
1882
|
BbTemplate,
|
|
1847
1883
|
BbFormError,
|
|
1848
1884
|
BbFormSubmit,
|
|
1885
|
+
BbFormSubmitter,
|
|
1849
1886
|
BbInput,
|
|
1850
1887
|
BbSelect,
|
|
1851
1888
|
BbFocus,
|
|
@@ -1890,6 +1927,7 @@ ElementsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
|
|
|
1890
1927
|
BbTemplate,
|
|
1891
1928
|
BbFormError,
|
|
1892
1929
|
BbFormSubmit,
|
|
1930
|
+
BbFormSubmitter,
|
|
1893
1931
|
BbInput,
|
|
1894
1932
|
BbSelect,
|
|
1895
1933
|
BbFocus,
|
|
@@ -1920,6 +1958,7 @@ ElementsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
|
|
|
1920
1958
|
BbTemplate,
|
|
1921
1959
|
BbFormError,
|
|
1922
1960
|
BbFormSubmit,
|
|
1961
|
+
BbFormSubmitter,
|
|
1923
1962
|
BbInput,
|
|
1924
1963
|
BbSelect,
|
|
1925
1964
|
BbFocus,
|
|
@@ -1993,5 +2032,5 @@ function getErrors() {
|
|
|
1993
2032
|
* Generated bundle index. Do not edit.
|
|
1994
2033
|
*/
|
|
1995
2034
|
|
|
1996
|
-
export { BbAnchor, BbAutosize, BbAvatar, BbButton, BbCheckbox, BbDatePicker, BbDropdown, BbDropdownItem, BbFileImage, BbFilePicker, BbFileSize, BbFocus, BbFocusTrap, BbFormControl, BbFormError, BbFormGroup, BbFormSubmit, BbIcon, BbImagePicker, BbInput, BbPrefix, BbRelativeTime, BbSelect, BbSpinner, BbSuffix, BbTag, BbTemplate, ELEMENTS_ERRORS, ELEMENTS_ICONS, ELEMENTS_MATERIAL_ICON, ElementsModule, getErrors };
|
|
2035
|
+
export { BbAnchor, BbAutosize, BbAvatar, BbButton, BbCheckbox, BbDatePicker, BbDropdown, BbDropdownItem, BbFileImage, BbFilePicker, BbFileSize, BbFocus, BbFocusTrap, BbFormControl, BbFormError, BbFormGroup, BbFormSubmit, BbFormSubmitter, BbIcon, BbImagePicker, BbInput, BbPrefix, BbRelativeTime, BbSelect, BbSpinner, BbSuffix, BbTag, BbTemplate, ELEMENTS_ERRORS, ELEMENTS_ICONS, ELEMENTS_MATERIAL_ICON, ElementsModule, getErrors };
|
|
1997
2036
|
//# sourceMappingURL=bravobit-bb-foundation-elements.mjs.map
|