@spicainternational/ngx-sds-components 5.9.2 → 5.10.1
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/esm2020/public-api.mjs +3 -1
- package/esm2020/src/lib/badge/badge.directive.mjs +88 -0
- package/esm2020/src/lib/badge/badge.module.mjs +29 -0
- package/esm2020/src/lib/badge/badge.types.mjs +2 -0
- package/esm2020/src/lib/badge/components/badge.component.mjs +59 -0
- package/esm2020/src/lib/badge/public-api.mjs +3 -0
- package/esm2020/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.mjs +5 -0
- package/esm2020/src/lib/date-picker/date-picker.component.mjs +65 -15
- package/esm2020/src/lib/expansion-panel/expansion-panel.component.mjs +37 -11
- package/esm2020/src/lib/expansion-panel/expansion-panel.module.mjs +11 -20
- package/esm2020/src/lib/expansion-panel/expansion-panel.types.mjs +2 -0
- package/esm2020/src/lib/modal/dialog/dialog.component.mjs +11 -5
- package/esm2020/src/lib/modal/dialog/dialog.types.mjs +2 -0
- package/esm2020/src/lib/quick-info/quick-info.component.mjs +47 -10
- package/esm2020/src/lib/side-bar/side-bar.component.mjs +11 -4
- package/esm2020/src/lib/side-bar/side-bar.module.mjs +5 -4
- package/esm2020/src/lib/tooltip/components/tooltip.component.mjs +5 -4
- package/esm2020/src/lib/tooltip/tooltip.directive.mjs +28 -2
- package/esm2020/src/lib/tooltip/tooltip.module.mjs +8 -4
- package/esm2020/src/lib/tooltip/tooltip.types.mjs +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs +176 -0
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs.map +1 -0
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-date-picker.mjs +64 -14
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-date-picker.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs +45 -28
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs +10 -4
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-quick-info.mjs +46 -9
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-quick-info.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-side-bar.mjs +14 -6
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-side-bar.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-tooltip.mjs +38 -7
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-tooltip.mjs.map +1 -1
- package/fesm2015/spicainternational-ngx-sds-components.mjs +2 -0
- package/fesm2015/spicainternational-ngx-sds-components.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs +176 -0
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs.map +1 -0
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-date-picker.mjs +64 -14
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-date-picker.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs +45 -28
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs +10 -4
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-quick-info.mjs +46 -9
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-quick-info.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-side-bar.mjs +14 -6
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-side-bar.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-tooltip.mjs +38 -7
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-tooltip.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components.mjs +2 -0
- package/fesm2020/spicainternational-ngx-sds-components.mjs.map +1 -1
- package/package.json +9 -1
- package/public-api.d.ts +2 -0
- package/src/lib/badge/badge.directive.d.ts +23 -0
- package/src/lib/badge/badge.module.d.ts +9 -0
- package/src/lib/badge/badge.types.d.ts +2 -0
- package/src/lib/badge/components/badge.component.d.ts +23 -0
- package/src/lib/badge/package.json +10 -0
- package/src/lib/badge/public-api.d.ts +2 -0
- package/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.d.ts +5 -0
- package/src/lib/date-picker/date-picker.component.d.ts +12 -2
- package/src/lib/expansion-panel/expansion-panel.component.d.ts +21 -6
- package/src/lib/expansion-panel/expansion-panel.module.d.ts +5 -5
- package/src/lib/expansion-panel/expansion-panel.types.d.ts +1 -0
- package/src/lib/modal/dialog/dialog.component.d.ts +5 -2
- package/src/lib/modal/dialog/dialog.types.d.ts +1 -0
- package/src/lib/quick-info/quick-info.component.d.ts +11 -2
- package/src/lib/side-bar/side-bar.component.d.ts +5 -1
- package/src/lib/side-bar/side-bar.module.d.ts +2 -1
- package/src/lib/tooltip/components/tooltip.component.d.ts +4 -1
- package/src/lib/tooltip/tooltip.directive.d.ts +7 -3
- package/src/lib/tooltip/tooltip.module.d.ts +2 -1
- package/src/lib/tooltip/tooltip.types.d.ts +1 -1
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { Component, Directive, Input, HostListener, NgModule } from '@angular/core';
|
|
3
|
-
import * as
|
|
3
|
+
import * as i2 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
+
import * as i1 from '@fortawesome/angular-fontawesome';
|
|
6
|
+
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
5
7
|
|
|
6
8
|
class SdsTooltipComponent {
|
|
7
9
|
constructor() {
|
|
@@ -15,10 +17,10 @@ class SdsTooltipComponent {
|
|
|
15
17
|
ngOnInit() { }
|
|
16
18
|
}
|
|
17
19
|
SdsTooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
-
SdsTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsTooltipComponent, selector: "
|
|
20
|
+
SdsTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsTooltipComponent, selector: "ng-component", ngImport: i0, template: "<div class=\"sds-tooltip\"\r\n [ngClass]=\"['sds-tooltip-' + position, 'sds-tooltip-' + theme, tooltipClass]\"\r\n [class.sds-tooltip-visible]=\"visible\"\r\n [style.left.px]=\"left\"\r\n [style.top.px]=\"top\"\r\n >\r\n <fa-icon class=\"sds-tooltip-icon\"\r\n *ngIf=\"tooltipIcon\" \r\n [icon]=\"tooltipIcon\">\r\n </fa-icon>\r\n\r\n <small class=\"sds-tooltip-text\">\r\n {{ tooltip }}\r\n </small>\r\n\r\n</div>\r\n", styles: [".sds-tooltip{position:fixed;background-color:#000;border-radius:4px;color:#fff;padding:3px 6px;max-width:15rem;z-index:1070;opacity:0}.sds-tooltip fa-icon{margin-right:.25rem}.sds-tooltip:before{content:\"\";width:0;height:0;position:absolute}.sds-tooltip-visible{opacity:1;transition:opacity .3s}.sds-tooltip-light{background-color:#e9ecef;color:#000}.sds-tooltip-light:before{border:5px solid #E9ECEF}.sds-tooltip-dark{background-color:#000;color:#fff}.sds-tooltip-dark:before{border:5px solid black}.sds-tooltip-danger{background-color:#cc5252;color:#fff}.sds-tooltip-danger:before{border:5px solid #cc5252}.sds-tooltip-success{background-color:#29ba60;color:#fff}.sds-tooltip-success:before{border:5px solid #29ba60}.sds-tooltip-warning{background-color:#ffc107;color:#212529}.sds-tooltip-warning:before{border:5px solid #ffc107}.sds-tooltip-info{background-color:#56ace0;color:#fff}.sds-tooltip-info:before{border:5px solid #56ace0}.sds-tooltip-below{transform:translate(-50%);margin-top:.5rem}.sds-tooltip-below:before{border-left-color:transparent;border-right-color:transparent;border-top:none;left:calc(50% - 5px);top:-4px}.sds-tooltip-above{transform:translate(-50%,calc(-100% - .5rem));margin-bottom:.5rem}.sds-tooltip-above:before{border-left-color:transparent;border-right-color:transparent;border-bottom:none;left:calc(50% - 5px);bottom:-4px}.sds-tooltip-left{transform:translate(calc(-100% - .5rem),-50%)}.sds-tooltip-left:before{border-top-color:transparent;border-bottom-color:transparent;border-right:none;right:-4px;top:calc(50% - 5px)}.sds-tooltip-right{transform:translateY(-50%);margin-left:.5rem}.sds-tooltip-right:before{border-top-color:transparent;border-bottom-color:transparent;border-left:none;left:-4px;top:calc(50% - 5px)}.sds-tooltip-dynamic{margin-left:20px}.sds-tooltip-dynamic:before{display:none}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
19
21
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipComponent, decorators: [{
|
|
20
22
|
type: Component,
|
|
21
|
-
args: [{
|
|
23
|
+
args: [{ template: "<div class=\"sds-tooltip\"\r\n [ngClass]=\"['sds-tooltip-' + position, 'sds-tooltip-' + theme, tooltipClass]\"\r\n [class.sds-tooltip-visible]=\"visible\"\r\n [style.left.px]=\"left\"\r\n [style.top.px]=\"top\"\r\n >\r\n <fa-icon class=\"sds-tooltip-icon\"\r\n *ngIf=\"tooltipIcon\" \r\n [icon]=\"tooltipIcon\">\r\n </fa-icon>\r\n\r\n <small class=\"sds-tooltip-text\">\r\n {{ tooltip }}\r\n </small>\r\n\r\n</div>\r\n", styles: [".sds-tooltip{position:fixed;background-color:#000;border-radius:4px;color:#fff;padding:3px 6px;max-width:15rem;z-index:1070;opacity:0}.sds-tooltip fa-icon{margin-right:.25rem}.sds-tooltip:before{content:\"\";width:0;height:0;position:absolute}.sds-tooltip-visible{opacity:1;transition:opacity .3s}.sds-tooltip-light{background-color:#e9ecef;color:#000}.sds-tooltip-light:before{border:5px solid #E9ECEF}.sds-tooltip-dark{background-color:#000;color:#fff}.sds-tooltip-dark:before{border:5px solid black}.sds-tooltip-danger{background-color:#cc5252;color:#fff}.sds-tooltip-danger:before{border:5px solid #cc5252}.sds-tooltip-success{background-color:#29ba60;color:#fff}.sds-tooltip-success:before{border:5px solid #29ba60}.sds-tooltip-warning{background-color:#ffc107;color:#212529}.sds-tooltip-warning:before{border:5px solid #ffc107}.sds-tooltip-info{background-color:#56ace0;color:#fff}.sds-tooltip-info:before{border:5px solid #56ace0}.sds-tooltip-below{transform:translate(-50%);margin-top:.5rem}.sds-tooltip-below:before{border-left-color:transparent;border-right-color:transparent;border-top:none;left:calc(50% - 5px);top:-4px}.sds-tooltip-above{transform:translate(-50%,calc(-100% - .5rem));margin-bottom:.5rem}.sds-tooltip-above:before{border-left-color:transparent;border-right-color:transparent;border-bottom:none;left:calc(50% - 5px);bottom:-4px}.sds-tooltip-left{transform:translate(calc(-100% - .5rem),-50%)}.sds-tooltip-left:before{border-top-color:transparent;border-bottom-color:transparent;border-right:none;right:-4px;top:calc(50% - 5px)}.sds-tooltip-right{transform:translateY(-50%);margin-left:.5rem}.sds-tooltip-right:before{border-top-color:transparent;border-bottom-color:transparent;border-left:none;left:-4px;top:calc(50% - 5px)}.sds-tooltip-dynamic{margin-left:20px}.sds-tooltip-dynamic:before{display:none}\n"] }]
|
|
22
24
|
}], ctorParameters: function () { return []; } });
|
|
23
25
|
|
|
24
26
|
class TooltipDirective {
|
|
@@ -30,6 +32,7 @@ class TooltipDirective {
|
|
|
30
32
|
this.componentFactoryResolver = componentFactoryResolver;
|
|
31
33
|
this.injector = injector;
|
|
32
34
|
this.tooltip = '';
|
|
35
|
+
this.tooltipClass = '';
|
|
33
36
|
this.position = 'above';
|
|
34
37
|
this.theme = 'dark';
|
|
35
38
|
this.showDelay = 0;
|
|
@@ -40,6 +43,23 @@ class TooltipDirective {
|
|
|
40
43
|
// this.setHideTooltipTimeout();
|
|
41
44
|
// });
|
|
42
45
|
}
|
|
46
|
+
ngOnChanges(changes) {
|
|
47
|
+
if (changes['tooltip']) {
|
|
48
|
+
if (this.componentRef !== null) {
|
|
49
|
+
this.componentRef.instance.tooltip = this.tooltip;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
if (changes['tooltipIcon']) {
|
|
53
|
+
if (this.componentRef !== null) {
|
|
54
|
+
this.componentRef.instance.tooltipIcon = this.tooltipIcon;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
if (changes['tooltipClass']) {
|
|
58
|
+
if (this.componentRef !== null) {
|
|
59
|
+
this.componentRef.instance.tooltipClass = this.tooltipClass;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
43
63
|
onMouseEnter() {
|
|
44
64
|
this.initializeTooltip();
|
|
45
65
|
}
|
|
@@ -62,6 +82,8 @@ class TooltipDirective {
|
|
|
62
82
|
this.componentRef.instance.left = $event.clientX;
|
|
63
83
|
this.componentRef.instance.top = $event.clientY;
|
|
64
84
|
this.componentRef.instance.tooltip = this.tooltip;
|
|
85
|
+
this.componentRef.instance.tooltipIcon = this.tooltipIcon;
|
|
86
|
+
this.componentRef.instance.tooltipClass = this.tooltipClass;
|
|
65
87
|
}
|
|
66
88
|
}
|
|
67
89
|
onTouchStart($event) {
|
|
@@ -90,6 +112,8 @@ class TooltipDirective {
|
|
|
90
112
|
setTooltipComponentProperties() {
|
|
91
113
|
if (this.componentRef !== null) {
|
|
92
114
|
this.componentRef.instance.tooltip = this.tooltip;
|
|
115
|
+
this.componentRef.instance.tooltipIcon = this.tooltipIcon;
|
|
116
|
+
this.componentRef.instance.tooltipClass = this.tooltipClass;
|
|
93
117
|
this.componentRef.instance.position = this.position;
|
|
94
118
|
this.componentRef.instance.theme = this.theme;
|
|
95
119
|
const { left, right, top, bottom } = this.elementRef.nativeElement.getBoundingClientRect();
|
|
@@ -142,7 +166,7 @@ class TooltipDirective {
|
|
|
142
166
|
}
|
|
143
167
|
}
|
|
144
168
|
TooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive });
|
|
145
|
-
TooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.1", type: TooltipDirective, selector: "[sdsTooltip]", inputs: { tooltip: "tooltip", position: "position", theme: "theme", showDelay: "showDelay", hideDelay: "hideDelay" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "mousemove": "onMouseMove($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd()" } }, ngImport: i0 });
|
|
169
|
+
TooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.1", type: TooltipDirective, selector: "[sdsTooltip]", inputs: { tooltip: "tooltip", tooltipClass: "tooltipClass", tooltipIcon: "tooltipIcon", position: "position", theme: "theme", showDelay: "showDelay", hideDelay: "hideDelay" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "mousemove": "onMouseMove($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd()" } }, usesOnChanges: true, ngImport: i0 });
|
|
146
170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TooltipDirective, decorators: [{
|
|
147
171
|
type: Directive,
|
|
148
172
|
args: [{
|
|
@@ -150,6 +174,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
150
174
|
}]
|
|
151
175
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; }, propDecorators: { tooltip: [{
|
|
152
176
|
type: Input
|
|
177
|
+
}], tooltipClass: [{
|
|
178
|
+
type: Input
|
|
179
|
+
}], tooltipIcon: [{
|
|
180
|
+
type: Input
|
|
153
181
|
}], position: [{
|
|
154
182
|
type: Input
|
|
155
183
|
}], theme: [{
|
|
@@ -179,9 +207,11 @@ class SdsTooltipModule {
|
|
|
179
207
|
}
|
|
180
208
|
SdsTooltipModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
181
209
|
SdsTooltipModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipModule, declarations: [SdsTooltipComponent,
|
|
182
|
-
TooltipDirective], imports: [CommonModule
|
|
210
|
+
TooltipDirective], imports: [CommonModule,
|
|
211
|
+
FontAwesomeModule], exports: [TooltipDirective] });
|
|
183
212
|
SdsTooltipModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipModule, imports: [[
|
|
184
|
-
CommonModule
|
|
213
|
+
CommonModule,
|
|
214
|
+
FontAwesomeModule
|
|
185
215
|
]] });
|
|
186
216
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsTooltipModule, decorators: [{
|
|
187
217
|
type: NgModule,
|
|
@@ -191,7 +221,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
|
|
|
191
221
|
TooltipDirective
|
|
192
222
|
],
|
|
193
223
|
imports: [
|
|
194
|
-
CommonModule
|
|
224
|
+
CommonModule,
|
|
225
|
+
FontAwesomeModule
|
|
195
226
|
],
|
|
196
227
|
exports: [
|
|
197
228
|
TooltipDirective
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-tooltip.mjs","sources":["../../../projects/ngx-sds-components/src/lib/tooltip/components/tooltip.component.ts","../../../projects/ngx-sds-components/src/lib/tooltip/components/tooltip.component.html","../../../projects/ngx-sds-components/src/lib/tooltip/tooltip.directive.ts","../../../projects/ngx-sds-components/src/lib/tooltip/tooltip.module.ts","../../../projects/ngx-sds-components/src/lib/tooltip/spicainternational-ngx-sds-components-src-lib-tooltip.ts"],"sourcesContent":["import { Component, OnInit } from '@angular/core';\r\nimport { TooltipPosition, TooltipTheme } from '../tooltip.types';\r\n\r\n@Component({\r\n selector: 'sds-tooltip',\r\n templateUrl: './tooltip.component.html',\r\n styleUrls: ['./tooltip.component.scss'],\r\n})\r\nexport class SdsTooltipComponent implements OnInit {\r\n\r\n public tooltip: string = '';\r\n public left: number = 0;\r\n public top: number = 0;\r\n public visible: boolean = false;\r\n\r\n public position: TooltipPosition = 'above';\r\n public theme: TooltipTheme = 'dark';\r\n\r\n\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n}\r\n","<div class=\"sds-tooltip\"\r\n [ngClass]=\"['sds-tooltip-' + position, 'sds-tooltip-' + theme]\"\r\n [class.sds-tooltip-visible]=\"visible\"\r\n [style.left.px]=\"left\"\r\n [style.top.px]=\"top\"\r\n >\r\n <small>\r\n {{ tooltip }}\r\n </small>\r\n</div>\r\n","import {\r\n ApplicationRef,\r\n ComponentFactoryResolver,\r\n ComponentRef,\r\n Directive,\r\n ElementRef,\r\n EmbeddedViewRef,\r\n HostListener,\r\n Injector,\r\n Input,\r\n Renderer2,\r\n ViewContainerRef,\r\n} from '@angular/core';\r\nimport { SdsTooltipComponent } from './components/tooltip.component';\r\nimport { TooltipPosition, TooltipTheme } from './tooltip.types';\r\n\r\n@Directive({\r\n selector: '[sdsTooltip]',\r\n})\r\nexport class TooltipDirective {\r\n @Input() tooltip = '';\r\n @Input() position: TooltipPosition = 'above';\r\n @Input() theme: TooltipTheme = 'dark';\r\n @Input() showDelay = 0;\r\n @Input() hideDelay = 0;\r\n\r\n private componentRef: ComponentRef<any> | null = null;\r\n private showTimeout?: number;\r\n private hideTimeout?: number;\r\n private touchTimeout?: number;\r\n\r\n\r\n constructor(\r\n private elementRef: ElementRef,\r\n private appRef: ApplicationRef,\r\n private componentFactoryResolver: ComponentFactoryResolver,\r\n // private viewContainerRef: ViewContainerRef,\r\n private injector: Injector,\r\n // private renderer2: Renderer2\r\n ) {\r\n // this.renderer2.listen('window', 'scroll', (_) => {\r\n // console.log('scroll');\r\n // this.setHideTooltipTimeout();\r\n // });\r\n }\r\n\r\n @HostListener('mouseenter')\r\n onMouseEnter(): void {\r\n this.initializeTooltip();\r\n }\r\n\r\n @HostListener('mouseleave')\r\n onMouseLeave(): void {\r\n this.setHideTooltipTimeout();\r\n }\r\n\r\n // @HostListener(\"window:scroll\", [])\r\n // onWindowScroll() {\r\n // console.log('scroll');\r\n // this.setHideTooltipTimeout();\r\n // }\r\n\r\n // @HostListener('window:scroll') onScroll(e: Event): void {\r\n // console.log((e.target as Element).scrollTop);\r\n // }\r\n\r\n // @HostListener('scroll') onScrollHost(e: Event): void {\r\n // console.log((e.target as Element).scrollTop);\r\n // }\r\n\r\n @HostListener('mousemove', ['$event'])\r\n onMouseMove($event: MouseEvent): void {\r\n if (this.componentRef !== null && this.position === 'dynamic') {\r\n this.componentRef.instance.left = $event.clientX;\r\n this.componentRef.instance.top = $event.clientY;\r\n this.componentRef.instance.tooltip = this.tooltip;\r\n }\r\n }\r\n\r\n @HostListener('touchstart', ['$event'])\r\n onTouchStart($event: TouchEvent): void {\r\n $event.preventDefault();\r\n window.clearTimeout(this.touchTimeout);\r\n this.touchTimeout = window.setTimeout(this.initializeTooltip.bind(this), 500);\r\n }\r\n\r\n @HostListener('touchend')\r\n onTouchEnd(): void {\r\n window.clearTimeout(this.touchTimeout);\r\n this.setHideTooltipTimeout();\r\n }\r\n\r\n private initializeTooltip() {\r\n if (this.componentRef === null) {\r\n window.clearInterval(this.hideDelay);\r\n\r\n if (this.tooltip) {\r\n const componentFactory = this.componentFactoryResolver.resolveComponentFactory(SdsTooltipComponent);\r\n this.componentRef = componentFactory.create(this.injector);\r\n\r\n this.appRef.attachView(this.componentRef.hostView);\r\n const [tooltipDOMElement] = (this.componentRef.hostView as EmbeddedViewRef<any>).rootNodes;\r\n\r\n this.setTooltipComponentProperties();\r\n\r\n document.body.appendChild(tooltipDOMElement);\r\n this.showTimeout = window.setTimeout(this.showTooltip.bind(this), this.showDelay);\r\n }\r\n }\r\n }\r\n\r\n private setTooltipComponentProperties() {\r\n if (this.componentRef !== null) {\r\n this.componentRef.instance.tooltip = this.tooltip;\r\n this.componentRef.instance.position = this.position;\r\n this.componentRef.instance.theme = this.theme;\r\n\r\n const { left, right, top, bottom } = this.elementRef.nativeElement.getBoundingClientRect();\r\n\r\n switch (this.position) {\r\n case 'below': {\r\n this.componentRef.instance.left = Math.round((right - left) / 2 + left);\r\n this.componentRef.instance.top = Math.round(bottom);\r\n break;\r\n }\r\n case 'above': {\r\n this.componentRef.instance.left = Math.round((right - left) / 2 + left);\r\n this.componentRef.instance.top = Math.round(top);\r\n break;\r\n }\r\n case 'right': {\r\n this.componentRef.instance.left = Math.round(right);\r\n this.componentRef.instance.top = Math.round(top + (bottom - top) / 2);\r\n break;\r\n }\r\n case 'left': {\r\n this.componentRef.instance.left = Math.round(left);\r\n this.componentRef.instance.top = Math.round(top + (bottom - top) / 2);\r\n break;\r\n }\r\n default: {\r\n break;\r\n }\r\n }\r\n }\r\n }\r\n\r\n private showTooltip() {\r\n if (this.tooltip && this.componentRef !== null) {\r\n this.componentRef.instance.visible = true;\r\n }\r\n }\r\n\r\n private setHideTooltipTimeout() {\r\n this.hideTimeout = window.setTimeout(this.destroy.bind(this), this.hideDelay);\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.destroy();\r\n }\r\n\r\n destroy(): void {\r\n if (this.componentRef !== null) {\r\n window.clearInterval(this.showTimeout);\r\n window.clearInterval(this.hideDelay);\r\n this.appRef.detachView(this.componentRef.hostView);\r\n this.componentRef.destroy();\r\n this.componentRef = null;\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsTooltipComponent } from '../tooltip/components/tooltip.component';\r\nimport { TooltipDirective } from './tooltip.directive';\r\nimport { TooltipPosition, TooltipTheme } from './tooltip.types';\r\n\r\n\r\n\r\n@NgModule({\r\n declarations: [\r\n SdsTooltipComponent,\r\n TooltipDirective\r\n ],\r\n imports: [\r\n CommonModule\r\n ],\r\n exports: [\r\n TooltipDirective\r\n ]\r\n})\r\nexport class SdsTooltipModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-tooltip.mjs","sources":["../../../projects/ngx-sds-components/src/lib/tooltip/components/tooltip.component.ts","../../../projects/ngx-sds-components/src/lib/tooltip/components/tooltip.component.html","../../../projects/ngx-sds-components/src/lib/tooltip/tooltip.directive.ts","../../../projects/ngx-sds-components/src/lib/tooltip/tooltip.module.ts","../../../projects/ngx-sds-components/src/lib/tooltip/spicainternational-ngx-sds-components-src-lib-tooltip.ts"],"sourcesContent":["import { Component, OnInit } from '@angular/core';\r\nimport { TooltipPosition, TooltipTheme } from '../tooltip.types';\r\nimport { IconProp } from '@fortawesome/fontawesome-svg-core';\r\n\r\n@Component({\r\n templateUrl: './tooltip.component.html',\r\n styleUrls: ['./tooltip.component.scss'],\r\n})\r\nexport class SdsTooltipComponent implements OnInit {\r\n\r\n public tooltip: string = '';\r\n public left: number = 0;\r\n public top: number = 0;\r\n public visible: boolean = false;\r\n\r\n public tooltipIcon?: IconProp;\r\n public tooltipClass?: string;\r\n\r\n public position: TooltipPosition = 'above';\r\n public theme: TooltipTheme = 'dark';\r\n\r\n\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n}\r\n","<div class=\"sds-tooltip\"\r\n [ngClass]=\"['sds-tooltip-' + position, 'sds-tooltip-' + theme, tooltipClass]\"\r\n [class.sds-tooltip-visible]=\"visible\"\r\n [style.left.px]=\"left\"\r\n [style.top.px]=\"top\"\r\n >\r\n <fa-icon class=\"sds-tooltip-icon\"\r\n *ngIf=\"tooltipIcon\" \r\n [icon]=\"tooltipIcon\">\r\n </fa-icon>\r\n\r\n <small class=\"sds-tooltip-text\">\r\n {{ tooltip }}\r\n </small>\r\n\r\n</div>\r\n","import {\r\n ApplicationRef,\r\n ComponentFactoryResolver,\r\n ComponentRef,\r\n Directive,\r\n ElementRef,\r\n EmbeddedViewRef,\r\n HostListener,\r\n Injector,\r\n Input,\r\n OnChanges,\r\n Renderer2,\r\n SimpleChanges,\r\n ViewContainerRef,\r\n} from '@angular/core';\r\nimport { SdsTooltipComponent } from './components/tooltip.component';\r\nimport { TooltipPosition, TooltipTheme } from './tooltip.types';\r\nimport { IconProp } from '@fortawesome/fontawesome-svg-core';\r\n\r\n@Directive({\r\n selector: '[sdsTooltip]',\r\n})\r\nexport class TooltipDirective implements OnChanges {\r\n @Input() tooltip = '';\r\n @Input() tooltipClass = '';\r\n @Input() tooltipIcon?: IconProp;\r\n @Input() position: TooltipPosition = 'above';\r\n @Input() theme: TooltipTheme = 'dark';\r\n @Input() showDelay = 0;\r\n @Input() hideDelay = 0;\r\n\r\n private componentRef: ComponentRef<any> | null = null;\r\n private showTimeout?: number;\r\n private hideTimeout?: number;\r\n private touchTimeout?: number;\r\n\r\n\r\n constructor(\r\n private elementRef: ElementRef,\r\n private appRef: ApplicationRef,\r\n private componentFactoryResolver: ComponentFactoryResolver,\r\n // private viewContainerRef: ViewContainerRef,\r\n private injector: Injector,\r\n // private renderer2: Renderer2\r\n ) {\r\n // this.renderer2.listen('window', 'scroll', (_) => {\r\n // console.log('scroll');\r\n // this.setHideTooltipTimeout();\r\n // });\r\n }\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['tooltip']) {\r\n if (this.componentRef !== null) {\r\n this.componentRef.instance.tooltip = this.tooltip;\r\n } \r\n }\r\n\r\n if (changes['tooltipIcon']) {\r\n if (this.componentRef !== null) {\r\n this.componentRef.instance.tooltipIcon = this.tooltipIcon;\r\n } \r\n } \r\n \r\n if (changes['tooltipClass']) {\r\n if (this.componentRef !== null) {\r\n this.componentRef.instance.tooltipClass = this.tooltipClass;\r\n } \r\n } \r\n }\r\n\r\n @HostListener('mouseenter')\r\n onMouseEnter(): void {\r\n this.initializeTooltip();\r\n }\r\n\r\n @HostListener('mouseleave')\r\n onMouseLeave(): void {\r\n this.setHideTooltipTimeout();\r\n }\r\n\r\n // @HostListener(\"window:scroll\", [])\r\n // onWindowScroll() {\r\n // console.log('scroll');\r\n // this.setHideTooltipTimeout();\r\n // }\r\n\r\n // @HostListener('window:scroll') onScroll(e: Event): void {\r\n // console.log((e.target as Element).scrollTop);\r\n // }\r\n\r\n // @HostListener('scroll') onScrollHost(e: Event): void {\r\n // console.log((e.target as Element).scrollTop);\r\n // }\r\n\r\n @HostListener('mousemove', ['$event'])\r\n onMouseMove($event: MouseEvent): void {\r\n if (this.componentRef !== null && this.position === 'dynamic') {\r\n this.componentRef.instance.left = $event.clientX;\r\n this.componentRef.instance.top = $event.clientY;\r\n this.componentRef.instance.tooltip = this.tooltip;\r\n this.componentRef.instance.tooltipIcon = this.tooltipIcon;\r\n this.componentRef.instance.tooltipClass = this.tooltipClass;\r\n }\r\n }\r\n\r\n @HostListener('touchstart', ['$event'])\r\n onTouchStart($event: TouchEvent): void {\r\n $event.preventDefault();\r\n window.clearTimeout(this.touchTimeout);\r\n this.touchTimeout = window.setTimeout(this.initializeTooltip.bind(this), 500);\r\n }\r\n\r\n @HostListener('touchend')\r\n onTouchEnd(): void {\r\n window.clearTimeout(this.touchTimeout);\r\n this.setHideTooltipTimeout();\r\n }\r\n\r\n private initializeTooltip() {\r\n if (this.componentRef === null) {\r\n window.clearInterval(this.hideDelay);\r\n\r\n if (this.tooltip) {\r\n const componentFactory = this.componentFactoryResolver.resolveComponentFactory(SdsTooltipComponent);\r\n this.componentRef = componentFactory.create(this.injector);\r\n\r\n this.appRef.attachView(this.componentRef.hostView);\r\n const [tooltipDOMElement] = (this.componentRef.hostView as EmbeddedViewRef<any>).rootNodes;\r\n\r\n this.setTooltipComponentProperties();\r\n\r\n document.body.appendChild(tooltipDOMElement);\r\n this.showTimeout = window.setTimeout(this.showTooltip.bind(this), this.showDelay);\r\n }\r\n }\r\n }\r\n\r\n private setTooltipComponentProperties() {\r\n if (this.componentRef !== null) {\r\n this.componentRef.instance.tooltip = this.tooltip;\r\n this.componentRef.instance.tooltipIcon = this.tooltipIcon;\r\n this.componentRef.instance.tooltipClass = this.tooltipClass;\r\n this.componentRef.instance.position = this.position;\r\n this.componentRef.instance.theme = this.theme;\r\n\r\n const { left, right, top, bottom } = this.elementRef.nativeElement.getBoundingClientRect();\r\n\r\n switch (this.position) {\r\n case 'below': {\r\n this.componentRef.instance.left = Math.round((right - left) / 2 + left);\r\n this.componentRef.instance.top = Math.round(bottom);\r\n break;\r\n }\r\n case 'above': {\r\n this.componentRef.instance.left = Math.round((right - left) / 2 + left);\r\n this.componentRef.instance.top = Math.round(top);\r\n break;\r\n }\r\n case 'right': {\r\n this.componentRef.instance.left = Math.round(right);\r\n this.componentRef.instance.top = Math.round(top + (bottom - top) / 2);\r\n break;\r\n }\r\n case 'left': {\r\n this.componentRef.instance.left = Math.round(left);\r\n this.componentRef.instance.top = Math.round(top + (bottom - top) / 2);\r\n break;\r\n }\r\n default: {\r\n break;\r\n }\r\n }\r\n }\r\n }\r\n\r\n private showTooltip() {\r\n if (this.tooltip && this.componentRef !== null) {\r\n this.componentRef.instance.visible = true;\r\n }\r\n }\r\n\r\n private setHideTooltipTimeout() {\r\n this.hideTimeout = window.setTimeout(this.destroy.bind(this), this.hideDelay);\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.destroy();\r\n }\r\n\r\n destroy(): void {\r\n if (this.componentRef !== null) {\r\n window.clearInterval(this.showTimeout);\r\n window.clearInterval(this.hideDelay);\r\n this.appRef.detachView(this.componentRef.hostView);\r\n this.componentRef.destroy();\r\n this.componentRef = null;\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsTooltipComponent } from '../tooltip/components/tooltip.component';\r\nimport { TooltipDirective } from './tooltip.directive';\r\nimport { TooltipPosition, TooltipTheme } from './tooltip.types';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\n\r\n@NgModule({\r\n declarations: [\r\n SdsTooltipComponent,\r\n TooltipDirective\r\n ],\r\n imports: [\r\n CommonModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n TooltipDirective\r\n ]\r\n})\r\nexport class SdsTooltipModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
export * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';
|
|
2
2
|
export * from '@spicainternational/ngx-sds-components/src/lib/avatar';
|
|
3
|
+
export * from '@spicainternational/ngx-sds-components/src/lib/badge';
|
|
3
4
|
export * from '@spicainternational/ngx-sds-components/src/lib/callout';
|
|
4
5
|
export * from '@spicainternational/ngx-sds-components/src/lib/color-picker';
|
|
6
|
+
export * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';
|
|
5
7
|
export * from '@spicainternational/ngx-sds-components/src/lib/date-picker';
|
|
6
8
|
export * from '@spicainternational/ngx-sds-components/src/lib/date-pipes';
|
|
7
9
|
export * from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components.mjs","sources":["../../../projects/ngx-sds-components/src/public-api.ts","../../../projects/ngx-sds-components/src/spicainternational-ngx-sds-components.ts"],"sourcesContent":["/*\r\n * Public API Surface of ngx-sds-components\r\n */\r\n\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/avatar';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/callout';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/color-picker';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/date-picker';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/date-pipes';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/duration-box';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/layout';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/modal';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/navigation';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/page-header';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/pane';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/quick-info';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/segmented-control';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/side-bar';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/tooltip';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components.mjs","sources":["../../../projects/ngx-sds-components/src/public-api.ts","../../../projects/ngx-sds-components/src/spicainternational-ngx-sds-components.ts"],"sourcesContent":["/*\r\n * Public API Surface of ngx-sds-components\r\n */\r\n\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/avatar';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/badge';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/callout';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/color-picker';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/date-picker';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/date-pipes';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/duration-pipe';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/duration-box';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/layout';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/modal';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/navigation';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/page-header';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/pane';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/quick-info';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/segmented-control';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/side-bar';\r\nexport * from '@spicainternational/ngx-sds-components/src/lib/tooltip';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;AAEG;;ACFH;;AAEG"}
|
|
@@ -0,0 +1,176 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { Component, ChangeDetectionStrategy, Directive, Input, NgModule } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/common';
|
|
4
|
+
import { CommonModule } from '@angular/common';
|
|
5
|
+
|
|
6
|
+
class SdsBadgeComponent {
|
|
7
|
+
constructor(cdRef) {
|
|
8
|
+
this.cdRef = cdRef;
|
|
9
|
+
this._text = '';
|
|
10
|
+
this._size = 'default';
|
|
11
|
+
this._variant = 'primary';
|
|
12
|
+
this._left = 0;
|
|
13
|
+
}
|
|
14
|
+
get text() {
|
|
15
|
+
return this._text;
|
|
16
|
+
}
|
|
17
|
+
set text(value) {
|
|
18
|
+
if (this._text !== value) {
|
|
19
|
+
this._text = value;
|
|
20
|
+
this.refresh();
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
get size() {
|
|
24
|
+
return this._size;
|
|
25
|
+
}
|
|
26
|
+
set size(value) {
|
|
27
|
+
if (this._size !== value) {
|
|
28
|
+
this._size = value;
|
|
29
|
+
this.refresh();
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
get variant() {
|
|
33
|
+
return this._variant;
|
|
34
|
+
}
|
|
35
|
+
set variant(value) {
|
|
36
|
+
if (this._variant !== value) {
|
|
37
|
+
this._variant = value;
|
|
38
|
+
this.refresh();
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
get left() {
|
|
42
|
+
return this._left;
|
|
43
|
+
}
|
|
44
|
+
set left(value) {
|
|
45
|
+
if (this._left !== value) {
|
|
46
|
+
this._left = value;
|
|
47
|
+
this.refresh();
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
ngOnInit() { }
|
|
51
|
+
refresh() {
|
|
52
|
+
this.cdRef.detectChanges();
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
SdsBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
+
SdsBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsBadgeComponent, selector: "sds-badge", ngImport: i0, template: "<div \r\n class=\"sds-badge\"\r\n [ngClass]=\"[variant]\"\r\n [style.left.px]=\"left\"\r\n [class.default]=\"size === 'default'\"\r\n [class.small]=\"size === 'small'\"\r\n >\r\n <span *ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:#3b8fc2}.sds-badge.secondary{border-color:#ced4da;background-color:#fff;color:#000}.sds-badge.danger{background-color:#cc5252}.sds-badge.success{background-color:#29ba60}.sds-badge.warning{background-color:#ffc107}.sds-badge.info{background-color:#56ace0}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
57
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, decorators: [{
|
|
58
|
+
type: Component,
|
|
59
|
+
args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-badge\"\r\n [ngClass]=\"[variant]\"\r\n [style.left.px]=\"left\"\r\n [class.default]=\"size === 'default'\"\r\n [class.small]=\"size === 'small'\"\r\n >\r\n <span *ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:#3b8fc2}.sds-badge.secondary{border-color:#ced4da;background-color:#fff;color:#000}.sds-badge.danger{background-color:#cc5252}.sds-badge.success{background-color:#29ba60}.sds-badge.warning{background-color:#ffc107}.sds-badge.info{background-color:#56ace0}\n"] }]
|
|
60
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
|
|
61
|
+
|
|
62
|
+
class SdsBadgeDirective {
|
|
63
|
+
constructor(host, appRef, viewContainerRef) {
|
|
64
|
+
this.host = host;
|
|
65
|
+
this.appRef = appRef;
|
|
66
|
+
this.viewContainerRef = viewContainerRef;
|
|
67
|
+
this.sdsBadge = '';
|
|
68
|
+
this.size = 'default';
|
|
69
|
+
this.variant = 'primary';
|
|
70
|
+
this.badgeComponentRef = null;
|
|
71
|
+
}
|
|
72
|
+
ngAfterViewInit() {
|
|
73
|
+
this.initializeBadge();
|
|
74
|
+
}
|
|
75
|
+
ngOnInit() {
|
|
76
|
+
const observer = new ResizeObserver(_ => {
|
|
77
|
+
if (this.badgeComponentRef) {
|
|
78
|
+
this.setBadgePosition();
|
|
79
|
+
// this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
observer.observe(this.host.nativeElement);
|
|
83
|
+
}
|
|
84
|
+
;
|
|
85
|
+
ngOnChanges(changes) {
|
|
86
|
+
if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {
|
|
87
|
+
const value = `${changes['sdsBadge'].currentValue}`.trim();
|
|
88
|
+
if (value?.length > 0) {
|
|
89
|
+
this.initializeBadge();
|
|
90
|
+
}
|
|
91
|
+
else {
|
|
92
|
+
this.destroyBadgeComponentRef();
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
ngOnDestroy() {
|
|
97
|
+
this.observer.unobserve(this.host.nativeElement);
|
|
98
|
+
this.observer.disconnect();
|
|
99
|
+
this.destroyBadgeComponentRef();
|
|
100
|
+
}
|
|
101
|
+
initializeBadge() {
|
|
102
|
+
if (this.badgeComponentRef === null) {
|
|
103
|
+
if (this.sdsBadge) {
|
|
104
|
+
this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);
|
|
105
|
+
this.badgeComponentRef.instance.text = this.sdsBadge;
|
|
106
|
+
this.badgeComponentRef.instance.variant = this.variant;
|
|
107
|
+
this.badgeComponentRef.instance.size = this.size;
|
|
108
|
+
this.setBadgePosition();
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
else {
|
|
112
|
+
this.badgeComponentRef.instance.text = this.sdsBadge;
|
|
113
|
+
this.badgeComponentRef.instance.variant = this.variant;
|
|
114
|
+
this.badgeComponentRef.instance.size = this.size;
|
|
115
|
+
this.setBadgePosition();
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
destroyBadgeComponentRef() {
|
|
119
|
+
if (this.badgeComponentRef !== null) {
|
|
120
|
+
this.appRef.detachView(this.badgeComponentRef.hostView);
|
|
121
|
+
this.badgeComponentRef.destroy();
|
|
122
|
+
this.badgeComponentRef = null;
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
setBadgePosition() {
|
|
126
|
+
if (this.badgeComponentRef) {
|
|
127
|
+
this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;
|
|
128
|
+
console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
SdsBadgeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeDirective, deps: [{ token: i0.ElementRef }, { token: i0.ApplicationRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
133
|
+
SdsBadgeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.1", type: SdsBadgeDirective, selector: "[sdsBadge]", inputs: { sdsBadge: "sdsBadge", size: "size", variant: "variant" }, usesOnChanges: true, ngImport: i0 });
|
|
134
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeDirective, decorators: [{
|
|
135
|
+
type: Directive,
|
|
136
|
+
args: [{
|
|
137
|
+
selector: '[sdsBadge]',
|
|
138
|
+
}]
|
|
139
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { sdsBadge: [{
|
|
140
|
+
type: Input
|
|
141
|
+
}], size: [{
|
|
142
|
+
type: Input
|
|
143
|
+
}], variant: [{
|
|
144
|
+
type: Input
|
|
145
|
+
}] } });
|
|
146
|
+
|
|
147
|
+
class SdsBadgeModule {
|
|
148
|
+
}
|
|
149
|
+
SdsBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
150
|
+
SdsBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, declarations: [SdsBadgeDirective,
|
|
151
|
+
SdsBadgeComponent], imports: [CommonModule], exports: [SdsBadgeDirective] });
|
|
152
|
+
SdsBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, imports: [[
|
|
153
|
+
CommonModule
|
|
154
|
+
]] });
|
|
155
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, decorators: [{
|
|
156
|
+
type: NgModule,
|
|
157
|
+
args: [{
|
|
158
|
+
declarations: [
|
|
159
|
+
SdsBadgeDirective,
|
|
160
|
+
SdsBadgeComponent
|
|
161
|
+
],
|
|
162
|
+
imports: [
|
|
163
|
+
CommonModule
|
|
164
|
+
],
|
|
165
|
+
exports: [
|
|
166
|
+
SdsBadgeDirective
|
|
167
|
+
]
|
|
168
|
+
}]
|
|
169
|
+
}] });
|
|
170
|
+
|
|
171
|
+
/**
|
|
172
|
+
* Generated bundle index. Do not edit.
|
|
173
|
+
*/
|
|
174
|
+
|
|
175
|
+
export { SdsBadgeDirective, SdsBadgeModule };
|
|
176
|
+
//# sourceMappingURL=spicainternational-ngx-sds-components-src-lib-badge.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-badge.mjs","sources":["../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.ts","../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.html","../../../projects/ngx-sds-components/src/lib/badge/badge.directive.ts","../../../projects/ngx-sds-components/src/lib/badge/badge.module.ts","../../../projects/ngx-sds-components/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';\r\nimport { BadgeSize, BadgeVariant } from '../badge.types';\r\n\r\n@Component({\r\n selector: 'sds-badge',\r\n templateUrl: './badge.component.html',\r\n styleUrls: ['./badge.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class SdsBadgeComponent implements OnInit {\r\n private _text: string = '';\r\n private _size: BadgeSize = 'default';\r\n private _variant: BadgeVariant = 'primary';\r\n private _left: number = 0;\r\n\r\n\r\n public get text() {\r\n return this._text;\r\n }\r\n\r\n public set text(value: string) {\r\n if (this._text !== value) {\r\n this._text = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get size() {\r\n return this._size;\r\n }\r\n\r\n public set size(value: BadgeSize) {\r\n if (this._size !== value) {\r\n this._size = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get variant() {\r\n return this._variant;\r\n }\r\n\r\n public set variant(value: BadgeVariant) {\r\n if (this._variant !== value) {\r\n this._variant = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get left() {\r\n return this._left;\r\n }\r\n\r\n public set left(value: number) {\r\n if (this._left !== value) {\r\n this._left = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n \r\n \r\n\r\n constructor(\r\n private readonly cdRef: ChangeDetectorRef\r\n ) {}\r\n\r\n ngOnInit(): void {}\r\n\r\n\r\n private refresh(){\r\n this.cdRef.detectChanges();\r\n }\r\n}\r\n","<div \r\n class=\"sds-badge\"\r\n [ngClass]=\"[variant]\"\r\n [style.left.px]=\"left\"\r\n [class.default]=\"size === 'default'\"\r\n [class.small]=\"size === 'small'\"\r\n >\r\n <span *ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n","import {\r\n AfterViewInit,\r\n ApplicationRef,\r\n ComponentRef,\r\n Directive,\r\n ElementRef,\r\n Input,\r\n OnChanges,\r\n OnDestroy,\r\n OnInit,\r\n SimpleChanges,\r\n ViewContainerRef,\r\n} from '@angular/core';\r\nimport { BadgeSize, BadgeVariant } from './badge.types';\r\nimport { SdsBadgeComponent } from './components/badge.component';\r\n\r\n@Directive({\r\n selector: '[sdsBadge]',\r\n})\r\nexport class SdsBadgeDirective implements OnInit, OnChanges, OnDestroy, AfterViewInit {\r\n @Input() sdsBadge = '';\r\n @Input() size: BadgeSize = 'default';\r\n @Input() variant: BadgeVariant = 'primary';\r\n\r\n private badgeComponentRef: ComponentRef<any> | null = null;\r\n private observer: any; //ResizeObserver = null;\r\n\r\n constructor(\r\n private host: ElementRef,\r\n private appRef: ApplicationRef,\r\n private viewContainerRef: ViewContainerRef\r\n ) {}\r\n\r\n ngAfterViewInit(): void {\r\n this.initializeBadge();\r\n }\r\n\r\n ngOnInit(): void {\r\n const observer = new ResizeObserver(_ => {\r\n if (this.badgeComponentRef) {\r\n this.setBadgePosition();\r\n // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;\r\n }\r\n });\r\n \r\n observer.observe(this.host.nativeElement);\r\n }; \r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {\r\n const value = `${changes['sdsBadge'].currentValue}`.trim();\r\n if (value?.length > 0) {\r\n this.initializeBadge();\r\n } else {\r\n this.destroyBadgeComponentRef();\r\n }\r\n }\r\n }\r\n\r\n ngOnDestroy() {\r\n this.observer.unobserve(this.host.nativeElement);\r\n this.observer.disconnect();\r\n\r\n this.destroyBadgeComponentRef();\r\n }\r\n\r\n private initializeBadge() {\r\n if (this.badgeComponentRef === null) {\r\n if (this.sdsBadge) {\r\n this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);\r\n this.badgeComponentRef.instance.text = this.sdsBadge;\r\n this.badgeComponentRef.instance.variant = this.variant;\r\n this.badgeComponentRef.instance.size = this.size;\r\n\r\n this.setBadgePosition();\r\n }\r\n } else {\r\n this.badgeComponentRef.instance.text = this.sdsBadge;\r\n this.badgeComponentRef.instance.variant = this.variant;\r\n this.badgeComponentRef.instance.size = this.size;\r\n\r\n this.setBadgePosition();\r\n }\r\n }\r\n\r\n private destroyBadgeComponentRef(){\r\n if (this.badgeComponentRef !== null) {\r\n this.appRef.detachView(this.badgeComponentRef.hostView);\r\n this.badgeComponentRef.destroy();\r\n this.badgeComponentRef = null;\r\n } \r\n }\r\n\r\n private setBadgePosition(){\r\n if (this.badgeComponentRef) {\r\n this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;\r\n console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);\r\n }\r\n }\r\n\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsBadgeDirective } from './badge.directive';\r\nimport { SdsBadgeComponent } from './components/badge.component';\r\n\r\n\r\n\r\n@NgModule({\r\n declarations: [\r\n SdsBadgeDirective,\r\n SdsBadgeComponent\r\n ],\r\n imports: [\r\n CommonModule\r\n ],\r\n exports: [\r\n SdsBadgeDirective\r\n ]\r\n})\r\nexport class SdsBadgeModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|