@koobiq/components 18.18.0 → 18.20.0

package/core/locales/locale-service.d.ts

@@ -86,6 +86,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'zh-CN': {
         formatters: {
@@ -163,6 +208,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'es-LA': {
         formatters: {
@@ -241,6 +331,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'pt-BR': {
         formatters: {
@@ -319,6 +454,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'ru-RU': {
         formatters: {
@@ -399,6 +579,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'fa-IR': {
         formatters: {
@@ -478,6 +703,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
     'tk-TM': {
         formatters: {
@@ -557,6 +827,51 @@ export declare function KBQ_DEFAULT_LOCALE_DATA_FACTORY(): {
         timezone: {
             searchPlaceholder: string;
         };
+        actionsPanel: {
+            closeTooltip: string;
+        };
+        filterBar: {
+            reset: {
+                buttonName: string;
+            };
+            search: {
+                tooltip: string;
+                placeholder: string;
+            };
+            filters: {
+                defaultName: string;
+                saveNewFilterTooltip: string;
+                searchPlaceholder: string;
+                searchEmptyResult: string;
+                saveAsNewFilter: string;
+                saveChanges: string;
+                saveAsNew: string;
+                change: string;
+                resetChanges: string;
+                remove: string;
+                name: string;
+                error: string;
+                errorHint: string;
+                saveButton: string;
+                cancelButton: string;
+            };
+            add: {
+                tooltip: string;
+            };
+            pipe: {
+                clearButtonTooltip: string;
+                removeButtonTooltip: string;
+                applyButton: string;
+                emptySearchResult: string;
+            };
+            datePipe: {
+                customPeriod: string;
+                customPeriodFrom: string;
+                customPeriodTo: string;
+                customPeriodErrorHint: string;
+                backToPeriodSelection: string;
+            };
+        };
     };
 };
 export declare const KBQ_LOCALE_DATA: InjectionToken<any>;

package/core/locales/pt-BR.d.ts

@@ -41,4 +41,49 @@ export declare const ptBRLocaleData: {
     timezone: {
         searchPlaceholder: string;
     };
+    actionsPanel: {
+        closeTooltip: string;
+    };
+    filterBar: {
+        reset: {
+            buttonName: string;
+        };
+        search: {
+            tooltip: string;
+            placeholder: string;
+        };
+        filters: {
+            defaultName: string;
+            saveNewFilterTooltip: string;
+            searchPlaceholder: string;
+            searchEmptyResult: string;
+            saveAsNewFilter: string;
+            saveChanges: string;
+            saveAsNew: string;
+            change: string;
+            resetChanges: string;
+            remove: string;
+            name: string;
+            error: string;
+            errorHint: string;
+            saveButton: string;
+            cancelButton: string;
+        };
+        add: {
+            tooltip: string;
+        };
+        pipe: {
+            clearButtonTooltip: string;
+            removeButtonTooltip: string;
+            applyButton: string;
+            emptySearchResult: string;
+        };
+        datePipe: {
+            customPeriod: string;
+            customPeriodFrom: string;
+            customPeriodTo: string;
+            customPeriodErrorHint: string;
+            backToPeriodSelection: string;
+        };
+    };
 };

package/core/locales/ru-RU.d.ts

@@ -42,4 +42,49 @@ export declare const ruRULocaleData: {
     timezone: {
         searchPlaceholder: string;
     };
+    actionsPanel: {
+        closeTooltip: string;
+    };
+    filterBar: {
+        reset: {
+            buttonName: string;
+        };
+        search: {
+            tooltip: string;
+            placeholder: string;
+        };
+        filters: {
+            defaultName: string;
+            saveNewFilterTooltip: string;
+            searchPlaceholder: string;
+            searchEmptyResult: string;
+            saveAsNewFilter: string;
+            saveChanges: string;
+            saveAsNew: string;
+            change: string;
+            resetChanges: string;
+            remove: string;
+            name: string;
+            error: string;
+            errorHint: string;
+            saveButton: string;
+            cancelButton: string;
+        };
+        add: {
+            tooltip: string;
+        };
+        pipe: {
+            clearButtonTooltip: string;
+            removeButtonTooltip: string;
+            applyButton: string;
+            emptySearchResult: string;
+        };
+        datePipe: {
+            customPeriod: string;
+            customPeriodFrom: string;
+            customPeriodTo: string;
+            customPeriodErrorHint: string;
+            backToPeriodSelection: string;
+        };
+    };
 };

package/core/locales/tk-TM.d.ts

@@ -42,4 +42,49 @@ export declare const tkTMLocaleData: {
     timezone: {
         searchPlaceholder: string;
     };
+    actionsPanel: {
+        closeTooltip: string;
+    };
+    filterBar: {
+        reset: {
+            buttonName: string;
+        };
+        search: {
+            tooltip: string;
+            placeholder: string;
+        };
+        filters: {
+            defaultName: string;
+            saveNewFilterTooltip: string;
+            searchPlaceholder: string;
+            searchEmptyResult: string;
+            saveAsNewFilter: string;
+            saveChanges: string;
+            saveAsNew: string;
+            change: string;
+            resetChanges: string;
+            remove: string;
+            name: string;
+            error: string;
+            errorHint: string;
+            saveButton: string;
+            cancelButton: string;
+        };
+        add: {
+            tooltip: string;
+        };
+        pipe: {
+            clearButtonTooltip: string;
+            removeButtonTooltip: string;
+            applyButton: string;
+            emptySearchResult: string;
+        };
+        datePipe: {
+            customPeriod: string;
+            customPeriodFrom: string;
+            customPeriodTo: string;
+            customPeriodErrorHint: string;
+            backToPeriodSelection: string;
+        };
+    };
 };

package/core/locales/types.d.ts

@@ -9,3 +9,9 @@ export type KbqCodeBlockLocaleConfiguration = {
     viewLessText: string;
     openExternalSystemTooltip: string;
 };
+/**
+ * Locale configuration for `KbqActionsPanelModule`.
+ */
+export type KbqActionsPanelLocaleConfiguration = {
+    closeTooltip: string;
+};

package/core/locales/zh-CN.d.ts

@@ -41,4 +41,49 @@ export declare const zhCNLocaleData: {
     timezone: {
         searchPlaceholder: string;
     };
+    actionsPanel: {
+        closeTooltip: string;
+    };
+    filterBar: {
+        reset: {
+            buttonName: string;
+        };
+        search: {
+            tooltip: string;
+            placeholder: string;
+        };
+        filters: {
+            defaultName: string;
+            saveNewFilterTooltip: string;
+            searchPlaceholder: string;
+            searchEmptyResult: string;
+            saveAsNewFilter: string;
+            saveChanges: string;
+            saveAsNew: string;
+            change: string;
+            resetChanges: string;
+            remove: string;
+            name: string;
+            error: string;
+            errorHint: string;
+            saveButton: string;
+            cancelButton: string;
+        };
+        add: {
+            tooltip: string;
+        };
+        pipe: {
+            clearButtonTooltip: string;
+            removeButtonTooltip: string;
+            applyButton: string;
+            emptySearchResult: string;
+        };
+        datePipe: {
+            customPeriod: string;
+            customPeriodFrom: string;
+            customPeriodTo: string;
+            customPeriodErrorHint: string;
+            backToPeriodSelection: string;
+        };
+    };
 };

package/core/option/option-tokens.scss

@@ -1,10 +1,14 @@
 @use '../../list/list-tokens';
 
-.kbq-option {
+%kbq-option-geometry-tokens {
     --kbq-option-size-horizontal-padding: var(--kbq-size-m);
     --kbq-option-size-height: var(--kbq-size-3xl);
     --kbq-option-size-border-width: 2px;
     --kbq-option-border-radius: var(--kbq-size-xs);
+}
+
+.kbq-option {
+    @extend %kbq-option-geometry-tokens;
     /* LIST THEME TOKENS */
     @include list-tokens.list-theme-tokens;
 }

package/core/option/option.d.ts

@@ -63,6 +63,7 @@ export declare class KbqOption extends KbqOptionBase implements AfterViewChecked
     textElement: ElementRef;
     /** The form value of the option. */
     value: any;
+    userSelect: boolean;
     get showCheckbox(): boolean | undefined;
     set showCheckbox(value: boolean | undefined);
     private _showCheckbox;
@@ -124,7 +125,8 @@ export declare class KbqOption extends KbqOptionBase implements AfterViewChecked
     getTabIndex(): string;
     getHostElement(): HTMLElement;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqOption, [null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqOption, "kbq-option", ["kbqOption"], { "value": { "alias": "value"; "required": false; }; "showCheckbox": { "alias": "showCheckbox"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "onSelectionChange": "onSelectionChange"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqOption, "kbq-option", ["kbqOption"], { "value": { "alias": "value"; "required": false; }; "userSelect": { "alias": "userSelect"; "required": false; }; "showCheckbox": { "alias": "showCheckbox"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "onSelectionChange": "onSelectionChange"; }, never, ["*"], false, never>;
+    static ngAcceptInputType_userSelect: unknown;
 }
 /**
  * Counts the amount of option group labels that precede the specified option.

package/core/option/option.scss

@@ -1,9 +1,11 @@
-@use '../styles/common';
-
+@use '../styles/common/list';
+@use '../styles/common/vendor-prefixes';
 @use './option-theme' as *;
 
 .kbq-option {
-    @include common.kbq-list-item-base();
+    @include list.kbq-list-item-base();
+    @include vendor-prefixes.user-select(none);
+
     border-radius: var(--kbq-option-border-radius);
 
     &:not(.kbq-disabled) {
@@ -12,7 +14,7 @@
 }
 
 .kbq-option-text {
-    @include common.kbq-list-text();
+    @include list.kbq-list-text();
 }
 
 @include kbq-option-theme();

package/core/styles/common/_list.scss

@@ -1,5 +1,6 @@
 @use '../tokens';
 @use './tokens' as *;
+@use './vendor-prefixes';
 
 // This mixin will ensure that lines that overflow the container will hide the overflow and
 // truncate neatly with an ellipsis.
@@ -36,14 +37,6 @@
     }
 }
 
-@mixin kbq-no-select() {
-    -webkit-touch-callout: none; /* iOS Safari */
-    -webkit-user-select: none; /* Safari */
-    -moz-user-select: none; /* Firefox */
-    -ms-user-select: none; /* Internet Explorer/Edge */
-    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
-}
-
 @mixin kbq-list-text() {
     @include kbq-line-wrapper-base();
     display: inline-block;
@@ -121,5 +114,5 @@
 }
 
 .kbq-no-select {
-    @include kbq-no-select;
+    @include vendor-prefixes.user-select(none);
 }

package/core/styles/common/_select.scss

@@ -11,6 +11,8 @@
     outline: none;
 
     .kbq-select__matcher {
+        @include vendor-prefixes.user-select(none);
+
         display: flex;
         align-items: center;
 
@@ -145,6 +147,8 @@
     }
 
     .kbq-select__no-options-message {
+        @include vendor-prefixes.user-select(none);
+
         display: flex;
         flex-direction: row;
         align-items: center;
@@ -180,6 +184,8 @@
 }
 
 %kbq-select-footer {
+    @include vendor-prefixes.user-select(none);
+
     display: flex;
     align-items: center;
     box-sizing: border-box;

package/core/styles/common/_tokens.scss

@@ -78,7 +78,7 @@ $tokens: meta.module-variables(tokens) !default;
         @if (meta.type-of($border) == number or meta.type-of($border) == calculation) {
             @return calc((var(--kbq-#{$outer}) - var(--kbq-#{$inner}) - $border * 2) / 2);
         } @else {
-            @return calc((var(--kbq-#{$outer}) - var(--kbq-#{$inner}) - var(--kbq-#{$border} * 2)) / 2);
+            @return calc((var(--kbq-#{$outer}) - var(--kbq-#{$inner}) - var(--kbq-#{$border}) * 2) / 2);
         }
     } @else {
         @return calc((var(--kbq-#{$outer}) - var(--kbq-#{$inner})) / 2);