@daffodil/design 0.93.0 → 0.94.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/README.md +0 -1
- package/accordion/src/accordion-theme.scss +2 -2
- package/article/src/article/_stops-article-cascade.scss +5 -1
- package/article/src/article-theme.scss +2 -2
- package/badge/README.md +85 -0
- package/badge/src/badge-theme.scss +197 -0
- package/beacon/README.md +61 -0
- package/beacon/src/beacon-theme.scss +61 -0
- package/breadcrumb/src/breadcrumb-theme.scss +2 -2
- package/button/src/button/basic/button-theme.scss +2 -2
- package/button/src/button/flat/flat-theme.scss +2 -2
- package/button/src/button/icon/icon-theme.scss +2 -2
- package/button/src/button/raised/raised-theme.scss +13 -13
- package/button/src/button/stroked/stroked-theme.scss +2 -2
- package/button/src/button/underline/underline-theme.scss +2 -2
- package/callout/src/callout-theme.scss +12 -2
- package/card/src/card/stroked/stroked-theme.scss +14 -22
- package/card/src/card-base-theme.scss +4 -4
- package/card/src/card-base.scss +13 -16
- package/fesm2022/daffodil-design-accordion.mjs +9 -15
- package/fesm2022/daffodil-design-accordion.mjs.map +1 -1
- package/fesm2022/daffodil-design-article.mjs +2 -2
- package/fesm2022/daffodil-design-article.mjs.map +1 -1
- package/fesm2022/daffodil-design-badge.mjs +87 -0
- package/fesm2022/daffodil-design-badge.mjs.map +1 -0
- package/fesm2022/daffodil-design-beacon.mjs +48 -0
- package/fesm2022/daffodil-design-beacon.mjs.map +1 -0
- package/fesm2022/daffodil-design-breadcrumb.mjs +1 -1
- package/fesm2022/daffodil-design-breadcrumb.mjs.map +1 -1
- package/fesm2022/daffodil-design-button.mjs +1 -1
- package/fesm2022/daffodil-design-button.mjs.map +1 -1
- package/fesm2022/daffodil-design-callout.mjs +2 -2
- package/fesm2022/daffodil-design-card.mjs +9 -11
- package/fesm2022/daffodil-design-card.mjs.map +1 -1
- package/fesm2022/daffodil-design-form-field.mjs +95 -115
- package/fesm2022/daffodil-design-form-field.mjs.map +1 -1
- package/fesm2022/daffodil-design-form.mjs +5 -7
- package/fesm2022/daffodil-design-form.mjs.map +1 -1
- package/fesm2022/daffodil-design-image.mjs +41 -98
- package/fesm2022/daffodil-design-image.mjs.map +1 -1
- package/fesm2022/daffodil-design-input.mjs +3 -3
- package/fesm2022/daffodil-design-input.mjs.map +1 -1
- package/fesm2022/daffodil-design-list.mjs +16 -21
- package/fesm2022/daffodil-design-list.mjs.map +1 -1
- package/fesm2022/daffodil-design-media-gallery.mjs +56 -61
- package/fesm2022/daffodil-design-media-gallery.mjs.map +1 -1
- package/fesm2022/daffodil-design-menu.mjs +61 -38
- package/fesm2022/daffodil-design-menu.mjs.map +1 -1
- package/fesm2022/daffodil-design-modal.mjs +2 -2
- package/fesm2022/daffodil-design-modal.mjs.map +1 -1
- package/fesm2022/daffodil-design-native-select.mjs +3 -3
- package/fesm2022/daffodil-design-native-select.mjs.map +1 -1
- package/fesm2022/daffodil-design-notification.mjs +17 -20
- package/fesm2022/daffodil-design-notification.mjs.map +1 -1
- package/fesm2022/daffodil-design-paginator.mjs +71 -76
- package/fesm2022/daffodil-design-paginator.mjs.map +1 -1
- package/fesm2022/daffodil-design-progress-bar.mjs +33 -53
- package/fesm2022/daffodil-design-progress-bar.mjs.map +1 -1
- package/fesm2022/daffodil-design-select.mjs +1 -1
- package/fesm2022/daffodil-design-select.mjs.map +1 -1
- package/fesm2022/daffodil-design-sidebar.mjs +2 -2
- package/fesm2022/daffodil-design-sidebar.mjs.map +1 -1
- package/fesm2022/daffodil-design-spinner.mjs +17 -16
- package/fesm2022/daffodil-design-spinner.mjs.map +1 -1
- package/fesm2022/daffodil-design-switch.mjs +20 -29
- package/fesm2022/daffodil-design-switch.mjs.map +1 -1
- package/fesm2022/daffodil-design-tabs.mjs +86 -88
- package/fesm2022/daffodil-design-tabs.mjs.map +1 -1
- package/fesm2022/daffodil-design-tag.mjs +33 -28
- package/fesm2022/daffodil-design-tag.mjs.map +1 -1
- package/fesm2022/daffodil-design-text-snippet.mjs +18 -23
- package/fesm2022/daffodil-design-text-snippet.mjs.map +1 -1
- package/fesm2022/daffodil-design-textarea.mjs +3 -3
- package/fesm2022/daffodil-design-textarea.mjs.map +1 -1
- package/fesm2022/daffodil-design-toast.mjs +19 -20
- package/fesm2022/daffodil-design-toast.mjs.map +1 -1
- package/fesm2022/daffodil-design.mjs +111 -80
- package/fesm2022/daffodil-design.mjs.map +1 -1
- package/form/src/hint/hint-theme.scss +2 -2
- package/form-field/src/form-field-theme.scss +2 -2
- package/hero/src/hero-theme.scss +12 -2
- package/list/README.md +10 -0
- package/list/src/list-theme.scss +2 -2
- package/media-gallery/README.md +0 -5
- package/media-gallery/src/media-gallery-theme.scss +2 -2
- package/menu/README.md +5 -0
- package/menu/src/menu-theme.scss +4 -4
- package/notification/src/notification-theme.scss +2 -2
- package/package.json +1 -1
- package/paginator/src/paginator-theme.scss +2 -2
- package/progress-bar/README.md +1 -1
- package/progress-bar/src/progress-bar-theme.scss +2 -2
- package/scss/global.scss +4 -0
- package/scss/state/skeleton/_mixins.scss +2 -2
- package/scss/theme/default.scss +15 -0
- package/scss/theme.scss +4 -8
- package/scss/theming/_configure-palette.scss +5 -1
- package/scss/theming/_get-theme-mode.scss +1 -1
- package/scss/theming/_index.scss +2 -3
- package/scss/theming/_light-dark.scss +37 -12
- package/scss/theming/color-shift/_color-shift.scss +56 -0
- package/scss/theming/color-shift/_color-shift.spec.scss +107 -0
- package/scss/theming/color-shift/_index.scss +1 -0
- package/scss/theming/{_daff-theme.scss → default/_daff-theme.scss} +4 -4
- package/scss/theming/default/_index.scss +1 -0
- package/select/src/select-theme.scss +5 -3
- package/switch/src/switch-theme.scss +2 -2
- package/tabs/src/tabs-theme.scss +2 -2
- package/tag/README.md +10 -6
- package/tag/src/tag-theme.scss +102 -5
- package/toast/src/toast-theme.scss +2 -2
- package/tree/src/tree-theme.scss +2 -2
- package/types/daffodil-design-accordion.d.ts +4 -4
- package/types/daffodil-design-badge.d.ts +63 -0
- package/types/daffodil-design-beacon.d.ts +26 -0
- package/types/daffodil-design-card.d.ts +2 -2
- package/types/daffodil-design-form-field.d.ts +34 -31
- package/types/daffodil-design-form.d.ts +2 -2
- package/types/daffodil-design-image.d.ts +15 -28
- package/types/daffodil-design-list.d.ts +3 -3
- package/types/daffodil-design-media-gallery.d.ts +31 -20
- package/types/daffodil-design-menu.d.ts +51 -20
- package/types/daffodil-design-notification.d.ts +5 -6
- package/types/daffodil-design-paginator.d.ts +20 -25
- package/types/daffodil-design-progress-bar.d.ts +16 -21
- package/types/daffodil-design-spinner.d.ts +2 -2
- package/types/daffodil-design-switch.d.ts +7 -8
- package/types/daffodil-design-tabs.d.ts +29 -29
- package/types/daffodil-design-tag.d.ts +22 -16
- package/types/daffodil-design-text-snippet.d.ts +9 -9
- package/types/daffodil-design.d.ts +61 -41
- package/fesm2022/daffodil-design-loading-icon.mjs +0 -67
- package/fesm2022/daffodil-design-loading-icon.mjs.map +0 -1
- package/loading-icon/README.md +0 -59
- package/loading-icon/src/loading-icon-theme.scss +0 -103
- package/scss/theming/illuminate/illuminate.scss +0 -149
- package/scss/theming/illuminate/illuminate.spec.scss +0 -15
- package/types/daffodil-design-loading-icon.d.ts +0 -31
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { ChangeDetectionStrategy, Component,
|
|
2
|
+
import { ChangeDetectionStrategy, Component, input, Directive } from '@angular/core';
|
|
3
3
|
|
|
4
4
|
class DaffErrorMessageComponent {
|
|
5
5
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffErrorMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -18,20 +18,18 @@ class DaffHintComponent {
|
|
|
18
18
|
/**
|
|
19
19
|
* Displays a validated hint UI.
|
|
20
20
|
* */
|
|
21
|
-
this.validated = false;
|
|
21
|
+
this.validated = input(false, ...(ngDevMode ? [{ debugName: "validated" }] : /* istanbul ignore next */ []));
|
|
22
22
|
}
|
|
23
23
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
24
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: DaffHintComponent, isStandalone: true, selector: "daff-hint", inputs: { validated: { classPropertyName: "validated", publicName: "validated", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.validated": "validated()" }, classAttribute: "daff-hint" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:flex;gap:.25rem;font-size:.875rem;line-height:1rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
25
25
|
}
|
|
26
26
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffHintComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
28
|
args: [{ selector: 'daff-hint', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
29
29
|
class: 'daff-hint',
|
|
30
|
-
'[class.validated]': 'validated',
|
|
30
|
+
'[class.validated]': 'validated()',
|
|
31
31
|
}, styles: [":host{display:flex;gap:.25rem;font-size:.875rem;line-height:1rem}\n"] }]
|
|
32
|
-
}], propDecorators: { validated: [{
|
|
33
|
-
type: Input
|
|
34
|
-
}] } });
|
|
32
|
+
}], propDecorators: { validated: [{ type: i0.Input, args: [{ isSignal: true, alias: "validated", required: false }] }] } });
|
|
35
33
|
|
|
36
34
|
class DaffFormFieldLabelDirective {
|
|
37
35
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffFormFieldLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"daffodil-design-form.mjs","sources":["../../../libs/design/form/src/error-message/error-message.component.ts","../../../libs/design/form/src/hint/hint.component.ts","../../../libs/design/form/src/label/label.directive.ts","../../../libs/design/form/src/form.ts","../../../libs/design/form/src/daffodil-design-form.ts"],"sourcesContent":["import {\n Component,\n ChangeDetectionStrategy,\n} from '@angular/core';\n\n@Component({\n selector: 'daff-error-message',\n template: '<ng-content></ng-content>',\n styleUrls: ['./error-message.component.scss'],\n host: {\n class: 'daff-error-message',\n 'aria-live': 'polite',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffErrorMessageComponent {}\n","import {\n Component,\n ChangeDetectionStrategy,\n
|
|
1
|
+
{"version":3,"file":"daffodil-design-form.mjs","sources":["../../../libs/design/form/src/error-message/error-message.component.ts","../../../libs/design/form/src/hint/hint.component.ts","../../../libs/design/form/src/label/label.directive.ts","../../../libs/design/form/src/form.ts","../../../libs/design/form/src/daffodil-design-form.ts"],"sourcesContent":["import {\n Component,\n ChangeDetectionStrategy,\n} from '@angular/core';\n\n@Component({\n selector: 'daff-error-message',\n template: '<ng-content></ng-content>',\n styleUrls: ['./error-message.component.scss'],\n host: {\n class: 'daff-error-message',\n 'aria-live': 'polite',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffErrorMessageComponent {}\n","import {\n Component,\n ChangeDetectionStrategy,\n input,\n} from '@angular/core';\n\n@Component({\n selector: 'daff-hint',\n template: '<ng-content></ng-content>',\n styleUrl: './hint.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'daff-hint',\n '[class.validated]': 'validated()',\n },\n})\nexport class DaffHintComponent {\n /**\n * Displays a validated hint UI.\n * */\n validated = input(false);\n}\n","import { Directive } from '@angular/core';\n\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: 'daff-form-label',\n})\nexport class DaffFormFieldLabelDirective {}\n","import { DaffErrorMessageComponent } from './error-message/error-message.component';\nimport { DaffHintComponent } from './hint/hint.component';\nimport { DaffFormFieldLabelDirective } from './label/label.directive';\n\n/**\n * @docs-private\n */\nexport const DAFF_FORM_HELPER_COMPONENTS = <const> [\n DaffErrorMessageComponent,\n DaffHintComponent,\n DaffFormFieldLabelDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;MAea,yBAAyB,CAAA;iIAAzB,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,yBAAyB,qKAR1B,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,2DAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAQ1B,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAVrC,SAAS;+BACE,oBAAoB,EAAA,QAAA,EACpB,2BAA2B,EAAA,IAAA,EAE/B;AACJ,wBAAA,KAAK,EAAE,oBAAoB;AAC3B,wBAAA,WAAW,EAAE,QAAQ;qBACtB,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,2DAAA,CAAA,EAAA;;;MCGpC,iBAAiB,CAAA;AAV9B,IAAA,WAAA,GAAA;AAWE;;AAEK;AACL,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK,CAAC,KAAK,gFAAC;AACzB,IAAA;iIALY,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,8SARlB,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAQ1B,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAV7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,YACX,2BAA2B,EAAA,eAAA,EAEpB,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,KAAK,EAAE,WAAW;AAClB,wBAAA,mBAAmB,EAAE,aAAa;AACnC,qBAAA,EAAA,MAAA,EAAA,CAAA,qEAAA,CAAA,EAAA;;;MCRU,2BAA2B,CAAA;iIAA3B,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;qHAA3B,2BAA2B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAJvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;;AAET,oBAAA,QAAQ,EAAE,iBAAiB;AAC5B,iBAAA;;;ACDD;;AAEG;AACI,MAAM,2BAA2B,GAAW;IACjD,yBAAyB;IACzB,iBAAiB;IACjB,2BAA2B;;;ACV7B;;AAEG;;;;"}
|
|
@@ -1,78 +1,35 @@
|
|
|
1
1
|
import { NgOptimizedImage, CommonModule } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { input,
|
|
3
|
+
import { input, output, computed, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
4
4
|
import * as i1 from '@angular/platform-browser';
|
|
5
5
|
import * as i2 from '@daffodil/design';
|
|
6
6
|
import { DaffSkeletonableDirective } from '@daffodil/design';
|
|
7
7
|
|
|
8
|
-
const
|
|
9
|
-
if (
|
|
8
|
+
const validateInput = (prop) => (value) => {
|
|
9
|
+
if (value === null || value === undefined || value === '') {
|
|
10
10
|
throw new Error(`DaffImageComponent must have a defined ${prop} attribute.`);
|
|
11
11
|
}
|
|
12
|
-
|
|
13
|
-
const validateProperties = (object, props) => {
|
|
14
|
-
const invalidProps = props.filter(prop => {
|
|
15
|
-
try {
|
|
16
|
-
validateProperty(object, prop);
|
|
17
|
-
}
|
|
18
|
-
catch (e) {
|
|
19
|
-
return true;
|
|
20
|
-
}
|
|
21
|
-
return false;
|
|
22
|
-
});
|
|
23
|
-
if (invalidProps.length) {
|
|
24
|
-
throw new Error(`DaffImageComponent must have the ${invalidProps.join(',')} attributes defined.`);
|
|
25
|
-
}
|
|
12
|
+
return value;
|
|
26
13
|
};
|
|
27
14
|
class DaffImageComponent {
|
|
28
|
-
/**
|
|
29
|
-
* The URL of the image.
|
|
30
|
-
*/
|
|
31
|
-
get src() {
|
|
32
|
-
return this._src;
|
|
33
|
-
}
|
|
34
|
-
set src(value) {
|
|
35
|
-
this._src = value;
|
|
36
|
-
validateProperty(this, 'src');
|
|
37
|
-
}
|
|
38
|
-
/**
|
|
39
|
-
* The alternate text for the image.
|
|
40
|
-
*/
|
|
41
|
-
get alt() {
|
|
42
|
-
return this._alt;
|
|
43
|
-
}
|
|
44
|
-
set alt(value) {
|
|
45
|
-
this._alt = value;
|
|
46
|
-
validateProperty(this, 'alt');
|
|
47
|
-
}
|
|
48
|
-
/**
|
|
49
|
-
* The width of the image.
|
|
50
|
-
*/
|
|
51
|
-
get width() {
|
|
52
|
-
return this._width;
|
|
53
|
-
}
|
|
54
|
-
set width(value) {
|
|
55
|
-
this._width = value;
|
|
56
|
-
validateProperty(this, 'width');
|
|
57
|
-
}
|
|
58
|
-
/**
|
|
59
|
-
* The height of the image.
|
|
60
|
-
*/
|
|
61
|
-
get height() {
|
|
62
|
-
return this._height;
|
|
63
|
-
}
|
|
64
|
-
set height(value) {
|
|
65
|
-
this._height = value;
|
|
66
|
-
validateProperty(this, 'height');
|
|
67
|
-
}
|
|
68
|
-
/**
|
|
69
|
-
* @docs-private
|
|
70
|
-
*/
|
|
71
|
-
ngOnInit() {
|
|
72
|
-
validateProperties(this, ['src', 'alt', 'width', 'height']);
|
|
73
|
-
}
|
|
74
15
|
constructor(sanitizer) {
|
|
75
16
|
this.sanitizer = sanitizer;
|
|
17
|
+
/**
|
|
18
|
+
* The URL of the image.
|
|
19
|
+
*/
|
|
20
|
+
this.src = input.required({ ...(ngDevMode ? { debugName: "src" } : /* istanbul ignore next */ {}), transform: validateInput('src') });
|
|
21
|
+
/**
|
|
22
|
+
* The alternate text for the image.
|
|
23
|
+
*/
|
|
24
|
+
this.alt = input.required({ ...(ngDevMode ? { debugName: "alt" } : /* istanbul ignore next */ {}), transform: validateInput('alt') });
|
|
25
|
+
/**
|
|
26
|
+
* The width of the image.
|
|
27
|
+
*/
|
|
28
|
+
this.width = input.required({ ...(ngDevMode ? { debugName: "width" } : /* istanbul ignore next */ {}), transform: validateInput('width') });
|
|
29
|
+
/**
|
|
30
|
+
* The height of the image.
|
|
31
|
+
*/
|
|
32
|
+
this.height = input.required({ ...(ngDevMode ? { debugName: "height" } : /* istanbul ignore next */ {}), transform: validateInput('height') });
|
|
76
33
|
/**
|
|
77
34
|
* Whether the image should be treated as a priority image for loading.
|
|
78
35
|
* Priority images are loaded eagerly and not lazy-loaded.
|
|
@@ -81,29 +38,25 @@ class DaffImageComponent {
|
|
|
81
38
|
/**
|
|
82
39
|
* Emits when the image has loaded.
|
|
83
40
|
*/
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
* The aspect ratio of an image, based on the width and height set by the user.
|
|
101
|
-
*/
|
|
102
|
-
get _aspectRatio() {
|
|
103
|
-
return this.sanitizer.bypassSecurityTrustStyle(this.width + ' / ' + this.height);
|
|
41
|
+
this.loaded = output();
|
|
42
|
+
/**
|
|
43
|
+
* @docs-private
|
|
44
|
+
*/
|
|
45
|
+
this._paddingTop = computed(() => {
|
|
46
|
+
if (!this.height() || !this.width()) {
|
|
47
|
+
return undefined;
|
|
48
|
+
}
|
|
49
|
+
return this.sanitizer.bypassSecurityTrustStyle('calc(' + this.height() + ' / ' + this.width() + ' * 100%)');
|
|
50
|
+
}, ...(ngDevMode ? [{ debugName: "_paddingTop" }] : /* istanbul ignore next */ []));
|
|
51
|
+
/**
|
|
52
|
+
* @docs-private
|
|
53
|
+
*
|
|
54
|
+
* The aspect ratio of an image, based on the width and height set by the user.
|
|
55
|
+
*/
|
|
56
|
+
this._aspectRatio = computed(() => this.sanitizer.bypassSecurityTrustStyle(this.width() + ' / ' + this.height()), ...(ngDevMode ? [{ debugName: "_aspectRatio" }] : /* istanbul ignore next */ []));
|
|
104
57
|
}
|
|
105
58
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffImageComponent, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
106
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: DaffImageComponent, isStandalone: true, selector: "daff-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal:
|
|
59
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: DaffImageComponent, isStandalone: true, selector: "daff-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: true, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: true, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loaded: "loaded" }, host: { properties: { "style.max-width": "width() + \"px\"", "style.aspect-ratio": "_aspectRatio()" } }, hostDirectives: [{ directive: i2.DaffSkeletonableDirective, inputs: ["skeleton", "skeleton"] }], ngImport: i0, template: "<img class=\"daff-image\"\n\t[ngSrc]=\"src()\"\n\t[alt]=\"alt()\"\n\tfill\n\t[priority]=\"priority()\"\n\t(load)=\"loaded.emit()\" />", styles: [":host{display:block;border-radius:inherit;position:relative;width:100%}:host.daff-skeleton{display:flex;position:relative;height:100%;width:100%;border-radius:0}:host.daff-skeleton:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}@keyframes loading{0%{opacity:.5}to{opacity:1}}:host.daff-skeleton img{opacity:0}:host img{display:block;object-fit:cover;max-width:100%;max-height:100%;width:100%}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
107
60
|
}
|
|
108
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffImageComponent, decorators: [{
|
|
109
62
|
type: Component,
|
|
@@ -113,22 +66,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
113
66
|
inputs: ['skeleton'],
|
|
114
67
|
},
|
|
115
68
|
], host: {
|
|
116
|
-
'[style.max-width]': 'width + "px"',
|
|
117
|
-
'[style.aspect-ratio]': '_aspectRatio',
|
|
69
|
+
'[style.max-width]': 'width() + "px"',
|
|
70
|
+
'[style.aspect-ratio]': '_aspectRatio()',
|
|
118
71
|
}, imports: [
|
|
119
72
|
NgOptimizedImage,
|
|
120
|
-
], template: "<img class=\"daff-image\"\n\t[ngSrc]=\"src\"\n\t[alt]=\"alt\"\n\tfill\n\t[priority]=\"priority\"\n\t(load)=\"
|
|
121
|
-
}], ctorParameters: () => [{ type: i1.DomSanitizer }], propDecorators: { src: [{
|
|
122
|
-
type: Input
|
|
123
|
-
}], alt: [{
|
|
124
|
-
type: Input
|
|
125
|
-
}], width: [{
|
|
126
|
-
type: Input
|
|
127
|
-
}], height: [{
|
|
128
|
-
type: Input
|
|
129
|
-
}], priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "priority", required: false }] }], load: [{
|
|
130
|
-
type: Output
|
|
131
|
-
}] } });
|
|
73
|
+
], template: "<img class=\"daff-image\"\n\t[ngSrc]=\"src()\"\n\t[alt]=\"alt()\"\n\tfill\n\t[priority]=\"priority()\"\n\t(load)=\"loaded.emit()\" />", styles: [":host{display:block;border-radius:inherit;position:relative;width:100%}:host.daff-skeleton{display:flex;position:relative;height:100%;width:100%;border-radius:0}:host.daff-skeleton:before{animation-name:loading;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate;content:\"\";height:100%;width:100%;position:absolute;top:0;left:0}@keyframes loading{0%{opacity:.5}to{opacity:1}}:host.daff-skeleton img{opacity:0}:host img{display:block;object-fit:cover;max-width:100%;max-height:100%;width:100%}\n"] }]
|
|
74
|
+
}], ctorParameters: () => [{ type: i1.DomSanitizer }], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: true }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: true }] }], priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "priority", required: false }] }], loaded: [{ type: i0.Output, args: ["loaded"] }] } });
|
|
132
75
|
|
|
133
76
|
/**
|
|
134
77
|
* @deprecated in favor of {@link DAFF_IMAGE_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"daffodil-design-image.mjs","sources":["../../../libs/design/image/src/image/image.component.ts","../../../libs/design/image/src/image/image.component.html","../../../libs/design/image/src/image.module.ts","../../../libs/design/image/src/image.ts","../../../libs/design/image/src/daffodil-design-image.ts"],"sourcesContent":["import { NgOptimizedImage } from '@angular/common';\nimport {\n Component,\n ChangeDetectionStrategy,\n
|
|
1
|
+
{"version":3,"file":"daffodil-design-image.mjs","sources":["../../../libs/design/image/src/image/image.component.ts","../../../libs/design/image/src/image/image.component.html","../../../libs/design/image/src/image.module.ts","../../../libs/design/image/src/image.ts","../../../libs/design/image/src/daffodil-design-image.ts"],"sourcesContent":["import { NgOptimizedImage } from '@angular/common';\nimport {\n Component,\n ChangeDetectionStrategy,\n input,\n output,\n computed,\n} from '@angular/core';\nimport {\n DomSanitizer,\n SafeStyle,\n} from '@angular/platform-browser';\n\nimport { DaffSkeletonableDirective } from '@daffodil/design';\n\nconst validateInput = (prop: string) => <T>(value: T): T => {\n if (value === null || value === undefined || <unknown>value === '') {\n throw new Error(`DaffImageComponent must have a defined ${prop} attribute.`);\n }\n\n return value;\n};\n\n@Component({\n selector: 'daff-image',\n templateUrl: './image.component.html',\n styleUrls: ['./image.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n hostDirectives: [\n {\n directive: DaffSkeletonableDirective,\n inputs: ['skeleton'],\n },\n ],\n host: {\n '[style.max-width]': 'width() + \"px\"',\n '[style.aspect-ratio]': '_aspectRatio()',\n },\n imports: [\n NgOptimizedImage,\n ],\n})\nexport class DaffImageComponent {\n /**\n * The URL of the image.\n */\n src = input.required<string, string>({ transform: validateInput('src') });\n\n /**\n * The alternate text for the image.\n */\n alt = input.required<string, string>({ transform: validateInput('alt') });\n\n /**\n * The width of the image.\n */\n width = input.required<number, number>({ transform: validateInput('width') });\n\n /**\n * The height of the image.\n */\n height = input.required<number, number>({ transform: validateInput('height') });\n\n /**\n * Whether the image should be treated as a priority image for loading.\n * Priority images are loaded eagerly and not lazy-loaded.\n */\n priority = input(false);\n\n /**\n * Emits when the image has loaded.\n */\n loaded = output<void>();\n\n constructor(private sanitizer: DomSanitizer) {}\n\n /**\n * @docs-private\n */\n _paddingTop = computed(() => {\n if (!this.height() || !this.width() ) {\n return undefined;\n }\n\n return this.sanitizer.bypassSecurityTrustStyle(\n 'calc(' + this.height() + ' / ' + this.width() + ' * 100%)',\n );\n });\n\n /**\n * @docs-private\n *\n * The aspect ratio of an image, based on the width and height set by the user.\n */\n _aspectRatio = computed<SafeStyle>(\n () => this.sanitizer.bypassSecurityTrustStyle(\n this.width() + ' / ' + this.height(),\n ),\n );\n}\n","<img class=\"daff-image\"\n\t[ngSrc]=\"src()\"\n\t[alt]=\"alt()\"\n\tfill\n\t[priority]=\"priority()\"\n\t(load)=\"loaded.emit()\" />","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffImageComponent } from './image/image.component';\n\n/**\n * @deprecated in favor of {@link DAFF_IMAGE_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n * */\n@NgModule({\n imports: [\n CommonModule,\n DaffImageComponent,\n ],\n exports: [\n DaffImageComponent,\n ],\n})\nexport class DaffImageModule { }\n","import { DaffImageComponent } from './image/image.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_IMAGE_COMPONENTS = <const> [\n DaffImageComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ class DaffInputComponent extends DaffFormFieldControl {
|
|
|
15
15
|
* @docs-private
|
|
16
16
|
*/
|
|
17
17
|
get _id() {
|
|
18
|
-
return this.formField?.id;
|
|
18
|
+
return this.formField?.id();
|
|
19
19
|
}
|
|
20
20
|
;
|
|
21
21
|
/**
|
|
@@ -49,10 +49,10 @@ class DaffInputComponent extends DaffFormFieldControl {
|
|
|
49
49
|
*/
|
|
50
50
|
get ariaDescribedBy() {
|
|
51
51
|
if (this.formField.hasErrorMessage()) {
|
|
52
|
-
return this.formField.errorMessageId;
|
|
52
|
+
return this.formField.errorMessageId();
|
|
53
53
|
}
|
|
54
54
|
else if (this.formField.hasHint()) {
|
|
55
|
-
return this.formField.hintId;
|
|
55
|
+
return this.formField.hintId();
|
|
56
56
|
}
|
|
57
57
|
else {
|
|
58
58
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"daffodil-design-input.mjs","sources":["../../../libs/design/input/src/input.component.ts","../../../libs/design/input/src/input.module.ts","../../../libs/design/input/src/daffodil-design-input.ts"],"sourcesContent":["/* eslint-disable quote-props */\nimport {\n Component,\n Optional,\n Self,\n ElementRef,\n ChangeDetectionStrategy,\n OnInit,\n Input,\n booleanAttribute,\n} from '@angular/core';\nimport {\n NgControl,\n Validators,\n} from '@angular/forms';\nimport {\n merge,\n of,\n map,\n tap,\n} from 'rxjs';\n\nimport {\n DaffFormFieldComponent,\n DaffFormFieldControl,\n} from '@daffodil/design/form-field';\n\n/**\n * DaffInputComponent provides the same functionality as a native `<input>` and contains custom styling and functionality.\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'input[daff-input]',\n template: '<ng-content></ng-content>',\n styleUrl: './input.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n\n { provide: DaffFormFieldControl, useExisting: DaffInputComponent },\n ],\n host: {\n 'class': 'daff-input',\n '(focus)': '_handleFocus()',\n '(blur)': '_handleBlur()',\n '[attr.id]': '_id',\n '[disabled]': 'disabledAttribute',\n '[required]': 'requiredAttribute',\n '[attr.aria-describedby]': 'ariaDescribedBy',\n },\n})\nexport class DaffInputComponent extends DaffFormFieldControl<string> implements DaffFormFieldControl<string>, OnInit {\n /** @docs-private */\n controlType = 'native-input';\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n focused = false;\n\n /**\n * @docs-private\n */\n get _id() {\n return this.formField?.id;\n };\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * @docs-private\n */\n get disabledAttribute() {\n if (this.ngControl) {\n return this.ngControl.disabled;\n }\n\n return this.disabled || null;\n }\n\n\n private _required = false;\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n @Input({ transform: booleanAttribute })\n get required(): boolean {\n return this.ngControl?.control?.hasValidator(Validators.required) ?? this._required;\n }\n set required(value: boolean) {\n this._required = value;\n }\n\n /**\n * @docs-private\n */\n get requiredAttribute() {\n return this.required || null;\n }\n\n /**\n * @docs-private\n */\n get ariaDescribedBy() {\n if(this.formField.hasErrorMessage()) {\n return this.formField.errorMessageId;\n } else if(this.formField.hasHint()) {\n return this.formField.hintId;\n } else {\n return null;\n }\n }\n\n focus() {\n this._elementRef.nativeElement.focus();\n }\n\n /** @docs-private */\n _handleFocus() {\n this.focused = true;\n this.emitState();\n\n }\n\n /** @docs-private */\n _handleBlur() {\n this.focused = false;\n this.emitState(true);\n }\n\n constructor(\n /** @docs-private */\n @Optional() @Self() public ngControl: NgControl,\n private _elementRef: ElementRef<HTMLInputElement>,\n @Optional() private formField: DaffFormFieldComponent,\n ) {\n super(ngControl);\n\n if(!this.formField) {\n throw new Error('DaffInputComponent needs to be used with the DaffFormFieldComponent.');\n }\n }\n\n /** @docs-private */\n ngOnInit() {\n this.stateChanges = merge(\n this._stateChanges.asObservable(),\n this.ngControl ? this.ngControl.statusChanges : of(undefined),\n ).pipe(\n map(() => this.state),\n tap((state) => this.disabled = state.disabled),\n );\n }\n\n /** @docs-private */\n get value() {\n return this._elementRef.nativeElement.value;\n }\n}\n","import { NgModule } from '@angular/core';\n\nimport { DaffInputComponent } from './input.component';\n\n/**\n * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n imports: [\n DaffInputComponent,\n ],\n exports: [\n DaffInputComponent,\n ],\n})\nexport class DaffInputModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAAA;AA2BA;;AAEG;AAqBG,MAAO,kBAAmB,SAAQ,oBAA4B,CAAA;AAWlE;;AAEG;AACH,IAAA,IAAI,GAAG,GAAA;AACL,QAAA,OAAO,IAAI,CAAC,SAAS,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"daffodil-design-input.mjs","sources":["../../../libs/design/input/src/input.component.ts","../../../libs/design/input/src/input.module.ts","../../../libs/design/input/src/daffodil-design-input.ts"],"sourcesContent":["/* eslint-disable quote-props */\nimport {\n Component,\n Optional,\n Self,\n ElementRef,\n ChangeDetectionStrategy,\n OnInit,\n Input,\n booleanAttribute,\n} from '@angular/core';\nimport {\n NgControl,\n Validators,\n} from '@angular/forms';\nimport {\n merge,\n of,\n map,\n tap,\n} from 'rxjs';\n\nimport {\n DaffFormFieldComponent,\n DaffFormFieldControl,\n} from '@daffodil/design/form-field';\n\n/**\n * DaffInputComponent provides the same functionality as a native `<input>` and contains custom styling and functionality.\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'input[daff-input]',\n template: '<ng-content></ng-content>',\n styleUrl: './input.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n\n { provide: DaffFormFieldControl, useExisting: DaffInputComponent },\n ],\n host: {\n 'class': 'daff-input',\n '(focus)': '_handleFocus()',\n '(blur)': '_handleBlur()',\n '[attr.id]': '_id',\n '[disabled]': 'disabledAttribute',\n '[required]': 'requiredAttribute',\n '[attr.aria-describedby]': 'ariaDescribedBy',\n },\n})\nexport class DaffInputComponent extends DaffFormFieldControl<string> implements DaffFormFieldControl<string>, OnInit {\n /** @docs-private */\n controlType = 'native-input';\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n focused = false;\n\n /**\n * @docs-private\n */\n get _id() {\n return this.formField?.id();\n };\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * @docs-private\n */\n get disabledAttribute() {\n if (this.ngControl) {\n return this.ngControl.disabled;\n }\n\n return this.disabled || null;\n }\n\n\n private _required = false;\n\n /**\n * @docs-private\n *\n * Implemented as part of DaffFormFieldControl.\n */\n @Input({ transform: booleanAttribute })\n get required(): boolean {\n return this.ngControl?.control?.hasValidator(Validators.required) ?? this._required;\n }\n set required(value: boolean) {\n this._required = value;\n }\n\n /**\n * @docs-private\n */\n get requiredAttribute() {\n return this.required || null;\n }\n\n /**\n * @docs-private\n */\n get ariaDescribedBy() {\n if(this.formField.hasErrorMessage()) {\n return this.formField.errorMessageId();\n } else if(this.formField.hasHint()) {\n return this.formField.hintId();\n } else {\n return null;\n }\n }\n\n focus() {\n this._elementRef.nativeElement.focus();\n }\n\n /** @docs-private */\n _handleFocus() {\n this.focused = true;\n this.emitState();\n\n }\n\n /** @docs-private */\n _handleBlur() {\n this.focused = false;\n this.emitState(true);\n }\n\n constructor(\n /** @docs-private */\n @Optional() @Self() public ngControl: NgControl,\n private _elementRef: ElementRef<HTMLInputElement>,\n @Optional() private formField: DaffFormFieldComponent,\n ) {\n super(ngControl);\n\n if(!this.formField) {\n throw new Error('DaffInputComponent needs to be used with the DaffFormFieldComponent.');\n }\n }\n\n /** @docs-private */\n ngOnInit() {\n this.stateChanges = merge(\n this._stateChanges.asObservable(),\n this.ngControl ? this.ngControl.statusChanges : of(undefined),\n ).pipe(\n map(() => this.state),\n tap((state) => this.disabled = state.disabled),\n );\n }\n\n /** @docs-private */\n get value() {\n return this._elementRef.nativeElement.value;\n }\n}\n","import { NgModule } from '@angular/core';\n\nimport { DaffInputComponent } from './input.component';\n\n/**\n * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n imports: [\n DaffInputComponent,\n ],\n exports: [\n DaffInputComponent,\n ],\n})\nexport class DaffInputModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { ChangeDetectionStrategy, ViewEncapsulation, Component,
|
|
3
|
+
import { ChangeDetectionStrategy, ViewEncapsulation, Component, input, contentChild, NgModule, Directive } from '@angular/core';
|
|
4
4
|
import * as i1 from '@daffodil/design';
|
|
5
5
|
import { DaffArticleEncapsulatedDirective, DaffPrefixDirective, DaffPrefixSuffixModule } from '@daffodil/design';
|
|
6
6
|
|
|
7
|
-
/* eslint-disable quote-props */
|
|
8
7
|
/**
|
|
9
8
|
* A standard list used for grouping generic content.
|
|
10
9
|
*
|
|
@@ -23,14 +22,13 @@ class DaffListComponent {
|
|
|
23
22
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffListComponent, decorators: [{
|
|
24
23
|
type: Component,
|
|
25
24
|
args: [{ selector: 'daff-list', template: '<ng-content></ng-content>', host: {
|
|
26
|
-
|
|
27
|
-
|
|
25
|
+
class: 'daff-list',
|
|
26
|
+
role: 'list',
|
|
28
27
|
}, hostDirectives: [{
|
|
29
28
|
directive: DaffArticleEncapsulatedDirective,
|
|
30
29
|
}], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".daff-list{display:block;margin:0;padding:0}.daff-list .daff-list-item{display:flex;gap:1rem;padding:.75rem 1rem}.daff-list .daff-list-item__content{font-size:1rem;flex-grow:1}.daff-list .daff-list-item__content>*{margin:0;padding:0}.daff-list .daff-list-item__title{font-size:1rem;font-weight:600;line-height:1.5rem;margin:0;padding:0}.daff-list .daff-list-item .daff-prefix{display:flex;align-items:center;height:1.5rem;width:auto}\n"] }]
|
|
31
30
|
}] });
|
|
32
31
|
|
|
33
|
-
/* eslint-disable quote-props */
|
|
34
32
|
/**
|
|
35
33
|
* Individual items within a list.
|
|
36
34
|
*
|
|
@@ -44,7 +42,11 @@ class DaffListItemComponent {
|
|
|
44
42
|
constructor(elementRef) {
|
|
45
43
|
this.elementRef = elementRef;
|
|
46
44
|
/** Whether an item in a `<daff-nav-list>` is the currently active item. */
|
|
47
|
-
this.active = false;
|
|
45
|
+
this.active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
|
|
46
|
+
/**
|
|
47
|
+
* @docs-private
|
|
48
|
+
*/
|
|
49
|
+
this._prefix = contentChild(DaffPrefixDirective, ...(ngDevMode ? [{ debugName: "_prefix" }] : /* istanbul ignore next */ []));
|
|
48
50
|
}
|
|
49
51
|
/**
|
|
50
52
|
* @docs-private
|
|
@@ -53,24 +55,18 @@ class DaffListItemComponent {
|
|
|
53
55
|
return this.elementRef.nativeElement.nodeName.toLowerCase() === 'a';
|
|
54
56
|
}
|
|
55
57
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffListItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
56
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DaffListItemComponent, isStandalone: true, selector: "daff-list-item,a[daff-list-item]", inputs: { active: "active" }, host: { properties: { "class.active": "active", "attr.role": "this._isAnchor ? null : \"listitem\"" }, classAttribute: "daff-list-item" }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true }], ngImport: i0, template: "@if(_prefix) {\n <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-list-item__content\">\n <ng-content></ng-content>\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
58
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DaffListItemComponent, isStandalone: true, selector: "daff-list-item,a[daff-list-item]", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.active": "active()", "attr.role": "this._isAnchor ? null : \"listitem\"" }, classAttribute: "daff-list-item" }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@if(_prefix()) {\n <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-list-item__content\">\n <ng-content></ng-content>\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
57
59
|
}
|
|
58
60
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffListItemComponent, decorators: [{
|
|
59
61
|
type: Component,
|
|
60
62
|
args: [{ selector: 'daff-list-item' + ',' +
|
|
61
63
|
'a[daff-list-item]', host: {
|
|
62
|
-
|
|
63
|
-
'[class.active]': 'active',
|
|
64
|
+
class: 'daff-list-item',
|
|
65
|
+
'[class.active]': 'active()',
|
|
64
66
|
'[attr.role]': 'this._isAnchor ? null : "listitem"',
|
|
65
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if(_prefix) {\n <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-list-item__content\">\n <ng-content></ng-content>\n</div>" }]
|
|
66
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { active: [{
|
|
67
|
-
type: Input
|
|
68
|
-
}], _prefix: [{
|
|
69
|
-
type: ContentChild,
|
|
70
|
-
args: [DaffPrefixDirective]
|
|
71
|
-
}] } });
|
|
67
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if(_prefix()) {\n <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-list-item__content\">\n <ng-content></ng-content>\n</div>" }]
|
|
68
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], _prefix: [{ type: i0.ContentChild, args: [i0.forwardRef(() => DaffPrefixDirective), { isSignal: true }] }] } });
|
|
72
69
|
|
|
73
|
-
/* eslint-disable quote-props */
|
|
74
70
|
/**
|
|
75
71
|
* A navigation list intended for use with anchor elements (`<a>`).
|
|
76
72
|
*
|
|
@@ -89,8 +85,8 @@ class DaffNavListComponent {
|
|
|
89
85
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffNavListComponent, decorators: [{
|
|
90
86
|
type: Component,
|
|
91
87
|
args: [{ selector: 'daff-nav-list', template: '<ng-content></ng-content>', host: {
|
|
92
|
-
|
|
93
|
-
|
|
88
|
+
class: 'daff-nav-list',
|
|
89
|
+
role: 'navigation',
|
|
94
90
|
}, hostDirectives: [
|
|
95
91
|
{
|
|
96
92
|
directive: DaffArticleEncapsulatedDirective,
|
|
@@ -130,7 +126,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
130
126
|
}]
|
|
131
127
|
}] });
|
|
132
128
|
|
|
133
|
-
/* eslint-disable quote-props */
|
|
134
129
|
/**
|
|
135
130
|
* Used to identify the primary title of a list item within a multi-line list.
|
|
136
131
|
*
|
|
@@ -148,7 +143,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
148
143
|
args: [{
|
|
149
144
|
selector: '[daffListItemTitle]',
|
|
150
145
|
host: {
|
|
151
|
-
|
|
146
|
+
class: 'daff-list-item__title',
|
|
152
147
|
},
|
|
153
148
|
}]
|
|
154
149
|
}] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"daffodil-design-list.mjs","sources":["../../../libs/design/list/src/list/list.component.ts","../../../libs/design/list/src/list-item/list-item.component.ts","../../../libs/design/list/src/list-item/list-item.component.html","../../../libs/design/list/src/nav-list/nav-list.component.ts","../../../libs/design/list/src/list.module.ts","../../../libs/design/list/src/list-item-title/list-item-title.directive.ts","../../../libs/design/list/src/list.ts","../../../libs/design/list/src/daffodil-design-list.ts"],"sourcesContent":["import {\n Component,\n ViewEncapsulation,\n ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { DaffArticleEncapsulatedDirective } from '@daffodil/design';\n\n
|
|
1
|
+
{"version":3,"file":"daffodil-design-list.mjs","sources":["../../../libs/design/list/src/list/list.component.ts","../../../libs/design/list/src/list-item/list-item.component.ts","../../../libs/design/list/src/list-item/list-item.component.html","../../../libs/design/list/src/nav-list/nav-list.component.ts","../../../libs/design/list/src/list.module.ts","../../../libs/design/list/src/list-item-title/list-item-title.directive.ts","../../../libs/design/list/src/list.ts","../../../libs/design/list/src/daffodil-design-list.ts"],"sourcesContent":["import {\n Component,\n ViewEncapsulation,\n ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { DaffArticleEncapsulatedDirective } from '@daffodil/design';\n\n/**\n * A standard list used for grouping generic content.\n *\n * @example\n * ```html\n * <daff-list>\n * <daff-list-item>List item</daff-list-item>\n * <daff-list-item>List item</daff-list-item>\n * </daff-list>\n * ```\n */\n@Component({\n selector: 'daff-list',\n template: '<ng-content></ng-content>',\n styleUrls: ['./list.component.scss'],\n host: {\n class: 'daff-list',\n role: 'list',\n },\n hostDirectives: [{\n directive: DaffArticleEncapsulatedDirective,\n }],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffListComponent { }\n","import {\n Component,\n ChangeDetectionStrategy,\n ElementRef,\n contentChild,\n input,\n} from '@angular/core';\n\nimport { DaffPrefixDirective } from '@daffodil/design';\n\n/**\n * Individual items within a list.\n *\n * @example\n * ```html\n * <daff-list-item>Standard list item</daff-list-item>\n * <a href=\"/\" daff-list-item> Linked list item</a>\n * ```\n */\n@Component({\n selector:\n 'daff-list-item' + ',' +\n 'a[daff-list-item]',\n templateUrl: './list-item.component.html',\n host: {\n class: 'daff-list-item',\n '[class.active]': 'active()',\n '[attr.role]': 'this._isAnchor ? null : \"listitem\"',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffListItemComponent {\n /** Whether an item in a `<daff-nav-list>` is the currently active item. */\n active = input(false);\n\n /**\n * @docs-private\n */\n _prefix = contentChild(DaffPrefixDirective);\n\n constructor(private elementRef: ElementRef) {}\n\n /**\n * @docs-private\n */\n get _isAnchor() {\n return this.elementRef.nativeElement.nodeName.toLowerCase() === 'a';\n }\n}\n","@if(_prefix()) {\n <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-list-item__content\">\n <ng-content></ng-content>\n</div>","import {\n Component,\n ViewEncapsulation,\n ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { DaffArticleEncapsulatedDirective } from '@daffodil/design';\n\n/**\n * A navigation list intended for use with anchor elements (`<a>`).\n *\n * @example\n * ```html\n * <daff-nav-list aria-label=\"Sidebar links\">\n * <a href=\"/\" daff-list-item></a>\n * <a href=\"/\" daff-list-item></a>\n * </daff-nav-list>\n * ```\n */\n@Component({\n selector: 'daff-nav-list',\n template: '<ng-content></ng-content>',\n styleUrl: './nav-list.component.scss',\n host: {\n class: 'daff-nav-list',\n role: 'navigation',\n },\n hostDirectives: [\n {\n directive: DaffArticleEncapsulatedDirective,\n },\n ],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n\nexport class DaffNavListComponent {}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffPrefixSuffixModule } from '@daffodil/design';\n\nimport { DaffListComponent } from './list/list.component';\nimport { DaffListItemComponent } from './list-item/list-item.component';\nimport { DaffNavListComponent } from './nav-list/nav-list.component';\n\n/**\n * @deprecated in favor of {@link DAFF_LIST_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n imports: [\n CommonModule,\n DaffListComponent,\n DaffNavListComponent,\n DaffListItemComponent,\n ],\n exports: [\n DaffListComponent,\n DaffNavListComponent,\n DaffListItemComponent,\n DaffPrefixSuffixModule,\n ],\n})\nexport class DaffListModule { }\n","import { Directive } from '@angular/core';\n\n/**\n * Used to identify the primary title of a list item within a multi-line list.\n *\n * @example\n * ```html\n * <div daffListItemTitle>Title</div>\n * ```\n */\n@Directive({\n selector: '[daffListItemTitle]',\n host: {\n class: 'daff-list-item__title',\n },\n})\n\nexport class DaffListItemTitleDirective {}\n","import { DaffPrefixDirective } from '@daffodil/design';\n\nimport { DaffListComponent } from './list/list.component';\nimport { DaffListItemComponent } from './list-item/list-item.component';\nimport { DaffListItemTitleDirective } from './list-item-title/list-item-title.directive';\nimport { DaffNavListComponent } from './nav-list/nav-list.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_LIST_COMPONENTS = <const> [\n DaffListComponent,\n DaffListItemComponent,\n DaffListItemTitleDirective,\n DaffPrefixDirective,\n];\n\n/**\n * @docs-private\n */\nexport const DAFF_NAV_LIST_COMPONENTS = <const> [\n DaffNavListComponent,\n DaffListItemComponent,\n DaffListItemTitleDirective,\n DaffPrefixDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|