Skip to content

Commit 4a73b4a

Browse files
committed
refactor(classname): simplify base class name when no modifier is needed
1 parent 2b6f4d9 commit 4a73b4a

File tree

18 files changed

+35
-111
lines changed

18 files changed

+35
-111
lines changed

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

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import classNames from 'classnames';
55
import { Dropdown, DropdownProps, IconButtonProps, Offset, Placement, TextField, TextFieldProps } from '@lumx/react';
66

77
import { GenericProps, HasTheme } from '@lumx/react/utils/type';
8-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
8+
import { getRootClassName } from '@lumx/react/utils/className';
99
import { useFocus } from '@lumx/react/hooks/useFocus';
1010
import { mergeRefs } from '@lumx/react/utils/mergeRefs';
1111
import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
@@ -245,16 +245,7 @@ export const Autocomplete = forwardRef<AutocompleteProps, HTMLDivElement>((props
245245
useFocus(inputAnchorRef.current, !isOpen && shouldFocusOnClose);
246246

247247
return (
248-
<div
249-
ref={ref}
250-
{...forwardedProps}
251-
className={classNames(
252-
className,
253-
handleBasicClasses({
254-
prefix: CLASSNAME,
255-
}),
256-
)}
257-
>
248+
<div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>
258249
<TextField
259250
{...textFieldProps}
260251
chips={chips}

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

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import classNames from 'classnames';
55
import { mdiClose } from '@lumx/icons';
66

77
import { Autocomplete, AutocompleteProps, Chip, HorizontalAlignment, Icon, Size } from '@lumx/react';
8-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
8+
import { getRootClassName } from '@lumx/react/utils/className';
99
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
1010
import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
1111

@@ -114,12 +114,7 @@ export const AutocompleteMultiple = forwardRef<AutocompleteMultipleProps, HTMLDi
114114
ref={ref}
115115
{...forwardedProps}
116116
anchorToInput={anchorToInput}
117-
className={classNames(
118-
className,
119-
handleBasicClasses({
120-
prefix: CLASSNAME,
121-
}),
122-
)}
117+
className={classNames(className, CLASSNAME)}
123118
name={name}
124119
value={value}
125120
onChange={onChange}

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { ReactElement, ReactNode } from 'react';
22

33
import classNames from 'classnames';
44

5-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
5+
import { getRootClassName } from '@lumx/react/utils/className';
66
import { DEFAULT_PROPS } from '@lumx/react/components/select/WithSelectContext';
77
import { GenericProps } from '@lumx/react/utils/type';
88
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
@@ -28,7 +28,7 @@ export const BadgeWrapper = forwardRef<BadgeWrapperProps, HTMLDivElement>((props
2828
const { badge, children, className, ...forwardedProps } = props;
2929

3030
return (
31-
<div ref={ref} {...forwardedProps} className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}>
31+
<div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>
3232
{children}
3333
{badge && <div className={`${CLASSNAME}__badge`}>{badge}</div>}
3434
</div>

packages/lumx-react/src/components/chip/ChipGroup.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import classNames from 'classnames';
44

55
import { HorizontalAlignment } from '@lumx/react/components';
66
import { GenericProps } from '@lumx/react/utils/type';
7-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
7+
import { getRootClassName } from '@lumx/react/utils/className';
88
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
99

1010
import { useChipGroupNavigation } from '@lumx/react/hooks/useChipGroupNavigation';
@@ -46,12 +46,9 @@ const CLASSNAME = getRootClassName(COMPONENT_NAME);
4646
*/
4747
const InternalChipGroup = forwardRef<ChipGroupProps, HTMLDivElement>((props, ref) => {
4848
const { align, children, className, ...forwardedProps } = props;
49-
const chipGroupClassName = handleBasicClasses({
50-
prefix: CLASSNAME,
51-
});
5249

5350
return (
54-
<div ref={ref} {...forwardedProps} className={classNames(className, chipGroupClassName)}>
51+
<div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>
5552
{children}
5653
</div>
5754
);

packages/lumx-react/src/components/dropdown/Dropdown.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { List, ListProps } from '@lumx/react/components/list/List';
66
import { Popover, PopoverProps } from '@lumx/react/components/popover/Popover';
77
import { useInfiniteScroll } from '@lumx/react/hooks/useInfiniteScroll';
88
import { GenericProps, isComponent } from '@lumx/react/utils/type';
9-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
9+
import { getRootClassName } from '@lumx/react/utils/className';
1010
import { Offset, Placement } from '@lumx/react/components/popover/constants';
1111
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
1212

@@ -162,7 +162,7 @@ export const Dropdown = forwardRef<DropdownProps, HTMLDivElement>((props, ref) =
162162
{...forwardedProps}
163163
focusAnchorOnClose={focusAnchorOnClose}
164164
anchorRef={anchorRef}
165-
className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}
165+
className={classNames(className, CLASSNAME)}
166166
elevation={0 as any}
167167
closeOnClickAway={closeOnClickAway}
168168
closeOnEscape={closeOnEscape}

packages/lumx-react/src/components/grid-column/GridColumn.tsx

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import classNames from 'classnames';
55

66
import { Size } from '@lumx/react';
77
import { GenericProps } from '@lumx/react/utils/type';
8-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
8+
import { getRootClassName } from '@lumx/react/utils/className';
99
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
1010

1111
export type GridColumnGapSize = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;
@@ -66,12 +66,7 @@ export const GridColumn = forwardRef<GridColumnProps>((props, ref): ReactElement
6666
<Component
6767
{...forwardedProps}
6868
ref={ref as React.Ref<any>}
69-
className={classNames(
70-
className,
71-
handleBasicClasses({
72-
prefix: CLASSNAME,
73-
}),
74-
)}
69+
className={classNames(className, CLASSNAME)}
7570
style={{
7671
...style,
7772
['--lumx-grid-column-item-min-width' as any]: isInteger(itemMinWidth) && `${itemMinWidth}px`,

packages/lumx-react/src/components/heading/Heading.tsx

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React from 'react';
33
import classNames from 'classnames';
44

55
import { HeadingElement } from '@lumx/react/utils/type';
6-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
6+
import { getRootClassName } from '@lumx/react/utils/className';
77
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
88

99
import { Text, TextProps } from '../text';
@@ -48,12 +48,7 @@ export const Heading = forwardRef<HeadingProps>((props, ref) => {
4848
return (
4949
<Text
5050
ref={ref}
51-
className={classNames(
52-
className,
53-
handleBasicClasses({
54-
prefix: CLASSNAME,
55-
}),
56-
)}
51+
className={classNames(className, CLASSNAME)}
5752
as={computedHeadingElement}
5853
typography={DEFAULT_TYPOGRAPHY_BY_LEVEL[computedHeadingElement]}
5954
{...forwardedProps}

packages/lumx-react/src/components/list/ListDivider.tsx

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React from 'react';
33
import classNames from 'classnames';
44

55
import { GenericProps } from '@lumx/react/utils/type';
6-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
6+
import { getRootClassName } from '@lumx/react/utils/className';
77
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
88

99
/**
@@ -31,13 +31,7 @@ const CLASSNAME = getRootClassName(COMPONENT_NAME);
3131
export const ListDivider = forwardRef<ListDividerProps, HTMLLIElement>((props, ref) => {
3232
const { className, ...forwardedProps } = props;
3333

34-
return (
35-
<li
36-
ref={ref}
37-
{...forwardedProps}
38-
className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}
39-
/>
40-
);
34+
return <li ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)} />;
4135
});
4236
ListDivider.displayName = COMPONENT_NAME;
4337
ListDivider.className = CLASSNAME;

packages/lumx-react/src/components/list/ListSubheader.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React, { ReactNode } from 'react';
33
import classNames from 'classnames';
44

55
import { GenericProps } from '@lumx/react/utils/type';
6-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
6+
import { getRootClassName } from '@lumx/react/utils/className';
77
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
88

99
/**
@@ -35,7 +35,7 @@ export const ListSubheader = forwardRef<ListSubheaderProps, HTMLLIElement>((prop
3535
const { children, className, ...forwardedProps } = props;
3636

3737
return (
38-
<li ref={ref} {...forwardedProps} className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}>
38+
<li ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>
3939
{children}
4040
</li>
4141
);

packages/lumx-react/src/components/popover-dialog/PopoverDialog.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React from 'react';
33
import classNames from 'classnames';
44

55
import { HasAriaLabelOrLabelledBy } from '@lumx/react/utils/type';
6-
import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
6+
import { getRootClassName } from '@lumx/react/utils/className';
77
import { forwardRef } from '@lumx/react/utils/react/forwardRef';
88

99
import { Popover, PopoverProps } from '../popover/Popover';
@@ -51,7 +51,7 @@ export const PopoverDialog = forwardRef<PopoverDialogProps, HTMLDivElement>((pro
5151
<Popover
5252
{...forwardedProps}
5353
ref={ref}
54-
className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}
54+
className={classNames(className, CLASSNAME)}
5555
role="dialog"
5656
aria-modal="true"
5757
/**

0 commit comments

Comments
 (0)