@dso-design-system/ui 0.1.0 → 0.1.1

package/esm2022/lib/badge/badge.directive.mjs

@@ -0,0 +1,68 @@
+import { Directive, Input } from '@angular/core';
+import * as i0 from "@angular/core";
+export class BadgeDirective {
+    el;
+    renderer;
+    // The text or number displayed inside the badge (e.g. "5" or empty for a dot)
+    label = null;
+    // Optional color input, defaulting to 'primary'
+    badgeColor = 'info';
+    // We'll store a reference to the created badge element here
+    badgeEl = null;
+    constructor(el, // Reference to the host element (the one with [dsoDirectiveBadge])
+    renderer // Used for safe DOM manipulation in Angular
+    ) {
+        this.el = el;
+        this.renderer = renderer;
+        // Ensure the host element is relatively positioned so the badge can be placed absolutely
+        this.renderer.setStyle(this.el.nativeElement, 'position', 'relative');
+    }
+    // Called automatically whenever @Input values change (label or badgeColor)
+    ngOnChanges(changes) {
+        this.updateBadge();
+    }
+    // Create or update the badge element
+    updateBadge() {
+        // console.log('BadgeDirective running on', this.el.nativeElement);
+        // ✅ STEP 1: If we don’t already have a badge element, create one
+        if (!this.badgeEl) {
+            this.badgeEl = this.renderer.createElement('span'); // create <span>
+            this.renderer.addClass(this.badgeEl, 'badge-directive'); // add base class
+            // Append the badge <span> inside the host element (the icon, button, avatar, etc.)
+            this.renderer.appendChild(this.el.nativeElement, this.badgeEl);
+        }
+        // At this point, badgeEl definitely exists, but TypeScript doesn’t know that.
+        // So, we use a non-null assertion (!) to tell TypeScript “we’re sure it’s not null”.
+        const badge = this.badgeEl;
+        // ✅ STEP 2: Update label and style
+        // If the label is empty/null, it becomes a dot badge
+        if (this.label === null || this.label === '' || this.label === undefined) {
+            this.renderer.addClass(badge, 'dot');
+            badge.textContent = ''; // no text, just a dot
+        }
+        else {
+            this.renderer.removeClass(badge, 'dot');
+            badge.textContent = this.label.toString();
+        }
+        // ✅ STEP 3: Update color classes
+        // First, remove all possible color classes
+        badge.classList.remove('info', 'success', 'warning', 'danger');
+        // Then, add the one we want
+        badge.classList.add(this.badgeColor);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: BadgeDirective, isStandalone: true, selector: "[dsoDirectiveBadge]", inputs: { label: ["dsoDirectiveBadge", "label"], badgeColor: "badgeColor" }, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dsoDirectiveBadge]', // This directive is used like: <app-icon dsoDirectiveBadge="5"></app-icon>
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { label: [{
+                type: Input,
+                args: ['dsoDirectiveBadge']
+            }], badgeColor: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdWkvc3JjL2xpYi9iYWRnZS9iYWRnZS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQXVDLE1BQU0sZUFBZSxDQUFDOztBQU1sRyxNQUFNLE9BQU8sY0FBYztJQVdmO0lBQ0E7SUFYViw4RUFBOEU7SUFDbEQsS0FBSyxHQUEyQixJQUFJLENBQUM7SUFFakUsZ0RBQWdEO0lBQ3ZDLFVBQVUsR0FBOEMsTUFBTSxDQUFDO0lBRXhFLDREQUE0RDtJQUNwRCxPQUFPLEdBQXVCLElBQUksQ0FBQztJQUUzQyxZQUNVLEVBQWMsRUFBRSxtRUFBbUU7SUFDbkYsUUFBbUIsQ0FBQyw0Q0FBNEM7O1FBRGhFLE9BQUUsR0FBRixFQUFFLENBQVk7UUFDZCxhQUFRLEdBQVIsUUFBUSxDQUFXO1FBRTNCLHlGQUF5RjtRQUN6RixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxVQUFVLEVBQUUsVUFBVSxDQUFDLENBQUM7SUFDeEUsQ0FBQztJQUVELDJFQUEyRTtJQUMzRSxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFRCxxQ0FBcUM7SUFDN0IsV0FBVztRQUNqQixtRUFBbUU7UUFFbkUsaUVBQWlFO1FBQ2pFLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7WUFDbEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLGFBQWEsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLGdCQUFnQjtZQUNwRSxJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxpQkFBaUI7WUFFMUUsbUZBQW1GO1lBQ25GLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUNqRSxDQUFDO1FBRUQsOEVBQThFO1FBQzlFLHFGQUFxRjtRQUNyRixNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsT0FBUSxDQUFDO1FBRTVCLG1DQUFtQztRQUNuQyxxREFBcUQ7UUFDckQsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLElBQUksSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLEVBQUUsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRSxDQUFDO1lBQ3pFLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQztZQUNyQyxLQUFLLENBQUMsV0FBVyxHQUFHLEVBQUUsQ0FBQyxDQUFDLHNCQUFzQjtRQUNoRCxDQUFDO2FBQU0sQ0FBQztZQUNOLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQztZQUN4QyxLQUFLLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDNUMsQ0FBQztRQUVELGlDQUFpQztRQUNqQywyQ0FBMkM7UUFDM0MsS0FBSyxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsTUFBTSxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsUUFBUSxDQUFDLENBQUM7UUFDL0QsNEJBQTRCO1FBQzVCLEtBQUssQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUN2QyxDQUFDO3dHQXZEVSxjQUFjOzRGQUFkLGNBQWM7OzRGQUFkLGNBQWM7a0JBSjFCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHFCQUFxQixFQUFFLDJFQUEyRTtvQkFDNUcsVUFBVSxFQUFFLElBQUk7aUJBQ2pCO3VHQUc2QixLQUFLO3NCQUFoQyxLQUFLO3VCQUFDLG1CQUFtQjtnQkFHakIsVUFBVTtzQkFBbEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIFJlbmRlcmVyMiwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5ARGlyZWN0aXZlKHtcclxuICBzZWxlY3RvcjogJ1tkc29EaXJlY3RpdmVCYWRnZV0nLCAvLyBUaGlzIGRpcmVjdGl2ZSBpcyB1c2VkIGxpa2U6IDxhcHAtaWNvbiBkc29EaXJlY3RpdmVCYWRnZT1cIjVcIj48L2FwcC1pY29uPlxyXG4gIHN0YW5kYWxvbmU6IHRydWVcclxufSlcclxuZXhwb3J0IGNsYXNzIEJhZGdlRGlyZWN0aXZlIGltcGxlbWVudHMgT25DaGFuZ2VzIHtcclxuICAvLyBUaGUgdGV4dCBvciBudW1iZXIgZGlzcGxheWVkIGluc2lkZSB0aGUgYmFkZ2UgKGUuZy4gXCI1XCIgb3IgZW1wdHkgZm9yIGEgZG90KVxyXG4gIEBJbnB1dCgnZHNvRGlyZWN0aXZlQmFkZ2UnKSBsYWJlbDogc3RyaW5nIHwgbnVtYmVyIHwgbnVsbCA9IG51bGw7XHJcblxyXG4gIC8vIE9wdGlvbmFsIGNvbG9yIGlucHV0LCBkZWZhdWx0aW5nIHRvICdwcmltYXJ5J1xyXG4gIEBJbnB1dCgpIGJhZGdlQ29sb3I6ICdpbmZvJyB8ICdzdWNjZXNzJyB8ICd3YXJuaW5nJyB8ICdkYW5nZXInID0gJ2luZm8nO1xyXG5cclxuICAvLyBXZSdsbCBzdG9yZSBhIHJlZmVyZW5jZSB0byB0aGUgY3JlYXRlZCBiYWRnZSBlbGVtZW50IGhlcmVcclxuICBwcml2YXRlIGJhZGdlRWw6IEhUTUxFbGVtZW50IHwgbnVsbCA9IG51bGw7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSBlbDogRWxlbWVudFJlZiwgLy8gUmVmZXJlbmNlIHRvIHRoZSBob3N0IGVsZW1lbnQgKHRoZSBvbmUgd2l0aCBbZHNvRGlyZWN0aXZlQmFkZ2VdKVxyXG4gICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyIC8vIFVzZWQgZm9yIHNhZmUgRE9NIG1hbmlwdWxhdGlvbiBpbiBBbmd1bGFyXHJcbiAgKSB7XHJcbiAgICAvLyBFbnN1cmUgdGhlIGhvc3QgZWxlbWVudCBpcyByZWxhdGl2ZWx5IHBvc2l0aW9uZWQgc28gdGhlIGJhZGdlIGNhbiBiZSBwbGFjZWQgYWJzb2x1dGVseVxyXG4gICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZSh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsICdwb3NpdGlvbicsICdyZWxhdGl2ZScpO1xyXG4gIH1cclxuXHJcbiAgLy8gQ2FsbGVkIGF1dG9tYXRpY2FsbHkgd2hlbmV2ZXIgQElucHV0IHZhbHVlcyBjaGFuZ2UgKGxhYmVsIG9yIGJhZGdlQ29sb3IpXHJcbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcykge1xyXG4gICAgdGhpcy51cGRhdGVCYWRnZSgpO1xyXG4gIH1cclxuXHJcbiAgLy8gQ3JlYXRlIG9yIHVwZGF0ZSB0aGUgYmFkZ2UgZWxlbWVudFxyXG4gIHByaXZhdGUgdXBkYXRlQmFkZ2UoKTogdm9pZCB7XHJcbiAgICAvLyBjb25zb2xlLmxvZygnQmFkZ2VEaXJlY3RpdmUgcnVubmluZyBvbicsIHRoaXMuZWwubmF0aXZlRWxlbWVudCk7XHJcblxyXG4gICAgLy8g4pyFIFNURVAgMTogSWYgd2UgZG9u4oCZdCBhbHJlYWR5IGhhdmUgYSBiYWRnZSBlbGVtZW50LCBjcmVhdGUgb25lXHJcbiAgICBpZiAoIXRoaXMuYmFkZ2VFbCkge1xyXG4gICAgICB0aGlzLmJhZGdlRWwgPSB0aGlzLnJlbmRlcmVyLmNyZWF0ZUVsZW1lbnQoJ3NwYW4nKTsgLy8gY3JlYXRlIDxzcGFuPlxyXG4gICAgICB0aGlzLnJlbmRlcmVyLmFkZENsYXNzKHRoaXMuYmFkZ2VFbCwgJ2JhZGdlLWRpcmVjdGl2ZScpOyAvLyBhZGQgYmFzZSBjbGFzc1xyXG5cclxuICAgICAgLy8gQXBwZW5kIHRoZSBiYWRnZSA8c3Bhbj4gaW5zaWRlIHRoZSBob3N0IGVsZW1lbnQgKHRoZSBpY29uLCBidXR0b24sIGF2YXRhciwgZXRjLilcclxuICAgICAgdGhpcy5yZW5kZXJlci5hcHBlbmRDaGlsZCh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsIHRoaXMuYmFkZ2VFbCk7XHJcbiAgICB9XHJcblxyXG4gICAgLy8gQXQgdGhpcyBwb2ludCwgYmFkZ2VFbCBkZWZpbml0ZWx5IGV4aXN0cywgYnV0IFR5cGVTY3JpcHQgZG9lc27igJl0IGtub3cgdGhhdC5cclxuICAgIC8vIFNvLCB3ZSB1c2UgYSBub24tbnVsbCBhc3NlcnRpb24gKCEpIHRvIHRlbGwgVHlwZVNjcmlwdCDigJx3ZeKAmXJlIHN1cmUgaXTigJlzIG5vdCBudWxs4oCdLlxyXG4gICAgY29uc3QgYmFkZ2UgPSB0aGlzLmJhZGdlRWwhO1xyXG5cclxuICAgIC8vIOKchSBTVEVQIDI6IFVwZGF0ZSBsYWJlbCBhbmQgc3R5bGVcclxuICAgIC8vIElmIHRoZSBsYWJlbCBpcyBlbXB0eS9udWxsLCBpdCBiZWNvbWVzIGEgZG90IGJhZGdlXHJcbiAgICBpZiAodGhpcy5sYWJlbCA9PT0gbnVsbCB8fCB0aGlzLmxhYmVsID09PSAnJyB8fCB0aGlzLmxhYmVsID09PSB1bmRlZmluZWQpIHtcclxuICAgICAgdGhpcy5yZW5kZXJlci5hZGRDbGFzcyhiYWRnZSwgJ2RvdCcpO1xyXG4gICAgICBiYWRnZS50ZXh0Q29udGVudCA9ICcnOyAvLyBubyB0ZXh0LCBqdXN0IGEgZG90XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICB0aGlzLnJlbmRlcmVyLnJlbW92ZUNsYXNzKGJhZGdlLCAnZG90Jyk7XHJcbiAgICAgIGJhZGdlLnRleHRDb250ZW50ID0gdGhpcy5sYWJlbC50b1N0cmluZygpO1xyXG4gICAgfVxyXG5cclxuICAgIC8vIOKchSBTVEVQIDM6IFVwZGF0ZSBjb2xvciBjbGFzc2VzXHJcbiAgICAvLyBGaXJzdCwgcmVtb3ZlIGFsbCBwb3NzaWJsZSBjb2xvciBjbGFzc2VzXHJcbiAgICBiYWRnZS5jbGFzc0xpc3QucmVtb3ZlKCdpbmZvJywgJ3N1Y2Nlc3MnLCAnd2FybmluZycsICdkYW5nZXInKTtcclxuICAgIC8vIFRoZW4sIGFkZCB0aGUgb25lIHdlIHdhbnRcclxuICAgIGJhZGdlLmNsYXNzTGlzdC5hZGQodGhpcy5iYWRnZUNvbG9yKTtcclxuICB9XHJcbn1cclxuIl19

package/esm2022/public-api.mjs

@@ -1,11 +1,11 @@
 export * from './lib/alert/alert.component';
 export * from './lib/badge/badge.component';
+export * from './lib/badge/badge.directive';
 export * from './lib/breadcrumb/breadcrumb.component';
 export * from './lib/button/button.component';
 export * from './lib/checkbox/checkbox.component';
 export * from './lib/datepicker/datepicker.component';
 export * from './lib/dialog/dialog.component';
-export * from './lib/directives/truncate.directive';
 export * from './lib/dropdown-list/dropdown-list.component';
 export * from './lib/file-upload-items/file-upload-items.component';
 export * from './lib/file-upload-multiple/file-upload-multiple.component';
@@ -20,9 +20,11 @@ export * from './lib/side-navigation-bar/side-navigation-bar.component';
 export * from './lib/spinner/spinner.component';
 export * from './lib/table/table.component';
 export * from './lib/tabs/tabs.component';
+export * from './lib/tabs/tab.component';
 export * from './lib/tag/tag.component';
 export * from './lib/text-area/text-area.component';
 export * from './lib/toast/toast.component';
 export * from './lib/tooltip/tooltip.component';
+export * from './lib/tooltip/tooltip.directive';
 export * from './lib/top-navigation-bar/top-navigation-bar.component';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL3VpL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNkJBQTZCLENBQUM7QUFDNUMsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLHVDQUF1QyxDQUFDO0FBQ3RELGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyxtQ0FBbUMsQ0FBQztBQUNsRCxjQUFjLHVDQUF1QyxDQUFDO0FBQ3RELGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyxxQ0FBcUMsQ0FBQztBQUNwRCxjQUFjLDZDQUE2QyxDQUFDO0FBQzVELGNBQWMscURBQXFELENBQUM7QUFDcEUsY0FBYywyREFBMkQsQ0FBQztBQUMxRSxjQUFjLHVEQUF1RCxDQUFDO0FBQ3RFLGNBQWMsMkJBQTJCLENBQUM7QUFDMUMsY0FBYyx1Q0FBdUMsQ0FBQztBQUN0RCxjQUFjLHVDQUF1QyxDQUFDO0FBQ3RELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLGlEQUFpRCxDQUFDO0FBQ2hFLGNBQWMseURBQXlELENBQUM7QUFDeEUsY0FBYyxpQ0FBaUMsQ0FBQztBQUNoRCxjQUFjLDZCQUE2QixDQUFDO0FBQzVDLGNBQWMsMkJBQTJCLENBQUM7QUFDMUMsY0FBYyx5QkFBeUIsQ0FBQztBQUN4QyxjQUFjLHFDQUFxQyxDQUFDO0FBQ3BELGNBQWMsNkJBQTZCLENBQUM7QUFDNUMsY0FBYyxpQ0FBaUMsQ0FBQztBQUNoRCxjQUFjLHVEQUF1RCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9saWIvYWxlcnQvYWxlcnQuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvYmFkZ2UvYmFkZ2UuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvYnJlYWRjcnVtYi9icmVhZGNydW1iLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2J1dHRvbi9idXR0b24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGF0ZXBpY2tlci9kYXRlcGlja2VyLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpYWxvZy9kaWFsb2cuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlcy90cnVuY2F0ZS5kaXJlY3RpdmUnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kcm9wZG93bi1saXN0L2Ryb3Bkb3duLWxpc3QuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZmlsZS11cGxvYWQtaXRlbXMvZmlsZS11cGxvYWQtaXRlbXMuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZmlsZS11cGxvYWQtbXVsdGlwbGUvZmlsZS11cGxvYWQtbXVsdGlwbGUuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZmlsZS11cGxvYWQtc2luZ2xlL2ZpbGUtdXBsb2FkLXNpbmdsZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9pY29uL2ljb24uY29tcG9uZW50JzsgXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2lucHV0LXRleHQvaW5wdXQtdGV4dC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9wYWdpbmF0aW9uL3BhZ2luYXRpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvcHJvZ3Jlc3MtYmFyL3Byb2dyZXNzLWJhci5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9yYWRpby9yYWRpby5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZWxlY3QtZHJvcGRvd24vc2VsZWN0LWRyb3Bkb3duLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NpZGUtbmF2aWdhdGlvbi1iYXIvc2lkZS1uYXZpZ2F0aW9uLWJhci5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zcGlubmVyL3NwaW5uZXIuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdGFibGUvdGFibGUuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdGFicy90YWJzLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3RhZy90YWcuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdGV4dC1hcmVhL3RleHQtYXJlYS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90b2FzdC90b2FzdC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90b29sdGlwL3Rvb2x0aXAuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdG9wLW5hdmlnYXRpb24tYmFyL3RvcC1uYXZpZ2F0aW9uLWJhci5jb21wb25lbnQnO1xyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL3VpL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNkJBQTZCLENBQUM7QUFDNUMsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLDZCQUE2QixDQUFDO0FBQzVDLGNBQWMsdUNBQXVDLENBQUM7QUFDdEQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGNBQWMsdUNBQXVDLENBQUM7QUFDdEQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLDZDQUE2QyxDQUFDO0FBQzVELGNBQWMscURBQXFELENBQUM7QUFDcEUsY0FBYywyREFBMkQsQ0FBQztBQUMxRSxjQUFjLHVEQUF1RCxDQUFDO0FBQ3RFLGNBQWMsMkJBQTJCLENBQUM7QUFDMUMsY0FBYyx1Q0FBdUMsQ0FBQztBQUN0RCxjQUFjLHVDQUF1QyxDQUFDO0FBQ3RELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLGlEQUFpRCxDQUFDO0FBQ2hFLGNBQWMseURBQXlELENBQUM7QUFDeEUsY0FBYyxpQ0FBaUMsQ0FBQztBQUNoRCxjQUFjLDZCQUE2QixDQUFDO0FBQzVDLGNBQWMsMkJBQTJCLENBQUM7QUFDMUMsY0FBYywwQkFBMEIsQ0FBQztBQUN6QyxjQUFjLHlCQUF5QixDQUFDO0FBQ3hDLGNBQWMscUNBQXFDLENBQUM7QUFDcEQsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLGlDQUFpQyxDQUFDO0FBQ2hELGNBQWMsaUNBQWlDLENBQUM7QUFDaEQsY0FBYyx1REFBdUQsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL2FsZXJ0L2FsZXJ0LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2JhZGdlL2JhZGdlLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2JhZGdlL2JhZGdlLmRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2JyZWFkY3J1bWIvYnJlYWRjcnVtYi5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9idXR0b24vYnV0dG9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NoZWNrYm94L2NoZWNrYm94LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RhdGVwaWNrZXIvZGF0ZXBpY2tlci5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaWFsb2cvZGlhbG9nLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2Ryb3Bkb3duLWxpc3QvZHJvcGRvd24tbGlzdC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9maWxlLXVwbG9hZC1pdGVtcy9maWxlLXVwbG9hZC1pdGVtcy5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9maWxlLXVwbG9hZC1tdWx0aXBsZS9maWxlLXVwbG9hZC1tdWx0aXBsZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9maWxlLXVwbG9hZC1zaW5nbGUvZmlsZS11cGxvYWQtc2luZ2xlLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2ljb24vaWNvbi5jb21wb25lbnQnOyBcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvaW5wdXQtdGV4dC9pbnB1dC10ZXh0LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3BhZ2luYXRpb24vcGFnaW5hdGlvbi5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9wcm9ncmVzcy1iYXIvcHJvZ3Jlc3MtYmFyLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3JhZGlvL3JhZGlvLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlbGVjdC1kcm9wZG93bi9zZWxlY3QtZHJvcGRvd24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2lkZS1uYXZpZ2F0aW9uLWJhci9zaWRlLW5hdmlnYXRpb24tYmFyLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NwaW5uZXIvc3Bpbm5lci5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90YWJsZS90YWJsZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90YWJzL3RhYnMuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdGFicy90YWIuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdGFnL3RhZy5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90ZXh0LWFyZWEvdGV4dC1hcmVhLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3RvYXN0L3RvYXN0LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3Rvb2x0aXAvdG9vbHRpcC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi90b29sdGlwL3Rvb2x0aXAuZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdG9wLW5hdmlnYXRpb24tYmFyL3RvcC1uYXZpZ2F0aW9uLWJhci5jb21wb25lbnQnO1xyXG4iXX0=

package/fesm2022/dso-design-system-ui.mjs

@@ -1,7 +1,7 @@
 import * as i1 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Component, Input, EventEmitter, Output, ViewChild, HostListener, Directive, Injectable, ContentChildren } from '@angular/core';
+import { Component, Input, EventEmitter, Output, Directive, ViewChild, HostListener, Injectable, ContentChildren } from '@angular/core';
 import * as i2$1 from '@angular/router';
 import { RouterLink, RouterModule } from '@angular/router';
 import * as i2 from '@angular/forms';
@@ -194,6 +194,72 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Input
             }] } });
 
