@spicainternational/ngx-sds-components 2.29.0 → 2.30.0

package/esm2020/public-api.mjs

@@ -3,6 +3,7 @@
  */
 export * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';
 export * from '@spicainternational/ngx-sds-components/src/lib/avatar';
+export * from '@spicainternational/ngx-sds-components/src/lib/badge';
 export * from '@spicainternational/ngx-sds-components/src/lib/callout';
 export * from '@spicainternational/ngx-sds-components/src/lib/color-picker';
 export * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';
@@ -19,4 +20,4 @@ export * from '@spicainternational/ngx-sds-components/src/lib/quick-info';
 export * from '@spicainternational/ngx-sds-components/src/lib/segmented-control';
 export * from '@spicainternational/ngx-sds-components/src/lib/side-bar';
 export * from '@spicainternational/ngx-sds-components/src/lib/tooltip';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsNkRBQTZELENBQUM7QUFDNUUsY0FBYyx1REFBdUQsQ0FBQztBQUN0RSxjQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLGNBQWMsNkRBQTZELENBQUM7QUFDNUUsY0FBYyxnRUFBZ0UsQ0FBQztBQUMvRSxjQUFjLDREQUE0RCxDQUFDO0FBQzNFLGNBQWMsMkRBQTJELENBQUM7QUFDMUUsY0FBYyw4REFBOEQsQ0FBQztBQUM3RSxjQUFjLDZEQUE2RCxDQUFDO0FBQzVFLGNBQWMsdURBQXVELENBQUM7QUFDdEUsY0FBYyxzREFBc0QsQ0FBQztBQUNyRSxjQUFjLDJEQUEyRCxDQUFDO0FBQzFFLGNBQWMsNERBQTRELENBQUM7QUFDM0UsY0FBYyxxREFBcUQsQ0FBQztBQUNwRSxjQUFjLDJEQUEyRCxDQUFDO0FBQzFFLGNBQWMsa0VBQWtFLENBQUM7QUFDakYsY0FBYyx5REFBeUQsQ0FBQztBQUN4RSxjQUFjLHdEQUF3RCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLypcclxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIG5neC1zZHMtY29tcG9uZW50c1xyXG4gKi9cclxuXHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYXBwLXN3aXRjaGVyJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9hdmF0YXInO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2NhbGxvdXQnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2NvbG9yLXBpY2tlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZXhwYW5zaW9uLXBhbmVsJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9kYXRlLXBpY2tlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZGF0ZS1waXBlcyc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZHVyYXRpb24tcGlwZSc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZHVyYXRpb24tYm94JztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9sYXlvdXQnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL21vZGFsJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9uYXZpZ2F0aW9uJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9wYWdlLWhlYWRlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvcGFuZSc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvcXVpY2staW5mbyc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL3NpZGUtYmFyJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi90b29sdGlwJztcclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsNkRBQTZELENBQUM7QUFDNUUsY0FBYyx1REFBdUQsQ0FBQztBQUN0RSxjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsd0RBQXdELENBQUM7QUFDdkUsY0FBYyw2REFBNkQsQ0FBQztBQUM1RSxjQUFjLGdFQUFnRSxDQUFDO0FBQy9FLGNBQWMsNERBQTRELENBQUM7QUFDM0UsY0FBYywyREFBMkQsQ0FBQztBQUMxRSxjQUFjLDhEQUE4RCxDQUFDO0FBQzdFLGNBQWMsNkRBQTZELENBQUM7QUFDNUUsY0FBYyx1REFBdUQsQ0FBQztBQUN0RSxjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsMkRBQTJELENBQUM7QUFDMUUsY0FBYyw0REFBNEQsQ0FBQztBQUMzRSxjQUFjLHFEQUFxRCxDQUFDO0FBQ3BFLGNBQWMsMkRBQTJELENBQUM7QUFDMUUsY0FBYyxrRUFBa0UsQ0FBQztBQUNqRixjQUFjLHlEQUF5RCxDQUFDO0FBQ3hFLGNBQWMsd0RBQXdELENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxyXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygbmd4LXNkcy1jb21wb25lbnRzXHJcbiAqL1xyXG5cclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9hcHAtc3dpdGNoZXInO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2F2YXRhcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYmFkZ2UnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2NhbGxvdXQnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2NvbG9yLXBpY2tlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZXhwYW5zaW9uLXBhbmVsJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9kYXRlLXBpY2tlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZGF0ZS1waXBlcyc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZHVyYXRpb24tcGlwZSc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvZHVyYXRpb24tYm94JztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9sYXlvdXQnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL21vZGFsJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9uYXZpZ2F0aW9uJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9wYWdlLWhlYWRlcic7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvcGFuZSc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvcXVpY2staW5mbyc7XHJcbmV4cG9ydCAqIGZyb20gJ0BzcGljYWludGVybmF0aW9uYWwvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wnO1xyXG5leHBvcnQgKiBmcm9tICdAc3BpY2FpbnRlcm5hdGlvbmFsL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL3NpZGUtYmFyJztcclxuZXhwb3J0ICogZnJvbSAnQHNwaWNhaW50ZXJuYXRpb25hbC9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi90b29sdGlwJztcclxuIl19

package/esm2020/src/lib/badge/badge.directive.mjs

