@snabcentr/client-ui 4.9.2 → 4.11.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@snabcentr/client-ui",
-  "version": "4.9.2",
+  "version": "4.11.0",
   "author": "Snabcentr Ltd.",
   "repository": "https://gitlab.snabcentr.met/web/angular/snabcentr-client-ui-lib",
   "license": "Commercial",
@@ -15,7 +15,7 @@
     "@maskito/core": "^3.11.1",
     "@ng-web-apis/intersection-observer": "^4.14.0",
     "@ng-web-apis/common": "^4.14.0",
-    "@snabcentr/client-core": "^3.12.0",
+    "@snabcentr/client-core": "^3.17.0",
     "@taiga-ui/addon-charts": "^4.66.0",
     "@taiga-ui/addon-commerce": "^4.66.0",
     "@taiga-ui/cdk": "^4.66.0",

package/pages/frequently-asked-questions/sc-faq-query-params.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Наименование query-параметра идентификатора группы часто задаваемых вопросов.
+ */
+export declare const SC_FAQ_GROUP_QUERY_PARAM = "group";

package/pages/frequently-asked-questions/sc-get-faq-group-query-params.d.ts

@@ -0,0 +1,10 @@
+import { Params } from '@angular/router';
+import { ScFaqGroup } from '@snabcentr/client-core';
+/**
+ * Возвращает query-параметры ссылки на группу часто задаваемых вопросов.
+ *
+ * При смене группы пагинация сбрасывается на первую страницу.
+ *
+ * @param group Группа вопросов.
+ */
+export declare const scGetFaqGroupQueryParams: (group: ScFaqGroup) => Params;

package/pages/frequently-asked-questions-group-selector/sc-frequently-asked-questions-group-selector.component.d.ts

@@ -1,12 +1,23 @@
-import { InputSignal, OutputRef } from '@angular/core';
+import { InputSignal } from '@angular/core';
 import { FormControl } from '@angular/forms';
+import { Params } from '@angular/router';
 import { ScFaqGroup } from '@snabcentr/client-core';
 import { Observable } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
  * Компонент выбора группы часто задаваемых вопросов.
