fix(types): add type declarations for components (#1399)

* fix: add types for popers

* style: prettier constants decl

* fix: rexport types from ui

* fix: generate type script

* chore: ignore declaration files

* fix: add types for icons

* fix: add types for alert, box, button

* fix: add types for input

* fix: add types for calendar

* fix: add types for checkbox

* fix: add types card, center, chip, cover, css

* fix: add types for divier and field

* fix: add types for file-input

* fix: add types for logo, modal, node

* fix: add types for headerbar, help, intersection, label, layer

* fix: add types for legend, loader, menu, notice-box

* fix: add types for orgunit-tree

* fix: add types for portal, tab, tooltip

* fix: add types for equired, statusicon, tag, useravatar

* fix: add types for pagination

* fix: edit input payloads, add radio types

* fix: add types for segmented-control

* fix: add types for select

* fix: add types for selector-bar,switch

* fix: add types for sharing-dialog and modal

* fix: add types for transfer

* fix: add types for textarea

* fix: add types for table

* fix: rexport declarations from collections/ui

* style: run prettier

* fix: remove generate-types script

* fix: name conflicts

* fix: name conflicts in rexport

* chore: add @types/react to dependencies

* fix: typo

* style: run prettier on icons

* fix: move files to types-folder and update packages

* chore: eslint ignore *.d.ts

* chore: run prettier

* fix: fix types in package.json

* fix: add forward prop types to datacell

* style: prettier on package.json

* style: prettier

* fix: cleanup

* chore: use range for peer-dep @react/types

* fix: fix onClick type for layer

* chore: move @types/react to peerdep

* refactor(org unit tree): rename root error & loading to match exported name

* chore(transferoption): add missing onClick/onDoubleClick prop TS types

* chore(org unit tree): add missing / fix public TS types

* fix(selector-bar): add types for selector-bar-item

* style: fix selector-bar style

---------

Co-authored-by: Jan-Gerke Salomon <jgs.salomon@gmail.com>
Co-authored-by: Jan-Gerke Salomon <Mohammer5@users.noreply.github.com>

.eslintignore

@@ -1,3 +1,4 @@
 .yarn/
 utilities/icons/src/react/**/*.js
 **/locales/
+*.d.ts

.eslintrc.js

@@ -33,6 +33,7 @@ const config = {
                 '*.stories*.js',
                 '**/__stories__/*.js',
                 '**/__stories__/**/*.js',
+                '*.d.ts',
             ],
             rules: {
                 'import/no-extraneous-dependencies': 'error',

collections/forms/package.json

@@ -49,10 +49,12 @@
         "react-final-form": "^6.5.3"
     },
     "files": [
-        "build"
+        "build",
+        "types"
     ],
     "devDependencies": {
         "react": "16.13",
         "react-dom": "16.13"
-    }
+    },
+    "types": "types"
 }

collections/ui/package.json

@@ -83,5 +83,10 @@
         "react": "16.13",
         "react-dom": "16.13",
         "styled-jsx": "^4.0.1"
-    }
+    },
+    "files": [
+        "build",
+        "types"
+    ],
+    "types": "types"
 }

collections/ui/types/index.d.ts

