Skip to content

Commit 794acce

Browse files
committed
Apply Katie's feedback from other PR
1 parent 62d8591 commit 794acce

File tree

11 files changed

+72
-61
lines changed

11 files changed

+72
-61
lines changed

package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,9 @@
3434
"eslint-plugin-import": "^2.25.2",
3535
"eslint-plugin-promise": "^6.0.0",
3636
"eslint-config-prettier": "8.5.0",
37-
"typescript": "^5.3.3",
38-
"@types/react": "^19",
39-
"@types/react-dom": "^19",
37+
"typescript": "^4.7.4",
38+
"@types/react": "^17.0.0",
39+
"@types/react-dom": "^17.0.0",
4040
"@typescript-eslint/eslint-plugin": "^5.42.0",
4141
"@typescript-eslint/parser": "^5.42.0",
4242
"prettier": "2.7.1",

packages/module/src/components/CatalogItemHeader/CatalogItemHeader.tsx

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { HTMLProps, FunctionComponent } from 'react';
22
import { Content, Title } from '@patternfly/react-core';
33
import { css } from '@patternfly/react-styles';
44

@@ -10,9 +10,9 @@ export interface CatalogItemHeaderProps extends Omit<HTMLProps<HTMLElement>, 'ti
1010
/** Class for the image when an icon is to be used (exclusive from iconImg) */
1111
iconClass?: string;
1212
/** Tile for the catalog item */
13-
title: string | ReactNode;
13+
title: string | React.ReactNode;
1414
/** Vendor for the catalog item */
15-
vendor?: string | ReactNode;
15+
vendor?: string | React.ReactNode;
1616
}
1717

