@koobiq/components 16.0.0-beta.8 → 17.0.0-beta.1

package/core/styles/theming/_theming.scss

@@ -46,52 +46,206 @@
     }
 }
 
-@function _theme_states($tokens, $scheme) {
-    @return (
-        focused-color: map.get($tokens, '#{$scheme}-states-focused-color'),
-        selected-color: map.get($tokens, '#{$scheme}-states-selected-color'),
-        pressed-shadow: map.get($tokens, '#{$scheme}-states-pressed-shadow'),
-        disabled-opacity: map.get($tokens, '#{$scheme}-states-disabled-opacity')
-    );
-}
-
 @function _theme_foreground($tokens, $scheme) {
     @return (
+        white: map.get($tokens, '#{$scheme}-foreground-white'),
+        white-secondary: map.get($tokens, '#{$scheme}-foreground-white-secondary'),
+        theme: map.get($tokens, '#{$scheme}-foreground-theme'),
+        theme-secondary: map.get($tokens, '#{$scheme}-foreground-theme-secondary'),
+        on-contrast: map.get($tokens, '#{$scheme}-foreground-on-contrast'),
+        contrast: map.get($tokens, '#{$scheme}-foreground-contrast'),
+        contrast-secondary: map.get($tokens, '#{$scheme}-foreground-contrast-secondary'),
+        contrast-tertiary: map.get($tokens, '#{$scheme}-foreground-contrast-tertiary'),
+        success: map.get($tokens, '#{$scheme}-foreground-success'),
+        // будет удалено, после удаления из компонентов ↓
+        success-less: map.get($tokens, '#{$scheme}-foreground-success-less'),
+        success-secondary: map.get($tokens, '#{$scheme}-foreground-success-secondary'),
+        warning: map.get($tokens, '#{$scheme}-foreground-warning'),
+        warning-secondary: map.get($tokens, '#{$scheme}-foreground-warning-secondary'),
+        error: map.get($tokens, '#{$scheme}-foreground-error'),
+        error-secondary: map.get($tokens, '#{$scheme}-foreground-error-secondary'),
+        error-tertiary: map.get($tokens, '#{$scheme}-foreground-error-tertiary'),
+        visited: map.get($tokens, '#{$scheme}-foreground-visited'),
+        // будет удалено, после удаления из компонентов ↓
+        error-less: map.get($tokens, '#{$scheme}-foreground-error-less'),
+        // будет удалено, после удаления из компонентов ↓
         text: map.get($tokens, '#{$scheme}-foreground-text'),
         text-less-contrast: map.get($tokens, '#{$scheme}-foreground-text-less-contrast'),
         text-disabled: map.get($tokens, '#{$scheme}-foreground-text-disabled'),
         text-error: map.get($tokens, '#{$scheme}-foreground-text-error'),
         text-success: map.get($tokens, '#{$scheme}-foreground-text-success'),
-
         divider: map.get($tokens, '#{$scheme}-foreground-divider'),
         border: map.get($tokens, '#{$scheme}-foreground-border'),
-        icon: map.get($tokens, '#{$scheme}-foreground-icon'),
-
-        contrast: map.get($tokens, '#{$scheme}-foreground-contrast'),
+        icon: map.get($tokens, '#{$scheme}-foreground-icon')
     );
 }
 
 @function _theme_background($tokens, $scheme) {
     @return (
-        background: map.get($tokens, '#{$scheme}-background-background'),
         bg: map.get($tokens, '#{$scheme}-background-bg'),
+        bg-secondary: map.get($tokens, '#{$scheme}-background-bg-secondary'),
+        bg-tertiary: map.get($tokens, '#{$scheme}-background-bg-tertiary'),
+        card: map.get($tokens, '#{$scheme}-background-card'),
+        contrast: map.get($tokens, '#{$scheme}-background-contrast'),
+        contrast-fade: map.get($tokens, '#{$scheme}-background-contrast-fade'),
+        night: map.get($tokens, '#{$scheme}-background-night'),
+        error: map.get($tokens, '#{$scheme}-background-error'),
+        error-fade: map.get($tokens, '#{$scheme}-background-error-fade'),
+        error-less: map.get($tokens, '#{$scheme}-background-error-less'),
+        success: map.get($tokens, '#{$scheme}-background-success'),
+        success-fade: map.get($tokens, '#{$scheme}-background-success-fade'),
+        // surfacce — удалить после удаления из компонентов
+        surface: map.get($tokens, '#{$scheme}-background-surface'),
+        theme: map.get($tokens, '#{$scheme}-background-theme'),
+        theme-fade: map.get($tokens, '#{$scheme}-background-theme-fade'),
+        warning: map.get($tokens, '#{$scheme}-background-warning'),
+        warning-fade: map.get($tokens, '#{$scheme}-background-warning-fade'),
+        transparent: map.get($tokens, '#{$scheme}-background-transparent'),
+
+        // будет удалено, после удаления из компонентов ↓
+        background: map.get($tokens, '#{$scheme}-background-background'),
         background-disabled: map.get($tokens, '#{$scheme}-background-background-disabled'),
         background-less-contrast: map.get($tokens, '#{$scheme}-background-background-less-contrast'),
         background-under: map.get($tokens, '#{$scheme}-background-background-under'),
-
+        overlay: map.get($tokens, '#{$scheme}-background-overlay'),
+        overlay-inverse: map.get($tokens, '#{$scheme}-background-overlay-inverse'),
         overlay-hover: map.get($tokens, '#{$scheme}-background-overlay-hover'),
         overlay-active: map.get($tokens, '#{$scheme}-background-overlay-active'),
         overlay-disabled: map.get($tokens, '#{$scheme}-background-overlay-disabled')
     );
 }
 
