feat(demo): translate into eng (#51)

* chore(demo): start i18n

* chore(demo): add "install table"

* chore(i18n): add some new translations

* chore(doc): page to inputs for i18n support

* chore(demo): i18n basic sample

* chore(demo): translate and update home page

* chore(demo): mark i18n for Documentation pages

* chore(demo): i18n typography

* chore(demo): start colors i18n

* chore(demo): colors i18n

* chore(demo): grid i18n

* chore(demo): icons i18n

* chore(demo): shadows i18n

* chore(demo): lists i18n + add i18n-headers

* chore(demo): page PWA i18n

* chore(demo): page spaces i18n

* chore(demo): page accordion i18n

* chore(demo): i18n theming

* chore(demo): i18n tables

* chore(demo): i18n skeleton

* chore(demo): i18n form

* chore(demo): i18n action + all import module guides

* chore(demo): i18n avatar

* chore(demo): i18n badge

* chore(demo): i18n badgedContent

* chore(demo): i18n breadcrumbs

* chore(demo): i18n button

* chore(demo): i18n calendar

* chore(demo): i18n calendar range

* chore(demo): i18n card

* chore(demo): remove no needed i18n-headers

* chore(demo): i18n month

* chore(demo): i18n checkbox

* chore(demo): i18n checkbox block

* chore(demo): i18n checkbox labeled

* chore(demo): i18n color picker

* chore(demo): i18n combo box

* chore(demo): fix build error

* chore(demo): disabled state i18n

* chore(demo): i18n checkbox block

* chore(demo): i18n datalist

* chore(demo): i18n customization component

* chore(demo): i18n dropdown controller

* chore(demo): i18n controller docs

* chore(demo): i18n editor

* chore(demo): i18n error

* chore(demo): i18n expand

* chore(demo): i18n field error

* chore(demo): i18n filter

* chore(demo): i18n group

* chore(demo): i18n hosted dropdown

* chore(demo): i18n input

* chore(demo): i18n input cards

* chore(demo): i18n input copy

* chore(demo): i18n input date and count

* chore(demo): i18n input date range

* chore(demo): i18n input date time

* chore(demo): i18n input file

* chore(demo): i18n input inline

* chore(demo): i18n input month and month range

* chore(demo): i18n input number

* chore(demo): i18n input password

* chore(demo): i18n input phone

* chore(demo): i18n input phone international

* chore(demo): i18n input range

* chore(demo): i18n input slider

* chore(demo): i18n input tag

* chore(demo): i18n input time

* chore(demo): i18n island

* chore(demo): i18n island 2

* chore(demo): i18n label

* chore(demo): i18n line clamp

* chore(demo): i18n link

* chore(demo): i18n loader

* chore(demo): i18n marker icon

* chore(demo): i18n mobile calendar

* chore(demo): i18n mobile dialogs

* chore(demo): i18n money

* chore(demo): i18n multi select

* chore(demo): i18n notification

* chore(demo): i18n pagination

* chore(demo): i18n primitive checkbox

* chore(demo): i18n primitive textfield

* chore(demo): i18n pull to refresh

* chore(demo): i18n radio block

* chore(demo): i18n radio list

* chore(demo): i18n range

* chore(demo): i18n scrollbar

* chore(demo): i18n select

* chore(demo): i18n slider

* chore(demo): i18n stepper

* chore(demo): i18n svg

* chore(demo): i18n tabs

* chore(demo): i18n tag

* chore(demo): i18n text area

* chore(demo): i18n theme switcher

* chore(demo): i18n toggle

* chore(demo): i18n toolbar

* chore(demo): i18n tooltip

* chore(demo): i18n decorators

* chore(demo): i18n pipe

* chore(demo): i18n dialogs

* chore(demo): i18n notifications

* chore(demo): i18n scroll and svg

* chore(demo): i18n table bar

* chore(demo): i18n tables

* chore(demo): i18n utils

* chore(demo): i18n abstract

* chore(demo): i18n pages update

* chore(demo): i18n axes

* chore(demo): i18n bar

* chore(demo): i18n bar chart

* chore(demo): i18n bar set

* chore(demo): i18n legend item

* chore(demo): i18n line

* chore(demo): i18n line days chart

* chore(demo): i18n pie and ring chart

* chore(demo): i18n pie touchable, validator

* chore(demo): i18n ripple, textfield controller

* chore(demo): i18n present

* chore(demo): i18n pointer hint

* chore(demo): i18n mode

* chore(demo): i18n active zone

* chore(demo): i18n autofocus

* chore(demo): i18n color

* chore(demo): i18n dropdown

* chore(demo): i18n dropdown controller

* chore(demo): i18n dropdown selection

* chore(demo): i18n elastic sticky

* chore(demo): i18n element

* chore(demo): i18n highlight

* chore(demo): i18n hint

* chore(demo): i18n hint controller

* chore(demo): i18n lazy loading

* chore(demo): i18n let

* chore(demo): i18n manual hint

* chore(demo): i18n media

* chore(all): i18n some russian comments

* chore(demo): remove svg instructions

* chore(package-lock): reinstall

* chore(demo): fix иванова ивана

* feat(core): `TuiBrigthness` is now type; dark -> onLight, light -> onDark (#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

* feat(demo): some translation fixes (#68)

* feat(demo): some translation fixes

* feat(demo): more translation fixes

Co-authored-by: Alex Inkin <alexander@inkin.ru>

angular.json

@@ -467,6 +467,12 @@
             "projectType": "application",
             "prefix": "app",
             "schematics": {},
+            "i18n": {
+                "sourceLocale": "en-US",
+                "locales": {
+                    "ru": "projects/demo/src/locale/messages.ru.xlf"
+                }
+            },
             "architect": {
                 "build": {
                     "builder": "@angular-devkit/build-angular:browser",
@@ -572,6 +578,9 @@
                                     "with": "public/projects/demo/src/viewEncapsulation.shadow.ts"
                                 }
                             ]
+                        },
+                        "ru": {
+                            "localize": ["ru"]
                         }
                     }
                 },
