{"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/popup-proxy"},"props":{"target":{"type":["Boolean","String","Element"],"desc":"Configure a target element to trigger component toggle; 'true' means it enables the parent DOM element, 'false' means it disables attaching events to any DOM elements; By using a String (CSS selector) or a DOM element it attaches the events to the specified DOM element (if it exists)","default":"true","examples":["false",".my-parent","#target-id","$refs.target"],"category":"behavior","required":false},"no-parent-event":{"type":"Boolean","desc":"Skips attaching events to the target DOM element (that trigger the element to get shown)","category":"behavior"},"context-menu":{"type":"Boolean","desc":"Allows the component to behave like a context menu, which opens with a right mouse click (or a long press on touch-capable devices)","category":"behavior"},"model-value":{"desc":"Defines the state of the component (shown/hidden); Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":false,"syncable":true,"category":"dialog|menu","type":"Boolean","passthrough":true},"breakpoint":{"type":["Number","String"],"desc":"Breakpoint (in pixels) of window width/height (whichever is smaller) from where a Menu will get to be used instead of a Dialog","default":"450","category":"behavior","required":false},"hover":{"type":"Boolean","desc":"Also opens the menu when the pointer hovers its target and closes it when the pointer leaves both the target and the menu; Click/tap and keyboard interactions keep toggling as usual (touch devices fall back to them), so activating the target closes a hover-shown menu, unless it is still animating into view (which keeps a single move-and-click gesture from closing what it just opened); A hover-opened menu does not switch focus on itself and ignores 'touch-position'; Mutually exclusive with 'context-menu', which takes precedence; Only applies when a Menu is used (see 'breakpoint')","category":"menu","addedIn":"v2.26","passthrough":true},"hover-delay":{"type":"Number","desc":"Delay (in milliseconds) between the pointer entering the target and the menu showing up; Requires the 'hover' prop; Only applies when a Menu is used (see 'breakpoint')","default":"0","category":"menu","addedIn":"v2.26","required":false,"passthrough":true},"hover-hide-delay":{"type":"Number","desc":"Grace period (in milliseconds) in which the pointer can re-enter the target or the menu before it gets closed; Requires the 'hover' prop; Only applies when a Menu is used (see 'breakpoint')","default":"150","category":"menu","addedIn":"v2.26","required":false,"passthrough":true},"transition-show":{"type":"String","desc":"One of Quasar's embedded transitions; When a Menu is used it defaults to 'fade'; When a Dialog is used the default depends on 'position' (see 'breakpoint')","examples":["'fade'","'slide-down'"],"category":"dialog|menu","required":false,"passthrough":true},"transition-hide":{"type":"String","desc":"One of Quasar's embedded transitions; When a Menu is used it defaults to 'fade'; When a Dialog is used the default depends on 'position' (see 'breakpoint')","examples":["'fade'","'slide-down'"],"category":"dialog|menu","required":false,"passthrough":true},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":"300","category":"dialog|menu","required":false,"passthrough":true},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color; Only applies when a Menu is used (see 'breakpoint')","category":"menu","required":false,"passthrough":true},"fit":{"type":"Boolean","desc":"Allows the menu to match at least the full width of its target; Only applies when a Menu is used (see 'breakpoint')","category":"menu","passthrough":true},"cover":{"type":"Boolean","desc":"Allows the menu to cover its target. When used, the 'self' and 'fit' props are no longer effective; Only applies when a Menu is used (see 'breakpoint')","category":"menu","passthrough":true},"anchor":{"type":"String","desc":"Two values setting the starting position or anchor point of the menu relative to its target; Only applies when a Menu is used (see 'breakpoint')","values":["'top left'","'top middle'","'top right'","'top start'","'top end'","'center left'","'center middle'","'center right'","'center start'","'center end'","'bottom left'","'bottom middle'","'bottom right'","'bottom start'","'bottom end'"],"category":"menu","passthrough":true},"self":{"type":"String","desc":"Two values setting the menu's own position relative to its target; Only applies when a Menu is used (see 'breakpoint')","values":["'top left'","'top middle'","'top right'","'top start'","'top end'","'center left'","'center middle'","'center right'","'center start'","'center end'","'bottom left'","'bottom middle'","'bottom right'","'bottom start'","'bottom end'"],"category":"menu","passthrough":true},"offset":{"type":"Array","desc":"An array of two numbers (in pixels) which expands the anchor element's bounding box outward horizontally and vertically; the menu is then positioned against the expanded box, so the visible effect depends on the 'anchor'/'self' points in use; Only applies when a Menu is used (see 'breakpoint')","examples":["[8, 8]","[5, 10]"],"category":"menu","passthrough":true},"touch-position":{"type":"Boolean","desc":"Allows for the target position to be set by the mouse position, when the target of the menu is either clicked or touched; Only applies when a Menu is used (see 'breakpoint')","category":"menu","passthrough":true},"persistent":{"type":"Boolean","desc":"Allows the popup to not be dismissed by a click/tap outside of it or by hitting the ESC key; Also, an app route change won't dismiss it","category":"dialog|menu","passthrough":true},"no-esc-dismiss":{"type":"Boolean","desc":"User cannot dismiss the popup by hitting ESC key; No need to set it if 'persistent' prop is also set","category":"dialog|menu","passthrough":true},"no-route-dismiss":{"type":"Boolean","desc":"Changing route app won't dismiss the popup; No need to set it if 'persistent' prop is also set","category":"dialog|menu","passthrough":true},"auto-close":{"type":"Boolean","desc":"Any click/tap inside of the popup will close it","category":"dialog|menu","passthrough":true},"square":{"type":"Boolean","desc":"Forces content to have squared borders","category":"dialog|menu","passthrough":true},"no-refocus":{"type":"Boolean","desc":"(Accessibility) When the popup gets hidden, do not refocus on the DOM element that previously had focus","category":"dialog|menu","passthrough":true},"no-focus":{"type":"Boolean","desc":"(Accessibility) When the popup gets shown, do not switch focus on it","category":"dialog|menu","passthrough":true},"max-height":{"type":"String","desc":"The maximum height of the menu; Size in CSS units, including unit name; Only applies when a Menu is used (see 'breakpoint')","examples":["'16px'","'2rem'"],"category":"menu","default":"'99vh'","required":false,"passthrough":true},"max-width":{"type":["String","null"],"desc":"The maximum width of the menu; Size in CSS units, including unit name; Only applies when a Menu is used (see 'breakpoint')","examples":["'16px'","'2rem'"],"category":"menu","default":"null","required":false,"passthrough":true},"no-backdrop-dismiss":{"type":"Boolean","desc":"User cannot dismiss Dialog by clicking outside of it; No need to set it if 'persistent' prop is also set; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"seamless":{"type":"Boolean","desc":"Put Dialog into seamless mode; Does not use a backdrop so user is able to interact with the rest of the page too; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"backdrop-filter":{"type":"String","desc":"Apply a backdrop filter; The value needs to be the same as in the CSS specs for backdrop-filter; The examples are not an exhaustive list; Only applies when a Dialog is used (see 'breakpoint')","examples":["'blur(4px)'","'blur(4px) saturate(150%)'","'brightness(60%)'","'invert(70%)'","'grayscale(100%)'","'contrast(40%)'","'hue-rotate(120deg)'","'sepia(90%)'","'saturate(80%)'","'none'"],"category":"dialog","addedIn":"v2.15","passthrough":true},"maximized":{"type":"Boolean","desc":"Put Dialog into maximized mode; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"full-width":{"type":"Boolean","desc":"Dialog will try to render with same width as the window; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"full-height":{"type":"Boolean","desc":"Dialog will try to render with same height as the window; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"position":{"type":"String","desc":"Stick dialog to one of the sides (top, right, bottom or left); Only applies when a Dialog is used (see 'breakpoint')","default":"'standard'","values":["'standard'","'top'","'right'","'bottom'","'left'"],"category":"dialog","required":false,"passthrough":true},"no-shake":{"type":"Boolean","desc":"Do not shake up the Dialog to catch user's attention; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true},"allow-focus-outside":{"type":"Boolean","desc":"Allow elements outside of the Dialog to be focusable; By default, for accessibility reasons, QDialog does not allow outer focus; Only applies when a Dialog is used (see 'breakpoint')","category":"dialog","passthrough":true}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true}},"passthrough":true},"before-show":{"desc":"Emitted when component triggers show() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}},"passthrough":true},"show":{"desc":"Emitted after component has triggered show()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"before-hide":{"desc":"Emitted when component triggers hide() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}},"passthrough":true},"hide":{"desc":"Emitted after component has triggered hide()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"escape-key":{"desc":"Emitted when ESC key is pressed; Does not get emitted if the popup is 'persistent' or it has 'no-esc-dismiss' set","passthrough":true},"shake":{"desc":"Emitted when the Dialog shakes in order to catch user's attention, unless the 'no-shake' property is set; Only applies when a Dialog is used (see 'breakpoint')","passthrough":true}},"methods":{"show":{"desc":"Triggers component to show","params":{"evt":{"type":"Event","desc":"JS event object","required":false}},"returns":null},"hide":{"desc":"Triggers component to hide","params":{"evt":{"type":"Event","desc":"JS event object","required":false}},"returns":null},"toggle":{"desc":"Triggers component to toggle between show/hide","params":{"evt":{"type":"Event","desc":"JS event object","required":false}},"returns":null}},"computedProps":{"currentComponent":{"type":"Object","desc":"Access current underlying component (QMenu or QDialog)","definition":{"type":{"type":"String","desc":"Component type","values":["'dialog'","'menu'"]},"ref":{"type":"ComponentInstance","tsType":"QPopupProxyInnerComponent","desc":"The actual component (QMenu or QDialog); Access it directly, without '.value'"}}}}}