+@function _theme_icon($tokens, $scheme) {
+    @return (
+        on-contrast: map.get($tokens, '#{$scheme}-icon-on-contrast'),
+        white: map.get($tokens, '#{$scheme}-icon-white'),
+        theme: map.get($tokens, '#{$scheme}-icon-theme'),
+        contrast: map.get($tokens, '#{$scheme}-icon-contrast'),
+        contrast-fade: map.get($tokens, '#{$scheme}-icon-contrast-fade'),
+        success: map.get($tokens, '#{$scheme}-icon-success'),
+        warning: map.get($tokens, '#{$scheme}-icon-warning'),
+        error: map.get($tokens, '#{$scheme}-icon-error'),
+        visited: map.get($tokens, '#{$scheme}-icon-visited')
+    );
+}
+
+@function _theme_line($tokens, $scheme) {
+    @return (
+        theme: map.get($tokens, '#{$scheme}-line-theme'),
+        theme-fade: map.get($tokens, '#{$scheme}-line-theme-fade'),
+        contrast: map.get($tokens, '#{$scheme}-line-contrast'),
+        contrast-fade: map.get($tokens, '#{$scheme}-line-contrast-fade'),
+        success: map.get($tokens, '#{$scheme}-line-success'),
+        success-fade: map.get($tokens, '#{$scheme}-line-success-fade'),
+        warning: map.get($tokens, '#{$scheme}-line-warning'),
+        warning-fade: map.get($tokens, '#{$scheme}-line-warning-fade'),
+        error: map.get($tokens, '#{$scheme}-line-error'),
+        error-fade: map.get($tokens, '#{$scheme}-line-error-fade'),
+        visited: map.get($tokens, '#{$scheme}-line-visited'),
+    );
+}
+
+@function _theme_states-background($tokens, $scheme) {
+    @return (
+        disabled: map.get($tokens, '#{$scheme}-states-background-disabled'),
+        transparent-hover: map.get($tokens, '#{$scheme}-states-background-transparent-hover'),
+        transparent-active: map.get($tokens, '#{$scheme}-states-background-transparent-active'),
+        contrast-hover: map.get($tokens, '#{$scheme}-states-background-contrast-hover'),
+        contrast-active: map.get($tokens, '#{$scheme}-states-background-contrast-active'),
+        contrast-fade-hover: map.get($tokens, '#{$scheme}-states-background-contrast-fade-hover'),
+        contrast-fade-active: map.get($tokens, '#{$scheme}-states-background-contrast-fade-active'),
+        theme-hover: map.get($tokens, '#{$scheme}-states-background-theme-hover'),
+        theme-active: map.get($tokens, '#{$scheme}-states-background-theme-active'),
+        theme-fade-hover: map.get($tokens, '#{$scheme}-states-background-theme-fade-hover'),
+        theme-fade-active: map.get($tokens, '#{$scheme}-states-background-theme-fade-active'),
+        error-hover: map.get($tokens, '#{$scheme}-states-background-error-hover'),
+        error-active: map.get($tokens, '#{$scheme}-states-background-error-active'),
+        error-fade-hover: map.get($tokens, '#{$scheme}-states-background-error-fade-hover'),
+        error-fade-active: map.get($tokens, '#{$scheme}-states-background-error-fade-active'),
+        // будет удалено, после удаления из компонентов ↓
+        error-less: map.get($tokens, '#{$scheme}-states-background-error-less'),
+        ghost-hover: map.get($tokens, '#{$scheme}-states-background-ghost-hover'),
+        ghost-active: map.get($tokens, '#{$scheme}-states-background-ghost-active')
+    );
+}
+
+@function _theme_states-foreground($tokens, $scheme) {
+    @return (
+        disabled: map.get($tokens, '#{$scheme}-states-foreground-disabled'),
+        theme-hover: map.get($tokens, '#{$scheme}-states-foreground-theme-hover'),
+        theme-active: map.get($tokens, '#{$scheme}-states-foreground-theme-active'),
+        visited-hover: map.get($tokens, '#{$scheme}-states-foreground-visited-hover'),
+        visited-active: map.get($tokens, '#{$scheme}-states-foreground-visited-active')
+    );
+}
+
+@function _theme_states-icon($tokens, $scheme) {
+    @return (
+        theme-hover: map.get($tokens, '#{$scheme}-states-icon-theme-hover'),
+        theme-active: map.get($tokens, '#{$scheme}-states-icon-theme-active'),
+        contrast-hover: map.get($tokens, '#{$scheme}-states-icon-contrast-hover'),
+        contrast-active: map.get($tokens, '#{$scheme}-states-icon-contrast-active'),
+        contrast-fade-hover: map.get($tokens, '#{$scheme}-states-icon-contrast-fade-hover'),
+        contrast-fade-active: map.get($tokens, '#{$scheme}-states-icon-contrast-fade-active'),
+        error-hover: map.get($tokens, '#{$scheme}-states-icon-error-hover'),
+        error-active: map.get($tokens, '#{$scheme}-states-icon-error-active'),
+        success-hover: map.get($tokens, '#{$scheme}-states-icon-success-hover'),
+        success-active: map.get($tokens, '#{$scheme}-states-icon-success-active'),
+        disabled: map.get($tokens, '#{$scheme}-states-icon-disabled'),
+        warning-hover: map.get($tokens, '#{$scheme}-states-icon-warning-hover'),
+        warning-active: map.get($tokens, '#{$scheme}-states-icon-warning-active'),
+        visited-hover: map.get($tokens, '#{$scheme}-states-icon-visited-hover'),
+        visited-active: map.get($tokens, '#{$scheme}-states-icon-visited-active')
+    );
+}
+
+@function _theme_states-line($tokens, $scheme) {
+    @return (
+        focus: map.get($tokens, '#{$scheme}-states-line-focus'),
+        focus-theme: map.get($tokens, '#{$scheme}-states-line-focus-theme'),
+        focus-error: map.get($tokens, '#{$scheme}-states-line-focus-error'),
+        disabled: map.get($tokens, '#{$scheme}-states-line-disabled')
+    );
+}
+
+@function _theme_states-others($tokens, $scheme) {
+    @return (
+        brand: map.get($tokens, '#{$scheme}-states-others-brand')
+    );
+}
+
+@function _theme_states($tokens, $scheme) {
+    @return (
+        background: _theme_states-background($tokens, $scheme),
+        foreground: _theme_states-foreground($tokens, $scheme),
+        icon: _theme_states-icon($tokens, $scheme),
+        line: _theme_states-line($tokens, $scheme),
+        others: _theme_states-others($tokens, $scheme),
+
+        // будет удалено, после удаления из компонентов ↓
+        focused-color: map.get($tokens, '#{$scheme}-states-focused-color'),
+        focused-color-error: map.get($tokens, '#{$scheme}-states-focused-color-error'),
+        selected-color: map.get($tokens, '#{$scheme}-states-selected-color'),
+        pressed-shadow: map.get($tokens, '#{$scheme}-states-pressed-shadow'),
+        disabled-opacity: map.get($tokens, '#{$scheme}-states-disabled-opacity')
+    );
+}
+
 @function kbq-palette($base-palette, $default) {
     @return map.merge($base-palette, (default: $default));
 }
 
 @function _theme_palette($tokens, $scheme, $name) {
     @return kbq-palette(
-        map.get($tokens, '#{$scheme}-#{$name}-palette'), map.get($tokens, '#{$scheme}-#{$name}-default')
+        map.get($tokens, '#{$scheme}-#{$name}-palette'),
+        map.get($tokens, '#{$scheme}-#{$name}-default')
+    )
+}
+
+@function _theme_palette_neutral($tokens, $scheme) {
+    @return (
+        white: map.get($tokens, '#{$scheme}-neutral-white'),
+        black: map.get($tokens, '#{$scheme}-neutral-black'),
     )
 }
 
