Unable to import external module: Clarity Module

[guntisravani]

Issue type

I'm submitting a (check one):
[ ] Bug report
[ ] Feature request
[ ] Regression (something that used to work, but stopped working in a newer version)
[X] Support request
[ ] Documentation issue or request

Prerequisites

Before posting, make sure you do the following (check all):
[ ] Confirm you are using the latest versions of all necessary packages (or if not, explain why not)
[ ] Search GitHub for a similar issue or PR
[ ] If submitting a Support request, also search [Stack Overflow][stack-overflow] for similar issues
Note: Please cross-post GitHub support requests to [Stack Overflow][stack-overflow], and include a link in your GitHub issue to your Stack Overflow question. We do currently respond to support requests on GitHub, but we eventually expect to stop, and will then refer all support questions exclusively to Stack Overflow.

Current behavior

Currently am using clarity module to develop my Web UI. How can I include Clarity module into Angular form Schema.
I imported as shown below in app.module.ts:
ClarityModule,
JsonSchemaFormModule.forRoot(ClarityModule)

But its gives me error saying:
compiler.js:466 Uncaught Error: Encountered undefined provider! Usually this means you have a circular dependencies (might be caused by using 'barrel' index.ts files.
at syntaxError (compiler.js:466)
at eval (compiler.js:15608)
at Array.forEach ()
at CompileMetadataResolver._getProvidersMetadata (compiler.js:15593)
at eval (compiler.js:15081)
at Array.forEach ()
at CompileMetadataResolver.getNgModuleMetadata (compiler.js:15072)
at JitCompiler._loadModules (compiler.js:33542)
at JitCompiler._compileModuleAndComponents (compiler.js:33503)
at JitCompiler.compileModuleAsync (compiler.js:33419)

Expected behavior

Should load the module successfully.

IMPORTANT: How can we reproduce your problem?

app.module.ts:
import {JsonSchemaFormModule, Bootstrap4FrameworkModule } from 'angular2-json-schema-form';
import { ClarityModule } from '@clr/angular';

@NgModule({
Bootstrap4FrameworkModule,
JsonSchemaFormModule.forRoot(ClarityModule)
});

component.ts:
customFramework = {
framework: ClarityModule
}

html:
<clr-wizard [(clrWizardOpen)]="openTriggerTestbed" #wizardlg clrWizardSize="lg" >

EXAMPLE
Testbed

<json-schema-form
[schema]="exampleSchema"
[data]="example"
(onSubmit)="exampleOnSubmitFn($event)">