​
Android SDK migration guide

​
Initialization config changes

A new configuration parameter named locale was added in order to improve formatting the dates, numbers and currencies.

When the SDK initialization happens through the FlowxSdkApi.getInstance().init(...) method, the argument must be included inside the config: SdkConfig parameter value:

FlowxSdkApi.getInstance().init(
    ...
    config = SdkConfig(
        baseUrl = "URL to FlowX backend",
        imageBaseUrl = "URL to FlowX CMS Media Library",
        enginePath = "some_path",
        language = "en",
        locale = Locale.getDefault(), // e.g. Locale("en", "US"), Locale("fr", "CA")
        validators = mapOf("exact_25_in_length" to { it.length == 25 }),
        enableLog = false,
    ),
    ...
)

​
Changes when starting a Flowx process

Two new parameters were added:

NameDescriptionTypeRequirement
projectIdThe id of the project containing the process to be startedStringMandatory
onProcessEndedCallback function where you can do additional processing when the started process ends(() -> Unit)?Optional. It defaults to null.
fun startProcess(
    projectId: String,
    processName: String,
    params: JSONObject = JSONObject(),
    isModal: Boolean = false,
    onProcessEnded: (() -> Unit)? = null,
    closeModalFunc: ((processName: String) -> Unit)? = null,
): @Composable () -> Unit

​
Changes when resuming a Flowx process

One new parameter was added:

NameDescriptionTypeRequirement
onProcessEndedCallback function where you can do additional processing when the continued process ends(() -> Unit)?Optional. It defaults to null.
fun continueProcess(
    processUuid: String,
    isModal: Boolean = false,
    onProcessEnded: (() -> Unit)? = null,
    closeModalFunc: ((processName: String) -> Unit)? = null,
): @Composable () -> Unit

​
Changes regarding the implementation of Custom Components

The support for classical Android View system has been dropped.
A Custom Component can now be implemented only by using the Compose UI system.

This means that the CustomViewComponent is now ignored in the internals of the SDK and has been marked as @Deprecated, in order to be completely removed in the next release.

There is no immediate need to update any of the existing components.

​
Public API changes

The changeLanguage method has been updated and renamed to changeLocaleSettings, in order to accommodate the newly added locale config parameter:

fun changeLocaleSettings(locale: Locale, language: String)

​
Library dependencies updates

​
iOS SDK migration guide

​
Initialization config changes

A new configuration parameter, named locale was added in order to improve formatting the dates, numbers and currencies.

The locale needs to be set on the FXConfig.sharedInstance.configure method

FXConfig.sharedInstance.configure { (config) in
    config.locale = "en-US"
    ...
}

​
Changes when starting a process

Two new parameters were added on the 3 available start process methods:

NameDescriptionTypeRequirement
projectIdThe uuid string of the project containing the process to be startedStringMandatory
onProcessEndedCallback function where you can do additional processing when the started process ends(() -> Void)?Optional. It defaults to nil.
func startProcess(projectId: String, 
                  name: String, 
                  params: [String : Any]?, 
                  isModal: Bool = false, 
                  showLoader: Bool = false, 
                  completion: ((UIViewController?) -> Void)?, 
                  onProcessEnded: (() -> Void)? = nil)

​
Changes when resuming a Flowx process

One new parameter was added on the 3 available continue process methods:

NameDescriptionTypeRequirement
onProcessEndedCallback function where you can do additional processing when the started process ends(() -> Void)?Optional. It defaults to nil.
func continueExistingProcess(uuid: String, 
                             name: String, 
                             isModal: Bool = false, 
                             completion: ((UIViewController?) -> Void)? = nil, 
                             onProcessEnded: (() -> Void)? = nil)

​
Updated FXDataSource protocol

A new method has been added to the FXDataSource protocol. Update conformance to protocol by adding the implementation of the new func.

func newProcessStarted(processInstanceUuid: String) {
    
}

​
Public API changes

The changeLanguage method has been updated and renamed to changeLocaleSettings, in order to accommodate the newly added locale config parameter:

func changeLocaleSettings(locale: String?, language: String?)

​
Angular SDK migration guide

​
Upgrading to the new SDK libraries

The Angular SDK node packages have been updated and will use the latest versions Angular (version 19), thus all container apps that want to use the new SDKs should first update the Angular version of the container apps.

In the following we cover the migration guide for a container app from Angular v17 to v19 and the new SDKs.

1