@@ -103,16 +257,25 @@
 
         background: _theme_background($tokens, $scheme),
         foreground: _theme_foreground($tokens, $scheme),
+        icon: _theme_icon($tokens, $scheme),
+        line: _theme_line($tokens, $scheme),
+        states: _theme_states($tokens, $scheme),
 
         theme: _theme_palette($tokens, $scheme, theme),
-        secondary: _theme_palette($tokens, $scheme, secondary),
-        error: _theme_palette($tokens, $scheme, error),
-
-        warning: _theme_palette($tokens, $scheme, warning),
         success: _theme_palette($tokens, $scheme, success),
+        warning: _theme_palette($tokens, $scheme, warning),
+        error: _theme_palette($tokens, $scheme, error),
+        contrast: _theme_palette($tokens, $scheme, contrast),
+        neutral: _theme_palette_neutral($tokens, $scheme),
+        white: _theme_palette($tokens, $scheme, white),
+        black: _theme_palette($tokens, $scheme, black),
+        brand: _theme_palette($tokens, $scheme, brand),
+        purple: _theme_palette($tokens, $scheme, purple),
+
+        // будет удалено, после удаления из компонентов ↓
+        secondary: _theme_palette($tokens, $scheme, secondary),
         info: _theme_palette($tokens, $scheme, info),
