feat(typescript-angular): add support for Angular V18

CI/circle_parallel.sh

@@ -79,6 +79,7 @@ elif [ "$NODE_INDEX" = "3" ]; then
   (cd samples/client/petstore/typescript-angular-v15-provided-in-root && mvn integration-test)
   (cd samples/client/petstore/typescript-angular-v16-provided-in-root && mvn integration-test)
   (cd samples/client/petstore/typescript-angular-v17-provided-in-root && mvn integration-test)
+  (cd samples/client/petstore/typescript-angular-v18-provided-in-root && mvn integration-test)
   (cd samples/openapi3/client/petstore/typescript/builds/default && mvn integration-test)
   (cd samples/openapi3/client/petstore/typescript/tests/default && mvn integration-test)
   (cd samples/openapi3/client/petstore/typescript/builds/jquery && mvn integration-test)

bin/configs/typescript-angular-v18-provided-in-root.yaml

@@ -0,0 +1,7 @@
+generatorName: typescript-angular
+outputDir: samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default
+inputSpec: modules/openapi-generator/src/test/resources/3_0/petstore.yaml
+templateDir: modules/openapi-generator/src/main/resources/typescript-angular
+additionalProperties:
+  ngVersion: 18.0.0
+  supportsES6: true

docs/generators/typescript-angular.md

@@ -11,7 +11,7 @@ title: Documentation for the typescript-angular Generator
 | generator type | CLIENT | |
 | generator language | Typescript | |
 | generator default templating engine | mustache | |