+class BadgeDirective {
+    el;
+    renderer;
+    // The text or number displayed inside the badge (e.g. "5" or empty for a dot)
+    label = null;
+    // Optional color input, defaulting to 'primary'
+    badgeColor = 'info';
+    // We'll store a reference to the created badge element here
+    badgeEl = null;
+    constructor(el, // Reference to the host element (the one with [dsoDirectiveBadge])
+    renderer // Used for safe DOM manipulation in Angular
+    ) {
+        this.el = el;
+        this.renderer = renderer;
+        // Ensure the host element is relatively positioned so the badge can be placed absolutely
+        this.renderer.setStyle(this.el.nativeElement, 'position', 'relative');
+    }
+    // Called automatically whenever @Input values change (label or badgeColor)
+    ngOnChanges(changes) {
+        this.updateBadge();
+    }
+    // Create or update the badge element
+    updateBadge() {
+        // console.log('BadgeDirective running on', this.el.nativeElement);
+        // ✅ STEP 1: If we don’t already have a badge element, create one
+        if (!this.badgeEl) {
+            this.badgeEl = this.renderer.createElement('span'); // create <span>
+            this.renderer.addClass(this.badgeEl, 'badge-directive'); // add base class
+            // Append the badge <span> inside the host element (the icon, button, avatar, etc.)
+            this.renderer.appendChild(this.el.nativeElement, this.badgeEl);
+        }
+        // At this point, badgeEl definitely exists, but TypeScript doesn’t know that.
+        // So, we use a non-null assertion (!) to tell TypeScript “we’re sure it’s not null”.
+        const badge = this.badgeEl;
+        // ✅ STEP 2: Update label and style
+        // If the label is empty/null, it becomes a dot badge
+        if (this.label === null || this.label === '' || this.label === undefined) {
+            this.renderer.addClass(badge, 'dot');
+            badge.textContent = ''; // no text, just a dot
+        }
+        else {
+            this.renderer.removeClass(badge, 'dot');
+            badge.textContent = this.label.toString();
+        }
+        // ✅ STEP 3: Update color classes
+        // First, remove all possible color classes
+        badge.classList.remove('info', 'success', 'warning', 'danger');
+        // Then, add the one we want
+        badge.classList.add(this.badgeColor);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: BadgeDirective, isStandalone: true, selector: "[dsoDirectiveBadge]", inputs: { label: ["dsoDirectiveBadge", "label"], badgeColor: "badgeColor" }, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dsoDirectiveBadge]', // This directive is used like: <app-icon dsoDirectiveBadge="5"></app-icon>
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { label: [{
+                type: Input,
+                args: ['dsoDirectiveBadge']
+            }], badgeColor: [{
+                type: Input
+            }] } });
+
 class BreadcrumbComponent {
     items = [];
     itemSelected = new EventEmitter();
@@ -470,75 +536,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Output
             }] } });
 
