diff --git a/projects/addon-table/components/table/providers/table.providers.ts b/projects/addon-table/components/table/providers/table.providers.ts index ba957dcc7a45b..0a5a827830d5b 100644 --- a/projects/addon-table/components/table/providers/table.providers.ts +++ b/projects/addon-table/components/table/providers/table.providers.ts @@ -1,4 +1,4 @@ -import {forwardRef} from '@angular/core'; +import {forwardRef, SkipSelf} from '@angular/core'; import { INTERSECTION_ROOT_MARGIN, INTERSECTION_THRESHOLD, @@ -10,6 +10,7 @@ import { TUI_TEXTFIELD_LABEL_OUTSIDE, TUI_TEXTFIELD_SIZE, } from '@taiga-ui/core'; +import {InputCountOptions, TUI_INPUT_COUNT_OPTIONS} from '@taiga-ui/kit'; import {TuiTableDirective} from '../directives/table.directive'; import {TUI_STUCK_PROVIDER} from './stuck.provider'; @@ -19,6 +20,10 @@ export const TABLE_LABEL = { labelOutside: true, }; +export function inputCountOptionsFactory(options: InputCountOptions): InputCountOptions { + return {...options, hideButtons: true}; +} + export const TUI_TABLE_PROVIDERS = [ { provide: INTERSECTION_ROOT_MARGIN, @@ -37,6 +42,11 @@ export const TUI_TABLE_PROVIDERS = [ provide: TUI_TEXTFIELD_LABEL_OUTSIDE, useValue: TABLE_LABEL, }, + { + provide: TUI_INPUT_COUNT_OPTIONS, + deps: [[new SkipSelf(), TUI_INPUT_COUNT_OPTIONS]], + useFactory: inputCountOptionsFactory, + }, { provide: TUI_TEXTFIELD_SIZE, useExisting: forwardRef(() => TuiTableDirective), diff --git a/projects/demo/src/modules/components/input-count/examples/3/index.ts b/projects/demo/src/modules/components/input-count/examples/3/index.ts index d9179ee38fa1a..cdf0938392235 100644 --- a/projects/demo/src/modules/components/input-count/examples/3/index.ts +++ b/projects/demo/src/modules/components/input-count/examples/3/index.ts @@ -15,12 +15,8 @@ import {encapsulation} from '../../../../../view-encapsulation'; useValue: { ...TUI_INPUT_COUNT_DEFAULT_OPTIONS, icons: { - up: ({$implicit}: any) => - $implicit === 'm' ? 'tuiIconChevronUp' : 'tuiIconChevronUpLarge', - down: ({$implicit}: any) => - $implicit === 'm' - ? 'tuiIconChevronDown' - : 'tuiIconChevronDownLarge', + up: 'tuiIconChevronUp', + down: 'tuiIconChevronDown', }, appearance: 'secondary', step: 10, diff --git a/projects/demo/src/modules/components/input-count/examples/import/define-options.txt b/projects/demo/src/modules/components/input-count/examples/import/define-options.txt index ee74fd560c007..8044f2a3ed92c 100644 --- a/projects/demo/src/modules/components/input-count/examples/import/define-options.txt +++ b/projects/demo/src/modules/components/input-count/examples/import/define-options.txt @@ -8,12 +8,8 @@ import {TUI_INPUT_COUNT_OPTIONS, TUI_INPUT_COUNT_DEFAULT_OPTIONS} from '@taiga-u useValue: { ...TUI_INPUT_COUNT_DEFAULT_OPTIONS, icons: { - up: ({$implicit}: any) => - $implicit === 'm' ? 'tuiIconChevronUp' : 'tuiIconChevronUpLarge', - down: ({$implicit}: any) => - $implicit === 'm' - ? 'tuiIconChevronDown' - : 'tuiIconChevronDownLarge', + up: 'tuiIconChevronUp', + down: 'tuiIconChevronDown', }, appearance: 'secondary', step: 10, diff --git a/projects/kit/components/input-count/input-count-options.ts b/projects/kit/components/input-count/input-count-options.ts index 041b519b16e74..351c31ee2a43a 100644 --- a/projects/kit/components/input-count/input-count-options.ts +++ b/projects/kit/components/input-count/input-count-options.ts @@ -1,12 +1,10 @@ import {InjectionToken} from '@angular/core'; -import {TuiContextWithImplicit} from '@taiga-ui/cdk'; -import {TuiSizeL} from '@taiga-ui/core'; import {PolymorpheusContent} from '@tinkoff/ng-polymorpheus'; export interface InputCountOptions { readonly icons: Readonly<{ - up: PolymorpheusContent>; - down: PolymorpheusContent>; + up: PolymorpheusContent<{}>; + down: PolymorpheusContent<{}>; }>; appearance: string; hideButtons: boolean; diff --git a/projects/kit/components/input-count/input-count.component.ts b/projects/kit/components/input-count/input-count.component.ts index 6d698fbaeaf89..23892cfa19139 100644 --- a/projects/kit/components/input-count/input-count.component.ts +++ b/projects/kit/components/input-count/input-count.component.ts @@ -20,16 +20,13 @@ import { setNativeFocused, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_MOBILE, - TuiContextWithImplicit, tuiDefaultProp, TuiFocusableElementAccessor, tuiPure, } from '@taiga-ui/cdk'; import { formatNumber, - TUI_TEXTFIELD_APPEARANCE, TUI_TEXTFIELD_SIZE, - TuiAppearance, tuiCreateNumberMask, TuiPrimitiveTextfieldComponent, TuiSizeL, @@ -93,8 +90,6 @@ export class TuiInputCountComponent @Inject(NgControl) control: NgControl | null, @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef, - @Inject(TUI_TEXTFIELD_APPEARANCE) - private readonly appearance: string, @Inject(TUI_TEXTFIELD_SIZE) private readonly textfieldSize: TuiTextfieldSizeDirective, @Inject(TUI_PLUS_MINUS_TEXTS) @@ -106,11 +101,11 @@ export class TuiInputCountComponent super(control, changeDetectorRef); } - get iconUp(): PolymorpheusContent> { + get iconUp(): PolymorpheusContent<{}> { return this.options.icons.up; } - get iconDown(): PolymorpheusContent> { + get iconDown(): PolymorpheusContent<{}> { return this.options.icons.down; } @@ -131,7 +126,7 @@ export class TuiInputCountComponent @HostBinding('class._has-buttons') get hasButtons(): boolean { - return !this.hideButtons && this.appearance !== TuiAppearance.Table; + return !this.hideButtons; } get exampleText(): string { diff --git a/projects/kit/components/input-count/input-count.style.less b/projects/kit/components/input-count/input-count.style.less index a68600f094c74..f5b96d75e3d5a 100644 --- a/projects/kit/components/input-count/input-count.style.less +++ b/projects/kit/components/input-count/input-count.style.less @@ -39,10 +39,11 @@ .buttons .button { display: flex; width: calc(var(--tui-height-m) * 0.75); - height: 100%; + height: calc(50% - 0.0625rem); &_plus { border-radius: 0 var(--tui-radius-m) 0 0; + margin-bottom: 0.125rem; } &_minus { @@ -53,11 +54,3 @@ width: calc(var(--tui-height-l) * 0.75); } } - -.button-wrapper { - height: calc(50% - 0.0625rem); - - &_plus { - margin-bottom: 0.125rem; - } -} diff --git a/projects/kit/components/input-count/input-count.template.html b/projects/kit/components/input-count/input-count.template.html index e2b910244ecfc..eff6b6c6d79c1 100644 --- a/projects/kit/components/input-count/input-count.template.html +++ b/projects/kit/components/input-count/input-count.template.html @@ -25,51 +25,33 @@
- - - - - - - - - - + +