-
-        states: _theme_states($tokens, $scheme),
+        // будет удалено, после удаления из компонентов ↑
 
         components: kbq-components-theme($tokens, $scheme),
         tokens: $tokens
@@ -127,16 +290,25 @@
 
         background: _theme_background($tokens, $scheme),
         foreground: _theme_foreground($tokens, $scheme),
+        icon: _theme_icon($tokens, $scheme),
+        line: _theme_line($tokens, $scheme),
+        states: _theme_states($tokens, $scheme),
 
         theme: _theme_palette($tokens, $scheme, theme),
-        secondary: _theme_palette($tokens, $scheme, secondary),
-        error: _theme_palette($tokens, $scheme, error),
-
-        warning: _theme_palette($tokens, $scheme, warning),
         success: _theme_palette($tokens, $scheme, success),
+        warning: _theme_palette($tokens, $scheme, warning),
+        error: _theme_palette($tokens, $scheme, error),
+        contrast: _theme_palette($tokens, $scheme, contrast),
+        neutral: _theme_palette_neutral($tokens, $scheme),
+        white: _theme_palette($tokens, $scheme, white),
+        black: _theme_palette($tokens, $scheme, black),
+        brand: _theme_palette($tokens, $scheme, brand),
+        purple: _theme_palette($tokens, $scheme, purple),
+
+        // будет удалено, после удаления из компонентов ↓
+        secondary: _theme_palette($tokens, $scheme, secondary),
         info: _theme_palette($tokens, $scheme, info),
-
-        states: _theme_states($tokens, $scheme),
+        // будет удалено, после удаления из компонентов ↑
 
         components: kbq-components-theme($tokens, $scheme),
         tokens: $tokens

package/core/styles/typography/_typography.scss

