-
Notifications
You must be signed in to change notification settings - Fork 474
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
chore(demo): stackblitz upgrade (example with many files) (#673)
* chore(demo): stackblitz upgrade (example with many files) * chore(demo): new classes to parse typescipt files raw content * chore(demo): `stackblitz` fix dialog component example * chore(demo): fix stackblitz examples with angular localize * feat(addon-doc): `TuiDocExampleComponent` change `tui-tabs` to `tui-tabs-with-more` * chore(addon-doc): `Example` component small style refactor * chore(demo): fix after resolving conflicts * chore(demo): refactor after review * chore(demo): `isMainComponentFile` => `isPrimaryComponentFile` * chore(demo): `TsFileModuleParser` code style change
- Loading branch information
1 parent
f467919
commit fdb1c69
Showing
25 changed files
with
362 additions
and
149 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| export * from './ts-file.parser'; | ||
| export * from './ts-file-module.parser'; | ||
| export * from './ts-file-component.parser'; |
22 changes: 22 additions & 0 deletions
22
projects/demo/src/modules/app/classes/ts-file-component.parser.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| import {TsFileParser} from './ts-file.parser'; | ||
|
|
||
| const SELECTOR_REGEXP = /(?<=selector:\s['"])(.*)(?=['"])/gi; | ||
| const TEMPLATE_URL_REGEXP = /(?<=templateUrl:\s['"])(.*)(?=['"])/gi; | ||
| const STYLE_URLS_REGEXP = /(?<=styleUrls:\s)(\[.*\])/gi; | ||
|
|
||
| export class TsFileComponentParser extends TsFileParser { | ||
| set selector(newSelector: string) { | ||
| this.rawFileContent = this.rawFileContent.replace(SELECTOR_REGEXP, newSelector); | ||
| } | ||
|
|
||
| set templateUrl(newUrl: string) { | ||
| this.rawFileContent = this.rawFileContent.replace(TEMPLATE_URL_REGEXP, newUrl); | ||
| } | ||
|
|
||
| set styleUrls(newUrls: string[] | readonly string[]) { | ||
| this.rawFileContent = this.rawFileContent.replace( | ||
| STYLE_URLS_REGEXP, | ||
| JSON.stringify(newUrls), | ||
| ); | ||
| } | ||
| } |
23 changes: 23 additions & 0 deletions
23
projects/demo/src/modules/app/classes/ts-file-module.parser.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import {TsFileParser} from './ts-file.parser'; | ||
|
|
||
| const DECLARATIONS_REG_EXP = /(?<=declarations:\s\[)(.*)(?=\])/gi; | ||
|
|
||
| export class TsFileModuleParser extends TsFileParser { | ||
| addDeclaration(entity: string): void { | ||
| this.rawFileContent = this.rawFileContent.replace( | ||
| 'declarations: [', | ||
| `declarations: [${entity}, `, | ||
| ); | ||
| } | ||
|
|
||
| addModuleImport(entity: string): void { | ||
| this.rawFileContent = this.rawFileContent.replace( | ||
| 'imports: [', | ||
| `imports: [\n${entity}, `, | ||
| ); | ||
| } | ||
|
|
||
| hasDeclarationEntity(entity: string): boolean { | ||
| return (this.rawFileContent.match(DECLARATIONS_REG_EXP) || '').includes(entity); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| const CLASS_NAME_REGEXP = /(?<=export class\s)(\w*)/gi; | ||
|
|
||
| export class TsFileParser { | ||
| get className(): string { | ||
| const [className] = this.rawFileContent.match(CLASS_NAME_REGEXP) || ['']; | ||
|
|
||
| return className; | ||
| } | ||
|
|
||
| set className(newClassName: string) { | ||
| this.rawFileContent = this.rawFileContent.replace( | ||
| CLASS_NAME_REGEXP, | ||
| newClassName, | ||
| ); | ||
| } | ||
|
|
||
| get hasNgModule(): boolean { | ||
| return this.rawFileContent.includes('@NgModule'); | ||
| } | ||
|
|
||
| get hasNgComponent(): boolean { | ||
| return this.rawFileContent.includes('@Component'); | ||
| } | ||
|
|
||
| constructor(protected rawFileContent: string) { | ||
| const classesInside = rawFileContent.match(CLASS_NAME_REGEXP) || []; | ||
|
|
||
| if (classesInside.length > 1) { | ||
| throw new Error('TsFileParser: 1 component/module per ts-file'); | ||
| } | ||
| } | ||
|
|
||
| addImport(entity: string, packageOrPath: string): void { | ||
| const fromName = packageOrPath.replace('.ts', ''); | ||
|
|
||
| this.rawFileContent = this.rawFileContent.includes(fromName) | ||
| ? this.addIntoExistingImport(entity, fromName) | ||
| : `import {${entity}} from '${fromName}';\n${this.rawFileContent};`; | ||
| } | ||
|
|
||
| toString(): string { | ||
| return this.rawFileContent; | ||
| } | ||
|
|
||
| private addIntoExistingImport(entity: string, packageName: string): string { | ||
| const packageImportsRegex = new RegExp( | ||
| `(?:import\\s?\\{\\r?\\n?)(?:(?:.*),\\r?\\n?)*?(?:.*?)\\r?\\n?} from (?:'|")${packageName}(?:'|");`, | ||
| 'gm', | ||
| ); | ||
|
|
||
| return this.rawFileContent.replace(packageImportsRegex, parsed => { | ||
| return parsed.replace('{', `{${entity}, `); | ||
| }); | ||
| } | ||
| } |
1 change: 1 addition & 0 deletions
1
projects/demo/src/modules/app/stackblitz/project-files/src/polyfills.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1,2 @@ | ||
| import '@angular/localize/init'; | ||
| import 'zone.js/dist/zone'; |
33 changes: 33 additions & 0 deletions
33
projects/demo/src/modules/app/stackblitz/stackblitz-deps.constants.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| export const STACKBLITZ_DEPS: Record<string, string> = { | ||
| '@angular/cdk': '*', | ||
| '@angular/core': '*', | ||
| '@angular/common': '*', | ||
| '@angular/compiler': '*', | ||
| '@angular/forms': '*', | ||
| '@angular/localize': '*', | ||
| '@angular/platform-browser': '*', | ||
| '@angular/platform-browser-dynamic': '*', | ||
| '@angular/animations': '*', | ||
| '@angular/router': '*', | ||
| '@taiga-ui/cdk': '*', | ||
| '@taiga-ui/i18n': '*', | ||
| '@taiga-ui/core': '*', | ||
| '@taiga-ui/kit': '*', | ||
| '@taiga-ui/icons': '*', | ||
| '@taiga-ui/addon-charts': '*', | ||
| '@taiga-ui/addon-commerce': '*', | ||
| '@taiga-ui/addon-mobile': '*', | ||
| '@taiga-ui/addon-table': '*', | ||
| '@taiga-ui/addon-tablebars': '*', | ||
| '@taiga-ui/addon-editor': '*', | ||
| '@tinkoff/ng-dompurify': '*', | ||
| '@tinkoff/ng-polymorpheus': '3.1.8', | ||
| '@ng-web-apis/common': '*', | ||
| '@tinkoff/ng-event-plugins': '*', | ||
| '@ng-web-apis/intersection-observer': '*', | ||
| '@ng-web-apis/mutation-observer': '*', | ||
| 'angular2-text-mask': '*', | ||
| dompurify: '*', | ||
| '@types/dompurify': '*', | ||
| 'prosemirror-state': '*', | ||
| }; |
Oops, something went wrong.