-| helpTxt | Generates a TypeScript Angular (9.x - 17.x) client library. | |
+| helpTxt | Generates a TypeScript Angular (9.x - 18.x) client library. | |
 
 ## CONFIG OPTIONS
 These options may be applied as additional-properties (cli) or configOptions (plugins). Refer to [configuration docs](https://openapi-generator.tech/docs/configuration) for more details.
@@ -32,7 +32,7 @@ These options may be applied as additional-properties (cli) or configOptions (pl
 |modelFileSuffix|The suffix of the file of the generated model (model<suffix>.ts).| |null|
 |modelPropertyNaming|Naming convention for the property: 'camelCase', 'PascalCase', 'snake_case' and 'original', which keeps the original name. Only change it if you provide your own run-time code for (de-)serialization of models| |original|
 |modelSuffix|The suffix of the generated model.| |null|
-|ngVersion|The version of Angular. (At least 9.0.0)| |17.0.0|
+|ngVersion|The version of Angular. (At least 9.0.0)| |18.0.0|
 |npmName|The name under which you want to publish generated npm package. Required to generate a full package| |null|
 |npmRepository|Use this property to set an url your private npmRepo in the package.json| |null|
 |npmVersion|The version of your npm package. If not provided, using the version from the OpenAPI specification file.| |1.0.0|

modules/openapi-generator/src/main/java/org/openapitools/codegen/languages/TypeScriptAngularClientCodegen.java

@@ -77,7 +77,7 @@ public static enum PROVIDED_IN_LEVEL {none, root, any, platform}
     public static final String QUERY_PARAM_OBJECT_FORMAT = "queryParamObjectFormat";
     public static final String USE_SQUARE_BRACKETS_IN_ARRAY_NAMES = "useSquareBracketsInArrayNames";
 
-    protected String ngVersion = "17.0.0";
+    protected String ngVersion = "18.0.0";
     @Getter @Setter
     protected String npmRepository = null;
     @Setter(AccessLevel.PRIVATE) private boolean useSingleRequestParameter = false;
@@ -159,7 +159,7 @@ public String getName() {
 
     @Override
     public String getHelp() {
-        return "Generates a TypeScript Angular (9.x - 17.x) client library.";
+        return "Generates a TypeScript Angular (9.x - 18.x) client library.";
     }
 
     @Override
@@ -294,7 +294,9 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
 
         // Set the typescript version compatible to the Angular version
         // based on https://angular.io/guide/versions#actively-supported-versions
-        if (ngVersion.atLeast("17.0.0")) {
+        if (ngVersion.atLeast("18.0.0")) {
+            additionalProperties.put("tsVersion", ">=5.4.0 <5.5.0");
+        } else if (ngVersion.atLeast("17.0.0")) {
             additionalProperties.put("tsVersion", ">=4.9.3 <5.3.0");
         } else if (ngVersion.atLeast("16.1.0")) {
             additionalProperties.put("tsVersion", ">=4.9.3 <5.2.0");
@@ -319,7 +321,9 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
         }
 
         // Set the rxJS version compatible to the Angular version
-        if (ngVersion.atLeast("17.0.0")) {
+        if (ngVersion.atLeast("18.0.0")) {
+            additionalProperties.put("rxjsVersion", "7.4.0");
+        } else if (ngVersion.atLeast("17.0.0")) {
             additionalProperties.put("rxjsVersion", "7.4.0");
         } else if (ngVersion.atLeast("16.0.0")) {
             additionalProperties.put("rxjsVersion", "7.4.0");
@@ -338,7 +342,11 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
         supportingFiles.add(new SupportingFile("ng-package.mustache", getIndexDirectory(), "ng-package.json"));
 
         // Specific ng-packagr configuration
-        if (ngVersion.atLeast("17.0.0")) {
+        if (ngVersion.atLeast("18.0.0")) {
+            additionalProperties.put("ngPackagrVersion", "18.0.0");
+            // tsTickle is not required and there is no available version compatible with
+            // versions of TypeScript compatible with Angular 18.
+        } else if (ngVersion.atLeast("17.0.0")) {
             additionalProperties.put("ngPackagrVersion", "17.0.3");
             // tsTickle is not required and there is no available version compatible with
             // versions of TypeScript compatible with Angular 17.
@@ -371,7 +379,9 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
         }
 
         // set zone.js version
-        if (ngVersion.atLeast("17.0.0")) {
+        if (ngVersion.atLeast("18.0.0")) {
+            additionalProperties.put("zonejsVersion", "0.14.7");
+        } else if (ngVersion.atLeast("17.0.0")) {
             additionalProperties.put("zonejsVersion", "0.14.0");
         } else if (ngVersion.atLeast("16.0.0")) {
             additionalProperties.put("zonejsVersion", "0.13.0");

samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default/.gitignore

@@ -0,0 +1,4 @@
+wwwroot/*.js
+node_modules
+typings
+dist

samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default/.openapi-generator-ignore

@@ -0,0 +1,23 @@
+# OpenAPI Generator Ignore
+# Generated by openapi-generator https://github.com/openapitools/openapi-generator
+
+# Use this file to prevent files from being overwritten by the generator.
+# The patterns follow closely to .gitignore or .dockerignore.
+
+# As an example, the C# client generator defines ApiClient.cs.
+# You can make changes and tell OpenAPI Generator to ignore just this file by uncommenting the following line:
+#ApiClient.cs
+
+# You can match any string of characters against a directory, file or extension with a single asterisk (*):
+#foo/*/qux
+# The above matches foo/bar/qux and foo/baz/qux, but not foo/bar/baz/qux
+
+# You can recursively match patterns against a directory, file or extension with a double asterisk (**):
+#foo/**/qux
+# This matches foo/bar/qux, foo/baz/qux, and foo/bar/baz/qux
+
+# You can also negate patterns with an exclamation (!).
+# For example, you can ignore all files in a docs folder with the file extension .md:
+#docs/*.md
+# Then explicitly reverse the ignore rule for a single file:
+#!docs/README.md

samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default/.openapi-generator/FILES

@@ -0,0 +1,20 @@
+.gitignore
+README.md
+api.module.ts
+api/api.ts
+api/pet.service.ts
+api/store.service.ts
+api/user.service.ts
+configuration.ts
+encoder.ts
+git_push.sh
+index.ts
+model/apiResponse.ts
+model/category.ts
+model/models.ts
+model/order.ts
+model/pet.ts
+model/tag.ts
+model/user.ts
+param.ts
+variables.ts

samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default/.openapi-generator/VERSION

@@ -0,0 +1 @@
+7.7.0-SNAPSHOT

samples/client/petstore/typescript-angular-v18-provided-in-root/builds/default/README.md

@@ -0,0 +1,226 @@
+## @
+
+### Building
+
+To install the required dependencies and to build the typescript sources run:
+```
+npm install
+npm run build
+```
+
+### publishing
+
+First build the package then run ```npm publish dist``` (don't forget to specify the `dist` folder!)
+
+### consuming
+
+Navigate to the folder of your consuming project and run one of next commands.
+
+_published:_
+
+```
+npm install @ --save
+```
+
+_without publishing (not recommended):_
+
+```
+npm install PATH_TO_GENERATED_PACKAGE/dist.tgz --save
+```
+
+_It's important to take the tgz file, otherwise you'll get trouble with links on windows_
+
+_using `npm link`:_
+
+In PATH_TO_GENERATED_PACKAGE/dist:
+```
+npm link
+```
+
+In your project:
+```
+npm link 
+```
+
+__Note for Windows users:__ The Angular CLI has troubles to use linked npm packages.
+Please refer to this issue https://github.com/angular/angular-cli/issues/8284 for a solution / workaround.
+Published packages are not effected by this issue.
+
+
+#### General usage
+
+In your Angular project:
+
+
+```
+// without configuring providers
+import { ApiModule } from '';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+    imports: [
+        ApiModule,
+        // make sure to import the HttpClientModule in the AppModule only,
+        // see https://github.com/angular/angular/issues/20575
+        HttpClientModule
+    ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers
+import { ApiModule, Configuration, ConfigurationParameters } from '';
+
+export function apiConfigFactory (): Configuration {
+  const params: ConfigurationParameters = {
+    // set configuration parameters here.
+  }
+  return new Configuration(params);
+}
+
+@NgModule({
+    imports: [ ApiModule.forRoot(apiConfigFactory) ],
+    declarations: [ AppComponent ],
+    providers: [],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+// configuring providers with an authentication service that manages your access tokens
+import { ApiModule, Configuration } from '';
+
+@NgModule({
+    imports: [ ApiModule ],
+    declarations: [ AppComponent ],
+    providers: [
+      {
+        provide: Configuration,
+        useFactory: (authService: AuthService) => new Configuration(
+          {
+            basePath: environment.apiUrl,
+            accessToken: authService.getAccessToken.bind(authService)
+          }
+        ),
+        deps: [AuthService],
+        multi: false
+      }
+    ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+```
+import { DefaultApi } from '';
+
+export class AppComponent {
+    constructor(private apiGateway: DefaultApi) { }
+}
+```
+
+Note: The ApiModule is restricted to being instantiated once app wide.
+This is to ensure that all services are treated as singletons.
+
+#### Using multiple OpenAPI files / APIs / ApiModules
+In order to use multiple `ApiModules` generated from different OpenAPI files,
+you can create an alias name when importing the modules
+in order to avoid naming conflicts:
+```
+import { ApiModule } from 'my-api-path';
+import { ApiModule as OtherApiModule } from 'my-other-api-path';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+  imports: [
+    ApiModule,
+    OtherApiModule,
+    // make sure to import the HttpClientModule in the AppModule only,
+    // see https://github.com/angular/angular/issues/20575
+    HttpClientModule
+  ]
+})
+export class AppModule {
+
+}
+```
+
+
+### Set service base path
+If different than the generated base path, during app bootstrap, you can provide the base path to your service.
+
+```
+import { BASE_PATH } from '';
+
+bootstrap(AppComponent, [
+    { provide: BASE_PATH, useValue: 'https://your-web-service.com' },
+]);
+```
+or
+
+```
+import { BASE_PATH } from '';
+
+@NgModule({
+    imports: [],
+    declarations: [ AppComponent ],
+    providers: [ provide: BASE_PATH, useValue: 'https://your-web-service.com' ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+```
+
+
+#### Using @angular/cli
+First extend your `src/environments/*.ts` files by adding the corresponding base path:
+
+```
+export const environment = {
+  production: false,
+  API_BASE_PATH: 'http://127.0.0.1:8080'
+};
+```
+
+In the src/app/app.module.ts:
+```
+import { BASE_PATH } from '';
+import { environment } from '../environments/environment';
+
+@NgModule({
+  declarations: [
+    AppComponent
+  ],
+  imports: [ ],
+  providers: [{ provide: BASE_PATH, useValue: environment.API_BASE_PATH }],
+  bootstrap: [ AppComponent ]
+})
+export class AppModule { }
+```
+
+### Customizing path parameter encoding
+
+Without further customization, only [path-parameters][parameter-locations-url] of [style][style-values-url] 'simple'
+and Dates for format 'date-time' are encoded correctly.
+
+Other styles (e.g. "matrix") are not that easy to encode
+and thus are best delegated to other libraries (e.g.: [@honoluluhenk/http-param-expander]).
+
+To implement your own parameter encoding (or call another library),
+pass an arrow-function or method-reference to the `encodeParam` property of the Configuration-object
+(see [General Usage](#general-usage) above).
+
+Example value for use in your Configuration-Provider:
+```typescript
+new Configuration({
+    encodeParam: (param: Param) => myFancyParamEncoder(param),
+})
+```
+
+[parameter-locations-url]: https://github.com/OAI/OpenAPI-Specification/blob/main/versions/3.1.0.md#parameter-locations
+[style-values-url]: https://github.com/OAI/OpenAPI-Specification/blob/main/versions/3.1.0.md#style-values
+[@honoluluhenk/http-param-expander]: https://www.npmjs.com/package/@honoluluhenk/http-param-expander