@@ -0,0 +1,88 @@
+import { Directive, Input, } from '@angular/core';
+import { SdsBadgeComponent } from './components/badge.component';
+import * as i0 from "@angular/core";
+export class SdsBadgeDirective {
+    constructor(host, appRef, viewContainerRef) {
+        this.host = host;
+        this.appRef = appRef;
+        this.viewContainerRef = viewContainerRef;
+        this.sdsBadge = '';
+        this.size = 'default';
+        this.variant = 'primary';
+        this.badgeComponentRef = null;
+    }
+    ngAfterViewInit() {
+        this.initializeBadge();
+    }
+    ngOnInit() {
+        const observer = new ResizeObserver(_ => {
+            if (this.badgeComponentRef) {
+                this.setBadgePosition();
+                // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;
+            }
+        });
+        observer.observe(this.host.nativeElement);
+    }
+    ;
+    ngOnChanges(changes) {
+        if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {
+            const value = `${changes['sdsBadge'].currentValue}`.trim();
+            if (value?.length > 0) {
+                this.initializeBadge();
+            }
+            else {
+                this.destroyBadgeComponentRef();
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.observer.unobserve(this.host.nativeElement);
+        this.observer.disconnect();
+        this.destroyBadgeComponentRef();
+    }
+    initializeBadge() {
+        if (this.badgeComponentRef === null) {
+            if (this.sdsBadge) {
+                this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);
+                this.badgeComponentRef.instance.text = this.sdsBadge;
+                this.badgeComponentRef.instance.variant = this.variant;
+                this.badgeComponentRef.instance.size = this.size;
+                this.setBadgePosition();
+            }
+        }
+        else {
+            this.badgeComponentRef.instance.text = this.sdsBadge;
+            this.badgeComponentRef.instance.variant = this.variant;
+            this.badgeComponentRef.instance.size = this.size;
+            this.setBadgePosition();
+        }
+    }
+    destroyBadgeComponentRef() {
+        if (this.badgeComponentRef !== null) {
+            this.appRef.detachView(this.badgeComponentRef.hostView);
+            this.badgeComponentRef.destroy();
+            this.badgeComponentRef = null;
+        }
+    }
+    setBadgePosition() {
+        if (this.badgeComponentRef) {
+            this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;
+            console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);
+        }
+    }
+}
+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 });
+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 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[sdsBadge]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { sdsBadge: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYmFkZ2UvYmFkZ2UuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFJSCxTQUFTLEVBRVQsS0FBSyxHQU1SLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDhCQUE4QixDQUFDOztBQUtqRSxNQUFNLE9BQU8saUJBQWlCO0lBUTFCLFlBQ1ksSUFBZ0IsRUFDaEIsTUFBc0IsRUFDdEIsZ0JBQWtDO1FBRmxDLFNBQUksR0FBSixJQUFJLENBQVk7UUFDaEIsV0FBTSxHQUFOLE1BQU0sQ0FBZ0I7UUFDdEIscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFrQjtRQVZyQyxhQUFRLEdBQUcsRUFBRSxDQUFDO1FBQ2QsU0FBSSxHQUFjLFNBQVMsQ0FBQztRQUM1QixZQUFPLEdBQWlCLFNBQVMsQ0FBQztRQUVuQyxzQkFBaUIsR0FBNkIsSUFBSSxDQUFDO0lBT3hELENBQUM7SUFFSixlQUFlO1FBQ1gsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQzNCLENBQUM7SUFFRCxRQUFRO1FBQ0osTUFBTSxRQUFRLEdBQUcsSUFBSSxjQUFjLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDcEMsSUFBSSxJQUFJLENBQUMsaUJBQWlCLEVBQUU7Z0JBQ3hCLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO2dCQUN4Qiw4RUFBOEU7YUFDakY7UUFDTCxDQUFDLENBQUMsQ0FBQztRQUVILFFBQVEsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQztJQUM5QyxDQUFDO0lBQUEsQ0FBQztJQUVGLFdBQVcsQ0FBQyxPQUFzQjtRQUM5QixJQUFJLE9BQU8sQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLE9B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ImltcG9ydCB7XHJcbiAgICBBZnRlclZpZXdJbml0LFxyXG4gICAgQXBwbGljYXRpb25SZWYsXHJcbiAgICBDb21wb25lbnRSZWYsXHJcbiAgICBEaXJlY3RpdmUsXHJcbiAgICBFbGVtZW50UmVmLFxyXG4gICAgSW5wdXQsXHJcbiAgICBPbkNoYW5nZXMsXHJcbiAgICBPbkRlc3Ryb3ksXHJcbiAgICBPbkluaXQsXHJcbiAgICBTaW1wbGVDaGFuZ2VzLFxyXG4gICAgVmlld0NvbnRhaW5lclJlZixcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQmFkZ2VTaXplLCBCYWRnZVZhcmlhbnQgfSBmcm9tICcuL2JhZGdlLnR5cGVzJztcclxuaW1wb3J0IHsgU2RzQmFkZ2VDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvYmFkZ2UuY29tcG9uZW50JztcclxuXHJcbkBEaXJlY3RpdmUoe1xyXG4gICAgc2VsZWN0b3I6ICdbc2RzQmFkZ2VdJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkc0JhZGdlRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMsIE9uRGVzdHJveSwgQWZ0ZXJWaWV3SW5pdCB7XHJcbiAgICBASW5wdXQoKSBzZHNCYWRnZSA9ICcnO1xyXG4gICAgQElucHV0KCkgc2l6ZTogQmFkZ2VTaXplID0gJ2RlZmF1bHQnO1xyXG4gICAgQElucHV0KCkgdmFyaWFudDogQmFkZ2VWYXJpYW50ID0gJ3ByaW1hcnknO1xyXG5cclxuICAgIHByaXZhdGUgYmFkZ2VDb21wb25lbnRSZWY6IENvbXBvbmVudFJlZjxhbnk+IHwgbnVsbCA9IG51bGw7XHJcbiAgICBwcml2YXRlIG9ic2VydmVyOiBhbnk7IC8vUmVzaXplT2JzZXJ2ZXIgPSBudWxsO1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKFxyXG4gICAgICAgIHByaXZhdGUgaG9zdDogRWxlbWVudFJlZixcclxuICAgICAgICBwcml2YXRlIGFwcFJlZjogQXBwbGljYXRpb25SZWYsXHJcbiAgICAgICAgcHJpdmF0ZSB2aWV3Q29udGFpbmVyUmVmOiBWaWV3Q29udGFpbmVyUmVmXHJcbiAgICApIHt9XHJcblxyXG4gICAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xyXG4gICAgICAgIHRoaXMuaW5pdGlhbGl6ZUJhZGdlKCk7XHJcbiAgICB9XHJcblxyXG4gICAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICAgICAgY29uc3Qgb2JzZXJ2ZXIgPSBuZXcgUmVzaXplT2JzZXJ2ZXIoXyA9PiB7XHJcbiAgICAgICAgICAgIGlmICh0aGlzLmJhZGdlQ29tcG9uZW50UmVmKSB7XHJcbiAgICAgICAgICAgICAgICB0aGlzLnNldEJhZGdlUG9zaXRpb24oKTtcclxuICAgICAgICAgICAgICAgIC8vIHRoaXMuYmFkZ2VDb21wb25lbnRSZWYuaW5zdGFuY2UubGVmdCA9IHRoaXMuaG9zdC5uYXRpdmVFbGVtZW50Lm9mZnNldFdpZHRoO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgfSk7XHJcbiAgICAgIFxyXG4gICAgICAgIG9ic2VydmVyLm9ic2VydmUodGhpcy5ob3N0Lm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgfTsgICAgXHJcblxyXG4gICAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xyXG4gICAgICAgIGlmIChjaGFuZ2VzWydzZHNCYWRnZSddICYmICFjaGFuZ2VzWydzZHNCYWRnZSddLmZpcnN0Q2hhbmdlKSB7XHJcbiAgICAgICAgICAgIGNvbnN0IHZhbHVlID0gYCR7Y2hhbmdlc1snc2RzQmFkZ2UnXS5jdXJyZW50VmFsdWV9YC50cmltKCk7XHJcbiAgICAgICAgICAgIGlmICh2YWx1ZT8ubGVuZ3RoID4gMCkge1xyXG4gICAgICAgICAgICAgICAgdGhpcy5pbml0aWFsaXplQmFkZ2UoKTtcclxuICAgICAgICAgICAgfSBlbHNlIHtcclxuICAgICAgICAgICAgICAgIHRoaXMuZGVzdHJveUJhZGdlQ29tcG9uZW50UmVmKCk7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgbmdPbkRlc3Ryb3koKSB7XHJcbiAgICAgICAgdGhpcy5vYnNlcnZlci51bm9ic2VydmUodGhpcy5ob3N0Lm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgICAgIHRoaXMub2JzZXJ2ZXIuZGlzY29ubmVjdCgpO1xyXG5cclxuICAgICAgICB0aGlzLmRlc3Ryb3lCYWRnZUNvbXBvbmVudFJlZigpO1xyXG4gICAgfVxyXG5cclxuICAgIHByaXZhdGUgaW5pdGlhbGl6ZUJhZGdlKCkge1xyXG4gICAgICAgIGlmICh0aGlzLmJhZGdlQ29tcG9uZW50UmVmID09PSBudWxsKSB7XHJcbiAgICAgICAgICAgIGlmICh0aGlzLnNkc0JhZGdlKSB7XHJcbiAgICAgICAgICAgICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmID0gdGhpcy52aWV3Q29udGFpbmVyUmVmLmNyZWF0ZUNvbXBvbmVudChTZHNCYWRnZUNvbXBvbmVudCk7XHJcbiAgICAgICAgICAgICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLmluc3RhbmNlLnRleHQgPSB0aGlzLnNkc0JhZGdlO1xyXG4gICAgICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS52YXJpYW50ID0gdGhpcy52YXJpYW50O1xyXG4gICAgICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS5zaXplID0gdGhpcy5zaXplO1xyXG5cclxuICAgICAgICAgICAgICAgIHRoaXMuc2V0QmFkZ2VQb3NpdGlvbigpO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgfSBlbHNlIHtcclxuICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS50ZXh0ID0gdGhpcy5zZHNCYWRnZTtcclxuICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS52YXJpYW50ID0gdGhpcy52YXJpYW50O1xyXG4gICAgICAgICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLmluc3RhbmNlLnNpemUgPSB0aGlzLnNpemU7XHJcblxyXG4gICAgICAgICAgICB0aGlzLnNldEJhZGdlUG9zaXRpb24oKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSBkZXN0cm95QmFkZ2VDb21wb25lbnRSZWYoKXtcclxuICAgICAgICBpZiAodGhpcy5iYWRnZUNvbXBvbmVudFJlZiAhPT0gbnVsbCkge1xyXG4gICAgICAgICAgICB0aGlzLmFwcFJlZi5kZXRhY2hWaWV3KHRoaXMuYmFkZ2VDb21wb25lbnRSZWYuaG9zdFZpZXcpO1xyXG4gICAgICAgICAgICB0aGlzLmJhZGdlQ29tcG9uZW50UmVmLmRlc3Ryb3koKTtcclxuICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZiA9IG51bGw7XHJcbiAgICAgICAgfSAgICAgICAgXHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSBzZXRCYWRnZVBvc2l0aW9uKCl7XHJcbiAgICAgICAgaWYgKHRoaXMuYmFkZ2VDb21wb25lbnRSZWYpIHtcclxuICAgICAgICAgICAgdGhpcy5iYWRnZUNvbXBvbmVudFJlZi5pbnN0YW5jZS5sZWZ0ID0gdGhpcy5ob3N0Lm5hdGl2ZUVsZW1lbnQub2Zmc2V0TGVmdCArIHRoaXMuaG9zdC5uYXRpdmVFbGVtZW50Lm9mZnNldFdpZHRoO1xyXG4gICAgICAgICAgICBjb25zb2xlLmxvZyhgb2Zmc2V0TGVmdCAke3RoaXMuaG9zdC5uYXRpdmVFbGVtZW50Lm9mZnNldExlZnR9LCBvZmZzZXRXaWR0aDogJHt0aGlzLmhvc3QubmF0aXZlRWxlbWVudC5vZmZzZXRXaWR0aH1gKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG59XHJcbiJdfQ==

package/esm2020/src/lib/badge/badge.module.mjs

@@ -0,0 +1,29 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SdsBadgeDirective } from './badge.directive';
+import { SdsBadgeComponent } from './components/badge.component';
+import * as i0 from "@angular/core";
+export class SdsBadgeModule {
+}
+SdsBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SdsBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, declarations: [SdsBadgeDirective,
+        SdsBadgeComponent], imports: [CommonModule], exports: [SdsBadgeDirective] });
+SdsBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, imports: [[
+            CommonModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SdsBadgeDirective,
+                        SdsBadgeComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        SdsBadgeDirective
+                    ]
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYmFkZ2UvYmFkZ2UubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ3RELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLDhCQUE4QixDQUFDOztBQWdCakUsTUFBTSxPQUFPLGNBQWM7OzJHQUFkLGNBQWM7NEdBQWQsY0FBYyxpQkFWdkIsaUJBQWlCO1FBQ2pCLGlCQUFpQixhQUdqQixZQUFZLGFBR1osaUJBQWlCOzRHQUdSLGNBQWMsWUFQaEI7WUFDUCxZQUFZO1NBQ2I7MkZBS1UsY0FBYztrQkFaMUIsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUU7d0JBQ1osaUJBQWlCO3dCQUNqQixpQkFBaUI7cUJBQ2xCO29CQUNELE9BQU8sRUFBRTt3QkFDUCxZQUFZO3FCQUNiO29CQUNELE9BQU8sRUFBRTt3QkFDUCxpQkFBaUI7cUJBQ2xCO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHsgU2RzQmFkZ2VEaXJlY3RpdmUgfSBmcm9tICcuL2JhZGdlLmRpcmVjdGl2ZSc7XHJcbmltcG9ydCB7IFNkc0JhZGdlQ29tcG9uZW50IH0gZnJvbSAnLi9jb21wb25lbnRzL2JhZGdlLmNvbXBvbmVudCc7XHJcblxyXG5cclxuXHJcbkBOZ01vZHVsZSh7XHJcbiAgZGVjbGFyYXRpb25zOiBbXHJcbiAgICBTZHNCYWRnZURpcmVjdGl2ZSxcclxuICAgIFNkc0JhZGdlQ29tcG9uZW50XHJcbiAgXSxcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGVcclxuICBdLFxyXG4gIGV4cG9ydHM6IFtcclxuICAgIFNkc0JhZGdlRGlyZWN0aXZlXHJcbiAgXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RzQmFkZ2VNb2R1bGUgeyB9XHJcbiJdfQ==

package/esm2020/src/lib/badge/badge.types.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UudHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9iYWRnZS9iYWRnZS50eXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHR5cGUgQmFkZ2VWYXJpYW50ID0gJ3ByaW1hcnknIHwgJ3NlY29uZGFyeSc7XHJcblxyXG5leHBvcnQgdHlwZSBCYWRnZVNpemUgPSAnZGVmYXVsdCcgfCAnc21hbGwnOyJdfQ==

package/esm2020/src/lib/badge/components/badge.component.mjs

@@ -0,0 +1,59 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class SdsBadgeComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        this._text = '';
+        this._size = 'default';
+        this._variant = 'primary';
+        this._left = 0;
+    }
+    get text() {
+        return this._text;
+    }
+    set text(value) {
+        if (this._text !== value) {
+            this._text = value;
+            this.refresh();
+        }
+    }
+    get size() {
+        return this._size;
+    }
+    set size(value) {
+        if (this._size !== value) {
+            this._size = value;
+            this.refresh();
+        }
+    }
+    get variant() {
+        return this._variant;
+    }
+    set variant(value) {
+        if (this._variant !== value) {
+            this._variant = value;
+            this.refresh();
+        }
+    }
+    get left() {
+        return this._left;
+    }
+    set left(value) {
+        if (this._left !== value) {
+            this._left = value;
+            this.refresh();
+        }
+    }
+    ngOnInit() { }
+    refresh() {
+        this.cdRef.detectChanges();
+    }
+}
+SdsBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+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    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n    class=\"sds-badge\"\r\n    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYmFkZ2UvY29tcG9uZW50cy9iYWRnZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2RzLWNvbXBvbmVudHMvc3JjL2xpYi9iYWRnZS9jb21wb25lbnRzL2JhZGdlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBcUIsU0FBUyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7QUFTOUYsTUFBTSxPQUFPLGlCQUFpQjtJQXNEMUIsWUFDcUIsS0FBd0I7UUFBeEIsVUFBSyxHQUFMLEtBQUssQ0FBbUI7UUF0RHJDLFVBQUssR0FBVyxFQUFFLENBQUM7UUFDbkIsVUFBSyxHQUFjLFNBQVMsQ0FBQztRQUM3QixhQUFRLEdBQWlCLFNBQVMsQ0FBQztRQUNuQyxVQUFLLEdBQVcsQ0FBQyxDQUFDO0lBb0R2QixDQUFDO0lBakRKLElBQVcsSUFBSTtRQUNYLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUN0QixDQUFDO0lBRUQsSUFBVyxJQUFJLENBQUMsS0FBYTtRQUN6QixJQUFJLElBQUksQ0FBQyxLQUFLLEtBQUssS0FBSyxFQUFFO1lBQ3RCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1lBQ25CLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztTQUNsQjtJQUNMLENBQUM7SUFFRCxJQUFXLElBQUk7UUFDWCxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDdEIsQ0FBQztJQUVELElBQVcsSUFBSSxDQUFDLEtBQWdCO1FBQzVCLElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxLQUFLLEVBQUU7WUFDdEIsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7WUFDbkIsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1NBQ2xCO0lBQ0wsQ0FBQztJQUVELElBQVcsT0FBTztRQUNkLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUN6QixDQUFDO0lBRUQsSUFBVyxPQUFPLENBQUMsS0FBbUI7UUFDbEMsSUFBSSxJQUFJLENBQUMsUUFBUSxLQUFLLEtBQUssRUFBRTtZQUN6QixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQztZQUN0QixJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7U0FDbEI7SUFDTCxDQUFDO0lBRUQsSUFBVyxJQUFJO1FBQ1gsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDO0lBQ3RCLENBQUM7SUFFRCxJQUFXLElBQUksQ0FBQyxLQUFhO1FBQ3pCLElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxLQUFLLEVBQUU7WUFDdEIsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7WUFDbkIsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1NBQ2xCO0lBQ0wsQ0FBQztJQVNELFFBQVEsS0FBVSxDQUFDO0lBR1gsT0FBTztRQUNYLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLENBQUM7SUFDL0IsQ0FBQzs7OEdBL0RRLGlCQUFpQjtrR0FBakIsaUJBQWlCLGlEQ1Q5QixvV0FZQTsyRkRIYSxpQkFBaUI7a0JBTjdCLFNBQVM7K0JBQ0ksV0FBVyxtQkFHSix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENoYW5nZURldGVjdG9yUmVmLCBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBCYWRnZVNpemUsIEJhZGdlVmFyaWFudCB9IGZyb20gJy4uL2JhZGdlLnR5cGVzJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICdzZHMtYmFkZ2UnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2JhZGdlLmNvbXBvbmVudC5odG1sJyxcclxuICAgIHN0eWxlVXJsczogWycuL2JhZGdlLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RzQmFkZ2VDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gICAgcHJpdmF0ZSBfdGV4dDogc3RyaW5nID0gJyc7XHJcbiAgICBwcml2YXRlIF9zaXplOiBCYWRnZVNpemUgPSAnZGVmYXVsdCc7XHJcbiAgICBwcml2YXRlIF92YXJpYW50OiBCYWRnZVZhcmlhbnQgPSAncHJpbWFyeSc7XHJcbiAgICBwcml2YXRlIF9sZWZ0OiBudW1iZXIgPSAwO1xyXG5cclxuXHJcbiAgICBwdWJsaWMgZ2V0IHRleHQoKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMuX3RleHQ7XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIHNldCB0ZXh0KHZhbHVlOiBzdHJpbmcpIHtcclxuICAgICAgICBpZiAodGhpcy5fdGV4dCAhPT0gdmFsdWUpIHtcclxuICAgICAgICAgICAgdGhpcy5fdGV4dCA9IHZhbHVlO1xyXG4gICAgICAgICAgICB0aGlzLnJlZnJlc2goKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIGdldCBzaXplKCkge1xyXG4gICAgICAgIHJldHVybiB0aGlzLl9zaXplO1xyXG4gICAgfVxyXG5cclxuICAgIHB1YmxpYyBzZXQgc2l6ZSh2YWx1ZTogQmFkZ2VTaXplKSB7XHJcbiAgICAgICAgaWYgKHRoaXMuX3NpemUgIT09IHZhbHVlKSB7XHJcbiAgICAgICAgICAgIHRoaXMuX3NpemUgPSB2YWx1ZTtcclxuICAgICAgICAgICAgdGhpcy5yZWZyZXNoKCk7XHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG5cclxuICAgIHB1YmxpYyBnZXQgdmFyaWFudCgpIHtcclxuICAgICAgICByZXR1cm4gdGhpcy5fdmFyaWFudDtcclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgc2V0IHZhcmlhbnQodmFsdWU6IEJhZGdlVmFyaWFudCkge1xyXG4gICAgICAgIGlmICh0aGlzLl92YXJpYW50ICE9PSB2YWx1ZSkge1xyXG4gICAgICAgICAgICB0aGlzLl92YXJpYW50ID0gdmFsdWU7XHJcbiAgICAgICAgICAgIHRoaXMucmVmcmVzaCgpO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICBwdWJsaWMgZ2V0IGxlZnQoKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMuX2xlZnQ7XHJcbiAgICB9XHJcblxyXG4gICAgcHVibGljIHNldCBsZWZ0KHZhbHVlOiBudW1iZXIpIHtcclxuICAgICAgICBpZiAodGhpcy5fbGVmdCAhPT0gdmFsdWUpIHtcclxuICAgICAgICAgICAgdGhpcy5fbGVmdCA9IHZhbHVlO1xyXG4gICAgICAgICAgICB0aGlzLnJlZnJlc2goKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgXHJcbiAgICBcclxuXHJcbiAgICBjb25zdHJ1Y3RvcihcclxuICAgICAgICBwcml2YXRlIHJlYWRvbmx5IGNkUmVmOiBDaGFuZ2VEZXRlY3RvclJlZlxyXG4gICAgKSB7fVxyXG5cclxuICAgIG5nT25Jbml0KCk6IHZvaWQge31cclxuXHJcblxyXG4gICAgcHJpdmF0ZSByZWZyZXNoKCl7XHJcbiAgICAgICAgdGhpcy5jZFJlZi5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgICB9XHJcbn1cclxuIiwiPGRpdiBcclxuICAgIGNsYXNzPVwic2RzLWJhZGdlXCJcclxuICAgIFtjbGFzcy5wcmltYXJ5XT1cInZhcmlhbnQ9PT0ncHJpbWFyeSdcIlxyXG4gICAgW2NsYXNzLnNlY29uZGFyeV09XCJ2YXJpYW50PT09J3NlY29uZGFyeSdcIlxyXG4gICAgW3N0eWxlLmxlZnQucHhdPVwibGVmdFwiXHJcbiAgICBbY2xhc3MuZGVmYXVsdF09XCJzaXplID09PSAnZGVmYXVsdCdcIlxyXG4gICAgW2NsYXNzLnNtYWxsXT1cInNpemUgPT09ICdzbWFsbCdcIlxyXG4gICAgdGl0bGU9XCJ0ZXN0XCJcclxuXHJcbiAgICA+XHJcbiAgICA8c3BhbiAqbmdJZj1cInNpemU9PSdkZWZhdWx0J1wiPnt7dGV4dH19PC9zcGFuPlxyXG48L2Rpdj5cclxuIl19