@@ -591,10 +600,13 @@
                             "hmr": true
                         },
                         "def": {
-                            "browserTarget": "proprietary-demo:build:def"
+                            "browserTarget": "demo:build:def"
                         },
                         "shadow": {
-                            "browserTarget": "proprietary-demo:build:shadow"
+                            "browserTarget": "demo:build:shadow"
+                        },
+                        "ru": {
+                            "browserTarget": "demo:build:ru"
                         }
                     }
                 },

package.json

@@ -4,13 +4,15 @@
     "description": "Taiga UI by Tinkoff is a set of components, services, directives and other tools to build high quality UI using modern Angular framework",
     "scripts": {
         "start": "ng serve",
+        "start:ru": "ng serve --configuration ru",
         "start:default": "ng serve --configuration def",
         "start:shadow": "ng serve --configuration shadow",
         "start:hmr": "ng serve --configuration hmr",
         "start:aot": "node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng serve --configuration production",
         "start:ssr": "node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng run demo:serve-ssr",
         "build:ssr": "ng build --prod && ng run demo:server:production",
         "prerender": "ng run demo:prerender",
+        "i18n": "ng xi18n --output-path src/locale",
         "*** Workflow ***": "",
         "test": "ng test --browsers=ChromeHeadless --code-coverage=true --",
         "lint": "ng lint",
@@ -55,6 +57,7 @@
         "@angular/compiler": "~9.1.12",
         "@angular/core": "~9.1.12",
         "@angular/forms": "~9.1.12",
+        "@angular/localize": "^9.1.12",
         "@angular/platform-browser": "~9.1.12",
         "@angular/platform-browser-dynamic": "~9.1.12",
         "@angular/platform-server": "^9.1.12",
@@ -69,7 +72,7 @@
         "@tinkoff/angular-contenteditable-accessor": "1.1.0",
         "@tinkoff/ng-dompurify": "3.0.0",
         "@tinkoff/ng-event-plugins": "2.0.0",
-        "@tinkoff/ng-polymorpheus": "2.1.0",
+        "@tinkoff/ng-polymorpheus": "3.0.0",
         "angular2-text-mask": "9.0.0",
         "classlist.js": "^1.1.20150312",
         "core-js": "^2.6.9",

projects/addon-charts/components/axes/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/bar-chart/bar-chart.template.html

@@ -21,10 +21,11 @@
         ></tui-bar-set>
     </div>
     <ng-template #hint="polymorpheus" polymorpheus>
-        <polymorpheus-outlet
+        <div
+            polymorpheus-outlet
             class="text"
             [content]="hintContent"
             [context]="getContentContext(index)"
-        ></polymorpheus-outlet>
+        ></div>
     </ng-template>
 </div>

projects/addon-charts/components/bar-chart/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/bar-set/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/components/bar/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/legend-item/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/components/line-chart/line-chart.template.html

@@ -72,11 +72,12 @@
                 [style.bottom.%]="getBottom(point[1])"
             ></div>
             <ng-template #hint>
-                <polymorpheus-outlet
+                <div
+                    polymorpheus-outlet
                     class="text"
                     [content]="computedHint"
                     [context]="getContentContext(point)"
-                ></polymorpheus-outlet>
+                ></div>
             </ng-template>
         </ng-container>
     </ng-container>

projects/addon-charts/components/line-chart/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/line-days-chart/line-days-chart.template.html

@@ -14,8 +14,9 @@
     [xStringify]="xStringify ? daysStringify : null"
 ></tui-line-chart>
 <ng-template #hint let-point>
-    <polymorpheus-outlet
+    <div
+        polymorpheus-outlet
         [content]="hintContent"
         [context]="getHintContext(point[0], value)"
-    ></polymorpheus-outlet>
+    ></div>
 </ng-template>

projects/addon-charts/components/line-days-chart/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/pie-chart/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/pie-chart/pie-chart.template.html

@@ -41,9 +41,10 @@
     </g>
 </svg>
 <ng-template #template let-index>
-    <polymorpheus-outlet
+    <div
+        polymorpheus-outlet
         class="text"
         [content]="hintContent"
         [context]="getContentContext(index)"
-    ></polymorpheus-outlet>
+    ></div>
 </ng-template>

projects/addon-charts/components/ring-chart/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-charts/components/ring-chart/ring-chart.template.html

@@ -1,10 +1,11 @@
 <div *ngIf="hasContent" class="content">
-    <polymorpheus-outlet
+    <div
+        polymorpheus-outlet
         class="wrapper"
         automation-id="tui-ring-chart__content"
         [content]="content"
         [context]="contentContext"
-    ></polymorpheus-outlet>
+    ></div>
 </div>
 
 <tui-pie-chart

projects/addon-charts/constants/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/enums/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/interfaces/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/package.json

@@ -16,11 +16,11 @@
     "peerDependencies": {
         "@angular/common": ">=6.0.0",
         "@angular/core": ">=6.0.0",
-        "@tinkoff/ng-polymorpheus": ">=2.0.0",
+        "@tinkoff/ng-polymorpheus": ">=3.0.0",
         "@taiga-ui/cdk": "1.6.5",
         "@taiga-ui/core": "1.6.5"
     },
     "devDependencies": {
         "@taiga-ui/core": "1.6.5"
     }
-}
+}

