Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$
Light
Dark
System
Ask  Question

To many traces in vue3


Have you tested this?

/* in IDE /*
Could not find a declaration file for module './theme/app/layouts/demo1.js'. implicitly has an 'any' type.ts-plugin(7016) in import KTLayout

src/theme/core/components/scrollto/scrollto.ts:41:24 - error TS2531: Object is possibly 'null'.

/* while npm run build */

41 KTDom.getElement(this._element.getAttribute('data-scrollto') as string) ||
~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:26:13 - error TS2564: Property '_attributeRoot' has no initializer and is not definitely assigned in the constructor.

26 protected _attributeRoot: string;
~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:27:13 - error TS2564: Property '_eventTriggerState' has no initializer and is not definitely assigned in the constructor.

27 protected _eventTriggerState: boolean;
~~~~~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:28:13 - error TS2564: Property '_lastScrollTop' has no initializer and is not definitely assigned in the constructor.

28 protected _lastScrollTop: number;
~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:29:13 - error TS2564: Property '_releaseElement' has no initializer and is not definitely assigned in the constructor.

29 protected _releaseElement: HTMLElement;
~~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:30:13 - error TS2564: Property '_wrapperElement' has no initializer and is not definitely assigned in the constructor.

30 protected _wrapperElement: HTMLElement;
~~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:38:23 - error TS2345: Argument of type 'KTStickyConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

38 this._buildConfig(config);
~~~~~~

src/theme/core/components/sticky/sticky.ts:41:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

41 this._wrapperElement = this._element.closest('[data-sticky-wrapper]');
~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:41:28 - error TS2531: Object is possibly 'null'.

41 this._wrapperElement = this._element.closest('[data-sticky-wrapper]');
~~~~~~~~~~~~~

src/theme/core/components/sticky/sticky.ts:293:12 - error TS2531: Object is possibly 'null'.

293 return this._element.classList.contains('active');
~~~~~~~~~~~~~

src/theme/core/components/reparent/reparent.ts:31:23 - error TS2345: Argument of type 'KTReparentConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

31 this._buildConfig(config);
~~~~~~

src/theme/core/components/toggle/toggle.ts:19:13 - error TS2564: Property '_targetElement' has no initializer and is not definitely assigned in the constructor.

19 protected _targetElement: HTMLElement;
~~~~~~~~~~~~~~

src/theme/core/components/toggle/toggle.ts:27:23 - error TS2345: Argument of type 'KTToggleConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

27 this._buildConfig(config);
~~~~~~

src/theme/core/components/toggle/toggle.ts:29:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

29 this._targetElement = this._getTargetElement();
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/toggle/toggle.ts:47:24 - error TS2531: Object is possibly 'null'.

47 KTDom.getElement(this._element.getAttribute('data-toggle') as string) ||
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:36:13 - error TS2564: Property '_targetElement' has no initializer and is not definitely assigned in the constructor.

36 protected _targetElement: HTMLElement;
~~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:47:23 - error TS2345: Argument of type 'KTTooltipConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

47 this._buildConfig(config);
~~~~~~

src/theme/core/components/tooltip/tooltip.ts:49:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

49 this._targetElement = this._getTargetElement();
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:59:24 - error TS2531: Object is possibly 'null'.

59 KTDom.getElement(this._element.getAttribute('data-tooltip') as string) ||
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:60:7 - error TS2531: Object is possibly 'null'.

60 this._element.querySelector('.tooltip, .popover, [data-tooltip-content]') ||
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:216:35 - error TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