package/esm2020/src/lib/badge/public-api.mjs

@@ -0,0 +1,3 @@
+export * from './badge.module';
+export * from './badge.directive';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZHMtY29tcG9uZW50cy9zcmMvbGliL2JhZGdlL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxnQkFBZ0IsQ0FBQztBQUMvQixjQUFjLG1CQUFtQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9iYWRnZS5tb2R1bGUnO1xyXG5leHBvcnQgKiBmcm9tICcuL2JhZGdlLmRpcmVjdGl2ZSc7XHJcbiJdfQ==

package/esm2020/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3BpY2FpbnRlcm5hdGlvbmFsLW5neC1zZHMtY29tcG9uZW50cy1zcmMtbGliLWJhZGdlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvYmFkZ2Uvc3BpY2FpbnRlcm5hdGlvbmFsLW5neC1zZHMtY29tcG9uZW50cy1zcmMtbGliLWJhZGdlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxjQUFjLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XG4iXX0=

package/fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs

@@ -0,0 +1,176 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Directive, Input, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class SdsBadgeComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        this._text = '';
+        this._size = 'default';
+        this._variant = 'primary';
+        this._left = 0;
+    }
+    get text() {
+        return this._text;
+    }
+    set text(value) {
+        if (this._text !== value) {
+            this._text = value;
+            this.refresh();
+        }
+    }
+    get size() {
+        return this._size;
+    }
+    set size(value) {
+        if (this._size !== value) {
+            this._size = value;
+            this.refresh();
+        }
+    }
+    get variant() {
+        return this._variant;
+    }
+    set variant(value) {
+        if (this._variant !== value) {
+            this._variant = value;
+            this.refresh();
+        }
+    }
+    get left() {
+        return this._left;
+    }
+    set left(value) {
+        if (this._left !== value) {
+            this._left = value;
+            this.refresh();
+        }
+    }
+    ngOnInit() { }
+    refresh() {
+        this.cdRef.detectChanges();
+    }
+}
+SdsBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+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    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n    class=\"sds-badge\"\r\n    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
+
+class SdsBadgeDirective {
+    constructor(host, appRef, viewContainerRef) {
+        this.host = host;
+        this.appRef = appRef;
+        this.viewContainerRef = viewContainerRef;
+        this.sdsBadge = '';
+        this.size = 'default';
+        this.variant = 'primary';
+        this.badgeComponentRef = null;
+    }
+    ngAfterViewInit() {
+        this.initializeBadge();
+    }
+    ngOnInit() {
+        const observer = new ResizeObserver(_ => {
+            if (this.badgeComponentRef) {
+                this.setBadgePosition();
+                // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;
+            }
+        });
+        observer.observe(this.host.nativeElement);
+    }
+    ;
+    ngOnChanges(changes) {
+        if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {
+            const value = `${changes['sdsBadge'].currentValue}`.trim();
+            if ((value === null || value === void 0 ? void 0 : value.length) > 0) {
+                this.initializeBadge();
+            }
+            else {
+                this.destroyBadgeComponentRef();
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.observer.unobserve(this.host.nativeElement);
+        this.observer.disconnect();
+        this.destroyBadgeComponentRef();
+    }
+    initializeBadge() {
+        if (this.badgeComponentRef === null) {
+            if (this.sdsBadge) {
+                this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);
+                this.badgeComponentRef.instance.text = this.sdsBadge;
+                this.badgeComponentRef.instance.variant = this.variant;
+                this.badgeComponentRef.instance.size = this.size;
+                this.setBadgePosition();
+            }
+        }
+        else {
+            this.badgeComponentRef.instance.text = this.sdsBadge;
+            this.badgeComponentRef.instance.variant = this.variant;
+            this.badgeComponentRef.instance.size = this.size;
+            this.setBadgePosition();
+        }
+    }
+    destroyBadgeComponentRef() {
+        if (this.badgeComponentRef !== null) {
+            this.appRef.detachView(this.badgeComponentRef.hostView);
+            this.badgeComponentRef.destroy();
+            this.badgeComponentRef = null;
+        }
+    }
+    setBadgePosition() {
+        if (this.badgeComponentRef) {
+            this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;
+            console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);
+        }
+    }
+}
+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 });
+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 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[sdsBadge]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { sdsBadge: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }] } });
+
+class SdsBadgeModule {
+}
+SdsBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SdsBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, declarations: [SdsBadgeDirective,
+        SdsBadgeComponent], imports: [CommonModule], exports: [SdsBadgeDirective] });
+SdsBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, imports: [[
+            CommonModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SdsBadgeDirective,
+                        SdsBadgeComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        SdsBadgeDirective
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SdsBadgeDirective, SdsBadgeModule };
+//# sourceMappingURL=spicainternational-ngx-sds-components-src-lib-badge.mjs.map

package/fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs.map

@@ -0,0 +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    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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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"}

package/fesm2015/spicainternational-ngx-sds-components.mjs

@@ -1,5 +1,6 @@
 export * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';
 export * from '@spicainternational/ngx-sds-components/src/lib/avatar';
+export * from '@spicainternational/ngx-sds-components/src/lib/badge';
 export * from '@spicainternational/ngx-sds-components/src/lib/callout';
 export * from '@spicainternational/ngx-sds-components/src/lib/color-picker';
 export * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';

package/fesm2015/spicainternational-ngx-sds-components.mjs.map

@@ -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/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"}
+{"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"}

package/fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs

@@ -0,0 +1,176 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Directive, Input, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class SdsBadgeComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        this._text = '';
+        this._size = 'default';
+        this._variant = 'primary';
+        this._left = 0;
+    }
+    get text() {
+        return this._text;
+    }
+    set text(value) {
+        if (this._text !== value) {
+            this._text = value;
+            this.refresh();
+        }
+    }
+    get size() {
+        return this._size;
+    }
+    set size(value) {
+        if (this._size !== value) {
+            this._size = value;
+            this.refresh();
+        }
+    }
+    get variant() {
+        return this._variant;
+    }
+    set variant(value) {
+        if (this._variant !== value) {
+            this._variant = value;
+            this.refresh();
+        }
+    }
+    get left() {
+        return this._left;
+    }
+    set left(value) {
+        if (this._left !== value) {
+            this._left = value;
+            this.refresh();
+        }
+    }
+    ngOnInit() { }
+    refresh() {
+        this.cdRef.detectChanges();
+    }
+}
+SdsBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+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    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n    class=\"sds-badge\"\r\n    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
+
+class SdsBadgeDirective {
+    constructor(host, appRef, viewContainerRef) {
+        this.host = host;
+        this.appRef = appRef;
+        this.viewContainerRef = viewContainerRef;
+        this.sdsBadge = '';
+        this.size = 'default';
+        this.variant = 'primary';
+        this.badgeComponentRef = null;
+    }
+    ngAfterViewInit() {
+        this.initializeBadge();
+    }
+    ngOnInit() {
+        const observer = new ResizeObserver(_ => {
+            if (this.badgeComponentRef) {
+                this.setBadgePosition();
+                // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;
+            }
+        });
+        observer.observe(this.host.nativeElement);
+    }
+    ;
+    ngOnChanges(changes) {
+        if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {
+            const value = `${changes['sdsBadge'].currentValue}`.trim();
+            if (value?.length > 0) {
+                this.initializeBadge();
+            }
+            else {
+                this.destroyBadgeComponentRef();
+            }
+        }
+    }
+    ngOnDestroy() {
+        this.observer.unobserve(this.host.nativeElement);
+        this.observer.disconnect();
+        this.destroyBadgeComponentRef();
+    }
+    initializeBadge() {
+        if (this.badgeComponentRef === null) {
+            if (this.sdsBadge) {
+                this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);
+                this.badgeComponentRef.instance.text = this.sdsBadge;
+                this.badgeComponentRef.instance.variant = this.variant;
+                this.badgeComponentRef.instance.size = this.size;
+                this.setBadgePosition();
+            }
+        }
+        else {
+            this.badgeComponentRef.instance.text = this.sdsBadge;
+            this.badgeComponentRef.instance.variant = this.variant;
+            this.badgeComponentRef.instance.size = this.size;
+            this.setBadgePosition();
+        }
+    }
+    destroyBadgeComponentRef() {
+        if (this.badgeComponentRef !== null) {
+            this.appRef.detachView(this.badgeComponentRef.hostView);
+            this.badgeComponentRef.destroy();
+            this.badgeComponentRef = null;
+        }
+    }
+    setBadgePosition() {
+        if (this.badgeComponentRef) {
+            this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;
+            console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);
+        }
+    }
+}
+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 });
+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 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[sdsBadge]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ApplicationRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { sdsBadge: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }] } });
+
+class SdsBadgeModule {
+}
+SdsBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SdsBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, declarations: [SdsBadgeDirective,
+        SdsBadgeComponent], imports: [CommonModule], exports: [SdsBadgeDirective] });
+SdsBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, imports: [[
+            CommonModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsBadgeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SdsBadgeDirective,
+                        SdsBadgeComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        SdsBadgeDirective
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SdsBadgeDirective, SdsBadgeModule };
+//# sourceMappingURL=spicainternational-ngx-sds-components-src-lib-badge.mjs.map

package/fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs.map

@@ -0,0 +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    [class.primary]=\"variant==='primary'\"\r\n    [class.secondary]=\"variant==='secondary'\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    title=\"test\"\r\n\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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"}

