Type Definitions

[MarcusNotheis]

As the question of where to find Type Definitions for UI5 Web Components (for React) was already raised a couple of times, I'll try to consolidate everything into this thread:

Common Questions:

• Do UI5 Web Components have type definitions?
• Do UI5 Web Components for React have type definitions?
• Are there Type Definitions available for the base packages, e.g @ui5/webcomponents-base or @ui5/webcomponents-icons?

[MarcusNotheis]

The following packages have type definitions (bundled with the source-code):

• @ui5/webcomponents-react
• @ui5/webcomponents-react-base
• @ui5/webcomponents-react-charts

The following packages do not have type definitions (as of now, there is some work ongoing on providing .d.ts files):

• @ui5/webcomponents
• @ui5/webcomponents-base
• @ui5/webcomponents-fiori
• @ui5/webcomponents-icons
• @ui5/webcomponents-icons-tnt

Although @ui5/webcomponents and @ui5/webcomponents-fiori do not have type definitions in place yet, @ui5/webcomponents-react is creating them for the use with the react wrapper to make it easier for you to consume these components.

[PMudra]

(as of now, there is some work ongoing on providing .d.ts files)

I saw that there are two .d.ts files provided in packages/base/types. What is the best way to use these files in my TypeScript app?

[MarcusNotheis]

To be honest: I would not recommend using those files because their main intention is that they are used internally in our base package. As a consequence, we have only typed the API's we need, so I'm pretty sure those typings are incomplete.
As far as I know, the UI5 Web Components Team is planning to work on TypeScript support soon: SAP/ui5-webcomponents#4337, so we might get auto-generated type definitions in the near future.

If you want to import our types anyway, you should be able to add those imports to your application:

import '@ui5/webcomponents-react-base/types/UI5Device.d.ts';
import '@ui5/webcomponents-react-base/types/Theme.d.ts';