@@ -0,0 +1,65 @@
+export * from '@dhis2/ui-constants'
+export * from '@dhis2/ui-icons'
+
+// DEPRECATED?
+export * from '@dhis2/ui-forms'
+
+// components
+export * from '@dhis2-ui/alert'
+export * from '@dhis2-ui/button'
+export * from '@dhis2-ui/box'
+export * from '@dhis2-ui/calendar'
+export * from '@dhis2-ui/card'
+export * from '@dhis2-ui/center'
+export * from '@dhis2-ui/checkbox'
+export * from '@dhis2-ui/chip'
+export * from '@dhis2-ui/cover'
+export * from '@dhis2-ui/css'
+export * from '@dhis2-ui/divider'
+export * from '@dhis2-ui/field'
+export * from '@dhis2-ui/file-input'
+export * from '@dhis2-ui/header-bar'
+export * from '@dhis2-ui/help'
+export * from '@dhis2-ui/input'
+export * from '@dhis2-ui/intersection-detector'
+export * from '@dhis2-ui/label'
+export * from '@dhis2-ui/layer'
+export * from '@dhis2-ui/legend'
+export * from '@dhis2-ui/loader'
+export * from '@dhis2-ui/logo'
+export * from '@dhis2-ui/menu'
+export * from '@dhis2-ui/modal'
+export * from '@dhis2-ui/node'
+export * from '@dhis2-ui/notice-box'
+export * from '@dhis2-ui/organisation-unit-tree'
+export * from '@dhis2-ui/popover'
+export { Popper, PopperProps } from '@dhis2-ui/popper'
+export * from '@dhis2-ui/portal'
+export * from '@dhis2-ui/radio'
+export * from '@dhis2-ui/required'
+export { Pagination, PaginationProps } from '@dhis2-ui/pagination'
+export * from '@dhis2-ui/sharing-dialog'
+export {
+    SingleSelect,
+    SingleSelectField,
+    SingleSelectOption,
+    MultiSelect,
+    MultiSelectField,
+    MultiSelectOption,
+    SingleSelectProps,
+    SingleSelectFieldProps,
+    SingleSelectOptionProps,
+    MultiSelectProps,
+    MultiSelectFieldProps,
+    MultiSelectOptionProps,
+} from '@dhis2-ui/select'
+export * from '@dhis2-ui/selector-bar'
+export * from '@dhis2-ui/switch'
+export * from '@dhis2-ui/table'
+export * from '@dhis2-ui/tab'
+export * from '@dhis2-ui/tag'
+export * from '@dhis2-ui/text-area'
+export * from '@dhis2-ui/tooltip'
+export * from '@dhis2-ui/transfer'
+export * from '@dhis2-ui/user-avatar'
+export * from '@dhis2-ui/segmented-control'

components/alert/package.json

@@ -39,11 +39,13 @@
         "prop-types": "^15.7.2"
     },
     "files": [
-        "build"
+        "build",
+        "types"
     ],
     "devDependencies": {
         "react": "16.13",
         "react-dom": "16.13",
         "styled-jsx": "^4.0.1"
-    }
+    },
+    "types": "types"
 }

components/alert/types/index.d.ts

@@ -0,0 +1,49 @@
+import * as React from 'react'
+
+export interface ActionsAction {
+    label: string
+    onClick: React.MouseEventHandler<HTMLSpanElement>
+}
+
+type ActionActionTuple = [ActionsAction?, ActionsAction?]
+
+export interface AlertBarProps {
+    /**
+     * An array of 0-2 action objects
+     */
+    actions?: ActionActionTuple
+    /**
+     * The message string for the alert
+     */
+    children?: string
+    className?: string
+    /**
+     * Alert bars with `critical` will not autohide
+     */
+    critical?: boolean
+    dataTest?: string
+    duration?: number
+    hidden?: boolean
+    /**
+     * A specific icon to override the default icon in the bar.
+     * If `false` is provided, no icon will be shown.
+     */
+    icon?: Element | boolean
+    permanent?: boolean
+    success?: boolean
+    /**
+     * Alert bars with `warning` will not autohide
+     */
+    warning?: boolean
+    onHidden?: (arg0: {}, argv1: null) => void
+}
+
+export const AlertBar: React.FC<AlertBarProps>
+
+export interface AlertStackProps {
+    children?: React.ReactNode
+    className?: string
+    dataTest?: string
+}
+
+export const AlertStack: React.FC<AlertStackProps>

components/box/package.json

@@ -37,11 +37,13 @@
         "prop-types": "^15.7.2"
     },
     "files": [
-        "build"
+        "build",
+        "types"
     ],
     "devDependencies": {
         "react": "16.13",
         "react-dom": "16.13",
         "styled-jsx": "^4.0.1"
-    }
+    },
+    "types": "types"
 }

components/box/types/index.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react'
+
+export interface BoxProps {
+    children?: React.ReactNode
+    className?: string
+    dataTest?: string
+    height?: string
+    marginTop?: string
+    maxHeight?: string
+    maxWidth?: string
+    minHeight?: string
+    minWidth?: string
+    overflow?: string
+    width?: string
+}
+
+export const Box: React.FC<BoxProps>

components/button/package.json

@@ -41,11 +41,13 @@
         "prop-types": "^15.7.2"
     },
     "files": [
-        "build"
+        "build",
+        "types"
     ],
     "devDependencies": {
         "react": "16.13",
         "react-dom": "16.13",
         "styled-jsx": "^4.0.1"
-    }
+    },
+    "types": "types"
 }