bootstrap-vue
Version:
BootstrapVue, with over 40 plugins and more than 80 custom components, custom directives, and over 300 icons, provides one of the most comprehensive implementations of Bootstrap v4 components and grid system for Vue.js. With extensive and automated WAI-AR
300 lines (299 loc) • 9.55 kB
JSON
{
"name": "@bootstrap-vue/dropdown",
"version": "1.0.0",
"meta": {
"title": "Dropdown",
"description": "Dropdowns are toggleable, contextual overlays for displaying lists of links and actions in a dropdown menu format.",
"components": [
{
"component": "BDropdown",
"aliases": [
"BDd"
],
"props": [
{
"prop": "text",
"description": "Text to place in the toggle button, or in the split button is split mode"
},
{
"prop": "html",
"description": "HTML string to place in the toggle button, or in the split button is split mode. Use with caution"
},
{
"prop": "dropup",
"description": "When set, positions the menu on the top of the button"
},
{
"prop": "dropright",
"description": "When set, positions the menu to the right of the button"
},
{
"prop": "dropleft",
"description": "When set, positions the menu to the left of the button"
},
{
"prop": "right",
"description": "Align the right edge of the menu with the right of the button"
},
{
"prop": "noFlip",
"description": "Prevent the menu from auto flipping positions"
},
{
"prop": "offset",
"description": "Specify the number of pixels to shift the menu by. Negative values supported"
},
{
"prop": "lazy",
"description": "When set, will only mount the menu content into the DOM when the menu is open"
},
{
"prop": "popperOpts",
"description": "Additional configuration to pass to Popper.js"
},
{
"prop": "toggleText",
"description": "ARIA label (sr-only) to set on the toggle when in split mode"
},
{
"prop": "menuClass",
"description": "CSS class (or classes) to add to the menu container"
},
{
"prop": "toggleTag",
"description": "Specify the HTML tag to render instead of the default tag. Use with caution"
},
{
"prop": "toggleClass",
"description": "CSS class (or classes) to add to the toggle button"
},
{
"prop": "block",
"version": "2.1.0",
"description": "Renders a 100% width toggle button (expands to the width of its parent container)"
},
{
"prop": "noCaret",
"description": "Hide the caret indicator on the toggle button"
},
{
"prop": "split",
"description": "When set, renders a split button dropdown"
},
{
"prop": "splitHref",
"description": "Denotes the target URL of the link for the split button"
},
{
"prop": "splitTo",
"description": "router-link prop: Denotes the target route of the split button. When clicked, the value of the to prop will be passed to router.push() internally, so the value can be either a string or a Location descriptor object"
},
{
"prop": "splitVariant",
"description": "Applies one of the Bootstrap theme color variants to the split button. Defaults to the 'variant' prop value"
},
{
"prop": "splitButtonType",
"description": "Value to place in the 'type' attribute on the split button: 'button', 'submit', 'reset'"
},
{
"prop": "splitClass",
"version": "2.2.0",
"description": "CSS class (or classes) to add to the split button"
},
{
"prop": "boundary",
"description": "The boundary constraint of the menu: 'scrollParent', 'window', 'viewport', or a reference to an HTMLElement"
}
],
"events": [
{
"event": "show",
"description": "Emitted just before dropdown is shown. Cancelable.",
"args": [
{
"arg": "bvEvt",
"type": "BvEvent",
"description": "BvEvent object. Call bvEvt.preventDefault() to cancel show."
}
]
},
{
"event": "shown",
"description": "Emitted when dropdown is shown."
},
{
"event": "hide",
"description": "Emitted just before dropdown is hidden. Cancelable.",
"args": [
{
"arg": "bvEvt",
"type": "BvEvent",
"description": "BvEvent object. Call bvEvt.preventDefault() to cancel hide."
}
]
},
{
"event": "hidden",
"description": "Emitted when dropdown is hidden."
},
{
"event": "toggle",
"description": "Emitted when toggle button is clicked."
},
{
"event": "click",
"description": "Emitted when split button is clicked in split mode.",
"args": [
{
"arg": "event",
"type": "MouseEvent",
"description": "Native click event object"
}
]
},
{
"event": "bv::dropdown::show",
"description": "Emitted on $root just before dropdown is shown. Cancelable.",
"args": [
{
"arg": "bvEvt",
"type": "BvEvent",
"description": "BvEvent object. Call bvEvt.preventDefault() to cancel show."
}
]
},
{
"event": "bv::dropdown::hide",
"description": "Emitted on $root just before dropdown is hidden. Cancelable.",
"args": [
{
"arg": "bvEvt",
"type": "BvEvent",
"description": "BvEvent object. Call bvEvt.preventDefault() to cancel hide."
}
]
}
],
"slots": [
{
"name": "button-content",
"description": "Can be used to implement custom text with icons and more styling."
},
{
"name": "default",
"description": "Optionally scoped default slot for dropdown menu content",
"scope": [
{
"prop": "hide",
"type": "Function",
"description": "Can be used to close the dropdown menu. Accepts an optional boolean argument, which if true returns focus to the toggle button."
}
]
}
]
},
{
"component": "BDropdownItem",
"aliases": [
"BDdItem"
],
"events": [
{
"event": "click",
"description": "Emitted when item is clicked.",
"args": [
{
"name": "event",
"type": "MouseEvent",
"description": "Native click event object"
}
]
}
]
},
{
"component": "BDropdownItemButton",
"aliases": [
"BDropdownItemBtn",
"BDdItemButton",
"BDdItemBtn"
],
"events": [
{
"event": "click",
"description": "Emitted when button item is clicked.",
"args": [
{
"name": "event",
"type": "MouseEvent",
"description": "Native click event object"
}
]
}
]
},
{
"component": "BDropdownDivider",
"aliases": [
"BDdDivider"
]
},
{
"component": "BDropdownForm",
"aliases": [
"BDdForm"
],
"props": [
{
"prop": "inline",
"description": "When set, the form will be in inline mode which display labels, form controls, and buttons on a single horizontal row"
},
{
"prop": "novalidate",
"description": "When set, disables browser native HTML5 validation on controls in the form"
},
{
"prop": "validated",
"description": "When set, adds the Bootstrap class 'was-validated' on the form, triggering the native browser validation states"
},
{
"prop": "formClass",
"version": "2.2.0",
"description": "CSS class (or classes) to add to the form"
}
]
},
{
"component": "BDropdownText",
"aliases": [
"BDdText"
]
},
{
"component": "BDropdownGroup",
"aliases": [
"BDdGroup"
],
"props": [
{
"prop": "headerClasses",
"description": "CSS class (or classes) to add to the header"
}
],
"slots": [
{
"name": "header",
"description": "Optional header content for the dropdown group."
}
]
},
{
"component": "BDropdownHeader",
"aliases": [
"BDdHeader"
]
}
]
}
}