@tekus/kiosks-design-system 3.20.0 → 3.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -120,11 +120,11 @@ class TkKioskBadgeComponent {
|
|
|
120
120
|
return 'tk-kiosk:shopping-cart';
|
|
121
121
|
}
|
|
122
122
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TkKioskBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
123
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TkKioskBadgeComponent, isStandalone: true, selector: "tk-kiosk-badge", inputs: { count: "count", isInactive: "isInactive", squared: "squared", stroked: "stroked", icon: "icon", showText: "showText", size: "size" }, ngImport: i0, template: "<div\n class=\"badge\"\n [ngClass]=\"isInactive || count === 0 ? 'inactive ' : ''\"\n [class.squared]=\"squared\"\n [class.stroked]=\"stroked\"\n [class.badge--icon]=\"icon\"\n [class.badge--sm]=\"size === 'sm'\">\n <span nz-icon *ngIf=\"icon\" [nzType]=\"iconType()\" class=\"icon\"></span>\n <tk-kiosk-typography\n *ngIf=\"showText && size === 'md'\"\n type=\"subtitle1\"\n color=\"tk-color-text-accent-900\">\n {{ count }}\n </tk-kiosk-typography>\n <span *ngIf=\"showText && size === 'sm'\" class=\"badge__count-sm\">{{\n count\n }}</span>\n</div>\n", styles: [".badge{width:fit-content;padding:10px;display:flex;align-items:center;justify-content:center;color:var(--tk-color-text-accent-900);background-color:var(--tk-color-accent-900);border-radius:55px;text-align:center}.badge tk-kiosk-typography{min-width:47px;width:auto;height:47px;line-height:47px}.badge.inactive{color:var(--tk-color-neutral-500);background-color:var(--tk-color-neutral-200)}.badge.squared{border-radius:12px}.badge.stroked{padding:8px;border:2px solid;color:var(--tk-color-accent-900);background-color:var(--tk-color-white-900)}.badge--sm{display:inline-flex;min-width:
|
|
123
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TkKioskBadgeComponent, isStandalone: true, selector: "tk-kiosk-badge", inputs: { count: "count", isInactive: "isInactive", squared: "squared", stroked: "stroked", icon: "icon", showText: "showText", size: "size" }, ngImport: i0, template: "<div\n class=\"badge\"\n [ngClass]=\"isInactive || count === 0 ? 'inactive ' : ''\"\n [class.squared]=\"squared\"\n [class.stroked]=\"stroked\"\n [class.badge--icon]=\"icon\"\n [class.badge--sm]=\"size === 'sm'\">\n <span nz-icon *ngIf=\"icon\" [nzType]=\"iconType()\" class=\"icon\"></span>\n <tk-kiosk-typography\n *ngIf=\"showText && size === 'md'\"\n type=\"subtitle1\"\n color=\"tk-color-text-accent-900\">\n {{ count }}\n </tk-kiosk-typography>\n <span *ngIf=\"showText && size === 'sm'\" class=\"badge__count-sm\">{{\n count\n }}</span>\n</div>\n", styles: [".badge{width:fit-content;padding:10px;display:flex;align-items:center;justify-content:center;color:var(--tk-color-text-accent-900);background-color:var(--tk-color-accent-900);border-radius:55px;text-align:center}.badge tk-kiosk-typography{min-width:47px;width:auto;height:47px;line-height:47px}.badge.inactive{color:var(--tk-color-neutral-500);background-color:var(--tk-color-neutral-200)}.badge.squared{border-radius:12px}.badge.stroked{padding:8px;border:2px solid;color:var(--tk-color-accent-900);background-color:var(--tk-color-white-900)}.badge--sm{display:inline-flex;min-width:26px;width:auto;height:26px;padding:0 6px;border-radius:14px;box-sizing:border-box}.badge--sm .badge__count-sm{font-size:14px;font-weight:700;line-height:24px;white-space:nowrap;color:var(--tk-color-text-accent-900)}.badge--icon{padding:10px;gap:10px;width:fit-content}.badge--icon .icon{font-size:46px;height:46px;line-height:46px}\n"], dependencies: [{ kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak", "preLine"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }] }); }
|
|
124
124
|
}
|
|
125
125
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TkKioskBadgeComponent, decorators: [{
|
|
126
126
|
type: Component,
|
|
127
|
-
args: [{ selector: 'tk-kiosk-badge', standalone: true, imports: [TkKioskTypographyComponent, NgIf, NgClass, NzIconDirective], template: "<div\n class=\"badge\"\n [ngClass]=\"isInactive || count === 0 ? 'inactive ' : ''\"\n [class.squared]=\"squared\"\n [class.stroked]=\"stroked\"\n [class.badge--icon]=\"icon\"\n [class.badge--sm]=\"size === 'sm'\">\n <span nz-icon *ngIf=\"icon\" [nzType]=\"iconType()\" class=\"icon\"></span>\n <tk-kiosk-typography\n *ngIf=\"showText && size === 'md'\"\n type=\"subtitle1\"\n color=\"tk-color-text-accent-900\">\n {{ count }}\n </tk-kiosk-typography>\n <span *ngIf=\"showText && size === 'sm'\" class=\"badge__count-sm\">{{\n count\n }}</span>\n</div>\n", styles: [".badge{width:fit-content;padding:10px;display:flex;align-items:center;justify-content:center;color:var(--tk-color-text-accent-900);background-color:var(--tk-color-accent-900);border-radius:55px;text-align:center}.badge tk-kiosk-typography{min-width:47px;width:auto;height:47px;line-height:47px}.badge.inactive{color:var(--tk-color-neutral-500);background-color:var(--tk-color-neutral-200)}.badge.squared{border-radius:12px}.badge.stroked{padding:8px;border:2px solid;color:var(--tk-color-accent-900);background-color:var(--tk-color-white-900)}.badge--sm{display:inline-flex;min-width:
|
|
127
|
+
args: [{ selector: 'tk-kiosk-badge', standalone: true, imports: [TkKioskTypographyComponent, NgIf, NgClass, NzIconDirective], template: "<div\n class=\"badge\"\n [ngClass]=\"isInactive || count === 0 ? 'inactive ' : ''\"\n [class.squared]=\"squared\"\n [class.stroked]=\"stroked\"\n [class.badge--icon]=\"icon\"\n [class.badge--sm]=\"size === 'sm'\">\n <span nz-icon *ngIf=\"icon\" [nzType]=\"iconType()\" class=\"icon\"></span>\n <tk-kiosk-typography\n *ngIf=\"showText && size === 'md'\"\n type=\"subtitle1\"\n color=\"tk-color-text-accent-900\">\n {{ count }}\n </tk-kiosk-typography>\n <span *ngIf=\"showText && size === 'sm'\" class=\"badge__count-sm\">{{\n count\n }}</span>\n</div>\n", styles: [".badge{width:fit-content;padding:10px;display:flex;align-items:center;justify-content:center;color:var(--tk-color-text-accent-900);background-color:var(--tk-color-accent-900);border-radius:55px;text-align:center}.badge tk-kiosk-typography{min-width:47px;width:auto;height:47px;line-height:47px}.badge.inactive{color:var(--tk-color-neutral-500);background-color:var(--tk-color-neutral-200)}.badge.squared{border-radius:12px}.badge.stroked{padding:8px;border:2px solid;color:var(--tk-color-accent-900);background-color:var(--tk-color-white-900)}.badge--sm{display:inline-flex;min-width:26px;width:auto;height:26px;padding:0 6px;border-radius:14px;box-sizing:border-box}.badge--sm .badge__count-sm{font-size:14px;font-weight:700;line-height:24px;white-space:nowrap;color:var(--tk-color-text-accent-900)}.badge--icon{padding:10px;gap:10px;width:fit-content}.badge--icon .icon{font-size:46px;height:46px;line-height:46px}\n"] }]
|
|
128
128
|
}], propDecorators: { count: [{
|
|
129
129
|
type: Input
|
|
130
130
|
}], isInactive: [{
|
|
@@ -203,7 +203,7 @@ class TkKioskBarCartComponent {
|
|
|
203
203
|
this.onClickCart = new EventEmitter();
|
|
204
204
|
}
|
|
205
205
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TkKioskBarCartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
206
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TkKioskBarCartComponent, isStandalone: true, selector: "tk-kiosk-bar-cart", inputs: { iconWidth: "iconWidth", iconHeight: "iconHeight", cartItems: "cartItems", icon: "icon", label: "label" }, outputs: { onClickCart: "onClickCart" }, ngImport: i0, template: "<tk-kiosk-btn [outline]=\"true\" (onClick)=\"onClickCart.emit(true)\">\n <div class=\"bar-cart\">\n <div class=\"bar-cart__label\">\n <tk-kiosk-typography
|
|
206
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TkKioskBarCartComponent, isStandalone: true, selector: "tk-kiosk-bar-cart", inputs: { iconWidth: "iconWidth", iconHeight: "iconHeight", cartItems: "cartItems", icon: "icon", label: "label" }, outputs: { onClickCart: "onClickCart" }, ngImport: i0, template: "<tk-kiosk-btn [outline]=\"true\" (onClick)=\"onClickCart.emit(true)\">\n <div class=\"bar-cart\">\n <div class=\"bar-cart__label\">\n <tk-kiosk-typography\n [type]=\"'h6-heading'\"\n color=\"tk-color-primary-900\"\n name=\"cartLabel\">\n {{ label }}\n </tk-kiosk-typography>\n </div>\n\n <div class=\"bar-cart__icon-wrapper\">\n <span\n nz-icon\n [nzType]=\"icon\"\n [ngStyle]=\"{ 'font-size': iconWidth, height: iconHeight }\"\n class=\"icon\"></span>\n <tk-kiosk-badge\n *ngIf=\"cartItems > 0\"\n class=\"bar-cart__icon-wrapper__badge\"\n [count]=\"cartItems\"\n size=\"sm\"></tk-kiosk-badge>\n </div>\n </div>\n</tk-kiosk-btn>\n", styles: [".bar-cart{display:flex;align-items:center;cursor:pointer;gap:10px}.bar-cart .bar-cart__icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.bar-cart .bar-cart__icon-wrapper .icon{color:var(--tk-color-secondary-900)}.bar-cart .bar-cart__icon-wrapper__badge{position:absolute;top:-6px;right:-12px}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak", "preLine"] }, { kind: "component", type: TkKioskBadgeComponent, selector: "tk-kiosk-badge", inputs: ["count", "isInactive", "squared", "stroked", "icon", "showText", "size"] }, { kind: "component", type: TkKioskBtnComponent, selector: "tk-kiosk-btn", inputs: ["text", "disabled", "outline", "stroked", "rounded", "variant", "size", "textColor", "backgroundColor", "textSize"], outputs: ["onClick"] }] }); }
|
|
207
207
|
}
|
|
208
208
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TkKioskBarCartComponent, decorators: [{
|
|
209
209
|
type: Component,
|
|
@@ -214,7 +214,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
214
214
|
TkKioskTypographyComponent,
|
|
215
215
|
TkKioskBadgeComponent,
|
|
216
216
|
TkKioskBtnComponent,
|
|
217
|
-
], template: "<tk-kiosk-btn [outline]=\"true\" (onClick)=\"onClickCart.emit(true)\">\n <div class=\"bar-cart\">\n <div class=\"bar-cart__label\">\n <tk-kiosk-typography
|
|
217
|
+
], template: "<tk-kiosk-btn [outline]=\"true\" (onClick)=\"onClickCart.emit(true)\">\n <div class=\"bar-cart\">\n <div class=\"bar-cart__label\">\n <tk-kiosk-typography\n [type]=\"'h6-heading'\"\n color=\"tk-color-primary-900\"\n name=\"cartLabel\">\n {{ label }}\n </tk-kiosk-typography>\n </div>\n\n <div class=\"bar-cart__icon-wrapper\">\n <span\n nz-icon\n [nzType]=\"icon\"\n [ngStyle]=\"{ 'font-size': iconWidth, height: iconHeight }\"\n class=\"icon\"></span>\n <tk-kiosk-badge\n *ngIf=\"cartItems > 0\"\n class=\"bar-cart__icon-wrapper__badge\"\n [count]=\"cartItems\"\n size=\"sm\"></tk-kiosk-badge>\n </div>\n </div>\n</tk-kiosk-btn>\n", styles: [".bar-cart{display:flex;align-items:center;cursor:pointer;gap:10px}.bar-cart .bar-cart__icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.bar-cart .bar-cart__icon-wrapper .icon{color:var(--tk-color-secondary-900)}.bar-cart .bar-cart__icon-wrapper__badge{position:absolute;top:-6px;right:-12px}\n"] }]
|
|
218
218
|
}], propDecorators: { iconWidth: [{
|
|
219
219
|
type: Input
|
|
220
220
|
}], iconHeight: [{
|