@skyux/forms 11.9.0 → 11.11.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/documentation.json +1103 -1103
- package/esm2022/lib/modules/character-counter/character-counter-indicator.component.mjs +3 -3
- package/esm2022/lib/modules/character-counter/character-counter-screen-reader.pipe.mjs +3 -3
- package/esm2022/lib/modules/character-counter/character-counter.directive.mjs +3 -3
- package/esm2022/lib/modules/character-counter/character-counter.module.mjs +4 -4
- package/esm2022/lib/modules/checkbox/checkbox-group.component.mjs +3 -3
- package/esm2022/lib/modules/checkbox/checkbox-label-text-label.component.mjs +4 -4
- package/esm2022/lib/modules/checkbox/checkbox-label.component.mjs +3 -3
- package/esm2022/lib/modules/checkbox/checkbox.component.mjs +5 -5
- package/esm2022/lib/modules/checkbox/checkbox.module.mjs +4 -4
- package/esm2022/lib/modules/field-group/field-group.component.mjs +3 -3
- package/esm2022/lib/modules/field-group/field-group.module.mjs +4 -4
- package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment-join-ids.pipe.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment-label.component.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment.component.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment.module.mjs +4 -4
- package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment.service.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/file-attachments.module.mjs +4 -4
- package/esm2022/lib/modules/file-attachment/file-drop/file-drop.component.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/file-drop/file-drop.module.mjs +4 -4
- package/esm2022/lib/modules/file-attachment/file-drop/file-item.component.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/shared/file-item.service.mjs +3 -3
- package/esm2022/lib/modules/file-attachment/shared/file-size.pipe.mjs +3 -3
- package/esm2022/lib/modules/form-error/form-error.component.mjs +3 -3
- package/esm2022/lib/modules/form-error/form-error.module.mjs +4 -4
- package/esm2022/lib/modules/form-error/form-errors.component.mjs +3 -3
- package/esm2022/lib/modules/form-error/form-errors.module.mjs +4 -4
- package/esm2022/lib/modules/input-box/input-box-adapter.service.mjs +3 -3
- package/esm2022/lib/modules/input-box/input-box-control.directive.mjs +3 -3
- package/esm2022/lib/modules/input-box/input-box-hint-text.pipe.mjs +3 -3
- package/esm2022/lib/modules/input-box/input-box-host.service.mjs +3 -3
- package/esm2022/lib/modules/input-box/input-box.component.mjs +3 -3
- package/esm2022/lib/modules/input-box/input-box.module.mjs +4 -4
- package/esm2022/lib/modules/radio/radio-group-id.service.mjs +3 -3
- package/esm2022/lib/modules/radio/radio-group.component.mjs +3 -3
- package/esm2022/lib/modules/radio/radio-label.component.mjs +3 -3
- package/esm2022/lib/modules/radio/radio.component.mjs +4 -4
- package/esm2022/lib/modules/radio/radio.module.mjs +4 -4
- package/esm2022/lib/modules/required-state/required-state.directive.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box-adapter.service.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box-description.component.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box-grid.component.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box-header.component.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box.component.mjs +3 -3
- package/esm2022/lib/modules/selection-box/selection-box.module.mjs +4 -4
- package/esm2022/lib/modules/shared/sky-forms-resources.module.mjs +4 -4
- package/esm2022/lib/modules/toggle-switch/toggle-switch-label.component.mjs +3 -3
- package/esm2022/lib/modules/toggle-switch/toggle-switch.component.mjs +3 -3
- package/esm2022/lib/modules/toggle-switch/toggle-switch.module.mjs +4 -4
- package/fesm2022/skyux-forms.mjs +161 -161
- package/fesm2022/skyux-forms.mjs.map +1 -1
- package/package.json +14 -14
|
@@ -24,10 +24,10 @@ export class SkyCharacterCounterIndicatorComponent {
|
|
|
24
24
|
this.#_characterCountLimit = limit;
|
|
25
25
|
this.#changeDetector.markForCheck();
|
|
26
26
|
}
|
|
27
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
28
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
27
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterIndicatorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
28
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyCharacterCounterIndicatorComponent, selector: "sky-character-counter-indicator", inputs: { characterCount: "characterCount", characterCountLimit: "characterCountLimit" }, ngImport: i0, template: "<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 @if (characterCount > characterCountLimit) {\n <ng-container>{{\n 'skyux_character_count_over_limit' | skyLibResources\n }}</ng-container>\n } @else {\n @if (\n characterCount | skyCharacterCounterScreenReader: characterCountLimit;\n as screenReaderCount\n ) {\n <ng-container>{{\n 'skyux_character_count_message'\n | skyLibResources: screenReaderCount : characterCountLimit\n }}</ng-container>\n }\n }\n</span>\n", styles: [":host{flex-shrink:.0001}.sky-character-count-label.sky-error-label{margin:0}.sky-character-count-label.sky-error-label:before{font-style:normal}.sky-screen-reader-only{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2.SkyCharacterCounterScreenReaderPipe, name: "skyCharacterCounterScreenReader" }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
29
29
|
}
|
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterIndicatorComponent, decorators: [{
|
|
31
31
|
type: Component,
|
|
32
32
|
args: [{ selector: 'sky-character-counter-indicator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<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 @if (characterCount > characterCountLimit) {\n <ng-container>{{\n 'skyux_character_count_over_limit' | skyLibResources\n }}</ng-container>\n } @else {\n @if (\n characterCount | skyCharacterCounterScreenReader: characterCountLimit;\n as screenReaderCount\n ) {\n <ng-container>{{\n 'skyux_character_count_message'\n | skyLibResources: screenReaderCount : characterCountLimit\n }}</ng-container>\n }\n }\n</span>\n", styles: [":host{flex-shrink:.0001}.sky-character-count-label.sky-error-label{margin:0}.sky-character-count-label.sky-error-label:before{font-style:normal}.sky-screen-reader-only{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}\n"] }]
|
|
33
33
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { characterCount: [{
|
|
@@ -33,10 +33,10 @@ export class SkyCharacterCounterScreenReaderPipe {
|
|
|
33
33
|
}
|
|
34
34
|
return this.#previousAnnouncementPoint.toLocaleString();
|
|
35
35
|
}
|
|
36
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
37
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.
|
|
36
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterScreenReaderPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
37
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterScreenReaderPipe, isStandalone: true, name: "skyCharacterCounterScreenReader" }); }
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterScreenReaderPipe, decorators: [{
|
|
40
40
|
type: Pipe,
|
|
41
41
|
args: [{
|
|
42
42
|
name: 'skyCharacterCounterScreenReader',
|
|
@@ -67,8 +67,8 @@ export class SkyCharacterCounterInputDirective {
|
|
|
67
67
|
}
|
|
68
68
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
69
69
|
#validatorChange = () => { };
|
|
70
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
71
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.
|
|
70
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
71
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: SkyCharacterCounterInputDirective, selector: "[skyCharacterCounter]", inputs: { skyCharacterCounterIndicator: "skyCharacterCounterIndicator", skyCharacterCounterLimit: "skyCharacterCounterLimit" }, providers: [
|
|
72
72
|
{
|
|
73
73
|
provide: NG_VALIDATORS,
|
|
74
74
|
useExisting: SkyCharacterCounterInputDirective,
|
|
@@ -76,7 +76,7 @@ export class SkyCharacterCounterInputDirective {
|
|
|
76
76
|
},
|
|
77
77
|
], ngImport: i0 }); }
|
|
78
78
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterInputDirective, decorators: [{
|
|
80
80
|
type: Directive,
|
|
81
81
|
args: [{
|
|
82
82
|
selector: '[skyCharacterCounter]',
|
|
@@ -7,20 +7,20 @@ import { SkyCharacterCounterScreenReaderPipe } from './character-counter-screen-
|
|
|
7
7
|
import { SkyCharacterCounterInputDirective } from './character-counter.directive';
|
|
8
8
|
import * as i0 from "@angular/core";
|
|
9
9
|
export class SkyCharacterCounterModule {
|
|
10
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
11
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
10
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
11
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterModule, declarations: [SkyCharacterCounterInputDirective,
|
|
12
12
|
SkyCharacterCounterIndicatorComponent], imports: [CommonModule,
|
|
13
13
|
FormsModule,
|
|
14
14
|
ReactiveFormsModule,
|
|
15
15
|
SkyCharacterCounterScreenReaderPipe,
|
|
16
16
|
SkyFormsResourcesModule], exports: [SkyCharacterCounterInputDirective,
|
|
17
17
|
SkyCharacterCounterIndicatorComponent] }); }
|
|
18
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
18
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterModule, imports: [CommonModule,
|
|
19
19
|
FormsModule,
|
|
20
20
|
ReactiveFormsModule,
|
|
21
21
|
SkyFormsResourcesModule] }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCharacterCounterModule, decorators: [{
|
|
24
24
|
type: NgModule,
|
|
25
25
|
args: [{
|
|
26
26
|
declarations: [
|
|
@@ -91,8 +91,8 @@ export class SkyCheckboxGroupComponent {
|
|
|
91
91
|
this.stackedLg = !this.headingLevel && this.stacked;
|
|
92
92
|
this.stackedXL = !!this.headingLevel && this.stacked;
|
|
93
93
|
}
|
|
94
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
95
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
94
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
95
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyCheckboxGroupComponent, isStandalone: true, selector: "sky-checkbox-group", inputs: { helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", headingText: "headingText", headingHidden: ["headingHidden", "headingHidden", booleanAttribute], headingLevel: ["headingLevel", "headingLevel", numberAttribute], headingStyle: ["headingStyle", "headingStyle", numberAttribute4], hintText: "hintText", required: ["required", "required", booleanAttribute], stacked: ["stacked", "stacked", booleanAttribute], helpKey: "helpKey" }, host: { properties: { "class.sky-margin-stacked-lg": "this.stackedLg", "class.sky-margin-stacked-xl": "this.stackedXL" } }, providers: [
|
|
96
96
|
{
|
|
97
97
|
provide: NG_VALIDATORS,
|
|
98
98
|
useExisting: SkyCheckboxGroupComponent,
|
|
@@ -101,7 +101,7 @@ export class SkyCheckboxGroupComponent {
|
|
|
101
101
|
{ provide: SKY_FORM_ERRORS_ENABLED, useValue: true },
|
|
102
102
|
], ngImport: i0, template: "<fieldset\n class=\"sky-checkbox-group\"\n [attr.aria-invalid]=\"!!formGroup?.errors\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-errormessage]=\"\n headingText && formGroup?.errors ? errorId : undefined\n \"\n>\n <legend\n class=\"sky-control-label\"\n [ngClass]=\"{\n 'sky-screen-reader-only': headingHidden,\n 'sky-margin-stacked-xs': !!hintText,\n 'sky-margin-stacked-sm': !hintText\n }\"\n >\n <span\n class=\"sky-margin-inline-xs\"\n [ngClass]=\"{\n 'sky-control-label-required': required\n }\"\n >\n @switch (headingLevel) {\n @case (3) {\n <h3 [class]=\"headingClass\">{{ headingText }}</h3>\n }\n @case (4) {\n <h4 [class]=\"headingClass\">{{ headingText }}</h4>\n }\n @case (5) {\n <h5 [class]=\"headingClass\">{{ headingText }}</h5>\n }\n @default {\n <span [class]=\"'sky-checkbox-group-heading-text ' + headingClass\">{{\n headingText\n }}</span>\n }\n }\n </span>\n @if (required) {\n <span class=\"sky-screen-reader-only\">{{\n 'skyux_form_group_required' | skyLibResources\n }}</span>\n }\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n </legend>\n <div\n #hintTextEl=\"skyId\"\n skyId\n [ngClass]=\"{\n 'sky-font-deemphasized sky-margin-stacked-lg sky-checkbox-group-hint-text':\n !!hintText\n }\"\n >\n {{ hintText }}\n </div>\n <span class=\"sky-checkbox-group-inline sky-switch-icon-group\">\n <ng-content select=\"sky-checkbox[icon]\" />\n </span>\n <span class=\"sky-checkbox-group-stacked\">\n <ng-content select=\"sky-checkbox\" />\n </span>\n</fieldset>\n<sky-form-errors\n [id]=\"errorId\"\n [attr.data-sky-id]=\"formErrorsDataId\"\n [errors]=\"formGroup?.errors\"\n [labelText]=\"headingText\"\n [touched]=\"formGroup?.touched\"\n [dirty]=\"formGroup?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n</sky-form-errors>\n", styles: [":host{display:block}.sky-control-label h3,.sky-control-label h4,.sky-control-label h5{margin:0;display:inline-block}.sky-control-label span{line-height:1.1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyFormErrorsModule }, { kind: "component", type: i2.SkyFormErrorsComponent, selector: "sky-form-errors", inputs: ["errors", "labelText", "touched", "dirty"] }, { kind: "ngmodule", type: SkyFormsResourcesModule }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i4.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i5.λ2, selector: "[skyId]", exportAs: ["skyId"] }] }); }
|
|
103
103
|
}
|
|
104
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
104
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxGroupComponent, decorators: [{
|
|
105
105
|
type: Component,
|
|
106
106
|
args: [{ selector: 'sky-checkbox-group', standalone: true, imports: [
|
|
107
107
|
CommonModule,
|
|
@@ -15,12 +15,12 @@ export class SkyCheckboxLabelTextLabelComponent {
|
|
|
15
15
|
return this.#_labelText;
|
|
16
16
|
}
|
|
17
17
|
#_labelText;
|
|
18
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
19
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
18
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxLabelTextLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyCheckboxLabelTextLabelComponent, selector: "sky-checkbox-label-text-label", inputs: { labelHidden: "labelHidden", labelText: "labelText" }, ngImport: i0, template: "@if (!labelHidden) {\n <span class=\"sky-switch-label\">{{ labelText }}</span>\n}\n", styles: [".sky-switch-label:not(.sky-theme-modern *){margin-right:0}\n", ":host-context(.sky-theme-modern) .sky-switch-label{margin-right:0}\n"] }); }
|
|
20
20
|
}
|
|
21
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxLabelTextLabelComponent, decorators: [{
|
|
22
22
|
type: Component,
|
|
23
|
-
args: [{ selector: 'sky-checkbox-label-text-label', template: "@if (!labelHidden) {\n <span class=\"sky-switch-label\">{{ labelText }}</span>\n}\n", styles: [".sky-switch-label:not(.sky-theme-modern *){margin-right:0}\n", ":
|
|
23
|
+
args: [{ selector: 'sky-checkbox-label-text-label', template: "@if (!labelHidden) {\n <span class=\"sky-switch-label\">{{ labelText }}</span>\n}\n", styles: [".sky-switch-label:not(.sky-theme-modern *){margin-right:0}\n", ":host-context(.sky-theme-modern) .sky-switch-label{margin-right:0}\n"] }]
|
|
24
24
|
}], propDecorators: { labelHidden: [{
|
|
25
25
|
type: Input
|
|
26
26
|
}], labelText: [{
|
|
@@ -8,10 +8,10 @@ import * as i1 from "@skyux/core";
|
|
|
8
8
|
* @deprecated Use `labelText` input on `sky-checkbox-component` instead.
|
|
9
9
|
*/
|
|
10
10
|
export class SkyCheckboxLabelComponent {
|
|
11
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
12
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.
|
|
11
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyCheckboxLabelComponent, selector: "sky-checkbox-label", ngImport: i0, template: "<span class=\"sky-switch-label\"\n ><span skyTrim><ng-content /></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\" /></span\n></span>\n", dependencies: [{ kind: "directive", type: i1.λ4, selector: "[skyTrim]" }] }); }
|
|
13
13
|
}
|
|
14
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
14
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxLabelComponent, decorators: [{
|
|
15
15
|
type: Component,
|
|
16
16
|
args: [{ selector: 'sky-checkbox-label', template: "<span class=\"sky-switch-label\"\n ><span skyTrim><ng-content /></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\" /></span\n></span>\n" }]
|
|
17
17
|
}] });
|
|
@@ -318,8 +318,8 @@ export class SkyCheckboxComponent {
|
|
|
318
318
|
#toggle() {
|
|
319
319
|
this.checked = !this.checked;
|
|
320
320
|
}
|
|
321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
322
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
321
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
322
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyCheckboxComponent, selector: "sky-checkbox", inputs: { label: "label", labelledBy: "labelledBy", id: "id", disabled: ["disabled", "disabled", booleanAttribute], tabindex: "tabindex", name: "name", helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", icon: "icon", checkboxType: "checkboxType", checked: "checked", indeterminate: "indeterminate", required: ["required", "required", booleanAttribute], labelText: "labelText", labelHidden: ["labelHidden", "labelHidden", booleanAttribute], hintText: "hintText", stacked: ["stacked", "stacked", booleanAttribute], helpKey: "helpKey" }, outputs: { change: "change", checkedChange: "checkedChange", disabledChange: "disabledChange", indeterminateChange: "indeterminateChange" }, host: { properties: { "class.sky-margin-stacked-lg": "this.stacked" } }, providers: [
|
|
323
323
|
{ provide: NG_VALIDATORS, useExisting: SkyCheckboxComponent, multi: true },
|
|
324
324
|
{
|
|
325
325
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -327,9 +327,9 @@ export class SkyCheckboxComponent {
|
|
|
327
327
|
multi: true,
|
|
328
328
|
},
|
|
329
329
|
{ provide: SKY_FORM_ERRORS_ENABLED, useValue: true },
|
|
330
|
-
], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, read: ElementRef }], hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<span class=\"sky-checkbox-outer-wrapper\">\n <label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': isCheckboxRequired,\n 'sky-switch-disabled': disabled,\n 'sky-margin-inline-xs': labelText && !icon\n }\"\n >\n <input\n #inputEl\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]=\"isCheckboxRequired\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"labelText || label\"\n [attr.aria-labelledby]=\"labelText ? undefined : labelledBy\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-required]=\"isCheckboxRequired ? true : null\"\n [attr.aria-invalid]=\"!!control?.errors\"\n [attr.aria-errormessage]=\"\n labelText && control?.errors ? errorId : undefined\n \"\n [ngClass]=\"{\n 'sky-switch-invalid':\n (control?.touched || control?.dirty) && control?.errors\n }\"\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 @if (icon) {\n <sky-icon [fixedWidth]=\"true\" [icon]=\"icon\" />\n } @else {\n @if (indeterminate) {\n <sky-icon\n class=\"sky-checkbox-icon-indeterminate sky-checkbox-icon-modern-indeterminate\"\n icon=\"square\"\n [fixedWidth]=\"true\"\n />\n } @else if (checked) {\n <sky-icon\n class=\"sky-checkbox-icon-modern-checked\"\n icon=\"check\"\n [fixedWidth]=\"true\"\n />\n }\n }\n </span>\n\n @if (labelText) {\n <sky-checkbox-label-text-label\n [labelText]=\"labelText\"\n [labelHidden]=\"labelHidden\"\n />\n } @else {\n <ng-content select=\"sky-checkbox-label\" />\n }\n </label>\n @if ((helpPopoverContent || helpKey) && labelText) {\n <sky-help-inline\n class=\"sky-checkbox-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"labelText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n</span>\n<span #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-font-deemphasized sky-checkbox-hint-text sky-checkbox-form-margin\"\n >\n {{ hintText }}\n </div>\n }\n</span>\n<sky-form-errors\n [class.sky-checkbox-form-margin]=\"labelText && control?.errors\"\n [id]=\"errorId\"\n [errors]=\"control?.errors\"\n [labelText]=\"labelText\"\n [touched]=\"control?.touched\"\n [dirty]=\"control?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n</sky-form-errors>\n", styles: [":host.sky-cmp-theme-default{display:inline-block}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *){display:flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-help-inline{display:inline-flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-icon-indeterminate{font-size:14px}.sky-checkbox-hint-text:not(.sky-theme-modern *){margin-top:var(--sky-margin-stacked-xs)}.sky-checkbox-form-margin:not(.sky-theme-modern *){display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host.sky-margin-stacked-lg.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:inline-block}:
|
|
330
|
+
], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, read: ElementRef }], hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<span class=\"sky-checkbox-outer-wrapper\">\n <label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': isCheckboxRequired,\n 'sky-switch-disabled': disabled,\n 'sky-margin-inline-xs': labelText && !icon\n }\"\n >\n <input\n #inputEl\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]=\"isCheckboxRequired\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"labelText || label\"\n [attr.aria-labelledby]=\"labelText ? undefined : labelledBy\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-required]=\"isCheckboxRequired ? true : null\"\n [attr.aria-invalid]=\"!!control?.errors\"\n [attr.aria-errormessage]=\"\n labelText && control?.errors ? errorId : undefined\n \"\n [ngClass]=\"{\n 'sky-switch-invalid':\n (control?.touched || control?.dirty) && control?.errors\n }\"\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 @if (icon) {\n <sky-icon [fixedWidth]=\"true\" [icon]=\"icon\" />\n } @else {\n @if (indeterminate) {\n <sky-icon\n class=\"sky-checkbox-icon-indeterminate sky-checkbox-icon-modern-indeterminate\"\n icon=\"square\"\n [fixedWidth]=\"true\"\n />\n } @else if (checked) {\n <sky-icon\n class=\"sky-checkbox-icon-modern-checked\"\n icon=\"check\"\n [fixedWidth]=\"true\"\n />\n }\n }\n </span>\n\n @if (labelText) {\n <sky-checkbox-label-text-label\n [labelText]=\"labelText\"\n [labelHidden]=\"labelHidden\"\n />\n } @else {\n <ng-content select=\"sky-checkbox-label\" />\n }\n </label>\n @if ((helpPopoverContent || helpKey) && labelText) {\n <sky-help-inline\n class=\"sky-checkbox-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"labelText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n</span>\n<span #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-font-deemphasized sky-checkbox-hint-text sky-checkbox-form-margin\"\n >\n {{ hintText }}\n </div>\n }\n</span>\n<sky-form-errors\n [class.sky-checkbox-form-margin]=\"labelText && control?.errors\"\n [id]=\"errorId\"\n [errors]=\"control?.errors\"\n [labelText]=\"labelText\"\n [touched]=\"control?.touched\"\n [dirty]=\"control?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n</sky-form-errors>\n", styles: [":host.sky-cmp-theme-default{display:inline-block}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *){display:flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-help-inline{display:inline-flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-icon-indeterminate{font-size:14px}.sky-checkbox-hint-text:not(.sky-theme-modern *){margin-top:var(--sky-margin-stacked-xs)}.sky-checkbox-form-margin:not(.sky-theme-modern *){display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host.sky-margin-stacked-lg.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:inline-block}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper{display:flex}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-help-inline{display:inline-flex}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-indeterminate{font-size:14px}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-modern-checked,:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-modern-indeterminate{color:#1870b8}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-input:disabled+.sky-switch-control .sky-checkbox-icon-modern-checked,:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-input:disabled+.sky-switch-control .sky-checkbox-icon-modern-indeterminate{color:#212327}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-switch-control{border-radius:6px}:host-context(.sky-theme-modern) .sky-checkbox-hint-text{margin-top:var(--sky-margin-stacked-xs)}:host-context(.sky-theme-modern) .sky-checkbox-form-margin{display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host-context(.sky-theme-modern) :host.sky-margin-stacked-lg.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern) :host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern) :host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-modern:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.SkyFormErrorsComponent, selector: "sky-form-errors", inputs: ["errors", "labelText", "touched", "dirty"] }, { kind: "component", type: i4.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "component", type: i5.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i6.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i7.SkyCheckboxLabelTextLabelComponent, selector: "sky-checkbox-label-text-label", inputs: ["labelHidden", "labelText"] }] }); }
|
|
331
331
|
}
|
|
332
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
332
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxComponent, decorators: [{
|
|
333
333
|
type: Component,
|
|
334
334
|
args: [{ selector: 'sky-checkbox', hostDirectives: [SkyThemeComponentClassDirective], providers: [
|
|
335
335
|
{ provide: NG_VALIDATORS, useExisting: SkyCheckboxComponent, multi: true },
|
|
@@ -339,7 +339,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
|
|
|
339
339
|
multi: true,
|
|
340
340
|
},
|
|
341
341
|
{ provide: SKY_FORM_ERRORS_ENABLED, useValue: true },
|
|
342
|
-
], template: "<span class=\"sky-checkbox-outer-wrapper\">\n <label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': isCheckboxRequired,\n 'sky-switch-disabled': disabled,\n 'sky-margin-inline-xs': labelText && !icon\n }\"\n >\n <input\n #inputEl\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]=\"isCheckboxRequired\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"labelText || label\"\n [attr.aria-labelledby]=\"labelText ? undefined : labelledBy\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-required]=\"isCheckboxRequired ? true : null\"\n [attr.aria-invalid]=\"!!control?.errors\"\n [attr.aria-errormessage]=\"\n labelText && control?.errors ? errorId : undefined\n \"\n [ngClass]=\"{\n 'sky-switch-invalid':\n (control?.touched || control?.dirty) && control?.errors\n }\"\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 @if (icon) {\n <sky-icon [fixedWidth]=\"true\" [icon]=\"icon\" />\n } @else {\n @if (indeterminate) {\n <sky-icon\n class=\"sky-checkbox-icon-indeterminate sky-checkbox-icon-modern-indeterminate\"\n icon=\"square\"\n [fixedWidth]=\"true\"\n />\n } @else if (checked) {\n <sky-icon\n class=\"sky-checkbox-icon-modern-checked\"\n icon=\"check\"\n [fixedWidth]=\"true\"\n />\n }\n }\n </span>\n\n @if (labelText) {\n <sky-checkbox-label-text-label\n [labelText]=\"labelText\"\n [labelHidden]=\"labelHidden\"\n />\n } @else {\n <ng-content select=\"sky-checkbox-label\" />\n }\n </label>\n @if ((helpPopoverContent || helpKey) && labelText) {\n <sky-help-inline\n class=\"sky-checkbox-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"labelText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n</span>\n<span #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-font-deemphasized sky-checkbox-hint-text sky-checkbox-form-margin\"\n >\n {{ hintText }}\n </div>\n }\n</span>\n<sky-form-errors\n [class.sky-checkbox-form-margin]=\"labelText && control?.errors\"\n [id]=\"errorId\"\n [errors]=\"control?.errors\"\n [labelText]=\"labelText\"\n [touched]=\"control?.touched\"\n [dirty]=\"control?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n</sky-form-errors>\n", styles: [":host.sky-cmp-theme-default{display:inline-block}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *){display:flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-help-inline{display:inline-flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-icon-indeterminate{font-size:14px}.sky-checkbox-hint-text:not(.sky-theme-modern *){margin-top:var(--sky-margin-stacked-xs)}.sky-checkbox-form-margin:not(.sky-theme-modern *){display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host.sky-margin-stacked-lg.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:inline-block}:
|
|
342
|
+
], template: "<span class=\"sky-checkbox-outer-wrapper\">\n <label\n class=\"sky-checkbox-wrapper sky-switch\"\n [ngClass]=\"{\n 'sky-control-label-required': isCheckboxRequired,\n 'sky-switch-disabled': disabled,\n 'sky-margin-inline-xs': labelText && !icon\n }\"\n >\n <input\n #inputEl\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]=\"isCheckboxRequired\"\n [tabIndex]=\"tabindex\"\n [attr.aria-label]=\"labelText || label\"\n [attr.aria-labelledby]=\"labelText ? undefined : labelledBy\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-required]=\"isCheckboxRequired ? true : null\"\n [attr.aria-invalid]=\"!!control?.errors\"\n [attr.aria-errormessage]=\"\n labelText && control?.errors ? errorId : undefined\n \"\n [ngClass]=\"{\n 'sky-switch-invalid':\n (control?.touched || control?.dirty) && control?.errors\n }\"\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 @if (icon) {\n <sky-icon [fixedWidth]=\"true\" [icon]=\"icon\" />\n } @else {\n @if (indeterminate) {\n <sky-icon\n class=\"sky-checkbox-icon-indeterminate sky-checkbox-icon-modern-indeterminate\"\n icon=\"square\"\n [fixedWidth]=\"true\"\n />\n } @else if (checked) {\n <sky-icon\n class=\"sky-checkbox-icon-modern-checked\"\n icon=\"check\"\n [fixedWidth]=\"true\"\n />\n }\n }\n </span>\n\n @if (labelText) {\n <sky-checkbox-label-text-label\n [labelText]=\"labelText\"\n [labelHidden]=\"labelHidden\"\n />\n } @else {\n <ng-content select=\"sky-checkbox-label\" />\n }\n </label>\n @if ((helpPopoverContent || helpKey) && labelText) {\n <sky-help-inline\n class=\"sky-checkbox-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"labelText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n</span>\n<span #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-font-deemphasized sky-checkbox-hint-text sky-checkbox-form-margin\"\n >\n {{ hintText }}\n </div>\n }\n</span>\n<sky-form-errors\n [class.sky-checkbox-form-margin]=\"labelText && control?.errors\"\n [id]=\"errorId\"\n [errors]=\"control?.errors\"\n [labelText]=\"labelText\"\n [touched]=\"control?.touched\"\n [dirty]=\"control?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n</sky-form-errors>\n", styles: [":host.sky-cmp-theme-default{display:inline-block}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *){display:flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-help-inline{display:inline-flex}.sky-checkbox-outer-wrapper:not(.sky-theme-modern *) .sky-checkbox-icon-indeterminate{font-size:14px}.sky-checkbox-hint-text:not(.sky-theme-modern *){margin-top:var(--sky-margin-stacked-xs)}.sky-checkbox-form-margin:not(.sky-theme-modern *){display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host.sky-margin-stacked-lg.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default{display:block}:host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-default:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:inline-block}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper{display:flex}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-help-inline{display:inline-flex}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-indeterminate{font-size:14px}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-modern-checked,:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-icon-modern-indeterminate{color:#1870b8}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-input:disabled+.sky-switch-control .sky-checkbox-icon-modern-checked,:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-checkbox-input:disabled+.sky-switch-control .sky-checkbox-icon-modern-indeterminate{color:#212327}:host-context(.sky-theme-modern) .sky-checkbox-outer-wrapper .sky-switch-control{border-radius:6px}:host-context(.sky-theme-modern) .sky-checkbox-hint-text{margin-top:var(--sky-margin-stacked-xs)}:host-context(.sky-theme-modern) .sky-checkbox-form-margin{display:block;margin-left:calc(var(--sky-switch-size) + var(--sky-switch-margin))}:host-context(.sky-theme-modern) :host.sky-margin-stacked-lg.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern) :host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern) :host-context(sky-checkbox-group .sky-checkbox-group-stacked) :host.sky-cmp-theme-modern:not(:last-child){margin-bottom:var(--sky-margin-stacked-sm)}\n"] }]
|
|
343
343
|
}], ctorParameters: () => [], propDecorators: { label: [{
|
|
344
344
|
type: Input
|
|
345
345
|
}], labelledBy: [{
|
|
@@ -13,8 +13,8 @@ import { SkyCheckboxLabelComponent } from './checkbox-label.component';
|
|
|
13
13
|
import { SkyCheckboxComponent } from './checkbox.component';
|
|
14
14
|
import * as i0 from "@angular/core";
|
|
15
15
|
export class SkyCheckboxModule {
|
|
16
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
17
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
16
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
17
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxModule, declarations: [SkyCheckboxComponent,
|
|
18
18
|
SkyCheckboxLabelComponent,
|
|
19
19
|
SkyCheckboxLabelTextLabelComponent], imports: [CommonModule,
|
|
20
20
|
FormsModule,
|
|
@@ -29,7 +29,7 @@ export class SkyCheckboxModule {
|
|
|
29
29
|
SkyCheckboxLabelComponent,
|
|
30
30
|
SkyCheckboxGroupComponent,
|
|
31
31
|
SkyFormErrorModule] }); }
|
|
32
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
32
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxModule, imports: [CommonModule,
|
|
33
33
|
FormsModule,
|
|
34
34
|
SkyCheckboxGroupComponent,
|
|
35
35
|
SkyFormErrorModule,
|
|
@@ -40,7 +40,7 @@ export class SkyCheckboxModule {
|
|
|
40
40
|
SkyIdModule,
|
|
41
41
|
SkyTrimModule, SkyFormErrorModule] }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyCheckboxModule, decorators: [{
|
|
44
44
|
type: NgModule,
|
|
45
45
|
args: [{
|
|
46
46
|
declarations: [
|
|
@@ -37,10 +37,10 @@ export class SkyFieldGroupComponent {
|
|
|
37
37
|
set headingStyle(value) {
|
|
38
38
|
this.headingClass = `sky-font-heading-${value}`;
|
|
39
39
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
41
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
41
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyFieldGroupComponent, isStandalone: true, selector: "sky-field-group", inputs: { headingText: "headingText", hintText: "hintText", headingHidden: ["headingHidden", "headingHidden", booleanAttribute], stacked: ["stacked", "stacked", booleanAttribute], headingLevel: ["headingLevel", "headingLevel", numberAttribute3], headingStyle: ["headingStyle", "headingStyle", numberAttribute3], helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", helpKey: "helpKey" }, host: { properties: { "class.sky-margin-stacked-xl": "this.stacked" } }, ngImport: i0, template: "<fieldset\n class=\"sky-field-group\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n>\n <legend\n class=\"sky-control-label\"\n [ngClass]=\"{\n 'sky-screen-reader-only': headingHidden,\n 'sky-margin-stacked-xs': !!hintText,\n 'sky-margin-stacked-sm': !hintText\n }\"\n >\n <span class=\"sky-margin-inline-xs\">\n @switch (headingLevel) {\n @case (4) {\n <h4 [class]=\"headingClass\">{{ headingText }}</h4>\n }\n @default {\n <h3 [class]=\"headingClass\">{{ headingText }}</h3>\n }\n }\n </span>\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n class=\"sky-field-group-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n </legend>\n <div #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-field-group-hint-text sky-margin-stacked-lg sky-font-deemphasized\"\n >\n {{ hintText }}\n </div>\n }\n </div>\n <div class=\"sky-field-group-content\">\n <ng-content />\n </div>\n</fieldset>\n", styles: [":host{display:block}legend{display:flex}legend h3,legend h4{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i2.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }] }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
45
|
args: [{ selector: 'sky-field-group', standalone: true, imports: [CommonModule, SkyHelpInlineModule, SkyIdModule], template: "<fieldset\n class=\"sky-field-group\"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n>\n <legend\n class=\"sky-control-label\"\n [ngClass]=\"{\n 'sky-screen-reader-only': headingHidden,\n 'sky-margin-stacked-xs': !!hintText,\n 'sky-margin-stacked-sm': !hintText\n }\"\n >\n <span class=\"sky-margin-inline-xs\">\n @switch (headingLevel) {\n @case (4) {\n <h4 [class]=\"headingClass\">{{ headingText }}</h4>\n }\n @default {\n <h3 [class]=\"headingClass\">{{ headingText }}</h3>\n }\n }\n </span>\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n class=\"sky-field-group-help-inline\"\n [helpKey]=\"helpKey\"\n [labelText]=\"headingText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n </legend>\n <div #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div\n class=\"sky-field-group-hint-text sky-margin-stacked-lg sky-font-deemphasized\"\n >\n {{ hintText }}\n </div>\n }\n </div>\n <div class=\"sky-field-group-content\">\n <ng-content />\n </div>\n</fieldset>\n", styles: [":host{display:block}legend{display:flex}legend h3,legend h4{margin:0}\n"] }]
|
|
46
46
|
}], propDecorators: { headingText: [{
|
|
@@ -2,11 +2,11 @@ import { NgModule } from '@angular/core';
|
|
|
2
2
|
import { SkyFieldGroupComponent } from './field-group.component';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export class SkyFieldGroupModule {
|
|
5
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
6
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
7
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
5
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
6
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupModule, imports: [SkyFieldGroupComponent], exports: [SkyFieldGroupComponent] }); }
|
|
7
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupModule, imports: [SkyFieldGroupComponent] }); }
|
|
8
8
|
}
|
|
9
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFieldGroupModule, decorators: [{
|
|
10
10
|
type: NgModule,
|
|
11
11
|
args: [{
|
|
12
12
|
imports: [SkyFieldGroupComponent],
|
package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment-join-ids.pipe.mjs
CHANGED
|
@@ -9,10 +9,10 @@ export class SkyFileAttachmentJoinIdsPipe {
|
|
|
9
9
|
// Remove undefined values and join with a " ".
|
|
10
10
|
return ids && ids.filter((id) => id).join(' ');
|
|
11
11
|
}
|
|
12
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
13
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.
|
|
12
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentJoinIdsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
13
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentJoinIdsPipe, isStandalone: true, name: "skyFileAttachmentJoinIds" }); }
|
|
14
14
|
}
|
|
15
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
15
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentJoinIdsPipe, decorators: [{
|
|
16
16
|
type: Pipe,
|
|
17
17
|
args: [{
|
|
18
18
|
name: 'skyFileAttachmentJoinIds',
|
package/esm2022/lib/modules/file-attachment/file-attachment/file-attachment-label.component.mjs
CHANGED
|
@@ -18,10 +18,10 @@ export class SkyFileAttachmentLabelComponent {
|
|
|
18
18
|
'on the `sky-file-attachment` component instead.',
|
|
19
19
|
});
|
|
20
20
|
}
|
|
21
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
22
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.
|
|
21
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
22
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyFileAttachmentLabelComponent, isStandalone: true, selector: "sky-file-attachment-label", viewQueries: [{ propertyName: "labelContentId", first: true, predicate: ["labelContentId"], descendants: true }], ngImport: i0, template: "<span class=\"sky-control-label\"\n ><span #labelContentId=\"skyId\" skyId skyTrim><ng-content /></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\" /></span\n></span>\n", styles: [":host-context(.sky-theme-modern) .sky-control-label{color:#686c73;font-size:13px}.sky-theme-modern .sky-control-label{color:#686c73;font-size:13px}\n"], dependencies: [{ kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyTrimModule }, { kind: "directive", type: i1.λ4, selector: "[skyTrim]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23
23
|
}
|
|
24
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
24
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentLabelComponent, decorators: [{
|
|
25
25
|
type: Component,
|
|
26
26
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [SkyIdModule, SkyTrimModule], selector: 'sky-file-attachment-label', standalone: true, template: "<span class=\"sky-control-label\"\n ><span #labelContentId=\"skyId\" skyId skyTrim><ng-content /></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\" /></span\n></span>\n", styles: [":host-context(.sky-theme-modern) .sky-control-label{color:#686c73;font-size:13px}.sky-theme-modern .sky-control-label{color:#686c73;font-size:13px}\n"] }]
|
|
27
27
|
}], ctorParameters: () => [], propDecorators: { labelContentId: [{
|
|
@@ -401,13 +401,13 @@ export class SkyFileAttachmentComponent {
|
|
|
401
401
|
// istanbul ignore next
|
|
402
402
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
403
403
|
#onTouched;
|
|
404
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
405
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
404
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyFileAttachmentService }, { token: i2.SkyFileItemService }, { token: i3.NgControl, optional: true, self: true }, { token: i4.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
405
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyFileAttachmentComponent, isStandalone: true, selector: "sky-file-attachment", inputs: { acceptedTypes: "acceptedTypes", acceptedTypesErrorMessage: "acceptedTypesErrorMessage", disabled: ["disabled", "disabled", booleanAttribute], helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", helpKey: "helpKey", labelText: "labelText", labelHidden: ["labelHidden", "labelHidden", booleanAttribute], hintText: "hintText", maxFileSize: "maxFileSize", minFileSize: "minFileSize", stacked: ["stacked", "stacked", booleanAttribute], validateFn: "validateFn", required: ["required", "required", booleanAttribute] }, outputs: { fileChange: "fileChange", fileClick: "fileClick" }, host: { properties: { "class.sky-margin-stacked-lg": "this.stacked" } }, providers: [
|
|
406
406
|
SkyFileAttachmentService,
|
|
407
407
|
{ provide: SKY_FORM_ERRORS_ENABLED, useValue: true },
|
|
408
408
|
], queries: [{ propertyName: "labelComponents", predicate: SkyFileAttachmentLabelComponent }], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["fileInputRef"], descendants: true }], ngImport: i0, template: "<div class=\"sky-file-attachment-wrapper\">\n <div\n class=\"sky-file-attachment-label-wrapper\"\n [ngClass]=\"{\n 'sky-control-label-required':\n !labelText && isRequired && hasLabelComponent\n }\"\n >\n @if (labelText) {\n @if (!labelHidden) {\n <span\n class=\"sky-control-label sky-margin-inline-xs\"\n [attr.id]=\"labelId\"\n [ngClass]=\"{\n 'sky-control-label-required': isRequired\n }\"\n >{{ labelText }}</span\n >\n }\n } @else {\n <ng-content select=\"sky-file-attachment-label\" />\n }\n @if (isRequired && (hasLabelComponent || labelText)) {\n <span class=\"sky-screen-reader-only\">{{\n 'skyux_file_attachment_required' | skyLibResources\n }}</span>\n }\n @if (labelText && (helpPopoverContent || helpKey)) {\n <sky-help-inline\n [labelText]=\"labelText\"\n [helpKey]=\"helpKey\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n </div>\n <div\n class=\"sky-file-attachment-upload sky-file-attachment sky-file-attachment-target\"\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 #fileDropDescriptionRef=\"skyId\"\n aria-hidden=\"true\"\n class=\"sky-screen-reader-only\"\n role=\"tooltip\"\n skyId\n >\n {{ 'skyux_file_attachment_file_upload_drag_or_click' | skyLibResources }}\n </div>\n <input\n #fileInputRef\n hidden\n tabindex=\"-1\"\n type=\"file\"\n [attr.accept]=\"acceptedTypes || null\"\n [disabled]=\"disabled\"\n [required]=\"isRequired\"\n (change)=\"fileChangeEvent($event)\"\n />\n @if (showFileAttachmentButton) {\n <button\n class=\"sky-file-attachment-btn sky-btn sky-btn-default\"\n type=\"button\"\n [attr.aria-describedby]=\"\n hintText && hintTextEl.id\n | skyFileAttachmentJoinIds: fileDropDescriptionRef.id\n \"\n [attr.aria-labelledby]=\"\n attachButtonLabelRef.id\n | skyFileAttachmentJoinIds\n : (labelText\n ? labelId\n : labelComponents?.get(0)?.labelContentId?.id)\n \"\n [attr.aria-invalid]=\"!!(ngControl?.errors ?? fileErrorValidation)\"\n [attr.aria-errormessage]=\"\n !!(ngControl?.errors ?? fileErrorValidation) ? errorId : undefined\n \"\n [disabled]=\"disabled\"\n (click)=\"onDropClicked()\"\n >\n <sky-icon icon=\"folder-open-o\" />\n {{\n value\n ? ('skyux_file_attachment_button_label_replace_file'\n | skyLibResources)\n : ('skyux_file_attachment_button_label_choose_file'\n | skyLibResources)\n }}\n </button>\n }\n @if (value && !isImage && currentThemeName === 'modern') {\n <sky-icon\n class=\"sky-file-attachment-icon sky-deemphasized\"\n icon=\"file-o\"\n size=\"2x\"\n />\n }\n @if (value || currentThemeName === 'default') {\n <span class=\"sky-file-attachment-file-link\">\n @if (value) {\n <a\n [href]=\"isData ? value.url : undefined\"\n [download]=\"isData ? value.file.name : undefined\"\n [attr.title]=\"fileName\"\n (click)=\"emitClick()\"\n >\n {{ truncatedFileName }}\n </a>\n } @else {\n <span class=\"sky-file-attachment-none sky-deemphasized\">\n {{ 'skyux_file_attachment_label_no_file_chosen' | skyLibResources }}\n </span>\n }\n </span>\n }\n\n @if (value) {\n <button\n class=\"sky-btn sky-btn-borderless sky-file-attachment-delete\"\n type=\"button\"\n [attr.aria-labelledby]=\"\n deleteButtonLabelRef.id\n | skyFileAttachmentJoinIds\n : (labelText\n ? labelId\n : labelComponents?.get(0)?.labelContentId?.id)\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\" />\n </button>\n }\n </div>\n\n @if (value && isImage) {\n <img\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 }\n</div>\n<div #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div class=\"sky-font-deemphasized sky-file-attachment-hint-text\">\n {{ hintText }}\n </div>\n }\n</div>\n\n<sky-form-errors\n [id]=\"errorId\"\n [errors]=\"ngControl?.errors ?? fileErrorValidation\"\n [labelText]=\"labelText\"\n [touched]=\"ngControl?.touched\"\n [dirty]=\"ngControl?.dirty\"\n>\n <ng-content select=\"sky-form-error\" />\n @if (ngControl?.touched) {\n @if (fileErrorName === 'fileType') {\n <sky-form-error\n [errorName]=\"'fileType'\"\n [errorText]=\"\n acceptedTypesErrorMessage ??\n 'skyux_file_attachment_file_type_error_label_text'\n | skyLibResources: fileErrorParam\n \"\n />\n } @else if (fileErrorName === 'maxFileSize') {\n <sky-form-error\n [errorName]=\"'maxFileSize'\"\n [errorText]=\"\n 'skyux_file_attachment_max_file_size_error_label_text'\n | skyLibResources: (fileErrorParam | skyFileSize)\n \"\n />\n } @else if (fileErrorName === 'minFileSize') {\n <sky-form-error\n [errorName]=\"'minFileSize'\"\n [errorText]=\"\n 'skyux_file_attachment_min_file_size_error_label_text'\n | skyLibResources: (fileErrorParam | skyFileSize)\n \"\n />\n }\n }\n</sky-form-errors>\n\n<span\n #attachButtonLabelRef=\"skyId\"\n aria-hidden=\"true\"\n class=\"sky-screen-reader-only\"\n skyId\n>\n {{\n value\n ? ('skyux_file_attachment_button_label_replace_file_label'\n | skyLibResources: fileName)\n : ('skyux_file_attachment_button_label_choose_file_label'\n | skyLibResources)\n }}\n</span>\n\n<span\n #deleteButtonLabelRef=\"skyId\"\n aria-hidden=\"true\"\n class=\"sky-screen-reader-only\"\n skyId\n>\n {{ 'skyux_file_attachment_file_item_remove' | skyLibResources: fileName }}\n</span>\n", styles: [":host.sky-margin-stacked-lg{display:block}.sky-file-attachment-wrapper{display:inline-block}.sky-file-attachment-upload{padding-right:8px;display:block;border:1px solid transparent}.sky-file-attachment-accept{border-color:#72bf44;border-style:dashed;border-width:1px;border-radius:5px;color:#212327}.sky-file-attachment-reject{border-color:#ef4044;border-style:dashed;border-width:1px;border-radius:5px;color:#212327}:host(.ng-invalid.ng-dirty) .sky-file-attachment-btn{box-shadow:0 0 8px #ef404499;border:1px solid #ef4044}.sky-file-attachment-file-link{padding:0 5px}.sky-file-attachment-file-link a{cursor:pointer}.sky-file-attachment-delete{border:none;color:#cdcfd2;cursor:pointer;padding:0}.sky-file-attachment-delete:hover{color:#979ba2;transition:color .15s}.sky-file-attachment-preview-img{max-width:25%;height:auto;box-shadow:0 0 5px #666;margin:10px}.sky-file-attachment-hint-text{margin-top:var(--sky-margin-stacked-xs)}:host-context(.sky-theme-modern) .sky-control-label{color:#686c73;font-size:13px}:host-context(.sky-theme-modern) .sky-file-attachment-none{font-size:13px}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper{display:flex;flex-wrap:wrap}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-label-wrapper{width:100%}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-preview-img{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;box-shadow:none;margin:0 10px 0 0;width:100px;flex:0;order:1}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-btn{margin:0 10px 0 0}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-icon{margin:5px 10px 5px 5px}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-upload{flex:1;order:2;display:flex;align-items:flex-start}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-upload .sky-file-attachment-file-link{margin:10px 10px 0 0;padding:0}:host-context(.sky-theme-modern) .sky-file-attachment-wrapper .sky-file-attachment-delete{width:40px;height:40px;color:#686c73!important}.sky-theme-modern .sky-control-label{color:#686c73;font-size:13px}.sky-theme-modern .sky-file-attachment-none{font-size:13px}.sky-theme-modern .sky-file-attachment-wrapper{display:flex;flex-wrap:wrap}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-label-wrapper{width:100%}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-preview-img{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;box-shadow:none;margin:0 10px 0 0;width:100px;flex:0;order:1}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-btn{margin:0 10px 0 0}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-icon{margin:5px 10px 5px 5px}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-upload{flex:1;order:2;display:flex;align-items:flex-start}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-upload .sky-file-attachment-file-link{margin:10px 10px 0 0;padding:0}.sky-theme-modern .sky-file-attachment-wrapper .sky-file-attachment-delete{width:40px;height:40px;color:#686c73!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SkyFileAttachmentJoinIdsPipe, name: "skyFileAttachmentJoinIds" }, { kind: "pipe", type: SkyFileSizePipe, name: "skyFileSize" }, { kind: "component", type: SkyFormErrorComponent, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: SkyFormErrorsComponent, selector: "sky-form-errors", inputs: ["errors", "labelText", "touched", "dirty"] }, { kind: "ngmodule", type: SkyFormsResourcesModule }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i7.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i8.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i9.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "directive", type: i4.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
409
409
|
}
|
|
410
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
410
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentComponent, decorators: [{
|
|
411
411
|
type: Component,
|
|
412
412
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
413
413
|
CommonModule,
|
|
@@ -4,13 +4,13 @@ import { SkyFileAttachmentLabelComponent } from './file-attachment-label.compone
|
|
|
4
4
|
import { SkyFileAttachmentComponent } from './file-attachment.component';
|
|
5
5
|
import * as i0 from "@angular/core";
|
|
6
6
|
export class SkyFileAttachmentModule {
|
|
7
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
8
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
7
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
8
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentModule, imports: [SkyFileAttachmentComponent, SkyFileAttachmentLabelComponent], exports: [SkyFileAttachmentComponent,
|
|
9
9
|
SkyFileAttachmentLabelComponent,
|
|
10
10
|
SkyFormErrorModule] }); }
|
|
11
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
11
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentModule, imports: [SkyFileAttachmentComponent, SkyFileAttachmentLabelComponent, SkyFormErrorModule] }); }
|
|
12
12
|
}
|
|
13
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
13
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentModule, decorators: [{
|
|
14
14
|
type: NgModule,
|
|
15
15
|
args: [{
|
|
16
16
|
exports: [
|
|
@@ -94,10 +94,10 @@ export class SkyFileAttachmentService {
|
|
|
94
94
|
#getMimeMainType(type) {
|
|
95
95
|
return type.substr(0, type.indexOf('/'));
|
|
96
96
|
}
|
|
97
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
98
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.
|
|
97
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
98
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentService }); }
|
|
99
99
|
}
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentService, decorators: [{
|
|
101
101
|
type: Injectable
|
|
102
102
|
}] });
|
|
103
103
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsZS1hdHRhY2htZW50LnNlcnZpY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvZm9ybXMvc3JjL2xpYi9tb2R1bGVzL2ZpbGUtYXR0YWNobWVudC9maWxlLWF0dGFjaG1lbnQvZmlsZS1hdHRhY2htZW50LnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFLM0M7O0dBRUc7QUFFSCxNQUFNLE9BQU8sd0JBQXdCO0lBQzVCLFVBQVUsQ0FDZixLQUFlLEVBQ2YsV0FBbUIsRUFDbkIsV0FBbUIsRUFDbkIsYUFBc0IsRUFDdEIsVUFBOEI7UUFFOUIsTUFBTSxXQUFXLEdBQWtCLEVBQUUsQ0FBQztRQUV0QyxLQUFLLElBQUksS0FBSyxHQUFHLENBQUMsRUFBRSxLQUFLLEdBQUcsS0FBSyxDQUFDLE1BQU0sRUFBRSxLQUFLLEVBQUUsRUFBRSxDQUFDO1lBQ2xELE1BQU0sUUFBUSxHQUFHO2dCQUNmLElBQUksRUFBRSxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQzthQUNULENBQUM7WUFFakIsSUFBSSxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksR0FBRyxXQUFXLEVBQUUsQ0FBQztnQkFDckMsUUFBUSxDQUFDLFNBQVMsR0FBRyxhQUFhLENBQUM7Z0JBQ25DLFFBQVEsQ0FBQyxVQUFVLEdBQUcsV0FBVyxDQUFDLFFBQVEsRUFBRSxDQUFDO2dCQUM3QyxXQUFXLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQzdCLENBQUM7aUJBQU0sSUFBSSxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksR0FBRyxXQUFXLEVBQUUsQ0FBQztnQkFDNUMsUUFBUSxDQUFDLFNBQVMsR0FBRyxhQUFhLENBQUM7Z0JBQ25DLFFBQVEsQ0FBQyxVQUFVLEdBQUcsV0FBVyxDQUFDLFFBQVEsRUFBRSxDQUFDO2dCQUM3QyxXQUFXLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQzdCLENBQUM7aUJBQU0sSUFBSSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsYUFBYSxDQUFDLEVBQUUsQ0FBQztnQkFDcEUsUUFBUSxDQUFDLFNBQVMsR0FBRyxVQUFVLENBQUM7Z0JBQ2hDLFFBQVEsQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLHFCQUFxQixDQUFDLGFBQWEsQ0FBQyxDQUFDO2dCQUNoRSxXQUFXLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQzdCLENBQUM7aUJBQU0sSUFBSSxVQUFVLEVBQUUsQ0FBQztnQkFDdEIsTUFBTSxVQUFVLEdBQUcsVUFBVSxDQUFDLFFBQVEsQ0FBQyxDQUFDO2dCQUV4QyxJQUFJLFVBQVUsRUFBRSxDQUFDO29CQUNmLFFBQVEsQ0FBQyxTQUFTLEdBQUcsVUFBVSxDQUFDO29CQUNoQyxRQUFRLENBQUMsVUFBVSxHQUFHLFVBQVUsQ0FBQztnQkFDbkMsQ0FBQztnQkFDRCxXQUFXLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQzdCLENBQUM7aUJBQU0sQ0FBQztnQkFDTixXQUFXLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1lBQzdCLENBQUM7UUFDSCxDQUFDO1FBQ0QsT0FBTyxXQUFXLENBQUM7SUFDckIsQ0FBQztJQUVEOztPQUVHO0lBQ0ksWUFBWSxDQUFDLEtBQWU7UUFDakMsS0FBSyxJQUFJLEtBQUssR0FBRyxDQUFDLEVBQUUsS0FBSyxHQUFHLEtBQUssQ0FBQyxNQUFNLEVBQUUsS0FBSyxFQUFFLEVBQUUsQ0FBQztZQUNsRCxNQUFNLElBQUksR0FBUSxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQ3BDLElBQ0UsSUFBSSxDQUFDLGdCQUFnQjtnQkFDckIsSUFBSSxDQUFDLGdCQUFnQixFQUFFO2dCQUN2QixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQyxXQUFXLEVBQ25DLENBQUM7Z0JBQ0QsT0FBTyxJQUFJLENBQUM7WUFDZCxDQUFDO1FBQ0gsQ0FBQztRQUVELE9BQU8sS0FBSyxDQUFDO0lBQ2YsQ0FBQztJQUVNLGdCQUFnQixDQUFDLFFBQWdCLEVBQUUsYUFBc0I7UUFDOUQsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQ25CLE9BQU8sS0FBSyxDQUFDO1FBQ2YsQ0FBQztRQUVELElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUNkLE9BQU8sSUFBSSxDQUFDO1FBQ2QsQ0FBQztRQUVELE1BQU0sa0JBQWtCLEdBQUcsYUFBYSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ3ZELE1BQU0sU0FBUyxHQUFHLGtCQUFrQixDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUVoRCxPQUFPLENBQUMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFNBQVMsRUFBRSxRQUFRLENBQUMsV0FBVyxFQUFFLENBQUMsQ0FBQztJQUNuRSxDQUFDO0lBRUQsZ0JBQWdCLENBQUMsU0FBbUIsRUFBRSxRQUFnQjtRQUNwRCxJQUFJLFNBQVMsQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsQ0FBQztZQUN2QyxPQUFPLElBQUksQ0FBQztRQUNkLENBQUM7UUFFRCxLQUFLLE1BQU0sSUFBSSxJQUFJLFNBQVMsRUFBRSxDQUFDO1lBQzdCLE1BQU0sWUFBWSxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLENBQUM7WUFFaEQsSUFBSSxZQUFZLEtBQUssR0FBRyxFQUFFLENBQUM7Z0JBQ3pCLElBQUksSUFBSSxDQUFDLGdCQUFnQixDQUFDLElBQUksQ0FBQyxLQUFLLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxRQUFRLENBQUMsRUFBRSxDQUFDO29CQUNwRSxPQUFPLElBQUksQ0FBQztnQkFDZCxDQUFDO1lBQ0gsQ0FBQztRQUNILENBQUM7UUFFRCxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7SUFFRCxxQkFBcUIsQ0FBQyxRQUE0QjtRQUNoRCxPQUFPLFFBQVE7WUFDYixFQUFFLFdBQVcsRUFBRTthQUNkLEtBQUssQ0FBQyxHQUFHLENBQUM7YUFDVixHQUFHLENBQUMsQ0FBQyxJQUFJLEVBQUUsRUFBRTtZQUNaLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDM0MsT0FBTyxPQUFPLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUM7UUFDaEUsQ0FBQyxDQUFDO2FBQ0QsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2hCLENBQUM7SUFFRCxlQUFlLENBQUMsSUFBWTtRQUMxQixPQUFPLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsR0FBRyxDQUFDLEVBQUUsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ3pELENBQUM7SUFFRCxnQkFBZ0IsQ0FBQyxJQUFZO1FBQzNCLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDO0lBQzNDLENBQUM7OEdBOUdVLHdCQUF3QjtrSEFBeEIsd0JBQXdCOzsyRkFBeEIsd0JBQXdCO2tCQURwQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBTa3lGaWxlSXRlbSB9IGZyb20gJy4uL3NoYXJlZC9maWxlLWl0ZW0nO1xuaW1wb3J0IHsgU2t5RmlsZVZhbGlkYXRlRm4gfSBmcm9tICcuLi9zaGFyZWQvZmlsZS12YWxpZGF0ZS1mdW5jdGlvbic7XG5cbi8qKlxuICogQGludGVybmFsXG4gKi9cbkBJbmplY3RhYmxlKClcbmV4cG9ydCBjbGFzcyBTa3lGaWxlQXR0YWNobWVudFNlcnZpY2Uge1xuICBwdWJsaWMgY2hlY2tGaWxlcyhcbiAgICBmaWxlczogRmlsZUxpc3QsXG4gICAgbWluRmlsZVNpemU6IG51bWJlcixcbiAgICBtYXhGaWxlU2l6ZTogbnVtYmVyLFxuICAgIGFjY2VwdGVkVHlwZXM/OiBzdHJpbmcsXG4gICAgdmFsaWRhdGVGbj86IFNreUZpbGVWYWxpZGF0ZUZuLFxuICApOiBTa3lGaWxlSXRlbVtdIHtcbiAgICBjb25zdCBmaWxlUmVzdWx0czogU2t5RmlsZUl0ZW1bXSA9IFtdO1xuXG4gICAgZm9yIChsZXQgaW5kZXggPSAwOyBpbmRleCA8IGZpbGVzLmxlbmd0aDsgaW5kZXgrKykge1xuICAgICAgY29uc3QgZmlsZUl0ZW0gPSB7XG4gICAgICAgIGZpbGU6IGZpbGVzLml0ZW0oaW5kZXgpLFxuICAgICAgfSBhcyBTa3lGaWxlSXRlbTtcblxuICAgICAgaWYgKGZpbGVJdGVtLmZpbGUuc2l6ZSA8IG1pbkZpbGVTaXplKSB7XG4gICAgICAgIGZpbGVJdGVtLmVycm9yVHlwZSA9ICdtaW5GaWxlU2l6ZSc7XG4gICAgICAgIGZpbGVJdGVtLmVycm9yUGFyYW0gPSBtaW5GaWxlU2l6ZS50b1N0cmluZygpO1xuICAgICAgICBmaWxlUmVzdWx0cy5wdXNoKGZpbGVJdGVtKTtcbiAgICAgIH0gZWxzZSBpZiAoZmlsZUl0ZW0uZmlsZS5zaXplID4gbWF4RmlsZVNpemUpIHtcbiAgICAgICAgZmlsZUl0ZW0uZXJyb3JUeXBlID0gJ21heEZpbGVTaXplJztcbiAgICAgICAgZmlsZUl0ZW0uZXJyb3JQYXJhbSA9IG1heEZpbGVTaXplLnRvU3RyaW5nKCk7XG4gICAgICAgIGZpbGVSZXN1bHRzLnB1c2goZmlsZUl0ZW0pO1xuICAgICAgfSBlbHNlIGlmICh0aGlzLmZpbGVUeXBlUmVqZWN0ZWQoZmlsZUl0ZW0uZmlsZS50eXBlLCBhY2NlcHRlZFR5cGVzKSkge1xuICAgICAgICBmaWxlSXRlbS5lcnJvclR5cGUgPSAnZmlsZVR5cGUnO1xuICAgICAgICBmaWxlSXRlbS5lcnJvclBhcmFtID0gdGhpcy4jZ2V0QWNjZXB0ZWRUeXBlc0xpc3QoYWNjZXB0ZWRUeXBlcyk7XG4gICAgICAgIGZpbGVSZXN1bHRzLnB1c2goZmlsZUl0ZW0pO1xuICAgICAgfSBlbHNlIGlmICh2YWxpZGF0ZUZuKSB7XG4gICAgICAgIGNvbnN0IGVycm9yUGFyYW0gPSB2YWxpZGF0ZUZuKGZpbGVJdGVtKTtcblxuICAgICAgICBpZiAoZXJyb3JQYXJhbSkge1xuICAgICAgICAgIGZpbGVJdGVtLmVycm9yVHlwZSA9ICd2YWxpZGF0ZSc7XG4gICAgICAgICAgZmlsZUl0ZW0uZXJyb3JQYXJhbSA9IGVycm9yUGFyYW07XG4gICAgICAgIH1cbiAgICAgICAgZmlsZVJlc3VsdHMucHVzaChmaWxlSXRlbSk7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBmaWxlUmVzdWx0cy5wdXNoKGZpbGVJdGVtKTtcbiAgICAgIH1cbiAgICB9XG4gICAgcmV0dXJuIGZpbGVSZXN1bHRzO1xuICB9XG5cbiAgLyoqXG4gICAqIFJldHVybnMgYHRydWVgIGlmIGEgZGlyZWN0b3J5IGlzIGZvdW5kIGluIHRoZSBwcm92aWRlZCBgZmlsZXNgIHBhcmFtZXRlci5cbiAgICovXG4gIHB1YmxpYyBoYXNEaXJlY3RvcnkoZmlsZXM6IEZpbGVMaXN0KTogYm9vbGVhbiB7XG4gICAgZm9yIChsZXQgaW5kZXggPSAwOyBpbmRleCA8IGZpbGVzLmxlbmd0aDsgaW5kZXgrKykge1xuICAgICAgY29uc3QgZmlsZTogYW55ID0gZmlsZXMuaXRlbShpbmRleCk7XG4gICAgICBpZiAoXG4gICAgICAgIGZpbGUud2Via2l0R2V0QXNFbnRyeSAmJlxuICAgICAgICBmaWxlLndlYmtpdEdldEFzRW50cnkoKSAmJlxuICAgICAgICBmaWxlLndlYmtpdEdldEFzRW50cnkoKS5pc0RpcmVjdG9yeVxuICAgICAgKSB7XG4gICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgfVxuICAgIH1cblxuICAgIHJldHVybiBmYWxzZTtcbiAgfVxuXG4gIHB1YmxpYyBmaWxlVHlwZVJlamVjdGVkKGZpbGVUeXBlOiBzdHJpbmcsIGFjY2VwdGVkVHlwZXM/OiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICBpZiAoIWFjY2VwdGVkVHlwZXMpIHtcbiAgICAgIHJldHVybiBmYWxzZTtcbiAgICB9XG5cbiAgICBpZiAoIWZpbGVUeXBlKSB7XG4gICAgICByZXR1cm4gdHJ1ZTtcbiAgICB9XG5cbiAgICBjb25zdCBhY2NlcHRlZFR5cGVzVXBwZXIgPSBhY2NlcHRlZFR5cGVzLnRvVXBwZXJDYXNlKCk7XG4gICAgY29uc3QgdHlwZUFycmF5ID0gYWNjZXB0ZWRUeXBlc1VwcGVyLnNwbGl0KCcsJyk7XG5cbiAgICByZXR1cm4gIXRoaXMuI2ZpbGVUeXBlSW5BcnJheSh0eXBlQXJyYXksIGZpbGVUeXBlLnRvVXBwZXJDYXNlKCkpO1xuICB9XG5cbiAgI2ZpbGVUeXBlSW5BcnJheSh0eXBlQXJyYXk6IHN0cmluZ1tdLCBmaWxlVHlwZTogc3RyaW5nKTogYm9vbGVhbiB7XG4gICAgaWYgKHR5cGVBcnJheS5pbmRleE9mKGZpbGVUeXBlKSAhPT0gLTEpIHtcbiAgICAgIHJldHVybiB0cnVlO1xuICAgIH1cblxuICAgIGZvciAoY29uc3QgdHlwZSBvZiB0eXBlQXJyYXkpIHtcbiAgICAgIGNvbnN0IHZhbGlkU3VidHlwZSA9IHRoaXMuI2dldE1pbWVTdWJ0eXBlKHR5cGUpO1xuXG4gICAgICBpZiAodmFsaWRTdWJ0eXBlID09PSAnKicpIHtcbiAgICAgICAgaWYgKHRoaXMuI2dldE1pbWVNYWluVHlwZSh0eXBlKSA9PT0gdGhpcy4jZ2V0TWltZU1haW5UeXBlKGZpbGVUeXBlKSkge1xuICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgfVxuXG4gICAgcmV0dXJuIGZhbHNlO1xuICB9XG5cbiAgI2dldEFjY2VwdGVkVHlwZXNMaXN0KHJhd1R5cGVzOiBzdHJpbmcgfCB1bmRlZmluZWQpOiBzdHJpbmcgfCB1bmRlZmluZWQge1xuICAgIHJldHVybiByYXdUeXBlc1xuICAgICAgPy50b1VwcGVyQ2FzZSgpXG4gICAgICAuc3BsaXQoJywnKVxuICAgICAgLm1hcCgodHlwZSkgPT4ge1xuICAgICAgICBjb25zdCBzdWJUeXBlID0gdGhpcy4jZ2V0TWltZVN1YnR5cGUodHlwZSk7XG4gICAgICAgIHJldHVybiBzdWJUeXBlLnN0YXJ0c1dpdGgoJ1gtJykgPyBzdWJUeXBlLnN1YnN0cigyKSA6IHN1YlR5cGU7XG4gICAgICB9KVxuICAgICAgLmpvaW4oJywgJyk7XG4gIH1cblxuICAjZ2V0TWltZVN1YnR5cGUodHlwZTogc3RyaW5nKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdHlwZS5zdWJzdHIodHlwZS5pbmRleE9mKCcvJykgKyAxLCB0eXBlLmxlbmd0aCk7XG4gIH1cblxuICAjZ2V0TWltZU1haW5UeXBlKHR5cGU6IHN0cmluZyk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHR5cGUuc3Vic3RyKDAsIHR5cGUuaW5kZXhPZignLycpKTtcbiAgfVxufVxuIl19
|
|
@@ -6,11 +6,11 @@ import * as i0 from "@angular/core";
|
|
|
6
6
|
* @deprecated Import either `SkyFileAttachmentModule` or `SkyFileDropModule`.
|
|
7
7
|
*/
|
|
8
8
|
export class SkyFileAttachmentsModule {
|
|
9
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
10
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.
|
|
11
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.
|
|
9
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
10
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentsModule, imports: [SkyFileAttachmentModule, SkyFileDropModule], exports: [SkyFileAttachmentModule, SkyFileDropModule] }); }
|
|
11
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentsModule, imports: [SkyFileAttachmentModule, SkyFileDropModule, SkyFileAttachmentModule, SkyFileDropModule] }); }
|
|
12
12
|
}
|
|
13
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
13
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileAttachmentsModule, decorators: [{
|
|
14
14
|
type: NgModule,
|
|
15
15
|
args: [{
|
|
16
16
|
exports: [SkyFileAttachmentModule, SkyFileDropModule],
|
|
@@ -255,13 +255,13 @@ export class SkyFileDropComponent {
|
|
|
255
255
|
this.rejectedFiles = rejectedFileArray;
|
|
256
256
|
}
|
|
257
257
|
}
|
|
258
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.
|
|
259
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.
|
|
258
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileDropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
259
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyFileDropComponent, isStandalone: true, selector: "sky-file-drop", inputs: { fileUploadAriaLabel: "fileUploadAriaLabel", linkUploadAriaLabel: "linkUploadAriaLabel", linkUploadHintText: "linkUploadHintText", minFileSize: "minFileSize", maxFileSize: "maxFileSize", multiple: "multiple", validateFn: "validateFn", acceptedTypes: "acceptedTypes", acceptedTypesErrorMessage: "acceptedTypesErrorMessage", noClick: "noClick", allowLinks: "allowLinks", labelText: "labelText", labelHidden: ["labelHidden", "labelHidden", booleanAttribute], hintText: "hintText", required: ["required", "required", booleanAttribute], helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", stacked: ["stacked", "stacked", booleanAttribute], helpKey: "helpKey" }, outputs: { filesChanged: "filesChanged", linkInputBlur: "linkInputBlur", linkChanged: "linkChanged" }, host: { properties: { "class.sky-margin-stacked-lg": "this.stacked" } }, providers: [
|
|
260
260
|
SkyFileAttachmentService,
|
|
261
261
|
{ provide: SKY_FORM_ERRORS_ENABLED, useValue: true },
|
|
262
262
|
], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<fieldset>\n @if (labelText) {\n <legend\n class=\"sky-control-label sky-font-body-default sky-margin-stacked-xs\"\n [ngClass]=\"{\n 'sky-screen-reader-only': labelHidden\n }\"\n >\n <span\n class=\"sky-margin-inline-xs\"\n [ngClass]=\"{\n 'sky-control-label-required': required\n }\"\n >{{ labelText }}</span\n >\n @if (required) {\n <span class=\"sky-screen-reader-only\">{{\n 'skyux_file_attachment_required' | skyLibResources\n }}</span>\n }\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n [helpKey]=\"helpKey\"\n [labelText]=\"labelText\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n }\n </legend>\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 [attr.aria-label]=\"\n fileUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_drag_or_click' | skyLibResources)\n \"\n [attr.aria-describedby]=\"hintText ? hintTextEl.id : undefined\"\n [attr.aria-invalid]=\"!!rejectedFiles.length\"\n [attr.aria-errormessage]=\"\n labelText && rejectedFiles.length ? errorId : undefined\n \"\n (click)=\"dropClicked()\"\n (dragover)=\"fileDragOver($event)\"\n (dragenter)=\"fileDragEnter($event)\"\n (dragleave)=\"fileDragLeave($event)\"\n (drop)=\"fileDrop($event)\"\n ></button>\n\n <input\n #fileInput\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 />\n\n @if (customEl.children.length === 0) {\n <div class=\"sky-file-drop-contents sky-padding-even-default\">\n <div class=\"sky-file-drop-contents-not-over\">\n <div class=\"sky-file-drop-text-header sky-font-display-3\">\n {{\n 'skyux_file_attachment_file_upload_drag_file_here'\n | 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\" />\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-font-display-3\">\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\" />\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-font-display-3\">\n {{\n 'skyux_file_attachment_file_upload_invalid_file'\n | skyLibResources\n }}\n </div>\n <sky-icon icon=\"times-circle\" class=\"sky-file-upload-icon\" />\n </div>\n </div>\n }\n\n <div #customEl class=\"sky-file-drop-contents-custom\">\n <ng-content />\n </div>\n </div>\n @if (allowLinks) {\n <div class=\"sky-file-drop-col\">\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-font-display-3\">\n {{\n 'skyux_file_attachment_file_upload_link_label'\n | skyLibResources\n }}\n </div>\n </div>\n <sky-input-box stacked [hintText]=\"linkUploadHintText\">\n <input\n type=\"text\"\n [attr.aria-label]=\"\n linkUploadAriaLabel ||\n ('skyux_file_attachment_file_upload_link_label'\n | skyLibResources)\n \"\n [attr.aria-invalid]=\"!!rejectedFiles.length\"\n [attr.aria-errormessage]=\"\n labelText && rejectedFiles.length ? errorId : undefined\n \"\n [(ngModel)]=\"linkUrl\"\n (blur)=\"onLinkBlur()\"\n (keyup)=\"addLinkEnter($event)\"\n />\n </sky-input-box>\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_link_done' | skyLibResources\n }}\n </button>\n </div>\n </div>\n </div>\n }\n </div>\n <div #hintTextEl=\"skyId\" skyId>\n @if (hintText) {\n <div class=\"sky-font-deemphasized sky-file-drop-hint-text\">\n {{ hintText }}\n </div>\n }\n </div>\n</fieldset>\n<sky-form-errors\n [class.sky-file-drop-errors]=\"labelText && rejectedFiles.length\"\n [id]=\"errorId\"\n [labelText]=\"labelText\"\n [touched]=\"rejectedFiles.length > 0\"\n>\n @for (rejectedFile of rejectedFiles; track rejectedFile) {\n <div>\n @if (rejectedFile.errorType === 'fileType') {\n <sky-form-error\n errorName=\"fileType\"\n [errorText]=\"\n 'skyux_file_attachment_file_type_error_label_text_with_name'\n | skyLibResources\n : rejectedFile.file.name\n : rejectedFile.errorParam\n \"\n />\n } @else if (rejectedFile.errorType === 'maxFileSize') {\n <sky-form-error\n errorName=\"maxFileSize\"\n [errorText]=\"\n acceptedTypesErrorMessage ??\n 'skyux_file_attachment_max_file_size_error_label_text_with_name'\n | skyLibResources\n : rejectedFile.file.name\n : (rejectedFile.errorParam | skyFileSize)\n \"\n />\n } @else if (rejectedFile.errorType === 'minFileSize') {\n <sky-form-error\n errorName=\"minFileSize\"\n [errorText]=\"\n 'skyux_file_attachment_min_file_size_error_label_text_with_name'\n | skyLibResources\n : rejectedFile.file.name\n : (rejectedFile.errorParam | skyFileSize)\n \"\n />\n } @else if (\n rejectedFile.errorType === 'validate' && rejectedFile.errorParam\n ) {\n <sky-form-error\n errorName=\"validate\"\n [errorText]=\"rejectedFile.file.name + ': ' + rejectedFile.errorParam\"\n />\n }\n </div>\n }\n</sky-form-errors>\n", styles: [":host.sky-margin-stacked-lg{display:block}.sky-file-drop-col{padding-left:5px;padding-right:5px;position:relative}:host .sky-file-drop-row{display:block}:host .sky-file-drop-col{flex-basis:auto}:host .sky-file-drop-col:not(:last-of-type){margin-bottom:10px}:host .sky-file-drop-allow-links .sky-file-drop-col{flex-basis:auto}:host-context(.sky-responsive-container-xs) .sky-file-drop-row,:host-context(.sky-responsive-container-sm) .sky-file-drop-row,:host-context(.sky-responsive-container-md) .sky-file-drop-row,:host-context(.sky-responsive-container-lg) .sky-file-drop-row{display:block}:host-context(.sky-responsive-container-xs) .sky-file-drop-col,:host-context(.sky-responsive-container-sm) .sky-file-drop-col,:host-context(.sky-responsive-container-md) .sky-file-drop-col,:host-context(.sky-responsive-container-lg) .sky-file-drop-col{flex-basis:auto}:host-context(.sky-responsive-container-xs) .sky-file-drop-col:not(:last-of-type),:host-context(.sky-responsive-container-sm) .sky-file-drop-col:not(:last-of-type),:host-context(.sky-responsive-container-md) .sky-file-drop-col:not(:last-of-type),:host-context(.sky-responsive-container-lg) .sky-file-drop-col:not(:last-of-type){margin-bottom:10px}:host-context(.sky-responsive-container-xs) .sky-file-drop-allow-links .sky-file-drop-col,:host-context(.sky-responsive-container-sm) .sky-file-drop-allow-links .sky-file-drop-col,:host-context(.sky-responsive-container-md) .sky-file-drop-allow-links .sky-file-drop-col,:host-context(.sky-responsive-container-lg) .sky-file-drop-allow-links .sky-file-drop-col{flex-basis:auto}@media (min-width: 768px){:host .sky-file-drop-row{display:flex}:host .sky-file-drop-col{flex-basis:100%}:host .sky-file-drop-col:not(:last-of-type){margin-bottom:0}:host .sky-file-drop-allow-links .sky-file-drop-col{flex-basis:50%}}:host-context(.sky-responsive-container-sm) .sky-file-drop-row,:host-context(.sky-responsive-container-md) .sky-file-drop-row,:host-context(.sky-responsive-container-lg) .sky-file-drop-row{display:flex}:host-context(.sky-responsive-container-sm) .sky-file-drop-col,:host-context(.sky-responsive-container-md) .sky-file-drop-col,:host-context(.sky-responsive-container-lg) .sky-file-drop-col{flex-basis:100%}:host-context(.sky-responsive-container-sm) .sky-file-drop-col:not(:last-of-type),:host-context(.sky-responsive-container-md) .sky-file-drop-col:not(:last-of-type),:host-context(.sky-responsive-container-lg) .sky-file-drop-col:not(:last-of-type){margin-bottom:0}:host-context(.sky-responsive-container-sm) .sky-file-drop-allow-links .sky-file-drop-col,:host-context(.sky-responsive-container-md) .sky-file-drop-allow-links .sky-file-drop-col,:host-context(.sky-responsive-container-lg) .sky-file-drop-allow-links .sky-file-drop-col{flex-basis:50%}button.sky-file-drop{height:100%;position:absolute;inset:0;z-index:1}button.sky-file-drop:hover{cursor:pointer}.sky-file-drop-contents{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;background-color:#eeeeef;color:#212327;cursor:pointer;width:100%;text-align:center;height:100%}.sky-file-drop-contents .sky-file-drop-link-header{margin-bottom:5px}.sky-file-drop-no-click .sky-file-drop-contents{cursor:default}.sky-file-drop-hint-text{text-align:left;margin-top:var(--sky-margin-stacked-xs)}.sky-file-drop-accept .sky-file-drop-contents,.sky-file-drop-reject .sky-file-drop-contents{border-style:dashed;border-width:1px}.sky-file-drop-accept .sky-file-drop-contents-not-over,.sky-file-drop-reject .sky-file-drop-contents-not-over{display:none}.sky-file-drop-accept .sky-file-drop-contents{border-color:#72bf44;color:#212327}.sky-file-drop-accept .sky-file-drop-contents-accept{display:block}.sky-file-drop-reject .sky-file-drop-contents{border-color:#ef4044;color:#212327}.sky-file-drop-reject .sky-file-drop-contents-reject{display:block}.sky-file-drop-contents-accept,.sky-file-drop-contents-reject{display:none}.sky-file-upload-icon{display:block;font-size:40px;max-height:40px;margin-top:10px}.sky-file-drop-link{cursor:default}.sky-file-drop-text-header{margin:0}.sky-file-drop-text{font-size:15px;margin-top:5px;margin-bottom:20px}.sky-file-drop-text,.sky-file-drop-text-header{line-height:1.1;display:block}.sky-file-upload-icon{color:#686c73}.sky-file-drop{background-color:transparent;border:none;display:block;-webkit-appearance:none;width:100%;padding:0}.sky-file-input-hidden{display:none}.sky-file-drop-errors{margin-bottom:10px}:host-context(.sky-theme-modern) .sky-control-label{color:var(--sky-text-color-deemphasized);font-size:13px}.sky-theme-modern .sky-control-label{color:var(--sky-text-color-deemphasized);font-size:13px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: SkyFileSizePipe, name: "skyFileSize" }, { kind: "component", type: SkyFormErrorComponent, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: SkyFormErrorsComponent, selector: "sky-form-errors", inputs: ["errors", "labelText", "touched", "dirty"] }, { kind: "ngmodule", type: SkyFormsResourcesModule }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "ngmodule", type: SkyHelpInlineModule }, { kind: "component", type: i4.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i5.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i6.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i7.SkyInputBoxComponent, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i8.SkyInputBoxControlDirective, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }] }); }
|
|
263
263
|
}
|
|
264
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.
|
|
264
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyFileDropComponent, decorators: [{
|
|
265
265
|
type: Component,
|
|
266
266
|
args: [{ selector: 'sky-file-drop', providers: [
|
|
267
267
|
SkyFileAttachmentService,
|