@element-plus/nightly 0.0.20241123 → 0.0.20241124
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.full.js +18 -8
- package/dist/index.full.min.js +6 -6
- package/dist/index.full.min.js.map +1 -1
- package/dist/index.full.min.mjs +8 -8
- package/dist/index.full.min.mjs.map +1 -1
- package/dist/index.full.mjs +18 -8
- package/dist/locale/af.js +1 -1
- package/dist/locale/af.min.js +1 -1
- package/dist/locale/af.min.mjs +1 -1
- package/dist/locale/af.mjs +1 -1
- package/dist/locale/ar-eg.js +1 -1
- package/dist/locale/ar-eg.min.js +1 -1
- package/dist/locale/ar-eg.min.mjs +1 -1
- package/dist/locale/ar-eg.mjs +1 -1
- package/dist/locale/ar.js +1 -1
- package/dist/locale/ar.min.js +1 -1
- package/dist/locale/ar.min.mjs +1 -1
- package/dist/locale/ar.mjs +1 -1
- package/dist/locale/az.js +1 -1
- package/dist/locale/az.min.js +1 -1
- package/dist/locale/az.min.mjs +1 -1
- package/dist/locale/az.mjs +1 -1
- package/dist/locale/bg.js +1 -1
- package/dist/locale/bg.min.js +1 -1
- package/dist/locale/bg.min.mjs +1 -1
- package/dist/locale/bg.mjs +1 -1
- package/dist/locale/bn.js +1 -1
- package/dist/locale/bn.min.js +1 -1
- package/dist/locale/bn.min.mjs +1 -1
- package/dist/locale/bn.mjs +1 -1
- package/dist/locale/ca.js +1 -1
- package/dist/locale/ca.min.js +1 -1
- package/dist/locale/ca.min.mjs +1 -1
- package/dist/locale/ca.mjs +1 -1
- package/dist/locale/ckb.js +1 -1
- package/dist/locale/ckb.min.js +1 -1
- package/dist/locale/ckb.min.mjs +1 -1
- package/dist/locale/ckb.mjs +1 -1
- package/dist/locale/cs.js +1 -1
- package/dist/locale/cs.min.js +1 -1
- package/dist/locale/cs.min.mjs +1 -1
- package/dist/locale/cs.mjs +1 -1
- package/dist/locale/da.js +1 -1
- package/dist/locale/da.min.js +1 -1
- package/dist/locale/da.min.mjs +1 -1
- package/dist/locale/da.mjs +1 -1
- package/dist/locale/de.js +1 -1
- package/dist/locale/de.min.js +1 -1
- package/dist/locale/de.min.mjs +1 -1
- package/dist/locale/de.mjs +1 -1
- package/dist/locale/el.js +1 -1
- package/dist/locale/el.min.js +1 -1
- package/dist/locale/el.min.mjs +1 -1
- package/dist/locale/el.mjs +1 -1
- package/dist/locale/en.js +1 -1
- package/dist/locale/en.min.js +1 -1
- package/dist/locale/en.min.mjs +1 -1
- package/dist/locale/en.mjs +1 -1
- package/dist/locale/eo.js +1 -1
- package/dist/locale/eo.min.js +1 -1
- package/dist/locale/eo.min.mjs +1 -1
- package/dist/locale/eo.mjs +1 -1
- package/dist/locale/es.js +1 -1
- package/dist/locale/es.min.js +1 -1
- package/dist/locale/es.min.mjs +1 -1
- package/dist/locale/es.mjs +1 -1
- package/dist/locale/et.js +1 -1
- package/dist/locale/et.min.js +1 -1
- package/dist/locale/et.min.mjs +1 -1
- package/dist/locale/et.mjs +1 -1
- package/dist/locale/eu.js +1 -1
- package/dist/locale/eu.min.js +1 -1
- package/dist/locale/eu.min.mjs +1 -1
- package/dist/locale/eu.mjs +1 -1
- package/dist/locale/fa.js +1 -1
- package/dist/locale/fa.min.js +1 -1
- package/dist/locale/fa.min.mjs +1 -1
- package/dist/locale/fa.mjs +1 -1
- package/dist/locale/fi.js +1 -1
- package/dist/locale/fi.min.js +1 -1
- package/dist/locale/fi.min.mjs +1 -1
- package/dist/locale/fi.mjs +1 -1
- package/dist/locale/fr.js +1 -1
- package/dist/locale/fr.min.js +1 -1
- package/dist/locale/fr.min.mjs +1 -1
- package/dist/locale/fr.mjs +1 -1
- package/dist/locale/he.js +1 -1
- package/dist/locale/he.min.js +1 -1
- package/dist/locale/he.min.mjs +1 -1
- package/dist/locale/he.mjs +1 -1
- package/dist/locale/hr.js +1 -1
- package/dist/locale/hr.min.js +1 -1
- package/dist/locale/hr.min.mjs +1 -1
- package/dist/locale/hr.mjs +1 -1
- package/dist/locale/hu.js +1 -1
- package/dist/locale/hu.min.js +1 -1
- package/dist/locale/hu.min.mjs +1 -1
- package/dist/locale/hu.mjs +1 -1
- package/dist/locale/hy-am.js +1 -1
- package/dist/locale/hy-am.min.js +1 -1
- package/dist/locale/hy-am.min.mjs +1 -1
- package/dist/locale/hy-am.mjs +1 -1
- package/dist/locale/id.js +1 -1
- package/dist/locale/id.min.js +1 -1
- package/dist/locale/id.min.mjs +1 -1
- package/dist/locale/id.mjs +1 -1
- package/dist/locale/it.js +1 -1
- package/dist/locale/it.min.js +1 -1
- package/dist/locale/it.min.mjs +1 -1
- package/dist/locale/it.mjs +1 -1
- package/dist/locale/ja.js +1 -1
- package/dist/locale/ja.min.js +1 -1
- package/dist/locale/ja.min.mjs +1 -1
- package/dist/locale/ja.mjs +1 -1
- package/dist/locale/kk.js +1 -1
- package/dist/locale/kk.min.js +1 -1
- package/dist/locale/kk.min.mjs +1 -1
- package/dist/locale/kk.mjs +1 -1
- package/dist/locale/km.js +1 -1
- package/dist/locale/km.min.js +1 -1
- package/dist/locale/km.min.mjs +1 -1
- package/dist/locale/km.mjs +1 -1
- package/dist/locale/ko.js +1 -1
- package/dist/locale/ko.min.js +1 -1
- package/dist/locale/ko.min.mjs +1 -1
- package/dist/locale/ko.mjs +1 -1
- package/dist/locale/ku.js +1 -1
- package/dist/locale/ku.min.js +1 -1
- package/dist/locale/ku.min.mjs +1 -1
- package/dist/locale/ku.mjs +1 -1
- package/dist/locale/ky.js +1 -1
- package/dist/locale/ky.min.js +1 -1
- package/dist/locale/ky.min.mjs +1 -1
- package/dist/locale/ky.mjs +1 -1
- package/dist/locale/lt.js +1 -1
- package/dist/locale/lt.min.js +1 -1
- package/dist/locale/lt.min.mjs +1 -1
- package/dist/locale/lt.mjs +1 -1
- package/dist/locale/lv.js +1 -1
- package/dist/locale/lv.min.js +1 -1
- package/dist/locale/lv.min.mjs +1 -1
- package/dist/locale/lv.mjs +1 -1
- package/dist/locale/mg.js +1 -1
- package/dist/locale/mg.min.js +1 -1
- package/dist/locale/mg.min.mjs +1 -1
- package/dist/locale/mg.mjs +1 -1
- package/dist/locale/mn.js +1 -1
- package/dist/locale/mn.min.js +1 -1
- package/dist/locale/mn.min.mjs +1 -1
- package/dist/locale/mn.mjs +1 -1
- package/dist/locale/ms.js +1 -1
- package/dist/locale/ms.min.js +1 -1
- package/dist/locale/ms.min.mjs +1 -1
- package/dist/locale/ms.mjs +1 -1
- package/dist/locale/my.js +1 -1
- package/dist/locale/my.min.js +1 -1
- package/dist/locale/my.min.mjs +1 -1
- package/dist/locale/my.mjs +1 -1
- package/dist/locale/nb-no.js +1 -1
- package/dist/locale/nb-no.min.js +1 -1
- package/dist/locale/nb-no.min.mjs +1 -1
- package/dist/locale/nb-no.mjs +1 -1
- package/dist/locale/nl.js +1 -1
- package/dist/locale/nl.min.js +1 -1
- package/dist/locale/nl.min.mjs +1 -1
- package/dist/locale/nl.mjs +1 -1
- package/dist/locale/pa.js +1 -1
- package/dist/locale/pa.min.js +1 -1
- package/dist/locale/pa.min.mjs +1 -1
- package/dist/locale/pa.mjs +1 -1
- package/dist/locale/pl.js +1 -1
- package/dist/locale/pl.min.js +1 -1
- package/dist/locale/pl.min.mjs +1 -1
- package/dist/locale/pl.mjs +1 -1
- package/dist/locale/pt-br.js +1 -1
- package/dist/locale/pt-br.min.js +1 -1
- package/dist/locale/pt-br.min.mjs +1 -1
- package/dist/locale/pt-br.mjs +1 -1
- package/dist/locale/pt.js +1 -1
- package/dist/locale/pt.min.js +1 -1
- package/dist/locale/pt.min.mjs +1 -1
- package/dist/locale/pt.mjs +1 -1
- package/dist/locale/ro.js +1 -1
- package/dist/locale/ro.min.js +1 -1
- package/dist/locale/ro.min.mjs +1 -1
- package/dist/locale/ro.mjs +1 -1
- package/dist/locale/ru.js +1 -1
- package/dist/locale/ru.min.js +1 -1
- package/dist/locale/ru.min.mjs +1 -1
- package/dist/locale/ru.mjs +1 -1
- package/dist/locale/sk.js +1 -1
- package/dist/locale/sk.min.js +1 -1
- package/dist/locale/sk.min.mjs +1 -1
- package/dist/locale/sk.mjs +1 -1
- package/dist/locale/sl.js +1 -1
- package/dist/locale/sl.min.js +1 -1
- package/dist/locale/sl.min.mjs +1 -1
- package/dist/locale/sl.mjs +1 -1
- package/dist/locale/sr.js +1 -1
- package/dist/locale/sr.min.js +1 -1
- package/dist/locale/sr.min.mjs +1 -1
- package/dist/locale/sr.mjs +1 -1
- package/dist/locale/sv.js +1 -1
- package/dist/locale/sv.min.js +1 -1
- package/dist/locale/sv.min.mjs +1 -1
- package/dist/locale/sv.mjs +1 -1
- package/dist/locale/sw.js +1 -1
- package/dist/locale/sw.min.js +1 -1
- package/dist/locale/sw.min.mjs +1 -1
- package/dist/locale/sw.mjs +1 -1
- package/dist/locale/ta.js +1 -1
- package/dist/locale/ta.min.js +1 -1
- package/dist/locale/ta.min.mjs +1 -1
- package/dist/locale/ta.mjs +1 -1
- package/dist/locale/th.js +1 -1
- package/dist/locale/th.min.js +1 -1
- package/dist/locale/th.min.mjs +1 -1
- package/dist/locale/th.mjs +1 -1
- package/dist/locale/tk.js +1 -1
- package/dist/locale/tk.min.js +1 -1
- package/dist/locale/tk.min.mjs +1 -1
- package/dist/locale/tk.mjs +1 -1
- package/dist/locale/tr.js +1 -1
- package/dist/locale/tr.min.js +1 -1
- package/dist/locale/tr.min.mjs +1 -1
- package/dist/locale/tr.mjs +1 -1
- package/dist/locale/ug-cn.js +1 -1
- package/dist/locale/ug-cn.min.js +1 -1
- package/dist/locale/ug-cn.min.mjs +1 -1
- package/dist/locale/ug-cn.mjs +1 -1
- package/dist/locale/uk.js +1 -1
- package/dist/locale/uk.min.js +1 -1
- package/dist/locale/uk.min.mjs +1 -1
- package/dist/locale/uk.mjs +1 -1
- package/dist/locale/uz-uz.js +1 -1
- package/dist/locale/uz-uz.min.js +1 -1
- package/dist/locale/uz-uz.min.mjs +1 -1
- package/dist/locale/uz-uz.mjs +1 -1
- package/dist/locale/vi.js +1 -1
- package/dist/locale/vi.min.js +1 -1
- package/dist/locale/vi.min.mjs +1 -1
- package/dist/locale/vi.mjs +1 -1
- package/dist/locale/zh-cn.js +1 -1
- package/dist/locale/zh-cn.min.js +1 -1
- package/dist/locale/zh-cn.min.mjs +1 -1
- package/dist/locale/zh-cn.mjs +1 -1
- package/dist/locale/zh-tw.js +1 -1
- package/dist/locale/zh-tw.min.js +1 -1
- package/dist/locale/zh-tw.min.mjs +1 -1
- package/dist/locale/zh-tw.mjs +1 -1
- package/es/components/autocomplete/src/autocomplete.vue.d.ts +2 -2
- package/es/components/card/index.mjs +2 -2
- package/es/components/card/src/card.mjs +43 -21
- package/es/components/card/src/card.mjs.map +1 -1
- package/es/components/card/src/card2.mjs +21 -43
- package/es/components/card/src/card2.mjs.map +1 -1
- package/es/components/index.mjs +4 -4
- package/es/components/input/src/input.vue.d.ts +1 -1
- package/es/components/input/src/input2.mjs +4 -4
- package/es/components/input/src/input2.mjs.map +1 -1
- package/es/components/mention/src/mention-dropdown.mjs +167 -15
- package/es/components/mention/src/mention-dropdown.mjs.map +1 -1
- package/es/components/mention/src/mention-dropdown2.mjs +15 -167
- package/es/components/mention/src/mention-dropdown2.mjs.map +1 -1
- package/es/components/mention/src/mention.vue.d.ts +2 -2
- package/es/components/mention/src/mention2.mjs +1 -1
- package/es/components/menu/index.mjs +2 -2
- package/es/components/menu/src/menu-item.mjs +97 -14
- package/es/components/menu/src/menu-item.mjs.map +1 -1
- package/es/components/menu/src/menu-item2.mjs +14 -97
- package/es/components/menu/src/menu-item2.mjs.map +1 -1
- package/es/components/scrollbar/index.mjs +2 -2
- package/es/components/scrollbar/src/scrollbar.mjs +55 -171
- package/es/components/scrollbar/src/scrollbar.mjs.map +1 -1
- package/es/components/scrollbar/src/scrollbar2.mjs +171 -55
- package/es/components/scrollbar/src/scrollbar2.mjs.map +1 -1
- package/es/components/segmented/index.mjs +2 -2
- package/es/components/segmented/src/segmented.mjs +169 -34
- package/es/components/segmented/src/segmented.mjs.map +1 -1
- package/es/components/segmented/src/segmented2.mjs +34 -169
- package/es/components/segmented/src/segmented2.mjs.map +1 -1
- package/es/components/teleport/index.mjs +2 -2
- package/es/components/teleport/src/teleport.mjs +9 -18
- package/es/components/teleport/src/teleport.mjs.map +1 -1
- package/es/components/teleport/src/teleport2.mjs +18 -9
- package/es/components/teleport/src/teleport2.mjs.map +1 -1
- package/es/components/transfer/src/transfer-panel.vue.d.ts +1 -0
- package/es/components/transfer/src/transfer-panel2.mjs +6 -2
- package/es/components/transfer/src/transfer-panel2.mjs.map +1 -1
- package/es/components/transfer/src/transfer.vue.d.ts +4 -0
- package/es/components/transfer/src/transfer2.mjs +6 -0
- package/es/components/transfer/src/transfer2.mjs.map +1 -1
- package/es/index.mjs +4 -4
- package/es/version.d.ts +1 -1
- package/es/version.mjs +1 -1
- package/es/version.mjs.map +1 -1
- package/lib/components/autocomplete/src/autocomplete.vue.d.ts +2 -2
- package/lib/components/card/index.js +2 -2
- package/lib/components/card/src/card.js +43 -21
- package/lib/components/card/src/card.js.map +1 -1
- package/lib/components/card/src/card2.js +21 -43
- package/lib/components/card/src/card2.js.map +1 -1
- package/lib/components/index.js +4 -4
- package/lib/components/input/src/input.vue.d.ts +1 -1
- package/lib/components/input/src/input2.js +4 -4
- package/lib/components/input/src/input2.js.map +1 -1
- package/lib/components/mention/src/mention-dropdown.js +167 -16
- package/lib/components/mention/src/mention-dropdown.js.map +1 -1
- package/lib/components/mention/src/mention-dropdown2.js +16 -167
- package/lib/components/mention/src/mention-dropdown2.js.map +1 -1
- package/lib/components/mention/src/mention.vue.d.ts +2 -2
- package/lib/components/mention/src/mention2.js +1 -1
- package/lib/components/menu/index.js +2 -2
- package/lib/components/menu/src/menu-item.js +97 -15
- package/lib/components/menu/src/menu-item.js.map +1 -1
- package/lib/components/menu/src/menu-item2.js +15 -97
- package/lib/components/menu/src/menu-item2.js.map +1 -1
- package/lib/components/scrollbar/index.js +2 -2
- package/lib/components/scrollbar/src/scrollbar.js +56 -171
- package/lib/components/scrollbar/src/scrollbar.js.map +1 -1
- package/lib/components/scrollbar/src/scrollbar2.js +171 -56
- package/lib/components/scrollbar/src/scrollbar2.js.map +1 -1
- package/lib/components/segmented/index.js +2 -2
- package/lib/components/segmented/src/segmented.js +168 -34
- package/lib/components/segmented/src/segmented.js.map +1 -1
- package/lib/components/segmented/src/segmented2.js +34 -168
- package/lib/components/segmented/src/segmented2.js.map +1 -1
- package/lib/components/teleport/index.js +2 -2
- package/lib/components/teleport/src/teleport.js +9 -18
- package/lib/components/teleport/src/teleport.js.map +1 -1
- package/lib/components/teleport/src/teleport2.js +18 -9
- package/lib/components/teleport/src/teleport2.js.map +1 -1
- package/lib/components/transfer/src/transfer-panel.vue.d.ts +1 -0
- package/lib/components/transfer/src/transfer-panel2.js +6 -2
- package/lib/components/transfer/src/transfer-panel2.js.map +1 -1
- package/lib/components/transfer/src/transfer.vue.d.ts +4 -0
- package/lib/components/transfer/src/transfer2.js +6 -0
- package/lib/components/transfer/src/transfer2.js.map +1 -1
- package/lib/index.js +4 -4
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/package.json +2 -2
- package/web-types.json +1 -1
@@ -1,62 +1,178 @@
|
|
1
|
+
import { defineComponent, ref, computed, watch, nextTick, provide, reactive, onActivated, onMounted, onUpdated, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle, createBlock, resolveDynamicComponent, withCtx, renderSlot, createCommentVNode } from 'vue';
|
2
|
+
import { useResizeObserver, useEventListener } from '@vueuse/core';
|
1
3
|
import '../../../utils/index.mjs';
|
2
4
|
import '../../../hooks/index.mjs';
|
3
|
-
import
|
4
|
-
import {
|
5
|
+
import Bar from './bar2.mjs';
|
6
|
+
import { scrollbarContextKey } from './constants.mjs';
|
7
|
+
import { scrollbarProps, scrollbarEmits } from './scrollbar.mjs';
|
8
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
9
|
+
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
|
10
|
+
import { addUnit } from '../../../utils/dom/style.mjs';
|
11
|
+
import { isObject } from '@vue/shared';
|
5
12
|
import { isNumber } from '../../../utils/types.mjs';
|
13
|
+
import { debugWarn } from '../../../utils/error.mjs';
|
6
14
|
|
7
|
-
const
|
8
|
-
|
9
|
-
|
10
|
-
default: ""
|
11
|
-
},
|
12
|
-
maxHeight: {
|
13
|
-
type: [String, Number],
|
14
|
-
default: ""
|
15
|
-
},
|
16
|
-
native: {
|
17
|
-
type: Boolean,
|
18
|
-
default: false
|
19
|
-
},
|
20
|
-
wrapStyle: {
|
21
|
-
type: definePropType([String, Object, Array]),
|
22
|
-
default: ""
|
23
|
-
},
|
24
|
-
wrapClass: {
|
25
|
-
type: [String, Array],
|
26
|
-
default: ""
|
27
|
-
},
|
28
|
-
viewClass: {
|
29
|
-
type: [String, Array],
|
30
|
-
default: ""
|
31
|
-
},
|
32
|
-
viewStyle: {
|
33
|
-
type: [String, Array, Object],
|
34
|
-
default: ""
|
35
|
-
},
|
36
|
-
noresize: Boolean,
|
37
|
-
tag: {
|
38
|
-
type: String,
|
39
|
-
default: "div"
|
40
|
-
},
|
41
|
-
always: Boolean,
|
42
|
-
minSize: {
|
43
|
-
type: Number,
|
44
|
-
default: 20
|
45
|
-
},
|
46
|
-
tabindex: {
|
47
|
-
type: [String, Number],
|
48
|
-
default: void 0
|
49
|
-
},
|
50
|
-
id: String,
|
51
|
-
role: String,
|
52
|
-
...useAriaProps(["ariaLabel", "ariaOrientation"])
|
15
|
+
const COMPONENT_NAME = "ElScrollbar";
|
16
|
+
const __default__ = defineComponent({
|
17
|
+
name: COMPONENT_NAME
|
53
18
|
});
|
54
|
-
const
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
19
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
20
|
+
...__default__,
|
21
|
+
props: scrollbarProps,
|
22
|
+
emits: scrollbarEmits,
|
23
|
+
setup(__props, { expose, emit }) {
|
24
|
+
const props = __props;
|
25
|
+
const ns = useNamespace("scrollbar");
|
26
|
+
let stopResizeObserver = void 0;
|
27
|
+
let stopResizeListener = void 0;
|
28
|
+
let wrapScrollTop = 0;
|
29
|
+
let wrapScrollLeft = 0;
|
30
|
+
const scrollbarRef = ref();
|
31
|
+
const wrapRef = ref();
|
32
|
+
const resizeRef = ref();
|
33
|
+
const barRef = ref();
|
34
|
+
const wrapStyle = computed(() => {
|
35
|
+
const style = {};
|
36
|
+
if (props.height)
|
37
|
+
style.height = addUnit(props.height);
|
38
|
+
if (props.maxHeight)
|
39
|
+
style.maxHeight = addUnit(props.maxHeight);
|
40
|
+
return [props.wrapStyle, style];
|
41
|
+
});
|
42
|
+
const wrapKls = computed(() => {
|
43
|
+
return [
|
44
|
+
props.wrapClass,
|
45
|
+
ns.e("wrap"),
|
46
|
+
{ [ns.em("wrap", "hidden-default")]: !props.native }
|
47
|
+
];
|
48
|
+
});
|
49
|
+
const resizeKls = computed(() => {
|
50
|
+
return [ns.e("view"), props.viewClass];
|
51
|
+
});
|
52
|
+
const handleScroll = () => {
|
53
|
+
var _a;
|
54
|
+
if (wrapRef.value) {
|
55
|
+
(_a = barRef.value) == null ? void 0 : _a.handleScroll(wrapRef.value);
|
56
|
+
wrapScrollTop = wrapRef.value.scrollTop;
|
57
|
+
wrapScrollLeft = wrapRef.value.scrollLeft;
|
58
|
+
emit("scroll", {
|
59
|
+
scrollTop: wrapRef.value.scrollTop,
|
60
|
+
scrollLeft: wrapRef.value.scrollLeft
|
61
|
+
});
|
62
|
+
}
|
63
|
+
};
|
64
|
+
function scrollTo(arg1, arg2) {
|
65
|
+
if (isObject(arg1)) {
|
66
|
+
wrapRef.value.scrollTo(arg1);
|
67
|
+
} else if (isNumber(arg1) && isNumber(arg2)) {
|
68
|
+
wrapRef.value.scrollTo(arg1, arg2);
|
69
|
+
}
|
70
|
+
}
|
71
|
+
const setScrollTop = (value) => {
|
72
|
+
if (!isNumber(value)) {
|
73
|
+
debugWarn(COMPONENT_NAME, "value must be a number");
|
74
|
+
return;
|
75
|
+
}
|
76
|
+
wrapRef.value.scrollTop = value;
|
77
|
+
};
|
78
|
+
const setScrollLeft = (value) => {
|
79
|
+
if (!isNumber(value)) {
|
80
|
+
debugWarn(COMPONENT_NAME, "value must be a number");
|
81
|
+
return;
|
82
|
+
}
|
83
|
+
wrapRef.value.scrollLeft = value;
|
84
|
+
};
|
85
|
+
const update = () => {
|
86
|
+
var _a;
|
87
|
+
(_a = barRef.value) == null ? void 0 : _a.update();
|
88
|
+
};
|
89
|
+
watch(() => props.noresize, (noresize) => {
|
90
|
+
if (noresize) {
|
91
|
+
stopResizeObserver == null ? void 0 : stopResizeObserver();
|
92
|
+
stopResizeListener == null ? void 0 : stopResizeListener();
|
93
|
+
} else {
|
94
|
+
;
|
95
|
+
({ stop: stopResizeObserver } = useResizeObserver(resizeRef, update));
|
96
|
+
stopResizeListener = useEventListener("resize", update);
|
97
|
+
}
|
98
|
+
}, { immediate: true });
|
99
|
+
watch(() => [props.maxHeight, props.height], () => {
|
100
|
+
if (!props.native)
|
101
|
+
nextTick(() => {
|
102
|
+
var _a;
|
103
|
+
update();
|
104
|
+
if (wrapRef.value) {
|
105
|
+
(_a = barRef.value) == null ? void 0 : _a.handleScroll(wrapRef.value);
|
106
|
+
}
|
107
|
+
});
|
108
|
+
});
|
109
|
+
provide(scrollbarContextKey, reactive({
|
110
|
+
scrollbarElement: scrollbarRef,
|
111
|
+
wrapElement: wrapRef
|
112
|
+
}));
|
113
|
+
onActivated(() => {
|
114
|
+
if (wrapRef.value) {
|
115
|
+
wrapRef.value.scrollTop = wrapScrollTop;
|
116
|
+
wrapRef.value.scrollLeft = wrapScrollLeft;
|
117
|
+
}
|
118
|
+
});
|
119
|
+
onMounted(() => {
|
120
|
+
if (!props.native)
|
121
|
+
nextTick(() => {
|
122
|
+
update();
|
123
|
+
});
|
124
|
+
});
|
125
|
+
onUpdated(() => update());
|
126
|
+
expose({
|
127
|
+
wrapRef,
|
128
|
+
update,
|
129
|
+
scrollTo,
|
130
|
+
setScrollTop,
|
131
|
+
setScrollLeft,
|
132
|
+
handleScroll
|
133
|
+
});
|
134
|
+
return (_ctx, _cache) => {
|
135
|
+
return openBlock(), createElementBlock("div", {
|
136
|
+
ref_key: "scrollbarRef",
|
137
|
+
ref: scrollbarRef,
|
138
|
+
class: normalizeClass(unref(ns).b())
|
139
|
+
}, [
|
140
|
+
createElementVNode("div", {
|
141
|
+
ref_key: "wrapRef",
|
142
|
+
ref: wrapRef,
|
143
|
+
class: normalizeClass(unref(wrapKls)),
|
144
|
+
style: normalizeStyle(unref(wrapStyle)),
|
145
|
+
tabindex: _ctx.tabindex,
|
146
|
+
onScroll: handleScroll
|
147
|
+
}, [
|
148
|
+
(openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
|
149
|
+
id: _ctx.id,
|
150
|
+
ref_key: "resizeRef",
|
151
|
+
ref: resizeRef,
|
152
|
+
class: normalizeClass(unref(resizeKls)),
|
153
|
+
style: normalizeStyle(_ctx.viewStyle),
|
154
|
+
role: _ctx.role,
|
155
|
+
"aria-label": _ctx.ariaLabel,
|
156
|
+
"aria-orientation": _ctx.ariaOrientation
|
157
|
+
}, {
|
158
|
+
default: withCtx(() => [
|
159
|
+
renderSlot(_ctx.$slots, "default")
|
160
|
+
]),
|
161
|
+
_: 3
|
162
|
+
}, 8, ["id", "class", "style", "role", "aria-label", "aria-orientation"]))
|
163
|
+
], 46, ["tabindex"]),
|
164
|
+
!_ctx.native ? (openBlock(), createBlock(Bar, {
|
165
|
+
key: 0,
|
166
|
+
ref_key: "barRef",
|
167
|
+
ref: barRef,
|
168
|
+
always: _ctx.always,
|
169
|
+
"min-size": _ctx.minSize
|
170
|
+
}, null, 8, ["always", "min-size"])) : createCommentVNode("v-if", true)
|
171
|
+
], 2);
|
172
|
+
};
|
173
|
+
}
|
174
|
+
});
|
175
|
+
var Scrollbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scrollbar.vue"]]);
|
60
176
|
|
61
|
-
export {
|
177
|
+
export { Scrollbar as default };
|
62
178
|
//# sourceMappingURL=scrollbar2.mjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"scrollbar2.mjs","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.
|
1
|
+
{"version":3,"file":"scrollbar2.mjs","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.vue"],"sourcesContent":["<template>\n <div ref=\"scrollbarRef\" :class=\"ns.b()\">\n <div\n ref=\"wrapRef\"\n :class=\"wrapKls\"\n :style=\"wrapStyle\"\n :tabindex=\"tabindex\"\n @scroll=\"handleScroll\"\n >\n <component\n :is=\"tag\"\n :id=\"id\"\n ref=\"resizeRef\"\n :class=\"resizeKls\"\n :style=\"viewStyle\"\n :role=\"role\"\n :aria-label=\"ariaLabel\"\n :aria-orientation=\"ariaOrientation\"\n >\n <slot />\n </component>\n </div>\n <template v-if=\"!native\">\n <bar ref=\"barRef\" :always=\"always\" :min-size=\"minSize\" />\n </template>\n </div>\n</template>\n<script lang=\"ts\" setup>\nimport {\n computed,\n nextTick,\n onActivated,\n onMounted,\n onUpdated,\n provide,\n reactive,\n ref,\n watch,\n} from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { addUnit, debugWarn, isNumber, isObject } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport Bar from './bar.vue'\nimport { scrollbarContextKey } from './constants'\nimport { scrollbarEmits, scrollbarProps } from './scrollbar'\nimport type { BarInstance } from './bar'\nimport type { CSSProperties, StyleValue } from 'vue'\n\nconst COMPONENT_NAME = 'ElScrollbar'\n\ndefineOptions({\n name: COMPONENT_NAME,\n})\n\nconst props = defineProps(scrollbarProps)\nconst emit = defineEmits(scrollbarEmits)\n\nconst ns = useNamespace('scrollbar')\n\nlet stopResizeObserver: (() => void) | undefined = undefined\nlet stopResizeListener: (() => void) | undefined = undefined\nlet wrapScrollTop = 0\nlet wrapScrollLeft = 0\n\nconst scrollbarRef = ref<HTMLDivElement>()\nconst wrapRef = ref<HTMLDivElement>()\nconst resizeRef = ref<HTMLElement>()\nconst barRef = ref<BarInstance>()\n\nconst wrapStyle = computed<StyleValue>(() => {\n const style: CSSProperties = {}\n if (props.height) style.height = addUnit(props.height)\n if (props.maxHeight) style.maxHeight = addUnit(props.maxHeight)\n return [props.wrapStyle, style]\n})\n\nconst wrapKls = computed(() => {\n return [\n props.wrapClass,\n ns.e('wrap'),\n { [ns.em('wrap', 'hidden-default')]: !props.native },\n ]\n})\n\nconst resizeKls = computed(() => {\n return [ns.e('view'), props.viewClass]\n})\n\nconst handleScroll = () => {\n if (wrapRef.value) {\n barRef.value?.handleScroll(wrapRef.value)\n wrapScrollTop = wrapRef.value.scrollTop\n wrapScrollLeft = wrapRef.value.scrollLeft\n\n emit('scroll', {\n scrollTop: wrapRef.value.scrollTop,\n scrollLeft: wrapRef.value.scrollLeft,\n })\n }\n}\n\n// TODO: refactor method overrides, due to script setup dts\n// @ts-nocheck\nfunction scrollTo(xCord: number, yCord?: number): void\nfunction scrollTo(options: ScrollToOptions): void\nfunction scrollTo(arg1: unknown, arg2?: number) {\n if (isObject(arg1)) {\n wrapRef.value!.scrollTo(arg1)\n } else if (isNumber(arg1) && isNumber(arg2)) {\n wrapRef.value!.scrollTo(arg1, arg2)\n }\n}\n\nconst setScrollTop = (value: number) => {\n if (!isNumber(value)) {\n debugWarn(COMPONENT_NAME, 'value must be a number')\n return\n }\n wrapRef.value!.scrollTop = value\n}\n\nconst setScrollLeft = (value: number) => {\n if (!isNumber(value)) {\n debugWarn(COMPONENT_NAME, 'value must be a number')\n return\n }\n wrapRef.value!.scrollLeft = value\n}\n\nconst update = () => {\n barRef.value?.update()\n}\n\nwatch(\n () => props.noresize,\n (noresize) => {\n if (noresize) {\n stopResizeObserver?.()\n stopResizeListener?.()\n } else {\n ;({ stop: stopResizeObserver } = useResizeObserver(resizeRef, update))\n stopResizeListener = useEventListener('resize', update)\n }\n },\n { immediate: true }\n)\n\nwatch(\n () => [props.maxHeight, props.height],\n () => {\n if (!props.native)\n nextTick(() => {\n update()\n if (wrapRef.value) {\n barRef.value?.handleScroll(wrapRef.value)\n }\n })\n }\n)\n\nprovide(\n scrollbarContextKey,\n reactive({\n scrollbarElement: scrollbarRef,\n wrapElement: wrapRef,\n })\n)\n\nonActivated(() => {\n if (wrapRef.value) {\n wrapRef.value.scrollTop = wrapScrollTop\n wrapRef.value.scrollLeft = wrapScrollLeft\n }\n})\n\nonMounted(() => {\n if (!props.native)\n nextTick(() => {\n update()\n })\n})\nonUpdated(() => update())\n\ndefineExpose({\n /** @description scrollbar wrap ref */\n wrapRef,\n /** @description update scrollbar state manually */\n update,\n /** @description scrolls to a particular set of coordinates */\n scrollTo,\n /** @description set distance to scroll top */\n setScrollTop,\n /** @description set distance to scroll left */\n setScrollLeft,\n /** @description handle scroll event */\n handleScroll,\n})\n</script>\n"],"names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_normalizeStyle"],"mappings":"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"}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import '../../utils/index.mjs';
|
2
|
-
import Segmented from './src/
|
3
|
-
export { segmentedEmits, segmentedProps } from './src/
|
2
|
+
import Segmented from './src/segmented.mjs';
|
3
|
+
export { segmentedEmits, segmentedProps } from './src/segmented2.mjs';
|
4
4
|
import { withInstall } from '../../utils/vue/install.mjs';
|
5
5
|
|
6
6
|
const ElSegmented = withInstall(Segmented);
|
@@ -1,41 +1,176 @@
|
|
1
|
-
import '
|
1
|
+
import { defineComponent, ref, reactive, computed, watch, openBlock, createElementBlock, unref, normalizeClass, createElementVNode, normalizeStyle, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
|
2
|
+
import { useActiveElement, useResizeObserver } from '@vueuse/core';
|
2
3
|
import '../../../hooks/index.mjs';
|
4
|
+
import '../../form/index.mjs';
|
5
|
+
import '../../../utils/index.mjs';
|
3
6
|
import '../../../constants/index.mjs';
|
4
|
-
import {
|
5
|
-
import
|
6
|
-
import {
|
7
|
+
import { segmentedProps, segmentedEmits } from './segmented2.mjs';
|
8
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
9
|
+
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
|
10
|
+
import { useId } from '../../../hooks/use-id/index.mjs';
|
11
|
+
import { useFormSize, useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
|
12
|
+
import { useFormItem, useFormItemInputId } from '../../form/src/hooks/use-form-item.mjs';
|
7
13
|
import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
|
8
|
-
import {
|
9
|
-
import {
|
14
|
+
import { isObject } from '@vue/shared';
|
15
|
+
import { debugWarn } from '../../../utils/error.mjs';
|
10
16
|
|
11
|
-
const
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
17
|
+
const __default__ = defineComponent({
|
18
|
+
name: "ElSegmented"
|
19
|
+
});
|
20
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
21
|
+
...__default__,
|
22
|
+
props: segmentedProps,
|
23
|
+
emits: segmentedEmits,
|
24
|
+
setup(__props, { emit }) {
|
25
|
+
const props = __props;
|
26
|
+
const ns = useNamespace("segmented");
|
27
|
+
const segmentedId = useId();
|
28
|
+
const segmentedSize = useFormSize();
|
29
|
+
const _disabled = useFormDisabled();
|
30
|
+
const { formItem } = useFormItem();
|
31
|
+
const { inputId, isLabeledByFormItem } = useFormItemInputId(props, {
|
32
|
+
formItemContext: formItem
|
33
|
+
});
|
34
|
+
const segmentedRef = ref(null);
|
35
|
+
const activeElement = useActiveElement();
|
36
|
+
const state = reactive({
|
37
|
+
isInit: false,
|
38
|
+
width: 0,
|
39
|
+
height: 0,
|
40
|
+
translateX: 0,
|
41
|
+
translateY: 0,
|
42
|
+
focusVisible: false
|
43
|
+
});
|
44
|
+
const handleChange = (item) => {
|
45
|
+
const value = getValue(item);
|
46
|
+
emit(UPDATE_MODEL_EVENT, value);
|
47
|
+
emit(CHANGE_EVENT, value);
|
48
|
+
};
|
49
|
+
const getValue = (item) => {
|
50
|
+
return isObject(item) ? item.value : item;
|
51
|
+
};
|
52
|
+
const getLabel = (item) => {
|
53
|
+
return isObject(item) ? item.label : item;
|
54
|
+
};
|
55
|
+
const getDisabled = (item) => {
|
56
|
+
return !!(_disabled.value || (isObject(item) ? item.disabled : false));
|
57
|
+
};
|
58
|
+
const getSelected = (item) => {
|
59
|
+
return props.modelValue === getValue(item);
|
60
|
+
};
|
61
|
+
const getOption = (value) => {
|
62
|
+
return props.options.find((item) => getValue(item) === value);
|
63
|
+
};
|
64
|
+
const getItemCls = (item) => {
|
65
|
+
return [
|
66
|
+
ns.e("item"),
|
67
|
+
ns.is("selected", getSelected(item)),
|
68
|
+
ns.is("disabled", getDisabled(item))
|
69
|
+
];
|
70
|
+
};
|
71
|
+
const updateSelect = () => {
|
72
|
+
if (!segmentedRef.value)
|
73
|
+
return;
|
74
|
+
const selectedItem = segmentedRef.value.querySelector(".is-selected");
|
75
|
+
const selectedItemInput = segmentedRef.value.querySelector(".is-selected input");
|
76
|
+
if (!selectedItem || !selectedItemInput) {
|
77
|
+
state.width = 0;
|
78
|
+
state.height = 0;
|
79
|
+
state.translateX = 0;
|
80
|
+
state.translateY = 0;
|
81
|
+
state.focusVisible = false;
|
82
|
+
return;
|
83
|
+
}
|
84
|
+
const rect = selectedItem.getBoundingClientRect();
|
85
|
+
state.isInit = true;
|
86
|
+
if (props.direction === "vertical") {
|
87
|
+
state.height = rect.height;
|
88
|
+
state.translateY = selectedItem.offsetTop;
|
89
|
+
} else {
|
90
|
+
state.width = rect.width;
|
91
|
+
state.translateX = selectedItem.offsetLeft;
|
92
|
+
}
|
93
|
+
try {
|
94
|
+
state.focusVisible = selectedItemInput.matches(":focus-visible");
|
95
|
+
} catch (e) {
|
96
|
+
}
|
97
|
+
};
|
98
|
+
const segmentedCls = computed(() => [
|
99
|
+
ns.b(),
|
100
|
+
ns.m(segmentedSize.value),
|
101
|
+
ns.is("block", props.block)
|
102
|
+
]);
|
103
|
+
const selectedStyle = computed(() => ({
|
104
|
+
width: props.direction === "vertical" ? "100%" : `${state.width}px`,
|
105
|
+
height: props.direction === "vertical" ? `${state.height}px` : "100%",
|
106
|
+
transform: props.direction === "vertical" ? `translateY(${state.translateY}px)` : `translateX(${state.translateX}px)`,
|
107
|
+
display: state.isInit ? "block" : "none"
|
108
|
+
}));
|
109
|
+
const selectedCls = computed(() => [
|
110
|
+
ns.e("item-selected"),
|
111
|
+
ns.is("disabled", getDisabled(getOption(props.modelValue))),
|
112
|
+
ns.is("focus-visible", state.focusVisible)
|
113
|
+
]);
|
114
|
+
const name = computed(() => {
|
115
|
+
return props.name || segmentedId.value;
|
116
|
+
});
|
117
|
+
useResizeObserver(segmentedRef, updateSelect);
|
118
|
+
watch(activeElement, updateSelect);
|
119
|
+
watch(() => props.modelValue, () => {
|
120
|
+
var _a;
|
121
|
+
updateSelect();
|
122
|
+
if (props.validateEvent) {
|
123
|
+
(_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "change").catch((err) => debugWarn(err));
|
124
|
+
}
|
125
|
+
}, {
|
126
|
+
flush: "post"
|
127
|
+
});
|
128
|
+
return (_ctx, _cache) => {
|
129
|
+
return _ctx.options.length ? (openBlock(), createElementBlock("div", {
|
130
|
+
key: 0,
|
131
|
+
id: unref(inputId),
|
132
|
+
ref_key: "segmentedRef",
|
133
|
+
ref: segmentedRef,
|
134
|
+
class: normalizeClass(unref(segmentedCls)),
|
135
|
+
role: "radiogroup",
|
136
|
+
"aria-label": !unref(isLabeledByFormItem) ? _ctx.ariaLabel || "segmented" : void 0,
|
137
|
+
"aria-labelledby": unref(isLabeledByFormItem) ? unref(formItem).labelId : void 0
|
138
|
+
}, [
|
139
|
+
createElementVNode("div", {
|
140
|
+
class: normalizeClass([unref(ns).e("group"), unref(ns).m(props.direction)])
|
141
|
+
}, [
|
142
|
+
createElementVNode("div", {
|
143
|
+
style: normalizeStyle(unref(selectedStyle)),
|
144
|
+
class: normalizeClass(unref(selectedCls))
|
145
|
+
}, null, 6),
|
146
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (item, index) => {
|
147
|
+
return openBlock(), createElementBlock("label", {
|
148
|
+
key: index,
|
149
|
+
class: normalizeClass(getItemCls(item))
|
150
|
+
}, [
|
151
|
+
createElementVNode("input", {
|
152
|
+
class: normalizeClass(unref(ns).e("item-input")),
|
153
|
+
type: "radio",
|
154
|
+
name: unref(name),
|
155
|
+
disabled: getDisabled(item),
|
156
|
+
checked: getSelected(item),
|
157
|
+
onChange: ($event) => handleChange(item)
|
158
|
+
}, null, 42, ["name", "disabled", "checked", "onChange"]),
|
159
|
+
createElementVNode("div", {
|
160
|
+
class: normalizeClass(unref(ns).e("item-label"))
|
161
|
+
}, [
|
162
|
+
renderSlot(_ctx.$slots, "default", { item }, () => [
|
163
|
+
createTextVNode(toDisplayString(getLabel(item)), 1)
|
164
|
+
])
|
165
|
+
], 2)
|
166
|
+
], 2);
|
167
|
+
}), 128))
|
168
|
+
], 2)
|
169
|
+
], 10, ["id", "aria-label", "aria-labelledby"])) : createCommentVNode("v-if", true);
|
170
|
+
};
|
171
|
+
}
|
34
172
|
});
|
35
|
-
|
36
|
-
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
|
37
|
-
[CHANGE_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val)
|
38
|
-
};
|
173
|
+
var Segmented = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "segmented.vue"]]);
|
39
174
|
|
40
|
-
export {
|
175
|
+
export { Segmented as default };
|
41
176
|
//# sourceMappingURL=segmented.mjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"segmented.mjs","sources":["../../../../../../packages/components/segmented/src/segmented.
|
1
|
+
{"version":3,"file":"segmented.mjs","sources":["../../../../../../packages/components/segmented/src/segmented.vue"],"sourcesContent":["<template>\n <div\n v-if=\"options.length\"\n :id=\"inputId\"\n ref=\"segmentedRef\"\n :class=\"segmentedCls\"\n role=\"radiogroup\"\n :aria-label=\"!isLabeledByFormItem ? ariaLabel || 'segmented' : undefined\"\n :aria-labelledby=\"isLabeledByFormItem ? formItem!.labelId : undefined\"\n >\n <div :class=\"[ns.e('group'), ns.m(props.direction)]\">\n <div :style=\"selectedStyle\" :class=\"selectedCls\" />\n <label\n v-for=\"(item, index) in options\"\n :key=\"index\"\n :class=\"getItemCls(item)\"\n >\n <input\n :class=\"ns.e('item-input')\"\n type=\"radio\"\n :name=\"name\"\n :disabled=\"getDisabled(item)\"\n :checked=\"getSelected(item)\"\n @change=\"handleChange(item)\"\n />\n <div :class=\"ns.e('item-label')\">\n <slot :item=\"item\">{{ getLabel(item) }}</slot>\n </div>\n </label>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, reactive, ref, watch } from 'vue'\nimport { useActiveElement, useResizeObserver } from '@vueuse/core'\nimport { useId, useNamespace } from '@element-plus/hooks'\nimport {\n useFormDisabled,\n useFormItem,\n useFormItemInputId,\n useFormSize,\n} from '@element-plus/components/form'\nimport { debugWarn, isObject } from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { segmentedEmits, segmentedProps } from './segmented'\nimport type { Option } from './types'\n\ndefineOptions({\n name: 'ElSegmented',\n})\n\nconst props = defineProps(segmentedProps)\nconst emit = defineEmits(segmentedEmits)\n\nconst ns = useNamespace('segmented')\nconst segmentedId = useId()\nconst segmentedSize = useFormSize()\nconst _disabled = useFormDisabled()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: formItem,\n})\n\nconst segmentedRef = ref<HTMLElement | null>(null)\nconst activeElement = useActiveElement()\n\nconst state = reactive({\n isInit: false,\n width: 0,\n height: 0,\n translateX: 0,\n translateY: 0,\n focusVisible: false,\n})\n\nconst handleChange = (item: Option) => {\n const value = getValue(item)\n emit(UPDATE_MODEL_EVENT, value)\n emit(CHANGE_EVENT, value)\n}\n\nconst getValue = (item: Option) => {\n return isObject(item) ? item.value : item\n}\n\nconst getLabel = (item: Option) => {\n return isObject(item) ? item.label : item\n}\n\nconst getDisabled = (item: Option | undefined) => {\n return !!(_disabled.value || (isObject(item) ? item.disabled : false))\n}\n\nconst getSelected = (item: Option) => {\n return props.modelValue === getValue(item)\n}\n\nconst getOption = (value: any) => {\n return props.options.find((item) => getValue(item) === value)\n}\n\nconst getItemCls = (item: Option) => {\n return [\n ns.e('item'),\n ns.is('selected', getSelected(item)),\n ns.is('disabled', getDisabled(item)),\n ]\n}\n\nconst updateSelect = () => {\n if (!segmentedRef.value) return\n const selectedItem = segmentedRef.value.querySelector(\n '.is-selected'\n ) as HTMLElement\n const selectedItemInput = segmentedRef.value.querySelector(\n '.is-selected input'\n ) as HTMLElement\n if (!selectedItem || !selectedItemInput) {\n state.width = 0\n state.height = 0\n state.translateX = 0\n state.translateY = 0\n state.focusVisible = false\n return\n }\n const rect = selectedItem.getBoundingClientRect()\n state.isInit = true\n if (props.direction === 'vertical') {\n state.height = rect.height\n state.translateY = selectedItem.offsetTop\n } else {\n state.width = rect.width\n state.translateX = selectedItem.offsetLeft\n }\n try {\n // This will failed in test\n state.focusVisible = selectedItemInput.matches(':focus-visible')\n } catch {}\n}\n\nconst segmentedCls = computed(() => [\n ns.b(),\n ns.m(segmentedSize.value),\n ns.is('block', props.block),\n])\n\nconst selectedStyle = computed(() => ({\n width: props.direction === 'vertical' ? '100%' : `${state.width}px`,\n height: props.direction === 'vertical' ? `${state.height}px` : '100%',\n transform:\n props.direction === 'vertical'\n ? `translateY(${state.translateY}px)`\n : `translateX(${state.translateX}px)`,\n display: state.isInit ? 'block' : 'none',\n}))\n\nconst selectedCls = computed(() => [\n ns.e('item-selected'),\n ns.is('disabled', getDisabled(getOption(props.modelValue))),\n ns.is('focus-visible', state.focusVisible),\n])\n\nconst name = computed(() => {\n return props.name || segmentedId.value\n})\n\nuseResizeObserver(segmentedRef, updateSelect)\n\nwatch(activeElement, updateSelect)\n\nwatch(\n () => props.modelValue,\n () => {\n updateSelect()\n if (props.validateEvent) {\n formItem?.validate?.('change').catch((err) => debugWarn(err))\n }\n },\n {\n flush: 'post',\n }\n)\n</script>\n"],"names":["_openBlock","_createElementBlock","_unref"],"mappings":"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"}
|