Skip to content

Commit 16a5508

Browse files
authored
Merge pull request #425 from mashmatrix/fix-fc-props
include children property explicitly in FC props
2 parents 1a6d9b7 + 9191a71 commit 16a5508

16 files changed

+72
-35
lines changed

src/scripts/BreadCrumbs.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export type BreadCrumbsProps = {
4040
/**
4141
*
4242
*/
43-
export const BreadCrumbs: React.FC<BreadCrumbsProps> = ({
43+
export const BreadCrumbs: FC<BreadCrumbsProps> = ({
4444
label,
4545
className,
4646
children,

src/scripts/Container.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { HTMLAttributes } from 'react';
1+
import React, { FC, HTMLAttributes } from 'react';
22
import classnames from 'classnames';
33

44
/**
@@ -12,7 +12,7 @@ export type ContainerProps = {
1212
/**
1313
*
1414
*/
15-
export const Container: React.FC<ContainerProps> = ({
15+
export const Container: FC<ContainerProps> = ({
1616
className,
1717
size,
1818
align,

src/scripts/DropdownMenu.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import React, {
1010
useContext,
1111
useRef,
1212
useMemo,
13+
ReactNode,
1314
} from 'react';
1415
import classnames from 'classnames';
1516
import { Icon } from './Icon';
@@ -28,6 +29,7 @@ type EventKey = string | number;
2829
export type DropdownMenuHeaderProps = {
2930
className?: string;
3031
divider?: 'top' | 'bottom';
32+
children?: ReactNode;
3133
};
3234

3335
/**

src/scripts/FieldSet.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
import React, { createContext, HTMLAttributes, useMemo } from 'react';
1+
import React, {
2+
createContext,
3+
HTMLAttributes,
4+
ReactNode,
5+
useMemo,
6+
} from 'react';
27
import classnames from 'classnames';
38
import { FormElement } from './FormElement';
49
import { createFC } from './common';
@@ -17,6 +22,7 @@ export const FieldSetColumnContext = createContext<{
1722
type FieldSetRowProps = {
1823
className?: string;
1924
cols?: number;
25+
children?: ReactNode;
2026
};
2127

2228
/**

src/scripts/FormElement.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,11 @@
1-
import React, { Ref, createContext, useContext, useMemo } from 'react';
1+
import React, {
2+
Ref,
3+
createContext,
4+
useContext,
5+
useMemo,
6+
ReactNode,
7+
CSSProperties,
8+
} from 'react';
29
import classnames from 'classnames';
310
import { FieldSetColumnContext } from './FieldSet';
411
import { useFormElementId } from './hooks';
@@ -17,7 +24,8 @@ export type FormElementProps = {
1724
cols?: number;
1825
dropdown?: JSX.Element;
1926
elementRef?: Ref<HTMLDivElement>;
20-
style?: object;
27+
style?: CSSProperties;
28+
children?: ReactNode;
2129
};
2230

2331
/**

src/scripts/Grid.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export type GridProps = {
2020
/**
2121
*
2222
*/
23-
export const Grid: React.FC<GridProps> = ({
23+
export const Grid: FC<GridProps> = ({
2424
className,
2525
frame,
2626
vertical = true,
@@ -82,7 +82,7 @@ export type ColProps = {
8282
/**
8383
*
8484
*/
85-
export const Col: React.FC<ColProps> = (props) => {
85+
export const Col: FC<ColProps> = (props) => {
8686
const {
8787
className,
8888
padded,

src/scripts/Modal.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import React, {
55
createContext,
66
useContext,
77
useMemo,
8+
ReactNode,
89
} from 'react';
910
import classnames from 'classnames';
1011
import { Button } from './Button';
@@ -70,6 +71,7 @@ export const ModalHeader: FC<ModalHeaderProps> = (props) => {
7071
*/
7172
export type ModalContentProps = {
7273
className?: string;
74+
children?: ReactNode;
7375
};
7476

7577
/**
@@ -94,6 +96,7 @@ export const ModalContent: FC<ModalContentProps> = ({
9496
export type ModalFooterProps = {
9597
className?: string;
9698
directional?: boolean;
99+
children?: ReactNode;
97100
};
98101

99102
/**

src/scripts/Notification.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { MouseEvent, HTMLAttributes, EventHandler } from 'react';
1+
import React, { MouseEvent, HTMLAttributes, EventHandler, FC } from 'react';
22
import classnames from 'classnames';
33
import { Button } from './Button';
44
import { Icon, IconSize } from './Icon';
@@ -20,7 +20,7 @@ export type NotificationProps = {
2020
onClose?: EventHandler<MouseEvent<HTMLButtonElement>>;
2121
} & HTMLAttributes<HTMLDivElement>;
2222

23-
export const Notification: React.FC<NotificationProps> = (props) => {
23+
export const Notification: FC<NotificationProps> = (props) => {
2424
const {
2525
className,
2626
type,
@@ -92,11 +92,11 @@ export const Notification: React.FC<NotificationProps> = (props) => {
9292
};
9393

9494
export type AlertProps = Omit<NotificationProps, 'type'>;
95-
export const Alert: React.FC<AlertProps> = (props) => (
95+
export const Alert: FC<AlertProps> = (props) => (
9696
<Notification {...props} type='alert' />
9797
);
9898

9999
export type ToastProps = Omit<NotificationProps, 'type'>;
100-
export const Toast: React.FC<ToastProps> = (props) => (
100+
export const Toast: FC<ToastProps> = (props) => (
101101
<Notification {...props} type='toast' />
102102
);

src/scripts/PageHeader.tsx

Lines changed: 6 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { BreadCrumbs, Crumb } from './BreadCrumbs';
1111
*/
1212
export type PageHeaderDetailBodyProps = TextProps;
1313

14-
export const PageHeaderDetailBody: React.FC<PageHeaderDetailBodyProps> = ({
14+
export const PageHeaderDetailBody: FC<PageHeaderDetailBodyProps> = ({
1515
children,
1616
...props
1717
}) =>
@@ -28,7 +28,7 @@ export const PageHeaderDetailBody: React.FC<PageHeaderDetailBodyProps> = ({
2828
*/
2929
export type PageHeaderDetailLabelProps = TextProps;
3030

31-
export const PageHeaderDetailLabel: React.FC<PageHeaderDetailLabelProps> = ({
31+
export const PageHeaderDetailLabel: FC<PageHeaderDetailLabelProps> = ({
3232
children,
3333
...props
3434
}) =>
@@ -52,9 +52,7 @@ export type PageHeaderDetailItemProps = {
5252
label?: string;
5353
} & React.LiHTMLAttributes<HTMLLIElement>;
5454

55-
export const PageHeaderDetailItem: React.FC<PageHeaderDetailItemProps> = (
56-
props
57-
) => {
55+
export const PageHeaderDetailItem: FC<PageHeaderDetailItemProps> = (props) => {
5856
const { children, label, ...pprops } = props;
5957
const manuallyAssembled = !label;
6058
return (
@@ -74,10 +72,7 @@ export const PageHeaderDetailItem: React.FC<PageHeaderDetailItemProps> = (
7472
*/
7573
export type PageHeaderDetailProps = GridProps;
7674

77-
export const PageHeaderDetail: React.FC<GridProps> = ({
78-
children,
79-
...props
80-
}) => (
75+
export const PageHeaderDetail: FC<GridProps> = ({ children, ...props }) => (
8176
<Grid
8277
tag='ul'
8378
vertical={false}
@@ -95,7 +90,7 @@ export type PageHeaderHeadingTitleProps = {
9590
className?: string;
9691
} & React.HTMLAttributes<HTMLHeadingElement>;
9792

98-
export const PageHeaderHeadingTitle: React.FC<PageHeaderHeadingTitleProps> = (
93+
export const PageHeaderHeadingTitle: FC<PageHeaderHeadingTitleProps> = (
9994
props
10095
) => {
10196
const { className, children } = props;
@@ -212,7 +207,7 @@ export const PageHeaderHeading: FC<PageHeaderHeadingProps> = (props) => {
212207
*/
213208
export type PageHeaderProps = React.HTMLAttributes<HTMLDivElement>;
214209

215-
export const PageHeader: React.FC<PageHeaderProps> = (props) => (
210+
export const PageHeader: FC<PageHeaderProps> = (props) => (
216211
<div className='slds-page-header' role='banner' {...props}>
217212
{props.children}
218213
</div>

src/scripts/Popover.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
1-
import React, { HTMLAttributes, CSSProperties, FC, useRef } from 'react';
1+
import React, {
2+
HTMLAttributes,
3+
CSSProperties,
4+
FC,
5+
useRef,
6+
ReactNode,
7+
} from 'react';
28
import classnames from 'classnames';
39
import {
410
AutoAlign,
@@ -9,7 +15,7 @@ import {
915
/**
1016
*
1117
*/
12-
export const PopoverHeader: React.FC = (props) => (
18+
export const PopoverHeader: FC<{ children?: ReactNode }> = (props) => (
1319
<div className='slds-popover__header'>{props.children}</div>
1420
);
1521

@@ -18,7 +24,7 @@ export const PopoverHeader: React.FC = (props) => (
1824
*/
1925
export type PopoverBodyProps = React.HTMLAttributes<HTMLDivElement>;
2026

21-
export const PopoverBody: React.FC<PopoverBodyProps> = (props) => (
27+
export const PopoverBody: FC<PopoverBodyProps> = (props) => (
2228
<div className='slds-popover__body' {...props}>
2329
{props.children}
2430
</div>

0 commit comments

Comments
 (0)