material-ui-popup-state
Advanced tools
Comparing version 3.1.1 to 4.0.0
@@ -5,2 +5,4 @@ import { SyntheticEvent, MouseEvent, TouchEvent, FocusEvent } from 'react' | ||
export type AnchorPosition = { left: number; top: number } | ||
export type PopupState = { | ||
@@ -17,2 +19,3 @@ open: (eventOrAnchorEl?: SyntheticEvent<any> | HTMLElement | null) => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
setAnchorEl: (anchorEl: HTMLElement) => any | ||
@@ -23,2 +26,3 @@ setAnchorElUsed: boolean | ||
variant: Variant | ||
_openEventType: string | null | undefined | ||
_childPopupState: PopupState | undefined | ||
@@ -32,3 +36,5 @@ _setChildPopupState: (popupState: PopupState | null | undefined) => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
hovered: boolean | ||
_openEventType: string | null | undefined | ||
_childPopupState: PopupState | undefined | ||
@@ -130,2 +136,4 @@ _deferNextOpen: boolean | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
anchorReference: 'anchorEl' | 'anchorPosition' | ||
open: boolean | ||
@@ -148,2 +156,4 @@ onClose: () => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
anchorReference: 'anchorEl' | 'anchorPosition' | ||
open: boolean | ||
@@ -150,0 +160,0 @@ onClose: () => void |
30
core.js
@@ -47,4 +47,6 @@ "use strict"; | ||
anchorEl: null, | ||
anchorPosition: null, | ||
hovered: false, | ||
focused: false, | ||
_openEventType: null, | ||
_childPopupState: null, | ||
@@ -66,4 +68,6 @@ _deferNextOpen: false, | ||
anchorEl = state.anchorEl, | ||
anchorPosition = state.anchorPosition, | ||
hovered = state.hovered, | ||
focused = state.focused, | ||
_openEventType = state._openEventType, | ||
_childPopupState = state._childPopupState, | ||
@@ -96,2 +100,8 @@ _deferNextOpen = state._deferNextOpen, | ||
var currentTarget = eventOrAnchorEl && eventOrAnchorEl.currentTarget; | ||
var clientX = eventOrAnchorEl && eventOrAnchorEl.clientX; | ||
var clientY = eventOrAnchorEl && eventOrAnchorEl.clientY; | ||
var anchorPosition = typeof clientX === 'number' && typeof clientY === 'number' ? { | ||
left: clientX, | ||
top: clientY | ||
} : null; | ||
@@ -118,4 +128,6 @@ if (eventType === 'touchstart') { | ||
isOpen: true, | ||
anchorPosition: anchorPosition, | ||
hovered: eventType === 'mouseover' || hovered, | ||
focused: eventType === 'focus' || focused | ||
focused: eventType === 'focus' || focused, | ||
_openEventType: eventType | ||
}; | ||
@@ -217,2 +229,3 @@ | ||
anchorEl: anchorEl, | ||
anchorPosition: anchorPosition, | ||
setAnchorEl: setAnchorEl, | ||
@@ -230,2 +243,3 @@ setAnchorElUsed: setAnchorElUsed, | ||
disableAutoFocus: disableAutoFocus !== null && disableAutoFocus !== void 0 ? disableAutoFocus : Boolean(hovered || focused), | ||
_openEventType: _openEventType, | ||
_childPopupState: _childPopupState, | ||
@@ -351,9 +365,14 @@ _setChildPopupState: _setChildPopupState | ||
anchorEl = _ref4.anchorEl, | ||
anchorPosition = _ref4.anchorPosition, | ||
close = _ref4.close, | ||
popupId = _ref4.popupId, | ||
onMouseLeave = _ref4.onMouseLeave, | ||
disableAutoFocus = _ref4.disableAutoFocus; | ||
disableAutoFocus = _ref4.disableAutoFocus, | ||
_openEventType = _ref4._openEventType; | ||
var useAnchorPosition = _openEventType === 'contextmenu'; | ||
return _objectSpread({ | ||
id: popupId, | ||
anchorEl: anchorEl, | ||
anchorPosition: anchorPosition, | ||
anchorReference: useAnchorPosition ? 'anchorPosition' : 'anchorEl', | ||
open: isOpen, | ||
@@ -386,9 +405,14 @@ onClose: close, | ||
anchorEl = _ref5.anchorEl, | ||
anchorPosition = _ref5.anchorPosition, | ||
close = _ref5.close, | ||
popupId = _ref5.popupId, | ||
onMouseLeave = _ref5.onMouseLeave, | ||
disableAutoFocus = _ref5.disableAutoFocus; | ||
disableAutoFocus = _ref5.disableAutoFocus, | ||
_openEventType = _ref5._openEventType; | ||
var useAnchorPosition = _openEventType === 'contextmenu'; | ||
return _objectSpread({ | ||
id: popupId, | ||
anchorEl: anchorEl, | ||
anchorPosition: anchorPosition, | ||
anchorReference: useAnchorPosition ? 'anchorPosition' : 'anchorEl', | ||
open: isOpen, | ||
@@ -395,0 +419,0 @@ onClose: close, |
@@ -5,2 +5,4 @@ import { SyntheticEvent, MouseEvent, TouchEvent, FocusEvent } from 'react' | ||
export type AnchorPosition = { left: number; top: number } | ||
export type PopupState = { | ||
@@ -17,2 +19,3 @@ open: (eventOrAnchorEl?: SyntheticEvent<any> | HTMLElement | null) => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
setAnchorEl: (anchorEl: HTMLElement) => any | ||
@@ -23,2 +26,3 @@ setAnchorElUsed: boolean | ||
variant: Variant | ||
_openEventType: string | null | undefined | ||
_childPopupState: PopupState | undefined | ||
@@ -32,3 +36,5 @@ _setChildPopupState: (popupState: PopupState | null | undefined) => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
hovered: boolean | ||
_openEventType: string | null | undefined | ||
_childPopupState: PopupState | undefined | ||
@@ -130,2 +136,4 @@ _deferNextOpen: boolean | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
anchorReference: 'anchorEl' | 'anchorPosition' | ||
open: boolean | ||
@@ -148,2 +156,4 @@ onClose: () => void | ||
anchorEl: HTMLElement | undefined | ||
anchorPosition: AnchorPosition | null | undefined | ||
anchorReference: 'anchorEl' | 'anchorPosition' | ||
open: boolean | ||
@@ -150,0 +160,0 @@ onClose: () => void |
@@ -38,4 +38,6 @@ "use strict"; | ||
anchorEl: null, | ||
anchorPosition: null, | ||
hovered: false, | ||
focused: false, | ||
_openEventType: null, | ||
_childPopupState: null, | ||
@@ -59,4 +61,6 @@ _deferNextOpen: false, | ||
anchorEl, | ||
anchorPosition, | ||
hovered, | ||
focused, | ||
_openEventType, | ||
_childPopupState, | ||
@@ -92,2 +96,8 @@ _deferNextOpen, | ||
const currentTarget = eventOrAnchorEl && eventOrAnchorEl.currentTarget; | ||
const clientX = eventOrAnchorEl && eventOrAnchorEl.clientX; | ||
const clientY = eventOrAnchorEl && eventOrAnchorEl.clientY; | ||
const anchorPosition = typeof clientX === 'number' && typeof clientY === 'number' ? { | ||
left: clientX, | ||
top: clientY | ||
} : null; | ||
@@ -114,4 +124,6 @@ if (eventType === 'touchstart') { | ||
isOpen: true, | ||
anchorPosition, | ||
hovered: eventType === 'mouseover' || hovered, | ||
focused: eventType === 'focus' || focused | ||
focused: eventType === 'focus' || focused, | ||
_openEventType: eventType | ||
}; | ||
@@ -211,2 +223,3 @@ | ||
anchorEl, | ||
anchorPosition, | ||
setAnchorEl, | ||
@@ -224,2 +237,3 @@ setAnchorElUsed, | ||
disableAutoFocus: disableAutoFocus !== null && disableAutoFocus !== void 0 ? disableAutoFocus : Boolean(hovered || focused), | ||
_openEventType, | ||
_childPopupState, | ||
@@ -352,10 +366,15 @@ _setChildPopupState | ||
anchorEl, | ||
anchorPosition, | ||
close, | ||
popupId, | ||
onMouseLeave, | ||
disableAutoFocus | ||
disableAutoFocus, | ||
_openEventType | ||
}) { | ||
const useAnchorPosition = _openEventType === 'contextmenu'; | ||
return { | ||
id: popupId, | ||
anchorEl, | ||
anchorPosition, | ||
anchorReference: useAnchorPosition ? 'anchorPosition' : 'anchorEl', | ||
open: isOpen, | ||
@@ -389,10 +408,15 @@ onClose: close, | ||
anchorEl, | ||
anchorPosition, | ||
close, | ||
popupId, | ||
onMouseLeave, | ||
disableAutoFocus | ||
disableAutoFocus, | ||
_openEventType | ||
}) { | ||
const useAnchorPosition = _openEventType === 'contextmenu'; | ||
return { | ||
id: popupId, | ||
anchorEl, | ||
anchorPosition, | ||
anchorReference: useAnchorPosition ? 'anchorPosition' : 'anchorEl', | ||
open: isOpen, | ||
@@ -399,0 +423,0 @@ onClose: close, |
{ | ||
"name": "material-ui-popup-state", | ||
"version": "3.1.1", | ||
"version": "4.0.0", | ||
"description": "easiest way to create menus, popovers, and poppers with material-ui", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
@@ -222,2 +222,4 @@ # material-ui-popup-state | ||
- `bindContextMenu`: creates props for a component that opens the popup on when right clicked (`contextmenu` event). | ||
**NOTE**: `bindPopover`/`bindMenu` will position the Popover/Menu to the `contextmenu` event location. To position | ||
using the `contextmenu` target element instead, pass `anchorReference="anchorEl"` after `{...bindPopover(popupState)}`/`{...bindMenu(popupState)}`. | ||
- `bindToggle`: creates props for a component that toggles the popup when clicked. | ||
@@ -296,2 +298,3 @@ - `bindHover`: creates props for a component that opens the popup while hovered. | ||
- `anchorEl`: the current anchor element | ||
- `anchorPosition`: the current anchor position | ||
- `setAnchorEl`: sets the anchor element (the `currentTarget` of the triggering | ||
@@ -503,2 +506,4 @@ mouse event is used by default unless you have called `setAnchorEl`) | ||
- `bindContextMenu`: creates props for a component that opens the popup on when right clicked (`contextmenu` event). | ||
**NOTE**: `bindPopover`/`bindMenu` will position the Popover/Menu to the `contextmenu` event location. To position | ||
using the `contextmenu` target element instead, pass `anchorReference="anchorEl"` after `{...bindPopover(popupState)}`/`{...bindMenu(popupState)}`. | ||
- `bindToggle`: creates props for a component that toggles the popup when clicked. | ||
@@ -571,2 +576,3 @@ - `bindHover`: creates props for a component that opens the popup while hovered. | ||
- `anchorEl`: the current anchor element | ||
- `anchorPosition`: the current anchor position | ||
- `setAnchorEl`: sets the anchor element (the `currentTarget` of the triggering | ||
@@ -573,0 +579,0 @@ mouse event is used by default unless you have called `setAnchorEl`) |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
141812
2119
591