From f4bda7d8166c381e019ddcbb54d80fadc0f3f715 Mon Sep 17 00:00:00 2001 From: olfedias Date: Mon, 3 Dec 2018 13:22:50 +0200 Subject: [PATCH 1/6] update deps and add nullable type --- package.json | 6 ++-- src/components/Accordion/Accordion.tsx | 4 +-- src/components/Accordion/AccordionContent.tsx | 4 +-- src/components/Accordion/AccordionTitle.tsx | 4 +-- src/components/Animation/Animation.tsx | 3 +- src/components/Attachment/Attachment.tsx | 4 +-- src/components/Avatar/Avatar.tsx | 4 +-- src/components/Button/Button.tsx | 4 +-- src/components/Button/ButtonGroup.tsx | 4 +-- src/components/Chat/Chat.tsx | 4 +-- src/components/Chat/ChatItem.tsx | 4 +-- src/components/Chat/ChatMessage.tsx | 4 +-- src/components/Divider/Divider.tsx | 4 +-- src/components/Form/Form.tsx | 4 +-- src/components/Form/FormField.tsx | 4 +-- src/components/Grid/Grid.tsx | 4 +-- src/components/Header/Header.tsx | 4 +-- src/components/Header/HeaderDescription.tsx | 4 +-- src/components/Icon/Icon.tsx | 4 +-- src/components/Image/Image.tsx | 4 +-- src/components/Input/Input.tsx | 4 +-- src/components/ItemLayout/ItemLayout.tsx | 4 +-- src/components/Label/Label.tsx | 4 +-- src/components/Layout/Layout.tsx | 4 +-- src/components/List/List.tsx | 4 +-- src/components/List/ListItem.tsx | 4 +-- src/components/Menu/Menu.tsx | 4 +-- src/components/Menu/MenuItem.tsx | 4 +-- src/components/Popup/Popup.tsx | 4 +-- src/components/Popup/PopupContent.tsx | 4 +-- src/components/Portal/Portal.tsx | 3 +- src/components/Portal/PortalInner.tsx | 3 +- src/components/RadioGroup/RadioGroup.tsx | 4 +-- src/components/RadioGroup/RadioGroupItem.tsx | 4 +-- src/components/Ref/Ref.tsx | 5 +-- src/components/Segment/Segment.tsx | 4 +-- src/components/Slot/Slot.tsx | 3 +- src/components/Status/Status.tsx | 4 +-- src/components/Text/Text.tsx | 4 +-- src/components/Tree/Tree.tsx | 4 +-- src/components/Tree/TreeItem.tsx | 4 +-- src/components/Tree/TreeTitle.tsx | 3 +- .../accessibility/FocusZone/FocusTrapZone.tsx | 7 ++++- .../FocusZone/FocusTrapZone.types.tsx | 2 ++ src/lib/accessibility/FocusZone/FocusZone.tsx | 7 ++++- src/lib/customPropTypes.tsx | 3 +- src/lib/{factories.tsx => factories.ts} | 4 +-- src/lib/renderComponent.tsx | 4 +-- .../commonTests/implementsWrapperProp.tsx | 10 ++++-- test/specs/lib/factories-test.tsx | 4 +-- test/specs/lib/handleRef-test.ts | 3 +- types/utils.d.ts | 7 +++++ yarn.lock | 31 +++++++++++-------- 53 files changed, 142 insertions(+), 106 deletions(-) rename src/lib/{factories.tsx => factories.ts} (97%) diff --git a/package.json b/package.json index 75c2f3976d..5367c7d21e 100644 --- a/package.json +++ b/package.json @@ -82,9 +82,9 @@ "@types/jest-axe": "^2.2.2", "@types/lodash": "^4.14.118", "@types/node": "^10.3.2", - "@types/react": "^16.3.17", + "@types/react": "^16.7.17", "@types/react-custom-scrollbars": "^4.0.5", - "@types/react-dom": "^16.0.6", + "@types/react-dom": "^16.0.11", "@types/react-is": "^16.5.0", "@types/react-router": "^4.0.27", "awesome-typescript-loader": "^5.2.1", @@ -151,7 +151,7 @@ "ts-node": "^6.1.0", "tslint": "^5.11.0", "tslint-config-airbnb": "^5.11.1", - "typescript": "~3.1.0", + "typescript": "~3.2.2", "webpack": "^4.25.1", "webpack-dev-middleware": "^3.4.0", "webpack-hot-middleware": "^2.18.2" diff --git a/src/components/Accordion/Accordion.tsx b/src/components/Accordion/Accordion.tsx index 940a4598ba..34180ccf86 100644 --- a/src/components/Accordion/Accordion.tsx +++ b/src/components/Accordion/Accordion.tsx @@ -17,7 +17,7 @@ import { Accessibility } from '../../lib/accessibility/types' import { ComponentEventHandler, - Extendable, + ReactProps, ShorthandValue, ShorthandRenderFunction, } from '../../../types/utils' @@ -72,7 +72,7 @@ export interface AccordionProps extends UIComponentProps, ChildrenComponentProps /** * An accordion allows users to toggle the display of sections of content. */ -class Accordion extends AutoControlledComponent, any> { +class Accordion extends AutoControlledComponent, any> { static displayName = 'Accordion' static className = 'ui-accordion' diff --git a/src/components/Accordion/AccordionContent.tsx b/src/components/Accordion/AccordionContent.tsx index 88bb83539a..c5b959fcc8 100644 --- a/src/components/Accordion/AccordionContent.tsx +++ b/src/components/Accordion/AccordionContent.tsx @@ -10,7 +10,7 @@ import { ContentComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ComponentEventHandler } from '../../../types/utils' +import { ReactProps, ComponentEventHandler } from '../../../types/utils' export interface AccordionContentProps extends UIComponentProps, @@ -31,7 +31,7 @@ export interface AccordionContentProps /** * A standard AccordionContent. */ -class AccordionContent extends UIComponent, any> { +class AccordionContent extends UIComponent, any> { static displayName = 'AccordionContent' static create: Function diff --git a/src/components/Accordion/AccordionTitle.tsx b/src/components/Accordion/AccordionTitle.tsx index 46309e238d..8502275595 100644 --- a/src/components/Accordion/AccordionTitle.tsx +++ b/src/components/Accordion/AccordionTitle.tsx @@ -11,7 +11,7 @@ import { ChildrenComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ComponentEventHandler } from '../../../types/utils' +import { ReactProps, ComponentEventHandler } from '../../../types/utils' export interface AccordionTitleProps extends UIComponentProps, @@ -35,7 +35,7 @@ export interface AccordionTitleProps /** * A standard AccordionTitle. */ -class AccordionTitle extends UIComponent, any> { +class AccordionTitle extends UIComponent, any> { static displayName = 'AccordionTitle' static create: Function diff --git a/src/components/Animation/Animation.tsx b/src/components/Animation/Animation.tsx index 082cdefc8a..b4c0426be8 100644 --- a/src/components/Animation/Animation.tsx +++ b/src/components/Animation/Animation.tsx @@ -10,6 +10,7 @@ import { } from '../../lib' import { AnimationProp } from '../../themes/types' import createAnimationStyles from '../../lib/createAnimationStyles' +import { ReactPropsStrict } from '../../../types/utils' export interface AnimationProps extends StyledComponentProps, @@ -78,7 +79,7 @@ export interface AnimationProps /** * An animation allows the user to animate their own components. */ -class Animation extends UIComponent { +class Animation extends UIComponent, any> { static create: Function static className = 'ui-animation' diff --git a/src/components/Attachment/Attachment.tsx b/src/components/Attachment/Attachment.tsx index 37839624b8..3c6ccc8910 100644 --- a/src/components/Attachment/Attachment.tsx +++ b/src/components/Attachment/Attachment.tsx @@ -1,7 +1,7 @@ import * as PropTypes from 'prop-types' import * as React from 'react' import * as _ from 'lodash' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { UIComponent, customPropTypes, @@ -38,7 +38,7 @@ export interface AttachmentProps extends UIComponentProps, ChildrenComponentProp /** * An Attachment displays a file attachment. */ -class Attachment extends UIComponent, any> { +class Attachment extends UIComponent, any> { static create: Function static className = 'ui-attachment' diff --git a/src/components/Avatar/Avatar.tsx b/src/components/Avatar/Avatar.tsx index 154ab22807..6874c20236 100644 --- a/src/components/Avatar/Avatar.tsx +++ b/src/components/Avatar/Avatar.tsx @@ -3,7 +3,7 @@ import * as React from 'react' import Image from '../Image/Image' import Label from '../Label/Label' import Status from '../Status/Status' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { createShorthandFactory, customPropTypes, @@ -35,7 +35,7 @@ export interface AvatarProps extends UIComponentProps { /** * An avatar is a graphic representation of user. */ -class Avatar extends UIComponent, any> { +class Avatar extends UIComponent, any> { static create: Function static className = 'ui-avatar' diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx index a92690177a..b55aacf8d5 100644 --- a/src/components/Button/Button.tsx +++ b/src/components/Button/Button.tsx @@ -17,7 +17,7 @@ import Icon from '../Icon/Icon' import Slot from '../Slot/Slot' import { buttonBehavior } from '../../lib/accessibility' import { Accessibility } from '../../lib/accessibility/types' -import { ComponentEventHandler, Extendable, ShorthandValue } from '../../../types/utils' +import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../../types/utils' import ButtonGroup from './ButtonGroup' export interface ButtonProps @@ -83,7 +83,7 @@ export interface ButtonState { * - for disabled buttons, add 'disabled' attribute so that the state is properly recognized by the screen reader * - if button includes icon only, textual representation needs to be provided by using 'title', 'aria-label', or 'aria-labelledby' attributes */ -class Button extends UIComponent, ButtonState> { +class Button extends UIComponent, ButtonState> { static create: Function public static displayName = 'Button' diff --git a/src/components/Button/ButtonGroup.tsx b/src/components/Button/ButtonGroup.tsx index a5bbe40fbd..6e1844f132 100644 --- a/src/components/Button/ButtonGroup.tsx +++ b/src/components/Button/ButtonGroup.tsx @@ -2,7 +2,7 @@ import * as PropTypes from 'prop-types' import * as React from 'react' import * as _ from 'lodash' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { UIComponent, childrenExist, @@ -28,7 +28,7 @@ export interface ButtonGroupProps /** * A button group presents multiple related actions. */ -class ButtonGroup extends UIComponent, any> { +class ButtonGroup extends UIComponent, any> { public static displayName = 'ButtonGroup' public static className = 'ui-buttons' diff --git a/src/components/Chat/Chat.tsx b/src/components/Chat/Chat.tsx index db91546580..7a66873032 100644 --- a/src/components/Chat/Chat.tsx +++ b/src/components/Chat/Chat.tsx @@ -5,7 +5,7 @@ import * as React from 'react' import { childrenExist, customPropTypes, UIComponent, commonPropTypes } from '../../lib' import ChatItem from './ChatItem' import ChatMessage from './ChatMessage' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { Accessibility, AccessibilityActionHandlers } from '../../lib/accessibility/types' import { chatBehavior } from '../../lib/accessibility' import { UIComponentProps, ChildrenComponentProps } from '../../lib/commonPropInterfaces' @@ -24,7 +24,7 @@ export interface ChatProps extends UIComponentProps, ChildrenComponentProps { /** * A Chat displays messages between users. */ -class Chat extends UIComponent, any> { +class Chat extends UIComponent, any> { static className = 'ui-chat' static displayName = 'Chat' diff --git a/src/components/Chat/ChatItem.tsx b/src/components/Chat/ChatItem.tsx index fee9a407bf..1b03fc30d4 100644 --- a/src/components/Chat/ChatItem.tsx +++ b/src/components/Chat/ChatItem.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import * as PropTypes from 'prop-types' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { childrenExist, createShorthandFactory, @@ -29,7 +29,7 @@ export interface ChatItemProps extends UIComponentProps, ChildrenComponentProps /** * A chat item represents a single event in a chat. */ -class ChatItem extends UIComponent, any> { +class ChatItem extends UIComponent, any> { static className = 'ui-chat__item' static create: Function static displayName = 'ChatItem' diff --git a/src/components/Chat/ChatMessage.tsx b/src/components/Chat/ChatMessage.tsx index 97ae4d69a5..f4af94d353 100644 --- a/src/components/Chat/ChatMessage.tsx +++ b/src/components/Chat/ChatMessage.tsx @@ -13,7 +13,7 @@ import { ContentComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import { chatMessageBehavior } from '../../lib/accessibility' import { Accessibility, AccessibilityActionHandlers } from '../../lib/accessibility/types' @@ -43,7 +43,7 @@ export interface ChatMessageProps /** * A chat message represents a single statement communicated to a user. */ -class ChatMessage extends UIComponent, any> { +class ChatMessage extends UIComponent, any> { static className = 'ui-chat__message' static create: Function diff --git a/src/components/Divider/Divider.tsx b/src/components/Divider/Divider.tsx index d730f46f23..2fde5c8b57 100644 --- a/src/components/Divider/Divider.tsx +++ b/src/components/Divider/Divider.tsx @@ -11,7 +11,7 @@ import { ContentComponentProps, commonPropTypes, } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface DividerProps extends UIComponentProps, @@ -31,7 +31,7 @@ export interface DividerProps /** * A divider visually segments content into groups. */ -class Divider extends UIComponent, any> { +class Divider extends UIComponent, any> { static displayName = 'Divider' static create: Function diff --git a/src/components/Form/Form.tsx b/src/components/Form/Form.tsx index da0bf853d7..56f6f4a5e0 100644 --- a/src/components/Form/Form.tsx +++ b/src/components/Form/Form.tsx @@ -10,7 +10,7 @@ import { ChildrenComponentProps, commonPropTypes, } from '../../lib' -import { ComponentEventHandler, Extendable, ShorthandValue } from '../../../types/utils' +import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../../types/utils' import FormField from './FormField' export interface FormProps extends UIComponentProps, ChildrenComponentProps { @@ -33,7 +33,7 @@ export interface FormProps extends UIComponentProps, ChildrenComponentProps { * @accessibility * Label needs to be provided by using 'aria-label', or 'aria-labelledby' attributes on the
element. */ -class Form extends UIComponent, any> { +class Form extends UIComponent, any> { static create: Function public static displayName = 'Form' diff --git a/src/components/Form/FormField.tsx b/src/components/Form/FormField.tsx index de17dfb17f..ce6a05239b 100644 --- a/src/components/Form/FormField.tsx +++ b/src/components/Form/FormField.tsx @@ -10,7 +10,7 @@ import { ChildrenComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import Text from '../Text/Text' import Input from '../Input/Input' import Slot from '../Slot/Slot' @@ -44,7 +44,7 @@ export interface FormFieldProps extends UIComponentProps, ChildrenComponentProps /** * A field is a form element containing a label and an input. */ -class FormField extends UIComponent, any> { +class FormField extends UIComponent, any> { public static displayName = 'FormField' public static className = 'ui-form__field' diff --git a/src/components/Grid/Grid.tsx b/src/components/Grid/Grid.tsx index cfece857f8..21d357203b 100644 --- a/src/components/Grid/Grid.tsx +++ b/src/components/Grid/Grid.tsx @@ -10,7 +10,7 @@ import { commonPropTypes, ContentComponentProps, } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' import { Accessibility } from '../../lib/accessibility/types' import { defaultBehavior } from '../../lib/accessibility' import ReactNode = React.ReactNode @@ -38,7 +38,7 @@ export interface GridProps * @accessibility This is example usage of the accessibility tag. * This should be replaced with the actual description after the PR is merged */ -class Grid extends UIComponent, any> { +class Grid extends UIComponent, any> { public static displayName = 'Grid' public static className = 'ui-grid' diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index d9ade9af52..c863c58caf 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -11,7 +11,7 @@ import { commonPropTypes, } from '../../lib' import HeaderDescription from './HeaderDescription' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' export interface HeaderProps extends UIComponentProps, @@ -34,7 +34,7 @@ export interface HeaderProps * - when the description property is used in header, readers will narrate both header content and description within the element. * In addition to that, both will be displayed in the list of headings. */ -class Header extends UIComponent, any> { +class Header extends UIComponent, any> { static className = 'ui-header' static displayName = 'Header' diff --git a/src/components/Header/HeaderDescription.tsx b/src/components/Header/HeaderDescription.tsx index 1943948043..f255b8b37a 100644 --- a/src/components/Header/HeaderDescription.tsx +++ b/src/components/Header/HeaderDescription.tsx @@ -9,7 +9,7 @@ import { ContentComponentProps, commonPropTypes, } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface HeaderDescriptionProps extends UIComponentProps, @@ -19,7 +19,7 @@ export interface HeaderDescriptionProps /** * A header's description provides more detailed information. */ -class HeaderDescription extends UIComponent, any> { +class HeaderDescription extends UIComponent, any> { static create: Function static className = 'ui-header__description' diff --git a/src/components/Icon/Icon.tsx b/src/components/Icon/Icon.tsx index 5102292f82..46ec5c1a09 100644 --- a/src/components/Icon/Icon.tsx +++ b/src/components/Icon/Icon.tsx @@ -11,7 +11,7 @@ import { iconBehavior } from '../../lib/accessibility/' import { Accessibility } from '../../lib/accessibility/types' import { SvgIconSpec } from '../../themes/types' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export type IconXSpacing = 'none' | 'before' | 'after' | 'both' export type IconSize = @@ -54,7 +54,7 @@ export interface IconProps extends UIComponentProps { /** * An icon is a glyph used to represent something else. */ -class Icon extends UIComponent, any> { +class Icon extends UIComponent, any> { static create: Function static className = 'ui-icon' diff --git a/src/components/Image/Image.tsx b/src/components/Image/Image.tsx index 738c6bb919..0be7ae81b4 100644 --- a/src/components/Image/Image.tsx +++ b/src/components/Image/Image.tsx @@ -5,7 +5,7 @@ import { createShorthandFactory, UIComponent, UIComponentProps, commonPropTypes import { imageBehavior } from '../../lib/accessibility' import { Accessibility } from '../../lib/accessibility/types' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface ImageProps extends UIComponentProps { /** @@ -37,7 +37,7 @@ export interface ImageProps extends UIComponentProps { * - when image has role='presentation' then screen readers navigate to the element in scan/virtual mode. To avoid this, the attribute "aria-hidden='true'" is applied by the default image behavior * - when alt property is used in combination with aria-label, arialabbeledby or title, additional screen readers verification is needed as each screen reader handles this combination differently. */ -class Image extends UIComponent, any> { +class Image extends UIComponent, any> { static create: Function static className = 'ui-image' diff --git a/src/components/Input/Input.tsx b/src/components/Input/Input.tsx index 2b649e03c0..8eee55fa30 100644 --- a/src/components/Input/Input.tsx +++ b/src/components/Input/Input.tsx @@ -12,7 +12,7 @@ import { ChildrenComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue, ComponentEventHandler } from '../../../types/utils' +import { ReactProps, ShorthandValue, ComponentEventHandler } from '../../../types/utils' import Icon from '../Icon/Icon' import Ref from '../Ref/Ref' import Slot from '../Slot/Slot' @@ -76,7 +76,7 @@ export interface InputState { * Other considerations: * - if input is search, then use "role='search'" */ -class Input extends AutoControlledComponent, InputState> { +class Input extends AutoControlledComponent, InputState> { private inputDomElement: HTMLInputElement static className = 'ui-input' diff --git a/src/components/ItemLayout/ItemLayout.tsx b/src/components/ItemLayout/ItemLayout.tsx index 33feb9d309..5dd851f707 100644 --- a/src/components/ItemLayout/ItemLayout.tsx +++ b/src/components/ItemLayout/ItemLayout.tsx @@ -12,7 +12,7 @@ import { } from '../../lib' import Layout from '../Layout/Layout' import { ComponentSlotClasses, ICSSInJSStyle } from '../../themes/types' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface ItemLayoutProps extends UIComponentProps, ContentComponentProps { contentMedia?: any @@ -58,7 +58,7 @@ export interface ItemLayoutProps extends UIComponentProps, ContentComponentProps /** * The Item Layout handles layout styles for menu items, list items and other similar item templates. */ -class ItemLayout extends UIComponent, any> { +class ItemLayout extends UIComponent, any> { static create: Function static displayName = 'ItemLayout' diff --git a/src/components/Label/Label.tsx b/src/components/Label/Label.tsx index eb04276c41..971c94a387 100644 --- a/src/components/Label/Label.tsx +++ b/src/components/Label/Label.tsx @@ -17,7 +17,7 @@ import Icon from '../Icon/Icon' import Image from '../Image/Image' import Layout from '../Layout/Layout' import { Accessibility } from '../../lib/accessibility/types' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' export interface LabelProps extends UIComponentProps, @@ -47,7 +47,7 @@ export interface LabelProps /** * A label is used to classify content. */ -class Label extends UIComponent, any> { +class Label extends UIComponent, any> { static displayName = 'Label' static create: Function diff --git a/src/components/Layout/Layout.tsx b/src/components/Layout/Layout.tsx index 15f5720cdc..923e94a32e 100644 --- a/src/components/Layout/Layout.tsx +++ b/src/components/Layout/Layout.tsx @@ -3,7 +3,7 @@ import * as PropTypes from 'prop-types' import cx from 'classnames' import { UIComponent, UIComponentProps, commonPropTypes } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' import { ICSSInJSStyle } from '../../themes/types' export interface LayoutProps extends UIComponentProps { @@ -42,7 +42,7 @@ export interface LayoutProps extends UIComponentProps { /** * A layout is a utility for arranging the content of a component. */ -class Layout extends UIComponent, any> { +class Layout extends UIComponent, any> { static className = 'ui-layout' static displayName = 'Layout' diff --git a/src/components/List/List.tsx b/src/components/List/List.tsx index cee47f7d2e..55b10b8345 100644 --- a/src/components/List/List.tsx +++ b/src/components/List/List.tsx @@ -15,7 +15,7 @@ import ListItem from './ListItem' import { listBehavior } from '../../lib/accessibility' import { Accessibility, AccessibilityActionHandlers } from '../../lib/accessibility/types' import { ContainerFocusHandler } from '../../lib/accessibility/FocusHandling/FocusContainer' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' export interface ListProps extends UIComponentProps, ChildrenComponentProps { /** @@ -47,7 +47,7 @@ export interface ListState { /** * A list displays a group of related content. */ -class List extends UIComponent, ListState> { +class List extends UIComponent, ListState> { static displayName = 'List' static className = 'ui-list' diff --git a/src/components/List/ListItem.tsx b/src/components/List/ListItem.tsx index febdea30d7..518574977e 100644 --- a/src/components/List/ListItem.tsx +++ b/src/components/List/ListItem.tsx @@ -11,7 +11,7 @@ import { import ItemLayout from '../ItemLayout/ItemLayout' import { listItemBehavior } from '../../lib/accessibility' import { Accessibility } from '../../lib/accessibility/types' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface ListItemProps extends UIComponentProps, ContentComponentProps { /** @@ -43,7 +43,7 @@ export interface ListItemState { /** * A list item contains a single piece of content within a list. */ -class ListItem extends UIComponent, ListItemState> { +class ListItem extends UIComponent, ListItemState> { static create: Function static displayName = 'ListItem' diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx index 0aa98d68aa..d69a1bb7e4 100644 --- a/src/components/Menu/Menu.tsx +++ b/src/components/Menu/Menu.tsx @@ -15,7 +15,7 @@ import { menuBehavior } from '../../lib/accessibility' import { Accessibility } from '../../lib/accessibility/types' import { ComponentVariablesObject } from '../../themes/types' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' export interface MenuProps extends UIComponentProps, ChildrenComponentProps { /** @@ -65,7 +65,7 @@ export interface MenuProps extends UIComponentProps, ChildrenComponentProps { /** * A menu displays grouped navigation actions. */ -class Menu extends AutoControlledComponent, any> { +class Menu extends AutoControlledComponent, any> { static displayName = 'Menu' static className = 'ui-menu' diff --git a/src/components/Menu/MenuItem.tsx b/src/components/Menu/MenuItem.tsx index 7b7837c0a9..79299ddf5c 100644 --- a/src/components/Menu/MenuItem.tsx +++ b/src/components/Menu/MenuItem.tsx @@ -18,7 +18,7 @@ import Icon from '../Icon/Icon' import Slot from '../Slot/Slot' import { menuItemBehavior } from '../../lib/accessibility' import { Accessibility, AccessibilityActionHandlers } from '../../lib/accessibility/types' -import { ComponentEventHandler, Extendable, ShorthandValue } from '../../../types/utils' +import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../../types/utils' export interface MenuItemProps extends UIComponentProps, @@ -87,7 +87,7 @@ export interface MenuItemState { /** * A menu item is an actionable navigation item within a menu. */ -class MenuItem extends UIComponent, MenuItemState> { +class MenuItem extends UIComponent, MenuItemState> { static displayName = 'MenuItem' static className = 'ui-menu__item' diff --git a/src/components/Popup/Popup.tsx b/src/components/Popup/Popup.tsx index 3876f75dde..352c2ce55f 100644 --- a/src/components/Popup/Popup.tsx +++ b/src/components/Popup/Popup.tsx @@ -15,7 +15,7 @@ import { StyledComponentProps, commonPropTypes, } from '../../lib' -import { ComponentEventHandler, Extendable, ShorthandValue } from '../../../types/utils' +import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../../types/utils' import Ref from '../Ref/Ref' import computePopupPlacement, { Alignment, Position } from './positioningHelper' @@ -102,7 +102,7 @@ export interface PopupState { * @accessibility This is example usage of the accessibility tag. * This should be replaced with the actual description after the PR is merged */ -export default class Popup extends AutoControlledComponent, PopupState> { +export default class Popup extends AutoControlledComponent, PopupState> { public static displayName = 'Popup' public static className = 'ui-popup' diff --git a/src/components/Popup/PopupContent.tsx b/src/components/Popup/PopupContent.tsx index 5aa7836e9f..2983a0518c 100644 --- a/src/components/Popup/PopupContent.tsx +++ b/src/components/Popup/PopupContent.tsx @@ -10,7 +10,7 @@ import { ContentComponentProps, commonPropTypes, } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface PopupContentProps extends UIComponentProps, @@ -22,7 +22,7 @@ export interface PopupContentProps * @accessibility This is example usage of the accessibility tag. * This should be replaced with the actual description after the PR is merged */ -class PopupContent extends UIComponent, any> { +class PopupContent extends UIComponent, any> { public static create: Function public static displayName = 'PopupContent' diff --git a/src/components/Portal/Portal.tsx b/src/components/Portal/Portal.tsx index 4b5b63c65e..8e99a2dc7f 100644 --- a/src/components/Portal/Portal.tsx +++ b/src/components/Portal/Portal.tsx @@ -15,6 +15,7 @@ import Ref from '../Ref/Ref' import PortalInner from './PortalInner' import { FocusTrapZone, FocusTrapZoneProps } from '../../lib/accessibility/FocusZone' import { AccessibilityAttributes, OnKeyDownHandler } from '../../lib/accessibility/types' +import { ReactPropsStrict } from '../../../types/utils' type ReactMouseEvent = React.MouseEvent export type TriggerAccessibility = { @@ -81,7 +82,7 @@ export interface PortalState { /** * A component that allows you to render children outside their parent. */ -class Portal extends AutoControlledComponent { +class Portal extends AutoControlledComponent, PortalState> { private portalNode: HTMLElement private triggerNode: HTMLElement diff --git a/src/components/Portal/PortalInner.tsx b/src/components/Portal/PortalInner.tsx index 028ff173c1..55ab9eda88 100644 --- a/src/components/Portal/PortalInner.tsx +++ b/src/components/Portal/PortalInner.tsx @@ -3,6 +3,7 @@ import * as _ from 'lodash' import * as React from 'react' import * as ReactDOM from 'react-dom' import { isBrowser, ChildrenComponentProps, commonPropTypes } from '../../lib' +import { ReactPropsStrict } from '../../../types/utils' export interface PortalInnerProps extends ChildrenComponentProps { /** Existing element the portal should be bound to. */ @@ -26,7 +27,7 @@ export interface PortalInnerProps extends ChildrenComponentProps { /** * An inner component that allows you to render children outside their parent. */ -class PortalInner extends React.Component { +class PortalInner extends React.Component> { public static propTypes = { ...commonPropTypes.createCommon({ animated: false, diff --git a/src/components/RadioGroup/RadioGroup.tsx b/src/components/RadioGroup/RadioGroup.tsx index c27ca0ebd4..aae7dd0b02 100644 --- a/src/components/RadioGroup/RadioGroup.tsx +++ b/src/components/RadioGroup/RadioGroup.tsx @@ -15,7 +15,7 @@ import { import RadioGroupItem, { RadioGroupItemProps } from './RadioGroupItem' import { radioGroupBehavior } from '../../lib/accessibility' import { Accessibility, AccessibilityActionHandlers } from '../../lib/accessibility/types' -import { Extendable, ShorthandValue, ComponentEventHandler } from '../../../types/utils' +import { ReactProps, ShorthandValue, ComponentEventHandler } from '../../../types/utils' export interface RadioGroupProps extends UIComponentProps, ChildrenComponentProps { /** @@ -47,7 +47,7 @@ export interface RadioGroupProps extends UIComponentProps, ChildrenComponentProp /** * A radio group allows a user to select a value from a small set of options. */ -class RadioGroup extends AutoControlledComponent, any> { +class RadioGroup extends AutoControlledComponent, any> { static displayName = 'RadioGroup' static className = 'ui-radiogroup' diff --git a/src/components/RadioGroup/RadioGroupItem.tsx b/src/components/RadioGroup/RadioGroupItem.tsx index 2cbd7fd312..509c74d322 100644 --- a/src/components/RadioGroup/RadioGroupItem.tsx +++ b/src/components/RadioGroup/RadioGroupItem.tsx @@ -13,7 +13,7 @@ import { commonPropTypes, } from '../../lib' import Label from '../Label/Label' -import { ComponentEventHandler, Extendable, ShorthandValue } from '../../../types/utils' +import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../../types/utils' import Icon from '../Icon/Icon' import { Accessibility } from '../../lib/accessibility/types' import { radioGroupItemBehavior } from '../../lib/accessibility' @@ -92,7 +92,7 @@ export interface RadioGroupItemState { * Radio items need to be grouped in RadioGroup component to correctly handle accessibility. */ class RadioGroupItem extends AutoControlledComponent< - Extendable, + ReactProps, RadioGroupItemState > { private elementRef: HTMLElement diff --git a/src/components/Ref/Ref.tsx b/src/components/Ref/Ref.tsx index 036d093a00..715daf2a94 100644 --- a/src/components/Ref/Ref.tsx +++ b/src/components/Ref/Ref.tsx @@ -3,6 +3,7 @@ import * as React from 'react' import { isForwardRef } from 'react-is' import { ChildrenComponentProps } from '../../lib' +import { ReactPropsStrict } from '../../../types/utils' import RefFindNode from './RefFindNode' import RefForward from './RefForward' @@ -15,7 +16,7 @@ export interface RefProps extends ChildrenComponentProps innerRef?: React.Ref } -const Ref: React.SFC = props => { +const Ref: React.SFC> = props => { const { children, innerRef } = props const child = React.Children.only(children) @@ -26,7 +27,7 @@ const Ref: React.SFC = props => { Ref.propTypes = { children: PropTypes.element.isRequired, - innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]) as PropTypes.Requireable, } export default Ref diff --git a/src/components/Segment/Segment.tsx b/src/components/Segment/Segment.tsx index 88c358a465..f7a0e16baa 100644 --- a/src/components/Segment/Segment.tsx +++ b/src/components/Segment/Segment.tsx @@ -8,7 +8,7 @@ import { ChildrenComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' import Slot from '../Slot/Slot' export interface SegmentProps @@ -22,7 +22,7 @@ export interface SegmentProps /** * A segment is used to create a grouping of related content. */ -class Segment extends UIComponent, any> { +class Segment extends UIComponent, any> { static className = 'ui-segment' static displayName = 'Segment' diff --git a/src/components/Slot/Slot.tsx b/src/components/Slot/Slot.tsx index d6c4ffb3c9..ac16711ff9 100644 --- a/src/components/Slot/Slot.tsx +++ b/src/components/Slot/Slot.tsx @@ -8,6 +8,7 @@ import { commonPropTypes, } from '../../lib' import createComponent, { CreateComponentReturnType } from '../../lib/createComponent' +import { ReactProps } from '../../../types/utils' export interface SlotProps extends UIComponentProps, @@ -17,7 +18,7 @@ export interface SlotProps /** * A Slot is a basic component (no default styles) */ -const Slot: CreateComponentReturnType & { +const Slot: CreateComponentReturnType> & { create?: Function } = createComponent({ displayName: 'Slot', diff --git a/src/components/Status/Status.tsx b/src/components/Status/Status.tsx index 0bd69637a4..ccb22463a2 100644 --- a/src/components/Status/Status.tsx +++ b/src/components/Status/Status.tsx @@ -9,7 +9,7 @@ import { UIComponentProps, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandValue } from '../../../types/utils' export interface StatusProps extends UIComponentProps { /** A custom color. */ @@ -28,7 +28,7 @@ export interface StatusProps extends UIComponentProps { /** * A status graphically represents someone's or something's state. */ -class Status extends UIComponent, any> { +class Status extends UIComponent, any> { static create: Function static className = 'ui-status' diff --git a/src/components/Text/Text.tsx b/src/components/Text/Text.tsx index 89dd4d8207..881336e39c 100644 --- a/src/components/Text/Text.tsx +++ b/src/components/Text/Text.tsx @@ -11,7 +11,7 @@ import { commonPropTypes, } from '../../lib' -import { Extendable } from '../../../types/utils' +import { ReactProps } from '../../../types/utils' export interface TextProps extends UIComponentProps, ContentComponentProps, ChildrenComponentProps { /** At mentions can be formatted to draw users' attention. Mentions for "me" can be formatted to appear differently. */ @@ -55,7 +55,7 @@ export interface TextProps extends UIComponentProps, ContentComponentProps, Chil * - 'content' is provided as plain string (then dir="auto" attribute will be applied automatically) * - for other 'content' value types (i.e. that use elements inside) ensure that dir="auto" attribute is applied for all places in content where necessary */ -class Text extends UIComponent, any> { +class Text extends UIComponent, any> { static create: Function static className = 'ui-text' diff --git a/src/components/Tree/Tree.tsx b/src/components/Tree/Tree.tsx index 7c5ae98b21..06a8081a87 100644 --- a/src/components/Tree/Tree.tsx +++ b/src/components/Tree/Tree.tsx @@ -10,7 +10,7 @@ import { UIComponentProps, ChildrenComponentProps, } from '../../lib' -import { ShorthandValue, ShorthandRenderFunction } from '../../../types/utils' +import { ShorthandValue, ShorthandRenderFunction, ReactProps } from '../../../types/utils' import { Accessibility } from '../../lib/accessibility/types' import { defaultBehavior } from '../../lib/accessibility' import * as customPropTypes from '../../lib/customPropTypes' @@ -38,7 +38,7 @@ export interface TreeProps extends UIComponentProps, ChildrenComponentProps { /** * Allows users to display data organised in tree-hierarchy. */ -class Tree extends UIComponent { +class Tree extends UIComponent> { static create: Function static className = 'ui-tree' diff --git a/src/components/Tree/TreeItem.tsx b/src/components/Tree/TreeItem.tsx index d1bd961fdd..0452eb1653 100644 --- a/src/components/Tree/TreeItem.tsx +++ b/src/components/Tree/TreeItem.tsx @@ -15,7 +15,7 @@ import { UIComponentProps, ChildrenComponentProps, } from '../../lib' -import { ShorthandRenderFunction, ShorthandValue } from '../../../types/utils' +import { ReactProps, ShorthandRenderFunction, ShorthandValue } from '../../../types/utils' export interface TreeItemProps extends UIComponentProps, ChildrenComponentProps { /** @@ -51,7 +51,7 @@ export interface TreeItemState { open?: boolean } -class TreeItem extends AutoControlledComponent { +class TreeItem extends AutoControlledComponent, TreeItemState> { static create: Function static className = 'ui-tree__item' diff --git a/src/components/Tree/TreeTitle.tsx b/src/components/Tree/TreeTitle.tsx index 7651be6852..6f7235b310 100644 --- a/src/components/Tree/TreeTitle.tsx +++ b/src/components/Tree/TreeTitle.tsx @@ -13,6 +13,7 @@ import { } from '../../lib' import { treeTitleBehavior } from '../../lib/accessibility' import { Accessibility } from '../../lib/accessibility/types' +import { ReactProps } from '../../../types/utils' export interface TreeTitleProps extends UIComponentProps, @@ -31,7 +32,7 @@ export interface TreeTitleProps hasSubtree?: boolean } -class TreeTitle extends UIComponent { +class TreeTitle extends UIComponent> { static create: Function static className = 'ui-tree__title' diff --git a/src/lib/accessibility/FocusZone/FocusTrapZone.tsx b/src/lib/accessibility/FocusZone/FocusTrapZone.tsx index c064ba2b11..371a19befa 100644 --- a/src/lib/accessibility/FocusZone/FocusTrapZone.tsx +++ b/src/lib/accessibility/FocusZone/FocusTrapZone.tsx @@ -76,7 +76,12 @@ export class FocusTrapZone extends React.Component { { handledProps: [..._.keys(FocusTrapZone.propTypes)] }, this.props, ) - const ElementType = getElementType({ defaultProps: FocusTrapZone.defaultProps }, this.props) + // TODO: Remove `as` there after the issue will be resolved: + // https://github.com/Microsoft/TypeScript/issues/28768 + const ElementType = getElementType( + { defaultProps: FocusTrapZone.defaultProps }, + this.props, + ) as React.ComponentClass return ( { /** * Element type the root element will use. Default is "div". diff --git a/src/lib/accessibility/FocusZone/FocusZone.tsx b/src/lib/accessibility/FocusZone/FocusZone.tsx index 9be1567d53..5967c92dc4 100644 --- a/src/lib/accessibility/FocusZone/FocusZone.tsx +++ b/src/lib/accessibility/FocusZone/FocusZone.tsx @@ -148,7 +148,12 @@ export class FocusZone extends React.Component implements IFocus render() { const { className } = this.props - const ElementType = getElementType({ defaultProps: FocusZone.defaultProps }, this.props) + // TODO: Remove `as` there after the issue will be resolved: + // https://github.com/Microsoft/TypeScript/issues/28768 + const ElementType = getElementType( + { defaultProps: FocusZone.defaultProps }, + this.props, + ) as React.ComponentClass const rest = getUnhandledProps({ handledProps: [..._.keys(FocusZone.propTypes)] }, this.props) return ( diff --git a/src/lib/customPropTypes.tsx b/src/lib/customPropTypes.tsx index cd0c91fdc7..52faac9b65 100644 --- a/src/lib/customPropTypes.tsx +++ b/src/lib/customPropTypes.tsx @@ -434,6 +434,7 @@ export const deprecate = (help: string, validator: Function) => ( } export const animation = PropTypes.oneOfType([ + // Validator is broken in the latest @react/types PropTypes.shape({ name: PropTypes.string.isRequired, delay: PropTypes.string, @@ -443,6 +444,6 @@ export const animation = PropTypes.oneOfType([ iterationCount: PropTypes.string, playState: PropTypes.string, timingFunction: PropTypes.string, - }), + }) as any, PropTypes.string, ]) diff --git a/src/lib/factories.tsx b/src/lib/factories.ts similarity index 97% rename from src/lib/factories.tsx rename to src/lib/factories.ts index a12ad81017..1bc725ae5a 100644 --- a/src/lib/factories.tsx +++ b/src/lib/factories.ts @@ -32,7 +32,7 @@ const CREATE_SHORTHAND_DEFAULT_OPTIONS: CreateShorthandOptions = { defaultProps: {}, overrideProps: {}, generateKey: true, - render: (Component, props) => , + render: (Component, props) => React.createElement(Component, props), } // It's only necessary to map props that don't use 'children' as value ('children' is the default) @@ -197,7 +197,7 @@ function createShorthandFromValue( } // Create ReactElements from built up props - if (valIsPrimitive || valIsPropsObject) return + if (valIsPrimitive || valIsPropsObject) return React.createElement(Component, props) return null } diff --git a/src/lib/renderComponent.tsx b/src/lib/renderComponent.tsx index cdca16e350..fde99bb45c 100644 --- a/src/lib/renderComponent.tsx +++ b/src/lib/renderComponent.tsx @@ -33,7 +33,7 @@ import { FOCUSZONE_WRAP_ATTRIBUTE } from './accessibility/FocusZone/focusUtiliti import createAnimationStyles from './createAnimationStyles' export interface RenderResultConfig

{ - ElementType: React.ReactType

+ ElementType: React.ComponentType

| string classes: ComponentSlotClasses rest: Props variables: ComponentVariablesObject @@ -152,7 +152,7 @@ const renderComponent =

(config: RenderConfig

): React.ReactElem rtl = false, renderer = felaRenderer, } = theme - const ElementType = getElementType({ defaultProps }, props) + const ElementType = getElementType({ defaultProps }, props) as React.ReactType

const stateAndProps = { ...state, ...props } diff --git a/test/specs/commonTests/implementsWrapperProp.tsx b/test/specs/commonTests/implementsWrapperProp.tsx index a2feb9a964..95994d62c1 100644 --- a/test/specs/commonTests/implementsWrapperProp.tsx +++ b/test/specs/commonTests/implementsWrapperProp.tsx @@ -3,15 +3,19 @@ import { ReactWrapper } from 'enzyme' import { mountWithProvider as mount } from 'test/utils' import Slot from 'src/components/Slot/Slot' -import { ShorthandValue } from 'utils' +import { ReactProps, ShorthandValue } from 'utils' export interface ImplementsWrapperPropOptions { wrapppedComponentSelector: any WrapperComponent?: any } -const implementsWrapperProp =

( - Component: React.ReactType

, +type WrapperProps = { + wrapper?: ShorthandValue +} + +const implementsWrapperProp = ( + Component: React.ComponentType>, options: ImplementsWrapperPropOptions, ) => { const { wrapppedComponentSelector, WrapperComponent = Slot } = options diff --git a/test/specs/lib/factories-test.tsx b/test/specs/lib/factories-test.tsx index b5b4ef4763..816abe8840 100644 --- a/test/specs/lib/factories-test.tsx +++ b/test/specs/lib/factories-test.tsx @@ -232,9 +232,9 @@ describe('factories', () => { getShorthand({ value: render => render({}, (Component, props) => { - expect(Component).toBe('foo-span') + expect(Component).toBe('span') }), - Component: 'foo-span', + Component: 'span', }) }) diff --git a/test/specs/lib/handleRef-test.ts b/test/specs/lib/handleRef-test.ts index d938ca5dfe..7530d9ec3f 100644 --- a/test/specs/lib/handleRef-test.ts +++ b/test/specs/lib/handleRef-test.ts @@ -6,7 +6,8 @@ describe('handleRef', () => { const node = document.createElement('div') expect(() => { - handleRef('ref', node) + // handleRef() does not accept string, but in this test we want ensure that this case will be handled + handleRef('ref' as any, node) }).toThrowError() }) diff --git a/types/utils.d.ts b/types/utils.d.ts index 42a517e27d..654020971e 100644 --- a/types/utils.d.ts +++ b/types/utils.d.ts @@ -8,6 +8,9 @@ export type Extendable = T & { [key: string]: V } +export type Nullable = T | null +export type NullableIfUndefined = T extends undefined ? Nullable : T + export type Partial = { [Key in keyof T]?: T[Key] } export type ArgOf = T extends (arg: infer TArg) => any ? TArg : never @@ -24,6 +27,10 @@ export type ObjectOrFunc = ((arg: TArg) => TResult) | TResul export type Props = ObjectOf export type ReactChildren = React.ReactNodeArray | React.ReactNode + +export type ReactPropsStrict = { [K in keyof T]: NullableIfUndefined } +export type ReactProps = Extendable> + export type ComponentEventHandler = (event: React.SyntheticEvent, data: TProps) => void type ChildrenProps = { children: any } diff --git a/yarn.lock b/yarn.lock index 25e665d8cb..99cf18e7bc 100644 --- a/yarn.lock +++ b/yarn.lock @@ -189,6 +189,11 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.24.tgz#302a8f0c00bd1bf364471b6687258617c5d410fc" integrity sha512-5YaBKa6oFuWy7ptIFMATyftIcpZTZtvgrzPThEbs+kl4Uu41oUxiRunG0k32QZjD6MXMELls//ry/epNxc11aQ== +"@types/prop-types@*": + version "15.5.6" + resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.6.tgz#9c03d3fed70a8d517c191b7734da2879b50ca26c" + integrity sha512-ZBFR7TROLVzCkswA3Fmqq+IIJt62/T7aY/Dmz+QkU7CaW2QFqAitCE8Ups7IzmGhcN1YWMBT4Qcoc07jU9hOJQ== + "@types/react-custom-scrollbars@^4.0.5": version "4.0.5" resolved "https://registry.yarnpkg.com/@types/react-custom-scrollbars/-/react-custom-scrollbars-4.0.5.tgz#8629b4b3164914d27df7cb0ca0a086c0ad406389" @@ -196,12 +201,11 @@ dependencies: "@types/react" "*" -"@types/react-dom@^16.0.6": - version "16.0.6" - resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.6.tgz#f1a65a4e7be8ed5d123f8b3b9eacc913e35a1a3c" - integrity sha512-M+1zmwa5KxUpkCuxA4whlDJKYTGNvNQW4pIoCLH16xGbClicD9CzPry4y94kTjCCk/bJZCZ/GVqUsP7eKcO/mQ== +"@types/react-dom@^16.0.11": + version "16.0.11" + resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.11.tgz#bd10ccb0d9260343f4b9a49d4f7a8330a5c1f081" + integrity sha512-x6zUx9/42B5Kl2Vl9HlopV8JF64wLpX3c+Pst9kc1HgzrsH+mkehe/zmHMQTplIrR48H2gpU7ZqurQolYu8XBA== dependencies: - "@types/node" "*" "@types/react" "*" "@types/react-is@^16.5.0": @@ -219,11 +223,12 @@ "@types/history" "*" "@types/react" "*" -"@types/react@*", "@types/react@^16.3.17": - version "16.4.6" - resolved "https://registry.yarnpkg.com/@types/react/-/react-16.4.6.tgz#5024957c6bcef4f02823accf5974faba2e54fada" - integrity sha512-9LDZdhsuKSc+DjY65SjBkA958oBWcTWSVWAd2cD9XqKBjhGw1KzAkRhWRw2eIsXvaIE/TOTjjKMFVC+JA1iU4g== +"@types/react@*", "@types/react@^16.7.17": + version "16.7.17" + resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.17.tgz#3242e796a1ffbba4f49eae5915a67f4c079504e9" + integrity sha512-YcXcaoXaxo7A76mBCGlKlN2aZu3REQfF0DTrhiyXVJLA7PDdxVCr+wiQOrkVNn44D/zLlIyDSn3U918Ve0AaEA== dependencies: + "@types/prop-types" "*" csstype "^2.2.0" "@types/through2@*": @@ -10352,10 +10357,10 @@ typedarray@^0.0.6: resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= -typescript@~3.1.0: - version "3.1.3" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.3.tgz#01b70247a6d3c2467f70c45795ef5ea18ce191d5" - integrity sha512-+81MUSyX+BaSo+u2RbozuQk/UWx6hfG0a5gHu4ANEM4sU96XbuIyAB+rWBW1u70c6a5QuZfuYICn3s2UjuHUpA== +typescript@~3.2.2: + version "3.2.2" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.2.2.tgz#fe8101c46aa123f8353523ebdcf5730c2ae493e5" + integrity sha512-VCj5UiSyHBjwfYacmDuc/NOk4QQixbE+Wn7MFJuS0nRuPQbof132Pw4u53dm264O8LPc2MVsc7RJNml5szurkg== ua-parser-js@^0.7.18: version "0.7.18" From 393f7e977b8c5f0ecce094fee90028451fbe2a0c Mon Sep 17 00:00:00 2001 From: olfedias Date: Fri, 14 Dec 2018 11:12:01 +0200 Subject: [PATCH 2/6] fix last warnings --- .../components/Ref/Types/RefForwardingExample.tsx | 2 +- .../popups/GridImagePicker/GridImagePicker.tsx | 6 ++---- .../popups/GridImagePicker/GridImagePickerItem.tsx | 11 +++-------- 3 files changed, 6 insertions(+), 13 deletions(-) diff --git a/docs/src/examples/components/Ref/Types/RefForwardingExample.tsx b/docs/src/examples/components/Ref/Types/RefForwardingExample.tsx index e0f9bcbd6a..3a48a6b6bf 100644 --- a/docs/src/examples/components/Ref/Types/RefForwardingExample.tsx +++ b/docs/src/examples/components/Ref/Types/RefForwardingExample.tsx @@ -1,7 +1,7 @@ import React from 'react' import { Grid, Ref, Segment } from '@stardust-ui/react' -const ExampleButton = React.forwardRef((props, ref) => ( +const ExampleButton = React.forwardRef((props, ref) => (

diff --git a/docs/src/prototypes/popups/GridImagePicker/GridImagePicker.tsx b/docs/src/prototypes/popups/GridImagePicker/GridImagePicker.tsx index d53f47eda3..e999058ef0 100644 --- a/docs/src/prototypes/popups/GridImagePicker/GridImagePicker.tsx +++ b/docs/src/prototypes/popups/GridImagePicker/GridImagePicker.tsx @@ -6,7 +6,6 @@ import { ShorthandValue } from '../../../../../types/utils' import GridImagePickerItem, { GridPickerItemProps } from './GridImagePickerItem' export interface GridPickerProps { - as?: keyof React.ReactHTML items: GridPickerItemProps[] gridColumns?: string | number inputIcon?: ShorthandValue @@ -27,7 +26,6 @@ const inputStyles = { class GridImagePicker extends React.Component { static defaultProps = { - as: 'ul', gridColumns: 5, inputIcon: 'search', inputPlaceholder: 'Search...', @@ -41,7 +39,7 @@ class GridImagePicker extends React.Component { } render() { - const { as: ElementType, gridColumns, inputIcon, inputPlaceholder } = this.props + const { gridColumns, inputIcon, inputPlaceholder } = this.props return ( <> @@ -53,7 +51,7 @@ class GridImagePicker extends React.Component { inputRef={this.setInputNode} /> void @@ -17,19 +16,15 @@ const imageButtonStyles = { } class GridImagePickerItem extends React.Component { - static defaultProps = { - as: 'li', - } - render() { - const { title, imageSrc, as: ElementType, onClick } = this.props + const { title, imageSrc, onClick } = this.props return ( - +
  • - +
    • ) } } From 398a38388c94e9fe46715b7fec5483ce46b13b8e Mon Sep 17 00:00:00 2001 From: olfedias Date: Fri, 14 Dec 2018 11:24:41 +0200 Subject: [PATCH 3/6] add todo --- src/lib/renderComponent.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/lib/renderComponent.tsx b/src/lib/renderComponent.tsx index fde99bb45c..b4baf6e456 100644 --- a/src/lib/renderComponent.tsx +++ b/src/lib/renderComponent.tsx @@ -33,6 +33,8 @@ import { FOCUSZONE_WRAP_ATTRIBUTE } from './accessibility/FocusZone/focusUtiliti import createAnimationStyles from './createAnimationStyles' export interface RenderResultConfig

    { + // TODO: Switch back to React.ReactType after issue will be resolved + // https://github.com/Microsoft/TypeScript/issues/28768 ElementType: React.ComponentType

    | string classes: ComponentSlotClasses rest: Props From 7be8cfa12106957a81c6ab9592517ddf4c5f528c Mon Sep 17 00:00:00 2001 From: olfedias Date: Fri, 14 Dec 2018 11:26:38 +0200 Subject: [PATCH 4/6] add entry --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index a37147e870..a2a84a1ee7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -41,6 +41,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm - Fix multiple React's warnings about keys in docs @layershifter ([#602](https://github.com/stardust-ui/react/pull/602)) - Fix incorrect handling of `isFromKeyboard` in `Menu` @layershifter ([#596](https://github.com/stardust-ui/react/pull/596)) - Fix property names used in shorthand factories @kuzhelov ([#591](https://github.com/stardust-ui/react/pull/591)) +- Fix compatibility with TypeScript 3.2 and handle `null` as a valid value in all optional props @layershifter ([#550](https://github.com/stardust-ui/react/pull/550)) ### Features - `Ref` components uses `forwardRef` API by default @layershifter ([#491](https://github.com/stardust-ui/react/pull/491)) From af30cbdf7a49bc9313b5730c47c5cdd616954f36 Mon Sep 17 00:00:00 2001 From: olfedias Date: Thu, 20 Dec 2018 11:21:15 +0100 Subject: [PATCH 5/6] use ReactProps in Dropdown --- src/components/Dropdown/DropdownItem.tsx | 4 ++-- src/components/Dropdown/DropdownLabel.tsx | 4 ++-- src/components/Dropdown/DropdownSearchInput.tsx | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/Dropdown/DropdownItem.tsx b/src/components/Dropdown/DropdownItem.tsx index d360724cc9..f8b0e941f5 100644 --- a/src/components/Dropdown/DropdownItem.tsx +++ b/src/components/Dropdown/DropdownItem.tsx @@ -9,7 +9,7 @@ import { customPropTypes, commonPropTypes, } from '../../lib' -import { Extendable, ShorthandValue, ComponentEventHandler } from '../../../types/utils' +import { ShorthandValue, ComponentEventHandler, ReactProps } from '../../../types/utils' import { UIComponentProps } from '../../lib/commonPropInterfaces' import ListItem from '../List/ListItem' import Image from '../Image/Image' @@ -40,7 +40,7 @@ export interface DropdownItemProps extends UIComponentProps { * A DropdownItem is a sub-component of the Dropdown, * used to display items of the dropdown list. */ -class DropdownItem extends UIComponent, any> { +class DropdownItem extends UIComponent, any> { static displayName = 'DropdownItem' static create: Function diff --git a/src/components/Dropdown/DropdownLabel.tsx b/src/components/Dropdown/DropdownLabel.tsx index a98783f22e..148dba9b42 100644 --- a/src/components/Dropdown/DropdownLabel.tsx +++ b/src/components/Dropdown/DropdownLabel.tsx @@ -3,7 +3,7 @@ import * as PropTypes from 'prop-types' import * as _ from 'lodash' import keyboardKey from 'keyboard-key' -import { ComponentEventHandler, ShorthandValue, Extendable } from '../../../types/utils' +import { ComponentEventHandler, ShorthandValue, ReactProps } from '../../../types/utils' import { UIComponentProps } from '../../lib/commonPropInterfaces' import { customPropTypes, @@ -46,7 +46,7 @@ export interface DropdownLabelProps extends UIComponentProps * A DropdownLabel is a sub-component of a multiple selection Dropdown. * It is used to display selected item. */ -class DropdownLabel extends UIComponent, any> { +class DropdownLabel extends UIComponent, any> { displayName = 'DropdownLabel' static create: Function diff --git a/src/components/Dropdown/DropdownSearchInput.tsx b/src/components/Dropdown/DropdownSearchInput.tsx index 36d5a2a2f2..63cec50f1d 100644 --- a/src/components/Dropdown/DropdownSearchInput.tsx +++ b/src/components/Dropdown/DropdownSearchInput.tsx @@ -3,7 +3,7 @@ import * as PropTypes from 'prop-types' import * as _ from 'lodash' import { UIComponent, RenderResultConfig, createShorthandFactory, commonPropTypes } from '../../lib' -import { Extendable, ComponentEventHandler } from '../../../types/utils' +import { ComponentEventHandler, ReactProps } from '../../../types/utils' import { UIComponentProps } from '../../lib/commonPropInterfaces' import Input from '../Input/Input' import Ref from '../Ref/Ref' @@ -55,7 +55,7 @@ export interface DropdownSearchInputProps extends UIComponentProps, any> { +class DropdownSearchInput extends UIComponent, any> { static displayName = 'DropdownSearchInput' static create: Function From 5a93673ad2863eb661a85f920b9779478a208827 Mon Sep 17 00:00:00 2001 From: olfedias Date: Thu, 20 Dec 2018 11:36:09 +0100 Subject: [PATCH 6/6] fix proptypes imports --- .../ComponentDoc/ComponentControls/ComponentControls.tsx | 2 +- .../ComponentControls/ComponentControlsCopyLink.tsx | 2 +- .../ComponentControls/ComponentControlsMaximize.tsx | 2 +- .../ComponentDoc/ComponentControls/ComponentControlsRtl.tsx | 2 +- .../ComponentControls/ComponentControlsShowCode.tsx | 2 +- .../ComponentControls/ComponentControlsShowTransparent.tsx | 2 +- .../ComponentControls/ComponentControlsShowVariables.tsx | 2 +- docs/src/components/ComponentDoc/ComponentDoc.tsx | 2 +- docs/src/components/ComponentDoc/ComponentDocLinks.tsx | 2 +- docs/src/components/ComponentDoc/ComponentDocSee.tsx | 2 +- .../ComponentDoc/ComponentExample/ComponentExample.tsx | 2 +- docs/src/components/ComponentDoc/ComponentExamples.tsx | 2 +- .../ComponentDoc/ComponentProp/ComponentPropDefaultValue.tsx | 2 +- .../ComponentDoc/ComponentProp/ComponentPropDescription.tsx | 2 +- .../components/ComponentDoc/ComponentProp/ComponentPropEnum.tsx | 2 +- .../ComponentDoc/ComponentProp/ComponentPropEnumToggle.tsx | 2 +- .../ComponentDoc/ComponentProp/ComponentPropEnumValue.tsx | 2 +- .../ComponentProp/ComponentPropFunctionSignature.tsx | 2 +- .../components/ComponentDoc/ComponentProp/ComponentPropName.tsx | 2 +- .../components/ComponentDoc/ComponentProps/ComponentProps.tsx | 2 +- .../ComponentDoc/ComponentProps/ComponentPropsComponents.tsx | 2 +- .../ComponentDoc/ComponentProps/ComponentPropsDescription.tsx | 2 +- .../ComponentDoc/ComponentSidebar/ComponentSidebar.tsx | 2 +- .../ComponentDoc/ComponentSidebar/ComponentSidebarSection.tsx | 2 +- .../components/ComponentDoc/ComponentTable/ComponentTable.tsx | 2 +- .../ComponentDoc/ComponentTable/ComponentTableRow.tsx | 2 +- docs/src/components/ComponentDoc/ContributionPrompt.tsx | 2 +- docs/src/components/ComponentDoc/ExampleSection.tsx | 2 +- docs/src/components/DocsBehaviorRoot.tsx | 2 +- docs/src/components/DocsLayout.tsx | 2 +- docs/src/components/DocsRoot.tsx | 2 +- docs/src/components/Editor/Editor.tsx | 2 +- docs/src/components/ExternalExampleLayout.tsx | 2 +- docs/src/components/Knobs/KnobsBoolean.tsx | 2 +- docs/src/components/Knobs/KnobsScalar.tsx | 2 +- docs/src/components/Sidebar/Sidebar.tsx | 2 +- .../components/ItemLayout/Types/ItemLayoutExample.knobs.tsx | 2 +- .../ItemLayout/Types/ItemLayoutExampleSelection.knobs.tsx | 2 +- .../ItemLayout/Variations/ItemLayoutExampleTruncate.knobs.tsx | 2 +- .../components/Layout/Variations/LayoutExampleGap.knobs.tsx | 2 +- docs/src/examples/components/List/Types/ListExample.knobs.tsx | 2 +- .../components/List/Variations/ListExampleTruncate.knobs.tsx | 2 +- docs/src/utils/componentInfoShape.ts | 2 +- 43 files changed, 43 insertions(+), 43 deletions(-) diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControls.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControls.tsx index 194df1d9ad..25d2296a3f 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControls.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControls.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsCopyLink.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsCopyLink.tsx index 0fbcc38c96..65f2c113fc 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsCopyLink.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsCopyLink.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsMaximize.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsMaximize.tsx index 4b1ca4834c..6e3f7014c7 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsMaximize.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsMaximize.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' import { NavLink } from 'react-router-dom' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsRtl.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsRtl.tsx index 0bd11022c0..d5e95563f9 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsRtl.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsRtl.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowCode.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowCode.tsx index e1284f3f97..a5e5283fd6 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowCode.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowCode.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowTransparent.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowTransparent.tsx index 771c896f90..b00393445c 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowTransparent.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowTransparent.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowVariables.tsx b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowVariables.tsx index d0e5eee2bb..88a3fa4de0 100644 --- a/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowVariables.tsx +++ b/docs/src/components/ComponentDoc/ComponentControls/ComponentControlsShowVariables.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentDoc.tsx b/docs/src/components/ComponentDoc/ComponentDoc.tsx index 8cabe86903..20de2ed1c6 100644 --- a/docs/src/components/ComponentDoc/ComponentDoc.tsx +++ b/docs/src/components/ComponentDoc/ComponentDoc.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import DocumentTitle from 'react-document-title' import { withRouter } from 'react-router' diff --git a/docs/src/components/ComponentDoc/ComponentDocLinks.tsx b/docs/src/components/ComponentDoc/ComponentDocLinks.tsx index ea10d91bf3..bc24519e48 100644 --- a/docs/src/components/ComponentDoc/ComponentDocLinks.tsx +++ b/docs/src/components/ComponentDoc/ComponentDocLinks.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { List } from 'semantic-ui-react' import { constants } from 'src/lib' diff --git a/docs/src/components/ComponentDoc/ComponentDocSee.tsx b/docs/src/components/ComponentDoc/ComponentDocSee.tsx index 505ff98699..a9f661b4d7 100644 --- a/docs/src/components/ComponentDoc/ComponentDocSee.tsx +++ b/docs/src/components/ComponentDoc/ComponentDocSee.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Link } from 'react-router-dom' import { Header, List } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.tsx b/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.tsx index 339dba46de..99b394ea40 100644 --- a/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.tsx +++ b/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { RouteComponentProps, withRouter } from 'react-router' import * as copyToClipboard from 'copy-to-clipboard' diff --git a/docs/src/components/ComponentDoc/ComponentExamples.tsx b/docs/src/components/ComponentDoc/ComponentExamples.tsx index 0c8231e9e1..b136fc1cd7 100644 --- a/docs/src/components/ComponentDoc/ComponentExamples.tsx +++ b/docs/src/components/ComponentDoc/ComponentExamples.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { exampleContext } from 'docs/src/utils' diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDefaultValue.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDefaultValue.tsx index 3a799702bb..5ef55696e9 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDefaultValue.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDefaultValue.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' export default class ComponentPropDefaultValue extends React.PureComponent { diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDescription.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDescription.tsx index d73e96024a..895b6ddfae 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDescription.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropDescription.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' export default class ComponentPropDescription extends React.PureComponent { diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnum.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnum.tsx index b7b1b4f081..576d5810d8 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnum.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnum.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { updateForKeys } from 'docs/src/hoc' diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumToggle.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumToggle.tsx index fecf817802..f183cc4f12 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumToggle.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumToggle.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { updateForKeys } from 'docs/src/hoc' diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumValue.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumValue.tsx index 0ff149ac3b..c970543886 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumValue.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropEnumValue.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { neverUpdate } from 'docs/src/hoc' diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropFunctionSignature.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropFunctionSignature.tsx index cd9d9a8da7..e62f4ac1ad 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropFunctionSignature.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropFunctionSignature.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { neverUpdate } from 'docs/src/hoc' diff --git a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropName.tsx b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropName.tsx index 0fdd5e5ed9..a3a4940f3f 100644 --- a/docs/src/components/ComponentDoc/ComponentProp/ComponentPropName.tsx +++ b/docs/src/components/ComponentDoc/ComponentProp/ComponentPropName.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Icon, Popup } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentProps/ComponentProps.tsx b/docs/src/components/ComponentDoc/ComponentProps/ComponentProps.tsx index 8685c10226..5d243638d2 100644 --- a/docs/src/components/ComponentDoc/ComponentProps/ComponentProps.tsx +++ b/docs/src/components/ComponentDoc/ComponentProps/ComponentProps.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Checkbox } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsComponents.tsx b/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsComponents.tsx index 8cb87d3062..a1a56146f4 100644 --- a/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsComponents.tsx +++ b/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsComponents.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsDescription.tsx b/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsDescription.tsx index 4330f16f69..c00e3c47f8 100644 --- a/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsDescription.tsx +++ b/docs/src/components/ComponentDoc/ComponentProps/ComponentPropsDescription.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Divider } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebar.tsx b/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebar.tsx index cc0ef25278..51c17eeaf8 100644 --- a/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebar.tsx +++ b/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebar.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Accordion, Menu, Sticky } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebarSection.tsx b/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebarSection.tsx index e281b87299..1bde56e10a 100644 --- a/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebarSection.tsx +++ b/docs/src/components/ComponentDoc/ComponentSidebar/ComponentSidebarSection.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Accordion, Icon, Menu } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentTable/ComponentTable.tsx b/docs/src/components/ComponentDoc/ComponentTable/ComponentTable.tsx index f4dfc36730..ffdedb6f21 100644 --- a/docs/src/components/ComponentDoc/ComponentTable/ComponentTable.tsx +++ b/docs/src/components/ComponentDoc/ComponentTable/ComponentTable.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Table } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ComponentTable/ComponentTableRow.tsx b/docs/src/components/ComponentDoc/ComponentTable/ComponentTableRow.tsx index fd8beeeed9..830ea141ad 100644 --- a/docs/src/components/ComponentDoc/ComponentTable/ComponentTableRow.tsx +++ b/docs/src/components/ComponentDoc/ComponentTable/ComponentTableRow.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import * as _ from 'lodash' import { Table } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ContributionPrompt.tsx b/docs/src/components/ComponentDoc/ContributionPrompt.tsx index 56c6efe578..d9f8616db1 100644 --- a/docs/src/components/ComponentDoc/ContributionPrompt.tsx +++ b/docs/src/components/ComponentDoc/ContributionPrompt.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Message, Icon } from 'semantic-ui-react' diff --git a/docs/src/components/ComponentDoc/ExampleSection.tsx b/docs/src/components/ComponentDoc/ExampleSection.tsx index 0123c600a5..b90e0ec10e 100644 --- a/docs/src/components/ComponentDoc/ExampleSection.tsx +++ b/docs/src/components/ComponentDoc/ExampleSection.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Grid, Header } from 'semantic-ui-react' diff --git a/docs/src/components/DocsBehaviorRoot.tsx b/docs/src/components/DocsBehaviorRoot.tsx index 124792d685..6f8aabecf5 100644 --- a/docs/src/components/DocsBehaviorRoot.tsx +++ b/docs/src/components/DocsBehaviorRoot.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { Grid, Header } from 'semantic-ui-react' import DocumentTitle from 'react-document-title' diff --git a/docs/src/components/DocsLayout.tsx b/docs/src/components/DocsLayout.tsx index 57e8a0dbdf..54e5ff3bac 100644 --- a/docs/src/components/DocsLayout.tsx +++ b/docs/src/components/DocsLayout.tsx @@ -1,5 +1,5 @@ import AnchorJS from 'anchor-js' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { withRouter } from 'react-router' import { Route } from 'react-router-dom' diff --git a/docs/src/components/DocsRoot.tsx b/docs/src/components/DocsRoot.tsx index d62c53d1cd..7bf1f82820 100644 --- a/docs/src/components/DocsRoot.tsx +++ b/docs/src/components/DocsRoot.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import ComponentDoc from '../components/ComponentDoc' diff --git a/docs/src/components/Editor/Editor.tsx b/docs/src/components/Editor/Editor.tsx index 44f66a07ce..5a7800b5bb 100644 --- a/docs/src/components/Editor/Editor.tsx +++ b/docs/src/components/Editor/Editor.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import AceEditor, { AceEditorProps } from 'react-ace' import * as ace from 'brace' diff --git a/docs/src/components/ExternalExampleLayout.tsx b/docs/src/components/ExternalExampleLayout.tsx index 082b9e8f84..85a145aa2e 100644 --- a/docs/src/components/ExternalExampleLayout.tsx +++ b/docs/src/components/ExternalExampleLayout.tsx @@ -1,5 +1,5 @@ import * as _ from 'lodash/fp' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { exampleContext, exampleKebabNameToFilename, parseExamplePath } from 'docs/src/utils' diff --git a/docs/src/components/Knobs/KnobsBoolean.tsx b/docs/src/components/Knobs/KnobsBoolean.tsx index 31832528b7..20c1704729 100644 --- a/docs/src/components/Knobs/KnobsBoolean.tsx +++ b/docs/src/components/Knobs/KnobsBoolean.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import KnobsField from './KnobsField' diff --git a/docs/src/components/Knobs/KnobsScalar.tsx b/docs/src/components/Knobs/KnobsScalar.tsx index 91ddf14acc..0998272b70 100644 --- a/docs/src/components/Knobs/KnobsScalar.tsx +++ b/docs/src/components/Knobs/KnobsScalar.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import KnobsField from './KnobsField' diff --git a/docs/src/components/Sidebar/Sidebar.tsx b/docs/src/components/Sidebar/Sidebar.tsx index ad2bc8263d..a5eb7a09d7 100644 --- a/docs/src/components/Sidebar/Sidebar.tsx +++ b/docs/src/components/Sidebar/Sidebar.tsx @@ -1,6 +1,6 @@ import keyboardKey from 'keyboard-key' import * as _ from 'lodash/fp' -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import { findDOMNode } from 'react-dom' import { NavLink } from 'react-router-dom' diff --git a/docs/src/examples/components/ItemLayout/Types/ItemLayoutExample.knobs.tsx b/docs/src/examples/components/ItemLayout/Types/ItemLayoutExample.knobs.tsx index fb920e3292..67a61a2a87 100644 --- a/docs/src/examples/components/ItemLayout/Types/ItemLayoutExample.knobs.tsx +++ b/docs/src/examples/components/ItemLayout/Types/ItemLayoutExample.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/examples/components/ItemLayout/Types/ItemLayoutExampleSelection.knobs.tsx b/docs/src/examples/components/ItemLayout/Types/ItemLayoutExampleSelection.knobs.tsx index 08c7ae7389..9b09f8e810 100644 --- a/docs/src/examples/components/ItemLayout/Types/ItemLayoutExampleSelection.knobs.tsx +++ b/docs/src/examples/components/ItemLayout/Types/ItemLayoutExampleSelection.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/examples/components/ItemLayout/Variations/ItemLayoutExampleTruncate.knobs.tsx b/docs/src/examples/components/ItemLayout/Variations/ItemLayoutExampleTruncate.knobs.tsx index 329a4baff8..64b751d4c0 100644 --- a/docs/src/examples/components/ItemLayout/Variations/ItemLayoutExampleTruncate.knobs.tsx +++ b/docs/src/examples/components/ItemLayout/Variations/ItemLayoutExampleTruncate.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/examples/components/Layout/Variations/LayoutExampleGap.knobs.tsx b/docs/src/examples/components/Layout/Variations/LayoutExampleGap.knobs.tsx index dd447c5b34..454f04e58f 100644 --- a/docs/src/examples/components/Layout/Variations/LayoutExampleGap.knobs.tsx +++ b/docs/src/examples/components/Layout/Variations/LayoutExampleGap.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/examples/components/List/Types/ListExample.knobs.tsx b/docs/src/examples/components/List/Types/ListExample.knobs.tsx index 4f54842959..4633a12865 100644 --- a/docs/src/examples/components/List/Types/ListExample.knobs.tsx +++ b/docs/src/examples/components/List/Types/ListExample.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/examples/components/List/Variations/ListExampleTruncate.knobs.tsx b/docs/src/examples/components/List/Variations/ListExampleTruncate.knobs.tsx index 785541b03c..ea608dd3b1 100644 --- a/docs/src/examples/components/List/Variations/ListExampleTruncate.knobs.tsx +++ b/docs/src/examples/components/List/Variations/ListExampleTruncate.knobs.tsx @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' import * as React from 'react' import Knobs from 'docs/src/components/Knobs/Knobs' diff --git a/docs/src/utils/componentInfoShape.ts b/docs/src/utils/componentInfoShape.ts index 2a23314314..1b60ed774a 100644 --- a/docs/src/utils/componentInfoShape.ts +++ b/docs/src/utils/componentInfoShape.ts @@ -1,4 +1,4 @@ -import PropTypes from 'prop-types' +import * as PropTypes from 'prop-types' const componentInfoShape = PropTypes.shape({ displayName: PropTypes.string.isRequired,