1818
export const CatalogItemHeader: FunctionComponent<CatalogItemHeaderProps> = ({
@@ -27,8 +27,14 @@ export const CatalogItemHeader: FunctionComponent<CatalogItemHeaderProps> = ({
2727
{iconImg && <img className="catalog-item-header-pf-icon" src={iconImg} alt="" />}
2828
{!iconImg && iconClass && <span className={`catalog-item-header-pf-icon ${iconClass}`} />}
2929
<div className="catalog-item-header-pf-text">
30-
<Title headingLevel="h1" className="catalog-item-header-pf-title">{title}</Title>
31-
{vendor && <Content component="p" className="catalog-item-header-pf-subtitle">{vendor}</Content>}
30+
<Title headingLevel="h1" className="catalog-item-header-pf-title">
31+
{title}
32+
</Title>
33+
{vendor && (
34+
<Content component="p" className="catalog-item-header-pf-subtitle">
35+
{vendor}
36+
</Content>
37+
)}
3238
</div>
3339
</header>
3440
);

packages/module/src/components/CatalogTile/CatalogTileBadge.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { Fragment } from 'react';
33
import { Tooltip } from '@patternfly/react-core';
44
import { css } from '@patternfly/react-styles';
55

6-
export interface CatalogTileBadgeProps extends Omit<HTMLProps<HTMLElement>, 'title'> {
6+
export interface CatalogTileBadgeProps extends Omit<React.HTMLProps<HTMLElement>, 'title'> {
77
/** Children (typically an Icon) */
8-
children?: ReactNode;
8+
children?: React.ReactNode;
99
/** Additional css classes */
1010
className?: string;
1111
/** Id (was necessary for PF3 tooltip, but not for the PF4 one; keeping prop in case people still want it) */
@@ -25,14 +25,14 @@ export const CatalogTileBadge: FunctionComponent<CatalogTileBadgeProps> = ({
2525

2626
if (title) {
2727
return (
28-
(<Fragment>
28+
<Fragment>
2929
<Tooltip id={id} content={title}>
3030
<span className={classes} {...props}>
3131
{children}
3232
<span className="pf-v6-screen-reader">{title}</span>
3333
</span>
3434
</Tooltip>
35-
</Fragment>)
35+
</Fragment>
3636
);
3737
}
3838
return (

packages/module/src/components/FilterSidePanel/FilterSidePanel.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { css } from '@patternfly/react-styles';
33

4-
export interface FilterSidePanelProps extends HTMLProps<HTMLDivElement> {
4+
export interface FilterSidePanelProps extends React.HTMLProps<HTMLDivElement> {
55
/** Children nodes */
6-
children: ReactNode;
6+
children: React.ReactNode;
77
/** Additional css classes for the Filter Side Panel */
88
className?: string;
99
}

packages/module/src/components/FilterSidePanel/FilterSidePanelCategory.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
import type { HTMLProps, ReactNode, SyntheticEvent, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { Button } from '@patternfly/react-core';
33
import formStyles from '@patternfly/react-styles/css/components/Form/form';
44
import { css } from '@patternfly/react-styles';
55

66
import { childrenToArray } from '../../helpers/util';
77

8-
export interface FilterSidePanelCategoryProps extends Omit<HTMLProps<HTMLFormElement>, 'title'> {
8+
export interface FilterSidePanelCategoryProps extends Omit<React.HTMLProps<HTMLFormElement>, 'title'> {
99
/** Children nodes */
10-
children?: ReactNode;
10+
children?: React.ReactNode;
1111
/** Additional css classes for the Filter Side Panel Category */
1212
className?: string;
1313
/** Title for the category */
14-
title?: string | ReactNode;
14+
title?: string | React.ReactNode;
1515
/** Number of items (max) to show before adding Show More link button */
1616
maxShowCount?: number;
1717
/** Leeway to add to maxShowCount, minimum X for the 'Show X more' */
1818
leeway?: number;
1919
/** Flag to show all items (ie. set to true after Show X more link is clicked) */
2020
showAll?: boolean;
2121
/** Callback function when the Show/Hide link button is clicked */
22-
onShowAllToggle?: (event: SyntheticEvent<HTMLElement>) => void;
22+
onShowAllToggle?: (event: React.SyntheticEvent<HTMLElement>) => void;
2323
/** Text for the link to show all items, default 'Show <x> more' */
2424
showText?: string;
2525
/** Text for the link to hide overflow items, default 'Show less' */

packages/module/src/components/FilterSidePanel/FilterSidePanelCategoryItem.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
1-
import type { HTMLProps, ReactNode, SyntheticEvent, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { Fragment } from 'react';
33
import { css } from '@patternfly/react-styles';
44
import { Checkbox } from '@patternfly/react-core';
55

66
import { getUniqueId } from '../../helpers/util';
77

8-
export interface FilterSidePanelCategoryItemProps extends HTMLProps<HTMLDivElement> {
8+
export interface FilterSidePanelCategoryItemProps extends React.HTMLProps<HTMLDivElement> {
99
/** Children nodes */
10-
children?: ReactNode;
10+
children?: React.ReactNode;
1111
/** Additional css classes for the Filter Panel Property Item */
1212
className?: string;
1313
/** Optional icon (or other) to show before the children */
14-
icon?: ReactNode;
14+
icon?: React.ReactNode;
1515
/** Optional count of the items matching the filter */
1616
count?: number;
1717
/** Callback for a click on the Filter Item Checkbox */
18-
onClick?: (event: SyntheticEvent<HTMLElement>) => void;
18+
onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
1919
/** Flag to show if the Filter Item Checkbox is checked. */
2020
checked?: boolean;
2121
/** Title of the checkbox */

packages/module/src/components/PropertiesSidePanel/PropertiesSidePanel.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { css } from '@patternfly/react-styles';
33

4-
export interface PropertySidePanelProps extends HTMLProps<HTMLDivElement> {
4+
export interface PropertySidePanelProps extends React.HTMLProps<HTMLDivElement> {
55
/** Additional css classes for the Property Item */
66
className?: string;
77
/** Children, should be PropertyItem items plus any action buttons, etc. */
8-
children?: ReactNode;
8+
children?: React.ReactNode;
99
}
1010

1111
export const PropertiesSidePanel: FunctionComponent<PropertySidePanelProps> = ({

packages/module/src/components/PropertiesSidePanel/PropertyItem.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { css } from '@patternfly/react-styles';
33

44
import { Content, ContentVariants } from '@patternfly/react-core';
55

6-
export interface PropertyItemProps extends Omit<HTMLProps<HTMLDivElement>, 'label' | 'value'> {
6+
export interface PropertyItemProps extends Omit<React.HTMLProps<HTMLDivElement>, 'label' | 'value'> {
77
/** Additional css classes for the Property Item */
88
className?: string;
99
/** Label for the property */
10-
label: string | ReactNode;
10+
label: string | React.ReactNode;
1111
/** Value of the property */
12-
value: string | ReactNode;
12+
value: string | React.ReactNode;
1313
}
1414

1515
export const PropertyItem: FunctionComponent<PropertyItemProps> = ({

packages/module/src/components/VerticalTabs/VerticalTabs.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import type { HTMLProps, ReactNode, FunctionComponent } from 'react';
1+
import type { FunctionComponent } from 'react';
22
import { css } from '@patternfly/react-styles';
33

4-
export interface VerticalTabsProps extends HTMLProps<HTMLUListElement> {
4+
export interface VerticalTabsProps extends React.HTMLProps<HTMLUListElement> {
55
/** Children nodes */
6-
children?: ReactNode;
6+
children?: React.ReactNode;
77
/** Additional css classes */
88
className?: string;
99
/** Flag to restrict shown tabs to active tabs, their parents, their siblings, and direct children */

packages/module/src/components/VerticalTabs/VerticalTabsTab.tsx

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,13 @@
1-
import type {
2-
HTMLProps,
3-
ReactNode,
4-
ElementType,
5-
ComponentType,
6-
FunctionComponent,
7-
SyntheticEvent,
8-
} from 'react';
1+
import type { FunctionComponent, SyntheticEvent } from 'react';
92
import { css } from '@patternfly/react-styles';
103

11-
export interface VerticalTabsTabProps extends Omit<HTMLProps<HTMLLIElement>, 'title'> {
4+
export interface VerticalTabsTabProps extends Omit<React.HTMLProps<HTMLLIElement>, 'title'> {
125
/** Child tab nodes (VerticalTabsTab's) */
13-
children?: ReactNode;
6+
children?: React.ReactNode;
147
/** Additional css classes */
158
className?: string;
169
/** Title for the tab */
17-
title?: string | ReactNode;
10+
title?: string | React.ReactNode;
1811
/** Title wrap style */
1912
wrapStyle?: 'wrap' | 'truncate' | 'nowrap';
2013
/** Flag if this is the active tab */
@@ -28,7 +21,7 @@ export interface VerticalTabsTabProps extends Omit<HTMLProps<HTMLLIElement>, 'ti
2821
/** HREF location */
2922
href?: string;
3023
/** Sets the base component to render. defaults to a */
31-
component?: ElementType<any> | ComponentType<any>;
24+
component?: React.ElementType<any> | React.ComponentType<any>;
3225
}
3326

3427
export const VerticalTabsTab: FunctionComponent<VerticalTabsTabProps> = ({
@@ -63,7 +56,7 @@ export const VerticalTabsTab: FunctionComponent<VerticalTabsTabProps> = ({
6356
{Component ? (
6457
<Component className={linkClasses} />
6558
) : (
66-
<a className={linkClasses} onClick={e => handleActivate(e)} href={href}>
59+
<a className={linkClasses} onClick={(e) => handleActivate(e)} href={href}>
6760
{title}
6861
</a>
6962
)}

0 commit comments

Comments
 (0)