projects/addon-charts/types/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-charts/utils/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/components/card/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/input-CVC/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/input-card-grouped/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/input-card/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/input-expire/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/money/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/components/package.json

@@ -7,4 +7,4 @@
             ]
         }
     }
-}
+}

projects/addon-commerce/constants/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/enums/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/interfaces/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/package.json

@@ -17,7 +17,7 @@
         "@angular/common": ">=6.0.0",
         "@angular/core": ">=6.0.0",
         "@angular/forms": ">=6.0.0",
-        "@tinkoff/ng-polymorpheus": ">=2.0.0",
+        "@tinkoff/ng-polymorpheus": ">=3.0.0",
         "@taiga-ui/cdk": "1.6.5",
         "@taiga-ui/core": "1.6.5",
         "angular2-text-mask": "9.0.0",
@@ -26,4 +26,4 @@
     "devDependencies": {
         "@taiga-ui/core": "1.6.5"
     }
-}
+}

projects/addon-commerce/pipes/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/tokens/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/types/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/utils/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-commerce/validators/package.json

@@ -4,4 +4,4 @@
             "entryFile": "index.ts"
         }
     }
-}
+}

projects/addon-doc/package.json

@@ -20,7 +20,7 @@
         "@angular/forms": ">=6.0.0",
         "@angular/router": ">=6.0.0",
         "@angular-devkit/schematics": "^8.3.21",
-        "@tinkoff/ng-polymorpheus": ">=2.0.0",
+        "@tinkoff/ng-polymorpheus": ">=3.0.0",
         "@taiga-ui/cdk": "1.6.5",
         "@taiga-ui/core": "1.6.5",
         "@taiga-ui/kit": "1.6.5",