@koobiq/components 18.32.0 → 18.34.0

package/fesm2022/koobiq-components-username.mjs

@@ -0,0 +1,308 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Injectable, Pipe, Directive, input, booleanAttribute, contentChild, computed, Component, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import * as i1 from '@koobiq/components/title';
+import { KbqTitleModule } from '@koobiq/components/title';
+
+/**
+ * Keys for formatting username parts in short (initial) or full form.
+ */
+var KbqUsernameFormatKey;
+(function (KbqUsernameFormatKey) {
+    /**
+     * Short form of the first name (e.g., "John" → "J")
+     */
+    KbqUsernameFormatKey["FirstNameShort"] = "f";
+    /**
+     * Full form of the first name (e.g., "John")
+     */
+    KbqUsernameFormatKey["FirstNameFull"] = "F";
+    /**
+     * Short form of the middle name (e.g., "Henry" → "H")
+     */
+    KbqUsernameFormatKey["MiddleNameShort"] = "m";
+    /**
+     * Full form of the middle name (e.g., "Henry")
+     */
+    KbqUsernameFormatKey["MiddleNameFull"] = "M";
+    /**
+     * Short form of the last name (e.g., "Doe" → "D")
+     */
+    KbqUsernameFormatKey["LastNameShort"] = "l";
+    /**
+     * Full form of the last name (e.g., "Doe")
+     */
+    KbqUsernameFormatKey["LastNameFull"] = "L";
+    KbqUsernameFormatKey["Dot"] = ".";
+})(KbqUsernameFormatKey || (KbqUsernameFormatKey = {}));
+
+/** Default name format: Last name full, first and middle as initials. */
+const kbqDefaultFullNameFormatCustom = 'L f. m.';
+/** Default name format: Last name full, first and middle as initials. */
+const kbqDefaultFullNameFormat = 'lf.m.';
+/**
+ * Throws an error when no profile field mapping is provided to the username pipe.
+ * @docs-private
+ */
+function KbqMappingMissingError() {
+    return new Error('KbqUsernamePipe: profile field mapping is required but was not provided.');
+}
+/**
+ * Injection token for providing a global username format-to-profile mapping.
+ */
+const KBQ_PROFILE_MAPPING = new InjectionToken('KBQ_PROFILE_MAPPING', {
+    factory: () => ({
+        [KbqUsernameFormatKey.FirstNameShort]: 'firstName',
+        [KbqUsernameFormatKey.MiddleNameShort]: 'middleName',
+        [KbqUsernameFormatKey.LastNameShort]: 'lastName',
+        [KbqUsernameFormatKey.Dot]: undefined
+    })
+});
+
+class KbqUsernamePipe {
+    constructor() {
+        this.mapping = inject(KBQ_PROFILE_MAPPING, { optional: true });
+    }
+    /** Builds a formatted name string from the user profile using the provided format and mapping. */
+    transform(profile, format = kbqDefaultFullNameFormat, customMapping) {
+        const resolvedMapping = customMapping || this.mapping;
+        if (!resolvedMapping) {
+            throw KbqMappingMissingError();
+        }
+        if (!profile || typeof profile !== 'object')
+            return '';
+        let result = '';
+        const formatUnits = format.split('');
+        formatUnits.forEach((letter, index, array) => {
+            if (letter !== KbqUsernameFormatKey.Dot) {
+                const field = resolvedMapping[letter];
+                const fieldValue = profile[field];
+                if (fieldValue) {
+                    const isShort = array[index + 1] === KbqUsernameFormatKey.Dot;
+                    const resolvedFieldValue = isShort ? `${fieldValue[0]}${KbqUsernameFormatKey.Dot}` : fieldValue;
+                    result += ` ${resolvedFieldValue}`;
+                }
+            }
+        });
+        return result.trim();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    /** @nocollapse */ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePipe, isStandalone: true, name: "kbqUsername" }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePipe, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePipe, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }, {
+            type: Pipe,
+            args: [{
+                    name: 'kbqUsername',
+                    pure: true,
+                    standalone: true
+                }]
+        }] });
+/**
+ * Pipe to format a user profile into a name string using a format pattern and field mapping.
+ * Lowercase keys output initials; uppercase keys show full values.
+ */
+class KbqUsernameCustomPipe {
+    constructor() {
+        this.mapping = inject(KBQ_PROFILE_MAPPING, { optional: true });
+    }
+    /** Builds a formatted name string from the user profile using the provided format and mapping. */
+    transform(profile, format = kbqDefaultFullNameFormatCustom, customMapping) {
+        const resolvedMapping = customMapping || this.mapping;
+        if (!resolvedMapping) {
+            throw KbqMappingMissingError();
+        }
+        if (!profile || typeof profile !== 'object')
+            return '';
+        let result = '';
+        const formatUnits = format.split('');
+        formatUnits.forEach((letter) => {
+            const field = resolvedMapping[letter];
+            if (!field) {
+                result += letter;
+                return;
+            }
+            const isShort = letter === letter.toLowerCase();
+            const fieldValue = profile[field] || '';
+            result += fieldValue && isShort ? fieldValue[0] : fieldValue;
+        });
+        return result.trim();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    /** @nocollapse */ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomPipe, isStandalone: true, name: "kbqUsernameCustom" }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomPipe, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomPipe, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }, {
+            type: Pipe,
+            args: [{
+                    name: 'kbqUsernameCustom',
+                    pure: true,
+                    standalone: true
+                }]
+        }] });
+
+const baseClass = 'kbq-username';
+/** Styles the primary part of the username (e.g. full name). */
+class KbqUsernamePrimary {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePrimary, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: KbqUsernamePrimary, isStandalone: true, selector: "[kbqUsernamePrimary]", host: { classAttribute: "kbq-username__primary" }, exportAs: ["kbqUsernamePrimary"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernamePrimary, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kbqUsernamePrimary]',
+                    exportAs: 'kbqUsernamePrimary',
+                    standalone: true,
+                    host: {
+                        class: `${baseClass}__primary`
+                    }
+                }]
+        }] });
+/** Styles the secondary part. */
+class KbqUsernameSecondary {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameSecondary, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: KbqUsernameSecondary, isStandalone: true, selector: "[kbqUsernameSecondary]", host: { classAttribute: "kbq-username__secondary" }, exportAs: ["kbqUsernameSecondary"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameSecondary, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kbqUsernameSecondary]',
+                    exportAs: 'kbqUsernameSecondary',
+                    standalone: true,
+                    host: {
+                        class: `${baseClass}__secondary`
+                    }
+                }]
+        }] });
+/** Styles a secondary hint. */
+class KbqUsernameSecondaryHint {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameSecondaryHint, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: KbqUsernameSecondaryHint, isStandalone: true, selector: "[kbqUsernameSecondaryHint]", host: { classAttribute: "kbq-username__secondary-hint" }, exportAs: ["kbqUsernameSecondaryHint"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameSecondaryHint, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kbqUsernameSecondaryHint]',
+                    exportAs: 'kbqUsernameSecondaryHint',
+                    standalone: true,
+                    host: {
+                        class: `${baseClass}__secondary-hint`
+                    }
+                }]
+        }] });
+/** Custom content for `KbqUsername`, overrides default view. */
+class KbqUsernameCustomView {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomView, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: KbqUsernameCustomView, isStandalone: true, selector: "kbq-username-custom-view, [kbq-username-custom-view]", host: { classAttribute: "kbq-username__custom-view" }, exportAs: ["kbqUsernameCustomView"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameCustomView, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'kbq-username-custom-view, [kbq-username-custom-view]',
+                    standalone: true,
+                    exportAs: 'kbqUsernameCustomView',
+                    host: {
+                        class: `${baseClass}__custom-view`
+                    }
+                }]
+        }] });
+/**
+ * Displays a user's name based on profile data.
+ * Supports different display modes and visual styles.
+ * A custom view can be provided via `<kbq-username-custom-view>` for full control over the output.
+ * Accepts input profile data and optional formatting options.
+ */
+class KbqUsername {
+    constructor() {
+        /** User profile data used for display. */
+        this.userInfo = input();
+        /** Enables compact display mode */
+        this.isCompact = input(false, { transform: booleanAttribute });
+        /** Format string for rendering the user's full name. */
+        this.fullNameFormat = input(kbqDefaultFullNameFormat);
+        /**
+         * Display mode of the username.
+         * @default inline
+         */
+        this.mode = input('inline');
+        /**
+         * Visual style of the username.
+         * @default default
+         */
+        this.type = input('default');
+        /**
+         * Custom projected view for username rendering.
+         * @docs-private
+         */
+        this.customView = contentChild(KbqUsernameCustomView);
+        /** @docs-private */
+        this.hasFullName = computed(() => {
+            const userInfo = this.userInfo();
+            if (!userInfo)
+                return false;
+            return userInfo?.lastName && userInfo?.firstName;
+        });
+        /** @docs-private */
+        this.class = computed(() => {
+            return [this.type(), this.mode()].map((modificator) => `${baseClass}_${modificator}`).join(' ');
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsername, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: KbqUsername, isStandalone: true, selector: "kbq-username", inputs: { userInfo: { classPropertyName: "userInfo", publicName: "userInfo", isSignal: true, isRequired: false, transformFunction: null }, isCompact: { classPropertyName: "isCompact", publicName: "isCompact", isSignal: true, isRequired: false, transformFunction: null }, fullNameFormat: { classPropertyName: "fullNameFormat", publicName: "fullNameFormat", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "class()" }, classAttribute: "kbq-username" }, queries: [{ propertyName: "customView", first: true, predicate: KbqUsernameCustomView, descendants: true, isSignal: true }], exportAs: ["kbqUsername"], ngImport: i0, template: "@let profile = userInfo();\n<ng-content select=\"kbq-username-custom-view,[kbq-username-custom-view]\" />\n\n@if (!customView() && profile) {\n    @let fullName = profile | kbqUsername: fullNameFormat();\n\n    @if (!isCompact()) {\n        @if (hasFullName()) {\n            <span kbq-title kbqUsernamePrimary>{{ fullName }}</span>\n        }\n\n        @if (profile.login) {\n            <span kbq-title kbqUsernameSecondary>\n                {{ profile.login }}\n\n                @if (profile.site) {\n                    <span kbqUsernameSecondaryHint>({{ profile.site }})</span>\n                }\n            </span>\n        }\n    } @else {\n        <span kbq-title kbqUsernamePrimary>\n            @if (hasFullName()) {\n                <span>{{ fullName }}</span>\n            }\n            @if (!hasFullName() && profile.login) {\n                {{ profile.login }}\n            }\n\n            @if (profile.site) {\n                <span kbqUsernameSecondaryHint>&nbsp;({{ profile.site }})</span>\n            }\n        </span>\n    }\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-username{color:var(--kbq-username-primary-color)}.kbq-username .kbq-username__secondary,.kbq-username .kbq-username__secondary-hint{color:var(--kbq-username-secondary-color)}.kbq-username.kbq-username_default .kbq-username__secondary-hint,.kbq-username.kbq-username_default .kbq-username__primary+.kbq-username__secondary{--kbq-username-secondary-color: var(--kbq-foreground-contrast-secondary)}.kbq-username.kbq-username_error{--kbq-username-primary-color: var(--kbq-foreground-error);--kbq-username-secondary-color: var(--kbq-foreground-error)}.kbq-username.kbq-username_accented{--kbq-username-primary-color: var(--kbq-foreground-contrast);--kbq-username-secondary-color: var(--kbq-foreground-contrast)}.kbq-username.kbq-username_inherit{--kbq-username-primary-color: inherit;--kbq-username-secondary-color: inherit}.kbq-username{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-username.kbq-username_accented .kbq-username__primary{font-size:var(--kbq-typography-text-normal-strong-font-size);font-style:var(--kbq-typography-text-normal-strong-font-style);font-weight:var(--kbq-typography-text-normal-strong-font-weight);line-height:var(--kbq-typography-text-normal-strong-line-height);font-family:var(--kbq-typography-text-normal-strong-font-family);text-transform:var(--kbq-typography-text-normal-strong-text-transform);font-feature-settings:var(--kbq-typography-text-normal-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-strong-letter-spacing)}.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_stacked>.kbq-username__custom-view{display:flex;flex-flow:column nowrap;justify-content:flex-start;align-items:normal;gap:var(--kbq-username-vertical-gap)}.kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:baseline}.kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)) .kbq-username__primary+.kbq-username__secondary,.kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view .kbq-username__primary+.kbq-username__secondary{margin-left:var(--kbq-username-horizontal-gap)}[dir=rtl] .kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)) .kbq-username__primary+.kbq-username__secondary,[dir=rtl] .kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view .kbq-username__primary+.kbq-username__secondary{margin-left:0;margin-right:var(--kbq-username-horizontal-gap)}.kbq-username.kbq-username_text:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_text>.kbq-username__custom-view{display:inline}.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)) .kbq-username__primary,.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)) .kbq-username__secondary,.kbq-username.kbq-username_stacked>.kbq-username__custom-view .kbq-username__primary,.kbq-username.kbq-username_stacked>.kbq-username__custom-view .kbq-username__secondary,.kbq-username.kbq-username_inline:not(:has(>.kbq-username__custom-view)) .kbq-username__primary,.kbq-username.kbq-username_inline:not(:has(>.kbq-username__custom-view)) .kbq-username__secondary,.kbq-username.kbq-username_inline>.kbq-username__custom-view .kbq-username__primary,.kbq-username.kbq-username_inline>.kbq-username__custom-view .kbq-username__secondary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-username.kbq-username_inherit:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_inherit>.kbq-username__custom-view{font:inherit;display:inherit}\n", ":where(.kbq-username){--kbq-username-primary-color: var(--kbq-foreground-contrast);--kbq-username-secondary-color: inherit;--kbq-username-vertical-gap: var(--kbq-size-xxs);--kbq-username-horizontal-gap: var(--kbq-size-xxs)}\n"], dependencies: [{ kind: "ngmodule", type: KbqTitleModule }, { kind: "directive", type: i1.KbqTitleDirective, selector: "[kbq-title]", exportAs: ["kbqTitle"] }, { kind: "pipe", type: KbqUsernamePipe, name: "kbqUsername" }, { kind: "directive", type: KbqUsernamePrimary, selector: "[kbqUsernamePrimary]", exportAs: ["kbqUsernamePrimary"] }, { kind: "directive", type: KbqUsernameSecondary, selector: "[kbqUsernameSecondary]", exportAs: ["kbqUsernameSecondary"] }, { kind: "directive", type: KbqUsernameSecondaryHint, selector: "[kbqUsernameSecondaryHint]", exportAs: ["kbqUsernameSecondaryHint"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsername, decorators: [{
+            type: Component,
+            args: [{ selector: 'kbq-username', standalone: true, exportAs: 'kbqUsername', imports: [
+                        KbqTitleModule,
+                        KbqUsernamePipe,
+                        KbqUsernamePrimary,
+                        KbqUsernameSecondary,
+                        KbqUsernameSecondaryHint
+                    ], host: {
+                        class: baseClass,
+                        '[class]': 'class()'
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@let profile = userInfo();\n<ng-content select=\"kbq-username-custom-view,[kbq-username-custom-view]\" />\n\n@if (!customView() && profile) {\n    @let fullName = profile | kbqUsername: fullNameFormat();\n\n    @if (!isCompact()) {\n        @if (hasFullName()) {\n            <span kbq-title kbqUsernamePrimary>{{ fullName }}</span>\n        }\n\n        @if (profile.login) {\n            <span kbq-title kbqUsernameSecondary>\n                {{ profile.login }}\n\n                @if (profile.site) {\n                    <span kbqUsernameSecondaryHint>({{ profile.site }})</span>\n                }\n            </span>\n        }\n    } @else {\n        <span kbq-title kbqUsernamePrimary>\n            @if (hasFullName()) {\n                <span>{{ fullName }}</span>\n            }\n            @if (!hasFullName() && profile.login) {\n                {{ profile.login }}\n            }\n\n            @if (profile.site) {\n                <span kbqUsernameSecondaryHint>&nbsp;({{ profile.site }})</span>\n            }\n        </span>\n    }\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-username{color:var(--kbq-username-primary-color)}.kbq-username .kbq-username__secondary,.kbq-username .kbq-username__secondary-hint{color:var(--kbq-username-secondary-color)}.kbq-username.kbq-username_default .kbq-username__secondary-hint,.kbq-username.kbq-username_default .kbq-username__primary+.kbq-username__secondary{--kbq-username-secondary-color: var(--kbq-foreground-contrast-secondary)}.kbq-username.kbq-username_error{--kbq-username-primary-color: var(--kbq-foreground-error);--kbq-username-secondary-color: var(--kbq-foreground-error)}.kbq-username.kbq-username_accented{--kbq-username-primary-color: var(--kbq-foreground-contrast);--kbq-username-secondary-color: var(--kbq-foreground-contrast)}.kbq-username.kbq-username_inherit{--kbq-username-primary-color: inherit;--kbq-username-secondary-color: inherit}.kbq-username{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-username.kbq-username_accented .kbq-username__primary{font-size:var(--kbq-typography-text-normal-strong-font-size);font-style:var(--kbq-typography-text-normal-strong-font-style);font-weight:var(--kbq-typography-text-normal-strong-font-weight);line-height:var(--kbq-typography-text-normal-strong-line-height);font-family:var(--kbq-typography-text-normal-strong-font-family);text-transform:var(--kbq-typography-text-normal-strong-text-transform);font-feature-settings:var(--kbq-typography-text-normal-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-strong-letter-spacing)}.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_stacked>.kbq-username__custom-view{display:flex;flex-flow:column nowrap;justify-content:flex-start;align-items:normal;gap:var(--kbq-username-vertical-gap)}.kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:baseline}.kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)) .kbq-username__primary+.kbq-username__secondary,.kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view .kbq-username__primary+.kbq-username__secondary{margin-left:var(--kbq-username-horizontal-gap)}[dir=rtl] .kbq-username.kbq-username_inline:not(.kbq-username_inherit):not(:has(>.kbq-username__custom-view)) .kbq-username__primary+.kbq-username__secondary,[dir=rtl] .kbq-username.kbq-username_inline:not(.kbq-username_inherit)>.kbq-username__custom-view .kbq-username__primary+.kbq-username__secondary{margin-left:0;margin-right:var(--kbq-username-horizontal-gap)}.kbq-username.kbq-username_text:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_text>.kbq-username__custom-view{display:inline}.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)) .kbq-username__primary,.kbq-username.kbq-username_stacked:not(:has(>.kbq-username__custom-view)) .kbq-username__secondary,.kbq-username.kbq-username_stacked>.kbq-username__custom-view .kbq-username__primary,.kbq-username.kbq-username_stacked>.kbq-username__custom-view .kbq-username__secondary,.kbq-username.kbq-username_inline:not(:has(>.kbq-username__custom-view)) .kbq-username__primary,.kbq-username.kbq-username_inline:not(:has(>.kbq-username__custom-view)) .kbq-username__secondary,.kbq-username.kbq-username_inline>.kbq-username__custom-view .kbq-username__primary,.kbq-username.kbq-username_inline>.kbq-username__custom-view .kbq-username__secondary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-username.kbq-username_inherit:not(:has(>.kbq-username__custom-view)),.kbq-username.kbq-username_inherit>.kbq-username__custom-view{font:inherit;display:inherit}\n", ":where(.kbq-username){--kbq-username-primary-color: var(--kbq-foreground-contrast);--kbq-username-secondary-color: inherit;--kbq-username-vertical-gap: var(--kbq-size-xxs);--kbq-username-horizontal-gap: var(--kbq-size-xxs)}\n"] }]
+        }] });
+
+const COMPONENTS = [
+    KbqUsername,
+    KbqUsernameCustomView,
+    KbqUsernamePrimary,
+    KbqUsernameSecondary,
+    KbqUsernameCustomPipe,
+    KbqUsernamePipe
+];
+class KbqUsernameModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameModule, imports: [KbqUsername,
+            KbqUsernameCustomView,
+            KbqUsernamePrimary,
+            KbqUsernameSecondary,
+            KbqUsernameCustomPipe,
+            KbqUsernamePipe], exports: [KbqUsername,
+            KbqUsernameCustomView,
+            KbqUsernamePrimary,
+            KbqUsernameSecondary,
+            KbqUsernameCustomPipe,
+            KbqUsernamePipe] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameModule, imports: [KbqUsername] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KbqUsernameModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: COMPONENTS,
+                    exports: COMPONENTS
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { KBQ_PROFILE_MAPPING, KbqMappingMissingError, KbqUsername, KbqUsernameCustomPipe, KbqUsernameCustomView, KbqUsernameFormatKey, KbqUsernameModule, KbqUsernamePipe, KbqUsernamePrimary, KbqUsernameSecondary, KbqUsernameSecondaryHint, kbqDefaultFullNameFormat, kbqDefaultFullNameFormatCustom };
+//# sourceMappingURL=koobiq-components-username.mjs.map

package/fesm2022/koobiq-components-username.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"koobiq-components-username.mjs","sources":["../../../packages/components/username/types.ts","../../../packages/components/username/constants.ts","../../../packages/components/username/username.pipe.ts","../../../packages/components/username/username.ts","../../../packages/components/username/username.html","../../../packages/components/username/module.ts","../../../packages/components/username/koobiq-components-username.ts"],"sourcesContent":["/**\n * Keys for formatting username parts in short (initial) or full form.\n */\nexport enum KbqUsernameFormatKey {\n    /**\n     * Short form of the first name (e.g., \"John\" → \"J\")\n     */\n    FirstNameShort = 'f',\n\n    /**\n     * Full form of the first name (e.g., \"John\")\n     */\n    FirstNameFull = 'F',\n\n    /**\n     * Short form of the middle name (e.g., \"Henry\" → \"H\")\n     */\n    MiddleNameShort = 'm',\n\n    /**\n     * Full form of the middle name (e.g., \"Henry\")\n     */\n    MiddleNameFull = 'M',\n\n    /**\n     * Short form of the last name (e.g., \"Doe\" → \"D\")\n     */\n    LastNameShort = 'l',\n\n    /**\n     * Full form of the last name (e.g., \"Doe\")\n     */\n    LastNameFull = 'L',\n    Dot = '.'\n}\n\n/**\n * Maps each format key to a property name in the user profile object.\n * Allows flexible formatting regardless of profile field names.\n */\nexport type KbqFormatKeyToProfileMapping<T = any> = {\n    [key in Exclude<\n        KbqUsernameFormatKey,\n        KbqUsernameFormatKey.FirstNameFull | KbqUsernameFormatKey.MiddleNameFull | KbqUsernameFormatKey.LastNameFull\n    >]: keyof T | undefined;\n};\n\n/**\n * Maps each format key to a property name in the user profile object.\n * Allows flexible formatting regardless of profile field names.\n * @see KbqUsernameCustomPipe\n */\nexport type KbqFormatKeyToProfileMappingExtended<T = any> = {\n    [key in KbqUsernameFormatKey]: keyof T | undefined;\n};\n\n/**\n * Layout mode for displaying a username and applying text-ellipsis.\n *\n * - `stacked`: Elements shown vertically.\n * - `inline`: Elements shown in one line. Text ellipsis is applied to both parts.\n * - `text`: Plain text, no layout styling. No text-ellipsis.\n */\nexport type KbqUsernameMode = 'stacked' | 'inline' | 'text';\n\n/**\n * Visual style of the username.\n *\n * - `default`: standard styling with primary and secondary colors.\n * - `error`: error colors (e.g., red).\n * - `accented`: no color theming; emphasizes via typography only.\n * - `inherit`: inherits parent styles, no theming. For example, useful when using inside links.\n */\nexport type KbqUsernameStyle = 'default' | 'error' | 'accented' | 'inherit';\n","import { InjectionToken } from '@angular/core';\nimport { KbqFormatKeyToProfileMapping, KbqFormatKeyToProfileMappingExtended, KbqUsernameFormatKey } from './types';\n\n/** Default name format: Last name full, first and middle as initials. */\nexport const kbqDefaultFullNameFormatCustom = 'L f. m.';\n/** Default name format: Last name full, first and middle as initials. */\nexport const kbqDefaultFullNameFormat = 'lf.m.';\n\n/**\n * Throws an error when no profile field mapping is provided to the username pipe.\n * @docs-private\n */\nexport function KbqMappingMissingError() {\n    return new Error('KbqUsernamePipe: profile field mapping is required but was not provided.');\n}\n\n/**\n * Injection token for providing a global username format-to-profile mapping.\n */\nexport const KBQ_PROFILE_MAPPING = new InjectionToken<\n    KbqFormatKeyToProfileMapping | KbqFormatKeyToProfileMappingExtended\n>('KBQ_PROFILE_MAPPING', {\n    factory: () =>\n        ({\n            [KbqUsernameFormatKey.FirstNameShort]: 'firstName',\n            [KbqUsernameFormatKey.MiddleNameShort]: 'middleName',\n            [KbqUsernameFormatKey.LastNameShort]: 'lastName',\n            [KbqUsernameFormatKey.Dot]: undefined\n        }) satisfies KbqFormatKeyToProfileMapping<{ firstName: string; middleName: string; lastName: string }>\n});\n","import { inject, Injectable, Pipe, PipeTransform } from '@angular/core';\nimport {\n    KBQ_PROFILE_MAPPING,\n    kbqDefaultFullNameFormat,\n    kbqDefaultFullNameFormatCustom,\n    KbqMappingMissingError\n} from './constants';\nimport { KbqFormatKeyToProfileMapping, KbqFormatKeyToProfileMappingExtended, KbqUsernameFormatKey } from './types';\n\n@Injectable({ providedIn: 'root' })\n@Pipe({\n    name: 'kbqUsername',\n    pure: true,\n    standalone: true\n})\nexport class KbqUsernamePipe<T = unknown> implements PipeTransform {\n    private readonly mapping = inject(KBQ_PROFILE_MAPPING, { optional: true });\n\n    /** Builds a formatted name string from the user profile using the provided format and mapping. */\n    transform(profile: T, format = kbqDefaultFullNameFormat, customMapping?: KbqFormatKeyToProfileMapping): string {\n        const resolvedMapping = customMapping || this.mapping;\n\n        if (!resolvedMapping) {\n            throw KbqMappingMissingError();\n        }\n\n        if (!profile || typeof profile !== 'object') return '';\n\n        let result = '';\n\n        const formatUnits = format.split('');\n\n        formatUnits.forEach((letter: KbqUsernameFormatKey | string, index: number, array) => {\n            if (letter !== KbqUsernameFormatKey.Dot) {\n                const field: keyof T = resolvedMapping[letter];\n                const fieldValue = profile[field];\n\n                if (fieldValue) {\n                    const isShort = array[index + 1] === KbqUsernameFormatKey.Dot;\n                    const resolvedFieldValue = isShort ? `${fieldValue[0]}${KbqUsernameFormatKey.Dot}` : fieldValue;\n\n                    result += ` ${resolvedFieldValue}`;\n                }\n            }\n        });\n\n        return result.trim();\n    }\n}\n\n/**\n * Pipe to format a user profile into a name string using a format pattern and field mapping.\n * Lowercase keys output initials; uppercase keys show full values.\n */\n@Injectable({ providedIn: 'root' })\n@Pipe({\n    name: 'kbqUsernameCustom',\n    pure: true,\n    standalone: true\n})\nexport class KbqUsernameCustomPipe<T = unknown> implements PipeTransform {\n    private readonly mapping = inject(KBQ_PROFILE_MAPPING, { optional: true });\n\n    /** Builds a formatted name string from the user profile using the provided format and mapping. */\n    transform(\n        profile: T,\n        format = kbqDefaultFullNameFormatCustom,\n        customMapping?: KbqFormatKeyToProfileMappingExtended<T>\n    ): string {\n        const resolvedMapping = customMapping || this.mapping;\n\n        if (!resolvedMapping) {\n            throw KbqMappingMissingError();\n        }\n\n        if (!profile || typeof profile !== 'object') return '';\n\n        let result = '';\n\n        const formatUnits = format.split('');\n\n        formatUnits.forEach((letter: KbqUsernameFormatKey | string) => {\n            const field: keyof T | undefined = resolvedMapping[letter];\n\n            if (!field) {\n                result += letter;\n\n                return;\n            }\n\n            const isShort = letter === letter.toLowerCase();\n            const fieldValue = profile[field] || '';\n\n            result += fieldValue && isShort ? fieldValue[0] : fieldValue;\n        });\n\n        return result.trim();\n    }\n}\n","import {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    contentChild,\n    Directive,\n    input,\n    ViewEncapsulation\n} from '@angular/core';\nimport { KbqTitleModule } from '@koobiq/components/title';\nimport { kbqDefaultFullNameFormat } from './constants';\nimport { KbqUsernameMode, KbqUsernameStyle } from './types';\nimport { KbqUsernamePipe } from './username.pipe';\n\nconst baseClass = 'kbq-username';\n\n/**\n * Basic user info\n * @docs-private\n */\nexport type KbqUserInfo = {\n    firstName?: string;\n    lastName?: string;\n    middleName?: string;\n    login?: string;\n    site?: string;\n};\n\n/** Styles the primary part of the username (e.g. full name). */\n@Directive({\n    selector: '[kbqUsernamePrimary]',\n    exportAs: 'kbqUsernamePrimary',\n    standalone: true,\n    host: {\n        class: `${baseClass}__primary`\n    }\n})\nexport class KbqUsernamePrimary {}\n\n/** Styles the secondary part. */\n@Directive({\n    selector: '[kbqUsernameSecondary]',\n    exportAs: 'kbqUsernameSecondary',\n    standalone: true,\n    host: {\n        class: `${baseClass}__secondary`\n    }\n})\nexport class KbqUsernameSecondary {}\n\n/** Styles a secondary hint. */\n@Directive({\n    selector: '[kbqUsernameSecondaryHint]',\n    exportAs: 'kbqUsernameSecondaryHint',\n    standalone: true,\n    host: {\n        class: `${baseClass}__secondary-hint`\n    }\n})\nexport class KbqUsernameSecondaryHint {}\n\n/** Custom content for `KbqUsername`, overrides default view. */\n@Directive({\n    selector: 'kbq-username-custom-view, [kbq-username-custom-view]',\n    standalone: true,\n    exportAs: 'kbqUsernameCustomView',\n    host: {\n        class: `${baseClass}__custom-view`\n    }\n})\nexport class KbqUsernameCustomView {}\n\n/**\n * Displays a user's name based on profile data.\n * Supports different display modes and visual styles.\n * A custom view can be provided via `<kbq-username-custom-view>` for full control over the output.\n * Accepts input profile data and optional formatting options.\n */\n@Component({\n    selector: 'kbq-username',\n    standalone: true,\n    exportAs: 'kbqUsername',\n    imports: [\n        KbqTitleModule,\n        KbqUsernamePipe,\n        KbqUsernamePrimary,\n        KbqUsernameSecondary,\n        KbqUsernameSecondaryHint\n    ],\n    templateUrl: './username.html',\n    styleUrls: ['./username.scss', './username-tokens.scss'],\n    host: {\n        class: baseClass,\n        '[class]': 'class()'\n    },\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class KbqUsername {\n    /** User profile data used for display. */\n    readonly userInfo = input<KbqUserInfo>();\n    /** Enables compact display mode */\n    readonly isCompact = input(false, { transform: booleanAttribute });\n    /** Format string for rendering the user's full name. */\n    readonly fullNameFormat = input<string>(kbqDefaultFullNameFormat);\n    /**\n     * Display mode of the username.\n     * @default inline\n     */\n    readonly mode = input<KbqUsernameMode>('inline');\n    /**\n     * Visual style of the username.\n     * @default default\n     */\n    readonly type = input<KbqUsernameStyle>('default');\n    /**\n     * Custom projected view for username rendering.\n     * @docs-private\n     */\n    protected readonly customView = contentChild(KbqUsernameCustomView);\n\n    /** @docs-private */\n    protected readonly hasFullName = computed(() => {\n        const userInfo = this.userInfo();\n\n        if (!userInfo) return false;\n\n        return userInfo?.lastName && userInfo?.firstName;\n    });\n\n    /** @docs-private */\n    protected readonly class = computed(() => {\n        return [this.type(), this.mode()].map((modificator) => `${baseClass}_${modificator}`).join(' ');\n    });\n}\n","@let profile = userInfo();\n<ng-content select=\"kbq-username-custom-view,[kbq-username-custom-view]\" />\n\n@if (!customView() && profile) {\n    @let fullName = profile | kbqUsername: fullNameFormat();\n\n    @if (!isCompact()) {\n        @if (hasFullName()) {\n            <span kbq-title kbqUsernamePrimary>{{ fullName }}</span>\n        }\n\n        @if (profile.login) {\n            <span kbq-title kbqUsernameSecondary>\n                {{ profile.login }}\n\n                @if (profile.site) {\n                    <span kbqUsernameSecondaryHint>({{ profile.site }})</span>\n                }\n            </span>\n        }\n    } @else {\n        <span kbq-title kbqUsernamePrimary>\n            @if (hasFullName()) {\n                <span>{{ fullName }}</span>\n            }\n            @if (!hasFullName() && profile.login) {\n                {{ profile.login }}\n            }\n\n            @if (profile.site) {\n                <span kbqUsernameSecondaryHint>&nbsp;({{ profile.site }})</span>\n            }\n        </span>\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { KbqUsername, KbqUsernameCustomView, KbqUsernamePrimary, KbqUsernameSecondary } from './username';\nimport { KbqUsernameCustomPipe, KbqUsernamePipe } from './username.pipe';\n\nconst COMPONENTS = [\n    KbqUsername,\n    KbqUsernameCustomView,\n    KbqUsernamePrimary,\n    KbqUsernameSecondary,\n    KbqUsernameCustomPipe,\n    KbqUsernamePipe\n];\n\n@NgModule({\n    imports: COMPONENTS,\n    exports: COMPONENTS\n})\nexport class KbqUsernameModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/file-upload/_file-upload-theme.scss

@@ -220,13 +220,18 @@
     }
 
     .kbq-file-upload__hint {
-        .kbq-hint {
+        :where(& .kbq-hint) {
             color: var(--kbq-foreground-contrast-secondary);
         }
     }
 }
 
 @mixin kbq-file-upload-typography() {
+    .kbq-file-upload {
+        @include tokens.kbq-typography-level-to-styles-css-variables(typography, text-normal);
+    }
+
+    // @TODO: remove when redesign applied, use default font (#DS-3858)
     .kbq-single-file-upload {
         & .file-item__text-wrapper,
         & .dropzone__text {
@@ -239,6 +244,7 @@
             @include tokens.kbq-typography-level-to-styles-css-variables(typography, subheading);
         }
 
+        // @TODO: remove when redesign applied, use default font (#DS-3858)
         .multiple__caption {
             &,
             .kbq-link {
@@ -246,14 +252,17 @@
             }
         }
 
+        // @TODO: remove when redesign applied, use default font (#DS-3858)
         .kbq-file-multiple-uploaded__header {
             @include tokens.kbq-typography-level-to-styles-css-variables(typography, text-normal);
         }
 
+        // @TODO: remove when redesign applied, use default font (#DS-3858)
         .multiple__uploaded-item {
             @include tokens.kbq-typography-level-to-styles-css-variables(typography, text-normal);
         }
 
+        // @TODO: remove when redesign applied, use default font (#DS-3858)
         .kbq-file-upload {
             .kbq-list-item,
             .kbq-list-option {

package/file-upload/file-drop.d.ts

@@ -5,7 +5,7 @@ export declare class KbqFileDropDirective {
     /** Flag that controls css-class modifications on drag events. */
     dragover: boolean;
     /** Emits an event when file items were dropped. */
-    filesDropped: EventEmitter<FileList | KbqFile[]>;
+    readonly filesDropped: EventEmitter<FileList | KbqFile[]>;
     /** @docs-private */
     onDragOver(event: DragEvent): void;
     /** @docs-private */

package/file-upload/multiple-file-upload.component.d.ts

@@ -105,8 +105,8 @@ export declare class KbqMultipleFileUploadComponent extends KbqFileUploadBase im
     /** @docs-private */
     readonly configuration: KbqInputFileMultipleLabel | null;
     constructor();
-    ngAfterViewInit(): void;
     ngDoCheck(): void;
+    ngAfterViewInit(): void;
     /** Implemented as part of ControlValueAccessor.
      * @docs-private */
     writeValue(files: FileList | KbqFileItem[] | null): void;

package/file-upload/single-file-upload.component.d.ts

@@ -34,7 +34,7 @@ export declare class KbqSingleFileUploadComponent extends KbqFileUploadBase impl
     showFileSize: boolean;
     /** Emits an event containing updated file.
      * public output will be renamed to fileChange in next major release (#DS-3700) */
-    fileChange: EventEmitter<KbqFileItem | null>;
+    readonly fileChange: EventEmitter<KbqFileItem | null>;
     /** @docs-private */
     input: ElementRef<HTMLInputElement>;
     /** @docs-private */
@@ -64,8 +64,8 @@ export declare class KbqSingleFileUploadComponent extends KbqFileUploadBase impl
     /** @docs-private */
     readonly configuration: KbqInputFileLabel | null;
     constructor();
-    ngAfterViewInit(): void;
     ngDoCheck(): void;
+    ngAfterViewInit(): void;
     /** Implemented as part of ControlValueAccessor.
      * @docs-private */
     writeValue(file: File | KbqFileItem | null): void;

package/filter-bar/filter-bar.d.ts

@@ -51,6 +51,8 @@ export declare class KbqFilterBar {
     /** Whether the current filter is disabled */
     get isDisabled(): boolean;
     private savedFilter;
+    /** Event that emits whenever the filter is reset. */
+    readonly onResetFilter: BehaviorSubject<boolean>;
     /** all changes */
     readonly changes: BehaviorSubject<void>;
     /** internal filter changes */

package/filter-bar/filter-bar.types.d.ts

@@ -88,6 +88,8 @@ export interface KbqPipe {
     value: unknown | null;
     search?: boolean;
     selectAll?: boolean;
+    openOnAdd?: boolean;
+    openOnReset?: boolean;
     /**
      * This is special logic that unselect all items when all selected because "all selected = nothing selected".
      * Default is true
@@ -101,8 +103,6 @@ export interface KbqPipe {
 }
 export interface KbqPipeData<V> extends KbqPipe {
     value: V | null;
-    search?: boolean;
-    openOnAdd?: boolean;
 }
 export interface KbqPipeTemplate extends Omit<KbqPipe, 'value'> {
     values?: unknown[];

package/filter-bar/pipes/pipe-date.d.ts

@@ -1,3 +1,4 @@
+import { AfterViewInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { KbqButton, KbqButtonStyles } from '@koobiq/components/button';
 import { KbqComponentColors, PopUpPlacements } from '@koobiq/components/core';
@@ -6,7 +7,7 @@ import { KbqPopoverTrigger } from '@koobiq/components/popover';
 import { KbqDateTimeValue } from '../filter-bar.types';
 import { KbqBasePipe } from './base-pipe';
 import * as i0 from "@angular/core";
-export declare class KbqPipeDateComponent<D> extends KbqBasePipe<KbqDateTimeValue> {
+export declare class KbqPipeDateComponent<D> extends KbqBasePipe<KbqDateTimeValue> implements AfterViewInit {
     private readonly adapter;
     private readonly formatter;
     /** @docs-private */
@@ -43,6 +44,7 @@ export declare class KbqPipeDateComponent<D> extends KbqBasePipe<KbqDateTimeValu
     listSelection: import("@angular/core").Signal<KbqListSelection>;
     /** @docs-private */
     returnButton: import("@angular/core").Signal<KbqButton>;
+    ngAfterViewInit(): void;
     /** keydown handler
      * @docs-private */
     onKeydown($event: KeyboardEvent): void;

package/filter-bar/pipes/pipe-datetime.d.ts

@@ -1,3 +1,4 @@
+import { AfterViewInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { KbqButton, KbqButtonStyles } from '@koobiq/components/button';
 import { KbqComponentColors, PopUpPlacements } from '@koobiq/components/core';
@@ -6,7 +7,7 @@ import { KbqPopoverTrigger } from '@koobiq/components/popover';
 import { KbqDateTimeValue } from '../filter-bar.types';
 import { KbqBasePipe } from './base-pipe';
 import * as i0 from "@angular/core";
-export declare class KbqPipeDatetimeComponent<D> extends KbqBasePipe<KbqDateTimeValue> {
+export declare class KbqPipeDatetimeComponent<D> extends KbqBasePipe<KbqDateTimeValue> implements AfterViewInit {
     private readonly adapter;
     private readonly formatter;
     /** @docs-private */
@@ -43,6 +44,7 @@ export declare class KbqPipeDatetimeComponent<D> extends KbqBasePipe<KbqDateTime
     listSelection: import("@angular/core").Signal<KbqListSelection>;
     /** @docs-private */
     returnButton: import("@angular/core").Signal<KbqButton>;
+    ngAfterViewInit(): void;
     /** keydown handler
      * @docs-private */
     onKeydown($event: KeyboardEvent): void;

package/filter-bar/pipes/pipe-multi-select.d.ts

@@ -30,7 +30,6 @@ export declare class KbqPipeMultiSelectComponent extends KbqBasePipe<KbqSelectVa
     private selectionAllInProgress;
     /** @docs-private */
     ngOnInit(): void;
-    /** @docs-private */
     ngAfterViewInit(): void;
     /** @docs-private */
     onSelect(item: KbqSelectValue[]): void;

package/filter-bar/pipes/pipe-multi-tree-select.d.ts

@@ -1,4 +1,4 @@
-import { OnInit } from '@angular/core';
+import { AfterViewInit, OnInit } from '@angular/core';
 import { UntypedFormControl } from '@angular/forms';
 import { KbqPseudoCheckboxState } from '@koobiq/components/core';
 import { FlatTreeControl, KbqTreeFlatDataSource, KbqTreeFlattener, KbqTreeSelection } from '@koobiq/components/tree';
@@ -7,7 +7,7 @@ import { Observable } from 'rxjs';
 import { KbqPipeTemplate, KbqSelectValue, KbqTreeSelectFlatNode, KbqTreeSelectNode } from '../filter-bar.types';
 import { KbqBasePipe } from './base-pipe';
 import * as i0 from "@angular/core";
-export declare class KbqPipeMultiTreeSelectComponent extends KbqBasePipe<KbqSelectValue[]> implements OnInit {
+export declare class KbqPipeMultiTreeSelectComponent extends KbqBasePipe<KbqSelectValue[]> implements OnInit, AfterViewInit {
     /** control for search options */
     searchControl: UntypedFormControl;
     /** filtered by search options */
@@ -33,6 +33,7 @@ export declare class KbqPipeMultiTreeSelectComponent extends KbqBasePipe<KbqSele
     get allVisibleOptionsSelected(): boolean;
     constructor();
     ngOnInit(): void;
+    ngAfterViewInit(): void;
     isNodeHasChild(_: number, nodeData: any): any;
     isNodeSelectAll(_: number, nodeData: any): boolean;
     onSelect({ value: option }: {

package/filter-bar/pipes/pipe-select.d.ts

@@ -18,7 +18,6 @@ export declare class KbqPipeSelectComponent extends KbqBasePipe<KbqSelectValue>
     get isEmpty(): boolean;
     /** @docs-private */
     ngOnInit(): void;
-    /** @docs-private */
     ngAfterViewInit(): void;
     onSelect(item: KbqSelectValue): void;
     /** Comparator of selected options */

package/filter-bar/pipes/pipe-tree-select.d.ts

@@ -1,4 +1,4 @@
-import { OnInit } from '@angular/core';
+import { AfterViewInit, OnInit } from '@angular/core';
 import { UntypedFormControl } from '@angular/forms';
 import { FlatTreeControl, KbqTreeFlatDataSource, KbqTreeFlattener, KbqTreeOption } from '@koobiq/components/tree';
 import { KbqTreeSelect } from '@koobiq/components/tree-select';
@@ -6,7 +6,7 @@ import { Observable } from 'rxjs';
 import { KbqPipeTemplate, KbqSelectValue, KbqTreeSelectFlatNode, KbqTreeSelectNode } from '../filter-bar.types';
 import { KbqBasePipe } from './base-pipe';
 import * as i0 from "@angular/core";
-export declare class KbqPipeTreeSelectComponent extends KbqBasePipe<KbqSelectValue> implements OnInit {
+export declare class KbqPipeTreeSelectComponent extends KbqBasePipe<KbqSelectValue> implements OnInit, AfterViewInit {
     /** control for search options */
     searchControl: UntypedFormControl;
     /** filtered by search options */
@@ -23,6 +23,7 @@ export declare class KbqPipeTreeSelectComponent extends KbqBasePipe<KbqSelectVal
     get isEmpty(): boolean;
     constructor();
     ngOnInit(): void;
+    ngAfterViewInit(): void;
     hasChild(_: number, nodeData: any): any;
     onSelect(item: KbqTreeOption): void;
     /** updates values for selection and value template */