@daffodil/design 0.93.1 → 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/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-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-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-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 +14 -17
- 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 +95 -69
- 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/state/skeleton/_mixins.scss +2 -2
- package/scss/theme/default.scss +15 -0
- package/scss/theme.scss +2 -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/src/tag-theme.scss +2 -2
- 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-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 +5 -7
- package/types/daffodil-design-text-snippet.d.ts +9 -9
- package/types/daffodil-design.d.ts +53 -38
- 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,6 +1,5 @@
|
|
|
1
|
-
import * as _fortawesome_fontawesome_common_types from '@fortawesome/fontawesome-common-types';
|
|
2
1
|
import * as i0 from '@angular/core';
|
|
3
|
-
import
|
|
2
|
+
import * as _fortawesome_fontawesome_common_types from '@fortawesome/fontawesome-common-types';
|
|
4
3
|
import * as i1 from '@daffodil/design';
|
|
5
4
|
import { DaffSizableDirective, DaffSizeSmallType, DaffSizeMediumType, DaffSizeLargeType, DaffDisableable, DaffPrefixDirective, DaffStatus, DaffDisableableDirective, DaffStatusableDirective } from '@daffodil/design';
|
|
6
5
|
|
|
@@ -35,7 +34,7 @@ declare class DaffTagComponent implements DaffDisableable {
|
|
|
35
34
|
/**
|
|
36
35
|
* @docs-private
|
|
37
36
|
*/
|
|
38
|
-
_prefix: DaffPrefixDirective
|
|
37
|
+
_prefix: i0.Signal<DaffPrefixDirective>;
|
|
39
38
|
/**
|
|
40
39
|
* @docs-private
|
|
41
40
|
*
|
|
@@ -53,11 +52,11 @@ declare class DaffTagComponent implements DaffDisableable {
|
|
|
53
52
|
* Whether the tag can be dismissed by the user.
|
|
54
53
|
* Displays a close icon if `true`.
|
|
55
54
|
*/
|
|
56
|
-
dismissible: boolean
|
|
55
|
+
dismissible: i0.InputSignalWithTransform<boolean, unknown>;
|
|
57
56
|
/**
|
|
58
57
|
* Emits when the tag is closed.
|
|
59
58
|
*/
|
|
60
|
-
closeTag:
|
|
59
|
+
closeTag: i0.OutputEmitterRef<void>;
|
|
61
60
|
/**
|
|
62
61
|
* @docs-private
|
|
63
62
|
*
|
|
@@ -66,8 +65,7 @@ declare class DaffTagComponent implements DaffDisableable {
|
|
|
66
65
|
onCloseTag(event: Event): void;
|
|
67
66
|
constructor(size: DaffTagSizableDirective, disabledDirective: DaffDisableableDirective, statusable: DaffStatusableDirective);
|
|
68
67
|
static ɵfac: i0.ɵɵFactoryDeclaration<DaffTagComponent, never>;
|
|
69
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DaffTagComponent, "daff-tag", never, { "status": { "alias": "status"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; }, { "closeTag": "closeTag"; }, ["_prefix"], ["[daffPrefix]", "*"], true, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof DaffTagSizableDirective; inputs: { "size": "size"; }; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }, { directive: typeof i1.DaffStatusableDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffDisableableDirective; inputs: { "disabled": "disabled"; }; outputs: {}; }]>;
|
|
70
|
-
static ngAcceptInputType_dismissible: unknown;
|
|
68
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DaffTagComponent, "daff-tag", never, { "status": { "alias": "status"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "closeTag": "closeTag"; }, ["_prefix"], ["[daffPrefix]", "*"], true, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof DaffTagSizableDirective; inputs: { "size": "size"; }; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }, { directive: typeof i1.DaffStatusableDirective; inputs: { "status": "status"; }; outputs: {}; }, { directive: typeof i1.DaffDisableableDirective; inputs: { "disabled": "disabled"; }; outputs: {}; }]>;
|
|
71
69
|
}
|
|
72
70
|
|
|
73
71
|
/**
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { ElementRef
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { ElementRef } from '@angular/core';
|
|
3
3
|
|
|
4
4
|
declare class DaffTextSnippetComponent {
|
|
5
5
|
/**
|
|
6
6
|
* Whether or not the component should render a condensed version of the content.
|
|
7
7
|
*/
|
|
8
|
-
condensed: boolean
|
|
8
|
+
condensed: _angular_core.ModelSignal<boolean>;
|
|
9
9
|
/**
|
|
10
10
|
* The HTML content to render inside the snippet.
|
|
11
11
|
*/
|
|
12
|
-
html: string
|
|
12
|
+
html: _angular_core.InputSignal<string>;
|
|
13
13
|
/**
|
|
14
14
|
* @docs-private
|
|
15
15
|
*/
|
|
@@ -17,21 +17,21 @@ declare class DaffTextSnippetComponent {
|
|
|
17
17
|
/**
|
|
18
18
|
* @docs-private
|
|
19
19
|
*/
|
|
20
|
-
contentRef: ElementRef
|
|
20
|
+
contentRef: _angular_core.Signal<ElementRef<any>>;
|
|
21
21
|
/**
|
|
22
22
|
* @docs-private
|
|
23
23
|
*/
|
|
24
|
-
htmlRef: ElementRef
|
|
24
|
+
htmlRef: _angular_core.Signal<ElementRef<any>>;
|
|
25
25
|
/**
|
|
26
26
|
* An output event that can be used to track the state of the component externally.
|
|
27
27
|
*/
|
|
28
|
-
|
|
28
|
+
toggled: _angular_core.OutputEmitterRef<boolean>;
|
|
29
29
|
/**
|
|
30
30
|
* @docs-private
|
|
31
31
|
*/
|
|
32
32
|
toggleSnippet(): void;
|
|
33
|
-
static ɵfac:
|
|
34
|
-
static ɵcmp:
|
|
33
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DaffTextSnippetComponent, never>;
|
|
34
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DaffTextSnippetComponent, "daff-text-snippet", never, { "condensed": { "alias": "condensed"; "required": false; "isSignal": true; }; "html": { "alias": "html"; "required": false; "isSignal": true; }; }, { "condensed": "condensedChange"; "toggled": "toggled"; }, never, ["*"], true, never>;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
export { DaffTextSnippetComponent };
|
|
@@ -826,9 +826,9 @@ declare class DaffDisableableDirective {
|
|
|
826
826
|
/**
|
|
827
827
|
* Whether the component is disabled.
|
|
828
828
|
*/
|
|
829
|
-
disabled: boolean
|
|
829
|
+
disabled: i0.ModelSignal<boolean>;
|
|
830
830
|
static ɵfac: i0.ɵɵFactoryDeclaration<DaffDisableableDirective, never>;
|
|
831
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffDisableableDirective, "[daffDisableable]", never, { "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
|
|
831
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffDisableableDirective, "[daffDisableable]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; }, never, never, true, never>;
|
|
832
832
|
}
|
|
833
833
|
|
|
834
834
|
/**
|
|
@@ -890,6 +890,21 @@ declare class DaffLoadableDirective {
|
|
|
890
890
|
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffLoadableDirective, "[daffLoadable]", never, { "loading": { "alias": "loading"; "required": false; }; }, {}, never, never, true, never>;
|
|
891
891
|
}
|
|
892
892
|
|
|
893
|
+
/**
|
|
894
|
+
* The public shape of an RTI boundary, exposed to descendant RTI targets.
|
|
895
|
+
*/
|
|
896
|
+
interface DaffRovingTabIndexBoundary {
|
|
897
|
+
/**
|
|
898
|
+
* The name of the group defined by this boundary.
|
|
899
|
+
*/
|
|
900
|
+
readonly effectiveBoundary: Signal<string>;
|
|
901
|
+
}
|
|
902
|
+
/**
|
|
903
|
+
* Allows RTI targets to inject their nearest ancestor boundary without
|
|
904
|
+
* creating a circular import with the boundary directive.
|
|
905
|
+
*/
|
|
906
|
+
declare const DAFF_ROVING_TAB_INDEX_BOUNDARY: InjectionToken<DaffRovingTabIndexBoundary>;
|
|
907
|
+
|
|
893
908
|
declare class DaffRovingTabIndexService {
|
|
894
909
|
private document;
|
|
895
910
|
private readonly _hierarchy;
|
|
@@ -906,39 +921,6 @@ declare class DaffRovingTabIndexService {
|
|
|
906
921
|
static ɵprov: i0.ɵɵInjectableDeclaration<DaffRovingTabIndexService>;
|
|
907
922
|
}
|
|
908
923
|
|
|
909
|
-
/**
|
|
910
|
-
* Defines the boundary of an RTI group.
|
|
911
|
-
*/
|
|
912
|
-
declare class DaffRovingTabIndexBoundaryDirective {
|
|
913
|
-
private groupService;
|
|
914
|
-
private focusTrap;
|
|
915
|
-
/**
|
|
916
|
-
* Don't touch this directly. Use `_uniqueId`.
|
|
917
|
-
*/
|
|
918
|
-
private static _uniqueIdCounter;
|
|
919
|
-
/**
|
|
920
|
-
* Don't touch this directly. Use `_uniqueId`.
|
|
921
|
-
*/
|
|
922
|
-
private _cachedUniqueId;
|
|
923
|
-
private get _uniqueId();
|
|
924
|
-
/**
|
|
925
|
-
* The name of the group for which that this element will act as boundary.
|
|
926
|
-
* Optional, will be autogenerated to a unique name if omitted.
|
|
927
|
-
*/
|
|
928
|
-
readonly rtiBoundary: i0.InputSignal<string>;
|
|
929
|
-
/**
|
|
930
|
-
* The name of the group defined by this boundary.
|
|
931
|
-
*/
|
|
932
|
-
readonly effectiveBoundary: i0.Signal<string>;
|
|
933
|
-
constructor(groupService: DaffRovingTabIndexService, focusTrap: CdkTrapFocus);
|
|
934
|
-
/**
|
|
935
|
-
* @docs-private
|
|
936
|
-
*/
|
|
937
|
-
enterGroup(evt: Event): void;
|
|
938
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<DaffRovingTabIndexBoundaryDirective, never>;
|
|
939
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffRovingTabIndexBoundaryDirective, "[rtiBoundary]", never, { "rtiBoundary": { "alias": "rtiBoundary"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.CdkTrapFocus; inputs: {}; outputs: {}; }, { directive: typeof DaffRovingTabIndexDirective; inputs: {}; outputs: {}; }]>;
|
|
940
|
-
}
|
|
941
|
-
|
|
942
924
|
/**
|
|
943
925
|
* Declares that an element is an RTI target.
|
|
944
926
|
* Automatically applied to `<a>` and `<button>` elements.
|
|
@@ -961,7 +943,7 @@ declare class DaffRovingTabIndexDirective {
|
|
|
961
943
|
* @docs-private
|
|
962
944
|
*/
|
|
963
945
|
readonly tabindex: i0.Signal<0 | -1>;
|
|
964
|
-
constructor(service: DaffRovingTabIndexService, parent:
|
|
946
|
+
constructor(service: DaffRovingTabIndexService, parent: DaffRovingTabIndexBoundary);
|
|
965
947
|
/**
|
|
966
948
|
* @docs-private
|
|
967
949
|
*/
|
|
@@ -978,5 +960,38 @@ declare class DaffRovingTabIndexDirective {
|
|
|
978
960
|
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffRovingTabIndexDirective, "[rti],a,button", never, { "rti": { "alias": "rti"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
979
961
|
}
|
|
980
962
|
|
|
981
|
-
|
|
982
|
-
|
|
963
|
+
/**
|
|
964
|
+
* Defines the boundary of an RTI group.
|
|
965
|
+
*/
|
|
966
|
+
declare class DaffRovingTabIndexBoundaryDirective implements DaffRovingTabIndexBoundary {
|
|
967
|
+
private groupService;
|
|
968
|
+
private focusTrap;
|
|
969
|
+
/**
|
|
970
|
+
* Don't touch this directly. Use `_uniqueId`.
|
|
971
|
+
*/
|
|
972
|
+
private static _uniqueIdCounter;
|
|
973
|
+
/**
|
|
974
|
+
* Don't touch this directly. Use `_uniqueId`.
|
|
975
|
+
*/
|
|
976
|
+
private _cachedUniqueId;
|
|
977
|
+
private get _uniqueId();
|
|
978
|
+
/**
|
|
979
|
+
* The name of the group for which that this element will act as boundary.
|
|
980
|
+
* Optional, will be autogenerated to a unique name if omitted.
|
|
981
|
+
*/
|
|
982
|
+
readonly rtiBoundary: i0.InputSignal<string>;
|
|
983
|
+
/**
|
|
984
|
+
* The name of the group defined by this boundary.
|
|
985
|
+
*/
|
|
986
|
+
readonly effectiveBoundary: i0.Signal<string>;
|
|
987
|
+
constructor(groupService: DaffRovingTabIndexService, focusTrap: CdkTrapFocus);
|
|
988
|
+
/**
|
|
989
|
+
* @docs-private
|
|
990
|
+
*/
|
|
991
|
+
enterGroup(evt: Event): void;
|
|
992
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DaffRovingTabIndexBoundaryDirective, never>;
|
|
993
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<DaffRovingTabIndexBoundaryDirective, "[rtiBoundary]", never, { "rtiBoundary": { "alias": "rtiBoundary"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.CdkTrapFocus; inputs: {}; outputs: {}; }, { directive: typeof DaffRovingTabIndexDirective; inputs: {}; outputs: {}; }]>;
|
|
994
|
+
}
|
|
995
|
+
|
|
996
|
+
export { DAFF_PREFIX_SUFFIX_DIRECTIVES, DAFF_ROVING_TAB_INDEX_BOUNDARY, DAFF_THEME_INITIALIZER, DaffArticleEncapsulatedDirective, DaffBreakpoints, DaffColorableDirective, DaffCompactableDirective, DaffDisableableDirective, DaffFocusStackService, DaffFormLabelDirective, DaffFormLabelModule, DaffLoadableDirective, DaffManageContainerLayoutDirective, DaffOpenableDirective, DaffOrientableDirective, DaffOrientationEnum, DaffPrefixDirective, DaffPrefixSuffixModule, DaffRovingTabIndexBoundaryDirective, DaffRovingTabIndexDirective, DaffSelectableDirective, DaffSizableDirective, DaffSizableEnum, DaffSkeletonableDirective, DaffStatusEnum, DaffStatusableDirective, DaffStickyTrackerDirective, DaffSuffixDirective, DaffTextAlignableDirective, DaffTextAlignmentEnum, DaffTheme, DaffThemingService, NoopBreakpointObserver, SERVER_SAFE_BREAKPOINT_OBSERVER, daffFocusableElementsSelector };
|
|
997
|
+
export type { AnimationStateWithParams, Constructor, DaffColor, DaffColorable, DaffCompactable, DaffDisableable, DaffLazyComponent, DaffOpenable, DaffOrientable, DaffOrientation, DaffPalette, DaffRovingTabIndexBoundary, DaffSelectable, DaffSizable, DaffSizeAllType, DaffSizeLargeType, DaffSizeMediumType, DaffSizeSmallType, DaffSizeXLargeType, DaffSizeXSmallType, DaffStatus, DaffStatusable, DaffTextAlignable, DaffTextAlignment };
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import { CommonModule } from '@angular/common';
|
|
2
|
-
import * as i0 from '@angular/core';
|
|
3
|
-
import { HostBinding, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
4
|
-
import * as i1 from '@daffodil/design';
|
|
5
|
-
import { DaffColorableDirective } from '@daffodil/design';
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* @deprecated in favor of `DaffSpinnerComponent`. Deprecated in version 0.91.1. Will be removed in version 0.94.0.
|
|
9
|
-
*/
|
|
10
|
-
class DaffLoadingIconComponent {
|
|
11
|
-
constructor() {
|
|
12
|
-
/**
|
|
13
|
-
* @docs-private
|
|
14
|
-
*/
|
|
15
|
-
this.class = true;
|
|
16
|
-
}
|
|
17
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: DaffLoadingIconComponent, isStandalone: true, selector: "daff-loading-icon", host: { properties: { "class.daff-loading-icon": "this.class" } }, hostDirectives: [{ directive: i1.DaffColorableDirective, inputs: ["color", "color"] }], ngImport: i0, template: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 100 100\">\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__bg\"></circle>\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__loader\"></circle>\n</svg>", styles: [":host{display:flex;width:100%;max-width:4rem}.daff-loading-icon__loader{animation:circle-rotation linear;animation-duration:1s;animation-iteration-count:infinite;fill:transparent;stroke-dasharray:57.8053048261 400;stroke-linecap:round;stroke-width:.25rem;transform-origin:center}.daff-loading-icon__bg{fill:transparent;stroke-linecap:round;stroke-width:.25rem}@keyframes circle-rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
19
|
-
}
|
|
20
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconComponent, decorators: [{
|
|
21
|
-
type: Component,
|
|
22
|
-
args: [{ selector: 'daff-loading-icon', hostDirectives: [
|
|
23
|
-
{
|
|
24
|
-
directive: DaffColorableDirective,
|
|
25
|
-
inputs: ['color'],
|
|
26
|
-
},
|
|
27
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 100 100\">\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__bg\"></circle>\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__loader\"></circle>\n</svg>", styles: [":host{display:flex;width:100%;max-width:4rem}.daff-loading-icon__loader{animation:circle-rotation linear;animation-duration:1s;animation-iteration-count:infinite;fill:transparent;stroke-dasharray:57.8053048261 400;stroke-linecap:round;stroke-width:.25rem;transform-origin:center}.daff-loading-icon__bg{fill:transparent;stroke-linecap:round;stroke-width:.25rem}@keyframes circle-rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
28
|
-
}], propDecorators: { class: [{
|
|
29
|
-
type: HostBinding,
|
|
30
|
-
args: ['class.daff-loading-icon']
|
|
31
|
-
}] } });
|
|
32
|
-
|
|
33
|
-
/**
|
|
34
|
-
* @deprecated in favor of {@link DAFF_LOADING_ICON_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
|
|
35
|
-
*/
|
|
36
|
-
class DaffLoadingIconModule {
|
|
37
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
38
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconModule, imports: [CommonModule,
|
|
39
|
-
DaffLoadingIconComponent], exports: [DaffLoadingIconComponent] }); }
|
|
40
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconModule, imports: [CommonModule] }); }
|
|
41
|
-
}
|
|
42
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffLoadingIconModule, decorators: [{
|
|
43
|
-
type: NgModule,
|
|
44
|
-
args: [{
|
|
45
|
-
imports: [
|
|
46
|
-
CommonModule,
|
|
47
|
-
DaffLoadingIconComponent,
|
|
48
|
-
],
|
|
49
|
-
exports: [
|
|
50
|
-
DaffLoadingIconComponent,
|
|
51
|
-
],
|
|
52
|
-
}]
|
|
53
|
-
}] });
|
|
54
|
-
|
|
55
|
-
/**
|
|
56
|
-
* @docs-private
|
|
57
|
-
*/
|
|
58
|
-
const DAFF_LOADING_ICON_COMPONENTS = [
|
|
59
|
-
DaffLoadingIconComponent,
|
|
60
|
-
];
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* Generated bundle index. Do not edit.
|
|
64
|
-
*/
|
|
65
|
-
|
|
66
|
-
export { DAFF_LOADING_ICON_COMPONENTS, DaffLoadingIconComponent, DaffLoadingIconModule };
|
|
67
|
-
//# sourceMappingURL=daffodil-design-loading-icon.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"daffodil-design-loading-icon.mjs","sources":["../../../libs/design/loading-icon/src/loading-icon/loading-icon.component.ts","../../../libs/design/loading-icon/src/loading-icon/loading-icon.component.html","../../../libs/design/loading-icon/src/loading-icon.module.ts","../../../libs/design/loading-icon/src/loading-icon.ts","../../../libs/design/loading-icon/src/daffodil-design-loading-icon.ts"],"sourcesContent":["import {\n Component,\n ChangeDetectionStrategy,\n HostBinding,\n} from '@angular/core';\n\nimport { DaffColorableDirective } from '@daffodil/design';\n\n/**\n * @deprecated in favor of `DaffSpinnerComponent`. Deprecated in version 0.91.1. Will be removed in version 0.94.0.\n */\n@Component({\n selector: 'daff-loading-icon',\n templateUrl: './loading-icon.component.html',\n styleUrls: ['./loading-icon.component.scss'],\n hostDirectives: [\n {\n directive: DaffColorableDirective,\n inputs: ['color'],\n },\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffLoadingIconComponent {\n /**\n * @docs-private\n */\n @HostBinding('class.daff-loading-icon') class = true;\n}\n","<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 100 100\">\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__bg\"></circle>\n <circle cx=\"50%\" cy=\"50%\" r=\"46\" class=\"daff-loading-icon__loader\"></circle>\n</svg>","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { DaffLoadingIconComponent } from './loading-icon/loading-icon.component';\n\n/**\n * @deprecated in favor of {@link DAFF_LOADING_ICON_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.\n */\n@NgModule({\n imports: [\n CommonModule,\n DaffLoadingIconComponent,\n ],\n exports: [\n DaffLoadingIconComponent,\n ],\n})\nexport class DaffLoadingIconModule { }\n","import { DaffLoadingIconComponent } from './loading-icon/loading-icon.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_LOADING_ICON_COMPONENTS = <const> [\n DaffLoadingIconComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAQA;;AAEG;MAaU,wBAAwB,CAAA;AAZrC,IAAA,WAAA,GAAA;AAaE;;AAEG;QACqC,IAAA,CAAA,KAAK,GAAG,IAAI;AACrD,IAAA;iIALY,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,wOCvBrC,6QAGM,EAAA,MAAA,EAAA,CAAA,2bAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDoBO,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAZpC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,cAAA,EAGb;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,sBAAsB;4BACjC,MAAM,EAAE,CAAC,OAAO,CAAC;AAClB,yBAAA;qBACF,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,6QAAA,EAAA,MAAA,EAAA,CAAA,2bAAA,CAAA,EAAA;;sBAM9C,WAAW;uBAAC,yBAAyB;;;AEtBxC;;AAEG;MAUU,qBAAqB,CAAA;iIAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAArB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,YAP9B,YAAY;AACZ,YAAA,wBAAwB,aAGxB,wBAAwB,CAAA,EAAA,CAAA,CAAA;AAGf,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,YAP9B,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAOH,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBATjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,wBAAwB;AACzB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,wBAAwB;AACzB,qBAAA;AACF,iBAAA;;;ACdD;;AAEG;AACI,MAAM,4BAA4B,GAAW;IAClD,wBAAwB;;;ACN1B;;AAEG;;;;"}
|
package/loading-icon/README.md
DELETED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
# Loading Icon
|
|
2
|
-
Loading icons are used as an indicator of an event in progress.
|
|
3
|
-
|
|
4
|
-
## Overview
|
|
5
|
-
Loading icons are used to indicate to users that an event is ocurring and is still in progress. They should only be used for short loading processes. For events that can take a considerable amount of time, use the [Progress Bar](/libs/design/progress-bar/README.md) component instead.
|
|
6
|
-
|
|
7
|
-
## Usage
|
|
8
|
-
|
|
9
|
-
### Within a standalone component
|
|
10
|
-
To use loading icon in a standalone component, import `DAFF_LOADING_ICON_COMPONENTS` directly into your custom component:
|
|
11
|
-
|
|
12
|
-
```ts
|
|
13
|
-
import { DAFF_LOADING_ICON_COMPONENTS } from '@daffodil/design/loading-icon';
|
|
14
|
-
|
|
15
|
-
@Component({
|
|
16
|
-
selector: 'custom-component',
|
|
17
|
-
templateUrl: './custom-component.component.html',
|
|
18
|
-
imports: [
|
|
19
|
-
DAFF_LOADING_ICON_COMPONENTS,
|
|
20
|
-
],
|
|
21
|
-
})
|
|
22
|
-
export class CustomComponent {}
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
### Within a module (deprecated)
|
|
26
|
-
To use loading icon in a module, import `DaffLoadingIconModule` into your custom module:
|
|
27
|
-
|
|
28
|
-
```ts
|
|
29
|
-
import { NgModule } from '@angular/core';
|
|
30
|
-
import { DaffLoadingIconModule } from '@daffodil/design/loading-icon';
|
|
31
|
-
import { CustomComponent } from './custom.component';
|
|
32
|
-
|
|
33
|
-
@NgModule({
|
|
34
|
-
declarations: [
|
|
35
|
-
CustomComponent,
|
|
36
|
-
],
|
|
37
|
-
exports: [
|
|
38
|
-
CustomComponent,
|
|
39
|
-
],
|
|
40
|
-
imports: [
|
|
41
|
-
DaffLoadingIconModule,
|
|
42
|
-
],
|
|
43
|
-
})
|
|
44
|
-
export class CustomComponentModule { }
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
> This method is deprecated. It's recommended to update all custom components to standalone.
|
|
48
|
-
|
|
49
|
-
## Colors
|
|
50
|
-
Use the `color` property to change the color of a loading icon. The default color is gray.
|
|
51
|
-
|
|
52
|
-
> `theme` and `white` should be used on a darker background in order to have sufficient contrast.
|
|
53
|
-
|
|
54
|
-
<daff-docs-example-viewer example="loading-icon-color"></daff-docs-example-viewer>
|
|
55
|
-
|
|
56
|
-
## Accessibility
|
|
57
|
-
Loading icons should be given meaningful labels by using `aria-label` or `aria-labelledby`.
|
|
58
|
-
|
|
59
|
-
If a loading icon is used to indicate a process in progress, using [aria-live](https://www.w3.org/TR/wai-aria-1.0/states_and_properties#aria-live) and [aria-busy](https://www.w3.org/TR/wai-aria-1.0/states_and_properties#aria-busy") should be strongly considered.
|
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
@use '../../scss/theming' as *;
|
|
2
|
-
|
|
3
|
-
@mixin daff-loading-icon-light-variant($loader-color) {
|
|
4
|
-
.daff-loading-icon__loader {
|
|
5
|
-
stroke: $loader-color;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.daff-loading-icon__bg {
|
|
9
|
-
stroke: rgba($loader-color, 0.1);
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
@mixin daff-loading-icon-dark-variant($loader-color) {
|
|
14
|
-
.daff-loading-icon__loader {
|
|
15
|
-
stroke: $loader-color;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.daff-loading-icon__bg {
|
|
19
|
-
stroke: rgba($loader-color, 0.3);
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
@mixin daff-loading-icon-theme($theme) {
|
|
24
|
-
$primary: daff-get-palette($theme, primary);
|
|
25
|
-
$secondary: daff-get-palette($theme, secondary);
|
|
26
|
-
$tertiary: daff-get-palette($theme, tertiary);
|
|
27
|
-
$base: daff-get-base-color($theme, base);
|
|
28
|
-
$base-contrast: daff-get-base-color($theme, base-contrast);
|
|
29
|
-
$white: daff-get-base-color($theme, 'white');
|
|
30
|
-
$black: daff-get-base-color($theme, 'black');
|
|
31
|
-
$neutral: daff-get-palette($theme, neutral);
|
|
32
|
-
$mode: daff-get-theme-mode($theme);
|
|
33
|
-
|
|
34
|
-
.daff-loading-icon {
|
|
35
|
-
@include light($mode) {
|
|
36
|
-
@include daff-loading-icon-light-variant(
|
|
37
|
-
daff-color($neutral, 60)
|
|
38
|
-
);
|
|
39
|
-
|
|
40
|
-
&.daff-primary {
|
|
41
|
-
@include daff-loading-icon-light-variant(daff-color($primary));
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
&.daff-secondary {
|
|
45
|
-
@include daff-loading-icon-light-variant(
|
|
46
|
-
daff-color($secondary)
|
|
47
|
-
);
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
&.daff-tertiary {
|
|
51
|
-
@include daff-loading-icon-light-variant(daff-color($tertiary));
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
&.daff-theme {
|
|
55
|
-
@include daff-loading-icon-light-variant($base);
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
&.daff-theme-contrast {
|
|
59
|
-
@include daff-loading-icon-light-variant($base-contrast);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
&.daff-black {
|
|
63
|
-
@include daff-loading-icon-light-variant($black);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
&.daff-white {
|
|
67
|
-
@include daff-loading-icon-light-variant($white);
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
@include dark($mode) {
|
|
72
|
-
@include daff-loading-icon-dark-variant(daff-color($neutral, 40));
|
|
73
|
-
|
|
74
|
-
&.daff-primary {
|
|
75
|
-
@include daff-loading-icon-dark-variant(daff-color($primary));
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
&.daff-secondary {
|
|
79
|
-
@include daff-loading-icon-dark-variant(daff-color($secondary));
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
&.daff-tertiary {
|
|
83
|
-
@include daff-loading-icon-dark-variant(daff-color($tertiary));
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
&.daff-theme {
|
|
87
|
-
@include daff-loading-icon-dark-variant($base);
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
&.daff-theme-contrast {
|
|
91
|
-
@include daff-loading-icon-dark-variant($base-contrast);
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
&.daff-black {
|
|
95
|
-
@include daff-loading-icon-dark-variant($black);
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
&.daff-white {
|
|
99
|
-
@include daff-loading-icon-dark-variant($white);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
}
|
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
@use 'sass:list';
|
|
2
|
-
@use 'sass:map';
|
|
3
|
-
@use 'sass:math';
|
|
4
|
-
@use 'sass:meta';
|
|
5
|
-
@use '../contrast/luminance/luminance';
|
|
6
|
-
|
|
7
|
-
/// @deprecated Deprecated in version 0.87.0. Will be removed in version 0.90.0.
|
|
8
|
-
///
|
|
9
|
-
/// Take a numeric map and sort it.
|
|
10
|
-
///
|
|
11
|
-
/// https://gist.github.com/Jakobud/a0ac11e80a1de453cd86f0d3fc0a1410
|
|
12
|
-
/// Credit to: https://gist.github.com/iamandrewluca
|
|
13
|
-
///
|
|
14
|
-
@function _daff-illuminate-sort($map) {
|
|
15
|
-
// Transform map to zipped list
|
|
16
|
-
$keys: ();
|
|
17
|
-
$values: ();
|
|
18
|
-
|
|
19
|
-
@each $key, $val in $map {
|
|
20
|
-
$keys: list.append($keys, $key);
|
|
21
|
-
$values: list.append($values, $val);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
$list: list.zip($keys, $values);
|
|
25
|
-
|
|
26
|
-
$sorted-map: ();
|
|
27
|
-
|
|
28
|
-
@while list.length($list) > 0 {
|
|
29
|
-
// Find smallest pair
|
|
30
|
-
$smallest-pair: list.nth($list, 1);
|
|
31
|
-
|
|
32
|
-
@each $pair in $list {
|
|
33
|
-
$value: list.nth($pair, 2);
|
|
34
|
-
$smallest-value: list.nth($smallest-pair, 2);
|
|
35
|
-
|
|
36
|
-
@if $value < $smallest-value {
|
|
37
|
-
$smallest-pair: $pair;
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
// Add smallest pair to sorted map
|
|
42
|
-
$key: list.nth($smallest-pair, 1);
|
|
43
|
-
$value: list.nth($smallest-pair, 2);
|
|
44
|
-
$sorted-map: map.merge(
|
|
45
|
-
$sorted-map,
|
|
46
|
-
(
|
|
47
|
-
$key: $value
|
|
48
|
-
)
|
|
49
|
-
);
|
|
50
|
-
|
|
51
|
-
// Remove from list smallest pair
|
|
52
|
-
$smallest-pair-index: list.index($list, $smallest-pair);
|
|
53
|
-
$new-list: ();
|
|
54
|
-
|
|
55
|
-
@for $i from 1 through list.length($list) {
|
|
56
|
-
@if $i != $smallest-pair-index {
|
|
57
|
-
$new-list: list.append($new-list, list.nth($list, $i), 'space');
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
$list: $new-list;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
@return $sorted-map;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
// Given a map of key, luminance pairs, find the key
|
|
68
|
-
// of the value that is "nth" away from zero.
|
|
69
|
-
//
|
|
70
|
-
// @param $map: a map of key, luminance pairs,
|
|
71
|
-
// @param $nth: nth steps away from zero
|
|
72
|
-
@function _daff-illuminate-get-key($map, $nth: 1) {
|
|
73
|
-
//Cap off "nth" to prevent going out-of-bounds.
|
|
74
|
-
@if ($nth > list.length($map)) {
|
|
75
|
-
$nth: list.length(map);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
$map: _daff-illuminate-sort($map);
|
|
79
|
-
@return list.nth(list.nth($map, $nth), 1);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
// Takes a $color and palette and returns the color in
|
|
83
|
-
// the palette which would "illuminate" against that color.
|
|
84
|
-
//
|
|
85
|
-
// @usage
|
|
86
|
-
// ```
|
|
87
|
-
// daff-illuminate($palette);
|
|
88
|
-
// ```
|
|
89
|
-
//
|
|
90
|
-
@function daff-illuminate($color, $palette, $nth: 1) {
|
|
91
|
-
$luminance-map: ();
|
|
92
|
-
|
|
93
|
-
//Validate
|
|
94
|
-
@each $key, $palette-color in $palette {
|
|
95
|
-
@if (meta.type-of($key) == 'string') {
|
|
96
|
-
$palette: map.remove($palette, $key);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
//Transform into usable values
|
|
101
|
-
@each $key, $palette-color in $palette {
|
|
102
|
-
$luminance-map: map.merge(
|
|
103
|
-
$luminance-map,
|
|
104
|
-
(
|
|
105
|
-
$key: (
|
|
106
|
-
luminance.daff-luminance($palette-color) - luminance.daff-luminance($color)
|
|
107
|
-
)
|
|
108
|
-
)
|
|
109
|
-
);
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
//Calculate which color to get
|
|
114
|
-
$brighter-colors: ();
|
|
115
|
-
$darker-colors: ();
|
|
116
|
-
|
|
117
|
-
@each $key, $luminance in $luminance-map {
|
|
118
|
-
@if ($luminance > 0) {
|
|
119
|
-
$brighter-colors: map.merge(
|
|
120
|
-
$brighter-colors,
|
|
121
|
-
(
|
|
122
|
-
$key: $luminance
|
|
123
|
-
)
|
|
124
|
-
);
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
@if ($luminance < 0) {
|
|
128
|
-
$darker-colors: map.merge(
|
|
129
|
-
$darker-colors,
|
|
130
|
-
(
|
|
131
|
-
$key: math.abs($luminance)
|
|
132
|
-
)
|
|
133
|
-
);
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
$key: null;
|
|
138
|
-
|
|
139
|
-
@if (luminance.daff-luminance($color) >= 0.5) {
|
|
140
|
-
//If the color is bright
|
|
141
|
-
$key: _daff-illuminate-get-key($darker-colors, $nth);
|
|
142
|
-
}
|
|
143
|
-
@else {
|
|
144
|
-
//If the color is dark
|
|
145
|
-
$key: _daff-illuminate-get-key($brighter-colors, $nth);
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
@return map.get($palette, $key);
|
|
149
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
@use 'true' as *;
|
|
2
|
-
|
|
3
|
-
@include describe('illuminate') {
|
|
4
|
-
//stylelint-disable
|
|
5
|
-
@include it('should return a lighter color if the color is dark') {
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
@include it('should return a darker color if the color is light') {
|
|
9
|
-
|
|
10
|
-
}
|
|
11
|
-
@include it('should return the expected color for given scenarios') {
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
//stylelint-enable
|
|
15
|
-
}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import * as i0 from '@angular/core';
|
|
2
|
-
import * as i1$1 from '@angular/common';
|
|
3
|
-
import * as i1 from '@daffodil/design';
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* @deprecated in favor of `DaffSpinnerComponent`. Deprecated in version 0.91.1. Will be removed in version 0.94.0.
|
|
7
|
-
*/
|
|
8
|
-
declare class DaffLoadingIconComponent {
|
|
9
|
-
/**
|
|
10
|
-
* @docs-private
|
|
11
|
-
*/
|
|
12
|
-
class: boolean;
|
|
13
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<DaffLoadingIconComponent, never>;
|
|
14
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DaffLoadingIconComponent, "daff-loading-icon", never, {}, {}, never, never, true, [{ directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }]>;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
/**
|
|
18
|
-
* @deprecated in favor of {@link DAFF_LOADING_ICON_COMPONENTS}. Deprecated in version 0.78.0. Will be removed in version 1.0.0.
|
|
19
|
-
*/
|
|
20
|
-
declare class DaffLoadingIconModule {
|
|
21
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<DaffLoadingIconModule, never>;
|
|
22
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<DaffLoadingIconModule, never, [typeof i1$1.CommonModule, typeof DaffLoadingIconComponent], [typeof DaffLoadingIconComponent]>;
|
|
23
|
-
static ɵinj: i0.ɵɵInjectorDeclaration<DaffLoadingIconModule>;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
/**
|
|
27
|
-
* @docs-private
|
|
28
|
-
*/
|
|
29
|
-
declare const DAFF_LOADING_ICON_COMPONENTS: readonly [typeof DaffLoadingIconComponent];
|
|
30
|
-
|
|
31
|
-
export { DAFF_LOADING_ICON_COMPONENTS, DaffLoadingIconComponent, DaffLoadingIconModule };
|