package/fesm2020/spicainternational-ngx-sds-components.mjs

@@ -1,5 +1,6 @@
 export * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';
 export * from '@spicainternational/ngx-sds-components/src/lib/avatar';
+export * from '@spicainternational/ngx-sds-components/src/lib/badge';
 export * from '@spicainternational/ngx-sds-components/src/lib/callout';
 export * from '@spicainternational/ngx-sds-components/src/lib/color-picker';
 export * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';

package/fesm2020/spicainternational-ngx-sds-components.mjs.map

@@ -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/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"}
+{"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spicainternational/ngx-sds-components",
-  "version": "2.29.0",
+  "version": "2.30.0",
   "description": "Spica design system angular components.",
   "peerDependencies": {
     "@angular/common": ">=13.3.0",
@@ -54,6 +54,14 @@
       "node": "./fesm2015/spicainternational-ngx-sds-components-src-lib-avatar.mjs",
       "default": "./fesm2020/spicainternational-ngx-sds-components-src-lib-avatar.mjs"
     },
+    "./src/lib/badge": {
+      "types": "./src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.d.ts",
+      "esm2020": "./esm2020/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+      "es2020": "./fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+      "es2015": "./fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+      "node": "./fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+      "default": "./fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs"
+    },
     "./src/lib/callout": {
       "types": "./src/lib/callout/spicainternational-ngx-sds-components-src-lib-callout.d.ts",
       "esm2020": "./esm2020/src/lib/callout/spicainternational-ngx-sds-components-src-lib-callout.mjs",

package/public-api.d.ts

@@ -1,5 +1,6 @@
 export * from '@spicainternational/ngx-sds-components/src/lib/app-switcher';
 export * from '@spicainternational/ngx-sds-components/src/lib/avatar';
+export * from '@spicainternational/ngx-sds-components/src/lib/badge';
 export * from '@spicainternational/ngx-sds-components/src/lib/callout';
 export * from '@spicainternational/ngx-sds-components/src/lib/color-picker';
 export * from '@spicainternational/ngx-sds-components/src/lib/expansion-panel';

package/src/lib/badge/badge.directive.d.ts

@@ -0,0 +1,23 @@
+import { AfterViewInit, ApplicationRef, ElementRef, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewContainerRef } from '@angular/core';
+import { BadgeSize, BadgeVariant } from './badge.types';
+import * as i0 from "@angular/core";
+export declare class SdsBadgeDirective implements OnInit, OnChanges, OnDestroy, AfterViewInit {
+    private host;
+    private appRef;
+    private viewContainerRef;
+    sdsBadge: string;
+    size: BadgeSize;
+    variant: BadgeVariant;
+    private badgeComponentRef;
+    private observer;
+    constructor(host: ElementRef, appRef: ApplicationRef, viewContainerRef: ViewContainerRef);
+    ngAfterViewInit(): void;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    private initializeBadge;
+    private destroyBadgeComponentRef;
+    private setBadgePosition;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdsBadgeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdsBadgeDirective, "[sdsBadge]", never, { "sdsBadge": "sdsBadge"; "size": "size"; "variant": "variant"; }, {}, never>;
+}

package/src/lib/badge/badge.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./badge.directive";
+import * as i2 from "./components/badge.component";
+import * as i3 from "@angular/common";
+export declare class SdsBadgeModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdsBadgeModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SdsBadgeModule, [typeof i1.SdsBadgeDirective, typeof i2.SdsBadgeComponent], [typeof i3.CommonModule], [typeof i1.SdsBadgeDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SdsBadgeModule>;
+}

package/src/lib/badge/badge.types.d.ts

@@ -0,0 +1,2 @@
+export declare type BadgeVariant = 'primary' | 'secondary';
+export declare type BadgeSize = 'default' | 'small';

package/src/lib/badge/components/badge.component.d.ts

@@ -0,0 +1,23 @@
+import { ChangeDetectorRef, OnInit } from '@angular/core';
+import { BadgeSize, BadgeVariant } from '../badge.types';
+import * as i0 from "@angular/core";
+export declare class SdsBadgeComponent implements OnInit {
+    private readonly cdRef;
+    private _text;
+    private _size;
+    private _variant;
+    private _left;
+    get text(): string;
+    set text(value: string);
+    get size(): BadgeSize;
+    set size(value: BadgeSize);
+    get variant(): BadgeVariant;
+    set variant(value: BadgeVariant);
+    get left(): number;
+    set left(value: number);
+    constructor(cdRef: ChangeDetectorRef);
+    ngOnInit(): void;
+    private refresh;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdsBadgeComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdsBadgeComponent, "sds-badge", never, {}, {}, never, never>;
+}

package/src/lib/badge/package.json

@@ -0,0 +1,10 @@
+{
+  "module": "../../../fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+  "es2020": "../../../fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+  "esm2020": "../../../esm2020/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+  "fesm2020": "../../../fesm2020/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+  "fesm2015": "../../../fesm2015/spicainternational-ngx-sds-components-src-lib-badge.mjs",
+  "typings": "spicainternational-ngx-sds-components-src-lib-badge.d.ts",
+  "sideEffects": false,
+  "name": "@spicainternational/ngx-sds-components/src/lib/badge"
+}

package/src/lib/badge/public-api.d.ts

@@ -0,0 +1,2 @@
+export * from './badge.module';
+export * from './badge.directive';

package/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@spicainternational/ngx-sds-components/src/lib/badge" />
+export * from './public-api';