Remove old packages and their explicit dependencies (required dependency packages for new sdks are bundled in the libraries so we don't need)

  • remove material-moment-adapter unless its not used in custom components (usually together with material datepicker) and also the moment package (unless used elsewhere in the project )
npm uninstall @angular/material-moment-adapter
npm uninstall moment
  • remove old FlowX SDK libraries:
npm uninstall @flowx/ui-sdk @flowx/ui-theme @flowx/ui-toolkit
  • in angular.json remove references to old stylesheets:
"./node_modules/@flowx/ui-sdk/src/assets/scss/style.scss"
"./node_modules/paperflow-web-components/src/assets/scss"
"./node_modules/@flowx/ui-sdk/src/assets/scss"
  • remove old FlowX SDKs explicit dependencies. Please check before removing that packages are not used in the container app or custom components.
npm uninstall date-fns event-source-polyfill inputmask ng2-pdfjs-viewer vanillajs-datepicker @ngneat/input-mask deepmerge-ts marked-mangle
  • remove deprecated Angular Flex library (the new sdks don’t use it anymore and the package has been deprecated by the Angular team) unless it is not used in container app or custom components
npm uninstall @angular/flex-layout
2

Update container app to Angular 18

  • Make sure to have the Angular CLI installed at version 18 (check with ng --version)
npm install -g @angular/cli@18
  • Run the Angular update for version 18
ng update @angular/core@18 @angular/cli@18
  • Update Angular CDK or Angular Material
ng update @angular/cdk@18

or, if the container app uses Angular Material, run:

ng update @angular/material@18

  • Optionally, if your project uses other angular packages (ex. NgRx) please run migrations to v18 for each of them before proceeding. You can find details on the libraries documentation pages.

  • Angular has changed the default build path in the dist folder, it now uses a browser folder for the build output. In order to place the output of the build command directly in the dist/[APP_NAME] folder, add the following change in angular.json:

{
  ...
  "architect": {
    ...
    "build": {
      ...
      "options": {
        ...
        "outputPath": {
          "base": "dist/flowx-demo-app",
          "browser": "" <-- add this line
        },
      }
    }
  }
}
3

Update container app to Angular 19

  • Make sure to have the Angular CLI installed at version 19 (check with ng --version)
npm install -g @angular/cli@19
  • Run the Angular update for version 19
ng update @angular/core@19 @angular/cli@19
  • Update Angular CDK or Angular Material
ng update @angular/cdk@19

or, if the container app uses Angular material, run:

ng update @angular/material@19

  • Optionally, if your project uses other Angular packages (ex. NgRx) please run migrations to v19 for each of them before proceeding. You can find details on the libraries documentation pages.

  • Also, it is recommended that you update the target and module settings in the tsconfig.json file to the new version, although be advised that this might require additional changes in the codebase due to new compilation errors that might arise.

{
  ...
  "compilerOptions": {
      ...
      "target": "ES2022",
      "module": "ES2022"
  }
}
4

Install the new FlowX SDK packages

Adding overrides for libraries that have a dependency on Angular version < 19

For some libraries, the required angular version might not be up to date or compatible with the new Angular version. In this case, you can add an override in the package.json file to force the library to use the new Angular version.

  • For example, the ng2-pdfjs-viewer library has a dependency on Angular version 18 and will not work with the installed Angular version 19. To force the library to use the new Angular version, add the following override in the package.json file:
{
  ...
  "overrides": {
    "ng2-pdfjs-viewer": {
      "@angular/common": "^19.0.0",
      "@angular/core": "^19.0.0",
      "ng-packagr": "^19.0.0"
    }
  }
}

Install new packages:

ACTION REQUIRED: Update to the latest version 4.6 to ensure optimal performance and compatibility.

npm install @flowx/core-sdk@5.63.0 @flowx/core-theme@5.63.0 @flowx/angular-sdk@5.63.0 @flowx/angular-theme@5.63.0 @flowx/angular-ui-toolkit@5.62.1
  • Install a type dependency for the SSE library:
npm install --save-dev @types/event-source-polyfill

Each migration requires a ‘clean’ repository state. Make sure to commit all changes before starting the next migration step.

After each Angular update it is recommended you restart your editor or TS Server, to use the new TS version since some import errors might appear.

​
New SDK API changes

​
Renderer SDK component usage

In the Angular SDK, the <flx-process-renderer> component has two new parameters have been introduced: projectInfo and locale. These additions help support localization and project-specific configurations.

NameDescriptionTypeRequirement
projectInfoObject containing an projectId key, which identifies the project of the process to be started{projectId: string}Mandatory
localeProvides region-specific settings for localization.stringMandatory

Add the definitions for these properties in the class file of the component that uses the process renderer component:

projectInfo = { projectId: 'your-project-id' },
locale = 'en-US',

Use these parameters in the template as inputs for the <flx-process-renderer> component:

<flx-process-renderer
  ...
  [projectInfo]="projectInfo"
  [locale]="locale"
/>

​
API changes

Process Renderer:

CategoryOld ApproachNew Approach
Process RendererFlxProcessModule.forRoot({...})FlxProcessModule.withConfig({...})

​
Import path updates

CategoryOld ApproachNew Approach
Import Paths@flowx/ui-sdk@flowx/angular-sdk (or, in some cases @flowx/core-sdk)
@flowx/ui-theme@flowx/angular-theme
@flowx/ui-toolkit@flowx/angular-ui-toolkit
Process Moduleimport {FlxProcessModule} from '@flowx/ui-sdk';import {FlxProcessModule} from @flowx/angular-sdk
Localization Moduleimport {FlxLocalizationModule} from '@flowx/ui-sdk'; Include in module importsimport {FlxLocalizePipe} from '@flowx/angular-sdk'; Remove from module imports
Task Managementimport {FlxTaskManagementModule} from '@flowx/ui-sdk';import {FlxTasksManagementComponent} from '@flowx/angular-sdk';
Client Store Interfaceimport {ClientStoreInterface} from '@flowx/ui-sdk';import {ClientStoreInterface} from '@flowx/core-sdk';

You can also remove the FlxLocalizationModule from any imports arrays in modules, and import the FlxLocalizePipe instead

​
Icon module update

The withExtraIconSet method has been replaced with provideExtraIconSet, which should now be used in the providers array.

@NgModule({
  imports: [
    IconModule,  // Import the IconModule
  ],
  providers: [
    // Use provideExtraIconSet to add your custom icon set
    provideExtraIconSet({
      customIcon1: 'path/to/custom-icon1.svg',
      customIcon2: 'path/to/custom-icon2.svg',
      // Add more icons as needed
    })
  ]
})
export class AppModule {}

​
Custom Interceptors

The new FlowX SDKs do not depend on Angular’s HttpClient to make API calls, so existing interceptors must be adapted to a new format, for Request Interceptos (eg. custom headers) and Response Interceptors (eg. error handling)

For an overview of implementation details, please refer to the respective sections of the renderer documentation for the new API changes.

Custom Interceptors

Was this page helpful?

Suggest editsRaise issue
Deployment guidelines v4.6.0Configuration and migration guide