@v-c/tabs 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Tabs.vue_vue_type_script_setup_true_lang.js +0 -1
- package/package.json +9 -6
- package/dist/TabContext.cjs +0 -12
- package/dist/TabNavList/AddButton.cjs +0 -7
- package/dist/TabNavList/AddButton.vue_vue_type_script_setup_true_lang.cjs +0 -36
- package/dist/TabNavList/ExtraContent.cjs +0 -7
- package/dist/TabNavList/ExtraContent.vue_vue_type_script_setup_true_lang.cjs +0 -51
- package/dist/TabNavList/OperationNode.cjs +0 -7
- package/dist/TabNavList/OperationNode.vue_vue_type_script_setup_true_lang.cjs +0 -210
- package/dist/TabNavList/TabNode.cjs +0 -7
- package/dist/TabNavList/TabNode.vue_vue_type_script_setup_true_lang.cjs +0 -129
- package/dist/TabNavList/Wrapper.cjs +0 -7
- package/dist/TabNavList/Wrapper.vue_vue_type_script_setup_true_lang.cjs +0 -54
- package/dist/TabNavList/index.cjs +0 -7
- package/dist/TabNavList/index.vue_vue_type_script_setup_true_lang.cjs +0 -516
- package/dist/TabPanelList/TabPane.cjs +0 -7
- package/dist/TabPanelList/TabPane.vue_vue_type_script_setup_true_lang.cjs +0 -85
- package/dist/TabPanelList/index.cjs +0 -7
- package/dist/TabPanelList/index.vue_vue_type_script_setup_true_lang.cjs +0 -105
- package/dist/Tabs.cjs +0 -7
- package/dist/Tabs.vue_vue_type_script_setup_true_lang.cjs +0 -194
- package/dist/_virtual/rolldown_runtime.cjs +0 -21
- package/dist/hooks/useAnimateConfig.cjs +0 -31
- package/dist/hooks/useIndicator.cjs +0 -71
- package/dist/hooks/useOffsets.cjs +0 -42
- package/dist/hooks/useTouchMove.cjs +0 -122
- package/dist/hooks/useVisibleRange.cjs +0 -54
- package/dist/index.cjs +0 -7
- package/dist/interface.cjs +0 -1
- package/dist/utils.cjs +0 -34
|
@@ -11,7 +11,6 @@ import omit from "@v-c/util/dist/omit";
|
|
|
11
11
|
var _hoisted_1 = ["id"];
|
|
12
12
|
var Tabs_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
13
13
|
name: "Tabs",
|
|
14
|
-
inheritAttrs: false,
|
|
15
14
|
__name: "Tabs",
|
|
16
15
|
props: {
|
|
17
16
|
prefixCls: { default: "vc-tabs" },
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@v-c/tabs",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.1",
|
|
5
5
|
"description": "tabs ui component for react",
|
|
6
6
|
"publishConfig": {
|
|
7
7
|
"access": "public"
|
|
@@ -9,13 +9,16 @@
|
|
|
9
9
|
"author": "",
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"keywords": [
|
|
12
|
-
"
|
|
12
|
+
"tabs",
|
|
13
|
+
"vue-components",
|
|
14
|
+
"vc-components",
|
|
15
|
+
"vue3"
|
|
13
16
|
],
|
|
14
17
|
"exports": {
|
|
15
18
|
".": {
|
|
16
19
|
"types": "./dist/index.d.ts",
|
|
17
20
|
"import": "./dist/index.js",
|
|
18
|
-
"
|
|
21
|
+
"default": "./dist/index.js"
|
|
19
22
|
},
|
|
20
23
|
"./dist/*": "./dist/*",
|
|
21
24
|
"./package.json": "./package.json"
|
|
@@ -29,11 +32,11 @@
|
|
|
29
32
|
"vue": "^3.0.0"
|
|
30
33
|
},
|
|
31
34
|
"dependencies": {
|
|
32
|
-
"@v-c/dropdown": "^1.0.2",
|
|
33
35
|
"@v-c/menu": "^1.0.7",
|
|
34
|
-
"@v-c/
|
|
36
|
+
"@v-c/dropdown": "^1.0.2",
|
|
35
37
|
"@v-c/overflow": "^1.0.3",
|
|
36
|
-
"@v-c/resize-observer": "^1.0.8"
|
|
38
|
+
"@v-c/resize-observer": "^1.0.8",
|
|
39
|
+
"@v-c/util": "^1.0.9"
|
|
37
40
|
},
|
|
38
41
|
"scripts": {
|
|
39
42
|
"build": "vite build",
|
package/dist/TabContext.cjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
|
|
3
|
-
let vue = require("vue");
|
|
4
|
-
var TabContextKey = Symbol("TabContext");
|
|
5
|
-
function provideTabContext(value) {
|
|
6
|
-
(0, vue.provide)(TabContextKey, value);
|
|
7
|
-
}
|
|
8
|
-
function useTabContext() {
|
|
9
|
-
return (0, vue.inject)(TabContextKey, {});
|
|
10
|
-
}
|
|
11
|
-
exports.provideTabContext = provideTabContext;
|
|
12
|
-
exports.useTabContext = useTabContext;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_AddButton_vue_vue_type_script_setup_true_lang = require("./AddButton.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var AddButton_default = require_AddButton_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = AddButton_default;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
|
|
2
|
-
let vue = require("vue");
|
|
3
|
-
let _v_c_util = require("@v-c/util");
|
|
4
|
-
var _hoisted_1 = ["aria-label"];
|
|
5
|
-
var AddButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
6
|
-
name: "AddButton",
|
|
7
|
-
inheritAttrs: false,
|
|
8
|
-
__name: "AddButton",
|
|
9
|
-
props: {
|
|
10
|
-
prefixCls: {},
|
|
11
|
-
editable: {},
|
|
12
|
-
locale: {},
|
|
13
|
-
style: {}
|
|
14
|
-
},
|
|
15
|
-
setup(__props, { expose: __expose }) {
|
|
16
|
-
const { prefixCls, editable, locale, style } = (0, vue.toRefs)(__props);
|
|
17
|
-
const buttonRef = (0, vue.ref)();
|
|
18
|
-
function handleClick(event) {
|
|
19
|
-
editable.value?.onEdit("add", { event });
|
|
20
|
-
}
|
|
21
|
-
__expose({ buttonRef });
|
|
22
|
-
return (_ctx, _cache) => {
|
|
23
|
-
return (0, vue.unref)(editable) && (0, vue.unref)(editable).showAdd !== false ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
|
|
24
|
-
key: 0,
|
|
25
|
-
ref_key: "buttonRef",
|
|
26
|
-
ref: buttonRef,
|
|
27
|
-
type: "button",
|
|
28
|
-
class: (0, vue.normalizeClass)(`${(0, vue.unref)(prefixCls)}-nav-add`),
|
|
29
|
-
style: (0, vue.normalizeStyle)((0, vue.unref)(style)),
|
|
30
|
-
"aria-label": (0, vue.unref)(locale)?.addAriaLabel || "Add tab",
|
|
31
|
-
onClick: handleClick
|
|
32
|
-
}, [(0, vue.createVNode)((0, vue.unref)(_v_c_util.RenderComponent), { render: (0, vue.unref)(editable).addIcon || "+" }, null, 8, ["render"])], 14, _hoisted_1)) : (0, vue.createCommentVNode)("", true);
|
|
33
|
-
};
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
exports.default = AddButton_vue_vue_type_script_setup_true_lang_default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_ExtraContent_vue_vue_type_script_setup_true_lang = require("./ExtraContent.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var ExtraContent_default = require_ExtraContent_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = ExtraContent_default;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
|
|
2
|
-
let vue = require("vue");
|
|
3
|
-
let _v_c_util_dist_RenderComponent = require("@v-c/util/dist/RenderComponent");
|
|
4
|
-
_v_c_util_dist_RenderComponent = require_rolldown_runtime.__toESM(_v_c_util_dist_RenderComponent);
|
|
5
|
-
let _v_c_util_dist_vnode = require("@v-c/util/dist/vnode");
|
|
6
|
-
var ExtraContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
7
|
-
__name: "ExtraContent",
|
|
8
|
-
props: {
|
|
9
|
-
position: {},
|
|
10
|
-
prefixCls: {},
|
|
11
|
-
extra: { type: [
|
|
12
|
-
Object,
|
|
13
|
-
String,
|
|
14
|
-
Number,
|
|
15
|
-
null,
|
|
16
|
-
Boolean,
|
|
17
|
-
Array
|
|
18
|
-
] }
|
|
19
|
-
},
|
|
20
|
-
setup(__props, { expose: __expose }) {
|
|
21
|
-
const { position, prefixCls, extra } = (0, vue.toRefs)(__props);
|
|
22
|
-
const extraContentRef = (0, vue.ref)();
|
|
23
|
-
const isValidExtra = (0, vue.computed)(() => {
|
|
24
|
-
if (typeof extra.value === "object" && (0, vue.isVNode)(extra.value) && (0, _v_c_util_dist_vnode.ensureValidVNode)(Array.isArray(extra.value) ? extra.value : [extra.value])) return true;
|
|
25
|
-
if ([
|
|
26
|
-
"string",
|
|
27
|
-
"number",
|
|
28
|
-
"boolean",
|
|
29
|
-
"object"
|
|
30
|
-
].includes(typeof extra.value)) return true;
|
|
31
|
-
return false;
|
|
32
|
-
});
|
|
33
|
-
const childrenNodes = (0, vue.computed)(() => {
|
|
34
|
-
if (!extra.value) return null;
|
|
35
|
-
let assertExtra = {};
|
|
36
|
-
if (typeof extra.value === "object" && !(0, vue.isVNode)(extra.value)) assertExtra = extra.value;
|
|
37
|
-
else assertExtra.right = extra.value;
|
|
38
|
-
return position.value === "right" ? assertExtra.right : assertExtra.left;
|
|
39
|
-
});
|
|
40
|
-
__expose({ extraContentRef });
|
|
41
|
-
return (_ctx, _cache) => {
|
|
42
|
-
return isValidExtra.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
|
|
43
|
-
key: 0,
|
|
44
|
-
ref_key: "extraContentRef",
|
|
45
|
-
ref: extraContentRef,
|
|
46
|
-
class: (0, vue.normalizeClass)([`${(0, vue.unref)(prefixCls)}-extra-content`])
|
|
47
|
-
}, [(0, vue.createVNode)((0, vue.unref)(_v_c_util_dist_RenderComponent.default), { render: childrenNodes.value }, null, 8, ["render"])], 2)) : (0, vue.createCommentVNode)("", true);
|
|
48
|
-
};
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
exports.default = ExtraContent_vue_vue_type_script_setup_true_lang_default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_OperationNode_vue_vue_type_script_setup_true_lang = require("./OperationNode.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var OperationNode_default = require_OperationNode_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = OperationNode_default;
|
|
@@ -1,210 +0,0 @@
|
|
|
1
|
-
const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
|
|
2
|
-
const require_utils = require("../utils.cjs");
|
|
3
|
-
const require_AddButton = require("./AddButton.cjs");
|
|
4
|
-
let vue = require("vue");
|
|
5
|
-
let _v_c_util = require("@v-c/util");
|
|
6
|
-
let _v_c_util_dist_RenderComponent = require("@v-c/util/dist/RenderComponent");
|
|
7
|
-
_v_c_util_dist_RenderComponent = require_rolldown_runtime.__toESM(_v_c_util_dist_RenderComponent);
|
|
8
|
-
let _v_c_dropdown = require("@v-c/dropdown");
|
|
9
|
-
_v_c_dropdown = require_rolldown_runtime.__toESM(_v_c_dropdown);
|
|
10
|
-
let _v_c_menu = require("@v-c/menu");
|
|
11
|
-
_v_c_menu = require_rolldown_runtime.__toESM(_v_c_menu);
|
|
12
|
-
let _v_c_util_dist_KeyCode = require("@v-c/util/dist/KeyCode");
|
|
13
|
-
_v_c_util_dist_KeyCode = require_rolldown_runtime.__toESM(_v_c_util_dist_KeyCode);
|
|
14
|
-
var _hoisted_1 = [
|
|
15
|
-
"id",
|
|
16
|
-
"aria-controls",
|
|
17
|
-
"aria-expanded"
|
|
18
|
-
];
|
|
19
|
-
var OperationNode_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
20
|
-
__name: "OperationNode",
|
|
21
|
-
props: {
|
|
22
|
-
prefixCls: {},
|
|
23
|
-
className: {},
|
|
24
|
-
style: {},
|
|
25
|
-
id: {},
|
|
26
|
-
tabs: {},
|
|
27
|
-
rtl: { type: Boolean },
|
|
28
|
-
tabBarGutter: {},
|
|
29
|
-
activeKey: {},
|
|
30
|
-
mobile: { type: Boolean },
|
|
31
|
-
more: { default: () => ({}) },
|
|
32
|
-
editable: {},
|
|
33
|
-
locale: {},
|
|
34
|
-
removeAriaLabel: {},
|
|
35
|
-
onTabClick: {},
|
|
36
|
-
tabMoving: { type: Boolean },
|
|
37
|
-
getPopupContainer: {},
|
|
38
|
-
popupClassName: {},
|
|
39
|
-
popupStyle: {}
|
|
40
|
-
},
|
|
41
|
-
setup(__props, { expose: __expose }) {
|
|
42
|
-
const props = __props;
|
|
43
|
-
const MenuItem = _v_c_menu.default.Item;
|
|
44
|
-
const { more: moreProps, tabBarGutter, getPopupContainer, popupStyle, popupClassName, rtl, removeAriaLabel, onTabClick, locale, mobile, id, prefixCls, editable, style, className } = (0, vue.toRefs)(props);
|
|
45
|
-
const open = (0, vue.ref)(false);
|
|
46
|
-
const selectedKey = (0, vue.ref)(null);
|
|
47
|
-
const operationNodeRef = (0, vue.useTemplateRef)("operationNodeRef");
|
|
48
|
-
const popupId = (0, vue.computed)(() => `${id.value}-more-popup`);
|
|
49
|
-
const dropdownPrefix = (0, vue.computed)(() => `${prefixCls.value}-dropdown`);
|
|
50
|
-
const selectedItemId = (0, vue.computed)(() => selectedKey.value !== null ? `${popupId.value}-${selectedKey.value}` : null);
|
|
51
|
-
const dropdownAriaLabel = (0, vue.computed)(() => locale.value?.dropdownAriaLabel);
|
|
52
|
-
function onRemoveTab(event, key) {
|
|
53
|
-
event.preventDefault();
|
|
54
|
-
event.stopPropagation();
|
|
55
|
-
editable.value && editable.value.onEdit("remove", {
|
|
56
|
-
key,
|
|
57
|
-
event
|
|
58
|
-
});
|
|
59
|
-
}
|
|
60
|
-
const menuNode = (0, vue.computed)(() => {
|
|
61
|
-
return (0, vue.h)(_v_c_menu.default, {
|
|
62
|
-
"prefixCls": `${dropdownPrefix.value}-menu`,
|
|
63
|
-
"id": popupId.value,
|
|
64
|
-
"tabIndex": -1,
|
|
65
|
-
"role": "listbox",
|
|
66
|
-
"aria-activedescendant": selectedItemId.value,
|
|
67
|
-
"selectedKeys": selectedKey.value ? [selectedKey.value] : void 0,
|
|
68
|
-
"aria-label": dropdownAriaLabel.value !== void 0 ? dropdownAriaLabel.value : "expanded dropdown",
|
|
69
|
-
"onClick": ({ key, domEvent }) => {
|
|
70
|
-
onTabClick.value?.(key, domEvent);
|
|
71
|
-
open.value = false;
|
|
72
|
-
}
|
|
73
|
-
}, { default: () => props.tabs.map((tab) => {
|
|
74
|
-
const { closable, closeIcon, disabled, key, label } = tab;
|
|
75
|
-
const removable = require_utils.getRemovable(closable, closeIcon, editable.value, disabled);
|
|
76
|
-
return (0, vue.h)(MenuItem, {
|
|
77
|
-
"key": key,
|
|
78
|
-
"id": `${popupId.value}-${key}`,
|
|
79
|
-
"role": "option",
|
|
80
|
-
"aria-controls": id.value && `${id.value}-panel-${key}`,
|
|
81
|
-
"disabled": disabled
|
|
82
|
-
}, { default: () => [(0, vue.h)("span", {}, [label]), removable ? (0, vue.h)("button", {
|
|
83
|
-
"type": "button",
|
|
84
|
-
"aria-label": removeAriaLabel.value || "remove",
|
|
85
|
-
"tabindex": 0,
|
|
86
|
-
"class": `${dropdownPrefix.value}-menu-item-remove`,
|
|
87
|
-
"onClick": (e) => {
|
|
88
|
-
e.stopPropagation();
|
|
89
|
-
onRemoveTab(e, key);
|
|
90
|
-
}
|
|
91
|
-
}, [closeIcon || editable.value?.removeIcon || "×"]) : null] });
|
|
92
|
-
}) });
|
|
93
|
-
});
|
|
94
|
-
const overlayClassName = (0, vue.computed)(() => {
|
|
95
|
-
return (0, _v_c_util.clsx)({
|
|
96
|
-
[popupClassName.value]: popupClassName.value,
|
|
97
|
-
[`${dropdownPrefix.value}-rtl`]: rtl.value
|
|
98
|
-
});
|
|
99
|
-
});
|
|
100
|
-
const moreIconNode = (0, vue.computed)(() => moreProps.value?.icon || "More");
|
|
101
|
-
const moreStyle = (0, vue.computed)(() => {
|
|
102
|
-
const style$1 = { marginInlineStart: tabBarGutter.value ? `${tabBarGutter.value}px` : "0px" };
|
|
103
|
-
if (!props.tabs.length) {
|
|
104
|
-
style$1.visibility = "hidden";
|
|
105
|
-
style$1.order = 1;
|
|
106
|
-
}
|
|
107
|
-
return style$1;
|
|
108
|
-
});
|
|
109
|
-
function selectOffset(offset) {
|
|
110
|
-
const enabledTabs = props.tabs.filter((tab) => !tab.disabled);
|
|
111
|
-
let selectedIndex = enabledTabs.findIndex((tab) => tab.key === selectedKey.value) || 0;
|
|
112
|
-
const len = enabledTabs.length;
|
|
113
|
-
for (let i = 0; i < len; i += 1) {
|
|
114
|
-
selectedIndex = (selectedIndex + offset + len) % len;
|
|
115
|
-
const tab = enabledTabs[selectedIndex];
|
|
116
|
-
if (!tab.disabled) {
|
|
117
|
-
selectedKey.value = tab.key;
|
|
118
|
-
return;
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
function onKeyDown(e) {
|
|
123
|
-
const { which } = e;
|
|
124
|
-
if (!open.value) {
|
|
125
|
-
if ([
|
|
126
|
-
_v_c_util_dist_KeyCode.default.DOWN,
|
|
127
|
-
_v_c_util_dist_KeyCode.default.SPACE,
|
|
128
|
-
_v_c_util_dist_KeyCode.default.ENTER
|
|
129
|
-
].includes(which)) {
|
|
130
|
-
open.value = true;
|
|
131
|
-
e.preventDefault();
|
|
132
|
-
}
|
|
133
|
-
return;
|
|
134
|
-
}
|
|
135
|
-
switch (which) {
|
|
136
|
-
case _v_c_util_dist_KeyCode.default.UP:
|
|
137
|
-
selectOffset(-1);
|
|
138
|
-
e.preventDefault();
|
|
139
|
-
break;
|
|
140
|
-
case _v_c_util_dist_KeyCode.default.DOWN:
|
|
141
|
-
selectOffset(1);
|
|
142
|
-
e.preventDefault();
|
|
143
|
-
break;
|
|
144
|
-
case _v_c_util_dist_KeyCode.default.ESC:
|
|
145
|
-
open.value = false;
|
|
146
|
-
break;
|
|
147
|
-
case _v_c_util_dist_KeyCode.default.SPACE:
|
|
148
|
-
case _v_c_util_dist_KeyCode.default.ENTER:
|
|
149
|
-
if (selectedKey.value !== null) onTabClick.value?.(selectedKey.value, e);
|
|
150
|
-
break;
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
(0, vue.watch)(() => open.value, (visible) => {
|
|
154
|
-
if (!visible) selectedKey.value = null;
|
|
155
|
-
});
|
|
156
|
-
(0, vue.watch)([() => selectedItemId.value, () => selectedKey.value], () => {
|
|
157
|
-
if (selectedItemId.value) {
|
|
158
|
-
const ele = document.getElementById(selectedItemId.value);
|
|
159
|
-
if (ele?.scrollIntoView) ele.scrollIntoView(false);
|
|
160
|
-
}
|
|
161
|
-
});
|
|
162
|
-
__expose({ operationNodeRef });
|
|
163
|
-
return (_ctx, _cache) => {
|
|
164
|
-
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
|
|
165
|
-
ref_key: "operationNodeRef",
|
|
166
|
-
ref: operationNodeRef,
|
|
167
|
-
class: (0, vue.normalizeClass)([`${(0, vue.unref)(prefixCls)}-nav-operations`, (0, vue.unref)(className)]),
|
|
168
|
-
style: (0, vue.normalizeStyle)((0, vue.unref)(style))
|
|
169
|
-
}, [!(0, vue.unref)(mobile) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_v_c_dropdown.default), (0, vue.mergeProps)({
|
|
170
|
-
key: 0,
|
|
171
|
-
"prefix-cls": dropdownPrefix.value,
|
|
172
|
-
overlay: menuNode.value,
|
|
173
|
-
visible: __props.tabs.length ? open.value : false,
|
|
174
|
-
"overlay-class-name": overlayClassName.value,
|
|
175
|
-
"overlay-style": (0, vue.unref)(popupStyle),
|
|
176
|
-
"mouse-enter-delay": .1,
|
|
177
|
-
"mouse-leave-delay": .1,
|
|
178
|
-
"get-popup-container": (0, vue.unref)(getPopupContainer)
|
|
179
|
-
}, (0, vue.unref)(moreProps), { onVisibleChange: _cache[0] || (_cache[0] = ($event) => open.value = $event) }), {
|
|
180
|
-
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("button", {
|
|
181
|
-
id: `${(0, vue.unref)(id)}-more`,
|
|
182
|
-
type: "button",
|
|
183
|
-
class: (0, vue.normalizeClass)(`${(0, vue.unref)(prefixCls)}-nav-more`),
|
|
184
|
-
style: (0, vue.normalizeStyle)(moreStyle.value),
|
|
185
|
-
"aria-haspopup": "listbox",
|
|
186
|
-
"aria-controls": popupId.value,
|
|
187
|
-
"aria-expanded": open.value,
|
|
188
|
-
onKeydown: onKeyDown
|
|
189
|
-
}, [(0, vue.createVNode)((0, vue.unref)(_v_c_util_dist_RenderComponent.default), { render: moreIconNode.value }, null, 8, ["render"])], 46, _hoisted_1)]),
|
|
190
|
-
_: 1
|
|
191
|
-
}, 16, [
|
|
192
|
-
"prefix-cls",
|
|
193
|
-
"overlay",
|
|
194
|
-
"visible",
|
|
195
|
-
"overlay-class-name",
|
|
196
|
-
"overlay-style",
|
|
197
|
-
"get-popup-container"
|
|
198
|
-
])) : (0, vue.createCommentVNode)("", true), (0, vue.createVNode)(require_AddButton.default, {
|
|
199
|
-
"prefix-cls": (0, vue.unref)(prefixCls),
|
|
200
|
-
locale: (0, vue.unref)(locale),
|
|
201
|
-
editable: (0, vue.unref)(editable)
|
|
202
|
-
}, null, 8, [
|
|
203
|
-
"prefix-cls",
|
|
204
|
-
"locale",
|
|
205
|
-
"editable"
|
|
206
|
-
])], 6);
|
|
207
|
-
};
|
|
208
|
-
}
|
|
209
|
-
});
|
|
210
|
-
exports.default = OperationNode_vue_vue_type_script_setup_true_lang_default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_TabNode_vue_vue_type_script_setup_true_lang = require("./TabNode.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var TabNode_default = require_TabNode_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = TabNode_default;
|
|
@@ -1,129 +0,0 @@
|
|
|
1
|
-
const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
|
|
2
|
-
const require_utils = require("../utils.cjs");
|
|
3
|
-
let vue = require("vue");
|
|
4
|
-
let _v_c_util_dist_RenderComponent = require("@v-c/util/dist/RenderComponent");
|
|
5
|
-
_v_c_util_dist_RenderComponent = require_rolldown_runtime.__toESM(_v_c_util_dist_RenderComponent);
|
|
6
|
-
let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
|
|
7
|
-
var TabNode_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
8
|
-
name: "TabNode",
|
|
9
|
-
inheritAttrs: false,
|
|
10
|
-
__name: "TabNode",
|
|
11
|
-
props: {
|
|
12
|
-
id: {},
|
|
13
|
-
prefixCls: {},
|
|
14
|
-
tab: {},
|
|
15
|
-
active: { type: Boolean },
|
|
16
|
-
focus: { type: Boolean },
|
|
17
|
-
closable: { type: Boolean },
|
|
18
|
-
editable: {},
|
|
19
|
-
onClick: { type: Function },
|
|
20
|
-
onResize: { type: Function },
|
|
21
|
-
renderWrapper: { type: Function },
|
|
22
|
-
removeAriaLabel: {},
|
|
23
|
-
tabCount: {},
|
|
24
|
-
currentPosition: {},
|
|
25
|
-
removeIcon: { type: [
|
|
26
|
-
Object,
|
|
27
|
-
String,
|
|
28
|
-
Number,
|
|
29
|
-
null,
|
|
30
|
-
Boolean,
|
|
31
|
-
Array
|
|
32
|
-
] },
|
|
33
|
-
onKeyDown: { type: Function },
|
|
34
|
-
onMouseDown: { type: Function },
|
|
35
|
-
onMouseUp: { type: Function },
|
|
36
|
-
onFocus: { type: Function },
|
|
37
|
-
onBlur: { type: Function },
|
|
38
|
-
style: {},
|
|
39
|
-
className: {}
|
|
40
|
-
},
|
|
41
|
-
setup(__props) {
|
|
42
|
-
const props = __props;
|
|
43
|
-
const btnRef = (0, vue.ref)();
|
|
44
|
-
function setBtnRef(el) {
|
|
45
|
-
btnRef.value = el;
|
|
46
|
-
}
|
|
47
|
-
const { prefixCls, tab, closable, active, editable, focus } = (0, vue.toRefs)(props);
|
|
48
|
-
const removable = (0, vue.computed)(() => require_utils.getRemovable(closable.value, tab.value.closeIcon, editable.value, tab.value.disabled));
|
|
49
|
-
const tabPrefix = (0, vue.computed)(() => `${prefixCls.value}-tab`);
|
|
50
|
-
function onInternalClick(e) {
|
|
51
|
-
if (tab.value.disabled) return;
|
|
52
|
-
props.onClick?.(e);
|
|
53
|
-
}
|
|
54
|
-
const cls = (0, vue.computed)(() => [
|
|
55
|
-
tabPrefix.value,
|
|
56
|
-
props.className,
|
|
57
|
-
{
|
|
58
|
-
[`${tabPrefix.value}-with-remove`]: removable.value,
|
|
59
|
-
[`${tabPrefix.value}-active`]: active.value,
|
|
60
|
-
[`${tabPrefix.value}-disabled`]: tab.value.disabled,
|
|
61
|
-
[`${tabPrefix.value}-focus`]: focus.value
|
|
62
|
-
}
|
|
63
|
-
]);
|
|
64
|
-
function onRemove(event) {
|
|
65
|
-
event.preventDefault();
|
|
66
|
-
event.stopPropagation();
|
|
67
|
-
editable.value?.onEdit("remove", {
|
|
68
|
-
key: tab.value.key,
|
|
69
|
-
event
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
(0, vue.onMounted)(() => {
|
|
73
|
-
(0, vue.watch)(() => focus.value, () => {
|
|
74
|
-
if (focus.value && btnRef.value) btnRef.value.focus();
|
|
75
|
-
}, { immediate: true });
|
|
76
|
-
});
|
|
77
|
-
const node = (0, vue.computed)(() => {
|
|
78
|
-
const btnChildren = [];
|
|
79
|
-
if (focus.value) btnChildren.push((0, vue.h)("div", {
|
|
80
|
-
"aria-live": "polite",
|
|
81
|
-
"style": "width: 0; height: 0; position: absolute; overflow: hidden; opacity: 0;"
|
|
82
|
-
}, `Tab ${props.currentPosition} of ${props.tabCount}`));
|
|
83
|
-
if (tab.value.icon) btnChildren.push((0, vue.h)("span", { class: [`${tabPrefix.value}-icon`] }, [(0, vue.h)(_v_c_util_dist_RenderComponent.default, { render: tab.value.icon })]));
|
|
84
|
-
if (tab.value.label) if (typeof tab.value.label === "string" && !(0, _v_c_util_dist_props_util.isEmptyElement)(tab.value.icon)) btnChildren.push((0, vue.h)("span", {}, tab.value.label));
|
|
85
|
-
else btnChildren.push(tab.value.label);
|
|
86
|
-
const children = [(0, vue.h)("div", {
|
|
87
|
-
"id": tab.value.id && `${tab.value.id}-tab-${tab.value.key}`,
|
|
88
|
-
"ref": setBtnRef,
|
|
89
|
-
"role": "tab",
|
|
90
|
-
"aria-selected": active.value,
|
|
91
|
-
"class": [`${tabPrefix.value}-btn`],
|
|
92
|
-
"aria-controls": tab.value.id && `${tab.value.id}-panel-${tab.value.key}`,
|
|
93
|
-
"aria-disabled": tab.value.disabled,
|
|
94
|
-
"tabindex": tab.value.disabled ? void 0 : active.value ? 0 : -1,
|
|
95
|
-
"onClick": (e) => {
|
|
96
|
-
e.stopPropagation();
|
|
97
|
-
onInternalClick(e);
|
|
98
|
-
},
|
|
99
|
-
"onKeydown": props.onKeyDown,
|
|
100
|
-
"onMousedown": props.onMouseDown,
|
|
101
|
-
"onMouseup": props.onMouseUp,
|
|
102
|
-
"onFocus": props.onFocus,
|
|
103
|
-
"onBlur": props.onBlur
|
|
104
|
-
}, btnChildren)];
|
|
105
|
-
if (removable.value) children.push((0, vue.h)("button", {
|
|
106
|
-
"type": "button",
|
|
107
|
-
"aria-label": props.removeAriaLabel || "remove",
|
|
108
|
-
"tabindex": active.value ? 0 : -1,
|
|
109
|
-
"class": [`${tabPrefix.value}-remove`],
|
|
110
|
-
"onClick": (e) => {
|
|
111
|
-
e.stopPropagation();
|
|
112
|
-
onRemove(e);
|
|
113
|
-
}
|
|
114
|
-
}, [(0, vue.h)(_v_c_util_dist_RenderComponent.default, { render: tab.value.closeIcon || editable.value && editable.value.removeIcon || "×" })]));
|
|
115
|
-
return (0, vue.h)("div", {
|
|
116
|
-
"key": tab.value.key,
|
|
117
|
-
"data-node-key": require_utils.genDataNodeKey(tab.value.key),
|
|
118
|
-
"class": cls.value,
|
|
119
|
-
"style": props.style,
|
|
120
|
-
"onClick": onInternalClick
|
|
121
|
-
}, children);
|
|
122
|
-
});
|
|
123
|
-
const finalNode = (0, vue.computed)(() => props.renderWrapper ? props.renderWrapper(node.value) : node.value);
|
|
124
|
-
return (_ctx, _cache) => {
|
|
125
|
-
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_v_c_util_dist_RenderComponent.default), { render: finalNode.value }, null, 8, ["render"]);
|
|
126
|
-
};
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
exports.default = TabNode_vue_vue_type_script_setup_true_lang_default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_Wrapper_vue_vue_type_script_setup_true_lang = require("./Wrapper.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var Wrapper_default = require_Wrapper_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = Wrapper_default;
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
|
|
2
|
-
const require_index = require("./index.cjs");
|
|
3
|
-
let vue = require("vue");
|
|
4
|
-
let _v_c_util_dist_RenderComponent = require("@v-c/util/dist/RenderComponent");
|
|
5
|
-
_v_c_util_dist_RenderComponent = require_rolldown_runtime.__toESM(_v_c_util_dist_RenderComponent);
|
|
6
|
-
var Wrapper_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
7
|
-
name: "TabNavListWrapper",
|
|
8
|
-
inheritAttrs: false,
|
|
9
|
-
__name: "Wrapper",
|
|
10
|
-
props: {
|
|
11
|
-
id: {},
|
|
12
|
-
tabPosition: {},
|
|
13
|
-
activeKey: {},
|
|
14
|
-
rtl: { type: Boolean },
|
|
15
|
-
animated: {},
|
|
16
|
-
extra: { type: [
|
|
17
|
-
Object,
|
|
18
|
-
String,
|
|
19
|
-
Number,
|
|
20
|
-
null,
|
|
21
|
-
Boolean,
|
|
22
|
-
Array
|
|
23
|
-
] },
|
|
24
|
-
editable: {},
|
|
25
|
-
more: {},
|
|
26
|
-
mobile: { type: Boolean },
|
|
27
|
-
tabBarGutter: {},
|
|
28
|
-
renderTabBar: { type: Function },
|
|
29
|
-
style: {},
|
|
30
|
-
locale: {},
|
|
31
|
-
onTabClick: { type: Function },
|
|
32
|
-
onTabScroll: { type: Function },
|
|
33
|
-
getPopupContainer: { type: Function },
|
|
34
|
-
popupClassName: {},
|
|
35
|
-
indicator: {},
|
|
36
|
-
classNames: {},
|
|
37
|
-
styles: {},
|
|
38
|
-
className: {},
|
|
39
|
-
children: { type: Function }
|
|
40
|
-
},
|
|
41
|
-
setup(__props) {
|
|
42
|
-
const props = __props;
|
|
43
|
-
const renderNode = (0, vue.computed)(() => {
|
|
44
|
-
const restProps = { ...props };
|
|
45
|
-
delete restProps.renderTabBar;
|
|
46
|
-
if (props.renderTabBar) return props.renderTabBar(restProps, require_index.default);
|
|
47
|
-
return (0, vue.h)(require_index.default, restProps);
|
|
48
|
-
});
|
|
49
|
-
return (_ctx, _cache) => {
|
|
50
|
-
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_v_c_util_dist_RenderComponent.default), { render: renderNode.value }, null, 8, ["render"]);
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
});
|
|
54
|
-
exports.default = Wrapper_vue_vue_type_script_setup_true_lang_default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Object.defineProperties(exports, {
|
|
2
|
-
__esModule: { value: true },
|
|
3
|
-
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
-
});
|
|
5
|
-
const require_index_vue_vue_type_script_setup_true_lang = require("./index.vue_vue_type_script_setup_true_lang.cjs");
|
|
6
|
-
var TabNavList_default = require_index_vue_vue_type_script_setup_true_lang.default;
|
|
7
|
-
exports.default = TabNavList_default;
|