You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

199 lines
4.8 KiB

2 months ago
  1. // @flow
  2. /* eslint-disable import/no-unused-modules */
  3. import type { Placement, ModifierPhases } from './enums';
  4. import type { PopperOffsetsModifier } from './modifiers/popperOffsets';
  5. import type { FlipModifier } from './modifiers/flip';
  6. import type { HideModifier } from './modifiers/hide';
  7. import type { OffsetModifier } from './modifiers/offset';
  8. import type { EventListenersModifier } from './modifiers/eventListeners';
  9. import type { ComputeStylesModifier } from './modifiers/computeStyles';
  10. import type { ArrowModifier } from './modifiers/arrow';
  11. import type { PreventOverflowModifier } from './modifiers/preventOverflow';
  12. import type { ApplyStylesModifier } from './modifiers/applyStyles';
  13. export type Obj = { [key: string]: any };
  14. export type VisualViewport = EventTarget & {
  15. width: number,
  16. height: number,
  17. offsetLeft: number,
  18. offsetTop: number,
  19. scale: number,
  20. };
  21. // This is a limited subset of the Window object, Flow doesn't provide one
  22. // so we define our own, with just the properties we need
  23. export type Window = {|
  24. innerHeight: number,
  25. offsetHeight: number,
  26. innerWidth: number,
  27. offsetWidth: number,
  28. pageXOffset: number,
  29. pageYOffset: number,
  30. getComputedStyle: typeof getComputedStyle,
  31. addEventListener(type: any, listener: any, optionsOrUseCapture?: any): void,
  32. removeEventListener(
  33. type: any,
  34. listener: any,
  35. optionsOrUseCapture?: any
  36. ): void,
  37. Element: Element,
  38. HTMLElement: HTMLElement,
  39. Node: Node,
  40. toString(): '[object Window]',
  41. devicePixelRatio: number,
  42. visualViewport?: VisualViewport,
  43. ShadowRoot: ShadowRoot,
  44. |};
  45. export type Rect = {|
  46. width: number,
  47. height: number,
  48. x: number,
  49. y: number,
  50. |};
  51. export type Offsets = {|
  52. y: number,
  53. x: number,
  54. |};
  55. export type PositioningStrategy = 'absolute' | 'fixed';
  56. export type StateRects = {|
  57. reference: Rect,
  58. popper: Rect,
  59. |};
  60. export type StateOffsets = {|
  61. popper: Offsets,
  62. arrow?: Offsets,
  63. |};
  64. type OffsetData = { [Placement]: Offsets };
  65. export type State = {|
  66. elements: {|
  67. reference: Element | VirtualElement,
  68. popper: HTMLElement,
  69. arrow?: HTMLElement,
  70. |},
  71. options: OptionsGeneric<any>,
  72. placement: Placement,
  73. strategy: PositioningStrategy,
  74. orderedModifiers: Array<Modifier<any, any>>,
  75. rects: StateRects,
  76. scrollParents: {|
  77. reference: Array<Element | Window | VisualViewport>,
  78. popper: Array<Element | Window | VisualViewport>,
  79. |},
  80. styles: {|
  81. [key: string]: $Shape<CSSStyleDeclaration>,
  82. |},
  83. attributes: {|
  84. [key: string]: { [key: string]: string | boolean },
  85. |},
  86. modifiersData: {
  87. arrow?: {
  88. x?: number,
  89. y?: number,
  90. centerOffset: number,
  91. },
  92. hide?: {
  93. isReferenceHidden: boolean,
  94. hasPopperEscaped: boolean,
  95. referenceClippingOffsets: SideObject,
  96. popperEscapeOffsets: SideObject,
  97. },
  98. offset?: OffsetData,
  99. preventOverflow?: Offsets,
  100. popperOffsets?: Offsets,
  101. [key: string]: any,
  102. },
  103. reset: boolean,
  104. |};
  105. type SetAction<S> = S | ((prev: S) => S);
  106. export type Instance = {|
  107. state: State,
  108. destroy: () => void,
  109. forceUpdate: () => void,
  110. update: () => Promise<$Shape<State>>,
  111. setOptions: (
  112. setOptionsAction: SetAction<$Shape<OptionsGeneric<any>>>
  113. ) => Promise<$Shape<State>>,
  114. |};
  115. export type ModifierArguments<Options: Obj> = {
  116. state: State,
  117. instance: Instance,
  118. options: $Shape<Options>,
  119. name: string,
  120. };
  121. export type Modifier<Name, Options: Obj> = {|
  122. name: Name,
  123. enabled: boolean,
  124. phase: ModifierPhases,
  125. requires?: Array<string>,
  126. requiresIfExists?: Array<string>,
  127. fn: (ModifierArguments<Options>) => State | void,
  128. effect?: (ModifierArguments<Options>) => (() => void) | void,
  129. options?: $Shape<Options>,
  130. data?: Obj,
  131. |};
  132. export type StrictModifiers =
  133. | $Shape<OffsetModifier>
  134. | $Shape<ApplyStylesModifier>
  135. | $Shape<ArrowModifier>
  136. | $Shape<HideModifier>
  137. | $Shape<ComputeStylesModifier>
  138. | $Shape<EventListenersModifier>
  139. | $Shape<FlipModifier>
  140. | $Shape<PreventOverflowModifier>
  141. | $Shape<PopperOffsetsModifier>;
  142. export type EventListeners = {| scroll: boolean, resize: boolean |};
  143. export type Options = {|
  144. placement: Placement,
  145. modifiers: Array<$Shape<Modifier<any, any>>>,
  146. strategy: PositioningStrategy,
  147. onFirstUpdate?: ($Shape<State>) => void,
  148. |};
  149. export type OptionsGeneric<TModifier> = {|
  150. placement: Placement,
  151. modifiers: Array<TModifier>,
  152. strategy: PositioningStrategy,
  153. onFirstUpdate?: ($Shape<State>) => void,
  154. |};
  155. export type UpdateCallback = (State) => void;
  156. export type ClientRectObject = {|
  157. x: number,
  158. y: number,
  159. top: number,
  160. left: number,
  161. right: number,
  162. bottom: number,
  163. width: number,
  164. height: number,
  165. |};
  166. export type SideObject = {|
  167. top: number,
  168. left: number,
  169. right: number,
  170. bottom: number,
  171. |};
  172. export type Padding = number | $Shape<SideObject>;
  173. export type VirtualElement = {|
  174. getBoundingClientRect: () => ClientRect | DOMRect,
  175. contextElement?: Element,
  176. |};