@skyux/forms 5.5.0 → 5.6.0
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/bundles/skyux-forms.umd.js +388 -388
- package/documentation.json +231 -233
- package/esm2015/lib/modules/character-counter/character-counter-indicator.component.js.map +1 -1
- package/esm2015/lib/modules/character-counter/character-counter.directive.js.map +1 -1
- package/esm2015/lib/modules/character-counter/character-counter.module.js +2 -2
- package/esm2015/lib/modules/character-counter/character-counter.module.js.map +1 -1
- package/esm2015/lib/modules/checkbox/checkbox-required-validator.directive.js.map +1 -1
- package/esm2015/lib/modules/checkbox/checkbox.component.js +1 -1
- package/esm2015/lib/modules/checkbox/checkbox.component.js.map +1 -1
- package/esm2015/lib/modules/checkbox/checkbox.module.js +1 -1
- package/esm2015/lib/modules/checkbox/checkbox.module.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-attachment-label.component.js +1 -1
- package/esm2015/lib/modules/file-attachment/file-attachment-label.component.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-attachment.component.js +3 -3
- package/esm2015/lib/modules/file-attachment/file-attachment.component.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-attachment.service.js +6 -6
- package/esm2015/lib/modules/file-attachment/file-attachment.service.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-attachments.module.js +3 -3
- package/esm2015/lib/modules/file-attachment/file-attachments.module.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-drop.component.js +7 -7
- package/esm2015/lib/modules/file-attachment/file-drop.component.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-item.component.js +2 -2
- package/esm2015/lib/modules/file-attachment/file-item.component.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-item.service.js +3 -3
- package/esm2015/lib/modules/file-attachment/file-item.service.js.map +1 -1
- package/esm2015/lib/modules/file-attachment/file-size.pipe.js +1 -1
- package/esm2015/lib/modules/file-attachment/file-size.pipe.js.map +1 -1
- package/esm2015/lib/modules/input-box/input-box-host.service.js.map +1 -1
- package/esm2015/lib/modules/input-box/input-box.component.js.map +1 -1
- package/esm2015/lib/modules/input-box/input-box.module.js +1 -1
- package/esm2015/lib/modules/input-box/input-box.module.js.map +1 -1
- package/esm2015/lib/modules/radio/radio-group.component.js.map +1 -1
- package/esm2015/lib/modules/radio/radio.component.js +1 -1
- package/esm2015/lib/modules/radio/radio.component.js.map +1 -1
- package/esm2015/lib/modules/radio/radio.module.js +2 -2
- package/esm2015/lib/modules/radio/radio.module.js.map +1 -1
- package/esm2015/lib/modules/selection-box/selection-box-adapter.service.js.map +1 -1
- package/esm2015/lib/modules/selection-box/selection-box-grid.component.js +2 -2
- package/esm2015/lib/modules/selection-box/selection-box-grid.component.js.map +1 -1
- package/esm2015/lib/modules/selection-box/selection-box.component.js.map +1 -1
- package/esm2015/lib/modules/selection-box/selection-box.module.js +1 -1
- package/esm2015/lib/modules/selection-box/selection-box.module.js.map +1 -1
- package/esm2015/lib/modules/shared/sky-forms-resources.module.js +1 -1
- package/esm2015/lib/modules/shared/sky-forms-resources.module.js.map +1 -1
- package/esm2015/lib/modules/toggle-switch/toggle-switch.component.js +1 -1
- package/esm2015/lib/modules/toggle-switch/toggle-switch.component.js.map +1 -1
- package/esm2015/lib/modules/toggle-switch/toggle-switch.module.js +2 -2
- package/esm2015/lib/modules/toggle-switch/toggle-switch.module.js.map +1 -1
- package/esm2015/testing/checkbox-fixture.js.map +1 -1
- package/fesm2015/skyux-forms-testing.js.map +1 -1
- package/fesm2015/skyux-forms.js +105 -105
- package/fesm2015/skyux-forms.js.map +1 -1
- package/lib/modules/checkbox/checkbox.component.d.ts +1 -1
- package/lib/modules/file-attachment/file-attachment.component.d.ts +2 -2
- package/lib/modules/file-attachment/file-drop.component.d.ts +2 -2
- package/lib/modules/file-attachment/file-item.component.d.ts +2 -2
- package/lib/modules/file-attachment/file-size.pipe.d.ts +1 -1
- package/lib/modules/input-box/input-box-host.service.d.ts +1 -1
- package/lib/modules/selection-box/selection-box-grid.component.d.ts +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"character-counter-indicator.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter-indicator.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter-indicator.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,iBAAiB,EACjB,SAAS,GACV,MAAM,eAAe,CAAC;;;;AAQvB,MAAM,OAAO,qCAAqC;IAOhD,YAAoB,cAAiC;QAAjC,mBAAc,GAAd,cAAc,CAAmB;QAH7C,+BAA0B,
|
|
1
|
+
{"version":3,"file":"character-counter-indicator.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter-indicator.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter-indicator.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,iBAAiB,EACjB,SAAS,GACV,MAAM,eAAe,CAAC;;;;AAQvB,MAAM,OAAO,qCAAqC;IAOhD,YAAoB,cAAiC;QAAjC,mBAAc,GAAd,cAAc,CAAmB;QAH7C,+BAA0B,GAAG,CAAC,CAAC;QAC/B,0BAAqB,GAAG,CAAC,CAAC;IAEsB,CAAC;IAEzD,IAAW,cAAc;QACvB,OAAO,IAAI,CAAC,qBAAqB,CAAC;IACpC,CAAC;IAED,IAAW,cAAc,CAAC,KAAa;QACrC,IAAI,CAAC,qBAAqB,GAAG,KAAK,CAAC;QACnC,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAED,IAAW,mBAAmB;QAC5B,OAAO,IAAI,CAAC,0BAA0B,CAAC;IACzC,CAAC;IAED,IAAW,mBAAmB,CAAC,KAAa;QAC1C,IAAI,CAAC,0BAA0B,GAAG,KAAK,CAAC;QACxC,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;;mIAzBU,qCAAqC;uHAArC,qCAAqC,uECZlD,qgBAeA;4FDHa,qCAAqC;kBANjD,SAAS;mBAAC;oBACT,QAAQ,EAAE,iCAAiC;oBAC3C,WAAW,EAAE,8CAA8C;oBAC3D,SAAS,EAAE,CAAC,8CAA8C,CAAC;oBAC3D,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n} from '@angular/core';\n\n@Component({\n selector: 'sky-character-counter-indicator',\n templateUrl: './character-counter-indicator.component.html',\n styleUrls: ['./character-counter-indicator.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyCharacterCounterIndicatorComponent {\n public characterCountMessage: string;\n public overLimitMessage: string;\n\n private currentCharacterCountLimit = 0;\n private currentCharacterCount = 0;\n\n constructor(private changeDetector: ChangeDetectorRef) {}\n\n public get characterCount(): number {\n return this.currentCharacterCount;\n }\n\n public set characterCount(count: number) {\n this.currentCharacterCount = count;\n this.changeDetector.markForCheck();\n }\n\n public get characterCountLimit(): number {\n return this.currentCharacterCountLimit;\n }\n\n public set characterCountLimit(limit: number) {\n this.currentCharacterCountLimit = limit;\n this.changeDetector.markForCheck();\n }\n}\n","<span\n class=\"sky-character-count-label sky-deemphasized\"\n [ngClass]=\"{ 'sky-error-label': characterCount > characterCountLimit }\"\n>\n {{ characterCount + '/' + characterCountLimit }}\n</span>\n<span aria-live=\"polite\" class=\"sky-screen-reader-only\">\n {{ characterCount }} {{ 'skyux_character_count_message' | skyLibResources }}\n {{ characterCountLimit }}.\n {{\n characterCount > characterCountLimit\n ? ('skyux_character_count_over_limit' | skyLibResources)\n : ''\n }}\n</span>\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"character-counter.directive.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"character-counter.directive.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAEL,aAAa,GAGd,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,qCAAqC,EAAE,MAAM,yCAAyC,CAAC;;AAEhG;;;;;GAKG;AAWH,MAAM,OAAO,iCAAiC;IAV9C;QA0EU,qBAAgB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;KACrC;IAxDC;;;;OAIG;IACH,IACW,wBAAwB,CAAC,KAAa;QAC/C,IAAI,CAAC,yBAAyB,GAAG,KAAK,CAAC;QACvC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QACzD,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,IAAW,wBAAwB;QACjC,OAAO,IAAI,CAAC,yBAAyB,IAAI,CAAC,CAAC;IAC7C,CAAC;IAIM,QAAQ,CAAC,OAAwB;QACtC,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;QAE5B,IAAI,CAAC,oBAAoB,CAAC,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;QAExD,IAAI,CAAC,KAAK,EAAE;YACV,OAAO;SACR;QAED,IAAI,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,wBAAwB,EAAE;YAChD,qEAAqE;YACrE,OAAO,CAAC,aAAa,EAAE,CAAC;YAExB,OAAO;gBACL,mBAAmB,EAAE;oBACnB,OAAO,EAAE,KAAK;iBACf;aACF,CAAC;SACH;IACH,CAAC;IAEM,yBAAyB,CAAC,EAAc;QAC7C,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;IAC7B,CAAC;IAEO,oBAAoB,CAAC,KAAa;QACxC,IAAI,IAAI,CAAC,4BAA4B,EAAE;YACrC,IAAI,CAAC,4BAA4B,CAAC,cAAc,GAAG,KAAK,CAAC;SAC1D;IACH,CAAC;IAEO,oBAAoB,CAAC,KAAa;QACxC,IAAI,IAAI,CAAC,4BAA4B,EAAE;YACrC,IAAI,CAAC,4BAA4B,CAAC,mBAAmB,GAAG,KAAK,CAAC;SAC/D;IACH,CAAC;;+HA9DU,iCAAiC;mHAAjC,iCAAiC,gLARjC;QACT;YACE,OAAO,EAAE,aAAa;YACtB,WAAW,EAAE,iCAAiC;YAC9C,KAAK,EAAE,IAAI;SACZ;KACF;4FAEU,iCAAiC;kBAV7C,SAAS;mBAAC;oBACT,QAAQ,EAAE,uBAAuB;oBACjC,SAAS,EAAE;wBACT;4BACE,OAAO,EAAE,aAAa;4BACtB,WAAW,mCAAmC;4BAC9C,KAAK,EAAE,IAAI;yBACZ;qBACF;iBACF;8BAQQ,4BAA4B;sBADlC,KAAK;gBASK,wBAAwB;sBADlC,KAAK","sourcesContent":["import { Directive, Input } from '@angular/core';\nimport {\n AbstractControl,\n NG_VALIDATORS,\n ValidationErrors,\n Validator,\n} from '@angular/forms';\n\nimport { SkyCharacterCounterIndicatorComponent } from './character-counter-indicator.component';\n\n/**\n * Creates an input field that validates the number of characters. Place this directive on\n * an `input` or `textarea` element. If users enter more characters than allowed, then the\n * input field is invalid and the component displays an error indicator.\n * @required\n */\n@Directive({\n selector: '[skyCharacterCounter]',\n providers: [\n {\n provide: NG_VALIDATORS,\n useExisting: SkyCharacterCounterInputDirective,\n multi: true,\n },\n ],\n})\nexport class SkyCharacterCounterInputDirective implements Validator {\n /**\n * Specifies the character count indicator component that displays the character count,\n * character limit, and over-the-limit indicator. Place this directive on an `input` or\n * `textarea` element.\n */\n @Input()\n public skyCharacterCounterIndicator: SkyCharacterCounterIndicatorComponent;\n\n /**\n * Specifies the maximum number of characters allowed in the input field. Place this directive\n * on an `input` or `textarea` element. This property accepts `number` values.\n * @required\n */\n @Input()\n public set skyCharacterCounterLimit(value: number) {\n this._skyCharacterCounterLimit = value;\n this.updateIndicatorLimit(this.skyCharacterCounterLimit);\n this._validatorChange();\n }\n\n public get skyCharacterCounterLimit(): number {\n return this._skyCharacterCounterLimit || 0;\n }\n\n private _skyCharacterCounterLimit: number;\n\n public validate(control: AbstractControl): ValidationErrors {\n const value = control.value;\n\n this.updateIndicatorCount((value && value.length) || 0);\n\n if (!value) {\n return;\n }\n\n if (value.length > this.skyCharacterCounterLimit) {\n // This is needed to apply the appropriate error styles to the input.\n control.markAsTouched();\n\n return {\n skyCharacterCounter: {\n invalid: value,\n },\n };\n }\n }\n\n public registerOnValidatorChange(fn: () => void): void {\n this._validatorChange = fn;\n }\n\n private updateIndicatorCount(count: number): void {\n if (this.skyCharacterCounterIndicator) {\n this.skyCharacterCounterIndicator.characterCount = count;\n }\n }\n\n private updateIndicatorLimit(limit: number): void {\n if (this.skyCharacterCounterIndicator) {\n this.skyCharacterCounterIndicator.characterCountLimit = limit;\n }\n }\n\n private _validatorChange = () => {};\n}\n"]}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
|
-
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
3
2
|
import { NgModule } from '@angular/core';
|
|
3
|
+
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
4
4
|
import { SkyI18nModule } from '@skyux/i18n';
|
|
5
5
|
import { SkyFormsResourcesModule } from '../shared/sky-forms-resources.module';
|
|
6
|
-
import { SkyCharacterCounterInputDirective } from './character-counter.directive';
|
|
7
6
|
import { SkyCharacterCounterIndicatorComponent } from './character-counter-indicator.component';
|
|
7
|
+
import { SkyCharacterCounterInputDirective } from './character-counter.directive';
|
|
8
8
|
import * as i0 from "@angular/core";
|
|
9
9
|
export class SkyCharacterCounterModule {
|
|
10
10
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"character-counter.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"character-counter.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/character-counter/character-counter.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EAAE,qCAAqC,EAAE,MAAM,yCAAyC,CAAC;AAChG,OAAO,EAAE,iCAAiC,EAAE,MAAM,+BAA+B,CAAC;;AAmBlF,MAAM,OAAO,yBAAyB;;uHAAzB,yBAAyB;wHAAzB,yBAAyB,iBAflC,iCAAiC;QACjC,qCAAqC,aAGrC,YAAY;QACZ,WAAW;QACX,mBAAmB;QACnB,uBAAuB;QACvB,aAAa,aAGb,iCAAiC;QACjC,qCAAqC;wHAG5B,yBAAyB,YAZ3B;YACP,YAAY;YACZ,WAAW;YACX,mBAAmB;YACnB,uBAAuB;YACvB,aAAa;SACd;4FAMU,yBAAyB;kBAjBrC,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,iCAAiC;wBACjC,qCAAqC;qBACtC;oBACD,OAAO,EAAE;wBACP,YAAY;wBACZ,WAAW;wBACX,mBAAmB;wBACnB,uBAAuB;wBACvB,aAAa;qBACd;oBACD,OAAO,EAAE;wBACP,iCAAiC;wBACjC,qCAAqC;qBACtC;iBACF","sourcesContent":["import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { SkyI18nModule } from '@skyux/i18n';\n\nimport { SkyFormsResourcesModule } from '../shared/sky-forms-resources.module';\n\nimport { SkyCharacterCounterIndicatorComponent } from './character-counter-indicator.component';\nimport { SkyCharacterCounterInputDirective } from './character-counter.directive';\n\n@NgModule({\n declarations: [\n SkyCharacterCounterInputDirective,\n SkyCharacterCounterIndicatorComponent,\n ],\n imports: [\n CommonModule,\n FormsModule,\n ReactiveFormsModule,\n SkyFormsResourcesModule,\n SkyI18nModule,\n ],\n exports: [\n SkyCharacterCounterInputDirective,\n SkyCharacterCounterIndicatorComponent,\n ],\n})\nexport class SkyCharacterCounterModule {}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox-required-validator.directive.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox-required-validator.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"checkbox-required-validator.directive.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox-required-validator.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,UAAU,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;;AAE1E,gCAAgC;AAChC,MAAM,CAAC,MAAM,+BAA+B,GAAa;IACvD,OAAO,EAAE,aAAa;IACtB,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,qCAAqC,CAAC;IACpE,KAAK,EAAE,IAAI;CACZ,CAAC;AACF,gBAAgB;AAEhB;;;;;;;GAOG;AAOH,MAAM,OAAO,qCAAsC,SAAQ,yBAAyB;;mIAAvE,qCAAqC;uHAArC,qCAAqC,sJAFrC,CAAC,+BAA+B,CAAC;4FAEjC,qCAAqC;kBANjD,SAAS;mBAAC;oBACT,8DAA8D;oBAC9D,QAAQ,EAAE;kFACsE;oBAChF,SAAS,EAAE,CAAC,+BAA+B,CAAC;iBAC7C","sourcesContent":["import { Directive, Provider, forwardRef } from '@angular/core';\nimport { CheckboxRequiredValidator, NG_VALIDATORS } from '@angular/forms';\n\n// tslint:disable:no-forward-ref\nexport const SKY_CHECKBOX_REQUIRED_VALIDATOR: Provider = {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => SkyCheckboxRequiredValidatorDirective),\n multi: true,\n};\n// tslint:enable\n\n/**\n * Validator support for the `required` input on `sky-checkbox`.\n * Angular's `CheckboxRequiredValidator` only works with `input type=checkbox`. This directive\n * extends the angular validator to work with `sky-checkbox` tags.\n * This is based on Angular Material's similar implementation:\n * https://github.com/angular/components/blob/a415b52ead2ec202ba37edb7d7866b29dd790394/src/material/checkbox/checkbox-required-validator.ts\n * @internal\n */\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: `sky-checkbox[required][formControlName],\n sky-checkbox[required][formControl], sky-checkbox[required][ngModel]`,\n providers: [SKY_CHECKBOX_REQUIRED_VALIDATOR],\n})\nexport class SkyCheckboxRequiredValidatorDirective extends CheckboxRequiredValidator {}\n"]}
|
|
@@ -184,7 +184,7 @@ export class SkyCheckboxComponent {
|
|
|
184
184
|
this.onTouched();
|
|
185
185
|
}
|
|
186
186
|
_emitChangeEvent() {
|
|
187
|
-
|
|
187
|
+
const event = new SkyCheckboxChange();
|
|
188
188
|
event.source = this;
|
|
189
189
|
event.checked = this._checked;
|
|
190
190
|
this._controlValueAccessorChangeFn(this._checked);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,YAAY,EACZ,KAAK,EAEL,QAAQ,EACR,MAAM,EACN,IAAI,GACL,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAwB,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEjE,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAEnD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;;;;;AAEtD;;GAEG;AACH,IAAI,MAAM,GAAG,CAAC,CAAC;AAEf;;;GAGG;AAMH,MAAM,OAAO,oBAAoB;IA2K/B,YAAwC,SAAoB;QAApB,cAAS,GAAT,SAAS,CAAW;QAxJ5D;;;WAGG;QAEI,OAAE,GAAW,gBAAgB,EAAE,MAAM,EAAE,CAAC;QAsB/C;;;WAGG;QAEI,aAAQ,GAAW,CAAC,CAAC;QAE5B;;;WAGG;QAEI,SAAI,GAAW,gBAAgB,EAAE,MAAM,EAAE,CAAC;QAEjD;;WAEG;QAGI,WAAM,GAAG,IAAI,YAAY,EAAqB,CAAC;QA4F9C,kBAAa,GAAG,IAAI,CAAC;QAIrB,aAAQ,GAAY,KAAK,CAAC;QAE1B,mBAAc,GAAG,IAAI,eAAe,CAAU,IAAI,CAAC,QAAQ,CAAC,CAAC;QAE7D,cAAS,GAAY,KAAK,CAAC;QAE3B,oBAAe,GAAG,IAAI,eAAe,CAAU,IAAI,CAAC,SAAS,CAAC,CAAC;QAE/D,cAAS,GAAY,KAAK,CAAC;QAgEnC,8FAA8F;QAC9F,yBAAyB;QAClB,cAAS,GAAc,GAAG,EAAE,GAAE,CAAC,CAAC;QAE/B,kCAA6B,GAAyB,CAAC,KAAK,EAAE,EAAE,GAAE,CAAC,CAAC;QAjE1E,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI,CAAC;SACrC;IACH,CAAC;IArJD;;;OAGG;IACH,IACW,QAAQ,CAAC,KAAc;QAChC,MAAM,YAAY,GAAG,eAAe,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;QAClE,IAAI,YAAY,KAAK,IAAI,CAAC,QAAQ,EAAE;YAClC,IAAI,CAAC,SAAS,GAAG,YAAY,CAAC;YAC9B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SAC3C;IACH,CAAC;IAED;;OAEG;IACH,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IA+BD;;;;;;;OAOG;IACH,IACW,YAAY,CAAC,KAAa;QACnC,IAAI,KAAK,EAAE;YACT,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,WAAW,EAAE,CAAC;SAC1C;IACH,CAAC;IAED,IAAW,YAAY;QACrB,OAAO,IAAI,CAAC,aAAa,IAAI,MAAM,CAAC;IACtC,CAAC;IAED,IAAW,OAAO;QAChB,OAAO,SAAS,IAAI,CAAC,EAAE,EAAE,CAAC;IAC5B,CAAC;IAED;;;OAGG;IACH,IACW,OAAO,CAAC,OAAgB;QACjC,IAAI,OAAO,KAAK,IAAI,CAAC,OAAO,EAAE;YAC5B,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;YACxB,IAAI,CAAC,6BAA6B,CAAC,OAAO,CAAC,CAAC;YAC5C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YAExC,mCAAmC;YACnC,kDAAkD;YAClD,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE;gBAClE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,cAAc,EAAE,CAAC;gBACxC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;aAC5B;SACF;IACH,CAAC;IAED;;OAEG;IACH,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAED;;;;;;OAMG;IACH,IACI,QAAQ,CAAC,KAAc;QACzB,IAAI,CAAC,SAAS,GAAG,eAAe,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAED;;OAEG;IACH,IACW,aAAa;QACtB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC7B,CAAC;IAED;;OAEG;IACH,IACW,cAAc;QACvB,OAAO,IAAI,CAAC,eAAe,CAAC;IAC9B,CAAC;IAsBM,QAAQ;QACb,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,8EAA8E;YAC9E,IAAI,CAAC,QAAQ;gBACX,IAAI,CAAC,QAAQ,IAAI,eAAe,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SAC1E;IACH,CAAC;IAED;;OAEG;IACI,UAAU,CAAC,KAAU;QAC1B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,KAAK,CAAC;IACzB,CAAC;IAED;;OAEG;IACI,gBAAgB,CAAC,EAAwB;QAC9C,IAAI,CAAC,6BAA6B,GAAG,EAAE,CAAC;IAC1C,CAAC;IAED;;OAEG;IACI,iBAAiB,CAAC,EAAO;QAC9B,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACtB,CAAC;IAED;;OAEG;IACI,gBAAgB,CAAC,UAAmB;QACzC,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;IAC7B,CAAC;IAED;;;OAGG;IACI,kBAAkB,CAAC,KAAY;QACpC,0DAA0D;QAC1D,yEAAyE;QACzE,gDAAgD;QAChD,KAAK,CAAC,eAAe,EAAE,CAAC;QAExB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,OAAO,EAAE,CAAC;YACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB;IACH,CAAC;IAEM,WAAW;QAChB,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAQO,gBAAgB;QACtB,IAAI,KAAK,GAAG,IAAI,iBAAiB,EAAE,CAAC;QACpC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;QACpB,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;QAE9B,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAClD,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IAED;;OAEG;IACK,OAAO;QACb,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;IAC/B,CAAC;;kHA7PU,oBAAoB;sGAApB,oBAAoB,qWChCjC,+sDA4DA;4FD5Ba,oBAAoB;kBALhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,cAAc;oBACxB,WAAW,EAAE,2BAA2B;oBACxC,SAAS,EAAE,CAAC,2BAA2B,CAAC;iBACzC;;0BA4Kc,IAAI;;0BAAI,QAAQ;4CAnKtB,KAAK;sBADX,KAAK;gBAUC,UAAU;sBADhB,KAAK;gBAQC,EAAE;sBADR,KAAK;gBAQK,QAAQ;sBADlB,KAAK;gBAqBC,QAAQ;sBADd,KAAK;gBAQC,IAAI;sBADV,KAAK;gBAQC,MAAM;sBAFZ,MAAM;gBAUA,IAAI;sBADV,KAAK;gBAYK,YAAY;sBADtB,KAAK;gBAoBK,OAAO;sBADjB,KAAK;gBA+BF,QAAQ;sBADX,KAAK;gBAaK,aAAa;sBADvB,MAAM;gBASI,cAAc;sBADxB,MAAM","sourcesContent":["import {\n Component,\n EventEmitter,\n Input,\n OnInit,\n Optional,\n Output,\n Self,\n} from '@angular/core';\n\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\n\nimport { BehaviorSubject, Observable } from 'rxjs';\n\nimport { SkyFormsUtility } from '../shared/forms-utility';\n\nimport { SkyCheckboxChange } from './checkbox-change';\n\n/**\n * Monotonically increasing integer used to auto-generate unique ids for checkbox components.\n */\nlet nextId = 0;\n\n/**\n * Replaces the HTML input element with `type=\"checkbox\"`. When users select a checkbox, its value\n * is driven through an `ngModel` attribute that you specify on the `sky-checkbox` element.\n */\n@Component({\n selector: 'sky-checkbox',\n templateUrl: './checkbox.component.html',\n styleUrls: ['./checkbox.component.scss'],\n})\nexport class SkyCheckboxComponent implements ControlValueAccessor, OnInit {\n /**\n * Specifies an ARIA label for the checkbox. This sets the checkbox's `aria-label` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility)\n * when the checkbox does not include a visible label. You must set this property for icon\n * checkboxes. If the checkbox includes a visible label, use `labelledBy` instead.\n */\n @Input()\n public label: string;\n\n /**\n * Specifies the HTML element ID (without the leading `#`) of the element that labels the\n * checkbox. This sets the checkbox's `aria-labelledby` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility).\n * If the checkbox does not include a visible label, use `label` instead.\n */\n @Input()\n public labelledBy: string;\n\n /**\n * Specifies an ID for the checkbox.\n * @default a unique, auto-incrementing integer. For example: `sky-checkbox-1`\n */\n @Input()\n public id: string = `sky-checkbox-${++nextId}`;\n\n /**\n * Indicates whether to disable the checkbox.\n * @default false\n */\n @Input()\n public set disabled(value: boolean) {\n const coercedValue = SkyFormsUtility.coerceBooleanProperty(value);\n if (coercedValue !== this.disabled) {\n this._disabled = coercedValue;\n this._disabledChange.next(this._disabled);\n }\n }\n\n /**\n * Indicates whether the checkbox is disabled.\n */\n public get disabled() {\n return this._disabled;\n }\n\n /**\n * Specifies an index for the checkbox. If not defined, the index is set to the position of the\n * checkbox on load.\n */\n @Input()\n public tabindex: number = 0;\n\n /**\n * Specifies a name for a group of checkboxes.\n * @default a unique, auto-incrementing integer. For example: `sky-checkbox-1`\n */\n @Input()\n public name: string = `sky-checkbox-${++nextId}`;\n\n /**\n * Fires when the selected value changes.\n */\n @Output()\n // eslint-disable-next-line @angular-eslint/no-output-native\n public change = new EventEmitter<SkyCheckboxChange>();\n\n /**\n * Specifies an icon to display in place of the checkbox. To group icon checkboxes\n * like in the demo, place the `sky-switch-icon-group` class on the direct parent\n * element of the checkboxes.\n */\n @Input()\n public icon: String;\n\n /**\n * Specifies a type to set the background color after users select a checkbox where the\n * `icon` property displays an icon in place of the checkbox. The valid options correspond to\n * [the label component's](https://developer.blackbaud.com/skyux/components/label)\n * label types. `\"info\"` creates a blue background, `\"success\"` creates a green\n * background, `\"warning\"` creates an orange background, and `\"danger\"` creates a red background.\n * @default \"info\"\n */\n @Input()\n public set checkboxType(value: string) {\n if (value) {\n this._checkboxType = value.toLowerCase();\n }\n }\n\n public get checkboxType(): string {\n return this._checkboxType || 'info';\n }\n\n public get inputId(): string {\n return `input-${this.id}`;\n }\n\n /**\n * Indicates whether the checkbox is selected.\n * @default false\n */\n @Input()\n public set checked(checked: boolean) {\n if (checked !== this.checked) {\n this._checked = checked;\n this._controlValueAccessorChangeFn(checked);\n this._checkedChange.next(this._checked);\n\n // Do not mark the field as \"dirty\"\n // if the field has been initialized with a value.\n if (this.isFirstChange && this.ngControl && this.ngControl.control) {\n this.ngControl.control.markAsPristine();\n this.isFirstChange = false;\n }\n }\n }\n\n /**\n * Indicates whether the checkbox is selected.\n */\n public get checked() {\n return this._checked;\n }\n\n /**\n * Indicates whether the input is required for form validation.\n * When you set this property to `true`, the component adds `aria-required` and `required`\n * attributes to the input element so that forms display an invalid state until the input element\n * is complete.\n * @default false\n */\n @Input()\n set required(value: boolean) {\n this._required = SkyFormsUtility.coerceBooleanProperty(value);\n }\n\n get required(): boolean {\n return this._required;\n }\n\n /**\n * Fires when users select or deselect the checkbox.\n */\n @Output()\n public get checkedChange(): Observable<boolean> {\n return this._checkedChange;\n }\n\n /**\n * Fires when the selected value changes.\n */\n @Output()\n public get disabledChange(): Observable<boolean> {\n return this._disabledChange;\n }\n\n private isFirstChange = true;\n\n private _checkboxType: string;\n\n private _checked: boolean = false;\n\n private _checkedChange = new BehaviorSubject<boolean>(this._checked);\n\n private _disabled: boolean = false;\n\n private _disabledChange = new BehaviorSubject<boolean>(this._disabled);\n\n private _required: boolean = false;\n\n constructor(@Self() @Optional() private ngControl: NgControl) {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n public ngOnInit(): void {\n if (this.ngControl) {\n // Backwards compatibility support for anyone still using Validators.Required.\n this.required =\n this.required || SkyFormsUtility.hasRequiredValidation(this.ngControl);\n }\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public writeValue(value: any) {\n this.checked = !!value;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public registerOnChange(fn: (value: any) => void) {\n this._controlValueAccessorChangeFn = fn;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public registerOnTouched(fn: any) {\n this.onTouched = fn;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled;\n }\n\n /**\n * Event handler for checkbox input element.\n * Toggles checked state if element is not disabled.\n */\n public onInteractionEvent(event: Event) {\n // We always have to stop propagation on the change event.\n // Otherwise the change event, from the input element, will bubble up and\n // emit its event object to the `change` output.\n event.stopPropagation();\n\n if (!this.disabled) {\n this._toggle();\n this._emitChangeEvent();\n }\n }\n\n public onInputBlur() {\n this.onTouched();\n }\n\n /** Called when the checkbox is blurred. Needed to properly implement ControlValueAccessor. */\n /*istanbul ignore next */\n public onTouched: () => any = () => {};\n\n private _controlValueAccessorChangeFn: (value: any) => void = (value) => {};\n\n private _emitChangeEvent() {\n let event = new SkyCheckboxChange();\n event.source = this;\n event.checked = this._checked;\n\n this._controlValueAccessorChangeFn(this._checked);\n this.change.emit(event);\n }\n\n /**\n * Toggles the `checked` value between true and false\n */\n private _toggle() {\n this.checked = !this.checked;\n }\n}\n","<label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': required,\n 'sky-switch-disabled': disabled\n }\"\n>\n <input\n class=\"sky-checkbox-input sky-switch-input\"\n type=\"checkbox\"\n [id]=\"inputId\"\n [checked]=\"checked\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"label\"\n [attr.aria-labelledby]=\"labelledBy\"\n [attr.aria-required]=\"required ? true : null\"\n (blur)=\"onInputBlur()\"\n (change)=\"onInteractionEvent($event)\"\n />\n <span\n class=\"sky-switch-control sky-rounded-corners\"\n [ngClass]=\"{\n 'sky-switch-control-icon': icon,\n 'sky-switch-control-info': checkboxType === 'info',\n 'sky-switch-control-success': checkboxType === 'success',\n 'sky-switch-control-warning': checkboxType === 'warning',\n 'sky-switch-control-danger': checkboxType === 'danger'\n }\"\n >\n <sky-icon\n *ngIf=\"icon || checked\"\n class=\"sky-checkbox-icon-default\"\n fixedWidth=\"true\"\n [icon]=\"icon || 'check'\"\n >\n </sky-icon>\n <div class=\"sky-checkbox-icon-modern\">\n <sky-icon\n *ngIf=\"icon; else checkedTemplate\"\n fixedWidth=\"true\"\n [icon]=\"icon\"\n >\n </sky-icon>\n <ng-template #checkedTemplate>\n <sky-icon\n *ngIf=\"checked\"\n class=\"sky-checkbox-icon-modern-checked\"\n fixedWidth=\"true\"\n icon=\"check\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </ng-template>\n </div>\n </span>\n <ng-content select=\"sky-checkbox-label\"> </ng-content>\n</label>\n"]}
|
|
1
|
+
{"version":3,"file":"checkbox.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n EventEmitter,\n Input,\n OnInit,\n Optional,\n Output,\n Self,\n} from '@angular/core';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\n\nimport { BehaviorSubject, Observable } from 'rxjs';\n\nimport { SkyFormsUtility } from '../shared/forms-utility';\n\nimport { SkyCheckboxChange } from './checkbox-change';\n\n/**\n * Monotonically increasing integer used to auto-generate unique ids for checkbox components.\n */\nlet nextId = 0;\n\n/**\n * Replaces the HTML input element with `type=\"checkbox\"`. When users select a checkbox, its value\n * is driven through an `ngModel` attribute that you specify on the `sky-checkbox` element.\n */\n@Component({\n selector: 'sky-checkbox',\n templateUrl: './checkbox.component.html',\n styleUrls: ['./checkbox.component.scss'],\n})\nexport class SkyCheckboxComponent implements ControlValueAccessor, OnInit {\n /**\n * Specifies an ARIA label for the checkbox. This sets the checkbox's `aria-label` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility)\n * when the checkbox does not include a visible label. You must set this property for icon\n * checkboxes. If the checkbox includes a visible label, use `labelledBy` instead.\n */\n @Input()\n public label: string;\n\n /**\n * Specifies the HTML element ID (without the leading `#`) of the element that labels the\n * checkbox. This sets the checkbox's `aria-labelledby` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/components/checkbox#accessibility).\n * If the checkbox does not include a visible label, use `label` instead.\n */\n @Input()\n public labelledBy: string;\n\n /**\n * Specifies an ID for the checkbox.\n * @default a unique, auto-incrementing integer. For example: `sky-checkbox-1`\n */\n @Input()\n public id = `sky-checkbox-${++nextId}`;\n\n /**\n * Indicates whether to disable the checkbox.\n * @default false\n */\n @Input()\n public set disabled(value: boolean) {\n const coercedValue = SkyFormsUtility.coerceBooleanProperty(value);\n if (coercedValue !== this.disabled) {\n this._disabled = coercedValue;\n this._disabledChange.next(this._disabled);\n }\n }\n\n /**\n * Indicates whether the checkbox is disabled.\n */\n public get disabled() {\n return this._disabled;\n }\n\n /**\n * Specifies an index for the checkbox. If not defined, the index is set to the position of the\n * checkbox on load.\n */\n @Input()\n public tabindex = 0;\n\n /**\n * Specifies a name for a group of checkboxes.\n * @default a unique, auto-incrementing integer. For example: `sky-checkbox-1`\n */\n @Input()\n public name = `sky-checkbox-${++nextId}`;\n\n /**\n * Fires when the selected value changes.\n */\n @Output()\n // eslint-disable-next-line @angular-eslint/no-output-native\n public change = new EventEmitter<SkyCheckboxChange>();\n\n /**\n * Specifies an icon to display in place of the checkbox. To group icon checkboxes\n * like in the demo, place the `sky-switch-icon-group` class on the direct parent\n * element of the checkboxes.\n */\n @Input()\n public icon: string;\n\n /**\n * Specifies a type to set the background color after users select a checkbox where the\n * `icon` property displays an icon in place of the checkbox. The valid options correspond to\n * [the label component's](https://developer.blackbaud.com/skyux/components/label)\n * label types. `\"info\"` creates a blue background, `\"success\"` creates a green\n * background, `\"warning\"` creates an orange background, and `\"danger\"` creates a red background.\n * @default \"info\"\n */\n @Input()\n public set checkboxType(value: string) {\n if (value) {\n this._checkboxType = value.toLowerCase();\n }\n }\n\n public get checkboxType(): string {\n return this._checkboxType || 'info';\n }\n\n public get inputId(): string {\n return `input-${this.id}`;\n }\n\n /**\n * Indicates whether the checkbox is selected.\n * @default false\n */\n @Input()\n public set checked(checked: boolean) {\n if (checked !== this.checked) {\n this._checked = checked;\n this._controlValueAccessorChangeFn(checked);\n this._checkedChange.next(this._checked);\n\n // Do not mark the field as \"dirty\"\n // if the field has been initialized with a value.\n if (this.isFirstChange && this.ngControl && this.ngControl.control) {\n this.ngControl.control.markAsPristine();\n this.isFirstChange = false;\n }\n }\n }\n\n /**\n * Indicates whether the checkbox is selected.\n */\n public get checked() {\n return this._checked;\n }\n\n /**\n * Indicates whether the input is required for form validation.\n * When you set this property to `true`, the component adds `aria-required` and `required`\n * attributes to the input element so that forms display an invalid state until the input element\n * is complete.\n * @default false\n */\n @Input()\n set required(value: boolean) {\n this._required = SkyFormsUtility.coerceBooleanProperty(value);\n }\n\n get required(): boolean {\n return this._required;\n }\n\n /**\n * Fires when users select or deselect the checkbox.\n */\n @Output()\n public get checkedChange(): Observable<boolean> {\n return this._checkedChange;\n }\n\n /**\n * Fires when the selected value changes.\n */\n @Output()\n public get disabledChange(): Observable<boolean> {\n return this._disabledChange;\n }\n\n private isFirstChange = true;\n\n private _checkboxType: string;\n\n private _checked = false;\n\n private _checkedChange = new BehaviorSubject<boolean>(this._checked);\n\n private _disabled = false;\n\n private _disabledChange = new BehaviorSubject<boolean>(this._disabled);\n\n private _required = false;\n\n constructor(@Self() @Optional() private ngControl: NgControl) {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n public ngOnInit(): void {\n if (this.ngControl) {\n // Backwards compatibility support for anyone still using Validators.Required.\n this.required =\n this.required || SkyFormsUtility.hasRequiredValidation(this.ngControl);\n }\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public writeValue(value: any) {\n this.checked = !!value;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public registerOnChange(fn: (value: any) => void) {\n this._controlValueAccessorChangeFn = fn;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public registerOnTouched(fn: any) {\n this.onTouched = fn;\n }\n\n /**\n * Implemented as part of ControlValueAccessor.\n */\n public setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled;\n }\n\n /**\n * Event handler for checkbox input element.\n * Toggles checked state if element is not disabled.\n */\n public onInteractionEvent(event: Event) {\n // We always have to stop propagation on the change event.\n // Otherwise the change event, from the input element, will bubble up and\n // emit its event object to the `change` output.\n event.stopPropagation();\n\n if (!this.disabled) {\n this._toggle();\n this._emitChangeEvent();\n }\n }\n\n public onInputBlur() {\n this.onTouched();\n }\n\n /** Called when the checkbox is blurred. Needed to properly implement ControlValueAccessor. */\n /*istanbul ignore next */\n public onTouched: () => any = () => {};\n\n private _controlValueAccessorChangeFn: (value: any) => void = (value) => {};\n\n private _emitChangeEvent() {\n const event = new SkyCheckboxChange();\n event.source = this;\n event.checked = this._checked;\n\n this._controlValueAccessorChangeFn(this._checked);\n this.change.emit(event);\n }\n\n /**\n * Toggles the `checked` value between true and false\n */\n private _toggle() {\n this.checked = !this.checked;\n }\n}\n","<label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': required,\n 'sky-switch-disabled': disabled\n }\"\n>\n <input\n class=\"sky-checkbox-input sky-switch-input\"\n type=\"checkbox\"\n [id]=\"inputId\"\n [checked]=\"checked\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [required]=\"required\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"label\"\n [attr.aria-labelledby]=\"labelledBy\"\n [attr.aria-required]=\"required ? true : null\"\n (blur)=\"onInputBlur()\"\n (change)=\"onInteractionEvent($event)\"\n />\n <span\n class=\"sky-switch-control sky-rounded-corners\"\n [ngClass]=\"{\n 'sky-switch-control-icon': icon,\n 'sky-switch-control-info': checkboxType === 'info',\n 'sky-switch-control-success': checkboxType === 'success',\n 'sky-switch-control-warning': checkboxType === 'warning',\n 'sky-switch-control-danger': checkboxType === 'danger'\n }\"\n >\n <sky-icon\n *ngIf=\"icon || checked\"\n class=\"sky-checkbox-icon-default\"\n fixedWidth=\"true\"\n [icon]=\"icon || 'check'\"\n >\n </sky-icon>\n <div class=\"sky-checkbox-icon-modern\">\n <sky-icon\n *ngIf=\"icon; else checkedTemplate\"\n fixedWidth=\"true\"\n [icon]=\"icon\"\n >\n </sky-icon>\n <ng-template #checkedTemplate>\n <sky-icon\n *ngIf=\"checked\"\n class=\"sky-checkbox-icon-modern-checked\"\n fixedWidth=\"true\"\n icon=\"check\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </ng-template>\n </div>\n </span>\n <ng-content select=\"sky-checkbox-label\"> </ng-content>\n</label>\n"]}
|
|
@@ -2,9 +2,9 @@ import { CommonModule } from '@angular/common';
|
|
|
2
2
|
import { NgModule } from '@angular/core';
|
|
3
3
|
import { FormsModule } from '@angular/forms';
|
|
4
4
|
import { SkyIconModule } from '@skyux/indicators';
|
|
5
|
-
import { SkyCheckboxComponent } from './checkbox.component';
|
|
6
5
|
import { SkyCheckboxLabelComponent } from './checkbox-label.component';
|
|
7
6
|
import { SkyCheckboxRequiredValidatorDirective } from './checkbox-required-validator.directive';
|
|
7
|
+
import { SkyCheckboxComponent } from './checkbox.component';
|
|
8
8
|
import * as i0 from "@angular/core";
|
|
9
9
|
export class SkyCheckboxModule {
|
|
10
10
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"checkbox.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/checkbox/checkbox.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AACvE,OAAO,EAAE,qCAAqC,EAAE,MAAM,yCAAyC,CAAC;AAChG,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;;AAe5D,MAAM,OAAO,iBAAiB;;+GAAjB,iBAAiB;gHAAjB,iBAAiB,iBAX1B,oBAAoB;QACpB,yBAAyB;QACzB,qCAAqC,aAE7B,YAAY,EAAE,WAAW,EAAE,aAAa,aAEhD,oBAAoB;QACpB,yBAAyB;QACzB,qCAAqC;gHAG5B,iBAAiB,YAPnB,CAAC,YAAY,EAAE,WAAW,EAAE,aAAa,CAAC;4FAOxC,iBAAiB;kBAb7B,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,oBAAoB;wBACpB,yBAAyB;wBACzB,qCAAqC;qBACtC;oBACD,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,aAAa,CAAC;oBACnD,OAAO,EAAE;wBACP,oBAAoB;wBACpB,yBAAyB;wBACzB,qCAAqC;qBACtC;iBACF","sourcesContent":["import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { SkyIconModule } from '@skyux/indicators';\n\nimport { SkyCheckboxLabelComponent } from './checkbox-label.component';\nimport { SkyCheckboxRequiredValidatorDirective } from './checkbox-required-validator.directive';\nimport { SkyCheckboxComponent } from './checkbox.component';\n\n@NgModule({\n declarations: [\n SkyCheckboxComponent,\n SkyCheckboxLabelComponent,\n SkyCheckboxRequiredValidatorDirective,\n ],\n imports: [CommonModule, FormsModule, SkyIconModule],\n exports: [\n SkyCheckboxComponent,\n SkyCheckboxLabelComponent,\n SkyCheckboxRequiredValidatorDirective,\n ],\n})\nexport class SkyCheckboxModule {}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-attachment-label.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment-label.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment-label.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"file-attachment-label.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment-label.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment-label.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;;AAEnE;;GAEG;AAOH,MAAM,OAAO,+BAA+B;;6HAA/B,+BAA+B;iHAA/B,+BAA+B,iECX5C,4EAGA;4FDQa,+BAA+B;kBAN3C,SAAS;mBAAC;oBACT,QAAQ,EAAE,2BAA2B;oBACrC,WAAW,EAAE,wCAAwC;oBACrD,SAAS,EAAE,CAAC,sCAAsC,CAAC;oBACnD,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n/**\n * Displays a label above the file attachment element.\n */\n@Component({\n selector: 'sky-file-attachment-label',\n templateUrl: './file-attachment-label.component.html',\n styleUrls: ['file-attachment-label.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyFileAttachmentLabelComponent {}\n","<span class=\"sky-control-label\">\n <ng-content></ng-content>\n</span>\n"]}
|
|
@@ -207,7 +207,7 @@ export class SkyFileAttachmentComponent {
|
|
|
207
207
|
getFileName(truncate = true) {
|
|
208
208
|
if (this.value) {
|
|
209
209
|
// tslint:disable-next-line: max-line-length
|
|
210
|
-
|
|
210
|
+
const dropName = this.fileItemService.isFile(this.value) && this.value.file.name
|
|
211
211
|
? this.value.file.name
|
|
212
212
|
: this.value.url;
|
|
213
213
|
if (truncate && dropName.length > 26) {
|
|
@@ -275,8 +275,8 @@ export class SkyFileAttachmentComponent {
|
|
|
275
275
|
}
|
|
276
276
|
handleFiles(files) {
|
|
277
277
|
// tslint:disable-next-line: max-line-length
|
|
278
|
-
|
|
279
|
-
for (
|
|
278
|
+
const processedFiles = this.fileAttachmentService.checkFiles(files, this.minFileSize, this.maxFileSize, this.acceptedTypes, this.validateFn);
|
|
279
|
+
for (const file of processedFiles) {
|
|
280
280
|
if (file.errorType) {
|
|
281
281
|
this.emitFileChangeEvent(file);
|
|
282
282
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-attachment.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.component.html"],"names":[],"mappings":"AAAA,OAAO,EAGL,uBAAuB,EACvB,iBAAiB,EACjB,SAAS,EACT,eAAe,EACf,UAAU,EACV,YAAY,EACZ,KAAK,EAGL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,IAAI,EACJ,SAAS,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAM1D,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AAEpF,OAAO,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AAIrE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;;;;;;;;;AAEzD,IAAI,QAAQ,GAAG,CAAC,CAAC;AAEjB;;GAEG;AAQH,MAAM,OAAO,0BAA0B;IAsHrC,YACS,QAAyB,EACxB,cAAiC,EACjC,qBAA+C,EAC/C,eAAmC,EACf,SAAoB;QAJzC,aAAQ,GAAR,QAAQ,CAAiB;QACxB,mBAAc,GAAd,cAAc,CAAmB;QACjC,0BAAqB,GAArB,qBAAqB,CAA0B;QAC/C,oBAAe,GAAf,eAAe,CAAoB;QACf,cAAS,GAAT,SAAS,CAAW;QAhGlD;;WAEG;QAEI,gBAAW,GAAW,MAAM,CAAC;QAEpC;;WAEG;QAEI,gBAAW,GAAW,CAAC,CAAC;QAS/B;;WAEG;QAEI,eAAU,GAAG,IAAI,YAAY,EAA2B,CAAC;QAEhE;;;WAGG;QAEI,cAAS,GAAG,IAAI,YAAY,EAA0B,CAAC;QAEvD,iBAAY,GAAY,KAAK,CAAC;QAU9B,iBAAY,GAAY,KAAK,CAAC;QAErC;;;;;WAKG;QAEI,aAAQ,GAAY,KAAK,CAAC;QAgCzB,qBAAgB,GAAG,QAAQ,EAAE,CAAC;QAE9B,kBAAa,GAAG,IAAI,OAAO,EAAQ,CAAC;QAEpC,cAAS,GAAY,KAAK,CAAC;QAqQnC,yBAAyB;QACjB,cAAS,GAAG,CAAC,CAAM,EAAE,EAAE,GAAE,CAAC,CAAC;QACnC,yBAAyB;QACjB,eAAU,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QA7P5B,IAAI,CAAC,cAAc,GAAG,6BAA6B,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC3E,IAAI,CAAC,4BAA4B,GAAG,wCAAwC,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACpG,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI,CAAC;SACrC;IACH,CAAC;IAvHD;;;OAGG;IACH,IACW,QAAQ,CAAC,KAAc;QAChC,MAAM,gBAAgB,GAAG,eAAe,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;QACtE,IAAI,IAAI,CAAC,SAAS,KAAK,gBAAgB,EAAE;YACvC,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC;SACnC;IACH,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAoCD,IAAW,iBAAiB;QAC1B,OAAO,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC;IACzC,CAAC;IAiBD,IAAW,KAAK,CAAC,KAAkB;QACjC,0DAA0D;QAC1D,yEAAyE;QACzE,uDAAuD;QACvD,2CAA2C;QAC3C,MAAM,UAAU,GAAG,KAAK,KAAK,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,IAAI,CAAC;QAE1D,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YACpB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YACtB,IAAI,CAAC,0BAA0B,EAAE,CAAC;SACnC;IACH,CAAC;IAED,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAoCM,QAAQ;QACb,IAAI,CAAC,QAAQ,CAAC,cAAc;aACzB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,CAAC,aAAa,EAAE,EAAE;YAC3B,IAAI,CAAC,gBAAgB,GAAG,aAAa,CAAC,eAAe,CAAC,KAAK,CAAC,IAAI,CAAC;YACjE,IAAI,CAAC,0BAA0B,EAAE,CAAC;QACpC,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,eAAe;QACpB,gDAAgD;QAChD,kFAAkF;QAClF,uDAAuD;QACvD,oFAAoF;QACpF,6DAA6D;QAC7D,0BAA0B;QAC1B,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE;oBAC1C,SAAS,EAAE,KAAK;iBACjB,CAAC,CAAC;gBACH,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;YACrC,CAAC,CAAC,CAAC;YAEH,8EAA8E;YAC9E,IAAI,CAAC,QAAQ;gBACX,IAAI,CAAC,QAAQ,IAAI,eAAe,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SAC1E;IACH,CAAC;IAEM,kBAAkB;QACvB,8CAA8C;QAC9C,IAAI,CAAC,eAAe,CAAC,OAAO;aACzB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;aACnC,SAAS,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,cAAc,CAAC,aAAa,EAAE,CAAC;QACtC,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,OAAO;QACZ,OAAO,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAClD,CAAC;IAEM,aAAa;QAClB,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IACrC,CAAC;IAEM,eAAe,CAAC,eAAoB;QACzC,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACjD,CAAC;IAEM,aAAa,CAAC,cAAmB;QACtC,sDAAsD;QACtD,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,MAAM,CAAC;QAC9C,cAAc,CAAC,eAAe,EAAE,CAAC;QACjC,cAAc,CAAC,cAAc,EAAE,CAAC;IAClC,CAAC;IAEM,YAAY,CAAC,aAAkB;QACpC,MAAM,QAAQ,GAAG,aAAa,CAAC,YAAY,CAAC;QAE5C,aAAa,CAAC,eAAe,EAAE,CAAC;QAChC,aAAa,CAAC,cAAc,EAAE,CAAC;QAE/B,IAAI,QAAQ,EAAE;YACZ,IAAI,QAAQ,CAAC,KAAK,EAAE;gBAClB,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC;gBAE7B,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACjD,MAAM,IAAI,GAAQ,KAAK,CAAC,KAAK,CAAC,CAAC;oBAE/B,IACE,IAAI,CAAC,IAAI;wBACT,IAAI,CAAC,qBAAqB,CAAC,gBAAgB,CACzC,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,aAAa,CACnB,EACD;wBACA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;wBACzB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;wBAC1B,OAAO;qBACR;iBACF;gBAED,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;oBAC1C,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;oBAC1B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;iBAC1B;aACF;iBAAM,IAAI,QAAQ,CAAC,KAAK,EAAE;gBACzB,sDAAsD;gBACtD,4CAA4C;gBAC5C,4FAA4F;gBAC5F,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;gBAC1B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;aAC1B;SACF;IACH,CAAC;IAEM,QAAQ,CAAC,SAAoB;QAClC,SAAS,CAAC,eAAe,EAAE,CAAC;QAC5B,SAAS,CAAC,cAAc,EAAE,CAAC;QAE3B,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;QAClC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAE1B,IAAI,SAAS,CAAC,YAAY,IAAI,SAAS,CAAC,YAAY,CAAC,KAAK,EAAE;YAC1D,IAAI,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC3C,OAAO;aACR;YAED,IACE,IAAI,CAAC,qBAAqB,CAAC,YAAY,CAAC,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,EACrE;gBACA,OAAO;aACR;YAED,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;SAChD;IACH,CAAC;IAEM,aAAa,CAAC,cAAmB;QACtC,IAAI,IAAI,CAAC,gBAAgB,KAAK,cAAc,CAAC,MAAM,EAAE;YACnD,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;YAC1B,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;SAC3B;IACH,CAAC;IAEM,oBAAoB;QACzB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;QACvB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;QACnC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC;IAEM,WAAW,CAAC,QAAQ,GAAG,IAAI;QAChC,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,4CAA4C;YAC5C,IAAI,QAAQ,GACV,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI;gBAC7D,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI;gBACtB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YAErB,IAAI,QAAQ,IAAI,QAAQ,CAAC,MAAM,GAAG,EAAE,EAAE;gBACpC,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC;aACtC;iBAAM;gBACL,OAAO,QAAQ,CAAC;aACjB;SACF;aAAM;YACL,OAAO,SAAS,CAAC;SAClB;IACH,CAAC;IAEM,WAAW;QAChB,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC;IAChC,CAAC;IAEM,gBAAgB,CAAC,EAAuB;QAC7C,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACtB,CAAC;IACM,iBAAiB,CAAC,EAAa;QACpC,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;IACvB,CAAC;IAEM,UAAU,CAAC,KAAU;QAC1B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAED;;;;OAIG;IACI,gBAAgB,CAAC,UAAmB;QACzC,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;QAC3B,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;IAEM,SAAS;QACd,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;YAClB,IAAI,EAAE,IAAI,CAAC,KAAK;SACjB,CAAC,CAAC;IACL,CAAC;IAEO,mBAAmB,CAAC,WAAwB;QAClD,IAAI,WAAW,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE;YACzC,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;SAC9B;QACD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;YACnB,IAAI,EAAE,WAAW;SACS,CAAC,CAAC;QAE9B,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,KAAK,GAAG,EAAE,CAAC;IACxC,CAAC;IAEO,QAAQ,CAAC,IAAiB;QAChC,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;QAEhC,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC,KAAU,EAAQ,EAAE;YACnD,IAAI,CAAC,GAAG,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC;YAC/B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;QAEH,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAU,EAAQ,EAAE;YACpD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;QAEH,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAU,EAAQ,EAAE;YACpD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;QAEH,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IAEO,WAAW,CAAC,KAAe;QACjC,4CAA4C;QAC5C,IAAI,cAAc,GAAG,IAAI,CAAC,qBAAqB,CAAC,UAAU,CACxD,KAAK,EACL,IAAI,CAAC,WAAW,EAChB,IAAI,CAAC,WAAW,EAChB,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,UAAU,CAChB,CAAC;QAEF,KAAK,IAAI,IAAI,IAAI,cAAc,EAAE;YAC/B,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;aAChC;iBAAM;gBACL,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;aACrB;SACF;IACH,CAAC;IAEO,0BAA0B;QAChC,IAAI,CAAC,wBAAwB,GAAG,CAAC,CAC/B,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,gBAAgB,KAAK,QAAQ,CACjD,CAAC;QACF,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IACrC,CAAC;;wHArXU,0BAA0B;4GAA1B,0BAA0B,uRAH1B,CAAC,wBAAwB,CAAC,0DA4GpB,+BAA+B,mIC9JlD,00GA+GA;4FD1Da,0BAA0B;kBAPtC,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,WAAW,EAAE,kCAAkC;oBAC/C,SAAS,EAAE,CAAC,kCAAkC,CAAC;oBAC/C,SAAS,EAAE,CAAC,wBAAwB,CAAC;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;;0BA4HI,IAAI;;0BAAI,QAAQ;4CAlHZ,aAAa;sBADnB,KAAK;gBAQK,QAAQ;sBADlB,KAAK;gBAgBC,WAAW;sBADjB,KAAK;gBAOC,WAAW;sBADjB,KAAK;gBAQC,UAAU;sBADhB,KAAK;gBAOC,UAAU;sBADhB,MAAM;gBAQA,SAAS;sBADf,MAAM;gBAsBA,QAAQ;sBADd,KAAK;gBA0BE,OAAO;sBADd,SAAS;uBAAC,WAAW;gBAId,eAAe;sBADtB,eAAe;uBAAC,+BAA+B","sourcesContent":["import {\n AfterContentInit,\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n OnInit,\n Optional,\n Output,\n QueryList,\n Self,\n ViewChild,\n} from '@angular/core';\n\nimport { NgControl } from '@angular/forms';\n\nimport { SkyThemeService } from '@skyux/theme';\n\nimport { Subject } from 'rxjs';\n\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyFormsUtility } from '../shared/forms-utility';\n\nimport { SkyFileAttachmentChange } from './types/file-attachment-change';\n\nimport { SkyFileAttachmentClick } from './types/file-attachment-click';\n\nimport { SkyFileAttachmentLabelComponent } from './file-attachment-label.component';\n\nimport { SkyFileAttachmentService } from './file-attachment.service';\n\nimport { SkyFileItem } from './file-item';\n\nimport { SkyFileItemService } from './file-item.service';\n\nlet uniqueId = 0;\n\n/**\n * Provides an element to attach a single local file.\n */\n@Component({\n selector: 'sky-file-attachment',\n templateUrl: './file-attachment.component.html',\n styleUrls: ['./file-attachment.component.scss'],\n providers: [SkyFileAttachmentService],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyFileAttachmentComponent\n implements AfterViewInit, AfterContentInit, OnInit, OnDestroy\n{\n /**\n * Specifies a comma-delimited string literal of MIME types that users can attach.\n * By default, all file types are allowed.\n * @required\n */\n @Input()\n public acceptedTypes: string;\n\n /**\n * Indicates whether to disable the input.\n * @default false\n */\n @Input()\n public set disabled(value: boolean) {\n const newDisabledState = SkyFormsUtility.coerceBooleanProperty(value);\n if (this._disabled !== newDisabledState) {\n this._disabled = newDisabledState;\n }\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /**\n * Specifies the maximum size in bytes for valid files.\n */\n @Input()\n public maxFileSize: number = 500000;\n\n /**\n * Specifies the minimum size in bytes for valid files.\n */\n @Input()\n public minFileSize: number = 0;\n\n /**\n * Specifies a custom validation function. This validation runs alongside the internal\n * file validation. This function takes a `SkyFileItem` object as a parameter.\n */\n @Input()\n public validateFn: Function;\n\n /**\n * Fires when users add or remove files.\n */\n @Output()\n public fileChange = new EventEmitter<SkyFileAttachmentChange>();\n\n /**\n * Fires when users select the file name link. Make sure to bind the event.\n * If you do not, the file name link will be a dead link.\n */\n @Output()\n public fileClick = new EventEmitter<SkyFileAttachmentClick>();\n\n public acceptedOver: boolean = false;\n\n public get hasLabelComponent(): boolean {\n return this.labelComponents.length > 0;\n }\n\n public fileDropDescriptionElementId: string;\n\n public labelElementId: string;\n\n public rejectedOver: boolean = false;\n\n /**\n * Indicates whether the input is required for form validation.\n * When you set this property to `true`, the component adds `aria-required` and `required`\n * attributes to the input element so that forms display an invalid state until the input element\n * is complete.\n */\n @Input()\n public required: boolean = false;\n\n public set value(value: SkyFileItem) {\n // The null check is needed to address a bug in Angular 4.\n // writeValue is being called twice, first time with a phantom null value\n // See: https://github.com/angular/angular/issues/14988\n // tslint:disable-next-line:no-null-keyword\n const isNewValue = value !== this.value && value !== null;\n\n if (isNewValue) {\n this._value = value;\n this._onChange(value);\n this.updateFileAttachmentButton();\n }\n }\n\n public get value(): SkyFileItem {\n return this._value;\n }\n\n public currentThemeName: string;\n\n public showFileAttachmentButton: boolean;\n\n @ViewChild('fileInput')\n private inputEl: ElementRef;\n\n @ContentChildren(SkyFileAttachmentLabelComponent)\n private labelComponents: QueryList<SkyFileAttachmentLabelComponent>;\n\n private enterEventTarget: any;\n\n private fileAttachmentId = uniqueId++;\n\n private ngUnsubscribe = new Subject<void>();\n\n private _disabled: boolean = false;\n\n private _value: any;\n\n constructor(\n public themeSvc: SkyThemeService,\n private changeDetector: ChangeDetectorRef,\n private fileAttachmentService: SkyFileAttachmentService,\n private fileItemService: SkyFileItemService,\n @Self() @Optional() private ngControl: NgControl\n ) {\n this.labelElementId = `sky-file-attachment-label-${this.fileAttachmentId}`;\n this.fileDropDescriptionElementId = `sky-file-attachment-drop-description-${this.fileAttachmentId}`;\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n public ngOnInit(): void {\n this.themeSvc.settingsChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((themeSettings) => {\n this.currentThemeName = themeSettings.currentSettings.theme.name;\n this.updateFileAttachmentButton();\n });\n }\n\n public ngAfterViewInit(): void {\n // This is needed to address a bug in Angular 7.\n // When a control value is set intially, its value is not represented on the view.\n // See: https://github.com/angular/angular/issues/13792\n // Of note is the parent check which allows us to determine if the form is reactive.\n // Without this check there is a changed before checked error\n /* istanbul ignore else */\n if (this.ngControl) {\n setTimeout(() => {\n this.ngControl.control.setValue(this.value, {\n emitEvent: false,\n });\n this.changeDetector.markForCheck();\n });\n\n // Backwards compatibility support for anyone still using Validators.Required.\n this.required =\n this.required || SkyFormsUtility.hasRequiredValidation(this.ngControl);\n }\n }\n\n public ngAfterContentInit(): void {\n // Handles updating classes when label changes\n this.labelComponents.changes\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => {\n this.changeDetector.detectChanges();\n });\n }\n\n public isImage(): boolean {\n return this.fileItemService.isImage(this.value);\n }\n\n public onDropClicked(): void {\n this._onTouched();\n this.inputEl.nativeElement.click();\n }\n\n public fileChangeEvent(fileChangeEvent: any): void {\n this.handleFiles(fileChangeEvent.target.files);\n }\n\n public fileDragEnter(dragEnterEvent: any): void {\n // Save this target to know when the drag event leaves\n this.enterEventTarget = dragEnterEvent.target;\n dragEnterEvent.stopPropagation();\n dragEnterEvent.preventDefault();\n }\n\n public fileDragOver(dragOverEvent: any): void {\n const transfer = dragOverEvent.dataTransfer;\n\n dragOverEvent.stopPropagation();\n dragOverEvent.preventDefault();\n\n if (transfer) {\n if (transfer.items) {\n const files = transfer.items;\n\n for (let index = 0; index < files.length; index++) {\n const file: any = files[index];\n\n if (\n file.type &&\n this.fileAttachmentService.fileTypeRejected(\n file.type,\n this.acceptedTypes\n )\n ) {\n this.rejectedOver = true;\n this.acceptedOver = false;\n return;\n }\n }\n\n if (files.length > 0 && !this.acceptedOver) {\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n } else if (transfer.files) {\n // If the browser does not support DataTransfer.items,\n // defer file-type checking to drop handler.\n // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items#Browser_compatibility\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n }\n }\n\n public fileDrop(dropEvent: DragEvent): void {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n\n this.enterEventTarget = undefined;\n this.rejectedOver = false;\n this.acceptedOver = false;\n\n if (dropEvent.dataTransfer && dropEvent.dataTransfer.files) {\n if (dropEvent.dataTransfer.files.length > 1) {\n return;\n }\n\n if (\n this.fileAttachmentService.hasDirectory(dropEvent.dataTransfer.files)\n ) {\n return;\n }\n\n this.handleFiles(dropEvent.dataTransfer.files);\n }\n }\n\n public fileDragLeave(dragLeaveEvent: any): void {\n if (this.enterEventTarget === dragLeaveEvent.target) {\n this.rejectedOver = false;\n this.acceptedOver = false;\n }\n }\n\n public deleteFileAttachment(): void {\n this.value = undefined;\n this.changeDetector.markForCheck();\n this.emitFileChangeEvent(this.value);\n }\n\n public getFileName(truncate = true): string | undefined {\n if (this.value) {\n // tslint:disable-next-line: max-line-length\n let dropName =\n this.fileItemService.isFile(this.value) && this.value.file.name\n ? this.value.file.name\n : this.value.url;\n\n if (truncate && dropName.length > 26) {\n return dropName.slice(0, 26) + '...';\n } else {\n return dropName;\n }\n } else {\n return undefined;\n }\n }\n\n public ngOnDestroy(): void {\n this.fileChange.complete();\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n }\n\n public registerOnChange(fn: (value: any) => any): void {\n this._onChange = fn;\n }\n public registerOnTouched(fn: () => any): void {\n this._onTouched = fn;\n }\n\n public writeValue(value: any): void {\n this.value = value;\n this.changeDetector.markForCheck();\n }\n\n /**\n * @internal\n * Sets the disabled state of the control. Implemented as a part of ControlValueAccessor.\n * @param isDisabled Whether the control should be disabled.\n */\n public setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled;\n this.changeDetector.markForCheck();\n }\n\n public emitClick(): void {\n this.fileClick.emit({\n file: this.value,\n });\n }\n\n private emitFileChangeEvent(currentFile: SkyFileItem): void {\n if (currentFile && !currentFile.errorType) {\n this.writeValue(currentFile);\n }\n this.fileChange.emit({\n file: currentFile,\n } as SkyFileAttachmentChange);\n\n this.inputEl.nativeElement.value = '';\n }\n\n private loadFile(file: SkyFileItem): void {\n const reader = new FileReader();\n\n reader.addEventListener('load', (event: any): void => {\n file.url = event.target.result;\n this.emitFileChangeEvent(file);\n });\n\n reader.addEventListener('error', (event: any): void => {\n this.emitFileChangeEvent(file);\n });\n\n reader.addEventListener('abort', (event: any): void => {\n this.emitFileChangeEvent(file);\n });\n\n reader.readAsDataURL(file.file);\n }\n\n private handleFiles(files: FileList): void {\n // tslint:disable-next-line: max-line-length\n let processedFiles = this.fileAttachmentService.checkFiles(\n files,\n this.minFileSize,\n this.maxFileSize,\n this.acceptedTypes,\n this.validateFn\n );\n\n for (let file of processedFiles) {\n if (file.errorType) {\n this.emitFileChangeEvent(file);\n } else {\n this.loadFile(file);\n }\n }\n }\n\n private updateFileAttachmentButton(): void {\n this.showFileAttachmentButton = !(\n this.value && this.currentThemeName === 'modern'\n );\n this.changeDetector.markForCheck();\n }\n\n /*istanbul ignore next */\n private _onChange = (_: any) => {};\n /*istanbul ignore next */\n private _onTouched = () => {};\n}\n","<div class=\"sky-file-attachment-wrapper\">\n <div\n class=\"sky-file-attachment-label-wrapper\"\n [attr.aria-required]=\"required ? true : null\"\n [attr.id]=\"labelElementId\"\n [ngClass]=\"{ 'sky-control-label-required': required && hasLabelComponent }\"\n >\n <ng-container *ngTemplateOutlet=\"labelContent\"></ng-container>\n </div>\n <div\n class=\"\n sky-file-attachment-upload sky-file-attachment sky-file-attachment-target\n \"\n [ngClass]=\"{\n 'sky-file-attachment-accept': acceptedOver,\n 'sky-file-attachment-reject': rejectedOver\n }\"\n (dragenter)=\"fileDragEnter($event)\"\n (dragover)=\"fileDragOver($event)\"\n (dragleave)=\"fileDragLeave($event)\"\n (drop)=\"fileDrop($event)\"\n >\n <div\n aria-hidden=\"true\"\n class=\"sky-file-attachment-drop-description\"\n role=\"tooltip\"\n [attr.id]=\"fileDropDescriptionElementId\"\n >\n {{ 'skyux_file_attachment_file_upload_drag_or_click' | skyLibResources }}\n </div>\n <input\n hidden\n tabindex=\"-1\"\n type=\"file\"\n [attr.accept]=\"acceptedTypes || null\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n (change)=\"fileChangeEvent($event)\"\n #fileInput\n />\n <button\n *ngIf=\"showFileAttachmentButton\"\n class=\"sky-file-attachment-btn sky-btn sky-btn-default\"\n type=\"button\"\n [attr.aria-describedby]=\"fileDropDescriptionElementId\"\n [disabled]=\"disabled\"\n (click)=\"onDropClicked()\"\n >\n <sky-icon icon=\"folder-open-o\"></sky-icon>\n {{\n value\n ? ('skyux_file_attachment_button_label_replace_file'\n | skyLibResources)\n : ('skyux_file_attachment_button_label_choose_file' | skyLibResources)\n }}\n </button>\n <sky-icon\n *ngIf=\"value && !isImage() && currentThemeName === 'modern'\"\n class=\"sky-file-attachment-icon sky-deemphasized\"\n icon=\"file-o\"\n size=\"2x\"\n >\n </sky-icon>\n <span\n *ngIf=\"value || currentThemeName === 'default'\"\n class=\"sky-file-attachment-name\"\n >\n <a\n *ngIf=\"value; else noFile\"\n [attr.title]=\"getFileName(false)\"\n (click)=\"emitClick()\"\n >\n {{ getFileName() }}\n </a>\n </span>\n <ng-template #noFile>\n <span class=\"sky-file-attachment-none sky-deemphasized\">\n {{ 'skyux_file_attachment_label_no_file_chosen' | skyLibResources }}\n </span>\n </ng-template>\n <button\n *ngIf=\"value\"\n class=\"sky-btn sky-btn-borderless sky-file-attachment-delete\"\n type=\"button\"\n [attr.aria-label]=\"\n 'skyux_file_attachment_file_item_delete' | skyLibResources\n \"\n [disabled]=\"disabled\"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"deleteFileAttachment()\"\n >\n <sky-icon icon=\"trash-o\" size=\"md\"> </sky-icon>\n </button>\n </div>\n\n <img\n *ngIf=\"value && isImage()\"\n class=\"sky-file-attachment-preview-img\"\n [alt]=\"\n 'skyux_file_attachment_file_upload_image_preview_alt_text'\n | skyLibResources\n \"\n [src]=\"value.url\"\n />\n</div>\n\n<ng-template #labelContent>\n <ng-content select=\"sky-file-attachment-label\"></ng-content>\n</ng-template>\n"]}
|
|
1
|
+
{"version":3,"file":"file-attachment.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n AfterContentInit,\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n OnInit,\n Optional,\n Output,\n QueryList,\n Self,\n ViewChild,\n} from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { SkyThemeService } from '@skyux/theme';\n\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyFormsUtility } from '../shared/forms-utility';\n\nimport { SkyFileAttachmentLabelComponent } from './file-attachment-label.component';\nimport { SkyFileAttachmentService } from './file-attachment.service';\nimport { SkyFileItem } from './file-item';\nimport { SkyFileItemService } from './file-item.service';\nimport { SkyFileAttachmentChange } from './types/file-attachment-change';\nimport { SkyFileAttachmentClick } from './types/file-attachment-click';\n\nlet uniqueId = 0;\n\n/**\n * Provides an element to attach a single local file.\n */\n@Component({\n selector: 'sky-file-attachment',\n templateUrl: './file-attachment.component.html',\n styleUrls: ['./file-attachment.component.scss'],\n providers: [SkyFileAttachmentService],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyFileAttachmentComponent\n implements AfterViewInit, AfterContentInit, OnInit, OnDestroy\n{\n /**\n * Specifies a comma-delimited string literal of MIME types that users can attach.\n * By default, all file types are allowed.\n * @required\n */\n @Input()\n public acceptedTypes: string;\n\n /**\n * Indicates whether to disable the input.\n * @default false\n */\n @Input()\n public set disabled(value: boolean) {\n const newDisabledState = SkyFormsUtility.coerceBooleanProperty(value);\n if (this._disabled !== newDisabledState) {\n this._disabled = newDisabledState;\n }\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /**\n * Specifies the maximum size in bytes for valid files.\n */\n @Input()\n public maxFileSize = 500000;\n\n /**\n * Specifies the minimum size in bytes for valid files.\n */\n @Input()\n public minFileSize = 0;\n\n /**\n * Specifies a custom validation function. This validation runs alongside the internal\n * file validation. This function takes a `SkyFileItem` object as a parameter.\n */\n @Input()\n public validateFn: Function;\n\n /**\n * Fires when users add or remove files.\n */\n @Output()\n public fileChange = new EventEmitter<SkyFileAttachmentChange>();\n\n /**\n * Fires when users select the file name link. Make sure to bind the event.\n * If you do not, the file name link will be a dead link.\n */\n @Output()\n public fileClick = new EventEmitter<SkyFileAttachmentClick>();\n\n public acceptedOver = false;\n\n public get hasLabelComponent(): boolean {\n return this.labelComponents.length > 0;\n }\n\n public fileDropDescriptionElementId: string;\n\n public labelElementId: string;\n\n public rejectedOver = false;\n\n /**\n * Indicates whether the input is required for form validation.\n * When you set this property to `true`, the component adds `aria-required` and `required`\n * attributes to the input element so that forms display an invalid state until the input element\n * is complete.\n */\n @Input()\n public required = false;\n\n public set value(value: SkyFileItem) {\n // The null check is needed to address a bug in Angular 4.\n // writeValue is being called twice, first time with a phantom null value\n // See: https://github.com/angular/angular/issues/14988\n // tslint:disable-next-line:no-null-keyword\n const isNewValue = value !== this.value && value !== null;\n\n if (isNewValue) {\n this._value = value;\n this._onChange(value);\n this.updateFileAttachmentButton();\n }\n }\n\n public get value(): SkyFileItem {\n return this._value;\n }\n\n public currentThemeName: string;\n\n public showFileAttachmentButton: boolean;\n\n @ViewChild('fileInput')\n private inputEl: ElementRef;\n\n @ContentChildren(SkyFileAttachmentLabelComponent)\n private labelComponents: QueryList<SkyFileAttachmentLabelComponent>;\n\n private enterEventTarget: any;\n\n private fileAttachmentId = uniqueId++;\n\n private ngUnsubscribe = new Subject<void>();\n\n private _disabled = false;\n\n private _value: any;\n\n constructor(\n public themeSvc: SkyThemeService,\n private changeDetector: ChangeDetectorRef,\n private fileAttachmentService: SkyFileAttachmentService,\n private fileItemService: SkyFileItemService,\n @Self() @Optional() private ngControl: NgControl\n ) {\n this.labelElementId = `sky-file-attachment-label-${this.fileAttachmentId}`;\n this.fileDropDescriptionElementId = `sky-file-attachment-drop-description-${this.fileAttachmentId}`;\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n public ngOnInit(): void {\n this.themeSvc.settingsChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((themeSettings) => {\n this.currentThemeName = themeSettings.currentSettings.theme.name;\n this.updateFileAttachmentButton();\n });\n }\n\n public ngAfterViewInit(): void {\n // This is needed to address a bug in Angular 7.\n // When a control value is set intially, its value is not represented on the view.\n // See: https://github.com/angular/angular/issues/13792\n // Of note is the parent check which allows us to determine if the form is reactive.\n // Without this check there is a changed before checked error\n /* istanbul ignore else */\n if (this.ngControl) {\n setTimeout(() => {\n this.ngControl.control.setValue(this.value, {\n emitEvent: false,\n });\n this.changeDetector.markForCheck();\n });\n\n // Backwards compatibility support for anyone still using Validators.Required.\n this.required =\n this.required || SkyFormsUtility.hasRequiredValidation(this.ngControl);\n }\n }\n\n public ngAfterContentInit(): void {\n // Handles updating classes when label changes\n this.labelComponents.changes\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => {\n this.changeDetector.detectChanges();\n });\n }\n\n public isImage(): boolean {\n return this.fileItemService.isImage(this.value);\n }\n\n public onDropClicked(): void {\n this._onTouched();\n this.inputEl.nativeElement.click();\n }\n\n public fileChangeEvent(fileChangeEvent: any): void {\n this.handleFiles(fileChangeEvent.target.files);\n }\n\n public fileDragEnter(dragEnterEvent: any): void {\n // Save this target to know when the drag event leaves\n this.enterEventTarget = dragEnterEvent.target;\n dragEnterEvent.stopPropagation();\n dragEnterEvent.preventDefault();\n }\n\n public fileDragOver(dragOverEvent: any): void {\n const transfer = dragOverEvent.dataTransfer;\n\n dragOverEvent.stopPropagation();\n dragOverEvent.preventDefault();\n\n if (transfer) {\n if (transfer.items) {\n const files = transfer.items;\n\n for (let index = 0; index < files.length; index++) {\n const file: any = files[index];\n\n if (\n file.type &&\n this.fileAttachmentService.fileTypeRejected(\n file.type,\n this.acceptedTypes\n )\n ) {\n this.rejectedOver = true;\n this.acceptedOver = false;\n return;\n }\n }\n\n if (files.length > 0 && !this.acceptedOver) {\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n } else if (transfer.files) {\n // If the browser does not support DataTransfer.items,\n // defer file-type checking to drop handler.\n // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items#Browser_compatibility\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n }\n }\n\n public fileDrop(dropEvent: DragEvent): void {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n\n this.enterEventTarget = undefined;\n this.rejectedOver = false;\n this.acceptedOver = false;\n\n if (dropEvent.dataTransfer && dropEvent.dataTransfer.files) {\n if (dropEvent.dataTransfer.files.length > 1) {\n return;\n }\n\n if (\n this.fileAttachmentService.hasDirectory(dropEvent.dataTransfer.files)\n ) {\n return;\n }\n\n this.handleFiles(dropEvent.dataTransfer.files);\n }\n }\n\n public fileDragLeave(dragLeaveEvent: any): void {\n if (this.enterEventTarget === dragLeaveEvent.target) {\n this.rejectedOver = false;\n this.acceptedOver = false;\n }\n }\n\n public deleteFileAttachment(): void {\n this.value = undefined;\n this.changeDetector.markForCheck();\n this.emitFileChangeEvent(this.value);\n }\n\n public getFileName(truncate = true): string | undefined {\n if (this.value) {\n // tslint:disable-next-line: max-line-length\n const dropName =\n this.fileItemService.isFile(this.value) && this.value.file.name\n ? this.value.file.name\n : this.value.url;\n\n if (truncate && dropName.length > 26) {\n return dropName.slice(0, 26) + '...';\n } else {\n return dropName;\n }\n } else {\n return undefined;\n }\n }\n\n public ngOnDestroy(): void {\n this.fileChange.complete();\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n }\n\n public registerOnChange(fn: (value: any) => any): void {\n this._onChange = fn;\n }\n public registerOnTouched(fn: () => any): void {\n this._onTouched = fn;\n }\n\n public writeValue(value: any): void {\n this.value = value;\n this.changeDetector.markForCheck();\n }\n\n /**\n * @internal\n * Sets the disabled state of the control. Implemented as a part of ControlValueAccessor.\n * @param isDisabled Whether the control should be disabled.\n */\n public setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled;\n this.changeDetector.markForCheck();\n }\n\n public emitClick(): void {\n this.fileClick.emit({\n file: this.value,\n });\n }\n\n private emitFileChangeEvent(currentFile: SkyFileItem): void {\n if (currentFile && !currentFile.errorType) {\n this.writeValue(currentFile);\n }\n this.fileChange.emit({\n file: currentFile,\n } as SkyFileAttachmentChange);\n\n this.inputEl.nativeElement.value = '';\n }\n\n private loadFile(file: SkyFileItem): void {\n const reader = new FileReader();\n\n reader.addEventListener('load', (event: any): void => {\n file.url = event.target.result;\n this.emitFileChangeEvent(file);\n });\n\n reader.addEventListener('error', (event: any): void => {\n this.emitFileChangeEvent(file);\n });\n\n reader.addEventListener('abort', (event: any): void => {\n this.emitFileChangeEvent(file);\n });\n\n reader.readAsDataURL(file.file);\n }\n\n private handleFiles(files: FileList): void {\n // tslint:disable-next-line: max-line-length\n const processedFiles = this.fileAttachmentService.checkFiles(\n files,\n this.minFileSize,\n this.maxFileSize,\n this.acceptedTypes,\n this.validateFn\n );\n\n for (const file of processedFiles) {\n if (file.errorType) {\n this.emitFileChangeEvent(file);\n } else {\n this.loadFile(file);\n }\n }\n }\n\n private updateFileAttachmentButton(): void {\n this.showFileAttachmentButton = !(\n this.value && this.currentThemeName === 'modern'\n );\n this.changeDetector.markForCheck();\n }\n\n /*istanbul ignore next */\n private _onChange = (_: any) => {};\n /*istanbul ignore next */\n private _onTouched = () => {};\n}\n","<div class=\"sky-file-attachment-wrapper\">\n <div\n class=\"sky-file-attachment-label-wrapper\"\n [attr.aria-required]=\"required ? true : null\"\n [attr.id]=\"labelElementId\"\n [ngClass]=\"{ 'sky-control-label-required': required && hasLabelComponent }\"\n >\n <ng-container *ngTemplateOutlet=\"labelContent\"></ng-container>\n </div>\n <div\n class=\"\n sky-file-attachment-upload sky-file-attachment sky-file-attachment-target\n \"\n [ngClass]=\"{\n 'sky-file-attachment-accept': acceptedOver,\n 'sky-file-attachment-reject': rejectedOver\n }\"\n (dragenter)=\"fileDragEnter($event)\"\n (dragover)=\"fileDragOver($event)\"\n (dragleave)=\"fileDragLeave($event)\"\n (drop)=\"fileDrop($event)\"\n >\n <div\n aria-hidden=\"true\"\n class=\"sky-file-attachment-drop-description\"\n role=\"tooltip\"\n [attr.id]=\"fileDropDescriptionElementId\"\n >\n {{ 'skyux_file_attachment_file_upload_drag_or_click' | skyLibResources }}\n </div>\n <input\n hidden\n tabindex=\"-1\"\n type=\"file\"\n [attr.accept]=\"acceptedTypes || null\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n (change)=\"fileChangeEvent($event)\"\n #fileInput\n />\n <button\n *ngIf=\"showFileAttachmentButton\"\n class=\"sky-file-attachment-btn sky-btn sky-btn-default\"\n type=\"button\"\n [attr.aria-describedby]=\"fileDropDescriptionElementId\"\n [disabled]=\"disabled\"\n (click)=\"onDropClicked()\"\n >\n <sky-icon icon=\"folder-open-o\"></sky-icon>\n {{\n value\n ? ('skyux_file_attachment_button_label_replace_file'\n | skyLibResources)\n : ('skyux_file_attachment_button_label_choose_file' | skyLibResources)\n }}\n </button>\n <sky-icon\n *ngIf=\"value && !isImage() && currentThemeName === 'modern'\"\n class=\"sky-file-attachment-icon sky-deemphasized\"\n icon=\"file-o\"\n size=\"2x\"\n >\n </sky-icon>\n <span\n *ngIf=\"value || currentThemeName === 'default'\"\n class=\"sky-file-attachment-name\"\n >\n <a\n *ngIf=\"value; else noFile\"\n [attr.title]=\"getFileName(false)\"\n (click)=\"emitClick()\"\n >\n {{ getFileName() }}\n </a>\n </span>\n <ng-template #noFile>\n <span class=\"sky-file-attachment-none sky-deemphasized\">\n {{ 'skyux_file_attachment_label_no_file_chosen' | skyLibResources }}\n </span>\n </ng-template>\n <button\n *ngIf=\"value\"\n class=\"sky-btn sky-btn-borderless sky-file-attachment-delete\"\n type=\"button\"\n [attr.aria-label]=\"\n 'skyux_file_attachment_file_item_delete' | skyLibResources\n \"\n [disabled]=\"disabled\"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"deleteFileAttachment()\"\n >\n <sky-icon icon=\"trash-o\" size=\"md\"> </sky-icon>\n </button>\n </div>\n\n <img\n *ngIf=\"value && isImage()\"\n class=\"sky-file-attachment-preview-img\"\n [alt]=\"\n 'skyux_file_attachment_file_upload_image_preview_alt_text'\n | skyLibResources\n \"\n [src]=\"value.url\"\n />\n</div>\n\n<ng-template #labelContent>\n <ng-content select=\"sky-file-attachment-label\"></ng-content>\n</ng-template>\n"]}
|
|
@@ -5,9 +5,9 @@ import * as i0 from "@angular/core";
|
|
|
5
5
|
*/
|
|
6
6
|
export class SkyFileAttachmentService {
|
|
7
7
|
checkFiles(files, minFileSize, maxFileSize, acceptedTypes, validateFn) {
|
|
8
|
-
|
|
8
|
+
const fileResults = [];
|
|
9
9
|
for (let index = 0; index < files.length; index++) {
|
|
10
|
-
|
|
10
|
+
const fileItem = {
|
|
11
11
|
file: files.item(index),
|
|
12
12
|
};
|
|
13
13
|
if (fileItem.file.size < minFileSize) {
|
|
@@ -26,8 +26,8 @@ export class SkyFileAttachmentService {
|
|
|
26
26
|
fileResults.push(fileItem);
|
|
27
27
|
}
|
|
28
28
|
else if (validateFn) {
|
|
29
|
-
|
|
30
|
-
if (
|
|
29
|
+
const errorParam = validateFn(fileItem);
|
|
30
|
+
if (errorParam) {
|
|
31
31
|
fileItem.errorType = 'validate';
|
|
32
32
|
fileItem.errorParam = errorParam;
|
|
33
33
|
}
|
|
@@ -60,8 +60,8 @@ export class SkyFileAttachmentService {
|
|
|
60
60
|
if (!fileType) {
|
|
61
61
|
return true;
|
|
62
62
|
}
|
|
63
|
-
|
|
64
|
-
|
|
63
|
+
const acceptedTypesUpper = acceptedTypes.toUpperCase();
|
|
64
|
+
const typeArray = acceptedTypesUpper.split(',');
|
|
65
65
|
return !this.fileTypeInArray(typeArray, fileType.toUpperCase());
|
|
66
66
|
}
|
|
67
67
|
fileTypeInArray(typeArray, fileType) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-attachment.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;;AAI3C;;GAEG;AAEH,MAAM,OAAO,wBAAwB;IAC5B,UAAU,CACf,KAAe,EACf,WAAmB,EACnB,WAAmB,EACnB,aAAqB,EACrB,UAAoB;QAEpB,
|
|
1
|
+
{"version":3,"file":"file-attachment.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachment.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { SkyFileItem } from './file-item';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyFileAttachmentService {\n public checkFiles(\n files: FileList,\n minFileSize: number,\n maxFileSize: number,\n acceptedTypes: string,\n validateFn: Function\n ): SkyFileItem[] {\n const fileResults: SkyFileItem[] = [];\n\n for (let index = 0; index < files.length; index++) {\n const fileItem = {\n file: files.item(index),\n } as SkyFileItem;\n\n if (fileItem.file.size < minFileSize) {\n fileItem.errorType = 'minFileSize';\n fileItem.errorParam = minFileSize.toString();\n fileResults.push(fileItem);\n } else if (fileItem.file.size > maxFileSize) {\n fileItem.errorType = 'maxFileSize';\n fileItem.errorParam = maxFileSize.toString();\n fileResults.push(fileItem);\n } else if (this.fileTypeRejected(fileItem.file.type, acceptedTypes)) {\n fileItem.errorType = 'fileType';\n fileItem.errorParam = acceptedTypes;\n fileResults.push(fileItem);\n } else if (validateFn) {\n const errorParam = validateFn(fileItem);\n\n if (errorParam) {\n fileItem.errorType = 'validate';\n fileItem.errorParam = errorParam;\n }\n fileResults.push(fileItem);\n } else {\n fileResults.push(fileItem);\n }\n }\n return fileResults;\n }\n\n /**\n * Returns `true` if a directory is found in the provided `files` parameter.\n */\n public hasDirectory(files: FileList): boolean {\n for (let index = 0; index < files.length; index++) {\n const file: any = files.item(index);\n if (\n file.webkitGetAsEntry &&\n file.webkitGetAsEntry() &&\n file.webkitGetAsEntry().isDirectory\n ) {\n return true;\n }\n }\n\n return false;\n }\n\n public fileTypeRejected(fileType: string, acceptedTypes: string): boolean {\n if (!acceptedTypes) {\n return false;\n }\n\n if (!fileType) {\n return true;\n }\n\n const acceptedTypesUpper = acceptedTypes.toUpperCase();\n const typeArray = acceptedTypesUpper.split(',');\n\n return !this.fileTypeInArray(typeArray, fileType.toUpperCase());\n }\n\n private fileTypeInArray(typeArray: string[], fileType: string): boolean {\n if (typeArray.indexOf(fileType) !== -1) {\n return true;\n }\n\n for (let index = 0; index < typeArray.length; index++) {\n const type = typeArray[index];\n const validSubtype = this.getMimeSubtype(type);\n\n if (validSubtype === '*') {\n if (this.getMimeMainType(type) === this.getMimeMainType(fileType)) {\n return true;\n }\n }\n }\n\n return false;\n }\n\n private getMimeSubtype(type: string): string {\n return type.substr(type.indexOf('/') + 1, type.length);\n }\n\n private getMimeMainType(type: string): string {\n return type.substr(0, type.indexOf('/'));\n }\n}\n"]}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { CommonModule, DecimalPipe } from '@angular/common';
|
|
2
|
-
import { FormsModule } from '@angular/forms';
|
|
3
2
|
import { NgModule } from '@angular/core';
|
|
3
|
+
import { FormsModule } from '@angular/forms';
|
|
4
4
|
import { SkyI18nModule } from '@skyux/i18n';
|
|
5
5
|
import { SkyIconModule } from '@skyux/indicators';
|
|
6
6
|
import { SkyThemeModule } from '@skyux/theme';
|
|
7
|
-
import {
|
|
7
|
+
import { SkyFormsResourcesModule } from '../shared/sky-forms-resources.module';
|
|
8
8
|
import { SkyFileAttachmentLabelComponent } from './file-attachment-label.component';
|
|
9
|
+
import { SkyFileAttachmentComponent } from './file-attachment.component';
|
|
9
10
|
import { SkyFileDropComponent } from './file-drop.component';
|
|
10
11
|
import { SkyFileItemComponent } from './file-item.component';
|
|
11
12
|
import { SkyFileItemService } from './file-item.service';
|
|
12
13
|
import { SkyFileSizePipe } from './file-size.pipe';
|
|
13
|
-
import { SkyFormsResourcesModule } from '../shared/sky-forms-resources.module';
|
|
14
14
|
import * as i0 from "@angular/core";
|
|
15
15
|
export class SkyFileAttachmentsModule {
|
|
16
16
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-attachments.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachments.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"file-attachments.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-attachments.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AACpF,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AACzE,OAAO,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;;AA2BnD,MAAM,OAAO,wBAAwB;;sHAAxB,wBAAwB;uHAAxB,wBAAwB,iBAvBjC,0BAA0B;QAC1B,+BAA+B;QAC/B,oBAAoB;QACpB,oBAAoB;QACpB,eAAe,aAGf,YAAY;QACZ,WAAW;QACX,uBAAuB;QACvB,aAAa;QACb,aAAa;QACb,cAAc,aAGd,0BAA0B;QAC1B,+BAA+B;QAC/B,oBAAoB;QACpB,oBAAoB;QACpB,eAAe;uHAIN,wBAAwB,aAFxB,CAAC,WAAW,EAAE,kBAAkB,CAAC,YAfnC;YACP,YAAY;YACZ,WAAW;YACX,uBAAuB;YACvB,aAAa;YACb,aAAa;YACb,cAAc;SACf;4FAUU,wBAAwB;kBAzBpC,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,0BAA0B;wBAC1B,+BAA+B;wBAC/B,oBAAoB;wBACpB,oBAAoB;wBACpB,eAAe;qBAChB;oBACD,OAAO,EAAE;wBACP,YAAY;wBACZ,WAAW;wBACX,uBAAuB;wBACvB,aAAa;wBACb,aAAa;wBACb,cAAc;qBACf;oBACD,OAAO,EAAE;wBACP,0BAA0B;wBAC1B,+BAA+B;wBAC/B,oBAAoB;wBACpB,oBAAoB;wBACpB,eAAe;qBAChB;oBACD,SAAS,EAAE,CAAC,WAAW,EAAE,kBAAkB,CAAC;iBAC7C","sourcesContent":["import { CommonModule, DecimalPipe } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { SkyI18nModule } from '@skyux/i18n';\nimport { SkyIconModule } from '@skyux/indicators';\nimport { SkyThemeModule } from '@skyux/theme';\n\nimport { SkyFormsResourcesModule } from '../shared/sky-forms-resources.module';\n\nimport { SkyFileAttachmentLabelComponent } from './file-attachment-label.component';\nimport { SkyFileAttachmentComponent } from './file-attachment.component';\nimport { SkyFileDropComponent } from './file-drop.component';\nimport { SkyFileItemComponent } from './file-item.component';\nimport { SkyFileItemService } from './file-item.service';\nimport { SkyFileSizePipe } from './file-size.pipe';\n\n@NgModule({\n declarations: [\n SkyFileAttachmentComponent,\n SkyFileAttachmentLabelComponent,\n SkyFileDropComponent,\n SkyFileItemComponent,\n SkyFileSizePipe,\n ],\n imports: [\n CommonModule,\n FormsModule,\n SkyFormsResourcesModule,\n SkyI18nModule,\n SkyIconModule,\n SkyThemeModule,\n ],\n exports: [\n SkyFileAttachmentComponent,\n SkyFileAttachmentLabelComponent,\n SkyFileDropComponent,\n SkyFileItemComponent,\n SkyFileSizePipe,\n ],\n providers: [DecimalPipe, SkyFileItemService],\n})\nexport class SkyFileAttachmentsModule {}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component,
|
|
1
|
+
import { Component, ElementRef, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
|
|
2
2
|
import { SkyFileAttachmentService } from './file-attachment.service';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
import * as i1 from "./file-attachment.service";
|
|
@@ -166,13 +166,13 @@ export class SkyFileDropComponent {
|
|
|
166
166
|
reader.readAsDataURL(file.file);
|
|
167
167
|
}
|
|
168
168
|
handleFiles(files) {
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
169
|
+
const validFileArray = [];
|
|
170
|
+
const rejectedFileArray = [];
|
|
171
|
+
const totalFiles = files.length;
|
|
172
|
+
const fileDrop = this;
|
|
173
173
|
// tslint:disable-next-line: max-line-length
|
|
174
|
-
|
|
175
|
-
for (
|
|
174
|
+
const processedFiles = this.fileAttachmentService.checkFiles(files, this.minFileSize, this.maxFileSize, this.acceptedTypes, this.validateFn);
|
|
175
|
+
for (const file of processedFiles) {
|
|
176
176
|
if (file.errorType) {
|
|
177
177
|
this.filesRejected(file, validFileArray, rejectedFileArray, totalFiles);
|
|
178
178
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-drop.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-drop.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-drop.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Input,\n Output,\n EventEmitter,\n ElementRef,\n OnDestroy,\n ViewChild,\n} from '@angular/core';\n\nimport { SkyFileItem } from './file-item';\n\nimport { SkyFileLink } from './file-link';\n\nimport { SkyFileDropChange } from './types/file-drop-change';\n\nimport { SkyFileAttachmentService } from './file-attachment.service';\n\n/**\n * Provides an element to attach multiple files where users can browse or drag and drop local files\n * or provide hyperlinks to external files. You can leave the contents of the component\n * blank to display the drop zone's default UI, or you can specify custom content to\n * display instead. When the module initializes, it disables the ability to drag and\n * drop files for the entire window to prevent the browser from opening files that are\n * accidentally dropped outside the target zone. If you implement your own file drop functionality\n * outside of the file drop component, you can place the `sky-file-drop-target` CSS class\n * on the element that receives drop events to exempt it from the drop exclusion rule.\n */\n@Component({\n selector: 'sky-file-drop',\n templateUrl: './file-drop.component.html',\n styleUrls: ['./file-drop.component.scss'],\n providers: [SkyFileAttachmentService],\n})\nexport class SkyFileDropComponent implements OnDestroy {\n /**\n * Fires when users add or remove files.\n */\n @Output()\n public filesChanged = new EventEmitter<SkyFileDropChange>();\n\n /**\n * Fires when the link input box triggers a blur event.\n */\n @Output()\n public linkInputBlur = new EventEmitter<void>();\n\n /**\n * Fires when users add or remove links.\n */\n @Output()\n public linkChanged = new EventEmitter<SkyFileLink>();\n\n /**\n * Specifies an ARIA label for the file upload button. This provides a text equivalent for\n * screen readers [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n */\n @Input()\n public fileUploadAriaLabel: string;\n\n /**\n * Specifies an ARIA label for the link upload input. This provides a text equivalent for\n * screen readers [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n */\n @Input()\n public linkUploadAriaLabel: string;\n\n /**\n * Specifies the minimum size in bytes for valid files.\n */\n @Input()\n public minFileSize: number = 0;\n\n /**\n * Specifies the maximum size in bytes for valid files.\n */\n @Input()\n public maxFileSize: number = 500000;\n\n /**\n * Indicates whether users can drag and drop multiple files at the same time.\n */\n @Input()\n public multiple: boolean = true;\n\n /**\n * Specifies a custom validation function. This validation runs alongside the internal\n * file validation. This function takes a `SkyFileItem` object as a parameter.\n */\n @Input()\n public validateFn: Function;\n\n /**\n * Specifies a comma-delimited string literal of MIME types that users can attach.\n * By default, all file types are allowed.\n * @required\n */\n @Input()\n public acceptedTypes: string;\n\n /**\n * Indicates whether to disable the option to browse for files to attach.\n */\n @Input()\n public noClick: boolean = false;\n\n /**\n * Indicates whether to display the option to attach files from URLs rather than from local devices.\n */\n @Input()\n public allowLinks: boolean = false;\n\n @ViewChild('fileInput')\n public inputEl: ElementRef;\n\n public rejectedOver: boolean = false;\n public acceptedOver: boolean = false;\n public linkUrl: string;\n\n private enterEventTarget: any;\n\n constructor(private fileAttachmentService: SkyFileAttachmentService) {}\n\n public ngOnDestroy() {\n this.filesChanged.complete();\n this.linkChanged.complete();\n this.linkInputBlur.complete();\n }\n\n public dropClicked() {\n if (!this.noClick) {\n this.inputEl.nativeElement.click();\n }\n }\n\n public fileChangeEvent(fileChangeEvent: any) {\n this.handleFiles(fileChangeEvent.target.files);\n }\n\n public fileDragEnter(dragEnterEvent: any) {\n // Save this target to know when the drag event leaves\n this.enterEventTarget = dragEnterEvent.target;\n dragEnterEvent.stopPropagation();\n dragEnterEvent.preventDefault();\n }\n\n public fileDragOver(dragOverEvent: any) {\n const transfer = dragOverEvent.dataTransfer;\n\n dragOverEvent.stopPropagation();\n dragOverEvent.preventDefault();\n\n if (transfer) {\n if (transfer.items) {\n const files = transfer.items;\n\n for (let index = 0; index < files.length; index++) {\n const file: any = files[index];\n\n if (\n file.type &&\n this.fileAttachmentService.fileTypeRejected(\n file.type,\n this.acceptedTypes\n )\n ) {\n this.rejectedOver = true;\n this.acceptedOver = false;\n return;\n }\n }\n\n if (files.length > 0 && !this.acceptedOver) {\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n } /* istanbul ignore next: untestable */ else if (transfer.files) {\n // If the browser does not support DataTransfer.items,\n // defer file-type checking to drop handler.\n // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items#Browser_compatibility\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n }\n }\n\n public fileDrop(dropEvent: DragEvent): void {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n\n this.enterEventTarget = undefined;\n this.rejectedOver = false;\n this.acceptedOver = false;\n\n if (dropEvent.dataTransfer && dropEvent.dataTransfer.files) {\n const hasDirectory = this.fileAttachmentService.hasDirectory(\n dropEvent.dataTransfer.files\n );\n const invalidNumberOfFiles =\n !this.multiple && dropEvent.dataTransfer.files.length > 1;\n\n if (hasDirectory || invalidNumberOfFiles) {\n return;\n }\n\n this.handleFiles(dropEvent.dataTransfer.files);\n }\n }\n\n public fileDragLeave(dragLeaveEvent: any) {\n if (this.enterEventTarget === dragLeaveEvent.target) {\n this.rejectedOver = false;\n this.acceptedOver = false;\n }\n }\n\n public addLinkEnter(event: KeyboardEvent) {\n if (event.which === 13) {\n this.addLink(event);\n }\n }\n\n public addLink(event: Event) {\n event.preventDefault();\n this.linkChanged.emit({ url: this.linkUrl } as SkyFileLink);\n this.linkUrl = undefined;\n }\n\n public onLinkBlur(): void {\n this.linkInputBlur.emit();\n }\n\n private emitFileChangeEvent(\n totalFiles: number,\n rejectedFileArray: Array<SkyFileItem>,\n validFileArray: Array<SkyFileItem>\n ) {\n if (totalFiles === rejectedFileArray.length + validFileArray.length) {\n this.filesChanged.emit({\n files: validFileArray,\n rejectedFiles: rejectedFileArray,\n } as SkyFileDropChange);\n\n this.inputEl.nativeElement.value = '';\n }\n }\n\n private filesRejected(\n file: SkyFileItem,\n validFileArray: Array<SkyFileItem>,\n rejectedFileArray: Array<SkyFileItem>,\n totalFiles: number\n ) {\n rejectedFileArray.push(file);\n this.emitFileChangeEvent(totalFiles, rejectedFileArray, validFileArray);\n }\n\n private loadFile(\n fileDrop: SkyFileDropComponent,\n file: SkyFileItem,\n validFileArray: Array<SkyFileItem>,\n rejectedFileArray: Array<SkyFileItem>,\n totalFiles: number\n ) {\n const reader = new FileReader();\n\n reader.addEventListener('load', (event: any) => {\n file.url = event.target.result;\n validFileArray.push(file);\n fileDrop.emitFileChangeEvent(\n totalFiles,\n rejectedFileArray,\n validFileArray\n );\n });\n\n reader.addEventListener('error', (event: any) => {\n fileDrop.filesRejected(\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n });\n\n reader.addEventListener('abort', (event: any) => {\n fileDrop.filesRejected(\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n });\n\n reader.readAsDataURL(file.file);\n }\n\n private handleFiles(files: FileList) {\n let validFileArray: Array<SkyFileItem> = [];\n let rejectedFileArray: Array<SkyFileItem> = [];\n let totalFiles = files.length;\n let fileDrop = this;\n\n // tslint:disable-next-line: max-line-length\n let processedFiles = this.fileAttachmentService.checkFiles(\n files,\n this.minFileSize,\n this.maxFileSize,\n this.acceptedTypes,\n this.validateFn\n );\n\n for (let file of processedFiles) {\n if (file.errorType) {\n this.filesRejected(file, validFileArray, rejectedFileArray, totalFiles);\n } else {\n this.loadFile(\n fileDrop,\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n }\n }\n }\n}\n","<div\n class=\"sky-file-drop-row\"\n [ngClass]=\"{ 'sky-file-drop-allow-links': allowLinks }\"\n>\n <div\n class=\"sky-file-drop-col\"\n [ngClass]=\"{\n 'sky-file-drop-accept': acceptedOver,\n 'sky-file-drop-reject': rejectedOver\n }\"\n >\n <button\n class=\"sky-file-drop sky-file-drop-target\"\n type=\"button\"\n (click)=\"dropClicked()\"\n (dragover)=\"fileDragOver($event)\"\n (dragenter)=\"fileDragEnter($event)\"\n (dragleave)=\"fileDragLeave($event)\"\n (drop)=\"fileDrop($event)\"\n [attr.aria-label]=\"\n fileUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_drag_or_click' | skyLibResources)\n \"\n ></button>\n\n <input\n tabindex=\"-1\"\n aria-hidden=\"true\"\n type=\"file\"\n class=\"sky-file-input-hidden\"\n [attr.multiple]=\"multiple ? multiple : null\"\n [attr.accept]=\"acceptedTypes ? acceptedTypes : null\"\n (change)=\"fileChangeEvent($event)\"\n #fileInput\n />\n\n <div\n class=\"sky-file-drop-contents sky-padding-even-default\"\n *ngIf=\"customEl.children.length === 0\"\n >\n <div class=\"sky-file-drop-contents-not-over\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_drag_file_here' | skyLibResources\n }}\n </div>\n <div class=\"sky-file-drop-text\">\n {{\n 'skyux_file_attachment_file_upload_or_click_to_browse'\n | skyLibResources\n }}\n </div>\n <sky-icon icon=\"cloud-upload\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n\n <!-- This will appear when file is dragged over and is valid -->\n <div class=\"sky-file-drop-contents-accept\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_drop_files_here'\n | skyLibResources\n }}\n </div>\n <sky-icon icon=\"bullseye\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n\n <!-- This will appear when file is dragged over and is invalid -->\n <div class=\"sky-file-drop-contents-reject\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_invalid_file' | skyLibResources\n }}\n </div>\n <sky-icon icon=\"times-circle\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n </div>\n\n <div class=\"sky-file-drop-contents-custom\" #customEl>\n <ng-content></ng-content>\n </div>\n </div>\n <div class=\"sky-file-drop-col\" *ngIf=\"allowLinks\">\n <div class=\"sky-file-drop-contents sky-padding-even-default\">\n <div class=\"sky-file-drop-link\">\n <div class=\"sky-file-drop-link-header\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_paste_link' | skyLibResources\n }}\n </div>\n </div>\n <div class=\"sky-form-group\">\n <input\n type=\"text\"\n class=\"sky-form-control\"\n [attr.aria-label]=\"\n linkUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_link_input' | skyLibResources)\n \"\n [attr.placeholder]=\"\n 'skyux_file_attachment_file_upload_link_placeholder'\n | skyLibResources\n \"\n [(ngModel)]=\"linkUrl\"\n (blur)=\"onLinkBlur()\"\n (keyup)=\"addLinkEnter($event)\"\n />\n </div>\n <button\n type=\"button\"\n class=\"sky-btn sky-btn-primary\"\n [disabled]=\"!linkUrl\"\n (click)=\"addLink($event)\"\n >\n {{\n 'skyux_file_attachment_file_upload_paste_link_done'\n | skyLibResources\n }}\n </button>\n </div>\n </div>\n </div>\n</div>\n"]}
|
|
1
|
+
{"version":3,"file":"file-drop.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-drop.component.ts","../../../../../../../../libs/components/forms/src/lib/modules/file-attachment/file-drop.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n Output,\n ViewChild,\n} from '@angular/core';\n\nimport { SkyFileAttachmentService } from './file-attachment.service';\nimport { SkyFileItem } from './file-item';\nimport { SkyFileLink } from './file-link';\nimport { SkyFileDropChange } from './types/file-drop-change';\n\n/**\n * Provides an element to attach multiple files where users can browse or drag and drop local files\n * or provide hyperlinks to external files. You can leave the contents of the component\n * blank to display the drop zone's default UI, or you can specify custom content to\n * display instead. When the module initializes, it disables the ability to drag and\n * drop files for the entire window to prevent the browser from opening files that are\n * accidentally dropped outside the target zone. If you implement your own file drop functionality\n * outside of the file drop component, you can place the `sky-file-drop-target` CSS class\n * on the element that receives drop events to exempt it from the drop exclusion rule.\n */\n@Component({\n selector: 'sky-file-drop',\n templateUrl: './file-drop.component.html',\n styleUrls: ['./file-drop.component.scss'],\n providers: [SkyFileAttachmentService],\n})\nexport class SkyFileDropComponent implements OnDestroy {\n /**\n * Fires when users add or remove files.\n */\n @Output()\n public filesChanged = new EventEmitter<SkyFileDropChange>();\n\n /**\n * Fires when the link input box triggers a blur event.\n */\n @Output()\n public linkInputBlur = new EventEmitter<void>();\n\n /**\n * Fires when users add or remove links.\n */\n @Output()\n public linkChanged = new EventEmitter<SkyFileLink>();\n\n /**\n * Specifies an ARIA label for the file upload button. This provides a text equivalent for\n * screen readers [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n */\n @Input()\n public fileUploadAriaLabel: string;\n\n /**\n * Specifies an ARIA label for the link upload input. This provides a text equivalent for\n * screen readers [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n */\n @Input()\n public linkUploadAriaLabel: string;\n\n /**\n * Specifies the minimum size in bytes for valid files.\n */\n @Input()\n public minFileSize = 0;\n\n /**\n * Specifies the maximum size in bytes for valid files.\n */\n @Input()\n public maxFileSize = 500000;\n\n /**\n * Indicates whether users can drag and drop multiple files at the same time.\n */\n @Input()\n public multiple = true;\n\n /**\n * Specifies a custom validation function. This validation runs alongside the internal\n * file validation. This function takes a `SkyFileItem` object as a parameter.\n */\n @Input()\n public validateFn: Function;\n\n /**\n * Specifies a comma-delimited string literal of MIME types that users can attach.\n * By default, all file types are allowed.\n * @required\n */\n @Input()\n public acceptedTypes: string;\n\n /**\n * Indicates whether to disable the option to browse for files to attach.\n */\n @Input()\n public noClick = false;\n\n /**\n * Indicates whether to display the option to attach files from URLs rather than from local devices.\n */\n @Input()\n public allowLinks = false;\n\n @ViewChild('fileInput')\n public inputEl: ElementRef;\n\n public rejectedOver = false;\n public acceptedOver = false;\n public linkUrl: string;\n\n private enterEventTarget: any;\n\n constructor(private fileAttachmentService: SkyFileAttachmentService) {}\n\n public ngOnDestroy() {\n this.filesChanged.complete();\n this.linkChanged.complete();\n this.linkInputBlur.complete();\n }\n\n public dropClicked() {\n if (!this.noClick) {\n this.inputEl.nativeElement.click();\n }\n }\n\n public fileChangeEvent(fileChangeEvent: any) {\n this.handleFiles(fileChangeEvent.target.files);\n }\n\n public fileDragEnter(dragEnterEvent: any) {\n // Save this target to know when the drag event leaves\n this.enterEventTarget = dragEnterEvent.target;\n dragEnterEvent.stopPropagation();\n dragEnterEvent.preventDefault();\n }\n\n public fileDragOver(dragOverEvent: any) {\n const transfer = dragOverEvent.dataTransfer;\n\n dragOverEvent.stopPropagation();\n dragOverEvent.preventDefault();\n\n if (transfer) {\n if (transfer.items) {\n const files = transfer.items;\n\n for (let index = 0; index < files.length; index++) {\n const file: any = files[index];\n\n if (\n file.type &&\n this.fileAttachmentService.fileTypeRejected(\n file.type,\n this.acceptedTypes\n )\n ) {\n this.rejectedOver = true;\n this.acceptedOver = false;\n return;\n }\n }\n\n if (files.length > 0 && !this.acceptedOver) {\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n } /* istanbul ignore next: untestable */ else if (transfer.files) {\n // If the browser does not support DataTransfer.items,\n // defer file-type checking to drop handler.\n // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items#Browser_compatibility\n this.rejectedOver = false;\n this.acceptedOver = true;\n }\n }\n }\n\n public fileDrop(dropEvent: DragEvent): void {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n\n this.enterEventTarget = undefined;\n this.rejectedOver = false;\n this.acceptedOver = false;\n\n if (dropEvent.dataTransfer && dropEvent.dataTransfer.files) {\n const hasDirectory = this.fileAttachmentService.hasDirectory(\n dropEvent.dataTransfer.files\n );\n const invalidNumberOfFiles =\n !this.multiple && dropEvent.dataTransfer.files.length > 1;\n\n if (hasDirectory || invalidNumberOfFiles) {\n return;\n }\n\n this.handleFiles(dropEvent.dataTransfer.files);\n }\n }\n\n public fileDragLeave(dragLeaveEvent: any) {\n if (this.enterEventTarget === dragLeaveEvent.target) {\n this.rejectedOver = false;\n this.acceptedOver = false;\n }\n }\n\n public addLinkEnter(event: KeyboardEvent) {\n if (event.which === 13) {\n this.addLink(event);\n }\n }\n\n public addLink(event: Event) {\n event.preventDefault();\n this.linkChanged.emit({ url: this.linkUrl } as SkyFileLink);\n this.linkUrl = undefined;\n }\n\n public onLinkBlur(): void {\n this.linkInputBlur.emit();\n }\n\n private emitFileChangeEvent(\n totalFiles: number,\n rejectedFileArray: Array<SkyFileItem>,\n validFileArray: Array<SkyFileItem>\n ) {\n if (totalFiles === rejectedFileArray.length + validFileArray.length) {\n this.filesChanged.emit({\n files: validFileArray,\n rejectedFiles: rejectedFileArray,\n } as SkyFileDropChange);\n\n this.inputEl.nativeElement.value = '';\n }\n }\n\n private filesRejected(\n file: SkyFileItem,\n validFileArray: Array<SkyFileItem>,\n rejectedFileArray: Array<SkyFileItem>,\n totalFiles: number\n ) {\n rejectedFileArray.push(file);\n this.emitFileChangeEvent(totalFiles, rejectedFileArray, validFileArray);\n }\n\n private loadFile(\n fileDrop: SkyFileDropComponent,\n file: SkyFileItem,\n validFileArray: Array<SkyFileItem>,\n rejectedFileArray: Array<SkyFileItem>,\n totalFiles: number\n ) {\n const reader = new FileReader();\n\n reader.addEventListener('load', (event: any) => {\n file.url = event.target.result;\n validFileArray.push(file);\n fileDrop.emitFileChangeEvent(\n totalFiles,\n rejectedFileArray,\n validFileArray\n );\n });\n\n reader.addEventListener('error', (event: any) => {\n fileDrop.filesRejected(\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n });\n\n reader.addEventListener('abort', (event: any) => {\n fileDrop.filesRejected(\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n });\n\n reader.readAsDataURL(file.file);\n }\n\n private handleFiles(files: FileList) {\n const validFileArray: Array<SkyFileItem> = [];\n const rejectedFileArray: Array<SkyFileItem> = [];\n const totalFiles = files.length;\n const fileDrop = this;\n\n // tslint:disable-next-line: max-line-length\n const processedFiles = this.fileAttachmentService.checkFiles(\n files,\n this.minFileSize,\n this.maxFileSize,\n this.acceptedTypes,\n this.validateFn\n );\n\n for (const file of processedFiles) {\n if (file.errorType) {\n this.filesRejected(file, validFileArray, rejectedFileArray, totalFiles);\n } else {\n this.loadFile(\n fileDrop,\n file,\n validFileArray,\n rejectedFileArray,\n totalFiles\n );\n }\n }\n }\n}\n","<div\n class=\"sky-file-drop-row\"\n [ngClass]=\"{ 'sky-file-drop-allow-links': allowLinks }\"\n>\n <div\n class=\"sky-file-drop-col\"\n [ngClass]=\"{\n 'sky-file-drop-accept': acceptedOver,\n 'sky-file-drop-reject': rejectedOver\n }\"\n >\n <button\n class=\"sky-file-drop sky-file-drop-target\"\n type=\"button\"\n (click)=\"dropClicked()\"\n (dragover)=\"fileDragOver($event)\"\n (dragenter)=\"fileDragEnter($event)\"\n (dragleave)=\"fileDragLeave($event)\"\n (drop)=\"fileDrop($event)\"\n [attr.aria-label]=\"\n fileUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_drag_or_click' | skyLibResources)\n \"\n ></button>\n\n <input\n tabindex=\"-1\"\n aria-hidden=\"true\"\n type=\"file\"\n class=\"sky-file-input-hidden\"\n [attr.multiple]=\"multiple ? multiple : null\"\n [attr.accept]=\"acceptedTypes ? acceptedTypes : null\"\n (change)=\"fileChangeEvent($event)\"\n #fileInput\n />\n\n <div\n class=\"sky-file-drop-contents sky-padding-even-default\"\n *ngIf=\"customEl.children.length === 0\"\n >\n <div class=\"sky-file-drop-contents-not-over\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_drag_file_here' | skyLibResources\n }}\n </div>\n <div class=\"sky-file-drop-text\">\n {{\n 'skyux_file_attachment_file_upload_or_click_to_browse'\n | skyLibResources\n }}\n </div>\n <sky-icon icon=\"cloud-upload\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n\n <!-- This will appear when file is dragged over and is valid -->\n <div class=\"sky-file-drop-contents-accept\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_drop_files_here'\n | skyLibResources\n }}\n </div>\n <sky-icon icon=\"bullseye\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n\n <!-- This will appear when file is dragged over and is invalid -->\n <div class=\"sky-file-drop-contents-reject\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_invalid_file' | skyLibResources\n }}\n </div>\n <sky-icon icon=\"times-circle\" class=\"sky-file-upload-icon\"></sky-icon>\n </div>\n </div>\n\n <div class=\"sky-file-drop-contents-custom\" #customEl>\n <ng-content></ng-content>\n </div>\n </div>\n <div class=\"sky-file-drop-col\" *ngIf=\"allowLinks\">\n <div class=\"sky-file-drop-contents sky-padding-even-default\">\n <div class=\"sky-file-drop-link\">\n <div class=\"sky-file-drop-link-header\">\n <div class=\"sky-file-drop-text-header sky-headline\">\n {{\n 'skyux_file_attachment_file_upload_paste_link' | skyLibResources\n }}\n </div>\n </div>\n <div class=\"sky-form-group\">\n <input\n type=\"text\"\n class=\"sky-form-control\"\n [attr.aria-label]=\"\n linkUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_link_input' | skyLibResources)\n \"\n [attr.placeholder]=\"\n 'skyux_file_attachment_file_upload_link_placeholder'\n | skyLibResources\n \"\n [(ngModel)]=\"linkUrl\"\n (blur)=\"onLinkBlur()\"\n (keyup)=\"addLinkEnter($event)\"\n />\n </div>\n <button\n type=\"button\"\n class=\"sky-btn sky-btn-primary\"\n [disabled]=\"!linkUrl\"\n (click)=\"addLink($event)\"\n >\n {{\n 'skyux_file_attachment_file_upload_paste_link_done'\n | skyLibResources\n }}\n </button>\n </div>\n </div>\n </div>\n</div>\n"]}
|