diff --git a/package.json b/package.json index 0a2bdb3..b21c873 100644 --- a/package.json +++ b/package.json @@ -76,7 +76,7 @@ "@babel/preset-react": "^7.9.4", "@emotion/core": "^10.0.28", "@emotion/styled": "^10.0.27", - "@popperjs/core": "^2.2.1", + "@popperjs/core": "^2.3.3", "@rollup/plugin-commonjs": "^11.0.2", "@rollup/plugin-node-resolve": "^7.1.1", "@rollup/plugin-replace": "^2.3.1", diff --git a/src/Popper.js b/src/Popper.js index f7e9c85..d9e70f9 100644 --- a/src/Popper.js +++ b/src/Popper.js @@ -5,6 +5,7 @@ import { type Placement, type PositioningStrategy, type VirtualElement, + type StrictModifiers, type Modifier, } from '@popperjs/core/lib'; import { ManagerReferenceNodeContext } from './Manager'; @@ -13,7 +14,7 @@ import { unwrapArray, setRef } from './utils'; import { usePopper } from './usePopper'; type ReferenceElement = ?(VirtualElement | HTMLElement); -type Modifiers = Array<$Shape>>; +type Modifiers = Array>>; export type PopperArrowProps = {| ref: Ref, diff --git a/typings/react-popper.d.ts b/typings/react-popper.d.ts index dc7b1c4..a8176dd 100644 --- a/typings/react-popper.d.ts +++ b/typings/react-popper.d.ts @@ -1,5 +1,8 @@ -import * as React from 'react'; import * as PopperJS from '@popperjs/core'; +import * as React from 'react'; + +// Utility type +type UnionWhere = U extends M ? U : never; interface ManagerProps { children: React.ReactNode; @@ -37,22 +40,39 @@ export interface PopperChildrenProps { arrowProps: PopperArrowProps; } -export interface PopperProps { +type StrictModifierNames = NonNullable; + +export type StrictModifier< + Name extends StrictModifierNames = StrictModifierNames +> = UnionWhere; + +export type Modifier< + Name, + Options extends object = object +> = Name extends StrictModifierNames + ? StrictModifier + : Partial>; + +export interface PopperProps { children: (props: PopperChildrenProps) => React.ReactNode; innerRef?: React.Ref; - modifiers?: Array>>; + modifiers?: ReadonlyArray>; placement?: PopperJS.Placement; strategy?: PopperJS.PositioningStrategy; referenceElement?: HTMLElement | PopperJS.VirtualElement; onFirstUpdate?: (state: Partial) => void; } -export class Popper extends React.Component {} +export class Popper extends React.Component< + PopperProps, + {} +> {} -export function usePopper( - referenceElement?: Element | null, +export function usePopper( + referenceElement?: Element | PopperJS.VirtualElement | null, popperElement?: HTMLElement | null, - options?: Partial & { + options?: Omit, 'modifiers'> & { createPopper?: typeof PopperJS.createPopper; + modifiers?: ReadonlyArray>; } ): { styles: { [key: string]: React.CSSProperties }; diff --git a/yarn.lock b/yarn.lock index 09dcaba..5749a3a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1251,10 +1251,10 @@ "@parcel/utils" "^1.11.0" physical-cpu-count "^2.0.0" -"@popperjs/core@^2.2.1": - version "2.2.1" - resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.2.1.tgz#d7d1d7fbdc1f2aa24e62f4ef4b001be7727340c5" - integrity sha512-BChdj3idQiLi+7vPhE6gEDiPzpozvSrUqbSMoSTlRbOQkU0p6u4si0UBydegTyphsYSZC2AUHGYYICP0gqmEVg== +"@popperjs/core@^2.3.3": + version "2.3.3" + resolved "https://registry.npmjs.org/@popperjs/core/-/core-2.3.3.tgz#8731722aeb7330e8fd9eb5d424be6b98dea7d6da" + integrity sha512-yEvVC8RfhRPkD9TUn7cFcLcgoJePgZRAOR7T21rcRY5I8tpuhzeWfGa7We7tB14fe9R7wENdqUABcMdwD4SQLw== "@rollup/plugin-commonjs@^11.0.2": version "11.0.2"