@@ -8,6 +8,7 @@
     $typography: map.get(map.get($tokens, koobiq), typography);
 
     $config: (
+        //legacy will be deleted
         display-1:              map.get($typography, display-1),
         display-2:              map.get($typography, display-2),
         display-3:              map.get($typography, display-3),
@@ -30,11 +31,47 @@
         caption-mono-strong:    map.get($typography, caption-mono-strong),
         caption-tabular:        map.get($typography, caption-tabular),
 
-        small-text:             map.get($typography, small-text),
+        //small-text:             map.get($typography, small-text),
         extra-small-text:       map.get($typography, extra-small-text),
         extra-small-text-caps:  map.get($typography, extra-small-text-caps),
         extra-small-text-mono:  map.get($typography, extra-small-text-mono),
-        extra-small-text-strong:  map.get($typography, extra-small-text-strong)
+        extra-small-text-strong:  map.get($typography, extra-small-text-strong),
+
+        //new
+        display-big:             map.get($typography, display-big),
+        display-normal:          map.get($typography, display-normal),
+        display-compact:         map.get($typography, display-compact),
+        text-big:                map.get($typography, text-big),
+        text-big-strong:         map.get($typography, text-big-strong),
+        text-normal:             map.get($typography, text-normal),
+        text-normal-strong:      map.get($typography, text-normal-strong),
+        text-compact:            map.get($typography, text-compact),
+        text-compact-strong:     map.get($typography, text-compact-strong),
+        caps-big:                map.get($typography, caps-big),
+        caps-big-strong:         map.get($typography, caps-big-strong),
+        caps-normal:             map.get($typography, caps-normal),
+        caps-normal-strong:      map.get($typography, caps-normal-strong),
+        caps-compact:            map.get($typography, caps-compact),
+        caps-compact-strong:     map.get($typography, caps-compact-strong),
+        mono-big:                map.get($typography, mono-big),
+        mono-big-strong:         map.get($typography, mono-big-strong),
+        mono-normal:             map.get($typography, mono-normal),
+        mono-normal-strong:      map.get($typography, mono-normal-strong),
+        mono-compact:            map.get($typography, mono-compact),
+        mono-compact-strong:     map.get($typography, mono-compact-strong),
+        tabular-big:             map.get($typography, tabular-big),
+        tabular-big-strong:      map.get($typography, tabular-big-strong),
+        tabular-normal:          map.get($typography, tabular-normal),
+        tabular-normal-strong:   map.get($typography, tabular-normal-strong),
+        tabular-compact:         map.get($typography, tabular-compact),
+        tabular-compact-strong:  map.get($typography, tabular-compact-strong),
+        italic-big:              map.get($typography, italic-big),
+        italic-big-strong:       map.get($typography, italic-big-strong),
+        italic-normal:           map.get($typography, italic-normal),
+        italic-normal-strong:    map.get($typography, italic-normal-strong),
+        italic-compact:          map.get($typography, italic-compact),
+        italic-compact-strong:   map.get($typography, italic-compact-strong),
+        mono-codeblock:          map.get($typography, mono-codeblock)
     );
 
     @each $key, $level in $config {
@@ -80,6 +117,7 @@
 
 
 @mixin kbq-base-typography($config) {
+    //legacy will be deleted
     .kbq-display-1 {
         @include kbq-typography-level-to-styles($config, display-1);
     }
@@ -152,13 +190,150 @@
         @include kbq-typography-level-to-styles($config, caption-mono-strong);
     }
 
-    .kbq-small-text {
-        @include kbq-typography-level-to-styles($config, small-text);
-    }
+    //.kbq-small-text {
+    //    @include kbq-typography-level-to-styles($config, small-text);
+    //}
 
     .kbq-extra-small-text {
         @include kbq-typography-level-to-styles($config, extra-small-text);
     }
+
+    .kbq-extra-small-text-strong {
+        @include kbq-typography-level-to-styles($config, extra-small-text-strong);
+    }
+
+    // new
+    .kbq-display-big {
+        @include kbq-typography-level-to-styles($config, display-big);
+    }
+
+    .kbq-display-normal {
+        @include kbq-typography-level-to-styles($config, display-normal);
+    }
+
+    .kbq-display-compact {
+        @include kbq-typography-level-to-styles($config, display-compact);
+    }
+
+    .kbq-text-big {
+        @include kbq-typography-level-to-styles($config, text-big);
+    }
+
+    .kbq-text-big-strong {
+        @include kbq-typography-level-to-styles($config, text-big-strong);
+    }
+
+    .kbq-text-normal {
+        @include kbq-typography-level-to-styles($config, text-normal);
+    }
+
+    .kbq-text-normal-strong {
+        @include kbq-typography-level-to-styles($config, text-normal-strong);
+    }
+
+    .kbq-text-compact {
+        @include kbq-typography-level-to-styles($config, text-compact);
+    }
+
+    .kbq-text-compact-strong {
+        @include kbq-typography-level-to-styles($config, text-compact-strong);
+    }
+
+    .kbq-caps-big {
+        @include kbq-typography-level-to-styles($config, caps-big);
+    }
+
+    .kbq-caps-big-strong {
+        @include kbq-typography-level-to-styles($config, caps-big-strong);
+    }
+
+    .kbq-caps-normal {
+        @include kbq-typography-level-to-styles($config, caps-normal);
+    }
+
+    .kbq-caps-normal-strong {
+        @include kbq-typography-level-to-styles($config, caps-normal-strong);
+    }
+
+    .kbq-caps-compact {
+        @include kbq-typography-level-to-styles($config, caps-compact);
+    }
+
+    .kbq-caps-compact-strong {
+        @include kbq-typography-level-to-styles($config, caps-compact-strong);
+    }
+
+    .kbq-mono-big {
+        @include kbq-typography-level-to-styles($config, mono-big);
+    }
+
+    .kbq-mono-big-strong {
+        @include kbq-typography-level-to-styles($config, mono-big-strong);
+    }
+
+    .kbq-mono-normal {
+        @include kbq-typography-level-to-styles($config, mono-normal);
+    }
+
+    .kbq-mono-normal-strong {
+        @include kbq-typography-level-to-styles($config, mono-normal-strong);
+    }
+
+    .kbq-mono-compact {
+        @include kbq-typography-level-to-styles($config, mono-compact);
+    }
+
+    .kbq-mono-compact-strong {
+        @include kbq-typography-level-to-styles($config, mono-compact-strong);
+    }
+
+    .kbq-tabular-big {
+        @include kbq-typography-level-to-styles($config, tabular-big);
+    }
+
+    .kbq-tabular-big-strong {
+        @include kbq-typography-level-to-styles($config, tabular-big-strong);
+    }
+
+    .kbq-tabular-normal {
+        @include kbq-typography-level-to-styles($config, tabular-normal);
+    }
+
+    .kbq-tabular-normal-strong {
+        @include kbq-typography-level-to-styles($config, tabular-normal-strong);
+    }
+
+    .kbq-tabular-compact {
+        @include kbq-typography-level-to-styles($config, tabular-compact);
+    }
+
+    .kbq-tabular-compact-strong {
+        @include kbq-typography-level-to-styles($config, tabular-compact-strong);
+    }
+
+    .kbq-italic-big {
+        @include kbq-typography-level-to-styles($config, italic-big);
+    }
+
+    .kbq-italic-big-strong {
+        @include kbq-typography-level-to-styles($config, italic-big-strong);
+    }
+
+    .kbq-italic-normal {
+        @include kbq-typography-level-to-styles($config, italic-normal);
+    }
+
+    .kbq-italic-normal-strong {
+        @include kbq-typography-level-to-styles($config, italic-normal-strong);
+    }
+
+    .kbq-italic-compact {
+        @include kbq-typography-level-to-styles($config, italic-compact);
+    }
+
+    .kbq-italic-compact-strong {
+        @include kbq-typography-level-to-styles($config, italic-compact-strong);
+    }
 }
 
 @mixin kbq-markdown-base-typography($config) {

package/dropdown/_dropdown-theme.scss

@@ -45,8 +45,7 @@
             }
         }
 
