add-zod(1): Upgrade TS to 4.3.5

.eslintrc.js

@@ -23,22 +23,6 @@ module.exports = {
 		'prettier/vue',
 	],
 	rules: {
-		'no-magic-numbers': [
-			'warn',
-			{ ignoreArrayIndexes: true, ignore: [0, 1, 2, -1, 10] },
-		],
-		'no-param-reassign': 'warn',
-		'no-console': process.env.NODE_ENV === 'development' ? 'off' : 'error',
-		'no-debugger': process.env.NODE_ENV === 'development' ? 'off' : 'error',
-		'vue/attribute-hyphenation': ['error', 'never'],
-		'vue/require-default-prop': 'off',
-		'vue/require-component-is': 'warn',
-		'vue/html-indent': 'off',
-		'sonarjs/no-duplicate-string': 'warn',
-		'@typescript-eslint/member-delimiter-style': 'off',
-		'@typescript-eslint/explicit-function-return-type': 'off',
-		'@typescript-eslint/no-namespace': 'off',
-		'prettier/prettier': 'warn',
 		'import/order': [
 			'warn',
 			{
@@ -49,8 +33,25 @@ module.exports = {
 				'newlines-between': 'always',
 			},
 		],
+		'no-console': process.env.NODE_ENV === 'development' ? 'off' : 'error',
+		'no-debugger': process.env.NODE_ENV === 'development' ? 'off' : 'error',
+		'no-magic-numbers': [
+			'warn',
+			{ ignoreArrayIndexes: true, ignore: [0, 1, 2, -1, 10] },
+		],
+		'no-param-reassign': 'warn',
+		'@typescript-eslint/explicit-function-return-type': 'off',
+		'@typescript-eslint/explicit-module-boundary-types': 'off',
+		'@typescript-eslint/member-delimiter-style': 'off',
+		'@typescript-eslint/no-extra-semi': 'off', // conflicts with prettier
+		'@typescript-eslint/no-namespace': 'off',
+		'sonarjs/no-duplicate-string': 'warn',
+		'prettier/prettier': 'warn',
 		'vue/attribute-hyphenation': ['error', 'never'],
 		'vue/attributes-order': ['error', { alphabetical: true }],
+		'vue/html-indent': 'off',
+		'vue/require-component-is': 'warn',
+		'vue/require-default-prop': 'off',
 	},
 	overrides: [
 		{

package.json

@@ -47,7 +47,7 @@
 		}
 	],
 	"dependencies": {
-		"typescript": "^3.9.6"
+		"typescript": "4.3"
 	},
 	"devDependencies": {
 		"@babel/core": "7.x",
@@ -57,8 +57,8 @@
 		"@babel/preset-env": "^7.11.0",
 		"@babel/preset-typescript": "^7.10.4",
 		"@types/jest": "^26.0.20",
-		"@typescript-eslint/eslint-plugin": "^2.26.0",
-		"@typescript-eslint/parser": "^2.26.0",
+		"@typescript-eslint/eslint-plugin": "^4.31.0",
+		"@typescript-eslint/parser": "^4.31.0",
 		"@vue/eslint-config-typescript": "^5.0.2",
 		"@vue/test-utils": "^1.1.2",
 		"autoprefixer": "^9.8.5",

packages/documentation/components/ComponentInfo.vue

@@ -253,7 +253,7 @@ export default defineComponent<{
 				return result
 			}),
 			showProps: ref(false),
-			stringifyDefault: (defaultValue: Function | unknown) =>
+			stringifyDefault: (defaultValue: (() => unknown) | unknown) =>
 				typeof defaultValue === 'function'
 					? `${JSON.stringify(defaultValue())} *`
 					: JSON.stringify(defaultValue),

packages/documentation/pages/changelog.vue

@@ -112,9 +112,9 @@ const convertPoundToIssueLink = (string: string) =>
 		'[#$1](https://github.com/3YOURMIND/kotti/issues/$1)',
 	)
 
