Fix a routerLink

Author: ViktorKukurba

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-dynamic-components",
-  "version": "15.1.1",
+  "version": "15.1.2",
   "description": "NGX Dynamic Components is a configuration based dynamic components library for Angular. That allows you to rapidly create dynamic forms or any other mobile-friendly web layouts.",
   "author": "FalconSoft Ltd",
   "repository": {

projects/bootstrap/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/bootstrap",
-  "version": "15.1.1",
+  "version": "15.1.2",
   "private": false,
   "description": "@ngx-dynamic-components/bootstrap is Angular 7+ library what contains a bootstrap interfaces to build a configuration driven web pages and workflows.",
   "author": "FalconSoft Ltd <[email protected]>",

projects/bootstrap/src/lib/components/input-typeahead/input-typeahead.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, HostBinding } from '@angular/core';
 import {
   BindingProperties, propDescription, PropertyCategories, OptionValue,
   UIModel, ComponentDescriptor, Categories, AttributesMap, XMLResult, BaseUIComponent,
@@ -20,6 +20,7 @@ import example from './input-typeahead.examples';
       [placeholder]="properties.placeholder ?? ''"
       [typeaheadOptionField]="properties.typeaheadOptionField ?? 'label'"
       [typeaheadMultipleSearch]="properties.multiple"
+      [class]="properties.class"
       (input)="onInput($event)"
       (change)="onSelect($event)"/>
     `,
@@ -32,6 +33,7 @@ import example from './input-typeahead.examples';
 })
 // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle
 export class InputTypeaheadComponent extends BaseUIComponent<InputTypeaheadProperties> {
+  @HostBinding('attr.class') wrapperClass = null;
   searchText$ = new Subject<string | null>();
   loading = false;
   suggestions$ = new Subject<OptionValue[]>();

projects/bootstrap/src/lib/components/input-typeahead/input-typeahead.examples.ts

@@ -6,7 +6,7 @@ export const example2: ComponentExample<UIModel<InputTypeaheadProperties>> = {
     <div class="flex-column">
       <div class="form-group">
         <label class="col-form-label" width="60px">Type text</label>
-        <input-typeahead width="300px" itemsSource="$.list" binding="$.selected"></input-typeahead>
+        <input-typeahead class="form-control" width="300px" itemsSource="$.list" binding="$.selected"></input-typeahead>
       </div>
     </div>
   `,

projects/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/core",
-  "version": "15.1.1",
+  "version": "15.1.2",
   "private": false,
   "description": "@ngx-dynamic-components/core is Angular 7+ library what contains a core interfaces to build a configuration driven web pages and workflows.",
   "author": "FalconSoft Ltd <[email protected]>",

projects/core/src/lib/html-elements/a/a.component.ts

@@ -137,6 +137,17 @@ export const example: ComponentExample<UIModel<LinkProperties>> = {
   dataModel: {}
 };
 
+export const example2: ComponentExample<UIModel<LinkProperties>> = {
+  title: 'Basic router link',
+  uiModel: `
+  <section class="row align-items-center m-1">
+    <a title="Examples link" class="btn btn-link mr-2"
+    routerLink="/examples/contact-us">Examples: Contact us</a>
+  </section>
+  `,
+  dataModel: {}
+};
+
 type AComponentConstrutor = new () => AComponent;
 
 type LinkPropertiesConstrutor = new () => LinkProperties;
@@ -149,7 +160,7 @@ export const aDescriptor: ComponentDescriptor<AComponentConstrutor, LinkProperti
   description: 'A component',
   itemProperties: LinkProperties,
   component: AComponent,
-  example,
+  example: [example, example2],
   parseUIModel: (xmlRes: XMLResult) => {
     const uiModel = parseHTMLUIModel(xmlRes);
     if (xmlRes.attrs.routerLink) {

projects/core/src/lib/utils/renderer.ts

@@ -26,7 +26,7 @@ export function createComponent(
     let component: BaseDynamicComponent;
     if (descriptor.category === Categories.HTML) {
       const baseHtml = componentClass as any;
-      component = new baseHtml(containerRef, parentComponent.injector);
+      component = new baseHtml(parentComponent.injector);
       component.dataModel = dataModel;
       component.uiModel = uiModel;
       component.create(containerRef.element.nativeElement);

projects/tools/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-dynamic-components/tools",
-  "version": "15.1.1",
+  "version": "15.1.2",
   "private": false,
   "description": "@ngx-dynamic-components/tools is Angular 7+ library what contains a core interfaces to build a configuration driven web pages.",
   "author": "FalconSoft Ltd <[email protected]>",