You are here

Property ‘updated’ in type ‘CdsIcon’ is not assignable to the same property in base type ‘LitElement’

Arjun JS , , ,

What is The Error?

This issue is caused because of the latest push done at CDS (Clarity design systems) by miss they have not updated the ‘LitElement‘ dependency plugin.

Actual error:

Error: node_modules/@cds/core/icon/icon.element.d.ts:91:5 - error TS2416: Property 'updated' in type 'CdsIcon' is not assignable to the same property in base type 'LitElement'.
Type '(props: Map<string, any>) => void' is not assignable to type '(_changedProperties: PropertyValues) => void'.
Types of parameters 'props' and '_changedProperties' are incompatible.
Type 'PropertyValues' is not assignable to type 'Map<string, any>'.

91 updated(props: Map<string, any>): void;
~~~~~~~

Error: node_modules/@cds/core/icon/icon.element.d.ts:92:5 - error TS2416: Property 'firstUpdated' in type 'CdsIcon' is not assignable to the same property in base type 'LitElement'.
Type '(props: Map<string, any>) => void' is not assignable to type '(_changedProperties: PropertyValues) => void'.
Types of parameters 'props' and '_changedProperties' are incompatible.
Type 'PropertyValues' is not assignable to type 'Map<string, any>'.

92 firstUpdated(props: Map<string, any>): void;
~~~~~~~~~~~~

Error: node_modules/@cds/core/internal/base/button.base.d.ts:19:15 - error TS2416: Property 'updated' in type 'CdsBaseButton' is not assignable to the same property in base type 'LitElement'.
Type '(props: Map<string, any>) => void' is not assignable to type '(_changedProperties: PropertyValues) => void'.
Types of parameters 'props' and '_changedProperties' are incompatible.
Type 'PropertyValues' is not assignable to type 'Map<string, any>'.
Types of property 'forEach' are incompatible.
Type '(callbackfn: <K extends string | number | symbol>(value: any, key: K, map: Map<K, any>) => void, thisArg?: unknown) => void' is not assignable to type '(callbackfn: (value: any, key: string, map: Map<string, any>) => void, thisArg?: any) => void'.
Types of parameters 'callbackfn' and 'callbackfn' are incompatible.
Types of parameters 'key' and 'key' are incompatible.
Type 'K' is not assignable to type 'string'.
Type 'string | number | symbol' is not assignable to type 'string'.
Type 'number' is not assignable to type 'string'.

19 protected updated(props: Map<string, any>): void;

 

Also Read:  How to integrate Razorpay checkout using javascript

Solution :

For now, you can temporarily downgrade @lit/reactive-element to version 1.2.1:
npm install @lit/reactive-element@<1.2.2

else

Just add the below code in the package.js

"resolutions": {
    "@lit/reactive-element": "1.2.1"
} Then run npm install

Related posts