Skip to content

Commit 5ca68a9

Browse files
authored
Update react types to avoid unbound method lint errors (#3480)
Using @headlessui close methods/types in a project with eslint-typescript currently causes "UnboundMethod" errors because we're using class member syntax to define the functions. I tweaked the declarations here to use arrow syntax in few places. The behavior should be unchanged, but we are no longer implying the existence of a "this"
1 parent 994303f commit 5ca68a9

File tree

3 files changed

+14
-14
lines changed

3 files changed

+14
-14
lines changed

packages/@headlessui-react/src/components/dialog/dialog.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -88,8 +88,8 @@ let DialogContext = createContext<
8888
{
8989
dialogState: DialogStates
9090
unmount: boolean
91-
close(): void
92-
setTitleId(id: string | null): void
91+
close: () => void
92+
setTitleId: (id: string | null) => void
9393
},
9494
StateDefinition,
9595
]
@@ -340,7 +340,7 @@ export type DialogProps<TTag extends ElementType = typeof DEFAULT_DIALOG_TAG> =
340340
DialogPropsWeControl,
341341
PropsForFeatures<typeof DialogRenderFeatures> & {
342342
open?: boolean
343-
onClose(value: boolean): void
343+
onClose: (value: boolean) => void
344344
initialFocus?: MutableRefObject<HTMLElement | null>
345345
role?: 'dialog' | 'alertdialog'
346346
autoFocus?: boolean

packages/@headlessui-react/src/components/disclosure/disclosure.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ function useDisclosureContext(component: string) {
133133
}
134134

135135
let DisclosureAPIContext = createContext<{
136-
close(focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>): void
136+
close: (focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>) => void
137137
} | null>(null)
138138
DisclosureAPIContext.displayName = 'DisclosureAPIContext'
139139

@@ -163,7 +163,7 @@ function stateReducer(state: StateDefinition, action: Actions) {
163163
let DEFAULT_DISCLOSURE_TAG = Fragment
164164
type DisclosureRenderPropArg = {
165165
open: boolean
166-
close(focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>): void
166+
close: (focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>) => void
167167
}
168168
type DisclosurePropsWeControl = never
169169

packages/@headlessui-react/src/components/popover/popover.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -177,9 +177,9 @@ function usePopoverContext(component: string) {
177177
}
178178

179179
let PopoverAPIContext = createContext<{
180-
close(
180+
close: (
181181
focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null> | MouseEvent<HTMLElement>
182-
): void
182+
) => void
183183
isPortalled: boolean
184184
} | null>(null)
185185
PopoverAPIContext.displayName = 'PopoverAPIContext'
@@ -195,10 +195,10 @@ function usePopoverAPIContext(component: string) {
195195
}
196196

197197
let PopoverGroupContext = createContext<{
198-
registerPopover(registerBag: PopoverRegisterBag): void
199-
unregisterPopover(registerBag: PopoverRegisterBag): void
200-
isFocusWithinPopoverGroup(): boolean
201-
closeOthers(buttonId: string): void
198+
registerPopover: (registerBag: PopoverRegisterBag) => void
199+
unregisterPopover: (registerBag: PopoverRegisterBag) => void
200+
isFocusWithinPopoverGroup: () => boolean
201+
closeOthers: (buttonId: string) => void
202202
} | null>(null)
203203
PopoverGroupContext.displayName = 'PopoverGroupContext'
204204

@@ -216,7 +216,7 @@ function usePopoverPanelContext() {
216216
interface PopoverRegisterBag {
217217
buttonId: MutableRefObject<string | null>
218218
panelId: MutableRefObject<string | null>
219-
close(): void
219+
close: () => void
220220
}
221221
function stateReducer(state: StateDefinition, action: Actions) {
222222
return match(action.type, reducers, state, action)
@@ -227,9 +227,9 @@ function stateReducer(state: StateDefinition, action: Actions) {
227227
let DEFAULT_POPOVER_TAG = 'div' as const
228228
type PopoverRenderPropArg = {
229229
open: boolean
230-
close(
230+
close: (
231231
focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null> | MouseEvent<HTMLElement>
232-
): void
232+
) => void
233233
}
234234
type PopoverPropsWeControl = never
235235

0 commit comments

Comments
 (0)