+ *
+ * TODO: [TAIGA:5]: Заменить legacy tui-select и tuiItemsHandlersProvider на актуальные аналоги.
  */
 export declare class ScFrequentlyAskedQuestionsGroupSelectorComponent {
+    /**
+     * Сервис маршрутизации.
+     */
+    private readonly router;
+    /**
+     * Активный маршрут.
+     */
+    private readonly route;
     /**
      * {@link Observable} списка группы часто задаваемых вопросов.
      */
@@ -16,13 +27,21 @@ export declare class ScFrequentlyAskedQuestionsGroupSelectorComponent {
      */
     protected readonly groupControl: FormControl<ScFaqGroup | null>;
     /**
-     * {@link OutputRef} сигнал изменения идентификатора группы.
+     * {@link InputSignal} идентификатора выбранной группы.
      */
-    readonly groupIdChange: OutputRef<number>;
+    readonly selectedGroupId: InputSignal<number | null>;
     /**
      * Формат отображения. 'list' - в виде списка,  'select' в виде выпадающего списка.
      */
     readonly viewMode: InputSignal<'list' | 'select'>;
+    /**
+     * Возвращает query-параметры ссылки на группу вопросов.
+     */
+    protected readonly getGroupQueryParams: (group: ScFaqGroup) => Params;
+    /**
+     * Инициализирует экземпляр класса {@link ScFrequentlyAskedQuestionsGroupSelectorComponent}.
+     */
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<ScFrequentlyAskedQuestionsGroupSelectorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ScFrequentlyAskedQuestionsGroupSelectorComponent, "sc-frequently-asked-questions-group-selector", never, { "viewMode": { "alias": "viewMode"; "required": false; "isSignal": true; }; }, { "groupIdChange": "groupIdChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScFrequentlyAskedQuestionsGroupSelectorComponent, "sc-frequently-asked-questions-group-selector", never, { "selectedGroupId": { "alias": "selectedGroupId"; "required": false; "isSignal": true; }; "viewMode": { "alias": "viewMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/pages/frequently-asked-questions-with-groups/sc-frequently-asked-questions-with-groups.component.d.ts

@@ -1,6 +1,6 @@
 import { OutputEmitterRef } from '@angular/core';
 import { ScFaqItem, ScFrequentlyAskedQuestionsService } from '@snabcentr/client-core';
-import { Observable, Subject } from 'rxjs';
+import { Observable } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
  * Компонент часто задаваемых вопросов с возможностью выбора группы вопросов.
@@ -27,9 +27,13 @@ export declare class ScFrequentlyAskedQuestionsWithGroupsComponent {
      */
     private readonly router;
     /**
-     * Индекс первой страницы.
+     * Активный маршрут.
      */
-    private readonly firstPageIndex;
+    private readonly route;
+    /**
+     * Признак, что приложение запущено на сервере.
+     */
+    private readonly isServer;
     /**
      * Количество записей на странице пагинации.
      */
@@ -39,13 +43,15 @@ export declare class ScFrequentlyAskedQuestionsWithGroupsComponent {
      */
     private readonly perPage$;
     /**
-     * {@link BehaviorSubject} изменения номера страницы.
+     * {@link Observable} изменения номера страницы пагинации из query-параметров.
      */
     private readonly page$;
     /**
-     * {@link BehaviorSubject} изменения идентификатора группы.
+     * {@link Observable} изменения идентификатора выбранной группы.
+     *
+     * Идентификатор берётся из query-параметров, а если параметр не задан - используется первая группа списка.
      */
-    protected readonly groupId$: Subject<number>;
+    protected readonly groupId$: Observable<number | null>;
     /**
      * Сигнал нажатия на кнопку "Задать вопрос".
      */
@@ -75,17 +81,9 @@ export declare class ScFrequentlyAskedQuestionsWithGroupsComponent {
      */
     protected readonly viewMode$: Observable<'list' | 'select'>;
     /**
-     * Устанавливает данные пагинации.
-     *
-     * @param pageIndex Индекс страницы.
-     */
-    protected paginationChange(pageIndex: number): void;
-    /**
-     * Устанавливает идентификатор группы.
-     *
-     * @param id Идентификатор группы.
+     * Наименование query-параметра номера страницы пагинации.
      */
-    protected groupIdChange(id: number): void;
+    protected readonly pageQueryParam: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ScFrequentlyAskedQuestionsWithGroupsComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ScFrequentlyAskedQuestionsWithGroupsComponent, "sc-frequently-asked-questions-with-groups", never, {}, { "clickSendQuestion": "clickSendQuestion"; }, never, never, true, never>;
 }

package/pages/index.d.ts

@@ -1,6 +1,9 @@
+export * from './frequently-asked-questions/sc-faq-query-params';
 export * from './frequently-asked-questions/sc-frequently-asked-questions.component';
+export * from './frequently-asked-questions/sc-get-faq-group-query-params';
 export * from './frequently-asked-questions-group-selector/sc-frequently-asked-questions-group-selector.component';
 export * from './frequently-asked-questions-with-groups/sc-frequently-asked-questions-with-groups.component';
+export * from './news-list/sc-news-list.component';
 export * from './personal-data-processing-policy/sc-personal-data-processing-policy.component';
 export * from './privacy-policy/sc-privacy-policy.component';
 export * from './public-offer/sc-public-offer.component';

package/pages/news-list/sc-news-list.component.d.ts

@@ -0,0 +1,57 @@
+import { InputSignal, OutputRef } from '@angular/core';
+import { ScINewsTile } from '@snabcentr/client-core';
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+/**
+ * Компонент списка новостей с пагинацией через query-параметр страницы.
+ *
+ * Ссылки пагинации корректно работают при SSR и позволяют поисковым роботам обходить страницы списка.
+ */
+export declare class ScNewsListComponent {
+    /**
+     * Сервис для получения списка новостей.
+     */
+    private readonly newsService;
+    /**
+     * Сервис маршрутизации.
+     */
+    private readonly router;
+    /**
+     * {@link InputSignal} количества записей на странице пагинации.
+     */
+    readonly perPage: InputSignal<number>;
+    /**
+     * {@link Observable} изменения номера страницы пагинации из query-параметров.
+     */
+    protected readonly page$: Observable<number>;
+    /**
+     * {@link Observable} запроса данных списка новостей.
+     */
+    protected readonly request$: Observable<import("@snabcentr/client-core").ScIPaginate<ScINewsTile> | null>;
+    /**
+     * {@link Observable} изменения количества страниц пагинации.
+     */
+    protected readonly pagesLength$: Observable<number>;
+    /**
+     * {@link Observable} изменения номера страницы пагинации из данных пагинации запроса.
+     */
+    protected readonly currentPage$: Observable<number>;
+    /**
+     * {@link Observable} изменения состояния загрузки данных.
+     */
+    protected readonly loading$: Observable<boolean>;
+    /**
+     * {@link Observable} изменения списка новостей страницы пагинации.
+     */
+    protected readonly data$: Observable<ScINewsTile[] | null>;
+    /**
+     * Событие изменения списка новостей страницы пагинации.
+     */
+    readonly dataChangeEvent: OutputRef<ScINewsTile[]>;
+    /**
+     * Инициализирует экземпляр класса {@link ScNewsListComponent}.
+     */
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScNewsListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScNewsListComponent, "sc-news-list", never, { "perPage": { "alias": "perPage"; "required": false; "isSignal": true; }; }, { "dataChangeEvent": "dataChangeEvent"; }, never, never, true, never>;
+}

package/pagination/index.d.ts

@@ -0,0 +1 @@
+export * from './sc-pagination-links/sc-pagination-links.component';

package/pagination/sc-pagination-links/sc-pagination-links.component.d.ts

@@ -0,0 +1,60 @@
+import { InputSignal, Signal } from '@angular/core';
+import { Params } from '@angular/router';
+import { TuiSpinIcons } from '@taiga-ui/core';
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+/**
+ * Компонент пагинации, в котором страницы являются ссылками с номером страницы в query-параметрах.
+ *
+ * Ссылки позволяют переходить между страницами при отключенном JavaScript и корректно работают при SSR.
+ * Внешний вид повторяет tui-pagination из @taiga-ui/kit.
+ *
+ * TODO: [TAIGA:5]: Проверить, появилась ли в tui-pagination поддержка ссылок, и заменить компонент на неё.
+ */
+export declare class ScPaginationLinksComponent {
+    /**
+     * Иконки стрелок переключения страниц.
+     */
+    protected readonly icons: TuiSpinIcons;
+    /**
+     * {@link Observable} подписей стрелок переключения страниц.
+     */
+    protected readonly texts$: Observable<readonly [previousPage: string, nextPage: string]>;
+    /**
+     * {@link InputSignal} общего количества страниц.
+     */
+    readonly length: InputSignal<number>;
+    /**
+     * {@link InputSignal} номера текущей страницы, начиная с единицы.
+     */
+    readonly index: InputSignal<number>;
+    /**
+     * {@link InputSignal} наименования query-параметра, в котором хранится номер страницы.
+     */
+    readonly queryParam: InputSignal<string>;
+    /**
+     * {@link InputSignal} количества страниц, отображаемых по обе стороны от текущей.
+     */
+    readonly activePadding: InputSignal<number>;
+    /**
+     * {@link InputSignal} количества страниц, отображаемых по краям.
+     */
+    readonly sidePadding: InputSignal<number>;
+    /**
+     * {@link Signal} номеров отображаемых страниц, где `null` - разделитель пропущенных страниц.
+     *
+     * Состав страниц рассчитывается так же, как в tui-pagination: количество отображаемых элементов постоянно,
+     * а окно вокруг текущей страницы расширяется у краёв списка.
+     */
+    protected readonly pages: Signal<Array<number | null>>;
+    /**
+     * Возвращает query-параметры ссылки на страницу.
+     *
+     * Для первой страницы параметр удаляется, чтобы её адрес совпадал с адресом страницы без пагинации.
+     *
+     * @param page Номер страницы.
+     */
+    protected getPageQueryParams(page: number): Params;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScPaginationLinksComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScPaginationLinksComponent, "sc-pagination-links", never, { "length": { "alias": "length"; "required": true; "isSignal": true; }; "index": { "alias": "index"; "required": true; "isSignal": true; }; "queryParam": { "alias": "queryParam"; "required": false; "isSignal": true; }; "activePadding": { "alias": "activePadding"; "required": false; "isSignal": true; }; "sidePadding": { "alias": "sidePadding"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/public-api.d.ts

@@ -21,6 +21,7 @@ export * from './news';
 export * from './noindex-wrapper';
 export * from './order';
 export * from './pages';
+export * from './pagination';
 export * from './pipes';
 export * from './samples';
 export * from './methods';

package/release_notes.tmp

@@ -1,6 +1,11 @@
-## 4.9.2 (2026-07-30)
+## 4.11.0 (2026-08-17)
 
-### added (1 change)
+### added (2 changes)
 
-- [#13635: В списке брендов добавлена поддержка webp](web_soft/libs/angular/snabcentr-client-ui-lib@01b15220817d06f9f7f7674f889d94b0c21668bc) ([merge request](web_soft/libs/angular/snabcentr-client-ui-lib!432))
+- [#13633: Добавлен компонент списка новостей с пагинацией через query-параметр...](web_soft/libs/angular/snabcentr-client-ui-lib@c054e811f8c7129e0a0cc01615ff1a92f7384775) ([merge request](web_soft/libs/angular/snabcentr-client-ui-lib!439))
+- [#13015: Добавлены компоненты оформления заказа для объединения страниц корзины](web_soft/libs/angular/snabcentr-client-ui-lib@bf19e7becdae902d1ef9c31d25dc084fc5a6da6e) ([merge request](web_soft/libs/angular/snabcentr-client-ui-lib!437))
+
+### fixed (1 change)
+
+- [#13577: Исправлена некорректная работа блока фильтров](web_soft/libs/angular/snabcentr-client-ui-lib@88472dffcb45df602d3d79a528b9a8d21997cd22) ([merge request](web_soft/libs/angular/snabcentr-client-ui-lib!436))
 

package/styles/tailwind/tailwind.scss

@@ -1094,6 +1094,10 @@ video {
   grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 
+.grid-cols-\[repeat\(auto-fill\2c minmax\(17rem\2c 1fr\)\)\] {
+  grid-template-columns: repeat(auto-fill,minmax(17rem,1fr));
+}
+
 .flex-col {
   flex-direction: column;
 }
@@ -1142,10 +1146,6 @@ video {
   justify-content: space-between;
 }
 
-.\!justify-items-center {
-  justify-items: center !important;
-}
-
 .\!gap-1 {
   gap: 0.25rem !important;
 }