The demo app generates wrong config about ngx-gallery HOT 4 CLOSED

I think I forgot to add it to the docs

import { GalleryModule, GalleryConfig } from 'ng-gallery';

from ngx-gallery.

well, I passed some config from online generator and now I am getting also strange error, but I it works when config is empty "export config : GalleryConfig = {} " mybe I am missing something? I tryed the same as you suggested

export const config : GalleryConfig = {
"gestures": true,
"style": {
"width": "100%",
"height": "100%",
"background": "#121519"
},
"navigation": null,
"loader": null,
"description": {
"position": "bottom",
"overlay": false,
"text": true,
"counter": false,
"style": {
"backgroundColor": "rgba(0, 0, 0, 0.8)"
}
},
"player": {
"autoplay": true,
"interval": 3000,
"progress": false,
"position": "bottom"
},
"thumbnails": {
"width": 120,
"height": 90,
"position": "bottom",
"margin": 20
},
"lightbox": {
"backdropClass": "g-backdrop",
"panelClass": "g-overlay",
"hasBackdrop": true
},
"imageSize": "contain",
"bullets": false,
"className": "fluid"
}

ERROR in src/app/app.module.ts(51,5): error TS2322: Type '{ "gestures": true; "style": { "width": string; "height": string; "background": string; }; "navig...' is not assignable to type 'GalleryConfig'.
Types of property 'thumbnails' are incompatible.
Type '{ "width": number; "height": number; "position": string; "margin": number; }' is not assignable to type 'GalleryThumbConfig'.
Object literal may only specify known properties, and '"margin"' does not exist in type 'GalleryThumbCon

from ngx-gallery.

Remove the margin property from the thumbnail, the current generator has this bug

from ngx-gallery.

After I remove margin property from thumbnail, it seems there are more bugs
{
"gestures": true,
"style": {
"width": "900px",
"height": "500px",
"background": "#121519"
},
"navigation": {},
"loader": {
"icon": "data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='135' height='140' fill='%23fff'%3E%3Crect width='15' height='120' y='10' rx='6'%3E%3Canimate attributeName='height' begin='0.5s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite'/%3E%3Canimate attributeName='y' begin='0.5s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect width='15' height='120' x='30' y='10' rx='6'%3E%3Canimate attributeName='height' begin='0.25s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite'/%3E%3Canimate attributeName='y' begin='0.25s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect width='15' height='140' x='60' rx='6'%3E%3Canimate attributeName='height' begin='0s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite'/%3E%3Canimate attributeName='y' begin='0s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect width='15' height='120' x='90' y='10' rx='6'%3E%3Canimate attributeName='height' begin='0.25s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite'/%3E%3Canimate attributeName='y' begin='0.25s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect width='15' height='120' x='120' y='10' rx='6'%3E%3Canimate attributeName='height' begin='0.5s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite'/%3E%3Canimate attributeName='y' begin='0.5s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite'/%3E%3C/rect%3E%3C/svg%3E"
},
"description": {
"position": "bottom",
"overlay": true,
"text": true,
"counter": true,
"style": {
"backgroundColor": "rgba(0 ,0 , 0, 0.8)",
"textShadow": "0 0 2px rgba(0, 0, 0, 0.5)"
}
},
"player": {
"autoplay": false,
"interval": 3000,
"progress": false,
"position": "bottom",
"speed": 3000
},
"thumbnails": {
"width": 100,
"height": 80,
"position": "top"

},
"lightbox": {
"backdropClass": "g-backdrop",
"panelClass": "g-overlay",
"hasBackdrop": true
},
"imageSize": "contain",
"bullets": false,
"className": "fluid"
}

ERROR in src/app/app.module.ts(23,15): error TS2322: Type '{ "gestures": true; "style": {}; "navigation": {}; "loader": { "icon": string; }; "description": ...' is not assignable to type 'GalleryConfig'.
Types of property 'bullets' are incompatible.
Type 'boolean' is not assignable to type 'GalleryBulletConfig'.

from ngx-gallery.