-// disable ban-ts-ignore because vscode sees this as an error but nuxt doesn’t
-// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-// @ts-ignored layout is not added to the type definition of defineComponent
+// disable ban-ts-comment because vscode sees this as an error but nuxt doesn’t
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore layout is not added to the type definition of defineComponent
 export default defineComponent({
 	name: 'DocumentationPageChangelog',
 	layout: 'fullpage',
@@ -129,7 +129,6 @@ export default defineComponent({
 			releases.value = (
 				await octokit.repos.listReleases({
 					owner: '3yourmind',
-					// eslint-disable-next-line @typescript-eslint/camelcase
 					per_page: 1000,
 					repo: 'kotti',
 				})

packages/documentation/pages/foundations/units.vue

@@ -36,9 +36,9 @@ The following 3 types of margins or paddings are suggested:
 <script lang="ts">
 import { defineComponent } from '@vue/composition-api'
 
-// disable ban-ts-ignore because vscode sees this as an error but nuxt doesn’t
-// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-// @ts-ignored layout is not added to the type definition of defineComponent
+// disable ban-ts-comment because vscode sees this as an error but nuxt doesn’t
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore layout is not added to the type definition of defineComponent
 export default defineComponent({
 	name: 'DocumentationPageFoundationsUnits',
 	layout: 'fullpage',

packages/documentation/pages/usage/utilities.vue

@@ -137,9 +137,9 @@
 <script lang="ts">
 import { defineComponent } from '@vue/composition-api'
 
-// disable ban-ts-ignore because vscode sees this as an error but nuxt doesn’t
-// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-// @ts-ignored layout is not added to the type definition of defineComponent
+// disable ban-ts-comment because vscode sees this as an error but nuxt doesn’t
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore layout is not added to the type definition of defineComponent
 export default defineComponent({
 	name: 'DocumentationPageUsageUtilities',
 	layout: 'fullpage',

packages/documentation/pages/utilities.ts

@@ -20,7 +20,7 @@ export type ComponentNames =
 export type ComponentValue = {
 	hasHelpTextSlot: boolean
 	name: ComponentNames
-	props: object
+	props: Record<string, unknown>
 	validation: Kotti.Field.Validation.Result['type']
 }
 

packages/kotti-ui/source/kotti-button-group/types.ts

@@ -1,7 +1,7 @@
 import { SpecifyRequiredProps } from '../types/utilities'
 
 export namespace KottiButtonGroup {
-	export type PropsInternal = {}
+	export type PropsInternal = Record<string, never>
 
 	export type Props = SpecifyRequiredProps<PropsInternal, never>
 }

packages/kotti-ui/source/kotti-field-number/KtFieldNumber.vue

@@ -226,7 +226,7 @@ export default defineComponent({
 			input,
 			inputProps: computed(
 				(): Partial<HTMLInputElement> & {
-					class: object
+					class: Record<string, boolean>
 					forceUpdateKey: number
 				} => ({
 					...field.inputProps,

packages/kotti-ui/source/kotti-field-password/KtFieldPassword.vue

@@ -47,7 +47,7 @@ export default defineComponent({
 			field,
 			inputProps: computed(
 				(): Partial<HTMLInputElement> & {
-					class: object
+					class: string[]
 					forceUpdateKey: number
 				} => ({
 					...field.inputProps,

packages/kotti-ui/source/kotti-field-select/KtFieldMultiSelect.vue

@@ -82,6 +82,7 @@
 import { Yoco } from '@3yourmind/yoco'
 import { defineComponent, computed, ref } from '@vue/composition-api'
 import { Select as ElSelect, Option as ElOption } from 'element-ui'
+import type Vue from 'vue'
 
 import { KtField } from '../kotti-field'
 import { KOTTI_FIELD_PROPS } from '../kotti-field/constants'

packages/kotti-ui/source/kotti-field-select/KtFieldSingleSelect.vue

@@ -56,6 +56,7 @@
 <script lang="ts">
 import { defineComponent, computed, ref } from '@vue/composition-api'
 import { Select as ElSelect, Option as ElOption } from 'element-ui'
+import type Vue from 'vue'
 
 import { KtField } from '../kotti-field'
 import { KOTTI_FIELD_PROPS } from '../kotti-field/constants'

packages/kotti-ui/source/kotti-field-text/KtFieldText.vue

@@ -41,7 +41,7 @@ export default defineComponent({
 			field,
 			inputProps: computed(
 				(): Partial<HTMLInputElement> & {
-					class: object
+					class: string[]
 					forceUpdateKey: number
 				} => ({
 					...field.inputProps,

packages/kotti-ui/source/kotti-field/tests.ts

@@ -44,13 +44,16 @@ const TestComponent = defineComponent({
 const TestComponentObject = defineComponent({
 	name: 'TestComponentObject',
 	props: KOTTI_FIELD_PROPS,
-	setup: (props: KottiField.Props<object | null, string | null>, { emit }) => {
+	setup: (
+		props: KottiField.Props<Record<string, unknown> | null, string | null>,
+		{ emit },
+	) => {
 		useTranslationProvide(ref('en-US'), ref({}))
 
 		return {
 			field: useField({
 				emit,
-				isCorrectDataType: (value): value is object | null =>
+				isCorrectDataType: (value): value is Record<string, unknown> | null =>
 					value === null || typeof value === 'object',
 				isEmpty: (value) => value === null,
 				props,

packages/kotti-ui/source/kotti-form-controller-list/KtFormControllerList.vue

@@ -40,7 +40,9 @@ import { KT_FORM_CONTEXT } from '../kotti-form/constants'
 import { KottiForm } from '../kotti-form/types'
 
 import FormControllerListItem from './components/FormControllerListItem.vue'
-import { KottiFormControllerList } from './types'
+import { KottiFormControllerList, KottiFormControllerListItem } from './types'
+
+type Entry = KottiFormControllerListItem.Props['values']
 
 export default defineComponent({
 	name: 'KtFormControllerList',
@@ -53,7 +55,7 @@ export default defineComponent({
 		if (context === null)
 			throw new Error('KtFormControllerList: Could Not Find KtFormContext')
 
-		const valuesList = computed<object[]>(() => {
+		const valuesList = computed<Entry[]>(() => {
 			const result = context.values.value[props.formKey]
 
 			if (!Array.isArray(result))
@@ -68,7 +70,7 @@ export default defineComponent({
 			/**
 			 * Adds a new valuesList entry after the given index
 			 */
-			addAfter: (index: number, newRow: object) =>
+			addAfter: (index: number, newRow: Entry) =>
 				context.setValue(props.formKey, [
 					...valuesList.value.slice(0, index + 1),
 					newRow,
@@ -77,7 +79,7 @@ export default defineComponent({
 			/**
 			 * Adds a new valuesList entry before the given index
 			 */
-			addBefore: (index: number, newRow: object) =>
+			addBefore: (index: number, newRow: Entry) =>
 				context.setValue(props.formKey, [
 					...valuesList.value.slice(0, index),
 					newRow,
@@ -117,7 +119,7 @@ export default defineComponent({
 			/**
 			 * Replaces an entire valuesListEntry with new data
 			 */
-			setValuesIndex: (index: number, newValue: object) =>
+			setValuesIndex: (index: number, newValue: Entry) =>
 				context.setValue(
 					props.formKey,
 					valuesList.value.map((oldValue, i) =>
@@ -132,17 +134,17 @@ export default defineComponent({
 				/**
 				 * Adds a new valuesList entry to the end of the entire list
 				 */
-				addAfter: (newRow: object) =>
+				addAfter: (newRow: Entry) =>
 					context.setValue(props.formKey, [...valuesList.value, newRow]),
 				/**
 				 * Adds a new valuesList entry to the beginning of the entire list
 				 */
-				addBefore: (newRow: object) =>
+				addBefore: (newRow: Entry) =>
 					context.setValue(props.formKey, [newRow, ...valuesList.value]),
 				/**
 				 * Replaces the entire valuesList with a new one
 				 */
-				setValues: (newValuesList: object[]) =>
+				setValues: (newValuesList: Entry[]) =>
 					context.setValue(props.formKey, newValuesList),
 			},
 			valuesList,

packages/kotti-ui/source/kotti-form-controller-list/types.ts

@@ -9,8 +9,8 @@ export namespace KottiFormControllerList {
 export namespace KottiFormControllerListItem {
 	export type Props = {
 		context: KottiForm.Context
-		formKey: Exclude<KottiField.Props<object[], unknown>['formKey'], null>
+		formKey: Exclude<KottiField.Props<unknown, unknown>['formKey'], null>
 		index: number
-		values: Record<string, unknown>
+		values: Record<KottiFormControllerListItem.Props['formKey'], unknown>
 	}
 }

packages/kotti-ui/source/kotti-form/tests.ts

@@ -43,15 +43,18 @@ const TestFieldObject = defineComponent({
 	components: { KtField },
 	props: KOTTI_FIELD_PROPS,
 	setup: (
-		props: KottiField.Props<object | string | null, string | null>,
+		props: KottiField.Props<
+			Record<string, unknown> | string | null,
+			string | null
+		>,
 		{ emit },
 	) => {
 		useTranslationProvide(ref('en-US'), ref({}))
 
 		return {
 			field: useField({
 				emit,
-				isCorrectDataType: (value): value is object | null =>
+				isCorrectDataType: (value): value is Record<string, unknown> | null =>
 					typeof value === 'object' ||
 					typeof value === 'string' ||
 					value === null,
@@ -82,7 +85,10 @@ const TestForm2 = {
 const getField = (
 	// eslint-disable-next-line @typescript-eslint/no-explicit-any
 	wrapper: Wrapper<any>,
-): KottiField.Hook.Returns<string | object | null, string | null> =>
+): KottiField.Hook.Returns<
+	string | Record<string, unknown> | null,
+	string | null
+> =>
 	// eslint-disable-next-line @typescript-eslint/no-explicit-any
 	(wrapper.vm.$children[0].$children[0] as any).field
 

packages/kotti-ui/source/kotti-navbar/types.ts

@@ -29,7 +29,7 @@ export namespace KottiNavbar {
 	export type PropsInternal = {
 		isNarrow: boolean
 		logoUrl: string
-		notification: object | null
+		notification: Record<string, unknown> | null
 		quickLinks: QuickLink[]
 		sections: Section[]
 		theme: Theme | null

packages/kotti-ui/source/kotti-translation/types.ts

@@ -7,7 +7,7 @@ import { KottiFilters } from '../kotti-filters/types'
 import { KottiFormSubmit } from '../kotti-form-submit/types'
 import { KottiNavbar } from '../kotti-navbar/types'
 
-export type DeepPartial<T> = T extends object
+export type DeepPartial<T> = T extends Record<string, unknown>
 	? { [K in keyof T]?: DeepPartial<T[K]> }
 	: T
 

packages/kotti-ui/source/kotti-translation/utilities.ts

@@ -7,7 +7,7 @@ import { DeepPartial } from './types'
  * although deepmerge supports the behavior
  * This helper function works-around that issue
  */
-export const fixDeepMerge = <T extends object>(
+export const fixDeepMerge = <T extends Record<string, unknown>>(
 	x: DeepPartial<T>,
 	y: DeepPartial<T>,
 ): T => deepmerge<T>(x, y)

packages/kotti-ui/source/utilities.ts

@@ -23,4 +23,4 @@ export const isBrowser = Boolean(
 export const makeInstallable = (component: VueConstructor<Vue>) =>
 	Object.assign(component, {
 		install: (Vue) => Vue.component(component.name, component),
-	} as Vue.PluginObject<{}>)
+	} as Vue.PluginObject<Record<string, never>>)