feat: initial commit - Phase 1 & 2 core features

This commit is contained in:
hiderfong
2026-04-22 17:07:33 +08:00
commit 1773bda06b
25005 changed files with 6252106 additions and 0 deletions
+18
View File
@@ -0,0 +1,18 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { _default } from "./src/dropdown.vue.js";
import { _default as _default$1 } from "./src/dropdown-item.vue.js";
import { _default as _default$2 } from "./src/dropdown-menu.vue.js";
import { FIRST_KEYS, FIRST_LAST_KEYS, IElDropdownInstance, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps } from "./src/dropdown.js";
import { DropdownInstance } from "./src/instance.js";
import { DROPDOWN_INJECTION_KEY, DROPDOWN_INSTANCE_INJECTION_KEY, ElDropdownInjectionContext } from "./src/tokens.js";
//#region ../../packages/components/dropdown/index.d.ts
declare const ElDropdown: SFCWithInstall<typeof _default> & {
DropdownItem: typeof _default$1;
DropdownMenu: typeof _default$2;
};
declare const ElDropdownItem: SFCWithInstall<typeof _default$1>;
declare const ElDropdownMenu: SFCWithInstall<typeof _default$2>;
//#endregion
export { DROPDOWN_INJECTION_KEY, DROPDOWN_INSTANCE_INJECTION_KEY, DropdownInstance, ElDropdown, ElDropdown as default, ElDropdownInjectionContext, ElDropdownItem, ElDropdownMenu, FIRST_KEYS, FIRST_LAST_KEYS, IElDropdownInstance, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps };
+30
View File
@@ -0,0 +1,30 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_install = require('../../utils/vue/install.js');
const require_dropdown = require('./src/dropdown.js');
const require_tokens = require('./src/tokens.js');
const require_dropdown$1 = require('./src/dropdown2.js');
const require_dropdown_item = require('./src/dropdown-item.js');
const require_dropdown_menu = require('./src/dropdown-menu.js');
//#region ../../packages/components/dropdown/index.ts
const ElDropdown = require_install.withInstall(require_dropdown$1.default, {
DropdownItem: require_dropdown_item.default,
DropdownMenu: require_dropdown_menu.default
});
const ElDropdownItem = require_install.withNoopInstall(require_dropdown_item.default);
const ElDropdownMenu = require_install.withNoopInstall(require_dropdown_menu.default);
//#endregion
exports.DROPDOWN_INJECTION_KEY = require_tokens.DROPDOWN_INJECTION_KEY;
exports.DROPDOWN_INSTANCE_INJECTION_KEY = require_tokens.DROPDOWN_INSTANCE_INJECTION_KEY;
exports.ElDropdown = ElDropdown;
exports.default = ElDropdown;
exports.ElDropdownItem = ElDropdownItem;
exports.ElDropdownMenu = ElDropdownMenu;
exports.FIRST_KEYS = require_dropdown.FIRST_KEYS;
exports.FIRST_LAST_KEYS = require_dropdown.FIRST_LAST_KEYS;
exports.LAST_KEYS = require_dropdown.LAST_KEYS;
exports.dropdownItemProps = require_dropdown.dropdownItemProps;
exports.dropdownMenuProps = require_dropdown.dropdownMenuProps;
exports.dropdownProps = require_dropdown.dropdownProps;
//# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
{"version":3,"file":"index.js","names":["withInstall","Dropdown","withNoopInstall","DropdownItem","DropdownMenu"],"sources":["../../../../../packages/components/dropdown/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Dropdown from './src/dropdown.vue'\nimport DropdownItem from './src/dropdown-item.vue'\nimport DropdownMenu from './src/dropdown-menu.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElDropdown: SFCWithInstall<typeof Dropdown> & {\n DropdownItem: typeof DropdownItem\n DropdownMenu: typeof DropdownMenu\n} = withInstall(Dropdown, {\n DropdownItem,\n DropdownMenu,\n})\nexport default ElDropdown\nexport const ElDropdownItem: SFCWithInstall<typeof DropdownItem> =\n withNoopInstall(DropdownItem)\nexport const ElDropdownMenu: SFCWithInstall<typeof DropdownMenu> =\n withNoopInstall(DropdownMenu)\nexport * from './src/dropdown'\nexport * from './src/instance'\nexport * from './src/tokens'\n"],"mappings":";;;;;;;;;AAOA,MAAa,aAGTA,4BAAYC,4BAAU;CACxB;CACA;CACD,CAAC;AAEF,MAAa,iBACXC,gCAAgBC,8BAAa;AAC/B,MAAa,iBACXD,gCAAgBE,8BAAa"}
@@ -0,0 +1,42 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require__plugin_vue_export_helper = require('../../../_virtual/_plugin-vue_export-helper.js');
const require_dropdown_item_impl_vue_vue_type_script_lang = require('./dropdown-item-impl.vue_vue_type_script_lang.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-item-impl.vue
const _hoisted_1 = [
"aria-disabled",
"tabindex",
"role"
];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [_ctx.divided ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 0,
role: "separator",
class: (0, vue.normalizeClass)(_ctx.ns.bem("menu", "item", "divided"))
}, null, 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("li", (0, vue.mergeProps)({ ref: _ctx.itemRef }, {
..._ctx.dataset,
..._ctx.$attrs
}, {
"aria-disabled": _ctx.disabled,
class: [_ctx.ns.be("menu", "item"), _ctx.ns.is("disabled", _ctx.disabled)],
tabindex: _ctx.tabIndex,
role: _ctx.role,
onClick: _cache[0] || (_cache[0] = (e) => _ctx.$emit("clickimpl", e)),
onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
onKeydown: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args), ["self"])),
onMousedown: _cache[3] || (_cache[3] = (...args) => _ctx.handleMousedown && _ctx.handleMousedown(...args)),
onPointermove: _cache[4] || (_cache[4] = (e) => _ctx.$emit("pointermove", e)),
onPointerleave: _cache[5] || (_cache[5] = (e) => _ctx.$emit("pointerleave", e))
}), [_ctx.icon || _ctx.$slots.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, { key: 0 }, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.icon)))])]),
_: 3
})) : (0, vue.createCommentVNode)("v-if", true), (0, vue.renderSlot)(_ctx.$slots, "default")], 16, _hoisted_1)], 64);
}
var dropdown_item_impl_default = /* @__PURE__ */ require__plugin_vue_export_helper.default(require_dropdown_item_impl_vue_vue_type_script_lang.default, [["render", _sfc_render]]);
//#endregion
exports.default = dropdown_item_impl_default;
//# sourceMappingURL=dropdown-item-impl.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-item-impl.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-item-impl.vue"],"sourcesContent":["<template>\n <li\n v-if=\"divided\"\n role=\"separator\"\n :class=\"ns.bem('menu', 'item', 'divided')\"\n />\n <li\n :ref=\"itemRef\"\n v-bind=\"{ ...dataset, ...$attrs }\"\n :aria-disabled=\"disabled\"\n :class=\"[ns.be('menu', 'item'), ns.is('disabled', disabled)]\"\n :tabindex=\"tabIndex\"\n :role=\"role\"\n @click=\"(e) => $emit('clickimpl', e)\"\n @focus=\"handleFocus\"\n @keydown.self=\"handleKeydown\"\n @mousedown=\"handleMousedown\"\n @pointermove=\"(e) => $emit('pointermove', e)\"\n @pointerleave=\"(e) => $emit('pointerleave', e)\"\n >\n <el-icon v-if=\"icon || $slots.icon\">\n <slot name=\"icon\">\n <component :is=\"icon\" />\n </slot>\n </el-icon>\n <slot />\n </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport {\n ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY,\n ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY,\n} from '@element-plus/components/roving-focus-group'\nimport { COLLECTION_ITEM_SIGN } from '@element-plus/components/collection'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport {\n composeEventHandlers,\n composeRefs,\n getEventCode,\n} from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { dropdownItemProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n name: 'DropdownItemImpl',\n components: {\n ElIcon,\n },\n props: dropdownItemProps,\n emits: ['pointermove', 'pointerleave', 'click', 'clickimpl'],\n setup(_, { emit }) {\n const ns = useNamespace('dropdown')\n\n const { role: menuRole } = inject(DROPDOWN_INJECTION_KEY, undefined)!\n\n const { collectionItemRef: rovingFocusCollectionItemRef } = inject(\n ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY,\n undefined\n )!\n\n const {\n rovingFocusGroupItemRef,\n tabIndex,\n handleFocus,\n handleKeydown: handleItemKeydown,\n handleMousedown,\n } = inject(ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, undefined)!\n\n const itemRef = composeRefs(\n rovingFocusCollectionItemRef,\n rovingFocusGroupItemRef\n )\n\n const role = computed<string>(() => {\n if (menuRole.value === 'menu') {\n return 'menuitem'\n } else if (menuRole.value === 'navigation') {\n return 'link'\n }\n return 'button'\n })\n\n const handleKeydown = composeEventHandlers((e: KeyboardEvent) => {\n const code = getEventCode(e)\n\n if (\n [EVENT_CODE.enter, EVENT_CODE.numpadEnter, EVENT_CODE.space].includes(\n code\n )\n ) {\n e.preventDefault()\n e.stopImmediatePropagation()\n emit('clickimpl', e)\n return true\n }\n }, handleItemKeydown)\n\n return {\n ns,\n itemRef,\n dataset: {\n [COLLECTION_ITEM_SIGN]: '',\n },\n role,\n tabIndex,\n handleFocus,\n handleKeydown,\n handleMousedown,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;+EAEU,KAAA,+BAAA,8BAGN,MAAA;EAAA,KAAA;EAFA,MAAK;EACJ,+BAAO,KAAA,GAAG,IAAG,QAAA,QAAA,UAAA,CAAA;EAAA,qFAsBX,0BAAA,EAnBF,KAAK,KAAA,SAAO,EAAA;EAAA,GACA,KAAA;EAAO,GAAK,KAAA;EAAM,EAAA;EAC9B,iBAAe,KAAA;EACf,OAAK,CAAG,KAAA,GAAG,GAAE,QAAA,OAAA,EAAkB,KAAA,GAAG,GAAE,YAAa,KAAA,SAAQ,CAAA;EACzD,UAAU,KAAA;EACV,MAAM,KAAA;EACN,SAAK,OAAA,OAAA,OAAA,MAAG,MAAM,KAAA,MAAK,aAAc,EAAC;EAClC,SAAK,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,KAAA,eAAA,KAAA,YAAA,GAAA,KAAA;EACP,WAAO,OAAA,OAAA,OAAA,6BAAA,GAAA,SAAO,KAAA,iBAAA,KAAA,cAAA,GAAA,KAAA,EAAa,CAAA,OAAA,CAAA;EAC3B,aAAS,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,KAAA,mBAAA,KAAA,gBAAA,GAAA,KAAA;EACX,eAAW,OAAA,OAAA,OAAA,MAAG,MAAM,KAAA,MAAK,eAAgB,EAAC;EAC1C,gBAAY,OAAA,OAAA,OAAA,MAAG,MAAM,KAAA,MAAK,gBAAiB,EAAC;EAAA,CAAA,EAAA,CAE9B,KAAA,QAAQ,KAAA,OAAO,4BAAA,uBAIpB,oBAAA,EAAA,KAAA,GAAA,EAAA;EAAA,gCADD,qBAAA,KAAA,QAAA,QAAA,EAAA,QAAA,sBAAA,wDADW,KAAA,KAAI,CAAA,EAAA,CAAA;;sEAGhB,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA"}
@@ -0,0 +1,64 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_aria = require('../../../constants/aria.js');
const require_event = require('../../../utils/dom/event.js');
const require_refs = require('../../../utils/vue/refs.js');
const require_index = require('../../../hooks/use-namespace/index.js');
const require_index$1 = require('../../icon/index.js');
const require_collection = require('../../collection/src/collection.js');
const require_roving_focus_group = require('../../roving-focus-group/src/roving-focus-group.js');
const require_tokens = require('../../roving-focus-group/src/tokens.js');
const require_dropdown = require('./dropdown.js');
const require_tokens$1 = require('./tokens.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-item-impl.vue?vue&type=script&lang.ts
var dropdown_item_impl_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "DropdownItemImpl",
components: { ElIcon: require_index$1.ElIcon },
props: require_dropdown.dropdownItemProps,
emits: [
"pointermove",
"pointerleave",
"click",
"clickimpl"
],
setup(_, { emit }) {
const ns = require_index.useNamespace("dropdown");
const { role: menuRole } = (0, vue.inject)(require_tokens$1.DROPDOWN_INJECTION_KEY, void 0);
const { collectionItemRef: rovingFocusCollectionItemRef } = (0, vue.inject)(require_roving_focus_group.ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY, void 0);
const { rovingFocusGroupItemRef, tabIndex, handleFocus, handleKeydown: handleItemKeydown, handleMousedown } = (0, vue.inject)(require_tokens.ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, void 0);
const itemRef = require_refs.composeRefs(rovingFocusCollectionItemRef, rovingFocusGroupItemRef);
const role = (0, vue.computed)(() => {
if (menuRole.value === "menu") return "menuitem";
else if (menuRole.value === "navigation") return "link";
return "button";
});
const handleKeydown = require_event.composeEventHandlers((e) => {
const code = require_event.getEventCode(e);
if ([
require_aria.EVENT_CODE.enter,
require_aria.EVENT_CODE.numpadEnter,
require_aria.EVENT_CODE.space
].includes(code)) {
e.preventDefault();
e.stopImmediatePropagation();
emit("clickimpl", e);
return true;
}
}, handleItemKeydown);
return {
ns,
itemRef,
dataset: { [require_collection.COLLECTION_ITEM_SIGN]: "" },
role,
tabIndex,
handleFocus,
handleKeydown,
handleMousedown
};
}
});
//#endregion
exports.default = dropdown_item_impl_vue_vue_type_script_lang_default;
//# sourceMappingURL=dropdown-item-impl.vue_vue_type_script_lang.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-item-impl.vue_vue_type_script_lang.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-item-impl.vue"],"sourcesContent":["<template>\n <li\n v-if=\"divided\"\n role=\"separator\"\n :class=\"ns.bem('menu', 'item', 'divided')\"\n />\n <li\n :ref=\"itemRef\"\n v-bind=\"{ ...dataset, ...$attrs }\"\n :aria-disabled=\"disabled\"\n :class=\"[ns.be('menu', 'item'), ns.is('disabled', disabled)]\"\n :tabindex=\"tabIndex\"\n :role=\"role\"\n @click=\"(e) => $emit('clickimpl', e)\"\n @focus=\"handleFocus\"\n @keydown.self=\"handleKeydown\"\n @mousedown=\"handleMousedown\"\n @pointermove=\"(e) => $emit('pointermove', e)\"\n @pointerleave=\"(e) => $emit('pointerleave', e)\"\n >\n <el-icon v-if=\"icon || $slots.icon\">\n <slot name=\"icon\">\n <component :is=\"icon\" />\n </slot>\n </el-icon>\n <slot />\n </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport {\n ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY,\n ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY,\n} from '@element-plus/components/roving-focus-group'\nimport { COLLECTION_ITEM_SIGN } from '@element-plus/components/collection'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport {\n composeEventHandlers,\n composeRefs,\n getEventCode,\n} from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { dropdownItemProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n name: 'DropdownItemImpl',\n components: {\n ElIcon,\n },\n props: dropdownItemProps,\n emits: ['pointermove', 'pointerleave', 'click', 'clickimpl'],\n setup(_, { emit }) {\n const ns = useNamespace('dropdown')\n\n const { role: menuRole } = inject(DROPDOWN_INJECTION_KEY, undefined)!\n\n const { collectionItemRef: rovingFocusCollectionItemRef } = inject(\n ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY,\n undefined\n )!\n\n const {\n rovingFocusGroupItemRef,\n tabIndex,\n handleFocus,\n handleKeydown: handleItemKeydown,\n handleMousedown,\n } = inject(ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, undefined)!\n\n const itemRef = composeRefs(\n rovingFocusCollectionItemRef,\n rovingFocusGroupItemRef\n )\n\n const role = computed<string>(() => {\n if (menuRole.value === 'menu') {\n return 'menuitem'\n } else if (menuRole.value === 'navigation') {\n return 'link'\n }\n return 'button'\n })\n\n const handleKeydown = composeEventHandlers((e: KeyboardEvent) => {\n const code = getEventCode(e)\n\n if (\n [EVENT_CODE.enter, EVENT_CODE.numpadEnter, EVENT_CODE.space].includes(\n code\n )\n ) {\n e.preventDefault()\n e.stopImmediatePropagation()\n emit('clickimpl', e)\n return true\n }\n }, handleItemKeydown)\n\n return {\n ns,\n itemRef,\n dataset: {\n [COLLECTION_ITEM_SIGN]: '',\n },\n role,\n tabIndex,\n handleFocus,\n handleKeydown,\n handleMousedown,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;AA+CA,mFAA+B;CAC7B,MAAM;CACN,YAAY,EACV,gCACD;CACD,OAAO;CACP,OAAO;EAAC;EAAe;EAAgB;EAAS;EAAY;CAC5D,MAAM,GAAG,EAAE,QAAQ;EACjB,MAAM,KAAK,2BAAa,WAAU;EAElC,MAAM,EAAE,MAAM,6BAAoB,yCAAwB,OAAU;EAEpE,MAAM,EAAE,mBAAmB,iDACzB,uEACA,OACD;EAED,MAAM,EACJ,yBACA,UACA,aACA,eAAe,mBACf,oCACS,sDAAuC,OAAU;EAE5D,MAAM,UAAU,yBACd,8BACA,wBACF;EAEA,MAAM,+BAA8B;AAClC,OAAI,SAAS,UAAU,OACrB,QAAO;YACE,SAAS,UAAU,aAC5B,QAAO;AAET,UAAO;IACR;EAED,MAAM,gBAAgB,oCAAsB,MAAqB;GAC/D,MAAM,OAAO,2BAAa,EAAC;AAE3B,OACE;IAAC,wBAAW;IAAO,wBAAW;IAAa,wBAAW;IAAM,CAAC,SAC3D,KACF,EACA;AACA,MAAE,gBAAe;AACjB,MAAE,0BAAyB;AAC3B,SAAK,aAAa,EAAC;AACnB,WAAO;;KAER,kBAAiB;AAEpB,SAAO;GACL;GACA;GACA,SAAS,GACN,0CAAuB,IACzB;GACD;GACA;GACA;GACA;GACA;GACF;;CAEH,CAAA"}
@@ -0,0 +1,35 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require__plugin_vue_export_helper = require('../../../_virtual/_plugin-vue_export-helper.js');
const require_dropdown_item_vue_vue_type_script_lang = require('./dropdown-item.vue_vue_type_script_lang.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-item.vue
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_dropdown_item_impl = (0, vue.resolveComponent)("el-dropdown-item-impl");
const _component_el_roving_focus_item = (0, vue.resolveComponent)("el-roving-focus-item");
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_roving_focus_item, { focusable: !_ctx.disabled }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_dropdown_item_impl, (0, vue.mergeProps)(_ctx.propsAndAttrs, {
onPointerleave: _ctx.handlePointerLeave,
onPointermove: _ctx.handlePointerMove,
onClickimpl: _ctx.handleClick
}), (0, vue.createSlots)({
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 2
}, [_ctx.$slots.icon ? {
name: "icon",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "icon")]),
key: "0"
} : void 0]), 1040, [
"onPointerleave",
"onPointermove",
"onClickimpl"
])]),
_: 3
}, 8, ["focusable"]);
}
var dropdown_item_default = /* @__PURE__ */ require__plugin_vue_export_helper.default(require_dropdown_item_vue_vue_type_script_lang.default, [["render", _sfc_render]]);
//#endregion
exports.default = dropdown_item_default;
//# sourceMappingURL=dropdown-item.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-item.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-item.vue"],"sourcesContent":["<template>\n <el-roving-focus-item :focusable=\"!disabled\">\n <el-dropdown-item-impl\n v-bind=\"propsAndAttrs\"\n @pointerleave=\"handlePointerLeave\"\n @pointermove=\"handlePointerMove\"\n @clickimpl=\"handleClick\"\n >\n <template v-if=\"$slots.icon\" #icon>\n <slot name=\"icon\" />\n </template>\n\n <slot />\n </el-dropdown-item-impl>\n </el-roving-focus-item>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject } from 'vue'\nimport { ElRovingFocusItem } from '@element-plus/components/roving-focus-group'\nimport { composeEventHandlers, whenMouse } from '@element-plus/utils'\nimport ElDropdownItemImpl from './dropdown-item-impl.vue'\nimport { useDropdown } from './useDropdown'\nimport { dropdownItemProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n name: 'ElDropdownItem',\n components: {\n ElRovingFocusItem,\n ElDropdownItemImpl,\n },\n inheritAttrs: false,\n props: dropdownItemProps,\n emits: ['pointermove', 'pointerleave', 'click'],\n setup(props, { emit, attrs }) {\n const { elDropdown } = useDropdown()\n const _instance = getCurrentInstance()\n const { onItemEnter, onItemLeave } = inject(\n DROPDOWN_INJECTION_KEY,\n undefined\n )!\n\n const handlePointerMove = composeEventHandlers(\n (e: PointerEvent) => {\n emit('pointermove', e)\n return e.defaultPrevented\n },\n whenMouse((e) => {\n if (props.disabled) {\n onItemLeave(e)\n return\n }\n\n const target = e.currentTarget as HTMLElement\n /**\n * This handles the following scenario:\n * when the item contains a form element such as input element\n * when the mouse is moving over the element itself which is contained by\n * the item, the default focusing logic should be prevented so that\n * it won't cause weird action.\n */\n if (\n target === document.activeElement ||\n target.contains(document.activeElement)\n ) {\n return\n }\n\n onItemEnter(e)\n if (!e.defaultPrevented) {\n target?.focus({\n preventScroll: true,\n })\n }\n })\n )\n\n const handlePointerLeave = composeEventHandlers((e: PointerEvent) => {\n emit('pointerleave', e)\n return e.defaultPrevented\n }, whenMouse(onItemLeave))\n\n const handleClick = composeEventHandlers(\n (e: PointerEvent) => {\n if (props.disabled) {\n return\n }\n emit('click', e)\n return e.type !== 'keydown' && e.defaultPrevented\n },\n (e) => {\n if (props.disabled) {\n e.stopImmediatePropagation()\n return\n }\n if (elDropdown?.hideOnClick?.value) {\n elDropdown.handleClick?.()\n }\n elDropdown.commandHandler?.(props.command, _instance, e)\n }\n )\n\n // direct usage of v-bind={ ...$props, ...$attrs } causes type errors\n const propsAndAttrs = computed(() => ({ ...props, ...attrs }))\n\n return {\n handleClick,\n handlePointerMove,\n handlePointerLeave,\n propsAndAttrs,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;mDAcyB,iCAAA,EAbA,WAAS,CAAG,KAAA,UAAA,EAAA;kCAYT,sBAAA,sDAAA,KAVd,eAAa;GACpB,gBAAc,KAAA;GACd,eAAa,KAAA;GACb,aAAW,KAAA;GAAA,CAAA,uBAAA;mCAMJ,qBAAA,KAAA,QAAA,UAAA,CAAA,CAAA;;MAJQ,KAAA,OAAO,OAAA;SAAO;GAAA,2BACR,qBAAA,KAAA,QAAA,OAAA,CAAA,CAAA"}
@@ -0,0 +1,179 @@
import { SFCWithInstall } from "../../../utils/vue/typescript.js";
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { IconProps } from "../../icon/src/icon.js";
import "../../../index.js";
import * as vue from "vue";
//#region ../../packages/components/dropdown/src/dropdown-item.vue.d.ts
declare const _default: typeof __VLS_export;
declare const __VLS_export: vue.DefineComponent<vue.ExtractPropTypes<{
readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
readonly disabled: BooleanConstructor;
readonly divided: BooleanConstructor;
readonly textValue: StringConstructor;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>, {
handleClick: (event: PointerEvent) => void;
handlePointerMove: (event: PointerEvent) => void;
handlePointerLeave: (event: PointerEvent) => void;
propsAndAttrs: vue.ComputedRef<{
disabled: boolean;
command: EpPropMergeType<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
divided: boolean;
icon: EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown> | undefined;
textValue: string | undefined;
onClick: ((...args: any[]) => any) | undefined;
onPointermove: ((...args: any[]) => any) | undefined;
onPointerleave: ((...args: any[]) => any) | undefined;
}>;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "pointerleave" | "pointermove")[], "click" | "pointerleave" | "pointermove", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
readonly disabled: BooleanConstructor;
readonly divided: BooleanConstructor;
readonly textValue: StringConstructor;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & Readonly<{
onClick?: ((...args: any[]) => any) | undefined;
onPointermove?: ((...args: any[]) => any) | undefined;
onPointerleave?: ((...args: any[]) => any) | undefined;
}>, {
readonly disabled: boolean;
readonly command: EpPropMergeType<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
readonly divided: boolean;
}, {}, {
ElRovingFocusItem: vue.DefineComponent<vue.ExtractPropTypes<{
focusable: {
type: BooleanConstructor;
default: boolean;
};
active: BooleanConstructor;
}>, {
id: vue.Ref<string, string>;
handleKeydown: (event: Event) => void;
handleFocus: (event: Event) => void;
handleMousedown: (event: Event) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("focus" | "keydown" | "mousedown")[], "focus" | "keydown" | "mousedown", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
focusable: {
type: BooleanConstructor;
default: boolean;
};
active: BooleanConstructor;
}>> & Readonly<{
onFocus?: ((...args: any[]) => any) | undefined;
onKeydown?: ((...args: any[]) => any) | undefined;
onMousedown?: ((...args: any[]) => any) | undefined;
}>, {
active: boolean;
focusable: boolean;
}, {}, {
ElRovingFocusCollectionItem: {
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {}, true, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
name: string;
setup(_: unknown, {
attrs
}: vue.SetupContext): void;
};
}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
ElDropdownItemImpl: vue.DefineComponent<vue.ExtractPropTypes<{
readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
readonly disabled: BooleanConstructor;
readonly divided: BooleanConstructor;
readonly textValue: StringConstructor;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>, {
ns: {
namespace: vue.ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
itemRef: (el: Element | vue.ComponentPublicInstance | null) => void;
dataset: {
"data-el-collection-item": string;
};
role: vue.ComputedRef<string>;
tabIndex: vue.Ref<number, number>;
handleFocus: (e: Event) => void;
handleKeydown: (event: KeyboardEvent) => void;
handleMousedown: (e: Event) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "pointerleave" | "pointermove" | "clickimpl")[], "click" | "pointerleave" | "pointermove" | "clickimpl", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
readonly disabled: BooleanConstructor;
readonly divided: BooleanConstructor;
readonly textValue: StringConstructor;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & Readonly<{
onClick?: ((...args: any[]) => any) | undefined;
onPointermove?: ((...args: any[]) => any) | undefined;
onPointerleave?: ((...args: any[]) => any) | undefined;
onClickimpl?: ((...args: any[]) => any) | undefined;
}>, {
readonly disabled: boolean;
readonly command: EpPropMergeType<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
readonly divided: boolean;
}, {}, {
ElIcon: SFCWithInstall<{
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, {}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default?: (props: {}) => any;
};
})>;
}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
//#endregion
export { _default };
@@ -0,0 +1,77 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_event = require('../../../utils/dom/event.js');
const require_roving_focus_item = require('../../roving-focus-group/src/roving-focus-item.js');
const require_dropdown = require('./dropdown.js');
const require_tokens = require('./tokens.js');
const require_dropdown_item_impl = require('./dropdown-item-impl.js');
const require_useDropdown = require('./useDropdown.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-item.vue?vue&type=script&lang.ts
var dropdown_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdownItem",
components: {
ElRovingFocusItem: require_roving_focus_item.default,
ElDropdownItemImpl: require_dropdown_item_impl.default
},
inheritAttrs: false,
props: require_dropdown.dropdownItemProps,
emits: [
"pointermove",
"pointerleave",
"click"
],
setup(props, { emit, attrs }) {
const { elDropdown } = require_useDropdown.useDropdown();
const _instance = (0, vue.getCurrentInstance)();
const { onItemEnter, onItemLeave } = (0, vue.inject)(require_tokens.DROPDOWN_INJECTION_KEY, void 0);
const handlePointerMove = require_event.composeEventHandlers((e) => {
emit("pointermove", e);
return e.defaultPrevented;
}, require_event.whenMouse((e) => {
if (props.disabled) {
onItemLeave(e);
return;
}
const target = e.currentTarget;
/**
* This handles the following scenario:
* when the item contains a form element such as input element
* when the mouse is moving over the element itself which is contained by
* the item, the default focusing logic should be prevented so that
* it won't cause weird action.
*/
if (target === document.activeElement || target.contains(document.activeElement)) return;
onItemEnter(e);
if (!e.defaultPrevented) target?.focus({ preventScroll: true });
}));
const handlePointerLeave = require_event.composeEventHandlers((e) => {
emit("pointerleave", e);
return e.defaultPrevented;
}, require_event.whenMouse(onItemLeave));
return {
handleClick: require_event.composeEventHandlers((e) => {
if (props.disabled) return;
emit("click", e);
return e.type !== "keydown" && e.defaultPrevented;
}, (e) => {
if (props.disabled) {
e.stopImmediatePropagation();
return;
}
if (elDropdown?.hideOnClick?.value) elDropdown.handleClick?.();
elDropdown.commandHandler?.(props.command, _instance, e);
}),
handlePointerMove,
handlePointerLeave,
propsAndAttrs: (0, vue.computed)(() => ({
...props,
...attrs
}))
};
}
});
//#endregion
exports.default = dropdown_item_vue_vue_type_script_lang_default;
//# sourceMappingURL=dropdown-item.vue_vue_type_script_lang.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-item.vue_vue_type_script_lang.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-item.vue"],"sourcesContent":["<template>\n <el-roving-focus-item :focusable=\"!disabled\">\n <el-dropdown-item-impl\n v-bind=\"propsAndAttrs\"\n @pointerleave=\"handlePointerLeave\"\n @pointermove=\"handlePointerMove\"\n @clickimpl=\"handleClick\"\n >\n <template v-if=\"$slots.icon\" #icon>\n <slot name=\"icon\" />\n </template>\n\n <slot />\n </el-dropdown-item-impl>\n </el-roving-focus-item>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject } from 'vue'\nimport { ElRovingFocusItem } from '@element-plus/components/roving-focus-group'\nimport { composeEventHandlers, whenMouse } from '@element-plus/utils'\nimport ElDropdownItemImpl from './dropdown-item-impl.vue'\nimport { useDropdown } from './useDropdown'\nimport { dropdownItemProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n name: 'ElDropdownItem',\n components: {\n ElRovingFocusItem,\n ElDropdownItemImpl,\n },\n inheritAttrs: false,\n props: dropdownItemProps,\n emits: ['pointermove', 'pointerleave', 'click'],\n setup(props, { emit, attrs }) {\n const { elDropdown } = useDropdown()\n const _instance = getCurrentInstance()\n const { onItemEnter, onItemLeave } = inject(\n DROPDOWN_INJECTION_KEY,\n undefined\n )!\n\n const handlePointerMove = composeEventHandlers(\n (e: PointerEvent) => {\n emit('pointermove', e)\n return e.defaultPrevented\n },\n whenMouse((e) => {\n if (props.disabled) {\n onItemLeave(e)\n return\n }\n\n const target = e.currentTarget as HTMLElement\n /**\n * This handles the following scenario:\n * when the item contains a form element such as input element\n * when the mouse is moving over the element itself which is contained by\n * the item, the default focusing logic should be prevented so that\n * it won't cause weird action.\n */\n if (\n target === document.activeElement ||\n target.contains(document.activeElement)\n ) {\n return\n }\n\n onItemEnter(e)\n if (!e.defaultPrevented) {\n target?.focus({\n preventScroll: true,\n })\n }\n })\n )\n\n const handlePointerLeave = composeEventHandlers((e: PointerEvent) => {\n emit('pointerleave', e)\n return e.defaultPrevented\n }, whenMouse(onItemLeave))\n\n const handleClick = composeEventHandlers(\n (e: PointerEvent) => {\n if (props.disabled) {\n return\n }\n emit('click', e)\n return e.type !== 'keydown' && e.defaultPrevented\n },\n (e) => {\n if (props.disabled) {\n e.stopImmediatePropagation()\n return\n }\n if (elDropdown?.hideOnClick?.value) {\n elDropdown.handleClick?.()\n }\n elDropdown.commandHandler?.(props.command, _instance, e)\n }\n )\n\n // direct usage of v-bind={ ...$props, ...$attrs } causes type errors\n const propsAndAttrs = computed(() => ({ ...props, ...attrs }))\n\n return {\n handleClick,\n handlePointerMove,\n handlePointerLeave,\n propsAndAttrs,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;AA0BA,8EAA+B;CAC7B,MAAM;CACN,YAAY;EACV;EACA;EACD;CACD,cAAc;CACd,OAAO;CACP,OAAO;EAAC;EAAe;EAAgB;EAAQ;CAC/C,MAAM,OAAO,EAAE,MAAM,SAAS;EAC5B,MAAM,EAAE,eAAe,iCAAY;EACnC,MAAM,yCAA+B;EACrC,MAAM,EAAE,aAAa,gCACnB,uCACA,OACD;EAED,MAAM,oBAAoB,oCACvB,MAAoB;AACnB,QAAK,eAAe,EAAC;AACrB,UAAO,EAAE;KAEX,yBAAW,MAAM;AACf,OAAI,MAAM,UAAU;AAClB,gBAAY,EAAC;AACb;;GAGF,MAAM,SAAS,EAAE;;;;;;;;AAQjB,OACE,WAAW,SAAS,iBACpB,OAAO,SAAS,SAAS,cAAa,CAEtC;AAGF,eAAY,EAAC;AACb,OAAI,CAAC,EAAE,iBACL,SAAQ,MAAM,EACZ,eAAe,MAChB,CAAA;IAEJ,CACH;EAEA,MAAM,qBAAqB,oCAAsB,MAAoB;AACnE,QAAK,gBAAgB,EAAC;AACtB,UAAO,EAAE;KACR,wBAAU,YAAY,CAAA;AAyBzB,SAAO;GACL,aAxBkB,oCACjB,MAAoB;AACnB,QAAI,MAAM,SACR;AAEF,SAAK,SAAS,EAAC;AACf,WAAO,EAAE,SAAS,aAAa,EAAE;OAElC,MAAM;AACL,QAAI,MAAM,UAAU;AAClB,OAAE,0BAAyB;AAC3B;;AAEF,QAAI,YAAY,aAAa,MAC3B,YAAW,eAAc;AAE3B,eAAW,iBAAiB,MAAM,SAAS,WAAW,EAAC;KAE3D;GAOE;GACA;GACA,wCANoC;IAAE,GAAG;IAAO,GAAG;IAAO,EAAC;GAO7D;;CAEH,CAAA"}
@@ -0,0 +1,27 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require__plugin_vue_export_helper = require('../../../_virtual/_plugin-vue_export-helper.js');
const require_dropdown_menu_vue_vue_type_script_lang = require('./dropdown-menu.vue_vue_type_script_lang.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-menu.vue
const _hoisted_1 = ["role", "aria-labelledby"];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
ref: _ctx.dropdownListWrapperRef,
class: (0, vue.normalizeClass)(_ctx.dropdownKls),
style: (0, vue.normalizeStyle)(_ctx.rovingFocusGroupRootStyle),
tabindex: -1,
role: _ctx.role,
"aria-labelledby": _ctx.triggerId,
onFocusin: _cache[0] || (_cache[0] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
onFocusout: _cache[1] || (_cache[1] = (...args) => _ctx.onBlur && _ctx.onBlur(...args)),
onKeydown: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args), ["self"])),
onMousedown: _cache[3] || (_cache[3] = (0, vue.withModifiers)((...args) => _ctx.onMousedown && _ctx.onMousedown(...args), ["self"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 46, _hoisted_1);
}
var dropdown_menu_default = /* @__PURE__ */ require__plugin_vue_export_helper.default(require_dropdown_menu_vue_vue_type_script_lang.default, [["render", _sfc_render]]);
//#endregion
exports.default = dropdown_menu_default;
//# sourceMappingURL=dropdown-menu.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-menu.vue"],"sourcesContent":["<template>\n <ul\n :ref=\"dropdownListWrapperRef\"\n :class=\"dropdownKls\"\n :style=\"rovingFocusGroupRootStyle\"\n :tabindex=\"-1\"\n :role=\"role\"\n :aria-labelledby=\"triggerId\"\n @focusin=\"handleFocus\"\n @focusout=\"onBlur\"\n @keydown.self=\"handleKeydown\"\n @mousedown.self=\"onMousedown\"\n >\n <slot />\n </ul>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport {\n composeEventHandlers,\n composeRefs,\n getEventCode,\n} from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport {\n ROVING_FOCUS_COLLECTION_INJECTION_KEY,\n ROVING_FOCUS_GROUP_INJECTION_KEY,\n} from '@element-plus/components/roving-focus-group'\nimport { useNamespace } from '@element-plus/hooks'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\nimport { dropdownMenuProps } from './dropdown'\nimport { useDropdown } from './useDropdown'\n\nexport default defineComponent({\n name: 'ElDropdownMenu',\n props: dropdownMenuProps,\n setup(props) {\n const ns = useNamespace('dropdown')\n const { _elDropdownSize } = useDropdown()\n const size = _elDropdownSize.value\n\n const { contentRef, role, triggerId, isUsingKeyboard, handleClose } =\n inject(DROPDOWN_INJECTION_KEY, undefined)!\n\n const {\n rovingFocusGroupRef,\n rovingFocusGroupRootStyle,\n onBlur,\n onFocus,\n onKeydown,\n onMousedown,\n } = inject(ROVING_FOCUS_GROUP_INJECTION_KEY, undefined)!\n\n const { collectionRef: rovingFocusGroupCollectionRef } = inject(\n ROVING_FOCUS_COLLECTION_INJECTION_KEY,\n undefined\n )!\n\n const dropdownKls = computed(() => {\n return [ns.b('menu'), ns.bm('menu', size?.value)]\n })\n\n const dropdownListWrapperRef = composeRefs(\n contentRef,\n rovingFocusGroupRef,\n rovingFocusGroupCollectionRef\n )\n\n const handleKeydown = composeEventHandlers(\n (e: KeyboardEvent) => {\n props.onKeydown?.(e)\n },\n (e) => {\n const { currentTarget, target } = e\n const code = getEventCode(e)\n\n const isKeydownContained = (currentTarget as Node).contains(\n target as Node\n )\n\n if (isKeydownContained) {\n // TODO: implement typeahead search\n }\n\n if (EVENT_CODE.tab === code) {\n return handleClose()\n }\n\n onKeydown(e)\n }\n )\n\n function handleFocus(e: FocusEvent) {\n isUsingKeyboard.value && onFocus(e)\n }\n\n return {\n size,\n rovingFocusGroupRootStyle,\n dropdownKls,\n role,\n triggerId,\n dropdownListWrapperRef,\n handleKeydown,\n onBlur,\n handleFocus,\n onMousedown,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;0DAcO,MAAA;EAZF,KAAK,KAAA;EACL,+BAAO,KAAA,YAAW;EAClB,+BAAO,KAAA,0BAAyB;EAChC,UAAU;EACV,MAAM,KAAA;EACN,mBAAiB,KAAA;EACjB,WAAO,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,KAAA,eAAA,KAAA,YAAA,GAAA,KAAA;EACT,YAAQ,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,KAAA,UAAA,KAAA,OAAA,GAAA,KAAA;EACV,WAAO,OAAA,OAAA,OAAA,6BAAA,GAAA,SAAO,KAAA,iBAAA,KAAA,cAAA,GAAA,KAAA,EAAa,CAAA,OAAA,CAAA;EAC3B,aAAS,OAAA,OAAA,OAAA,6BAAA,GAAA,SAAO,KAAA,eAAA,KAAA,YAAA,GAAA,KAAA,EAAW,CAAA,OAAA,CAAA;EAAA,EAAA,qBAEpB,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA"}
@@ -0,0 +1,32 @@
import * as vue from "vue";
//#region ../../packages/components/dropdown/src/dropdown-menu.vue.d.ts
declare const _default: typeof __VLS_export;
declare const __VLS_export: vue.DefineComponent<vue.ExtractPropTypes<{
onKeydown: {
readonly type: vue.PropType<(e: KeyboardEvent) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>, {
size: vue.ComputedRef<string> | undefined;
rovingFocusGroupRootStyle: vue.Ref<vue.StyleValue, vue.StyleValue>;
dropdownKls: vue.ComputedRef<string[]>;
role: vue.ComputedRef<"listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree" | undefined>;
triggerId: vue.ComputedRef<string>;
dropdownListWrapperRef: (el: Element | vue.ComponentPublicInstance | null) => void;
handleKeydown: (event: KeyboardEvent) => void;
onBlur: (e: Event) => void;
handleFocus: (e: FocusEvent) => void;
onMousedown: (e: Event) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
onKeydown: {
readonly type: vue.PropType<(e: KeyboardEvent) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
//#endregion
export { _default };
@@ -0,0 +1,57 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_aria = require('../../../constants/aria.js');
const require_event = require('../../../utils/dom/event.js');
const require_refs = require('../../../utils/vue/refs.js');
const require_index = require('../../../hooks/use-namespace/index.js');
const require_roving_focus_group = require('../../roving-focus-group/src/roving-focus-group.js');
const require_tokens = require('../../roving-focus-group/src/tokens.js');
const require_dropdown = require('./dropdown.js');
const require_tokens$1 = require('./tokens.js');
const require_useDropdown = require('./useDropdown.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown-menu.vue?vue&type=script&lang.ts
var dropdown_menu_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdownMenu",
props: require_dropdown.dropdownMenuProps,
setup(props) {
const ns = require_index.useNamespace("dropdown");
const { _elDropdownSize } = require_useDropdown.useDropdown();
const size = _elDropdownSize.value;
const { contentRef, role, triggerId, isUsingKeyboard, handleClose } = (0, vue.inject)(require_tokens$1.DROPDOWN_INJECTION_KEY, void 0);
const { rovingFocusGroupRef, rovingFocusGroupRootStyle, onBlur, onFocus, onKeydown, onMousedown } = (0, vue.inject)(require_tokens.ROVING_FOCUS_GROUP_INJECTION_KEY, void 0);
const { collectionRef: rovingFocusGroupCollectionRef } = (0, vue.inject)(require_roving_focus_group.ROVING_FOCUS_COLLECTION_INJECTION_KEY, void 0);
const dropdownKls = (0, vue.computed)(() => {
return [ns.b("menu"), ns.bm("menu", size?.value)];
});
const dropdownListWrapperRef = require_refs.composeRefs(contentRef, rovingFocusGroupRef, rovingFocusGroupCollectionRef);
const handleKeydown = require_event.composeEventHandlers((e) => {
props.onKeydown?.(e);
}, (e) => {
const { currentTarget, target } = e;
const code = require_event.getEventCode(e);
if (currentTarget.contains(target)) {}
if (require_aria.EVENT_CODE.tab === code) return handleClose();
onKeydown(e);
});
function handleFocus(e) {
isUsingKeyboard.value && onFocus(e);
}
return {
size,
rovingFocusGroupRootStyle,
dropdownKls,
role,
triggerId,
dropdownListWrapperRef,
handleKeydown,
onBlur,
handleFocus,
onMousedown
};
}
});
//#endregion
exports.default = dropdown_menu_vue_vue_type_script_lang_default;
//# sourceMappingURL=dropdown-menu.vue_vue_type_script_lang.js.map
@@ -0,0 +1 @@
{"version":3,"file":"dropdown-menu.vue_vue_type_script_lang.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/dropdown-menu.vue"],"sourcesContent":["<template>\n <ul\n :ref=\"dropdownListWrapperRef\"\n :class=\"dropdownKls\"\n :style=\"rovingFocusGroupRootStyle\"\n :tabindex=\"-1\"\n :role=\"role\"\n :aria-labelledby=\"triggerId\"\n @focusin=\"handleFocus\"\n @focusout=\"onBlur\"\n @keydown.self=\"handleKeydown\"\n @mousedown.self=\"onMousedown\"\n >\n <slot />\n </ul>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject } from 'vue'\nimport {\n composeEventHandlers,\n composeRefs,\n getEventCode,\n} from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport {\n ROVING_FOCUS_COLLECTION_INJECTION_KEY,\n ROVING_FOCUS_GROUP_INJECTION_KEY,\n} from '@element-plus/components/roving-focus-group'\nimport { useNamespace } from '@element-plus/hooks'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\nimport { dropdownMenuProps } from './dropdown'\nimport { useDropdown } from './useDropdown'\n\nexport default defineComponent({\n name: 'ElDropdownMenu',\n props: dropdownMenuProps,\n setup(props) {\n const ns = useNamespace('dropdown')\n const { _elDropdownSize } = useDropdown()\n const size = _elDropdownSize.value\n\n const { contentRef, role, triggerId, isUsingKeyboard, handleClose } =\n inject(DROPDOWN_INJECTION_KEY, undefined)!\n\n const {\n rovingFocusGroupRef,\n rovingFocusGroupRootStyle,\n onBlur,\n onFocus,\n onKeydown,\n onMousedown,\n } = inject(ROVING_FOCUS_GROUP_INJECTION_KEY, undefined)!\n\n const { collectionRef: rovingFocusGroupCollectionRef } = inject(\n ROVING_FOCUS_COLLECTION_INJECTION_KEY,\n undefined\n )!\n\n const dropdownKls = computed(() => {\n return [ns.b('menu'), ns.bm('menu', size?.value)]\n })\n\n const dropdownListWrapperRef = composeRefs(\n contentRef,\n rovingFocusGroupRef,\n rovingFocusGroupCollectionRef\n )\n\n const handleKeydown = composeEventHandlers(\n (e: KeyboardEvent) => {\n props.onKeydown?.(e)\n },\n (e) => {\n const { currentTarget, target } = e\n const code = getEventCode(e)\n\n const isKeydownContained = (currentTarget as Node).contains(\n target as Node\n )\n\n if (isKeydownContained) {\n // TODO: implement typeahead search\n }\n\n if (EVENT_CODE.tab === code) {\n return handleClose()\n }\n\n onKeydown(e)\n }\n )\n\n function handleFocus(e: FocusEvent) {\n isUsingKeyboard.value && onFocus(e)\n }\n\n return {\n size,\n rovingFocusGroupRootStyle,\n dropdownKls,\n role,\n triggerId,\n dropdownListWrapperRef,\n handleKeydown,\n onBlur,\n handleFocus,\n onMousedown,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;AAkCA,8EAA+B;CAC7B,MAAM;CACN,OAAO;CACP,MAAM,OAAO;EACX,MAAM,KAAK,2BAAa,WAAU;EAClC,MAAM,EAAE,oBAAoB,iCAAY;EACxC,MAAM,OAAO,gBAAgB;EAE7B,MAAM,EAAE,YAAY,MAAM,WAAW,iBAAiB,gCAC7C,yCAAwB,OAAU;EAE3C,MAAM,EACJ,qBACA,2BACA,QACA,SACA,WACA,gCACS,iDAAkC,OAAU;EAEvD,MAAM,EAAE,eAAe,kDACrB,kEACA,OACD;EAED,MAAM,sCAA6B;AACjC,UAAO,CAAC,GAAG,EAAE,OAAO,EAAE,GAAG,GAAG,QAAQ,MAAM,MAAM,CAAA;IACjD;EAED,MAAM,yBAAyB,yBAC7B,YACA,qBACA,8BACF;EAEA,MAAM,gBAAgB,oCACnB,MAAqB;AACpB,SAAM,YAAY,EAAC;MAEpB,MAAM;GACL,MAAM,EAAE,eAAe,WAAW;GAClC,MAAM,OAAO,2BAAa,EAAC;AAM3B,OAJ4B,cAAuB,SACjD,OACF,EAEwB;AAIxB,OAAI,wBAAW,QAAQ,KACrB,QAAO,aAAY;AAGrB,aAAU,EAAC;IAEf;EAEA,SAAS,YAAY,GAAe;AAClC,mBAAgB,SAAS,QAAQ,EAAC;;AAGpC,SAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACF;;CAEH,CAAA"}
@@ -0,0 +1,215 @@
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import { Arrayable, Nullable } from "../../../utils/typescript.js";
import "../../../utils/index.js";
import { PopperEffect } from "../../popper/src/popper.js";
import { Measurable } from "../../popper/src/constants.js";
import { ButtonProps } from "../../button/src/button.js";
import "../../button/index.js";
import { Placement as Placement$1 } from "../../popper/index.js";
import * as vue from "vue";
import { ComponentInternalInstance, ComputedRef } from "vue";
import { Options } from "@popperjs/core";
//#region ../../packages/components/dropdown/src/dropdown.d.ts
interface IElDropdownInstance {
instance?: ComponentInternalInstance;
dropdownSize?: ComputedRef<string>;
handleClick?: () => void;
commandHandler?: (...arg: any[]) => void;
show?: () => void;
hide?: () => void;
trigger?: ComputedRef<string>;
hideOnClick?: ComputedRef<boolean>;
triggerElm?: ComputedRef<Nullable<HTMLButtonElement>>;
}
declare const dropdownProps: {
readonly trigger: {
readonly type: vue.PropType<Arrayable<"click" | "contextmenu" | "hover">>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
readonly default: "hover";
};
readonly triggerKeys: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => string[], boolean>;
readonly virtualTriggering: BooleanConstructor;
readonly virtualRef: {
readonly type: vue.PropType<Measurable>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly effect: {
readonly default: "light";
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string) | (() => PopperEffect) | (((new (...args: any[]) => string) | (() => PopperEffect)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
};
readonly type: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (((new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger")) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly placement: EpPropFinalized<(new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1) | (((new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1)) | null)[], unknown, unknown, "bottom", boolean>;
readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
readonly id: StringConstructor;
readonly size: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly splitButton: BooleanConstructor;
readonly hideOnClick: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly loop: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showArrow: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly hideTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly tabindex: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, 0, boolean>;
readonly maxHeight: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, "", boolean>;
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
readonly role: EpPropFinalized<StringConstructor, "listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree", unknown, "menu", boolean>;
readonly buttonProps: {
readonly type: vue.PropType<Partial<ButtonProps>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly teleported: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly appendTo: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>) | (((new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly persistent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
};
declare const dropdownItemProps: {
readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
readonly disabled: BooleanConstructor;
readonly divided: BooleanConstructor;
readonly textValue: StringConstructor;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
};
declare const dropdownMenuProps: {
onKeydown: {
readonly type: vue.PropType<(e: KeyboardEvent) => void>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
};
declare const FIRST_KEYS: string[];
declare const LAST_KEYS: string[];
declare const FIRST_LAST_KEYS: string[];
//#endregion
export { FIRST_KEYS, FIRST_LAST_KEYS, IElDropdownInstance, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps };
@@ -0,0 +1,123 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_aria = require('../../../constants/aria.js');
const require_runtime = require('../../../utils/vue/props/runtime.js');
const require_icon = require('../../../utils/vue/icon.js');
const require_popper = require('../../popper/src/popper.js');
const require_content = require('../../tooltip/src/content.js');
const require_trigger = require('../../tooltip/src/trigger.js');
//#region ../../packages/components/dropdown/src/dropdown.ts
const dropdownProps = require_runtime.buildProps({
trigger: {
...require_trigger.useTooltipTriggerProps.trigger,
type: require_runtime.definePropType([String, Array])
},
triggerKeys: {
type: require_runtime.definePropType(Array),
default: () => [
require_aria.EVENT_CODE.enter,
require_aria.EVENT_CODE.numpadEnter,
require_aria.EVENT_CODE.space,
require_aria.EVENT_CODE.down
]
},
virtualTriggering: require_trigger.useTooltipTriggerProps.virtualTriggering,
virtualRef: require_trigger.useTooltipTriggerProps.virtualRef,
effect: {
...require_content.useTooltipContentProps.effect,
default: "light"
},
type: { type: require_runtime.definePropType(String) },
placement: {
type: require_runtime.definePropType(String),
default: "bottom"
},
popperOptions: {
type: require_runtime.definePropType(Object),
default: () => ({})
},
id: String,
size: {
type: String,
default: ""
},
splitButton: Boolean,
hideOnClick: {
type: Boolean,
default: true
},
loop: {
type: Boolean,
default: true
},
showArrow: {
type: Boolean,
default: true
},
showTimeout: {
type: Number,
default: 150
},
hideTimeout: {
type: Number,
default: 150
},
tabindex: {
type: require_runtime.definePropType([Number, String]),
default: 0
},
maxHeight: {
type: require_runtime.definePropType([Number, String]),
default: ""
},
popperClass: require_content.useTooltipContentProps.popperClass,
popperStyle: require_content.useTooltipContentProps.popperStyle,
disabled: Boolean,
role: {
type: String,
values: require_popper.roleTypes,
default: "menu"
},
buttonProps: { type: require_runtime.definePropType(Object) },
teleported: require_content.useTooltipContentProps.teleported,
appendTo: require_content.useTooltipContentProps.appendTo,
persistent: {
type: Boolean,
default: true
}
});
const dropdownItemProps = require_runtime.buildProps({
command: {
type: [
Object,
String,
Number
],
default: () => ({})
},
disabled: Boolean,
divided: Boolean,
textValue: String,
icon: { type: require_icon.iconPropType }
});
const dropdownMenuProps = require_runtime.buildProps({ onKeydown: { type: require_runtime.definePropType(Function) } });
const FIRST_KEYS = [
require_aria.EVENT_CODE.down,
require_aria.EVENT_CODE.pageDown,
require_aria.EVENT_CODE.home
];
const LAST_KEYS = [
require_aria.EVENT_CODE.up,
require_aria.EVENT_CODE.pageUp,
require_aria.EVENT_CODE.end
];
const FIRST_LAST_KEYS = [...FIRST_KEYS, ...LAST_KEYS];
//#endregion
exports.FIRST_KEYS = FIRST_KEYS;
exports.FIRST_LAST_KEYS = FIRST_LAST_KEYS;
exports.LAST_KEYS = LAST_KEYS;
exports.dropdownItemProps = dropdownItemProps;
exports.dropdownMenuProps = dropdownMenuProps;
exports.dropdownProps = dropdownProps;
//# sourceMappingURL=dropdown.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,930 @@
import { IconPropType } from "../../../utils/vue/icon.js";
import { SFCWithInstall } from "../../../utils/vue/typescript.js";
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import { ComponentSize } from "../../../constants/size.js";
import { Arrayable } from "../../../utils/typescript.js";
import "../../../utils/index.js";
import { PopperEffect, PopperInstance, roleTypes } from "../../popper/src/popper.js";
import { Measurable } from "../../popper/src/constants.js";
import { ButtonNativeType, ButtonProps, ButtonType } from "../../button/src/button.js";
import { ButtonGroupProps } from "../../button/src/button-group.js";
import { _default as _default$1 } from "../../button/src/button-group.vue.js";
import "../../button/index.js";
import { Translator } from "../../../hooks/use-locale/index.js";
import "../../../hooks/index.js";
import { TooltipTriggerType } from "../../tooltip/src/trigger.js";
import { TooltipContentInstance } from "../../tooltip/src/content.js";
import { TooltipInstance, UseTooltipProps } from "../../tooltip/src/tooltip.js";
import "../../tooltip/index.js";
import { ScrollbarDirection, ScrollbarProps } from "../../scrollbar/src/scrollbar.js";
import "../../scrollbar/index.js";
import { IconProps } from "../../icon/src/icon.js";
import "../../icon/index.js";
import "../../../index.js";
import { Options, Placement } from "../../popper/index.js";
import * as vue from "vue";
import { CSSProperties } from "vue";
//#region ../../packages/components/dropdown/src/dropdown.vue.d.ts
declare const _default: typeof __VLS_export;
declare const __VLS_export: vue.DefineComponent<vue.ExtractPropTypes<{
readonly trigger: {
readonly type: vue.PropType<Arrayable<"click" | "contextmenu" | "hover">>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
readonly default: "hover";
};
readonly triggerKeys: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => string[], boolean>;
readonly virtualTriggering: BooleanConstructor;
readonly virtualRef: {
readonly type: vue.PropType<Measurable>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly effect: {
readonly default: "light";
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string) | (() => PopperEffect) | (((new (...args: any[]) => string) | (() => PopperEffect)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
};
readonly type: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (((new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger")) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly placement: EpPropFinalized<(new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | (((new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement)) | null)[], unknown, unknown, "bottom", boolean>;
readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
readonly id: StringConstructor;
readonly size: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly splitButton: BooleanConstructor;
readonly hideOnClick: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly loop: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showArrow: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly hideTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly tabindex: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, 0, boolean>;
readonly maxHeight: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, "", boolean>;
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
readonly role: EpPropFinalized<StringConstructor, "listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree", unknown, "menu", boolean>;
readonly buttonProps: {
readonly type: vue.PropType<Partial<ButtonProps>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly teleported: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly appendTo: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>) | (((new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly persistent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
}>, {
t: Translator;
ns: {
namespace: vue.ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
scrollbar: vue.Ref<null, null>;
wrapStyle: vue.ComputedRef<CSSProperties>;
dropdownTriggerKls: vue.ComputedRef<string[]>;
dropdownSize: vue.ComputedRef<"" | "default" | "small" | "large">;
triggerId: vue.ComputedRef<string>;
currentTabId: vue.Ref<string | null, string | null>;
handleCurrentTabIdChange: (id: string) => void;
handlerMainButtonClick: (event: MouseEvent) => void;
handleClose: () => void;
handleOpen: () => void;
handleBeforeShowTooltip: () => void;
handleShowTooltip: (event?: Event) => void;
handleBeforeHideTooltip: () => void;
popperRef: vue.Ref<TooltipInstance | undefined, TooltipInstance | undefined>;
contentRef: vue.Ref<HTMLElement | undefined, HTMLElement | undefined>;
triggeringElementRef: vue.Ref<any, any>;
referenceElementRef: vue.Ref<any, any>;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "visible-change" | "command")[], "click" | "visible-change" | "command", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
readonly trigger: {
readonly type: vue.PropType<Arrayable<"click" | "contextmenu" | "hover">>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
readonly default: "hover";
};
readonly triggerKeys: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => string[], boolean>;
readonly virtualTriggering: BooleanConstructor;
readonly virtualRef: {
readonly type: vue.PropType<Measurable>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly effect: {
readonly default: "light";
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string) | (() => PopperEffect) | (((new (...args: any[]) => string) | (() => PopperEffect)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
readonly __epPropKey: true;
};
readonly type: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (((new (...args: any[]) => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger") | (() => "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger")) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly placement: EpPropFinalized<(new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | (((new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement)) | null)[], unknown, unknown, "bottom", boolean>;
readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
readonly id: StringConstructor;
readonly size: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly splitButton: BooleanConstructor;
readonly hideOnClick: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly loop: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showArrow: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly showTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly hideTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
readonly tabindex: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, 0, boolean>;
readonly maxHeight: EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, "", boolean>;
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
readonly role: EpPropFinalized<StringConstructor, "listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree", unknown, "menu", boolean>;
readonly buttonProps: {
readonly type: vue.PropType<Partial<ButtonProps>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly teleported: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly appendTo: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>) | (((new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly persistent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
}>> & Readonly<{
onClick?: ((...args: any[]) => any) | undefined;
"onVisible-change"?: ((...args: any[]) => any) | undefined;
onCommand?: ((...args: any[]) => any) | undefined;
}>, {
readonly teleported: EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly effect: EpPropMergeType<(new (...args: any[]) => string) | (() => PopperEffect) | (((new (...args: any[]) => string) | (() => PopperEffect)) | null)[], unknown, unknown>;
readonly size: string;
readonly disabled: boolean;
readonly tabindex: EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown>;
readonly virtualTriggering: boolean;
readonly loop: EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly placement: EpPropMergeType<(new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | (((new (...args: any[]) => "top" | "auto" | "bottom" | "left" | "right" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement)) | null)[], unknown, unknown>;
readonly popperOptions: Partial<Options>;
readonly showArrow: EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly role: EpPropMergeType<StringConstructor, "listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree", unknown>;
readonly persistent: EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly trigger: Arrayable<"click" | "contextmenu" | "hover">;
readonly triggerKeys: string[];
readonly maxHeight: EpPropMergeType<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown>;
readonly hideOnClick: EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly showTimeout: number;
readonly hideTimeout: number;
readonly splitButton: boolean;
}, {}, {
ElButton: {
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<ButtonProps> & Readonly<{
onClick?: ((evt: MouseEvent) => any) | undefined;
}>, {
ref: vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
size: vue.ComputedRef<"" | "default" | "small" | "large">;
type: vue.ComputedRef<"default" | "" | "info" | "primary" | "success" | "warning" | "text" | "danger">;
disabled: vue.ComputedRef<boolean>;
shouldAddSpace: vue.ComputedRef<boolean>;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
click: (evt: MouseEvent) => void;
}, vue.PublicProps, {
type: ButtonType;
text: boolean;
disabled: boolean;
round: boolean;
dashed: boolean;
nativeType: ButtonNativeType;
loadingIcon: IconPropType;
plain: boolean;
autoInsertSpace: boolean;
tag: string | vue.Component;
}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<ButtonProps> & Readonly<{
onClick?: ((evt: MouseEvent) => any) | undefined;
}>, {
ref: vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
size: vue.ComputedRef<"" | "default" | "small" | "large">;
type: vue.ComputedRef<"default" | "" | "info" | "primary" | "success" | "warning" | "text" | "danger">;
disabled: vue.ComputedRef<boolean>;
shouldAddSpace: vue.ComputedRef<boolean>;
}, {}, {}, {}, {
type: ButtonType;
text: boolean;
disabled: boolean;
round: boolean;
dashed: boolean;
nativeType: ButtonNativeType;
loadingIcon: IconPropType;
plain: boolean;
autoInsertSpace: boolean;
tag: string | vue.Component;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<ButtonProps> & Readonly<{
onClick?: ((evt: MouseEvent) => any) | undefined;
}>, {
ref: vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
size: vue.ComputedRef<"" | "default" | "small" | "large">;
type: vue.ComputedRef<"default" | "" | "info" | "primary" | "success" | "warning" | "text" | "danger">;
disabled: vue.ComputedRef<boolean>;
shouldAddSpace: vue.ComputedRef<boolean>;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
click: (evt: MouseEvent) => void;
}, string, {
type: ButtonType;
text: boolean;
disabled: boolean;
round: boolean;
dashed: boolean;
nativeType: ButtonNativeType;
loadingIcon: IconPropType;
plain: boolean;
autoInsertSpace: boolean;
tag: string | vue.Component;
}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
loading?: (props: {}) => any;
} & {
icon?: (props: {}) => any;
} & {
default?: (props: {}) => any;
};
}) & vue.ObjectPlugin & {
setPropsDefaults: (defaults: Partial<Omit<{
readonly size?: ComponentSize | undefined;
readonly disabled?: boolean | undefined;
readonly type?: ButtonType | undefined;
readonly icon?: IconPropType | undefined;
readonly nativeType?: ButtonNativeType | undefined;
readonly loading?: boolean | undefined;
readonly loadingIcon?: IconPropType | undefined;
readonly plain?: boolean | undefined;
readonly text?: boolean | undefined;
readonly link?: boolean | undefined;
readonly bg?: boolean | undefined;
readonly autofocus?: boolean | undefined;
readonly round?: boolean | undefined;
readonly circle?: boolean | undefined;
readonly dashed?: boolean | undefined;
readonly color?: string | undefined;
readonly dark?: boolean | undefined;
readonly autoInsertSpace?: boolean | undefined;
readonly tag?: (string | vue.Component) | undefined;
readonly onClick?: ((evt: MouseEvent) => any) | undefined;
} & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "onClick" | keyof vue.VNodeProps | keyof vue.AllowedComponentProps>>) => void;
} & {
ButtonGroup: typeof _default$1;
};
ElButtonGroup: {
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<ButtonGroupProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {
type: "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger";
direction: "horizontal" | "vertical";
}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<ButtonGroupProps> & Readonly<{}>, {}, {}, {}, {}, {
type: "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger";
direction: "horizontal" | "vertical";
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<ButtonGroupProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {
type: "" | "default" | "info" | "primary" | "success" | "warning" | "text" | "danger";
direction: "horizontal" | "vertical";
}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default?: (props: {}) => any;
};
});
ElScrollbar: SFCWithInstall<{
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<ScrollbarProps> & Readonly<{
onScroll?: ((args_0: {
scrollTop: number;
scrollLeft: number;
}) => any) | undefined;
"onEnd-reached"?: ((direction: ScrollbarDirection) => any) | undefined;
}>, {
wrapRef: vue.Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
update: () => void;
scrollTo: {
(xCord: number, yCord?: number): void;
(options: ScrollToOptions): void;
};
setScrollTop: (value: number) => void;
setScrollLeft: (value: number) => void;
handleScroll: () => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
scroll: (args_0: {
scrollTop: number;
scrollLeft: number;
}) => void;
"end-reached": (direction: ScrollbarDirection) => void;
}, vue.PublicProps, {
tabindex: number | string;
height: number | string;
maxHeight: number | string;
tag: keyof HTMLElementTagNameMap | (string & {});
distance: number;
wrapStyle: string | false | CSSProperties | vue.StyleValue[] | null;
wrapClass: string | string[];
viewClass: string | string[];
viewStyle: string | false | CSSProperties | vue.StyleValue[] | null;
minSize: number;
}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<ScrollbarProps> & Readonly<{
onScroll?: ((args_0: {
scrollTop: number;
scrollLeft: number;
}) => any) | undefined;
"onEnd-reached"?: ((direction: ScrollbarDirection) => any) | undefined;
}>, {
wrapRef: vue.Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
update: () => void;
scrollTo: {
(xCord: number, yCord?: number): void;
(options: ScrollToOptions): void;
};
setScrollTop: (value: number) => void;
setScrollLeft: (value: number) => void;
handleScroll: () => void;
}, {}, {}, {}, {
tabindex: number | string;
height: number | string;
maxHeight: number | string;
tag: keyof HTMLElementTagNameMap | (string & {});
distance: number;
wrapStyle: string | false | CSSProperties | vue.StyleValue[] | null;
wrapClass: string | string[];
viewClass: string | string[];
viewStyle: string | false | CSSProperties | vue.StyleValue[] | null;
minSize: number;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<ScrollbarProps> & Readonly<{
onScroll?: ((args_0: {
scrollTop: number;
scrollLeft: number;
}) => any) | undefined;
"onEnd-reached"?: ((direction: ScrollbarDirection) => any) | undefined;
}>, {
wrapRef: vue.Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
update: () => void;
scrollTo: {
(xCord: number, yCord?: number): void;
(options: ScrollToOptions): void;
};
setScrollTop: (value: number) => void;
setScrollLeft: (value: number) => void;
handleScroll: () => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
scroll: (args_0: {
scrollTop: number;
scrollLeft: number;
}) => void;
"end-reached": (direction: ScrollbarDirection) => void;
}, string, {
tabindex: number | string;
height: number | string;
maxHeight: number | string;
tag: keyof HTMLElementTagNameMap | (string & {});
distance: number;
wrapStyle: string | false | CSSProperties | vue.StyleValue[] | null;
wrapClass: string | string[];
viewClass: string | string[];
viewStyle: string | false | CSSProperties | vue.StyleValue[] | null;
minSize: number;
}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default?: (props: {}) => any;
};
})>;
ElTooltip: SFCWithInstall<{
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<UseTooltipProps> & Readonly<{
onClose?: ((...args: any[]) => any) | undefined;
onHide?: ((...args: any[]) => any) | undefined;
onShow?: ((...args: any[]) => any) | undefined;
onOpen?: ((...args: any[]) => any) | undefined;
"onUpdate:visible"?: ((...args: any[]) => any) | undefined;
"onBefore-show"?: ((...args: any[]) => any) | undefined;
"onBefore-hide"?: ((...args: any[]) => any) | undefined;
}>, {
popperRef: vue.Ref<PopperInstance | undefined, PopperInstance | undefined>;
contentRef: vue.Ref<TooltipContentInstance | undefined, TooltipContentInstance | undefined>;
isFocusInsideContent: (event?: FocusEvent) => boolean | undefined;
updatePopper: () => void;
onOpen: (event?: Event, delay?: number) => void;
onClose: (event?: Event, delay?: number) => void;
hide: (event?: Event) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
close: (...args: any[]) => void;
hide: (...args: any[]) => void;
show: (...args: any[]) => void;
open: (...args: any[]) => void;
"update:visible": (...args: any[]) => void;
"before-show": (...args: any[]) => void;
"before-hide": (...args: any[]) => void;
}, vue.PublicProps, {
offset: number;
teleported: boolean;
effect: PopperEffect;
visible: boolean | null;
content: string;
style: string | false | CSSProperties | vue.StyleValue[] | null;
enterable: boolean;
pure: boolean;
focusOnShow: boolean;
trapping: boolean;
popperStyle: string | false | CSSProperties | vue.StyleValue[] | null;
stopPopperMouseEvent: boolean;
virtualTriggering: boolean;
loop: boolean;
boundariesPadding: number;
gpuAcceleration: boolean;
placement: Placement;
popperOptions: Partial<Options>;
strategy: "fixed" | "absolute";
arrowOffset: number;
showArrow: boolean;
role: typeof roleTypes[number];
showAfter: number;
hideAfter: number;
autoClose: number;
trigger: Arrayable<TooltipTriggerType>;
triggerKeys: string[];
}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<UseTooltipProps> & Readonly<{
onClose?: ((...args: any[]) => any) | undefined;
onHide?: ((...args: any[]) => any) | undefined;
onShow?: ((...args: any[]) => any) | undefined;
onOpen?: ((...args: any[]) => any) | undefined;
"onUpdate:visible"?: ((...args: any[]) => any) | undefined;
"onBefore-show"?: ((...args: any[]) => any) | undefined;
"onBefore-hide"?: ((...args: any[]) => any) | undefined;
}>, {
popperRef: vue.Ref<PopperInstance | undefined, PopperInstance | undefined>;
contentRef: vue.Ref<TooltipContentInstance | undefined, TooltipContentInstance | undefined>;
isFocusInsideContent: (event?: FocusEvent) => boolean | undefined;
updatePopper: () => void;
onOpen: (event?: Event, delay?: number) => void;
onClose: (event?: Event, delay?: number) => void;
hide: (event?: Event) => void;
}, {}, {}, {}, {
offset: number;
teleported: boolean;
effect: PopperEffect;
visible: boolean | null;
content: string;
style: string | false | CSSProperties | vue.StyleValue[] | null;
enterable: boolean;
pure: boolean;
focusOnShow: boolean;
trapping: boolean;
popperStyle: string | false | CSSProperties | vue.StyleValue[] | null;
stopPopperMouseEvent: boolean;
virtualTriggering: boolean;
loop: boolean;
boundariesPadding: number;
gpuAcceleration: boolean;
placement: Placement;
popperOptions: Partial<Options>;
strategy: "fixed" | "absolute";
arrowOffset: number;
showArrow: boolean;
role: typeof roleTypes[number];
showAfter: number;
hideAfter: number;
autoClose: number;
trigger: Arrayable<TooltipTriggerType>;
triggerKeys: string[];
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<UseTooltipProps> & Readonly<{
onClose?: ((...args: any[]) => any) | undefined;
onHide?: ((...args: any[]) => any) | undefined;
onShow?: ((...args: any[]) => any) | undefined;
onOpen?: ((...args: any[]) => any) | undefined;
"onUpdate:visible"?: ((...args: any[]) => any) | undefined;
"onBefore-show"?: ((...args: any[]) => any) | undefined;
"onBefore-hide"?: ((...args: any[]) => any) | undefined;
}>, {
popperRef: vue.Ref<PopperInstance | undefined, PopperInstance | undefined>;
contentRef: vue.Ref<TooltipContentInstance | undefined, TooltipContentInstance | undefined>;
isFocusInsideContent: (event?: FocusEvent) => boolean | undefined;
updatePopper: () => void;
onOpen: (event?: Event, delay?: number) => void;
onClose: (event?: Event, delay?: number) => void;
hide: (event?: Event) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
close: (...args: any[]) => void;
hide: (...args: any[]) => void;
show: (...args: any[]) => void;
open: (...args: any[]) => void;
"update:visible": (...args: any[]) => void;
"before-show": (...args: any[]) => void;
"before-hide": (...args: any[]) => void;
}, string, {
offset: number;
teleported: boolean;
effect: PopperEffect;
visible: boolean | null;
content: string;
style: string | false | CSSProperties | vue.StyleValue[] | null;
enterable: boolean;
pure: boolean;
focusOnShow: boolean;
trapping: boolean;
popperStyle: string | false | CSSProperties | vue.StyleValue[] | null;
stopPopperMouseEvent: boolean;
virtualTriggering: boolean;
loop: boolean;
boundariesPadding: number;
gpuAcceleration: boolean;
placement: Placement;
popperOptions: Partial<Options>;
strategy: "fixed" | "absolute";
arrowOffset: number;
showArrow: boolean;
role: typeof roleTypes[number];
showAfter: number;
hideAfter: number;
autoClose: number;
trigger: Arrayable<TooltipTriggerType>;
triggerKeys: string[];
}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default?: (props: {}) => any;
} & {
content?: (props: {}) => any;
};
})>;
ElRovingFocusGroup: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {
ElFocusGroupCollection: {
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {}, true, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
name: string;
setup(): void;
};
ElRovingFocusGroupImpl: vue.DefineComponent<vue.ExtractPropTypes<{
style: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
currentTabId: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string) | (() => string | null) | (((new (...args: any[]) => string) | (() => string | null)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
defaultCurrentTabId: StringConstructor;
loop: BooleanConstructor;
dir: EpPropFinalized<StringConstructor, string, unknown, string, boolean>;
orientation: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical" | undefined) | (((new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical" | undefined)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
onBlur: FunctionConstructor;
onFocus: FunctionConstructor;
onMousedown: FunctionConstructor;
}>, void, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("currentTabIdChange" | "entryFocus")[], "currentTabIdChange" | "entryFocus", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
style: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
currentTabId: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string) | (() => string | null) | (((new (...args: any[]) => string) | (() => string | null)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
defaultCurrentTabId: StringConstructor;
loop: BooleanConstructor;
dir: EpPropFinalized<StringConstructor, string, unknown, string, boolean>;
orientation: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical" | undefined) | (((new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical" | undefined)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
onBlur: FunctionConstructor;
onFocus: FunctionConstructor;
onMousedown: FunctionConstructor;
}>> & Readonly<{
onCurrentTabIdChange?: ((...args: any[]) => any) | undefined;
onEntryFocus?: ((...args: any[]) => any) | undefined;
}>, {
loop: boolean;
dir: string;
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
ElOnlyChild: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
ElIcon: SFCWithInstall<{
new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {}, false, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, {}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<IconProps> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default?: (props: {}) => any;
};
})>;
ArrowDown: vue.DefineComponent<{}, void, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
//#endregion
export { _default };
@@ -0,0 +1,133 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_style = require('../../../utils/dom/style.js');
const require_index = require('../../../hooks/use-locale/index.js');
const require_index$1 = require('../../../hooks/use-namespace/index.js');
const require_index$2 = require('../../../hooks/use-id/index.js');
const require_index$3 = require('../../icon/index.js');
const require_only_child = require('../../slot/src/only-child.js');
const require_use_form_common_props = require('../../form/src/hooks/use-form-common-props.js');
const require_index$4 = require('../../tooltip/index.js');
const require_index$5 = require('../../scrollbar/index.js');
const require_index$6 = require('../../button/index.js');
const require_index$7 = require('../../roving-focus-group/index.js');
const require_dropdown = require('./dropdown.js');
const require_tokens = require('./tokens.js');
let _element_plus_icons_vue = require("@element-plus/icons-vue");
let vue = require("vue");
let lodash_unified = require("lodash-unified");
//#region ../../packages/components/dropdown/src/dropdown.vue?vue&type=script&lang.ts
const { ButtonGroup: ElButtonGroup } = require_index$6.ElButton;
var dropdown_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdown",
components: {
ElButton: require_index$6.ElButton,
ElButtonGroup,
ElScrollbar: require_index$5.ElScrollbar,
ElTooltip: require_index$4.ElTooltip,
ElRovingFocusGroup: require_index$7.default,
ElOnlyChild: require_only_child.OnlyChild,
ElIcon: require_index$3.ElIcon,
ArrowDown: _element_plus_icons_vue.ArrowDown
},
props: require_dropdown.dropdownProps,
emits: [
"visible-change",
"click",
"command"
],
setup(props, { emit }) {
const _instance = (0, vue.getCurrentInstance)();
const ns = require_index$1.useNamespace("dropdown");
const { t } = require_index.useLocale();
const triggeringElementRef = (0, vue.ref)();
const referenceElementRef = (0, vue.ref)();
const popperRef = (0, vue.ref)();
const contentRef = (0, vue.ref)();
const scrollbar = (0, vue.ref)(null);
const currentTabId = (0, vue.ref)(null);
const isUsingKeyboard = (0, vue.ref)(false);
const wrapStyle = (0, vue.computed)(() => ({ maxHeight: require_style.addUnit(props.maxHeight) }));
const dropdownTriggerKls = (0, vue.computed)(() => [ns.m(dropdownSize.value)]);
const trigger = (0, vue.computed)(() => (0, lodash_unified.castArray)(props.trigger));
const defaultTriggerId = require_index$2.useId().value;
const triggerId = (0, vue.computed)(() => props.id || defaultTriggerId);
function handleClick() {
popperRef.value?.onClose(void 0, 0);
}
function handleClose() {
popperRef.value?.onClose();
}
function handleOpen() {
popperRef.value?.onOpen();
}
const dropdownSize = require_use_form_common_props.useFormSize();
function commandHandler(...args) {
emit("command", ...args);
}
function onItemEnter() {}
function onItemLeave() {
const contentEl = (0, vue.unref)(contentRef);
trigger.value.includes("hover") && contentEl?.focus({ preventScroll: true });
currentTabId.value = null;
}
function handleCurrentTabIdChange(id) {
currentTabId.value = id;
}
function handleBeforeShowTooltip() {
emit("visible-change", true);
}
function handleShowTooltip(event) {
isUsingKeyboard.value = event?.type === "keydown";
contentRef.value?.focus();
}
function handleBeforeHideTooltip() {
emit("visible-change", false);
}
(0, vue.provide)(require_tokens.DROPDOWN_INJECTION_KEY, {
contentRef,
role: (0, vue.computed)(() => props.role),
triggerId,
isUsingKeyboard,
onItemEnter,
onItemLeave,
handleClose
});
(0, vue.provide)(require_tokens.DROPDOWN_INSTANCE_INJECTION_KEY, {
instance: _instance,
dropdownSize,
handleClick,
commandHandler,
trigger: (0, vue.toRef)(props, "trigger"),
hideOnClick: (0, vue.toRef)(props, "hideOnClick")
});
const handlerMainButtonClick = (event) => {
emit("click", event);
};
return {
t,
ns,
scrollbar,
wrapStyle,
dropdownTriggerKls,
dropdownSize,
triggerId,
currentTabId,
handleCurrentTabIdChange,
handlerMainButtonClick,
handleClose,
handleOpen,
handleBeforeShowTooltip,
handleShowTooltip,
handleBeforeHideTooltip,
popperRef,
contentRef,
triggeringElementRef,
referenceElementRef
};
}
});
//#endregion
exports.default = dropdown_vue_vue_type_script_lang_default;
//# sourceMappingURL=dropdown.vue_vue_type_script_lang.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,152 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require__plugin_vue_export_helper = require('../../../_virtual/_plugin-vue_export-helper.js');
const require_dropdown_vue_vue_type_script_lang = require('./dropdown.vue_vue_type_script_lang.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/dropdown.vue
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_roving_focus_group = (0, vue.resolveComponent)("el-roving-focus-group");
const _component_el_scrollbar = (0, vue.resolveComponent)("el-scrollbar");
const _component_el_only_child = (0, vue.resolveComponent)("el-only-child");
const _component_el_tooltip = (0, vue.resolveComponent)("el-tooltip");
const _component_el_button = (0, vue.resolveComponent)("el-button");
const _component_arrow_down = (0, vue.resolveComponent)("arrow-down");
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_button_group = (0, vue.resolveComponent)("el-button-group");
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([_ctx.ns.b(), _ctx.ns.is("disabled", _ctx.disabled)]) }, [(0, vue.createVNode)(_component_el_tooltip, {
ref: "popperRef",
role: _ctx.role,
effect: _ctx.effect,
"fallback-placements": ["bottom", "top"],
"popper-options": _ctx.popperOptions,
"gpu-acceleration": false,
placement: _ctx.placement,
"popper-class": [_ctx.ns.e("popper"), _ctx.popperClass],
"popper-style": _ctx.popperStyle,
trigger: _ctx.trigger,
"trigger-keys": _ctx.triggerKeys,
"trigger-target-el": _ctx.contentRef,
"show-arrow": _ctx.showArrow,
"show-after": _ctx.trigger === "hover" ? _ctx.showTimeout : 0,
"hide-after": _ctx.trigger === "hover" ? _ctx.hideTimeout : 0,
"virtual-ref": _ctx.virtualRef ?? _ctx.triggeringElementRef,
"virtual-triggering": _ctx.virtualTriggering || _ctx.splitButton,
disabled: _ctx.disabled,
transition: `${_ctx.ns.namespace.value}-zoom-in-top`,
teleported: _ctx.teleported,
"append-to": _ctx.appendTo,
pure: "",
"focus-on-target": "",
persistent: _ctx.persistent,
onBeforeShow: _ctx.handleBeforeShowTooltip,
onShow: _ctx.handleShowTooltip,
onBeforeHide: _ctx.handleBeforeHideTooltip
}, (0, vue.createSlots)({
content: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_scrollbar, {
ref: "scrollbar",
"wrap-style": _ctx.wrapStyle,
tag: "div",
"view-class": _ctx.ns.e("list")
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_roving_focus_group, {
loop: _ctx.loop,
"current-tab-id": _ctx.currentTabId,
orientation: "horizontal",
onCurrentTabIdChange: _ctx.handleCurrentTabIdChange
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "dropdown")]),
_: 3
}, 8, [
"loop",
"current-tab-id",
"onCurrentTabIdChange"
])]),
_: 3
}, 8, ["wrap-style", "view-class"])]),
_: 2
}, [!_ctx.splitButton ? {
name: "default",
fn: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_only_child, {
id: _ctx.triggerId,
ref: "triggeringElementRef",
role: "button",
tabindex: _ctx.tabindex
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["id", "tabindex"])]),
key: "0"
} : void 0]), 1032, [
"role",
"effect",
"popper-options",
"placement",
"popper-class",
"popper-style",
"trigger",
"trigger-keys",
"trigger-target-el",
"show-arrow",
"show-after",
"hide-after",
"virtual-ref",
"virtual-triggering",
"disabled",
"transition",
"teleported",
"append-to",
"persistent",
"onBeforeShow",
"onShow",
"onBeforeHide"
]), _ctx.splitButton ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_button_group, { key: 0 }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_button, (0, vue.mergeProps)({ ref: "referenceElementRef" }, _ctx.buttonProps, {
size: _ctx.dropdownSize,
type: _ctx.type,
disabled: _ctx.disabled,
tabindex: _ctx.tabindex,
onClick: _ctx.handlerMainButtonClick
}), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16, [
"size",
"type",
"disabled",
"tabindex",
"onClick"
]), (0, vue.createVNode)(_component_el_button, (0, vue.mergeProps)({
id: _ctx.triggerId,
ref: "triggeringElementRef"
}, _ctx.buttonProps, {
role: "button",
size: _ctx.dropdownSize,
type: _ctx.type,
class: _ctx.ns.e("caret-button"),
disabled: _ctx.disabled,
tabindex: _ctx.tabindex,
"aria-label": _ctx.t("el.dropdown.toggleDropdown")
}), {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_icon, { class: (0, vue.normalizeClass)(_ctx.ns.e("icon")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_arrow_down)]),
_: 1
}, 8, ["class"])]),
_: 1
}, 16, [
"id",
"size",
"type",
"class",
"disabled",
"tabindex",
"aria-label"
])]),
_: 3
})) : (0, vue.createCommentVNode)("v-if", true)], 2);
}
var dropdown_default = /* @__PURE__ */ require__plugin_vue_export_helper.default(require_dropdown_vue_vue_type_script_lang.default, [["render", _sfc_render]]);
//#endregion
exports.default = dropdown_default;
//# sourceMappingURL=dropdown2.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,6 @@
import { _default } from "./dropdown.vue.js";
//#region ../../packages/components/dropdown/src/instance.d.ts
type DropdownInstance = InstanceType<typeof _default> & unknown;
//#endregion
export { DropdownInstance };
@@ -0,0 +1 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
@@ -0,0 +1,18 @@
import { PopperProps } from "../../popper/src/popper.js";
import "../../popper/index.js";
import { ComputedRef, InjectionKey, Ref } from "vue";
//#region ../../packages/components/dropdown/src/tokens.d.ts
type ElDropdownInjectionContext = {
contentRef: Ref<HTMLElement | undefined>;
role: ComputedRef<PopperProps['role']>;
triggerId: ComputedRef<string>;
isUsingKeyboard: Ref<boolean>;
onItemLeave: (e: PointerEvent) => void;
onItemEnter: (e: PointerEvent) => void;
handleClose: () => void;
};
declare const DROPDOWN_INJECTION_KEY: InjectionKey<ElDropdownInjectionContext>;
declare const DROPDOWN_INSTANCE_INJECTION_KEY = "elDropdown";
//#endregion
export { DROPDOWN_INJECTION_KEY, DROPDOWN_INSTANCE_INJECTION_KEY, ElDropdownInjectionContext };
@@ -0,0 +1,10 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
//#region ../../packages/components/dropdown/src/tokens.ts
const DROPDOWN_INJECTION_KEY = Symbol("elDropdown");
const DROPDOWN_INSTANCE_INJECTION_KEY = "elDropdown";
//#endregion
exports.DROPDOWN_INJECTION_KEY = DROPDOWN_INJECTION_KEY;
exports.DROPDOWN_INSTANCE_INJECTION_KEY = DROPDOWN_INSTANCE_INJECTION_KEY;
//# sourceMappingURL=tokens.js.map
@@ -0,0 +1 @@
{"version":3,"file":"tokens.js","names":[],"sources":["../../../../../../packages/components/dropdown/src/tokens.ts"],"sourcesContent":["import type { PopperProps } from '@element-plus/components/popper'\nimport type { ComputedRef, InjectionKey, Ref } from 'vue'\n\nexport type ElDropdownInjectionContext = {\n contentRef: Ref<HTMLElement | undefined>\n role: ComputedRef<PopperProps['role']>\n triggerId: ComputedRef<string>\n isUsingKeyboard: Ref<boolean>\n onItemLeave: (e: PointerEvent) => void\n onItemEnter: (e: PointerEvent) => void\n handleClose: () => void\n}\n\nexport const DROPDOWN_INJECTION_KEY: InjectionKey<ElDropdownInjectionContext> =\n Symbol('elDropdown')\n\nexport const DROPDOWN_INSTANCE_INJECTION_KEY = 'elDropdown'\n"],"mappings":";;;AAaA,MAAa,yBACX,OAAO,aAAa;AAEtB,MAAa,kCAAkC"}
@@ -0,0 +1,17 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_tokens = require('./tokens.js');
let vue = require("vue");
//#region ../../packages/components/dropdown/src/useDropdown.ts
const useDropdown = () => {
const elDropdown = (0, vue.inject)(require_tokens.DROPDOWN_INSTANCE_INJECTION_KEY, {});
return {
elDropdown,
_elDropdownSize: (0, vue.computed)(() => elDropdown?.dropdownSize)
};
};
//#endregion
exports.useDropdown = useDropdown;
//# sourceMappingURL=useDropdown.js.map
@@ -0,0 +1 @@
{"version":3,"file":"useDropdown.js","names":["DROPDOWN_INSTANCE_INJECTION_KEY"],"sources":["../../../../../../packages/components/dropdown/src/useDropdown.ts"],"sourcesContent":["import { computed, inject } from 'vue'\nimport { DROPDOWN_INSTANCE_INJECTION_KEY } from './tokens'\n\nimport type { IElDropdownInstance } from './dropdown'\n\nexport const useDropdown = () => {\n const elDropdown = inject<IElDropdownInstance>(\n DROPDOWN_INSTANCE_INJECTION_KEY,\n {}\n )\n const _elDropdownSize = computed(() => elDropdown?.dropdownSize)\n\n return {\n elDropdown,\n _elDropdownSize,\n }\n}\n"],"mappings":";;;;;;AAKA,MAAa,oBAAoB;CAC/B,MAAM,6BACJA,gDACA,EAAE,CACH;AAGD,QAAO;EACL;EACA,yCAJqC,YAAY,aAAa;EAK/D"}
@@ -0,0 +1,7 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
require('../../base/style/css.js');
require('../../scrollbar/style/css.js');
require('../../popper/style/css.js');
require('../../button/style/css.js');
require('../../button-group/style/css.js');
require("element-plus/theme-chalk/el-dropdown.css");
@@ -0,0 +1,7 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
require('../../base/style/index.js');
require('../../scrollbar/style/index.js');
require('../../popper/style/index.js');
require('../../button/style/index.js');
require('../../button-group/style/index.js');
require("element-plus/theme-chalk/src/dropdown.scss");