-
Notifications
You must be signed in to change notification settings - Fork 14
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(types): add type declarations for components #1399
Conversation
🚀 Deployed on https://pr-1399--dhis2-ui.netlify.app |
Passing run #3072 ↗︎Details:
Review all test suite changes for PR #1399 ↗︎ |
constants/index.d.ts
Outdated
| '200' | ||
| '100' | ||
| '050' | ||
export type ColorProp = `${ColorBase}${ColorVariant}` | 'white' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Gotta love template literals
52f70ad
to
37b5892
Compare
components/calendar/index.d.ts
Outdated
/** | ||
* the calendar to use such gregory, ethiopic, nepali - full supported list here: https://github.com/dhis2/multi-calendar-dates/blob/main/src/constants/calendars.ts | ||
*/ | ||
calendar: CalendarPickerOptions['calendar'] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
These are worth a look @kabaros
maxWidth?: string | ||
minHeight?: string | ||
minWidth?: string | ||
overflow?: string |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
* deletions or data changes. | ||
* Mutually exclusive with `primary` and `secondary` props | ||
*/ | ||
destructive?: boolean |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we're not expressing that they are mutually exclusive in the type .. for the future, we can add something like https://github.com/maninak/ts-xor to express that
* Callback to trigger on click. | ||
* Called with args `({ value, name }, event)` | ||
*/ | ||
onClick?: ButtonEventHandler<React.MouseEvent<HTMLButtonElement>> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
soo helpful .. for these custom handlers we have
export const Button: React.FC<ButtonProps> | ||
|
||
export interface ButtonStripProps { | ||
children?: React.ReactNode |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
should children here be something like
type StripChildren = React.ReactElement<ButtonProps> | React.ReactElement<ButtonProps>[];
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hm, I don't think we should be more restrictive than necessary? Wasn't like that in props, and you could eg wrap your buttons in a div.
export const AlertBar: React.FC<AlertBarProps> | ||
|
||
export interface AlertStackProps { | ||
children?: React.ReactNode |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
same .. restrict children to Alert?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This would also be more strict than props. And again, Im usually against being that strict as there are valid reasons for wrapping elements.
export const Field: React.FC<FieldProps> | ||
|
||
export interface FieldGroupProps { | ||
children?: React.ReactNode |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
children could be tightened as well to Field | Field[]
*/ | ||
onBackdropClick?: LayerBackdropClickHandler | ||
/** | ||
* Click handler - DEPRECATED |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
should we use @deprecated
directive to get jsdoc hint (I know it's just copied from the propTypes, but seems useless to just write DEPRECATED like this)
React.KeyboardEvent<HTMLInputElement> | ||
> | ||
|
||
export interface FileInputProps { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
for all of these, we should also create types for the React Final Forms wrappers, right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I focused on components for now. Can take a look.
@@ -0,0 +1,42 @@ | |||
import * as React from 'react' | |||
import { StrictModifier } from 'react-popper' | |||
import { VirtualElement, Options as PopperOptions } from '@popperjs/core' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nice to finally be able to reference the actual types
@@ -0,0 +1,43 @@ | |||
import * as React from 'react' | |||
import { LayerBackdropClickHandler } from '@dhis2-ui/layer' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
will this type be picked up properly the way we're publishing the types? (I couldn't get it to work locally) ..
(same comment in other places importing from @dhis2-u/...
)
rereading how things are built, it should be picked up
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
should we also type other methods exposed here (that are not components), i.e. getReferenceElement
, getBaseModifiers
, usePopper
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
They're not exposed from collections/ui. And thus considered internal for now. But yeah, ideally they would be.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It all looks good to me 👏🏿 - the only things I am requesting changes for are the missing types. The rest is just FYI.
children?: React.ReactNode | ||
className?: string | ||
dataTest?: string | ||
role?: string |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
msising loading: boolean
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Table
does not have loading
property (only DataTableBody
.
|
||
export const StackedTable: React.FC<StackedTableProps> | ||
|
||
/** DATATABLE */ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
not sure why DataTable types are not under DataTable component to follow the other patterns?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Currently this follows the same pattern. The table folder-structure is a bit more nested than others. I've just added types to the root package - not to the nested folders within a package. And DataTable
and Table
are in the same component package (Table
).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Select
…unit-tree refactor: add missing / fix types & rename components to match public export
…sfer chore(transferoption): add missing onClick/onDoubleClick prop TS types
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
My change requests have been implemented. Unblocking merging the PR from my side
## [8.14.2-alpha.1](v8.14.1...v8.14.2-alpha.1) (2023-10-12) ### Bug Fixes * **types:** add type declarations for components ([#1399](#1399)) ([d3e74c5](d3e74c5))
# [8.16.0-alpha.1](v8.15.0...v8.16.0-alpha.1) (2023-11-28) ### Bug Fixes * **package:** include types in exports field ([e16036b](e16036b)) * minor type fixes ([#1416](#1416)) ([71f4537](71f4537)) * **types:** add type declarations for components ([#1399](#1399)) ([d3e74c5](d3e74c5)) ### Features * **types:** add types for forms collection ([#1415](#1415)) ([2e9d91a](2e9d91a))
* 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 <[email protected]> Co-authored-by: Jan-Gerke Salomon <[email protected]> * chore(release): cut 8.14.2-alpha.1 [skip release] ## [8.14.2-alpha.1](v8.14.1...v8.14.2-alpha.1) (2023-10-12) ### Bug Fixes * **types:** add type declarations for components ([#1399](#1399)) ([d3e74c5](d3e74c5)) * feat(types): add types for forms collection (#1415) * feat: add types for FF field-wrappers * feat(types): add types for transformers and validators * fix: mirror folder-structure for types * fix: remove old-types structure * fix(types): cleanup * style: run prettier * refactor: rename overridden type name to rest * style: run prettier * fix(types): make selected payload always present * chore(release): cut 8.15.0-alpha.1 [skip release] # [8.15.0-alpha.1](v8.14.2-alpha.1...v8.15.0-alpha.1) (2023-10-19) ### Features * **types:** add types for forms collection ([#1415](#1415)) ([2e9d91a](2e9d91a)) * fix: minor type fixes (#1416) * fix(types): make value and name always present in eventpayload * fix(types): export payloads and handlers * style: run prettier * chore(release): cut 8.15.0-alpha.2 [skip release] # [8.15.0-alpha.2](v8.15.0-alpha.1...v8.15.0-alpha.2) (2023-10-20) ### Bug Fixes * minor type fixes ([#1416](#1416)) ([71f4537](71f4537)) * chore(changelog): merge changelog correctly * fix(package): include types in exports field * chore(release): cut 8.15.0-alpha.3 [skip release] # [8.15.0-alpha.3](v8.15.0-alpha.2...v8.15.0-alpha.3) (2023-11-20) ### Bug Fixes * **package:** include types in exports field ([e16036b](e16036b)) * **pagination:** add row padding on small screens and demo stories ([b373859](b373859)) * **portal:** get default mount node at execution time ([20ab2ca](20ab2ca)) * **translations:** sync translations from transifex (master) ([f7cc472](f7cc472)) * **translations:** sync translations from transifex (master) ([7ea15fe](7ea15fe)) * **translations:** sync translations from transifex (master) ([fb22f68](fb22f68)) * **translations:** sync translations from transifex (master) ([071453c](071453c)) * **translations:** sync translations from transifex (master) ([4a8b0b3](4a8b0b3)) * **translations:** sync translations from transifex (master) ([ac1b242](ac1b242)) * **translations:** sync translations from transifex (master) ([28e0da7](28e0da7)) * chore(changelog): merge changelog * chore(release): cut 8.16.0-alpha.1 [skip release] # [8.16.0-alpha.1](v8.15.0...v8.16.0-alpha.1) (2023-11-28) ### Bug Fixes * **package:** include types in exports field ([e16036b](e16036b)) * minor type fixes ([#1416](#1416)) ([71f4537](71f4537)) * **types:** add type declarations for components ([#1399](#1399)) ([d3e74c5](d3e74c5)) ### Features * **types:** add types for forms collection ([#1415](#1415)) ([2e9d91a](2e9d91a)) * fix(types): minor type fixes (#1434) [skip release] * fix(types): add types for sharedPropTypes * docs(types): align type comments with propTypes * chore(changelog): align changelog with master * chore(release): cut 8.16.0-alpha.2 [skip release] # [8.16.0-alpha.2](v8.16.0-alpha.1...v8.16.0-alpha.2) (2023-11-29) ### Bug Fixes * **prop-type:** fix deprecation of buttonVariantPropType ([#1433](#1433)) ([81644a8](81644a8)) * **types:** minor type fixes ([#1434](#1434)) [skip release] ([5e1068d](5e1068d)) --------- Co-authored-by: Jan-Gerke Salomon <[email protected]> Co-authored-by: Jan-Gerke Salomon <[email protected]> Co-authored-by: @dhis2-bot <[email protected]>
# [9.0.0](v8.16.0...v9.0.0) (2023-12-08) ### Bug Fixes * **constants:** remove buttonVariantProptype from constants ([#1436](#1436)) ([d4dc535](d4dc535)) * **package:** include types in exports field ([e16036b](e16036b)) * **types:** add type declarations for components ([#1399](#1399)) ([d3e74c5](d3e74c5)) * **types:** minor type fixes ([#1434](#1434)) [skip release] ([5e1068d](5e1068d)) * minor type fixes ([#1416](#1416)) ([71f4537](71f4537)) ### Features * **types:** add types for forms collection ([#1415](#1415)) ([2e9d91a](2e9d91a)) ### BREAKING CHANGES * **constants:** `buttonVariantPropType` has been removed from constants. This is mostly intended for internal use, but was part of the public API.
Adds type declarations for the public API of all components.
https://dhis2.atlassian.net/browse/LIBS-527
Todos:
types
to files-prop in package.jsonstypes
totypes
: property inpackage.json
sPublic-facing components, hooks & functions
The types of the following units need to be verified by the reviewers:
[x] InputFieldProps