chore(demo): remove editor package (#6535)

taiga-family · Jan 24, 2024 · 1b57811 · 1b57811
1 parent 6459696
commit 1b57811
Show file tree

Hide file tree

Showing 7 changed files with 109 additions and 1,231 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -138,7 +138,6 @@
         "@taiga-ui/stylelint-config": "0.12.5",
         "@taiga-ui/tsconfig": "0.12.0",
         "@tinkoff/ng-event-plugins": "3.1.0",
-        "@tinkoff/tui-editor": "1.11.0",
         "@types/glob": "8.1.0",
         "@types/node": "20.11.6",
         "@types/parse5": "6.0.3",

diff --git a/projects/demo/src/modules/icons/icons-group/icons-group.component.ts b/projects/demo/src/modules/icons/icons-group/icons-group.component.ts
@@ -55,8 +55,8 @@ export class IconsGroupComponent implements OnInit {
         this.control.valueChanges
             .pipe(
                 debounceTime(500),
-                filter(search => !!search && (search.length > 2 || search.length === 0)),
-                map(search => search || null),
+                map(search => search || ''),
+                filter(search => search.length > 2 || search.length === 0),
                 takeUntil(this.destroy$),
             )
             .subscribe(search => {

diff --git a/projects/demo/src/modules/icons/icons.component.ts b/projects/demo/src/modules/icons/icons.component.ts
@@ -2,7 +2,7 @@ import {Component, Inject} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {assets} from '@demo/utils';
 import {TuiBrightness, TuiModeDirective} from '@taiga-ui/core';
-import {BehaviorSubject, debounceTime, map, Observable, share, startWith} from 'rxjs';
+import {map, Observable, startWith} from 'rxjs';
 
 import {DemoTuiIconsTabs, TUI_DEMO_ICONS} from './icons.tokens';
 
@@ -13,15 +13,9 @@ import {DemoTuiIconsTabs, TUI_DEMO_ICONS} from './icons.tokens';
     changeDetection,
 })
 export class IconsComponent {
-    private readonly currentColor$ = new BehaviorSubject('');
     readonly keys = Object.keys(this.icons);
     readonly exampleModule = import('./import/import-module.md?raw');
-
     readonly exampleHtml = import('./import/insert-template.md?raw');
-    appearance = false;
-    transparent = false;
-
-    color$ = this.currentColor$.pipe(debounceTime(200), share());
 
     readonly iconVariants: readonly string[] = [
         'https://ng-web-apis.github.io/dist/assets/images/web-api.svg',
@@ -53,8 +47,4 @@ export class IconsComponent {
     onIntersection(entries: IntersectionObserverEntry[]): boolean {
         return entries[entries.length - 1]?.isIntersecting ?? false;
     }
-
-    colorChange(color: string): void {
-        this.currentColor$.next(color);
-    }
 }
diff --git a/projects/demo/src/modules/icons/icons.module.ts b/projects/demo/src/modules/icons/icons.module.ts
@@ -7,13 +7,11 @@ import {TuiAddonDocModule, tuiGenerateRoutes} from '@taiga-ui/addon-doc';
 import {TuiActiveZoneModule} from '@taiga-ui/cdk';
 import {
     TuiButtonModule,
-    TuiHostedDropdownModule,
     TuiLinkModule,
     TuiNotificationModule,
     TuiSvgModule,
 } from '@taiga-ui/core';
 import {TuiCheckboxLabeledModule} from '@taiga-ui/kit';
-import {TuiColorSelectorModule} from '@tinkoff/tui-editor';
 
 import {IconsComponent} from './icons.component';
 import {IconsGroupModule} from './icons-group/icons-group.module';
@@ -30,8 +28,6 @@ import {IconsGroupModule} from './icons-group/icons-group.module';
         IconsGroupModule,
         RouterModule.forChild(tuiGenerateRoutes(IconsComponent)),
         TuiCheckboxLabeledModule,
-        TuiHostedDropdownModule,
-        TuiColorSelectorModule,
         TuiActiveZoneModule,
         IntersectionObserverModule,
     ],

diff --git a/projects/demo/src/modules/icons/icons.style.less b/projects/demo/src/modules/icons/icons.style.less
@@ -16,27 +16,6 @@
     will-change: transform, box-shadow;
     border-radius: 0.625rem;
 
-    &.t-background {
-        background-image: linear-gradient(45deg, var(--tui-base-02) 25%, transparent 25%),
-            linear-gradient(-45deg, var(--tui-base-02) 25%, transparent 25%),
-            linear-gradient(45deg, transparent 75%, var(--tui-base-02) 75%),
-            linear-gradient(-45deg, transparent 75%, var(--tui-base-02) 75%);
-        background-size: 1.25rem 1.25rem;
-        background-position:
-            0 0,
-            0 0.625rem,
-            0.625rem -0.625rem,
-            -0.625rem 0;
-
-        &.t-wrapper-icons_dark {
-            border: 1px solid var(--tui-base-03);
-            background-image: linear-gradient(45deg, #2b2b2b 25%, transparent 25%),
-                linear-gradient(-45deg, #2b2b2b 25%, transparent 25%),
-                linear-gradient(45deg, transparent 75%, #2b2b2b 75%),
-                linear-gradient(-45deg, transparent 75%, #2b2b2b 75%);
-        }
-    }
-
     &:hover {
         transform: scale(1.5);
         background: var(--tui-base-01);
@@ -54,25 +33,3 @@
         }
     }
 }
-
-.icons-customization {
-    display: flex;
-    margin-top: 0.625rem;
-    flex-flow: row-reverse;
-}
-
-.icons-color {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    line-height: 0;
-}
-
-.color-picker {
-    width: 1rem;
-    height: 1rem;
-    background-color: var(--tui-text-01);
-    border-radius: var(--tui-radius-xs);
-    margin-right: 0.5rem;
-    cursor: pointer;
-}
diff --git a/projects/demo/src/modules/icons/icons.template.html b/projects/demo/src/modules/icons/icons.template.html
@@ -38,52 +38,8 @@
         <icons-group
             waIntersectionObserver
             waIntersectionThreshold="0.5"
-            [color]="color$ | async"
             [icons]="icons[key]"
         >
-            <div class="icons-customization">
-                <tui-hosted-dropdown
-                    tuiDropdownAlign="left"
-                    class="tui-space_right-2"
-                    [content]="picker"
-                    [tuiDropdownMaxHeight]="999"
-                >
-                    <div class="icons-color">
-                        <div
-                            class="color-picker"
-                            [style.background-color]="color$ | async"
-                        ></div>
-                        <div>Icon color</div>
-                    </div>
-                </tui-hosted-dropdown>
-                <ng-template
-                    #picker
-                    let-activeZone
-                >
-                    <tui-color-selector
-                        [color]="(color$ | async) || ''"
-                        [tuiActiveZoneParent]="activeZone"
-                        (colorChange)="colorChange($event)"
-                    ></tui-color-selector>
-                </ng-template>
-
-                <tui-checkbox-labeled
-                    size="m"
-                    class="t-checkbox tui-space_right-3"
-                    [(ngModel)]="transparent"
-                >
-                    Transparent
-                </tui-checkbox-labeled>
-
-                <tui-checkbox-labeled
-                    size="m"
-                    class="t-checkbox tui-space_right-3"
-                    [(ngModel)]="appearance"
-                >
-                    Icon appearance
-                </tui-checkbox-labeled>
-            </div>
-
             <ng-template
                 iconGroup
                 let-copyPath="copyPath"
@@ -103,9 +59,6 @@
                         type="button"
                         class="icon"
                         [attr.aria-label]="icon"
-                        [class.t-appearance]="appearance"
-                        [class.t-background]="transparent"
-                        [class.t-wrapper-icons_dark]="(mode$ | async) === 'onDark'"
                         [icon]="icon"
                         (click)="copyPath(icon)"
                     ></button>