-        &.kbq-disabled,
-        &[disabled] {
+        &.kbq-disabled {
             @include kbq-dropdown-item-state(map.get($dropdown-item, disabled));
         }
     }

package/esm2022/alert/alert.component.mjs

@@ -3,10 +3,10 @@ import { KbqIconItem } from '@koobiq/components/icon';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 export class KbqAlertTitle {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqAlertTitle, selector: "[kbq-alert-title]", host: { classAttribute: "kbq-alert__title" }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlertTitle, selector: "[kbq-alert-title]", host: { classAttribute: "kbq-alert__title" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertTitle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertTitle, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kbq-alert-title]',
@@ -16,10 +16,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                 }]
         }] });
 export class KbqAlertCloseButton {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertCloseButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqAlertCloseButton, selector: "[kbq-alert-close-button]", host: { classAttribute: "kbq-alert-close-button" }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertCloseButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlertCloseButton, selector: "[kbq-alert-close-button]", host: { classAttribute: "kbq-alert-close-button" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertCloseButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertCloseButton, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kbq-alert-close-button]',
@@ -29,10 +29,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                 }]
         }] });
 export class KbqAlertControl {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertControl, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqAlertControl, selector: "[kbq-alert-control]", host: { classAttribute: "kbq-alert-control" }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertControl, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlertControl, selector: "[kbq-alert-control]", host: { classAttribute: "kbq-alert-control" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertControl, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertControl, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kbq-alert-control]',
@@ -42,10 +42,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                 }]
         }] });
 export class KbqAlert {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlert, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqAlert, selector: "kbq-alert", host: { properties: { "class.kbq-alert_dismissible": "closeButton" }, classAttribute: "kbq-alert" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }, { propertyName: "title", first: true, predicate: KbqAlertTitle, descendants: true }, { propertyName: "control", first: true, predicate: KbqAlertControl, descendants: true }, { propertyName: "closeButton", first: true, predicate: KbqAlertCloseButton, descendants: true }], ngImport: i0, template: "<div class=\"kbq-alert__icon\" *ngIf=\"iconItem\">\n    <ng-content select=\"[kbq-icon-item]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\">\n    <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n    <div class=\"kbq-alert__text\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"kbq-alert__controls\" *ngIf=\"control\">\n        <ng-content select=\"[kbq-alert-control]\"></ng-content>\n    </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n    <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;border-radius:var(--kbq-alert-size-container-border-radius, 12px);min-width:var(--kbq-alert-size-container-min-width, );min-height:calc(var(--kbq-alert-size-container-min-height, 48px) - var(--kbq-alert-size-container-padding-vertical, 16px) * 2);padding:var(--kbq-alert-size-container-padding-vertical, 16px) var(--kbq-alert-size-container-padding-horizontal, 20px)}.kbq-alert__icon{margin-right:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert__title{margin-bottom:var(--kbq-alert-size-container-content-gap-vertical, 4px)}.kbq-alert__controls{margin-top:var(--kbq-alert-size-container-content-gap-vertical, 4px);padding-top:var(--kbq-alert-size-button-stack-content-padding-top, 8px)}.kbq-alert__controls .kbq-button{margin-right:var(--kbq-alert-size-button-stack-content-content-gap-horizontal, 4px)}.kbq-alert__controls .kbq-link{margin-right:16px}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert__close-button{margin-left:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert_dismissible .kbq-alert__close-button{margin-top:var(--kbq-alert-size-close-button-margin-top, -8px);margin-right:var(--kbq-alert-size-close-button-margin-right, -12px)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlert, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlert, selector: "kbq-alert", host: { properties: { "class.kbq-alert_dismissible": "closeButton" }, classAttribute: "kbq-alert" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }, { propertyName: "title", first: true, predicate: KbqAlertTitle, descendants: true }, { propertyName: "control", first: true, predicate: KbqAlertControl, descendants: true }, { propertyName: "closeButton", first: true, predicate: KbqAlertCloseButton, descendants: true }], ngImport: i0, template: "<div class=\"kbq-alert__icon\" *ngIf=\"iconItem\">\n    <ng-content select=\"[kbq-icon-item]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\">\n    <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n    <div class=\"kbq-alert__text\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"kbq-alert__controls\" *ngIf=\"control\">\n        <ng-content select=\"[kbq-alert-control]\"></ng-content>\n    </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n    <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;border-radius:var(--kbq-alert-size-container-border-radius, 12px);min-width:var(--kbq-alert-size-container-min-width, );min-height:calc(var(--kbq-alert-size-container-min-height, 48px) - var(--kbq-alert-size-container-padding-vertical, 16px) * 2);padding:var(--kbq-alert-size-container-padding-vertical, 16px) var(--kbq-alert-size-container-padding-horizontal, 20px)}.kbq-alert__icon{margin-right:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert__title{margin-bottom:var(--kbq-alert-size-container-content-gap-vertical, 4px)}.kbq-alert__controls{margin-top:var(--kbq-alert-size-container-content-gap-vertical, 4px);padding-top:var(--kbq-alert-size-button-stack-content-padding-top, 8px)}.kbq-alert__controls .kbq-button{margin-right:var(--kbq-alert-size-button-stack-content-content-gap-horizontal, 4px)}.kbq-alert__controls .kbq-link{margin-right:16px}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert__close-button{margin-left:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert_dismissible .kbq-alert__close-button{margin-top:var(--kbq-alert-size-close-button-margin-top, -8px);margin-right:var(--kbq-alert-size-close-button-margin-right, -12px)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlert, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlert, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-alert', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'kbq-alert',