-class DsoTruncateDirective {
-    el;
-    /**
-     * Enable or disable truncation.
-     * Can be used as `<div dsoTruncate>` (enabled by default) or `[dsoTruncate]="false"`.
-     */
-    enableTruncate = true;
-    /** Optional: override tooltip text when text is truncated */
-    truncateTooltipText;
-    constructor(el) {
-        this.el = el;
-    }
-    /** Initialize truncation after the view is loaded */
-    ngAfterViewInit() {
-        if (this.enableTruncate) {
-            this.applyTruncationStyles();
-            this.updateTooltip();
-        }
-    }
-    /** Re-check overflow and update tooltip on window resize */
-    onResize() {
-        if (this.enableTruncate) {
-            this.updateTooltip();
-        }
-    }
-    // -------------------------
-    // PRIVATE METHODS
-    // -------------------------
-    /** Apply CSS styles necessary for truncation */
-    applyTruncationStyles() {
-        const element = this.el.nativeElement;
-        element.style.whiteSpace = 'nowrap';
-        element.style.overflow = 'hidden';
-        element.style.textOverflow = 'ellipsis';
-        element.style.display = 'inline-block';
-        element.style.maxWidth = '100%';
-    }
-    /** Update tooltip based on overflow state */
-    updateTooltip() {
-        const el = this.el.nativeElement;
-        const isOverflowing = el.scrollWidth > el.clientWidth;
-        if (isOverflowing) {
-            // Add or update tooltip with either the provided text or element content
-            el.setAttribute('dsoDirectiveTooltip', this.truncateTooltipText || el.textContent || '');
-        }
-        else {
-            // Remove tooltip if content fits
-            el.removeAttribute('dsoDirectiveTooltip');
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DsoTruncateDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: DsoTruncateDirective, isStandalone: true, selector: "[dsoTruncate]", inputs: { enableTruncate: ["dsoTruncate", "enableTruncate"], truncateTooltipText: "truncateTooltipText" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DsoTruncateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[dsoTruncate]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { enableTruncate: [{
-                type: Input,
-                args: ['dsoTruncate']
-            }], truncateTooltipText: [{
-                type: Input
-            }], onResize: [{
-                type: HostListener,
-                args: ['window:resize']
-            }] } });
-
 class DropdownListComponent {
     // -------------------------------
     // ELEMENT REFERENCE
@@ -2179,5 +2176,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AlertComponent, BadgeComponent, BreadcrumbComponent, ButtonComponent, CheckboxComponent, DatepickerComponent, DialogComponent, DropdownListComponent, DsoTruncateDirective, FileUploadItemComponent, FileUploadMultiComponent, FileUploadSingleComponent, IconComponent, PaginationComponent, ProgressBarComponent, RadioComponent, SideNavComponent, SingleSelectComponent, SpinnerComponent, TableComponent, TabsComponent, TagComponent, TextAreaComponent, TextInputComponent, ToastComponent, TooltipComponent, TopNavComponent };
+export { AlertComponent, BadgeComponent, BadgeDirective, BreadcrumbComponent, ButtonComponent, CheckboxComponent, DatepickerComponent, DialogComponent, DropdownListComponent, FileUploadItemComponent, FileUploadMultiComponent, FileUploadSingleComponent, IconComponent, PaginationComponent, ProgressBarComponent, RadioComponent, SideNavComponent, SingleSelectComponent, SpinnerComponent, TabComponent, TableComponent, TabsComponent, TagComponent, TextAreaComponent, TextInputComponent, ToastComponent, TooltipComponent, TooltipDirective, TopNavComponent };
 //# sourceMappingURL=dso-design-system-ui.mjs.map