feat(core): TuiBrigthness is now type; dark -> onLight, light -> on…

…Dark (#69) * feat(core): `TuiBrigthness` is now type; BREAKING CHANGE: dark -> onLight, light -> onDark * chore(tests): fix import * chore(tests): fix core tests * chore(all): fix icorrect replacements * chore(all): + one fix
taiga-family · Dec 26, 2020 · e500553 · e500553
1 parent d968474
commit e500553
Show file tree

Hide file tree

Showing 76 changed files with 159 additions and 165 deletions.
diff --git a/projects/addon-doc/src/components/demo/demo.template.html b/projects/addon-doc/src/components/demo/demo.template.html
@@ -3,7 +3,7 @@
     <tui-tooltip size="l" describeId="form" [content]="tooltip">
         <ng-template #tooltip>
             {{texts[0]}}
-            <a tuiLink tuiMode="light" routerLink="/tui-mode">
+            <a tuiLink tuiMode="onDark" routerLink="/tui-mode">
                 <code>tuiMode</code>
             </a>
         </ng-template>
@@ -21,23 +21,23 @@
         </tui-radio-block>
         <tui-radio-block
             class="tui-group__auto-width-item"
-            item="light"
+            item="onDark"
             size="s"
             nativeId="form"
             [hideRadio]="true"
             [formControl]="modeControl"
         >
-            light
+            onDark
         </tui-radio-block>
         <tui-radio-block
             class="tui-group__auto-width-item"
-            item="dark"
+            item="onLight"
             size="s"
             nativeId="form"
             [hideRadio]="true"
             [formControl]="modeControl"
         >
-            dark
+            onLight
         </tui-radio-block>
     </div>
     <tui-checkbox-labeled
@@ -51,8 +51,8 @@
 <div
     #wrapper
     class="wrapper"
-    [class.wrapper_dark]="modeControl.value === 'light'"
-    [class.wrapper_gray]="modeControl.value === 'dark'"
+    [class.wrapper_dark]="modeControl.value === 'onDark'"
+    [class.wrapper_gray]="modeControl.value === 'onLight'"
     [class.wrapper_transparent]="!opaque"
 >
     <div #content id="demoContent" class="content">

diff --git a/projects/addon-doc/src/components/documentation/documentation.template.html b/projects/addon-doc/src/components/documentation/documentation.template.html
@@ -51,7 +51,7 @@ <h1 *ngIf="heading" class="tui-text_h4">{{heading}}</h1>
                         {{texts[4]}}
                         <a
                             tuiLink
-                            tuiMode="light"
+                            tuiMode="onDark"
                             target="_blank"
                             href="https://github.com/TinkoffCreditSystems/ng-polymorpheus"
                             ><code>ng-polymorpheus</code></a

diff --git a/projects/addon-tablebars/classes/table-bar.ts b/projects/addon-tablebars/classes/table-bar.ts
@@ -15,11 +15,7 @@ export class TableBar {
         readonly content: PolymorpheusContent<{}>,
         options: TuiTableBarOptions = {},
     ) {
-        const {
-            mode = TuiBrightness.Dark,
-            hasCloseButton = false,
-            adaptive = false,
-        } = options;
+        const {mode = 'onLight', hasCloseButton = false, adaptive = false} = options;
 
         this.mode = mode;
         this.hasCloseButton = hasCloseButton;

diff --git a/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts b/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts
@@ -19,7 +19,7 @@ export class TuiTableBarsHostComponent {
     ) {}
 
     getMode(mode: TuiBrightness): TuiBrightness | null {
-        return mode === 'dark' ? TuiBrightness.Light : null;
+        return mode === 'onLight' ? 'onDark' : null;
     }
 
     onCloseClick(itemToRemove: TableBar) {

diff --git a/projects/addon-tablebars/components/table-bars-host/table-bars-host.template.html b/projects/addon-tablebars/components/table-bars-host/table-bars-host.template.html
@@ -2,7 +2,7 @@
     <div
         automation-id="tui-table-bar__bar"
         class="bar"
-        [class.bar_light]="item.mode === 'light'"
+        [class.bar_light]="item.mode === 'onDark'"
         [@tuiSlideInTop]
     >
         <div

diff --git a/projects/addon-tablebars/components/table-bars-host/test/table-bars-host.component.spec.ts b/projects/addon-tablebars/components/table-bars-host/test/table-bars-host.component.spec.ts
@@ -1,7 +1,6 @@
 import {Component, DebugElement, ViewChild} from '@angular/core';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {NoopAnimationsModule} from '@angular/platform-browser/animations';
-import {TuiBrightness} from '@taiga-ui/core';
 import {PageObject} from '@taiga-ui/testing';
 import {configureTestSuite} from 'ng-bullet';
 import {Subscription, timer} from 'rxjs';
@@ -94,7 +93,7 @@ describe('TableBarsHost', () => {
     });
 
     it('при mode: light tableBar светлый', () => {
-        service.open(title, {mode: TuiBrightness.Light}).pipe(take(1)).subscribe();
+        service.open(title, {mode: 'onDark'}).pipe(take(1)).subscribe();
         fixture.detectChanges();
 
         expect(getBar().nativeElement.classList.contains('bar_light')).toBe(true);

diff --git a/projects/core/components/error/error.component.ts b/projects/core/components/error/error.component.ts
@@ -1,9 +1,9 @@
 import {ChangeDetectionStrategy, Component, Inject, Input} from '@angular/core';
 import {tuiDefaultProp, TuiDestroyService, TuiValidationError} from '@taiga-ui/cdk';
 import {tuiFadeIn, tuiHeightCollapse} from '@taiga-ui/core/animations';
-import {TuiBrightness} from '@taiga-ui/core/enums';
 import {MODE_PROVIDER} from '@taiga-ui/core/providers';
 import {TUI_DEFAULT_ERROR_MESSAGE, TUI_MODE} from '@taiga-ui/core/tokens';
+import {TuiBrightness} from '@taiga-ui/core/types';
 import {Observable} from 'rxjs';
 
 @Component({

diff --git a/projects/core/components/error/error.template.html b/projects/core/components/error/error.template.html
@@ -2,7 +2,7 @@
     *ngIf="!!error"
     automation-id="tui-error__text"
     class="message-text"
-    [class.message-text_light]="(mode$ | async) === 'light'"
+    [class.message-text_light]="(mode$ | async) === 'onDark'"
     [content]="error.message || defauleErrorMessage"
     [context]="error.context || {}"
     [@tuiHeightCollapse]

diff --git a/projects/core/components/hints-host/hint-box/hint-box.style.less b/projects/core/components/hints-host/hint-box/hint-box.style.less
@@ -79,7 +79,7 @@
         background-color: var(--tui-error-fill);
     }
 
-    &[data-tui-host-mode='light'],
+    &[data-tui-host-mode='onDark'],
     &[data-tui-host-mode='overflow'] {
         .shadow(2);
         border: 1px solid var(--tui-base-03);

diff --git a/projects/core/components/label/label.style.less b/projects/core/components/label/label.style.less
@@ -25,7 +25,7 @@
         color: var(--tui-text-02);
     }
 
-    :host-context([data-tui-mode='light']) & {
+    :host-context([data-tui-mode='onDark']) & {
         color: var(--tui-text-02-night);
     }
 }

diff --git a/projects/core/components/link/link.component.ts b/projects/core/components/link/link.component.ts
@@ -19,8 +19,8 @@ import {
     TuiNativeFocusableElement,
 } from '@taiga-ui/cdk';
 import {TuiModeDirective} from '@taiga-ui/core/directives/mode';
-import {TuiBrightness, TuiLinkMode} from '@taiga-ui/core/enums';
-import {TuiHorizontalDirection} from '@taiga-ui/core/types';
+import {TuiLinkMode} from '@taiga-ui/core/enums';
+import {TuiBrightness, TuiHorizontalDirection} from '@taiga-ui/core/types';
 
 // @bad TODO: Think about extending Interactive
 @Component({

diff --git a/projects/core/components/link/link.style.less b/projects/core/components/link/link.style.less
@@ -15,7 +15,7 @@
         color: var(--tui-link-hover);
     }
 
-    &[data-tui-host-mode='dark'] {
+    &[data-tui-host-mode='onLight'] {
         color: var(--tui-text-03);
 
         &:hover,
@@ -33,7 +33,7 @@
         }
     }
 
-    &[data-tui-host-mode='light'] {
+    &[data-tui-host-mode='onDark'] {
         color: var(--tui-text-03-night);
 
         &:hover,
@@ -77,12 +77,12 @@
         background: var(--tui-selection);
     }
 
-    :host[data-tui-host-mode='dark']._focus-visible & {
+    :host[data-tui-host-mode='onLight']._focus-visible & {
         background: var(--tui-text-01);
         color: var(--tui-base-01);
     }
 
-    :host[data-tui-host-mode='light']._focus-visible & {
+    :host[data-tui-host-mode='onDark']._focus-visible & {
         background: var(--tui-base-01);
         color: var(--tui-text-01);
     }

diff --git a/projects/core/components/primitive-textfield/primitive-textfield.component.ts b/projects/core/components/primitive-textfield/primitive-textfield.component.ts
@@ -37,9 +37,14 @@ import {
     TUI_TEXTIFELD_WATCHED_CONTROLLER,
     TuiTextfieldController,
 } from '@taiga-ui/core/directives/textfield-controller';
-import {TuiAppearance, TuiBrightness} from '@taiga-ui/core/enums';
+import {TuiAppearance} from '@taiga-ui/core/enums';
 import {TUI_VALUE_ACCESSOR} from '@taiga-ui/core/tokens';
-import {TuiHorizontalDirection, TuiSizeL, TuiSizeS} from '@taiga-ui/core/types';
+import {
+    TuiBrightness,
+    TuiHorizontalDirection,
+    TuiSizeL,
+    TuiSizeS,
+} from '@taiga-ui/core/types';
 import {getPadding, sizeBigger} from '@taiga-ui/core/utils/miscellaneous';
 import {PolymorpheusContent, PolymorpheusOutletComponent} from '@tinkoff/ng-polymorpheus';
 

diff --git a/projects/core/components/primitive-textfield/primitive-textfield.style.less b/projects/core/components/primitive-textfield/primitive-textfield.style.less
@@ -27,11 +27,11 @@
         color: var(--tui-text-02);
     }
 
-    :host[data-tui-host-mode='light']._hovered:not(._readonly) & {
+    :host[data-tui-host-mode='onDark']._hovered:not(._readonly) & {
         color: var(--tui-text-01-night);
     }
 
-    :host[data-tui-host-mode='dark']._hovered:not(._readonly) & {
+    :host[data-tui-host-mode='onLight']._hovered:not(._readonly) & {
         color: var(--tui-text-01);
     }
 }

diff --git a/projects/core/components/primitive-textfield/test/primitive-textfield.component.spec.ts b/projects/core/components/primitive-textfield/test/primitive-textfield.component.spec.ts
@@ -14,7 +14,7 @@ import {configureTestSuite} from 'ng-bullet';
 import {TuiHintControllerModule} from '../../../directives/hint-controller/hint-controller.module';
 import {TuiModeModule} from '../../../directives/mode/mode.module';
 import {TuiTextfieldControllerModule} from '../../../directives/textfield-controller';
-import {TuiBrightness} from '../../../enums/brightness';
+import {TuiBrightness} from '../../../types/brightness';
 import {TuiSizeL, TuiSizeS} from '../../../types/size';
 import {TuiPrimitiveTextfieldComponent} from '../primitive-textfield.component';
 import {TuiPrimitiveTextfieldModule} from '../primitive-textfield.module';
@@ -112,17 +112,17 @@ describe('PrimitiveTextfield', () => {
 
     describe('background', () => {
         it('gets light mode correctly', () => {
-            testComponent.mode = TuiBrightness.Light;
+            testComponent.mode = 'onDark';
             fixture.detectChanges();
 
-            expect(testComponent.component.hostMode).toBe(TuiBrightness.Light);
+            expect(testComponent.component.hostMode).toBe('onDark');
         });
 
         it('gets dark mode correctly', () => {
-            testComponent.mode = TuiBrightness.Dark;
+            testComponent.mode = 'onLight';
             fixture.detectChanges();
 
-            expect(testComponent.component.hostMode).toBe(TuiBrightness.Dark);
+            expect(testComponent.component.hostMode).toBe('onLight');
         });
     });
 

diff --git a/projects/core/components/scroll-controls/scroll-controls.component.ts b/projects/core/components/scroll-controls/scroll-controls.component.ts
@@ -9,7 +9,6 @@ import {
 import {tuiZoneOptimized} from '@taiga-ui/cdk';
 import {tuiFadeIn} from '@taiga-ui/core/animations';
 import {TuiModeDirective} from '@taiga-ui/core/directives/mode';
-import {TuiBrightness} from '@taiga-ui/core/enums';
 import {TUI_SCROLL_REF} from '@taiga-ui/core/tokens';
 import {interval} from 'rxjs';
 import {distinctUntilChanged, map, startWith} from 'rxjs/operators';
@@ -40,7 +39,7 @@ export class TuiScrollControlsComponent {
     ) {}
 
     get isLight(): boolean {
-        return !!this.modeDirective && this.modeDirective.mode === TuiBrightness.Light;
+        return !!this.modeDirective && this.modeDirective.mode === 'onDark';
     }
 
     private get scrollbars(): [boolean, boolean] {

diff --git a/projects/core/components/tooltip/tooltip.component.ts b/projects/core/components/tooltip/tooltip.component.ts
@@ -6,10 +6,10 @@ import {
     Input,
 } from '@angular/core';
 import {tuiDefaultProp, TuiDestroyService} from '@taiga-ui/cdk';
-import {TuiBrightness, TuiHintMode} from '@taiga-ui/core/enums';
+import {TuiHintMode} from '@taiga-ui/core/enums';
 import {MODE_PROVIDER} from '@taiga-ui/core/providers';
 import {TUI_MODE} from '@taiga-ui/core/tokens';
-import {TuiDirection} from '@taiga-ui/core/types';
+import {TuiBrightness, TuiDirection} from '@taiga-ui/core/types';
 import {PolymorpheusContent} from '@tinkoff/ng-polymorpheus';
 import {Observable} from 'rxjs';
 

diff --git a/projects/core/components/tooltip/tooltip.style.less b/projects/core/components/tooltip/tooltip.style.less
@@ -16,11 +16,11 @@
         color: var(--tui-text-02);
     }
 
-    &[data-tui-host-mode='light'] {
+    &[data-tui-host-mode='onDark'] {
         color: var(--tui-text-01-night);
     }
 
-    &[data-tui-host-mode='dark'] {
+    &[data-tui-host-mode='onLight'] {
         color: var(--tui-text-01);
     }
 
@@ -38,8 +38,8 @@
         color: var(--tui-text-02);
     }
 
-    :host[data-tui-host-mode='dark'] &,
-    :host[data-tui-host-mode='light'] & {
+    :host[data-tui-host-mode='onLight'] &,
+    :host[data-tui-host-mode='onDark'] & {
         opacity: var(--tui-disabled-opacity);
 
         &:hover,

diff --git a/projects/core/components/wrapper/wrapper.component.ts b/projects/core/components/wrapper/wrapper.component.ts
@@ -6,8 +6,9 @@ import {
     Input,
 } from '@angular/core';
 import {TUI_IS_MOBILE} from '@taiga-ui/cdk';
-import {TuiBrightness, TuiInteractiveState} from '@taiga-ui/core/enums';
+import {TuiInteractiveState} from '@taiga-ui/core/enums';
 import {TUI_MODE} from '@taiga-ui/core/tokens';
+import {TuiBrightness} from '@taiga-ui/core/types';
 import {Observable} from 'rxjs';
 
 import {TUI_WRAPPER_PROVIDERS} from './wrapper.providers';

diff --git a/projects/core/directives/mode/mode.directive.ts b/projects/core/directives/mode/mode.directive.ts
@@ -1,5 +1,5 @@
 import {Directive, HostBinding, Input} from '@angular/core';
-import {TuiBrightness} from '@taiga-ui/core/enums';
+import {TuiBrightness} from '@taiga-ui/core/types';
 import {Subject} from 'rxjs';
 
 @Directive({

diff --git a/projects/core/enums/brightness.ts b/projects/core/enums/brightness.ts
diff --git a/projects/core/enums/hint-mode.ts b/projects/core/enums/hint-mode.ts
@@ -1,5 +1,5 @@
 export const enum TuiHintMode {
     Error = 'error',
-    Light = 'light',
+    OnDark = 'onDark',
     Overflow = 'overflow',
 }
diff --git a/projects/core/enums/index.ts b/projects/core/enums/index.ts
@@ -1,6 +1,5 @@
 export * from './appearance';
 export * from './base-color';
-export * from './brightness';
 export * from './button-shape';
 export * from './decimal';
 export * from './dropdown-animation';