package/esm2022/alert/alert.module.mjs

@@ -5,8 +5,8 @@ import { NgModule } from '@angular/core';
 import { KbqAlert, KbqAlertCloseButton, KbqAlertControl, KbqAlertTitle } from './alert.component';
 import * as i0 from "@angular/core";
 export class KbqAlertModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertModule, declarations: [KbqAlert,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertModule, declarations: [KbqAlert,
             KbqAlertTitle,
             KbqAlertCloseButton,
             KbqAlertControl], imports: [CommonModule,
@@ -15,11 +15,11 @@ export class KbqAlertModule {
             KbqAlertTitle,
             KbqAlertCloseButton,
             KbqAlertControl] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertModule, imports: [CommonModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertModule, imports: [CommonModule,
             A11yModule,
             PlatformModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAlertModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/autocomplete/autocomplete-origin.directive.mjs

@@ -8,14 +8,14 @@ export class KbqAutocompleteOrigin {
     constructor(elementRef) {
         this.elementRef = elementRef;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAutocompleteOrigin, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqAutocompleteOrigin, selector: "[kbqAutocompleteOrigin]", exportAs: ["kbqAutocompleteOrigin"], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAutocompleteOrigin, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqAutocompleteOrigin, selector: "[kbqAutocompleteOrigin]", exportAs: ["kbqAutocompleteOrigin"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqAutocompleteOrigin, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAutocompleteOrigin, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kbqAutocompleteOrigin]',
                     exportAs: 'kbqAutocompleteOrigin'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2NvbXBsZXRlLW9yaWdpbi5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21wb25lbnRzL2F1dG9jb21wbGV0ZS9hdXRvY29tcGxldGUtb3JpZ2luLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFHdEQ7OztHQUdHO0FBS0gsTUFBTSxPQUFPLHFCQUFxQjtJQUM5QixZQUFtQixVQUFtQztRQUFuQyxlQUFVLEdBQVYsVUFBVSxDQUF5QjtJQUFHLENBQUM7aUlBRGpELHFCQUFxQjtxSEFBckIscUJBQXFCOzsyRkFBckIscUJBQXFCO2tCQUpqQyxTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSx5QkFBeUI7b0JBQ25DLFFBQVEsRUFBRSx1QkFBdUI7aUJBQ3BDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBFbGVtZW50UmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cblxuLyoqXG4gKiBEaXJlY3RpdmUgYXBwbGllZCB0byBhbiBlbGVtZW50IHRvIG1ha2UgaXQgdXNhYmxlXG4gKiBhcyBhIGNvbm5lY3Rpb24gcG9pbnQgZm9yIGFuIGF1dG9jb21wbGV0ZSBwYW5lbC5cbiAqL1xuQERpcmVjdGl2ZSh7XG4gICAgc2VsZWN0b3I6ICdba2JxQXV0b2NvbXBsZXRlT3JpZ2luXScsXG4gICAgZXhwb3J0QXM6ICdrYnFBdXRvY29tcGxldGVPcmlnaW4nXG59KVxuZXhwb3J0IGNsYXNzIEticUF1dG9jb21wbGV0ZU9yaWdpbiB7XG4gICAgY29uc3RydWN0b3IocHVibGljIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+KSB7fVxufVxuIl19