@snabcentr/client-ui 0.8.3 → 0.8.6
Sign up to get free protection for your applications and to get access to all the features.
- package/catalog/categories-list/sc-categories-list.component.d.ts +4 -0
- package/catalog/sc-catalog.module.d.ts +1 -1
- package/esm2020/cart/cart-item-mobile/sc-cart-item-mobile.component.mjs +4 -4
- package/esm2020/catalog/categories-list/sc-categories-list.component.mjs +9 -4
- package/esm2020/catalog/sc-catalog.module.mjs +7 -4
- package/esm2020/verification/phone-approve-form/phone-approve-form.component.mjs +5 -3
- package/fesm2015/snabcentr-client-ui.mjs +19 -10
- package/fesm2015/snabcentr-client-ui.mjs.map +1 -1
- package/fesm2020/snabcentr-client-ui.mjs +19 -10
- package/fesm2020/snabcentr-client-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/styles/taiga/snabcentr-tailwind-preset.js +13 -0
- package/styles/tailwind/tailwind.scss +106 -45
|
@@ -11,7 +11,7 @@ import { TuiTextfieldControllerModule, TuiLinkModule, TuiButtonModule, TuiLabelM
|
|
|
11
11
|
import * as i2$1 from '@angular/forms';
|
|
12
12
|
import { FormGroupDirective, FormGroup, FormControl, Validators, FormsModule, ReactiveFormsModule, NgControl } from '@angular/forms';
|
|
13
13
|
import * as i6 from '@taiga-ui/cdk';
|
|
14
|
-
import { tuiControlValue, tuiIsFalsy, TuiLetModule, tuiCreateToken, AbstractTuiNullableControl, TUI_IS_MOBILE, tuiIsPresent, TuiDestroyService, tuiPure } from '@taiga-ui/cdk';
|
|
14
|
+
import { tuiControlValue, tuiIsFalsy, TuiLetModule, tuiCreateToken, AbstractTuiNullableControl, TUI_IS_MOBILE, tuiIsPresent, TuiDestroyService, TuiRepeatTimesModule, tuiPure } from '@taiga-ui/cdk';
|
|
15
15
|
import * as i3 from '@taiga-ui/kit';
|
|
16
16
|
import { TuiInputPasswordModule, TuiInputModule, TuiFieldErrorPipeModule, TuiInputPhoneModule, TuiAccordionModule, TuiElasticContainerModule, TuiCarouselModule, TUI_NUMBER_VALUE_TRANSFORMER, TuiInputNumberComponent, TuiIslandModule, TuiInputNumberModule, TuiTreeService, TuiTreeItemContentComponent, TUI_TREE_START, TUI_TREE_CONTENT, TUI_TREE_LOADING, TUI_TREE_LOADER, TuiTreeModule, TuiCheckboxLabeledModule } from '@taiga-ui/kit';
|
|
17
17
|
import * as i7 from '@maskito/angular';
|
|
@@ -153,9 +153,11 @@ class ScPhoneApproveFormComponent {
|
|
|
153
153
|
this.phoneControl.markAsTouched();
|
|
154
154
|
return false;
|
|
155
155
|
}
|
|
156
|
-
if (this.shouldBeConfirmed && result.isConfirmed === false) {
|
|
156
|
+
if (this.shouldBeConfirmed && (result.isConfirmed === false || result.isConfirmed === null)) {
|
|
157
157
|
this.phoneControl.setErrors({
|
|
158
|
-
serverResponse: [
|
|
158
|
+
serverResponse: [
|
|
159
|
+
'Вход по указанному телефону невозможен. Обратитесь к вашему персональному менеджеру или войдите с использованием e-mail и пароля.',
|
|
160
|
+
],
|
|
159
161
|
});
|
|
160
162
|
this.phoneControl.markAsTouched();
|
|
161
163
|
return false;
|
|
@@ -1178,14 +1180,14 @@ class ScCartItemMobileComponent {
|
|
|
1178
1180
|
* Возвращает ссылку на изображение карточки товара.
|
|
1179
1181
|
*/
|
|
1180
1182
|
getCardImage() {
|
|
1181
|
-
return this.product?.
|
|
1183
|
+
return this.product?.getImagePreview(this.urls.imgServerUrl) ?? this.urls.imgServerUrl + this.pathImageNotFound;
|
|
1182
1184
|
}
|
|
1183
1185
|
}
|
|
1184
1186
|
ScCartItemMobileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScCartItemMobileComponent, deps: [{ token: UnitsHelper }, { token: TuiPreviewDialogService }, { token: SC_URLS }, { token: SC_PATH_IMAGE_NOT_FOUND }], target: i0.ɵɵFactoryTarget.Component });
|
|
1185
|
-
ScCartItemMobileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<
|
|
1187
|
+
ScCartItemMobileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <!-- TODO: \u041D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u0430 \u0440\u0435\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u044F \u0444\u0443\u043D\u043A\u0446\u0438\u043E\u043D\u0430\u043B\u0430.\n <button tuiIconButton size=\"m\" icon=\"scIconVerticalThreeDots\" appearance=\"float\" tuiMode=\"onLight\" class=\"!absolute right-0 top-0\"></button> -->\n <div class=\"flex bg-white border border-tui-base-04 shadow-sc-2 rounded-xl min-w-72 p-4\">\n <div class=\"flex mr-5 max-h-52 min-w-[30%] items-center\">\n <img (click)=\"clickCardEvent.emit()\" [src]=\"getCardImage()\" [alt]=\"product.name\" class=\"rounded-xl w-full max-h-full object-cover\" />\n </div>\n <div class=\"flex flex-col items-start w-full\">\n <a tuiLink (click)=\"clickCardEvent.emit()\" class=\"mb-1\">\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n <div class=\"text-tui-text-02 text-xs\">\n <p *ngIf=\"product.pack\">\u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}</p>\n <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n <div class=\"flex flex-col self-center gap-y-0.5\">\n <p class=\"flex flex-col items-baseline gap-x-2 font-bold\">\n <span>{{ product.costRubString }}</span>\n <span *ngIf=\"!product.priceInRub\">{{ product.costString }}</span>\n </p>\n <span *ngIf=\"product.discount\" class=\"flex items-center\">\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"text-tui-success-fill font-bold\"> -{{ product.discount.percent }}% </span>\n <tui-svg src=\"tuiIconInfoLarge\" [tuiHint]=\"discountHint\" [tuiHintShowDelay]=\"100\" tuiHintDirection=\"top\" class=\"!text-xs !h-4\"></tui-svg>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n </div>\n\n <div *ngIf=\"cartItem.height || cartItem.length || cartItem.width\" class=\"flex my-0.5 items-center\">\n <button\n tuiIconButton\n icon=\"tuiIconSettings\"\n (click)=\"clickSettingsEvent.emit()\"\n size=\"s\"\n appearance=\"secondary\"\n tuiMode=\"onLight\"\n class=\"mr-2 !self-center\"\n ></button>\n <div>\n <ng-container *ngIf=\"cartItem.height; else length\">\n <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n </ng-container>\n <ng-template #length>\n <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n </ng-template>\n <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n </div>\n </div>\n\n <a tuiLink *ngIf=\"cartItem.specificationImgUrl\" (click)=\"showSpecification()\">\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a>\n <ng-template #specificationPreview let-preview>\n <tui-preview [rotatable]=\"false\" [zoomable]=\"false\">\n <img *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\" alt=\"preview\" [src]=\"cartItem.specificationImgUrl\" />\n <button icon=\"tuiIconClose\" title=\"Close\" tuiIconButton tuiPreviewAction type=\"button\" (click)=\"preview.complete()\"></button>\n </tui-preview>\n </ng-template>\n <p class=\"font-bold text-tui-text-01 text-sm\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n </div>\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"quantityControl\"\n [formControl]=\"quantityControl\"\n size=\"s\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n class=\"w-full mt-2\"\n ></sc-input-quantity>\n </div>\n </div>\n</ng-container>\n\n<ng-template #skeleton>\n <div class=\"flex gap-2 w-full\">\n <div class=\"h-20 w-20 bg-tui-base-02 rounded-xl\"></div>\n <div class=\"flex flex-col grow gap-2.5 bg-white\">\n <div class=\"w-full h-4 rounded-xl bg-tui-base-02\"></div>\n <div class=\"w-3/5 h-4 rounded-xl bg-tui-base-02\"></div>\n <div class=\"w-4/5 h-4 rounded-xl bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "component", type: i4.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { kind: "directive", type: i4.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { kind: "component", type: i4.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { kind: "directive", type: i4.TuiHintDirective, selector: "[tuiHint]:not(ng-container)", inputs: ["tuiHint", "tuiHintContext", "tuiHintAppearance"] }, { kind: "directive", type: i4.TuiHintDriverDirective, selector: "[tuiHint]" }, { kind: "directive", type: i4.TuiHintHoverDirective, selector: "[tuiHint]:not(ng-container)", inputs: ["tuiHintShowDelay", "tuiHintHideDelay"], exportAs: ["tuiHintHover"] }, { kind: "directive", type: i4.TuiHintPositionDirective, selector: "[tuiHint]:not([tuiHintCustomPosition])", inputs: ["tuiHintDirection"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i7$1.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }, { kind: "directive", type: i2$2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "pipe", type: i9.TuiCurrencyPipe, name: "tuiCurrency" }, { kind: "pipe", type: i4.TuiFormatNumberPipe, name: "tuiFormatNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1186
1188
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScCartItemMobileComponent, decorators: [{
|
|
1187
1189
|
type: Component,
|
|
1188
|
-
args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<
|
|
1190
|
+
args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <!-- TODO: \u041D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u0430 \u0440\u0435\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u044F \u0444\u0443\u043D\u043A\u0446\u0438\u043E\u043D\u0430\u043B\u0430.\n <button tuiIconButton size=\"m\" icon=\"scIconVerticalThreeDots\" appearance=\"float\" tuiMode=\"onLight\" class=\"!absolute right-0 top-0\"></button> -->\n <div class=\"flex bg-white border border-tui-base-04 shadow-sc-2 rounded-xl min-w-72 p-4\">\n <div class=\"flex mr-5 max-h-52 min-w-[30%] items-center\">\n <img (click)=\"clickCardEvent.emit()\" [src]=\"getCardImage()\" [alt]=\"product.name\" class=\"rounded-xl w-full max-h-full object-cover\" />\n </div>\n <div class=\"flex flex-col items-start w-full\">\n <a tuiLink (click)=\"clickCardEvent.emit()\" class=\"mb-1\">\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n <div class=\"text-tui-text-02 text-xs\">\n <p *ngIf=\"product.pack\">\u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}</p>\n <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n <div class=\"flex flex-col self-center gap-y-0.5\">\n <p class=\"flex flex-col items-baseline gap-x-2 font-bold\">\n <span>{{ product.costRubString }}</span>\n <span *ngIf=\"!product.priceInRub\">{{ product.costString }}</span>\n </p>\n <span *ngIf=\"product.discount\" class=\"flex items-center\">\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"text-tui-success-fill font-bold\"> -{{ product.discount.percent }}% </span>\n <tui-svg src=\"tuiIconInfoLarge\" [tuiHint]=\"discountHint\" [tuiHintShowDelay]=\"100\" tuiHintDirection=\"top\" class=\"!text-xs !h-4\"></tui-svg>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n </div>\n\n <div *ngIf=\"cartItem.height || cartItem.length || cartItem.width\" class=\"flex my-0.5 items-center\">\n <button\n tuiIconButton\n icon=\"tuiIconSettings\"\n (click)=\"clickSettingsEvent.emit()\"\n size=\"s\"\n appearance=\"secondary\"\n tuiMode=\"onLight\"\n class=\"mr-2 !self-center\"\n ></button>\n <div>\n <ng-container *ngIf=\"cartItem.height; else length\">\n <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n </ng-container>\n <ng-template #length>\n <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n </ng-template>\n <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n </div>\n </div>\n\n <a tuiLink *ngIf=\"cartItem.specificationImgUrl\" (click)=\"showSpecification()\">\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a>\n <ng-template #specificationPreview let-preview>\n <tui-preview [rotatable]=\"false\" [zoomable]=\"false\">\n <img *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\" alt=\"preview\" [src]=\"cartItem.specificationImgUrl\" />\n <button icon=\"tuiIconClose\" title=\"Close\" tuiIconButton tuiPreviewAction type=\"button\" (click)=\"preview.complete()\"></button>\n </tui-preview>\n </ng-template>\n <p class=\"font-bold text-tui-text-01 text-sm\">\u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber }} {{ 'RUB' | tuiCurrency }}</p>\n </div>\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"quantityControl\"\n [formControl]=\"quantityControl\"\n size=\"s\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n class=\"w-full mt-2\"\n ></sc-input-quantity>\n </div>\n </div>\n</ng-container>\n\n<ng-template #skeleton>\n <div class=\"flex gap-2 w-full\">\n <div class=\"h-20 w-20 bg-tui-base-02 rounded-xl\"></div>\n <div class=\"flex flex-col grow gap-2.5 bg-white\">\n <div class=\"w-full h-4 rounded-xl bg-tui-base-02\"></div>\n <div class=\"w-3/5 h-4 rounded-xl bg-tui-base-02\"></div>\n <div class=\"w-4/5 h-4 rounded-xl bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n" }]
|
|
1189
1191
|
}], ctorParameters: function () { return [{ type: UnitsHelper }, { type: i7$1.TuiPreviewDialogService, decorators: [{
|
|
1190
1192
|
type: Inject,
|
|
1191
1193
|
args: [TuiPreviewDialogService]
|
|
@@ -1221,6 +1223,10 @@ class ScCategoriesListComponent {
|
|
|
1221
1223
|
*/
|
|
1222
1224
|
constructor(urls) {
|
|
1223
1225
|
this.urls = urls;
|
|
1226
|
+
/**
|
|
1227
|
+
* Признак того, отображается этот компонент на мобильном устройстве или нет.
|
|
1228
|
+
*/
|
|
1229
|
+
this.isMobile = inject(TUI_IS_MOBILE);
|
|
1224
1230
|
/**
|
|
1225
1231
|
* Событие нажатия на категорию.
|
|
1226
1232
|
*/
|
|
@@ -1236,10 +1242,10 @@ class ScCategoriesListComponent {
|
|
|
1236
1242
|
}
|
|
1237
1243
|
}
|
|
1238
1244
|
ScCategoriesListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScCategoriesListComponent, deps: [{ token: SC_URLS }], target: i0.ɵɵFactoryTarget.Component });
|
|
1239
|
-
ScCategoriesListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScCategoriesListComponent, selector: "sc-categories-list", inputs: { categories: "categories" }, outputs: { clickCategoryEvent: "clickCategoryEvent" }, ngImport: i0, template: "<div class=\"
|
|
1245
|
+
ScCategoriesListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScCategoriesListComponent, selector: "sc-categories-list", inputs: { categories: "categories" }, outputs: { clickCategoryEvent: "clickCategoryEvent" }, ngImport: i0, template: "<div class=\"grid grid-cols-[repeat(auto-fill,minmax(21rem,1fr))] gap-x-8 gap-y-2\">\n <ng-container *ngIf=\"categories; else categoriesSkeleton\">\n <button\n *ngFor=\"let item of $any(categories)\"\n class=\"group flex gap-2 py-1.5 px-3 bg-tui-base-02 rounded-xl h-11 items-center text-left hover-hover:hover:ring-2 hover-none:active:ring-2 ring-tui-primary duration-150\"\n (click)=\"clickCategoryEvent.emit(item)\"\n >\n <img *ngIf=\"item.properties?.image\" [src]=\"getCategoryImage(item.properties?.image)\" [alt]=\"item.name\" class=\"w-8 h-8 object-cover rounded bg-tui-base-03\" />\n <tui-svg *ngIf=\"!item.properties?.image\" src=\"tuiIconCameraOffLarge\" class=\"bg-tui-base-03 !w-8 !h-8 rounded text-tui-base-05\"></tui-svg>\n <div class=\"flex grow truncate\">\n <p class=\"text-base font-bold truncate\">{{ item.name }}</p>\n <tui-svg *ngIf=\"item.isFavorite\" src=\"scIconFavoriteFill\" class=\"text-tui-primary !text-sm mr-auto\"></tui-svg>\n </div>\n <tui-svg src=\"tuiIconChevronRightLarge\" class=\"hover-hover:group-hover:text-tui-primary hover-none:group-active:text-tui-primary duration-150\"></tui-svg>\n </button>\n </ng-container>\n</div>\n\n<ng-template #categoriesSkeleton>\n <button\n *tuiRepeatTimes=\"isMobile ? 3 : 6\"\n class=\"group flex gap-2 py-1.5 px-3 bg-tui-base-02 rounded-xl h-11 items-center text-left hover-hover:hover:ring-2 hover-none:active:ring-2 ring-tui-base-05 duration-150\"\n >\n <div class=\"w-8 h-8 tui-skeleton\"></div>\n <div class=\"h-4 grow tui-skeleton\"></div>\n <tui-svg src=\"tuiIconChevronRightLarge\" class=\"hover-hover:group-hover:text-tui-primary hover-none:group-active:text-tui-primary duration-150 tui-skeleton\"></tui-svg>\n </button>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1240
1246
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScCategoriesListComponent, decorators: [{
|
|
1241
1247
|
type: Component,
|
|
1242
|
-
args: [{ selector: 'sc-categories-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"
|
|
1248
|
+
args: [{ selector: 'sc-categories-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"grid grid-cols-[repeat(auto-fill,minmax(21rem,1fr))] gap-x-8 gap-y-2\">\n <ng-container *ngIf=\"categories; else categoriesSkeleton\">\n <button\n *ngFor=\"let item of $any(categories)\"\n class=\"group flex gap-2 py-1.5 px-3 bg-tui-base-02 rounded-xl h-11 items-center text-left hover-hover:hover:ring-2 hover-none:active:ring-2 ring-tui-primary duration-150\"\n (click)=\"clickCategoryEvent.emit(item)\"\n >\n <img *ngIf=\"item.properties?.image\" [src]=\"getCategoryImage(item.properties?.image)\" [alt]=\"item.name\" class=\"w-8 h-8 object-cover rounded bg-tui-base-03\" />\n <tui-svg *ngIf=\"!item.properties?.image\" src=\"tuiIconCameraOffLarge\" class=\"bg-tui-base-03 !w-8 !h-8 rounded text-tui-base-05\"></tui-svg>\n <div class=\"flex grow truncate\">\n <p class=\"text-base font-bold truncate\">{{ item.name }}</p>\n <tui-svg *ngIf=\"item.isFavorite\" src=\"scIconFavoriteFill\" class=\"text-tui-primary !text-sm mr-auto\"></tui-svg>\n </div>\n <tui-svg src=\"tuiIconChevronRightLarge\" class=\"hover-hover:group-hover:text-tui-primary hover-none:group-active:text-tui-primary duration-150\"></tui-svg>\n </button>\n </ng-container>\n</div>\n\n<ng-template #categoriesSkeleton>\n <button\n *tuiRepeatTimes=\"isMobile ? 3 : 6\"\n class=\"group flex gap-2 py-1.5 px-3 bg-tui-base-02 rounded-xl h-11 items-center text-left hover-hover:hover:ring-2 hover-none:active:ring-2 ring-tui-base-05 duration-150\"\n >\n <div class=\"w-8 h-8 tui-skeleton\"></div>\n <div class=\"h-4 grow tui-skeleton\"></div>\n <tui-svg src=\"tuiIconChevronRightLarge\" class=\"hover-hover:group-hover:text-tui-primary hover-none:group-active:text-tui-primary duration-150 tui-skeleton\"></tui-svg>\n </button>\n</ng-template>\n" }]
|
|
1243
1249
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
1244
1250
|
type: Inject,
|
|
1245
1251
|
args: [SC_URLS]
|
|
@@ -1997,7 +2003,8 @@ ScCatalogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
|
|
|
1997
2003
|
TuiFieldErrorPipeModule,
|
|
1998
2004
|
TuiLoaderModule,
|
|
1999
2005
|
TuiLinkModule,
|
|
2000
|
-
TuiElasticContainerModule, i2$3.NgxEchartsModule, TuiLetModule
|
|
2006
|
+
TuiElasticContainerModule, i2$3.NgxEchartsModule, TuiLetModule,
|
|
2007
|
+
TuiRepeatTimesModule], exports: [ScPriceListPaginationComponent,
|
|
2001
2008
|
ScCategoryCardComponent,
|
|
2002
2009
|
ScFavoriteBtnComponent,
|
|
2003
2010
|
ScInputQuantityComponent,
|
|
@@ -2022,7 +2029,8 @@ ScCatalogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
2022
2029
|
TuiLinkModule,
|
|
2023
2030
|
TuiElasticContainerModule,
|
|
2024
2031
|
NgxEchartsModule.forRoot({ echarts }),
|
|
2025
|
-
TuiLetModule
|
|
2032
|
+
TuiLetModule,
|
|
2033
|
+
TuiRepeatTimesModule] });
|
|
2026
2034
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScCatalogModule, decorators: [{
|
|
2027
2035
|
type: NgModule,
|
|
2028
2036
|
args: [{
|
|
@@ -2065,6 +2073,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
2065
2073
|
TuiElasticContainerModule,
|
|
2066
2074
|
NgxEchartsModule.forRoot({ echarts }),
|
|
2067
2075
|
TuiLetModule,
|
|
2076
|
+
TuiRepeatTimesModule,
|
|
2068
2077
|
],
|
|
2069
2078
|
}]
|
|
2070
2079
|
}] });
|