216 if (parseInt(KTDom.getCssProp(this._element, 'z-index')) > zindex) {
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:217:42 - error TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

217 zindex = parseInt(KTDom.getCssProp(this._element, 'z-index'));
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:220:32 - error TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

220 if (KTDom.getHighestZindex(this._element) > zindex) {
~~~~~~~~~~~~~

src/theme/core/components/tooltip/tooltip.ts:221:38 - error TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

221 zindex =KTDom.getHighestZindex(this._element) + 1;
~~~~~~~~~~~~~

src/theme/core/components/stepper/stepper.ts:26:23 - error TS2345: Argument of type 'KTStepperConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

26 this._buildConfig(config);
~~~~~~

src/theme/core/components/stepper/stepper.ts:80:47 - error TS2345: Argument of type 'string | null' is not assignable to parameter of type 'string | HTMLElement'.

80 const contentElement = KTDom.getElement(element.getAttribute('data-stepper-item'));
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/stepper/stepper.ts:107:5 - error TS2531: Object is possibly 'null'.

107 this._element.querySelectorAll('[data-stepper-item]').forEach((element) => {
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:14:13 - error TS2564: Property '_inputElement' has no initializer and is not definitely assigned in the constructor.

14 protected _inputElement: HTMLInputElement;
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:15:13 - error TS2564: Property '_hiddenElement' has no initializer and is not definitely assigned in the constructor.

15 protected _hiddenElement: HTMLInputElement;
~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:16:13 - error TS2564: Property '_removeElement' has no initializer and is not definitely assigned in the constructor.

16 protected _removeElement: HTMLElement;
~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:17:13 - error TS2564: Property '_previewElement' has no initializer and is not definitely assigned in the constructor.

17 protected _previewElement: HTMLElement;
~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:19:13 - error TS2564: Property '_lastMode' has no initializer and is not definitely assigned in the constructor.

19 protected _lastMode: string;
~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:21:37 - error TS2322: Type 'null' is not assignable to type 'KTImageInputConfigInterface'.

21 constructor(element: HTMLElement, config: KTImageInputConfigInterface = null) {
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:29:5 - error TS2322: Type 'HTMLInputElement | null' is not assignable to type 'HTMLInputElement'.
Type 'null' is not assignable to type 'HTMLInputElement'.

29 this._inputElement = this._element.querySelector('input[type="file"]');
~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:29:26 - error TS2531: Object is possibly 'null'.

29 this._inputElement = this._element.querySelector('input[type="file"]');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:30:5 - error TS2322: Type 'HTMLInputElement | null' is not assignable to type 'HTMLInputElement'.
Type 'null' is not assignable to type 'HTMLInputElement'.

30 this._hiddenElement = this._element.querySelector('input[type="hidden"]');
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:30:27 - error TS2531: Object is possibly 'null'.

30 this._hiddenElement = this._element.querySelector('input[type="hidden"]');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:31:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

31 this._removeElement = this._element.querySelector('[data-image-input-remove]');
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:31:27 - error TS2531: Object is possibly 'null'.

31 this._removeElement = this._element.querySelector('[data-image-input-remove]');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:32:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

32 this._previewElement = this._element.querySelector('.image-input-preview');
~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:32:28 - error TS2531: Object is possibly 'null'.

32 this._previewElement = this._element.querySelector('.image-input-preview');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:39:23 - error TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

39 KTEventHandler.on(this._element, '.image-input-placeholder', 'click', (event: Event) => {
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:68:26 - error TS2531: Object is possibly 'null'.

68 reader.readAsDataURL(this._inputElement.files[0]);
~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:73:5 - error TS2531: Object is possibly 'null'.

73 this._element.classList.add('changed');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:75:5 - error TS2531: Object is possibly 'null'.

75 this._element.classList.remove('empty');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:89:5 - error TS2531: Object is possibly 'null'.

89 this._element.classList.remove('empty');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:90:5 - error TS2531: Object is possibly 'null'.

90 this._element.classList.remove('changed');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:99:9 - error TS2531: Object is possibly 'null'.

99 this._element.classList.add('empty');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:110:7 - error TS2531: Object is possibly 'null'.

110 this._element.classList.add('empty');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:122:9 - error TS2531: Object is possibly 'null'.

122 this._element.classList.add('empty');
~~~~~~~~~~~~~

src/theme/core/components/image-input/image-input.ts:142:7 - error TS2531: Object is possibly 'null'.

142 this._element.classList.add('empty');
~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:5:1 - error TS6133: 'KTDom' is declared but its value is never read.

5 import KTDom from '../../helpers/dom';
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:15:13 - error TS2564: Property '_triggerElement' has no initializer and is not definitely assigned in the constructor.

15 protected _triggerElement: HTMLElement;
~~~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:16:13 - error TS2564: Property '_inputElement' has no initializer and is not definitely assigned in the constructor.

16 protected _inputElement: HTMLInputElement;
~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:24:23 - error TS2345: Argument of type 'KTTogglePasswordConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

24 this._buildConfig(config);
~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:26:5 - error TS2322: Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

26 this._triggerElement = this._element.querySelector('[data-toggle-password-trigger]');
~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:26:28 - error TS2531: Object is possibly 'null'.

26 this._triggerElement = this._element.querySelector('[data-toggle-password-trigger]');
~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:27:5 - error TS2322: Type 'HTMLInputElement | null' is not assignable to type 'HTMLInputElement'.
Type 'null' is not assignable to type 'HTMLInputElement'.

27 this._inputElement = this._element.querySelector('input[type="password"]');
~~~~~~~~~~~~~~~~~~

src/theme/core/components/toggle-password/toggle-password.ts:27:26 - error TS2531: Object is possibly 'null'.

27 this._inputElement = this._element.querySelector('input[type="password"]');
~~~~~~~~~~~~~

src/theme/core/components/theme/theme.ts:6:1 - error TS6133: 'KTDom' is declared but its value is never read.

6 import { KTDom } from '../../index.spa';
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/theme/theme.ts:27:23 - error TS2345: Argument of type 'KTThemeConfigInterface | null' is not assignable to parameter of type 'object | undefined'.
Type 'null' is not assignable to type 'object | undefined'.

27 this._buildConfig(config);
~~~~~~

src/theme/core/components/theme/theme.ts:39:70 - error TS2345: Argument of type '(event: Event, target: HTMLElement) => void' is not assignable to parameter of type 'KTCallableType'.
Types of parameters 'event' and 'event' are incompatible.
Type 'Event | undefined' is not assignable to type 'Event'.
Type 'undefined' is not assignable to type 'Event'.

39 KTEventHandler.on(this._element, '[data-theme-switch]', 'click', (event: Event, target: HTMLElement) => {
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:20:21 - error TS2564: Property '_config' has no initializer and is not definitely assigned in the constructor.

20 protected override _config: KTDataTableConfigInterface;
~~~~~~~

src/theme/core/components/datatable/datatable.ts:20:21 - error TS2612: Property '_config' will overwrite the base property in 'KTComponent'. If this is intentional, add an initializer. Otherwise, add a 'declare' modifier or remove the redundant declaration.

20 protected override _config: KTDataTableConfigInterface;
~~~~~~~

src/theme/core/components/datatable/datatable.ts:21:21 - error TS2564: Property '_defaultConfig' has no initializer and is not definitely assigned in the constructor.

21 protected override _defaultConfig: KTDataTableConfigInterface;
~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:21:21 - error TS2612: Property '_defaultConfig' will overwrite the base property in 'KTComponent'. If this is intentional, add an initializer. Otherwise, add a 'declare' modifier or remove the redundant declaration.

21 protected override _defaultConfig: KTDataTableConfigInterface;
~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:23:10 - error TS2564: Property '_tableElement' has no initializer and is not definitely assigned in the constructor.

23 private _tableElement: HTMLTableElement;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:24:10 - error TS2564: Property '_tbodyElement' has no initializer and is not definitely assigned in the constructor.

24 private _tbodyElement: HTMLTableSectionElement;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:25:10 - error TS2564: Property '_theadElement' has no initializer and is not definitely assigned in the constructor.

25 private _theadElement: HTMLTableSectionElement;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:27:10 - error TS2564: Property '_infoElement' has no initializer and is not definitely assigned in the constructor.

27 private _infoElement: HTMLElement;
~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:28:10 - error TS2564: Property '_sizeElement' has no initializer and is not definitely assigned in the constructor.

28 private _sizeElement: HTMLSelectElement;
~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:29:10 - error TS2564: Property '_paginationElement' has no initializer and is not definitely assigned in the constructor.

29 private _paginationElement: HTMLElement;
~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:32:10 - error TS2564: Property '_headerChecked' has no initializer and is not definitely assigned in the constructor.

32 private _headerChecked: boolean;
~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:33:10 - error TS2564: Property '_headerCheckElement' has no initializer and is not definitely assigned in the constructor.

33 private _headerCheckElement: HTMLInputElement;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:34:10 - error TS2564: Property '_targetElements' has no initializer and is not definitely assigned in the constructor.

34 private _targetElements: NodeListOf<HTMLInputElement>;
~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:58:12 - error TS2565: Property '_config' is used before being assigned.

58 if (this._config.stateSave === false) {
~~~~~~~

src/theme/core/components/datatable/datatable.ts:62:12 - error TS2565: Property '_config' is used before being assigned.

62 if (this._config.stateSave) {
~~~~~~~

src/theme/core/components/datatable/datatable.ts:223:39 - error TS2345: Argument of type '(value: string | number | boolean) => boolean' is not assignable to parameter of type '(value: string | number | boolean | object, index: number, array: (string | number | boolean | object)[]) => unknown'.
Types of parameters 'value' and 'value' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string | number | boolean'.
Type 'object' is not assignable to type 'string | number | boolean'.

223 return Object.values(item).some((value: string | number | boolean) => {
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:312:3 - error TS2740: Type '{}' is missing the following properties from type 'HTMLTableElement': align, bgColor, border, caption, and 318 more.

312 this._tableElement = this._element.querySelector<HTMLTableElement>(this._config.attributes.table)!;
~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:312:24 - error TS2531: Object is possibly 'null'.

312 this._tableElement = this._element.querySelector<HTMLTableElement>(this._config.attributes.table)!;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:312:70 - error TS2532: Object is possibly 'undefined'.

312 this._tableElement = this._element.querySelector<HTMLTableElement>(this._config.attributes.table)!;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:312:70 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

312 this._tableElement = this._element.querySelector<HTMLTableElement>(this._config.attributes.table)!;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:324:3 - error TS2740: Type '{}' is missing the following properties from type 'HTMLElement': accessKey, accessKeyLabel, autocapitalize, dir, and 295 more.

324 this._infoElement = this._element.querySelector<HTMLElement>(this._config.attributes.info)!;
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:324:23 - error TS2531: Object is possibly 'null'.

324 this._infoElement = this._element.querySelector<HTMLElement>(this._config.attributes.info)!;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:324:64 - error TS2532: Object is possibly 'undefined'.

324 this._infoElement = this._element.querySelector<HTMLElement>(this._config.attributes.info)!;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:324:64 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

324 this._infoElement = this._element.querySelector<HTMLElement>(this._config.attributes.info)!;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:328:3 - error TS2740: Type '{}' is missing the following properties from type 'HTMLSelectElement': autocomplete, disabled, form, labels, and 320 more.

328 this._sizeElement = this._element.querySelector<HTMLSelectElement>(this._config.attributes.size)!;
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:328:23 - error TS2531: Object is possibly 'null'.

328 this._sizeElement = this._element.querySelector<HTMLSelectElement>(this._config.attributes.size)!;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:328:70 - error TS2532: Object is possibly 'undefined'.

328 this._sizeElement = this._element.querySelector<HTMLSelectElement>(this._config.attributes.size)!;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:328:70 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

328 this._sizeElement = this._element.querySelector<HTMLSelectElement>(this._config.attributes.size)!;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:332:3 - error TS2322: Type '{}' is not assignable to type 'HTMLElement'.

332 this._paginationElement = this._element.querySelector<HTMLElement>(this._config.attributes.pagination)!;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:332:29 - error TS2531: Object is possibly 'null'.

332 this._paginationElement = this._element.querySelector<HTMLElement>(this._config.attributes.pagination)!;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:332:70 - error TS2532: Object is possibly 'undefined'.

332 this._paginationElement = this._element.querySelector<HTMLElement>(this._config.attributes.pagination)!;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:332:70 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

332 this._paginationElement = this._element.querySelector<HTMLElement>(this._config.attributes.pagination)!;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:353:3 - error TS2531: Object is possibly 'null'.

353 this._element.classList.add('datatable-initialized');
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:355:30 - error TS2531: Object is possibly 'null'.

355 const headerCheckElement = this._element.querySelector<HTMLInputElement>(this._config.attributes.check);
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:355:76 - error TS2532: Object is possibly 'undefined'.

355 const headerCheckElement = this._element.querySelector<HTMLInputElement>(this._config.attributes.check);
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:355:76 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

355 const headerCheckElement = this._element.querySelector<HTMLInputElement>(this._config.attributes.check);
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:357:22 - error TS2345: Argument of type '{}' is not assignable to parameter of type 'HTMLInputElement'.
Type '{}' is missing the following properties from type 'HTMLInputElement': accept, align, alt, autocomplete, and 354 more.

357 this._initChecbox(headerCheckElement);
~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:390:7 - error TS2532: Object is possibly 'undefined'.

390 }, this._config.search.delay);
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:390:7 - error TS2345: Argument of type 'number | undefined' is not assignable to parameter of type 'number'.
Type 'undefined' is not assignable to type 'number'.

390 }, this._config.search.delay);
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:409:26 - error TS2531: Object is possibly 'null'.

409 this._targetElements = this._element.querySelectorAll(this._config.attributes.checkbox) as NodeListOf<HTMLInputElement>;
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:409:57 - error TS2532: Object is possibly 'undefined'.

409 this._targetElements = this._element.querySelectorAll(this._config.attributes.checkbox) as NodeListOf<HTMLInputElement>;
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:409:57 - error TS2769: No overload matches this call.
The last overload gave the following error.
Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

409 this._targetElements = this._element.querySelectorAll(this._config.attributes.checkbox) as NodeListOf<HTMLInputElement>;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/typescript/lib/lib.dom.d.ts:17101:5
17101 querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
The last overload is declared here.

src/theme/core/components/datatable/datatable.ts:429:4 - error TS2532: Object is possibly 'undefined'.

429 this._config._state.originalData = originalData;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:430:4 - error TS2532: Object is possibly 'undefined'.

430 this._config._state.originalDataAttributes = originalDataAttributes;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:440:25 - error TS2532: Object is possibly 'undefined'.

440 _temp = this._data = this._config.search.callback.call(this, this._data, search) as T[];
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:440:25 - error TS2532: Object is possibly 'undefined'.

440 _temp = this._data = this._config.search.callback.call(this, this._data, search) as T[];
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:440:25 - error TS2684: The 'this' context of type '((data: KTDataTableDataInterface[], search: string) => KTDataTableDataInterface[]) | undefined' is not assignable to method's 'this' of type '(this: this, data: KTDataTableDataInterface[], search: string) => KTDataTableDataInterface[]'.
Type 'undefined' is not assignable to type '(this: this, data: KTDataTableDataInterface[], search: string) => KTDataTableDataInterface[]'.

440 _temp = this._data = this._config.search.callback.call(this, this._data, search) as T[];
~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:445:15 - error TS2532: Object is possibly 'undefined'.

445 if (typeof this._config.sort.callback === 'function') {
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:446:18 - error TS2532: Object is possibly 'undefined'.

446 this._data = this._config.sort.callback.call(this, this._data, sortField as string, sortOrder) as T[];
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:460:3 - error TS2532: Object is possibly 'undefined'.

460 this._config._state.totalItems = _temp.length;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:476:4 - error TS2532: Object is possibly 'undefined'.

476 this._config._state._contentChecksum = checksum;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:486:7 - error TS18048: '_state' is possibly 'undefined'.

486 if (_state._configChecksum !== checksum) {
~~~~~~

src/theme/core/components/datatable/datatable.ts:487:4 - error TS2532: Object is possibly 'undefined'.

487 this._config._state._configChecksum = checksum;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:573:3 - error TS2532: Object is possibly 'undefined'.

573 this._config._state.totalItems = responseData.totalCount;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:635:47 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string | URL'.
Type 'undefined' is not assignable to type 'string | URL'.

635 const apiEndpointWithQueryParams = new URL(this._config.apiEndpoint);
~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:640:16 - error TS2769: No overload matches this call.
Overload 1 of 2, '(input: string | URL | Request, init?: RequestInit | undefined): Promise<Response>', gave the following error.
Argument of type 'string | undefined' is not assignable to parameter of type 'string | URL | Request'.
Type 'undefined' is not assignable to type 'string | URL | Request'.
Overload 2 of 2, '(input: URL | RequestInfo, init?: RequestInit | undefined): Promise<Response>', gave the following error.
Argument of type 'string | undefined' is not assignable to parameter of type 'URL | RequestInfo'.
Type 'undefined' is not assignable to type 'URL | RequestInfo'.

640 return fetch(this._config.apiEndpoint, {
~~~~~~~~~~~~~~~~~~~~~~~~


src/theme/core/components/datatable/datatable.ts:655:3 - error TS2532: Object is possibly 'undefined'.

655 this._config._state.totalPages = Math.ceil(this.getState().totalItems / this.getState().pageSize) || 0;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:717:34 - error TS2532: Object is possibly 'undefined'.

717 if (!header.querySelector(`.${this._config.sort.classes.base}`)) {
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:717:34 - error TS2532: Object is possibly 'undefined'.

717 if (!header.querySelector(`.${this._config.sort.classes.base}`)) {
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:752:56 - error TS2532: Object is possibly 'undefined'.

752 const sortClass = sortOrder ? (sortOrder === 'asc' ? this._config.sort.classes.asc : this._config.sort.classes.desc) : '';
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:752:56 - error TS2532: Object is possibly 'undefined'.

752 const sortClass = sortOrder ? (sortOrder === 'asc' ? this._config.sort.classes.asc : this._config.sort.classes.desc) : '';
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:752:88 - error TS2532: Object is possibly 'undefined'.

752 const sortClass = sortOrder ? (sortOrder === 'asc' ? this._config.sort.classes.asc : this._config.sort.classes.desc) : '';
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:752:88 - error TS2532: Object is possibly 'undefined'.

752 const sortClass = sortOrder ? (sortOrder === 'asc' ? this._config.sort.classes.asc : this._config.sort.classes.desc) : '';
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:760:45 - error TS2532: Object is possibly 'undefined'.

760 const sortElement = th.querySelector(`.${this._config.sort.classes.base}`) as HTMLElement;
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:760:45 - error TS2532: Object is possibly 'undefined'.

760 const sortElement = th.querySelector(`.${this._config.sort.classes.base}`) as HTMLElement;
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:763:32 - error TS2532: Object is possibly 'undefined'.

763 sortElement.className = `${this._config.sort.classes.base} ${sortClass}`.trim();
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:763:32 - error TS2532: Object is possibly 'undefined'.

763 sortElement.className = `${this._config.sort.classes.base} ${sortClass}`.trim();
~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:900:19 - error TS2532: Object is possibly 'undefined'.

900 const options = this._config.pageSizes.map((size: number) => {
~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:931:3 - error TS2532: Object is possibly 'undefined'.

931 this._config._state.pageSize = pageSize;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:932:3 - error TS2532: Object is possibly 'undefined'.

932 this._config._state.page = page;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:946:4 - error TS2322: Type 'null' is not assignable to type 'HTMLElement'.

946 return null;
~~~~~~

src/theme/core/components/datatable/datatable.ts:964:30 - error TS2532: Object is possibly 'undefined'.

964 _infoElement.textContent = this._config.info
~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:989:11 - error TS2339: Property 'previous' does not exist on type '{ number: { class: string; text: string; }; previous: { class: string; text: string; }; next: { class: string; text: string; }; more: { class: string; text: string; }; } | undefined'.

989 const { previous, next, number, more } = this._config.pagination;
~~~~~~~~

src/theme/core/components/datatable/datatable.ts:989:21 - error TS2339: Property 'next' does not exist on type '{ number: { class: string; text: string; }; previous: { class: string; text: string; }; next: { class: string; text: string; }; more: { class: string; text: string; }; } | undefined'.

989 const { previous, next, number, more } = this._config.pagination;
~~~~

src/theme/core/components/datatable/datatable.ts:989:27 - error TS2339: Property 'number' does not exist on type '{ number: { class: string; text: string; }; previous: { class: string; text: string; }; next: { class: string; text: string; }; more: { class: string; text: string; }; } | undefined'.

989 const { previous, next, number, more } = this._config.pagination;
~~~~~~

src/theme/core/components/datatable/datatable.ts:989:35 - error TS2339: Property 'more' does not exist on type '{ number: { class: string; text: string; }; previous: { class: string; text: string; }; next: { class: string; text: string; }; more: { class: string; text: string; }; } | undefined'.

989 const { previous, next, number, more } = this._config.pagination;
~~~~

src/theme/core/components/datatable/datatable.ts:1011:68 - error TS2345: Argument of type 'number | undefined' is not assignable to parameter of type 'number'.
Type 'undefined' is not assignable to type 'number'.

1011 const range = this._calculatePageRange(currentPage, totalPages, maxButtons);
~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1076:4 - error TS2532: Object is possibly 'undefined'.

1076 this._config._state.page = page;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1083:19 - error TS2531: Object is possibly 'null'.

1083 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner) || this._createSpinner();
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1083:60 - error TS2532: Object is possibly 'undefined'.

1083 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner) || this._createSpinner();
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1083:60 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

1083 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner) || this._createSpinner();
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1085:12 - error TS2339: Property 'style' does not exist on type '{}'.

1085 spinner.style.display = 'block';
~~~~~

src/theme/core/components/datatable/datatable.ts:1087:3 - error TS2531: Object is possibly 'null'.

1087 this._element.classList.add('loading');
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1092:19 - error TS2531: Object is possibly 'null'.

1092 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner);
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1092:60 - error TS2532: Object is possibly 'undefined'.

1092 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner);
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1092:60 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

1092 const spinner = this._element.querySelector<HTMLElement>(this._config.attributes.spinner);
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1094:12 - error TS2339: Property 'style' does not exist on type '{}'.

1094 spinner.style.display = 'none';
~~~~~

src/theme/core/components/datatable/datatable.ts:1096:3 - error TS2531: Object is possibly 'null'.

1096 this._element.classList.remove('loading');
~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1102:4 - error TS2322: Type 'null' is not assignable to type 'HTMLElement'.

1102 return null;
~~~~~~

src/theme/core/components/datatable/datatable.ts:1174:7 - error TS2322: Type 'null' is not assignable to type 'string'.

1174 let id: string = null;
~~

src/theme/core/components/datatable/datatable.ts:1197:3 - error TS2532: Object is possibly 'undefined'.

1197 this._config._state.sortField = sortField as never;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1198:3 - error TS2532: Object is possibly 'undefined'.

1198 this._config._state.sortOrder = newSortOrder;
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1235:4 - error TS2532: Object is possibly 'undefined'.

1235 this._config.attributes.checkbox,
~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1235:4 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
Type 'undefined' is not assignable to type 'string'.

1235 this._config.attributes.checkbox,
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1286:28 - error TS6133: 'event' is declared but its value is never read.

1286 protected _checkboxToggle(event?: Event): void {
~~~~~

src/theme/core/components/datatable/datatable.ts:1302:28 - error TS6133: 'event' is declared but its value is never read.

1302 protected _checkboxUpdate(event?: Event): void {
~~~~~

src/theme/core/components/datatable/datatable.ts:1318:23 - error TS2532: Object is possibly 'undefined'.

1318 row.classList.add(this._config.checkbox.checkedClass as string);
~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1321:26 - error TS2532: Object is possibly 'undefined'.

1321 row.classList.remove(this._config.checkbox.checkedClass as string);
~~~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1410:4 - error TS2322: Type 'null' is not assignable to type 'string | number'.

1410 sortField: null,
~~~~~~~~~

src/theme/core/components/datatable/types.ts:14:2
14 sortField: keyof KTDataTableDataInterface | number;
~~~~~~~~~
The expected type comes from property 'sortField' which is declared here on type 'KTDataTableStateInterface'

src/theme/core/components/datatable/datatable.ts:1418:4 - error TS2322: Type 'number | undefined' is not assignable to type 'number'.
Type 'undefined' is not assignable to type 'number'.

1418 pageSize: this._config.pageSize,
~~~~~~~~

src/theme/core/components/datatable/types.ts:16:2
16 pageSize: number;
~~~~~~~~
The expected type comes from property 'pageSize' which is declared here on type 'KTDataTableStateInterface'

src/theme/core/components/datatable/datatable.ts:1514:3 - error TS2532: Object is possibly 'undefined'.

1514 this._config._state.filters = [
~~~~~~~~~~~~~~~~~~~

src/theme/core/components/datatable/datatable.ts:1526:3 - error TS2532: Object is possibly 'undefined'.

1526 this._config._state.search = query;
~~~~~~~~~~~~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:6:2 - error TS6133: 'KTDatatableResponseDataInterface' is declared but its value is never read.

6 KTDatatableResponseDataInterface,
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:50:4 - error TS2322: Type '(item: string, data: IPAddressData, context: KTDataTableInterface) => string' is not assignable to type '(item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string'.
Types of parameters 'item' and 'item' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string'.
Type 'number' is not assignable to type 'string'.

50 render: (
~~~~~~

src/theme/core/components/datatable/types.ts:82:4
82 render?: (item: KTDataTableDataInterface[keyof KTDataTableDataInterface] | string, data: KTDataTableDataInterface, context: KTDataTableInterface) => string,
~~~~~~
The expected type comes from property 'render' which is declared here on type '{ title?: string | undefined; render?: ((item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string) | undefined; checkbox?: boolean | undefined; createdCell?: ((cell: HTMLTableCellElement, cellData: string | ... 2 more ... | object, rowData: KTDataTableDataInt...'

src/theme/app/datatables/allowed-ip-addresses.ts:51:5 - error TS6133: 'item' is declared but its value is never read.

51 item: string,
~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:53:5 - error TS6133: 'context' is declared but its value is never read.

53 context: KTDataTableInterface
~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:65:4 - error TS2322: Type '(item: string) => string' is not assignable to type '(item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string'.
Types of parameters 'item' and 'item' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string'.

65 render: (item: string): string => {
~~~~~~

src/theme/core/components/datatable/types.ts:82:4
82 render?: (item: KTDataTableDataInterface[keyof KTDataTableDataInterface] | string, data: KTDataTableDataInterface, context: KTDataTableInterface) => string,
~~~~~~
The expected type comes from property 'render' which is declared here on type '{ title?: string | undefined; render?: ((item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string) | undefined; checkbox?: boolean | undefined; createdCell?: ((cell: HTMLTableCellElement, cellData: string | ... 2 more ... | object, rowData: KTDataTableDataInt...'

src/theme/app/datatables/allowed-ip-addresses.ts:85:4 - error TS2322: Type '(item: string, data: IPAddressData) => string' is not assignable to type '(item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string'.
Types of parameters 'item' and 'item' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string'.

85 render: (
~~~~~~

src/theme/core/components/datatable/types.ts:82:4
82 render?: (item: KTDataTableDataInterface[keyof KTDataTableDataInterface] | string, data: KTDataTableDataInterface, context: KTDataTableInterface) => string,
~~~~~~
The expected type comes from property 'render' which is declared here on type '{ title?: string | undefined; render?: ((item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string) | undefined; checkbox?: boolean | undefined; createdCell?: ((cell: HTMLTableCellElement, cellData: string | ... 2 more ... | object, rowData: KTDataTableDataInt...'

src/theme/app/datatables/allowed-ip-addresses.ts:86:5 - error TS6133: 'item' is declared but its value is never read.

86 item: string,
~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:87:5 - error TS6133: 'data' is declared but its value is never read.

87 data: IPAddressData
~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:94:24 - error TS6133: 'cellData' is declared but its value is never read.

94 createdCell: (cell, cellData, rowData) => {
~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:95:5 - error TS2531: Object is possibly 'null'.

95 cell.querySelector('.btn').addEventListener('click', () => {
~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:101:4 - error TS2322: Type '(item: string, data: IPAddressData) => string' is not assignable to type '(item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string'.
Types of parameters 'item' and 'item' are incompatible.
Type 'string | number | boolean | object' is not assignable to type 'string'.

101 render: (
~~~~~~

src/theme/core/components/datatable/types.ts:82:4
82 render?: (item: KTDataTableDataInterface[keyof KTDataTableDataInterface] | string, data: KTDataTableDataInterface, context: KTDataTableInterface) => string,
~~~~~~
The expected type comes from property 'render' which is declared here on type '{ title?: string | undefined; render?: ((item: string | number | boolean | object, data: KTDataTableDataInterface, context: KTDataTableInterface) => string) | undefined; checkbox?: boolean | undefined; createdCell?: ((cell: HTMLTableCellElement, cellData: string | ... 2 more ... | object, rowData: KTDataTableDataInt...'

src/theme/app/datatables/allowed-ip-addresses.ts:102:5 - error TS6133: 'item' is declared but its value is never read.

102 item: string,
~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:103:5 - error TS6133: 'data' is declared but its value is never read.

103 data: IPAddressData
~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:110:24 - error TS6133: 'cellData' is declared but its value is never read.

110 createdCell: (cell, cellData, rowData) => {
~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:111:5 - error TS2531: Object is possibly 'null'.

111 cell.querySelector('.btn').addEventListener('click', () => {
~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:121:1 - error TS2531: Object is possibly 'null'.

121 document.querySelector('#select_ip_btn').addEventListener('click', () => {
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/theme/app/datatables/allowed-ip-addresses.ts:137:56 - error TS2345: Argument of type 'string | null' is not assignable to parameter of type 'string'.
Type 'null' is not assignable to type 'string'.

137 const datatable = document.querySelector<HTMLElement>(tableId);
~~~~~~~


Found 299 errors.


user
Oil Oil 5 months ago
Vue
6 Answers
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (6)

user
Lauris Stepanovs Author5 months ago

Hi,

If you haven't managed to get a working application by following our integration guide, refer to the Metronic Tailwind Vue project in our guides repo.

Since it is a public repo, it doesn't contain theme assets. Follow the steps below before running the application:

  1. Open the repo at https://github.com/KeenthemesHub/metronic-tailwind-html-integration.
  2. Download the metronic-tailwind-vue folder.
  3. Copy the src folder from the metronic-tailwind-html package and paste it into the metronic-tailwind-vue/src directory.
  4. Rename the copied folder to theme. The directory structure should now look like this: metronic-tailwind-vue/src/theme.
  5. Copy the media folder from metronic-tailwind-html/dist/assets and paste it into metronic-tailwind-vue/public.
  6. Install dependencies with npm install and serve the project with npm run dev.



Please let us know if you will need any help on this topic or anything else.

Regards,
Lauris Stepanovs,
Keenthemes Support Team
user
Sean Author5 months ago

Hi,

May I know which Metronic version are you using v9.0.0 or the latest v9.0.1 ?

What is your typescript configuration and compiler's settings? To support major frameworks and browser our current TS code is compatible with es5/es2015 and we used the following tsconfig:


{
"compilerOptions": {
"lib": ["dom", "es2015"],
"rootDir": "../",
"outDir": "./lib/cjs/",
"sourceMap": true,
"declaration": true,
"noImplicitAny": true,
"module": "commonjs",
"target": "es5",
"allowJs": true,
"resolveJsonModule": true,
"moduleResolution": "node"
},
"include": ["src/**/*.ts"],
"exclude": ["node_modules", "dist"]
}


Regards,


user
Oil Oil 5 months ago

Hi Sean

Im using 9.0.1
Yesterday I tried to start creating an application on 9.0.0 but there were too many errors, I hoped that they would be fixed in 9.0.1 but this did not happen

all settings without changes are taken from here:
<a> https://keenthemes.com/metronic/tailwind/docs/getting-started/integration/frontend/vue </a>


user
Sean Author5 months ago

Hi,

On our end, we were able to launch Vue/React/Angular-based apps using the v9.0.1 typescript components.

Are these errors generated by JSLint? If so can you provide it's config?

Or it was generated by your ts compiler, could you please let us know your tsconfig ? Also please provide us a typescript compiler config that displays those errors.

Regards.


user
Oil Oil 5 months ago

Hi,

I rewrote the configurations according to your letter and it seems to be working now
I would like to ask you to add configuration data to the integration guide
Also after making changes I found an error:

src/theme/core/helpers/dom.ts:348:7 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
No index signature with a parameter of type 'string' was found on type '{}'.

348 attributes[normalizedKey] = KTUtils.parseDataAttribute(element.dataset[key]);
~~~~~~~~~~~~~~~~~~~~~~~~~


Found 1 error.

The problem is solved for me by adding the type any in line 342 of the dom.ts file


user
Sean Author5 months ago

Hi,

Great to hear that you managed to get it working. Noted, we will consider putting the recommended tsconfig in the docs guide.

We will release an official fix for the type of issue in the next update asap.

Regards.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(