Skip to content

Commit d66476d

Browse files
committed
chore(component): fix component function type with dedicated function
1 parent db72fb7 commit d66476d

File tree

88 files changed

+362
-287
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+362
-287
lines changed

packages/lumx-react/src/components/alert-dialog/AlertDialog.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import React, { forwardRef } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
3+
import React from 'react';
24

35
import classNames from 'classnames';
46

@@ -14,9 +16,7 @@ import {
1416
Toolbar,
1517
ButtonProps,
1618
} from '@lumx/react';
17-
1819
import { mdiAlert, mdiAlertCircle, mdiCheckCircle, mdiInformation } from '@lumx/icons';
19-
import { Comp } from '@lumx/react/utils/type';
2020
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
2121
import { useId } from '@lumx/react/hooks/useId';
2222

@@ -77,7 +77,7 @@ const DEFAULT_PROPS: Partial<DialogProps> = {
7777
* It should not have a complex content.
7878
* Children of this component should only be strings, paragraphs or links.
7979
*/
80-
export const AlertDialog: Comp<AlertDialogProps, HTMLDivElement> = forwardRef((props, ref) => {
80+
export const AlertDialog = createComponent<AlertDialogProps, HTMLDivElement>((props, ref) => {
8181
const { id, title, className, cancelProps, confirmProps, kind, size, dialogProps, children, ...forwardedProps } =
8282
props;
8383

packages/lumx-react/src/components/autocomplete/Autocomplete.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import React, { forwardRef, ReactNode, SyntheticEvent, useRef } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
import React, { ReactNode, SyntheticEvent, useRef } from 'react';
23

34
import classNames from 'classnames';
45

56
import { Dropdown, DropdownProps, IconButtonProps, Offset, Placement, TextField, TextFieldProps } from '@lumx/react';
67

7-
import { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';
8+
import { GenericProps, HasTheme } from '@lumx/react/utils/type';
89
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
910
import { useFocus } from '@lumx/react/hooks/useFocus';
1011
import { mergeRefs } from '@lumx/react/utils/mergeRefs';
@@ -199,7 +200,7 @@ const DEFAULT_PROPS: Partial<AutocompleteProps> = {
199200
* @param ref Component ref.
200201
* @return React element.
201202
*/
202-
export const Autocomplete: Comp<AutocompleteProps, HTMLDivElement> = forwardRef((props, ref) => {
203+
export const Autocomplete = createComponent<AutocompleteProps, HTMLDivElement>((props, ref) => {
203204
const {
204205
anchorToInput,
205206
children,

packages/lumx-react/src/components/autocomplete/AutocompleteMultiple.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1+
import { createComponent } from '@lumx/react/utils/createComponent';
12
import { mdiClose } from '@lumx/icons';
2-
import { Autocomplete, AutocompleteProps, Chip, HorizontalAlignment, Icon, Size } from '@lumx/react';
33

4-
import { Comp } from '@lumx/react/utils/type';
4+
import { Autocomplete, AutocompleteProps, Chip, HorizontalAlignment, Icon, Size } from '@lumx/react';
55
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
66

77
import classNames from 'classnames';
8-
import React, { forwardRef, ReactNode } from 'react';
8+
import React, { ReactNode } from 'react';
99

1010
/**
1111
* Defines the props of the component.
@@ -65,7 +65,7 @@ const DEFAULT_PROPS: Partial<AutocompleteMultipleProps> = {
6565
* @param ref Component ref.
6666
* @return React element.
6767
*/
68-
export const AutocompleteMultiple: Comp<AutocompleteMultipleProps, HTMLDivElement> = forwardRef((props, ref) => {
68+
export const AutocompleteMultiple = createComponent<AutocompleteMultipleProps, HTMLDivElement>((props, ref) => {
6969
const {
7070
anchorToInput,
7171
children,

packages/lumx-react/src/components/avatar/Avatar.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import React, { forwardRef, KeyboardEventHandler, MouseEventHandler, ReactElement, ReactNode } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
import React, { KeyboardEventHandler, MouseEventHandler, ReactElement, ReactNode } from 'react';
23

34
import classNames from 'classnames';
45

56
import { AspectRatio, Size, Theme, Thumbnail, ThumbnailProps } from '@lumx/react';
67

7-
import { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';
8+
import { GenericProps, HasTheme } from '@lumx/react/utils/type';
89
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
910

1011
/**
@@ -66,7 +67,7 @@ const DEFAULT_PROPS: Partial<AvatarProps> = {
6667
* @param ref Component ref.
6768
* @return React element.
6869
*/
69-
export const Avatar: Comp<AvatarProps, HTMLDivElement> = forwardRef((props, ref) => {
70+
export const Avatar = createComponent<AvatarProps, HTMLDivElement>((props, ref) => {
7071
const {
7172
actions,
7273
alt,

packages/lumx-react/src/components/badge/Badge.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1+
import { createComponent } from '@lumx/react/utils/createComponent';
12
import { ColorPalette } from '@lumx/react';
2-
import { Comp, GenericProps } from '@lumx/react/utils/type';
3+
import { GenericProps } from '@lumx/react/utils/type';
34
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
45
import classNames from 'classnames';
5-
import React, { forwardRef, ReactNode } from 'react';
6+
import React, { ReactNode } from 'react';
67

78
/**
89
* Defines the props of the component.
@@ -38,7 +39,7 @@ const DEFAULT_PROPS: Partial<BadgeProps> = {
3839
* @param ref Component ref.
3940
* @return React element.
4041
*/
41-
export const Badge: Comp<BadgeProps, HTMLDivElement> = forwardRef((props, ref) => {
42+
export const Badge = createComponent<BadgeProps, HTMLDivElement>((props, ref) => {
4243
const { children, className, color, ...forwardedProps } = props;
4344
return (
4445
<div

packages/lumx-react/src/components/badge/BadgeWrapper.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1+
import { createComponent } from '@lumx/react/utils/createComponent';
12
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
23
import { DEFAULT_PROPS } from '@lumx/react/components/select/WithSelectContext';
3-
import { Comp, GenericProps } from '@lumx/react/utils/type';
4+
import { GenericProps } from '@lumx/react/utils/type';
45
import classNames from 'classnames';
5-
import React, { forwardRef, ReactElement, ReactNode } from 'react';
6+
import React, { ReactElement, ReactNode } from 'react';
67

78
export interface BadgeWrapperProps extends GenericProps {
89
/** Badge. */
@@ -21,7 +22,7 @@ const COMPONENT_NAME = 'BadgeWrapper';
2122
*/
2223
const CLASSNAME = getRootClassName(COMPONENT_NAME);
2324

24-
export const BadgeWrapper: Comp<BadgeWrapperProps, HTMLDivElement> = forwardRef((props, ref) => {
25+
export const BadgeWrapper = createComponent<BadgeWrapperProps, HTMLDivElement>((props, ref) => {
2526
const { badge, children, className, ...forwardedProps } = props;
2627

2728
return (

packages/lumx-react/src/components/button/Button.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import React, { forwardRef, ReactNode } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
import React, { ReactNode } from 'react';
23

34
import classNames from 'classnames';
45
import isEmpty from 'lodash/isEmpty';
56

67
import { Emphasis, Icon, Size, Theme, Text } from '@lumx/react';
7-
import { Comp, isComponent } from '@lumx/react/utils/type';
8+
import { isComponent } from '@lumx/react/utils/type';
89
import { getBasicClass, getRootClassName } from '@lumx/react/utils/className';
910
import { BaseButtonProps, ButtonRoot } from './ButtonRoot';
1011

@@ -54,7 +55,7 @@ const DEFAULT_PROPS: Partial<ButtonProps> = {
5455
* @param ref Component ref.
5556
* @return React element.
5657
*/
57-
export const Button: Comp<ButtonProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {
58+
export const Button = createComponent<ButtonProps, HTMLButtonElement | HTMLAnchorElement>((props, ref) => {
5859
const { children, className, emphasis, leftIcon, rightIcon, size, theme, ...forwardedProps } = props;
5960

6061
const buttonClassName = classNames(

packages/lumx-react/src/components/button/ButtonGroup.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import React, { forwardRef } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
import React from 'react';
23

34
import classNames from 'classnames';
45

5-
import { Comp, GenericProps } from '@lumx/react/utils/type';
6+
import { GenericProps } from '@lumx/react/utils/type';
67
import { getRootClassName } from '@lumx/react/utils/className';
78

89
/**
@@ -32,7 +33,7 @@ const DEFAULT_PROPS: Partial<ButtonGroupProps> = {};
3233
* @param ref Component ref.
3334
* @return React element.
3435
*/
35-
export const ButtonGroup: Comp<ButtonGroupProps, HTMLDivElement> = forwardRef((props, ref) => {
36+
export const ButtonGroup = createComponent<ButtonGroupProps, HTMLDivElement>((props, ref) => {
3637
const { children, className, ...forwardedProps } = props;
3738

3839
return (

packages/lumx-react/src/components/button/ButtonRoot.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
import React, { AriaAttributes, ButtonHTMLAttributes, DetailedHTMLProps, forwardRef, RefObject } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
2+
import React, { AriaAttributes, ButtonHTMLAttributes, DetailedHTMLProps, RefObject } from 'react';
23

34
import isEmpty from 'lodash/isEmpty';
45

56
import classNames from 'classnames';
67

78
import { ColorPalette, Emphasis, Size, Theme } from '@lumx/react';
89
import { CSS_PREFIX } from '@lumx/react/constants';
9-
import { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';
10+
import { GenericProps, HasTheme } from '@lumx/react/utils/type';
1011
import { handleBasicClasses } from '@lumx/react/utils/className';
1112
import { renderLink } from '@lumx/react/utils/renderLink';
1213

@@ -94,7 +95,7 @@ const renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {
9495
* @param ref Component ref.
9596
* @return React element.
9697
*/
97-
export const ButtonRoot: Comp<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {
98+
export const ButtonRoot = createComponent<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement>((props, ref) => {
9899
const {
99100
'aria-label': ariaLabel,
100101
children,

packages/lumx-react/src/components/button/IconButton.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import React, { forwardRef } from 'react';
1+
import { createComponent } from '@lumx/react/utils/createComponent';
22

3+
import React from 'react';
34
import { Emphasis, Icon, Size, Theme, Tooltip, TooltipProps } from '@lumx/react';
45
import { BaseButtonProps, ButtonRoot } from '@lumx/react/components/button/ButtonRoot';
5-
import { Comp } from '@lumx/react/utils/type';
66
import { getRootClassName } from '@lumx/react/utils/className';
77

88
export interface IconButtonProps extends BaseButtonProps {
@@ -56,7 +56,7 @@ const DEFAULT_PROPS: Partial<IconButtonProps> = {
5656
* @param ref Component ref.
5757
* @return React element.
5858
*/
59-
export const IconButton: Comp<IconButtonProps, HTMLButtonElement> = forwardRef((props, ref) => {
59+
export const IconButton = createComponent<IconButtonProps, HTMLButtonElement>((props, ref) => {
6060
const { emphasis, image, icon, label, size, theme, tooltipProps, hideTooltip, ...forwardedProps } = props;
6161

6262
return (

0 commit comments

Comments
 (0)