8000 refactor(CDropdown): improve and clean-up syntax · lunaluna2021/coreui-react@fa0c691 · GitHub
[go: up one dir, main page]

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit fa0c691

Browse files
committed
refactor(CDropdown): improve and clean-up syntax
1 parent 18e2cd3 commit fa0c691

File tree

3 files changed

+38
-39
lines changed

3 files changed

+38
-39
lines changed

packages/coreui-react/src/components/dropdown/CDropdown.tsx

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -115,10 +115,10 @@ export const CDropdown = forwardRef<HTMLDivElement | HTMLLIElement, CDropdownPro
115115
},
116116
ref,
117117
) => {
118-
const [_visible, setVisible] = useState(visible)
119118
const dropdownRef = useRef<HTMLDivElement>(null)
120119
const dropdownToggleRef = useRef(null)
121120
const forkedRef = useForkedRef(ref, dropdownRef)
121+
const [_visible, setVisible] = useState(visible)
122122

123123
const Component = variant === 'nav-item' ? 'li' : component
124124

@@ -149,7 +149,7 @@ export const CDropdown = forwardRef<HTMLDivElement | HTMLLIElement, CDropdownPro
149149
!_visible && onHide && onHide()
150150
}, [_visible])
151151

152-
const dropdownContent = () => {
152+
const DropdownContent = () => {
153153
return variant === 'input-group' ? (
154154
<>{children}</>
155155
) : (
@@ -174,13 +174,15 @@ export const CDropdown = forwardRef<HTMLDivElement | HTMLLIElement, CDropdownPro
174174
)
175175
}
176176

177-
return popper ? (
178-
<CDropdownContext.Provider value={contextValues}>
179-
<Manager>{dropdownContent()}</Manager>
180-
</CDropdownContext.Provider>
181-
) : (
177+
return (
182178
<CDropdownContext.Provider value={contextValues}>
183-
{dropdownContent()}
179+
{popper ? (
180+
<Manager>
181+
<DropdownContent />
182+
</Manager>
183+
) : (
184+
<DropdownContent />
185+
)}
184186
</CDropdownContext.Provider>
185187
)
186188
},

packages/coreui-react/src/components/dropdown/CDropdownMenu.tsx

Lines changed: 28 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -126,36 +126,34 @@ export const CDropdownMenu: FC<CDropdownMenuProps> = ({
126126
return classNames
127127
}
128128

129-
const dropdownMenuComponent = (style?: React.CSSProperties, ref?: React.Ref<HTMLDivElement>) => {
130-
return (
131-
<Component
132-
className={classNames(
133-
'dropdown-menu',
134-
{
135-
'dropdown-menu-dark': dark,
136-
show: visible,
137-
},
138-
alignment && alignmentClassNames(alignment),
139-
className,
140-
)}
141-
ref={ref}
142-
style={style}
143-
role="menu"
144-
aria-hidden={!visible}
145-
{...(!popper && { 'data-coreui-popper': 'static' })}
146-
{...rest}
147-
>
148-
{Component === 'ul'
149-
? React.Children.map(children, (child, index) => {
150-
if (React.isValidElement(child)) {
151-
return <li key={index}>{React.cloneElement(child)}</li>
152-
}
153-
return
154-
})
155-
: children}
156-
</Component>
157-
)
158-
}
129+
const dropdownMenuComponent = (style?: React.CSSProperties, ref?: React.Ref<HTMLDivElement>) => (
130+
<Component
131+
className={classNames(
132+
'dropdown-menu',
133+
{
134+
'dropdown-menu-dark': dark,
135+
show: visible,
136+
},
137+
alignment && alignmentClassNames(alignment),
138+
className,
139+
)}
140+
ref={ref}
141+
style={style}
142+
role="menu"
143+
aria-hidden={!visible}
144+
{...(!popper && { 'data-coreui-popper': 'static' })}
145+
{...rest}
146+
>
147+
{Component === 'ul'
148+
? React.Children.map(children, (child, index) => {
149+
if (React.isValidElement(child)) {
150+
return <li key={index}>{React.cloneElement(child)}</li>
151+
}
152+
return
153+
})
154+
: children}
155+
</Component>
156+
)
159157

160158
return popper && visible ? (
161159
<Popper innerRef={dropdownMenuRef} placement={_placement}>

packages/coreui-react/src/components/dropdown/CDropdownToggle.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ export const CDropdownToggle: FC<CDropdownToggleProps> = ({
6767
),
6868
'aria-expanded': visible,
6969
...(!rest.disabled && { ...triggers }),
70-
...triggers,
7170
}
7271

7372
// We use any because Toggler can be `a` as well as `button`.

0 commit comments

Comments
 (0)
0