@uzum-tech/ui 1.14.4 → 1.14.5
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/index.js +22753 -22709
- package/dist/index.prod.js +3 -3
- package/es/_internal/select-menu/src/SelectOption.d.ts +3 -3
- package/es/_internal/select-menu/src/SelectOption.js +23 -20
- package/es/_internal/select-menu/src/styles/index.cssr.js +5 -4
- package/es/carousel/src/Carousel.d.ts +8 -3
- package/es/carousel/src/Carousel.js +42 -26
- package/es/carousel/src/CarouselArrow.js +1 -1
- package/es/carousel/src/CarouselContext.d.ts +2 -2
- package/es/carousel/src/CarouselContext.js +4 -4
- package/es/carousel/src/CarouselDots.js +1 -1
- package/es/carousel/src/CarouselItem.d.ts +1 -1
- package/es/carousel/src/CarouselItem.js +6 -3
- package/es/carousel/src/interface.d.ts +16 -0
- package/es/carousel/src/utils/index.js +4 -4
- package/es/carousel/styles/light.d.ts +1 -2
- package/es/carousel/styles/light.js +2 -2
- package/es/mapping-card/src/MappingCard.d.ts +9 -0
- package/es/mapping-card/src/MappingCardParts/Header.js +2 -2
- package/es/mapping-card/src/interface.d.ts +5 -0
- package/es/mapping-card/src/interface.js +4 -0
- package/es/version.d.ts +1 -1
- package/es/version.js +1 -1
- package/lib/_internal/select-menu/src/SelectOption.d.ts +3 -3
- package/lib/_internal/select-menu/src/SelectOption.js +22 -19
- package/lib/_internal/select-menu/src/styles/index.cssr.js +5 -4
- package/lib/carousel/src/Carousel.d.ts +8 -3
- package/lib/carousel/src/Carousel.js +41 -25
- package/lib/carousel/src/CarouselContext.d.ts +2 -2
- package/lib/carousel/src/CarouselContext.js +6 -7
- package/lib/carousel/src/CarouselDots.js +1 -1
- package/lib/carousel/src/CarouselItem.d.ts +1 -1
- package/lib/carousel/src/CarouselItem.js +7 -5
- package/lib/carousel/src/interface.d.ts +16 -0
- package/lib/carousel/src/utils/index.js +4 -4
- package/lib/carousel/styles/light.d.ts +1 -2
- package/lib/carousel/styles/light.js +4 -5
- package/lib/mapping-card/src/MappingCard.d.ts +9 -0
- package/lib/mapping-card/src/MappingCardParts/Header.js +2 -2
- package/lib/mapping-card/src/interface.d.ts +5 -0
- package/lib/mapping-card/src/interface.js +4 -0
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/package.json +1 -1
- package/web-types.json +8 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import type { TreeNode } from 'treemate';
|
|
2
|
+
import type { PropType, Ref } from 'vue';
|
|
3
3
|
import type { SelectOption } from '../../../select/src/interface';
|
|
4
|
-
import {
|
|
4
|
+
import type { RenderLabelImpl, RenderOptionImpl } from './interface';
|
|
5
5
|
declare const _default: import("vue").DefineComponent<{
|
|
6
6
|
clsPrefix: {
|
|
7
7
|
type: StringConstructor;
|
|
@@ -1,16 +1,17 @@
|
|
|
1
|
-
import { h, inject, defineComponent, Transition } from 'vue';
|
|
2
1
|
import { useMemo } from 'vooks';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
2
|
+
import { defineComponent, h, inject, Transition } from 'vue';
|
|
3
|
+
import { mergeEventHandlers, render } from '../../../_utils';
|
|
4
|
+
import UBaseAccountOption from '../../account-option';
|
|
5
5
|
import { UBaseIcon } from '../../icon';
|
|
6
|
+
import { CheckmarkIcon } from '../../icons';
|
|
6
7
|
import { internalSelectionMenuInjectionKey } from './interface';
|
|
7
|
-
import UBaseAccountOption from '../../account-option';
|
|
8
8
|
function renderCheckMark(show, clsPrefix) {
|
|
9
|
-
return (h(
|
|
10
|
-
|
|
11
|
-
default: () => h(
|
|
12
|
-
|
|
13
|
-
|
|
9
|
+
return (h("div", { class: `${clsPrefix}-base-select-option__check-wrapper` },
|
|
10
|
+
h(Transition, { name: "fade-in-scale-up-transition" }, {
|
|
11
|
+
default: () => show ? (h(UBaseIcon, { clsPrefix: clsPrefix, class: `${clsPrefix}-base-select-option__check` }, {
|
|
12
|
+
default: () => h(CheckmarkIcon)
|
|
13
|
+
})) : null
|
|
14
|
+
})));
|
|
14
15
|
}
|
|
15
16
|
export default defineComponent({
|
|
16
17
|
name: 'UBaseSelectOption',
|
|
@@ -30,27 +31,31 @@ export default defineComponent({
|
|
|
30
31
|
} = inject(internalSelectionMenuInjectionKey);
|
|
31
32
|
const isPendingRef = useMemo(() => {
|
|
32
33
|
const { value: pendingTmNode } = pendingTmNodeRef;
|
|
33
|
-
if (!pendingTmNode)
|
|
34
|
+
if (!pendingTmNode) {
|
|
34
35
|
return false;
|
|
36
|
+
}
|
|
35
37
|
return props.tmNode.key === pendingTmNode.key;
|
|
36
38
|
});
|
|
37
39
|
function handleClick(e) {
|
|
38
40
|
const { tmNode } = props;
|
|
39
|
-
if (tmNode.disabled)
|
|
41
|
+
if (tmNode.disabled) {
|
|
40
42
|
return;
|
|
43
|
+
}
|
|
41
44
|
handleOptionClick(e, tmNode);
|
|
42
45
|
}
|
|
43
46
|
function handleMouseEnter(e) {
|
|
44
47
|
const { tmNode } = props;
|
|
45
|
-
if (tmNode.disabled)
|
|
48
|
+
if (tmNode.disabled) {
|
|
46
49
|
return;
|
|
50
|
+
}
|
|
47
51
|
handleOptionMouseEnter(e, tmNode);
|
|
48
52
|
}
|
|
49
53
|
function handleMouseMove(e) {
|
|
50
54
|
const { tmNode } = props;
|
|
51
55
|
const { value: isPending } = isPendingRef;
|
|
52
|
-
if (tmNode.disabled || isPending)
|
|
56
|
+
if (tmNode.disabled || isPending) {
|
|
53
57
|
return;
|
|
58
|
+
}
|
|
54
59
|
handleOptionMouseEnter(e, tmNode);
|
|
55
60
|
}
|
|
56
61
|
return {
|
|
@@ -67,8 +72,9 @@ export default defineComponent({
|
|
|
67
72
|
isSelected: useMemo(() => {
|
|
68
73
|
const { value } = valueRef;
|
|
69
74
|
const { value: multiple } = multipleRef;
|
|
70
|
-
if (value === null)
|
|
75
|
+
if (value === null) {
|
|
71
76
|
return false;
|
|
77
|
+
}
|
|
72
78
|
const optionValue = props.tmNode.rawNode[valueFieldRef.value];
|
|
73
79
|
if (multiple) {
|
|
74
80
|
const { value: valueSet } = valueSetRef;
|
|
@@ -88,16 +94,13 @@ export default defineComponent({
|
|
|
88
94
|
},
|
|
89
95
|
render() {
|
|
90
96
|
const { clsPrefix, tmNode: { rawNode }, isSelected, isPending, isGrouped, showCheckmark, nodeProps, renderOption, renderLabel, handleClick, handleMouseEnter, handleMouseMove, account } = this;
|
|
91
|
-
const checkmark = renderCheckMark(isSelected, clsPrefix);
|
|
97
|
+
const checkmark = renderCheckMark(showCheckmark && isSelected, clsPrefix);
|
|
92
98
|
const label = renderLabel
|
|
93
99
|
? renderLabel(rawNode, isSelected)
|
|
94
100
|
: render(rawNode[this.labelField], rawNode, isSelected);
|
|
95
101
|
const children = account
|
|
96
|
-
? [
|
|
97
|
-
|
|
98
|
-
showCheckmark && checkmark
|
|
99
|
-
]
|
|
100
|
-
: [label, showCheckmark && checkmark];
|
|
102
|
+
? [h(UBaseAccountOption, Object.assign({}, rawNode, { label: label })), checkmark]
|
|
103
|
+
: [label, checkmark];
|
|
101
104
|
const attrs = nodeProps === null || nodeProps === void 0 ? void 0 : nodeProps(rawNode);
|
|
102
105
|
const node = (h("div", Object.assign({}, attrs, { class: [
|
|
103
106
|
`${clsPrefix}-base-select-option`,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { c, cB, cE, cM, cNotM } from '../../../../_utils/cssr';
|
|
2
1
|
import { fadeInScaleUpTransition } from '../../../../_styles/transitions/fade-in-scale-up.cssr';
|
|
2
|
+
import { c, cB, cE, cM, cNotM } from '../../../../_utils/cssr';
|
|
3
3
|
// --u-loading-color
|
|
4
4
|
// --u-loading-size
|
|
5
5
|
// --u-option-padding-right
|
|
@@ -104,14 +104,15 @@ export default cB('base-select-menu', `
|
|
|
104
104
|
color: var(--u-option-text-color-disabled);
|
|
105
105
|
`), cM('selected', `
|
|
106
106
|
opacity: var(--u-option-opacity-disabled);
|
|
107
|
-
`)]), cE('check', `
|
|
108
|
-
font-size: 24px;
|
|
107
|
+
`)]), cE('check-wrapper', `
|
|
109
108
|
position: absolute;
|
|
110
109
|
right: calc(var(--u-option-padding-right) - 4px);
|
|
111
110
|
top: 50%;
|
|
112
111
|
transform: translateY(-50%);
|
|
112
|
+
`, [cE('check', `
|
|
113
|
+
font-size: 24px;
|
|
113
114
|
color: var(--u-option-check-color);
|
|
114
115
|
transition: color .3s var(--u-bezier);
|
|
115
116
|
`, [fadeInScaleUpTransition({
|
|
116
117
|
enterScale: '0.5'
|
|
117
|
-
})])])]);
|
|
118
|
+
})])])])]);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { CSSProperties, PropType, Ref, TransitionProps, VNode } from 'vue';
|
|
1
|
+
import type { CSSProperties, PropType, Ref, SlotsType, TransitionProps, VNode } from 'vue';
|
|
2
2
|
import type { ExtractPublicPropTypes } from '../../_utils';
|
|
3
|
-
import type { ArrowScopedSlotProps, DotScopedSlotProps, Size } from './interface';
|
|
3
|
+
import type { ArrowScopedSlotProps, CarouselArrowSlotProps, CarouselDotSlotProps, DotScopedSlotProps, Size } from './interface';
|
|
4
4
|
declare const transitionProperties: readonly ["transitionDuration", "transitionTimingFunction"];
|
|
5
5
|
type TransitionStyle = Partial<Pick<CSSProperties, (typeof transitionProperties)[number]>>;
|
|
6
6
|
export declare const carouselProps: {
|
|
@@ -97,6 +97,11 @@ export declare const carouselProps: {
|
|
|
97
97
|
}, any>>>;
|
|
98
98
|
};
|
|
99
99
|
export type CarouselProps = ExtractPublicPropTypes<typeof carouselProps>;
|
|
100
|
+
export interface CarouselSlots {
|
|
101
|
+
default?: () => VNode[];
|
|
102
|
+
arrow?: (props: CarouselArrowSlotProps) => VNode[];
|
|
103
|
+
dots?: (props: CarouselDotSlotProps) => VNode[];
|
|
104
|
+
}
|
|
100
105
|
declare const _default: import("vue").DefineComponent<{
|
|
101
106
|
defaultIndex: {
|
|
102
107
|
type: NumberConstructor;
|
|
@@ -344,5 +349,5 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
344
349
|
draggable: boolean;
|
|
345
350
|
touchable: boolean;
|
|
346
351
|
mousewheel: boolean;
|
|
347
|
-
},
|
|
352
|
+
}, SlotsType<CarouselSlots>>;
|
|
348
353
|
export default _default;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { VResizeObserver } from 'vueuc';
|
|
3
|
-
import { useMergedState } from 'vooks';
|
|
4
|
-
import { on, off } from 'evtd';
|
|
1
|
+
import { off, on } from 'evtd';
|
|
5
2
|
import { getPreciseEventTarget } from 'seemly';
|
|
3
|
+
import { useMergedState } from 'vooks';
|
|
4
|
+
import { cloneVNode, computed, defineComponent, h, nextTick, normalizeStyle, onBeforeUnmount, onMounted, onUpdated, ref, toRef, Transition, vShow, watch, watchEffect, withDirectives } from 'vue';
|
|
5
|
+
import { VResizeObserver } from 'vueuc';
|
|
6
6
|
import { useConfig, useTheme, useThemeClass } from '../../_mixins';
|
|
7
7
|
import { flatten, keep, resolveSlotWithProps } from '../../_utils';
|
|
8
8
|
import { carouselLight } from '../styles';
|
|
9
|
-
import
|
|
9
|
+
import UCarouselArrow from './CarouselArrow';
|
|
10
10
|
import { provideCarouselContext } from './CarouselContext';
|
|
11
11
|
import UCarouselDots from './CarouselDots';
|
|
12
|
-
import UCarouselArrow from './CarouselArrow';
|
|
13
12
|
import UCarouselItem, { isCarouselItem } from './CarouselItem';
|
|
14
13
|
import style from './styles/index.cssr';
|
|
14
|
+
import { addDuplicateSlides, calculateSize, clampValue, getDisplayIndex, getDisplayTotalView, getNextIndex, getPrevIndex, getRealIndex, isTouchEvent, resolveSpeed } from './utils';
|
|
15
15
|
const transitionProperties = [
|
|
16
16
|
'transitionDuration',
|
|
17
17
|
'transitionTimingFunction'
|
|
@@ -63,6 +63,7 @@ let globalDragging = false;
|
|
|
63
63
|
export default defineComponent({
|
|
64
64
|
name: 'Carousel',
|
|
65
65
|
props: carouselProps,
|
|
66
|
+
slots: Object,
|
|
66
67
|
setup(props) {
|
|
67
68
|
const { mergedClsPrefixRef, inlineThemeDisabled } = useConfig(props);
|
|
68
69
|
// Dom
|
|
@@ -90,10 +91,14 @@ export default defineComponent({
|
|
|
90
91
|
(props.slidesPerView === 'auto' && props.centeredSlides));
|
|
91
92
|
// Carousel size
|
|
92
93
|
const perViewSizeRef = ref({ width: 0, height: 0 });
|
|
94
|
+
const slideSizesTrigger = ref(0);
|
|
93
95
|
const slideSizesRef = computed(() => {
|
|
94
96
|
const { value: slidesEls } = slideElsRef;
|
|
95
|
-
if (!slidesEls.length)
|
|
97
|
+
if (!slidesEls.length) {
|
|
96
98
|
return [];
|
|
99
|
+
}
|
|
100
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
101
|
+
slideSizesTrigger.value;
|
|
97
102
|
const { value: autoSlideSize } = autoSlideSizeRef;
|
|
98
103
|
if (autoSlideSize) {
|
|
99
104
|
return slidesEls.map((slide) => calculateSize(slide));
|
|
@@ -114,8 +119,9 @@ export default defineComponent({
|
|
|
114
119
|
// The translate required to reach each slide
|
|
115
120
|
const slideTranlatesRef = computed(() => {
|
|
116
121
|
const { value: slideSizes } = slideSizesRef;
|
|
117
|
-
if (!slideSizes.length)
|
|
122
|
+
if (!slideSizes.length) {
|
|
118
123
|
return [];
|
|
124
|
+
}
|
|
119
125
|
const { centeredSlides, spaceBetween } = props;
|
|
120
126
|
const { value: axis } = sizeAxisRef;
|
|
121
127
|
const { [axis]: perViewSize } = perViewSizeRef.value;
|
|
@@ -142,8 +148,9 @@ export default defineComponent({
|
|
|
142
148
|
: resolveSpeed(transitionStyleRef.value.transitionDuration));
|
|
143
149
|
const slideStylesRef = computed(() => {
|
|
144
150
|
const { value: slidesEls } = slideElsRef;
|
|
145
|
-
if (!slidesEls.length)
|
|
151
|
+
if (!slidesEls.length) {
|
|
146
152
|
return [];
|
|
153
|
+
}
|
|
147
154
|
const useComputedSize = !(autoSlideSizeRef.value || realSlidesPerViewRef.value === 1);
|
|
148
155
|
const getSlideSize = (index) => {
|
|
149
156
|
if (useComputedSize) {
|
|
@@ -179,8 +186,9 @@ export default defineComponent({
|
|
|
179
186
|
else {
|
|
180
187
|
const { value: slideSizes } = slideSizesRef;
|
|
181
188
|
const { length } = slideSizes;
|
|
182
|
-
if (!length)
|
|
189
|
+
if (!length) {
|
|
183
190
|
return totalSlides;
|
|
191
|
+
}
|
|
184
192
|
const { value: translates } = slideTranlatesRef;
|
|
185
193
|
const { value: axis } = sizeAxisRef;
|
|
186
194
|
const perViewSize = perViewSizeRef.value[axis];
|
|
@@ -239,6 +247,9 @@ export default defineComponent({
|
|
|
239
247
|
function isNextDisabled() {
|
|
240
248
|
return getRealNextIndex() === null;
|
|
241
249
|
}
|
|
250
|
+
let inTransition = false;
|
|
251
|
+
let dragging = false;
|
|
252
|
+
let isEffectiveDrag = false;
|
|
242
253
|
// To
|
|
243
254
|
function to(index) {
|
|
244
255
|
const realIndex = clampValue(getRealIndex(index, duplicatedableRef.value), 0, totalViewRef.value);
|
|
@@ -249,24 +260,27 @@ export default defineComponent({
|
|
|
249
260
|
}
|
|
250
261
|
function prev() {
|
|
251
262
|
const prevIndex = getRealPrevIndex();
|
|
252
|
-
if (prevIndex !== null)
|
|
263
|
+
if (prevIndex !== null) {
|
|
253
264
|
toRealIndex(prevIndex);
|
|
265
|
+
}
|
|
254
266
|
}
|
|
255
267
|
function next() {
|
|
256
268
|
const nextIndex = getRealNextIndex();
|
|
257
|
-
if (nextIndex !== null)
|
|
269
|
+
if (nextIndex !== null) {
|
|
258
270
|
toRealIndex(nextIndex);
|
|
271
|
+
}
|
|
259
272
|
}
|
|
260
273
|
function prevIfSlideTransitionEnd() {
|
|
261
|
-
if (!inTransition || !duplicatedableRef.value)
|
|
274
|
+
if (!inTransition || !duplicatedableRef.value) {
|
|
262
275
|
prev();
|
|
276
|
+
}
|
|
263
277
|
}
|
|
264
278
|
function nextIfSlideTransitionEnd() {
|
|
265
|
-
if (!inTransition || !duplicatedableRef.value)
|
|
279
|
+
if (!inTransition || !duplicatedableRef.value) {
|
|
266
280
|
next();
|
|
281
|
+
}
|
|
267
282
|
}
|
|
268
283
|
// Translate to
|
|
269
|
-
let inTransition = false;
|
|
270
284
|
// record the translate of each slide, so that it can be restored at touch
|
|
271
285
|
let previousTranslate = 0;
|
|
272
286
|
const translateStyleRef = ref({});
|
|
@@ -351,13 +365,15 @@ export default defineComponent({
|
|
|
351
365
|
};
|
|
352
366
|
provideCarouselContext(carouselContext);
|
|
353
367
|
function addSlide(slide) {
|
|
354
|
-
if (!slide)
|
|
368
|
+
if (!slide) {
|
|
355
369
|
return;
|
|
370
|
+
}
|
|
356
371
|
slideElsRef.value.push(slide);
|
|
357
372
|
}
|
|
358
373
|
function removeSlide(slide) {
|
|
359
|
-
if (!slide)
|
|
374
|
+
if (!slide) {
|
|
360
375
|
return;
|
|
376
|
+
}
|
|
361
377
|
const index = getSlideIndex(slide);
|
|
362
378
|
if (index !== -1) {
|
|
363
379
|
slideElsRef.value.splice(index, 1);
|
|
@@ -416,12 +432,11 @@ export default defineComponent({
|
|
|
416
432
|
let dragStartY = 0;
|
|
417
433
|
let dragOffset = 0;
|
|
418
434
|
let dragStartTime = 0;
|
|
419
|
-
let dragging = false;
|
|
420
|
-
let isEffectiveDrag = false;
|
|
421
435
|
function handleTouchstart(event) {
|
|
422
436
|
var _a;
|
|
423
|
-
if (globalDragging)
|
|
437
|
+
if (globalDragging) {
|
|
424
438
|
return;
|
|
439
|
+
}
|
|
425
440
|
if (!((_a = slidesElRef.value) === null || _a === void 0 ? void 0 : _a.contains(getPreciseEventTarget(event)))) {
|
|
426
441
|
return;
|
|
427
442
|
}
|
|
@@ -545,8 +560,9 @@ export default defineComponent({
|
|
|
545
560
|
}
|
|
546
561
|
function handleMousewheel(event) {
|
|
547
562
|
event.preventDefault();
|
|
548
|
-
if (inTransition)
|
|
563
|
+
if (inTransition) {
|
|
549
564
|
return;
|
|
565
|
+
}
|
|
550
566
|
let { deltaX, deltaY } = event;
|
|
551
567
|
if (event.shiftKey && !deltaX) {
|
|
552
568
|
deltaX = deltaY;
|
|
@@ -577,10 +593,8 @@ export default defineComponent({
|
|
|
577
593
|
resetAutoplay();
|
|
578
594
|
}
|
|
579
595
|
function handleSlideResize() {
|
|
580
|
-
var _a, _b;
|
|
581
596
|
if (autoSlideSizeRef.value) {
|
|
582
|
-
|
|
583
|
-
slideSizesRef.effect.run();
|
|
597
|
+
slideSizesTrigger.value++;
|
|
584
598
|
}
|
|
585
599
|
}
|
|
586
600
|
function handleMouseenter() {
|
|
@@ -622,8 +636,9 @@ export default defineComponent({
|
|
|
622
636
|
}
|
|
623
637
|
});
|
|
624
638
|
watch(realIndexRef, (realIndex, lastRealIndex) => {
|
|
625
|
-
if (realIndex === lastRealIndex)
|
|
639
|
+
if (realIndex === lastRealIndex) {
|
|
626
640
|
return;
|
|
641
|
+
}
|
|
627
642
|
resetAutoplay();
|
|
628
643
|
if (sequenceLayoutRef.value) {
|
|
629
644
|
if (duplicatedableRef.value && displayTotalViewRef.value > 2) {
|
|
@@ -672,9 +687,10 @@ export default defineComponent({
|
|
|
672
687
|
'next',
|
|
673
688
|
'isPrevDisabled',
|
|
674
689
|
'isNextDisabled'
|
|
675
|
-
])), { total: displayTotalViewRef.value, currentIndex: mergedDisplayIndexRef.value })));
|
|
690
|
+
])), { total: displayTotalViewRef.value, current: mergedDisplayIndexRef.value, currentIndex: mergedDisplayIndexRef.value })));
|
|
676
691
|
const dotSlotPropsRef = computed(() => ({
|
|
677
692
|
total: displayTotalViewRef.value,
|
|
693
|
+
current: mergedDisplayIndexRef.value,
|
|
678
694
|
currentIndex: mergedDisplayIndexRef.value,
|
|
679
695
|
to: carouselContext.to
|
|
680
696
|
}));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { defineComponent, h } from 'vue';
|
|
2
2
|
import { useConfig } from '../../_mixins';
|
|
3
3
|
import { useCarouselContext } from './CarouselContext';
|
|
4
4
|
const backwardIcon = (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16" },
|
|
@@ -17,5 +17,5 @@ export interface CarouselContextValue {
|
|
|
17
17
|
removeSlide: (slide?: HTMLElement) => void;
|
|
18
18
|
onCarouselItemClick: (index: number, event: MouseEvent) => void;
|
|
19
19
|
}
|
|
20
|
-
export declare
|
|
21
|
-
export declare
|
|
20
|
+
export declare function provideCarouselContext(contextValue: CarouselContextValue): void;
|
|
21
|
+
export declare function useCarouselContext(location?: string, component?: string): CarouselContextValue;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { inject, provide } from 'vue';
|
|
2
2
|
import { createInjectionKey, throwError } from '../../_utils';
|
|
3
3
|
const carouselMethodsInjectionKey = createInjectionKey('u-carousel-methods');
|
|
4
|
-
export
|
|
4
|
+
export function provideCarouselContext(contextValue) {
|
|
5
5
|
provide(carouselMethodsInjectionKey, contextValue);
|
|
6
|
-
}
|
|
7
|
-
export
|
|
6
|
+
}
|
|
7
|
+
export function useCarouselContext(location = 'unknown', component = 'component') {
|
|
8
8
|
const CarouselContext = inject(carouselMethodsInjectionKey);
|
|
9
9
|
if (!CarouselContext) {
|
|
10
10
|
throwError(location, `\`${component}\` must be placed inside \`u-carousel\`.`);
|
|
11
11
|
}
|
|
12
12
|
return CarouselContext;
|
|
13
|
-
}
|
|
13
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { h, defineComponent, ref, onBeforeUpdate } from 'vue';
|
|
2
1
|
import { indexMap } from 'seemly';
|
|
2
|
+
import { defineComponent, h, onBeforeUpdate, ref } from 'vue';
|
|
3
3
|
import { useConfig } from '../../_mixins';
|
|
4
4
|
import { useCarouselContext } from './CarouselContext';
|
|
5
5
|
const carouselDotsProps = {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { VNode } from 'vue';
|
|
2
|
-
export declare
|
|
2
|
+
export declare function isCarouselItem(child: VNode): boolean;
|
|
3
3
|
declare const _default: import("vue").DefineComponent<{}, {
|
|
4
4
|
mergedClsPrefix: import("vue").Ref<string>;
|
|
5
5
|
selfElRef: import("vue").Ref<HTMLElement | undefined>;
|
|
@@ -1,9 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { camelCase } from 'lodash-es';
|
|
2
|
+
import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref } from 'vue';
|
|
3
3
|
import { useConfig } from '../../_mixins';
|
|
4
4
|
import { useCarouselContext } from './CarouselContext';
|
|
5
5
|
const CarouselItemName = 'CarouselItem';
|
|
6
|
-
export
|
|
6
|
+
export function isCarouselItem(child) {
|
|
7
|
+
var _a;
|
|
8
|
+
return ((_a = child.type) === null || _a === void 0 ? void 0 : _a.name) === CarouselItemName;
|
|
9
|
+
}
|
|
7
10
|
export default defineComponent({
|
|
8
11
|
name: CarouselItemName,
|
|
9
12
|
setup(props) {
|
|
@@ -7,13 +7,29 @@ export interface CarouselInst {
|
|
|
7
7
|
}
|
|
8
8
|
export interface ArrowScopedSlotProps extends Pick<CarouselContextValue, 'to' | 'prev' | 'next' | 'isPrevDisabled' | 'isNextDisabled'> {
|
|
9
9
|
total: number;
|
|
10
|
+
current: number;
|
|
10
11
|
currentIndex: number;
|
|
11
12
|
}
|
|
12
13
|
export interface DotScopedSlotProps extends Pick<CarouselContextValue, 'to'> {
|
|
13
14
|
total: number;
|
|
15
|
+
current: number;
|
|
14
16
|
currentIndex: number;
|
|
15
17
|
}
|
|
16
18
|
export interface Size {
|
|
17
19
|
width: number;
|
|
18
20
|
height: number;
|
|
19
21
|
}
|
|
22
|
+
export interface CarouselArrowSlotProps {
|
|
23
|
+
total: number;
|
|
24
|
+
current: number;
|
|
25
|
+
currentIndex: number;
|
|
26
|
+
to: (index: number) => void;
|
|
27
|
+
prev: () => void;
|
|
28
|
+
next: () => void;
|
|
29
|
+
}
|
|
30
|
+
export interface CarouselDotSlotProps {
|
|
31
|
+
total: number;
|
|
32
|
+
current: number;
|
|
33
|
+
currentIndex: number;
|
|
34
|
+
to: (index: number) => void;
|
|
35
|
+
}
|
|
@@ -6,12 +6,12 @@ export function calculateSize(element, innerOnly) {
|
|
|
6
6
|
const style = getComputedStyle(element);
|
|
7
7
|
width =
|
|
8
8
|
width -
|
|
9
|
-
parseFloat(style.getPropertyValue('padding-left')) -
|
|
10
|
-
parseFloat(style.getPropertyValue('padding-right'));
|
|
9
|
+
Number.parseFloat(style.getPropertyValue('padding-left')) -
|
|
10
|
+
Number.parseFloat(style.getPropertyValue('padding-right'));
|
|
11
11
|
height =
|
|
12
12
|
height -
|
|
13
|
-
parseFloat(style.getPropertyValue('padding-top')) -
|
|
14
|
-
parseFloat(style.getPropertyValue('padding-bottom'));
|
|
13
|
+
Number.parseFloat(style.getPropertyValue('padding-top')) -
|
|
14
|
+
Number.parseFloat(style.getPropertyValue('padding-bottom'));
|
|
15
15
|
}
|
|
16
16
|
return { width, height };
|
|
17
17
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { commonLight } from '../../_styles/common';
|
|
2
|
-
export
|
|
2
|
+
export function self() {
|
|
3
3
|
return {
|
|
4
4
|
dotSize: '8px',
|
|
5
5
|
dotColor: 'rgba(255, 255, 255, .3)',
|
|
@@ -9,7 +9,7 @@ export const self = (vars) => {
|
|
|
9
9
|
dotLineWidthActive: '24px',
|
|
10
10
|
arrowColor: '#eee'
|
|
11
11
|
};
|
|
12
|
-
}
|
|
12
|
+
}
|
|
13
13
|
const carouselLight = {
|
|
14
14
|
name: 'Carousel',
|
|
15
15
|
common: commonLight,
|
|
@@ -15,6 +15,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
15
15
|
readonly type: import("vue").PropType<import("./interface").MappingCardInterface["hideCopy"]>;
|
|
16
16
|
readonly default: false;
|
|
17
17
|
};
|
|
18
|
+
hideHeaderActions: {
|
|
19
|
+
readonly type: import("vue").PropType<import("./interface").MappingCardInterface["hideHeaderActions"]>;
|
|
20
|
+
readonly default: false;
|
|
21
|
+
};
|
|
18
22
|
copyButtonProps: import("vue").PropType<import("./interface").MappingCardInterface["copyButtonProps"]>;
|
|
19
23
|
copyIconProps: import("vue").PropType<import("./interface").MappingCardInterface["copyIconProps"]>;
|
|
20
24
|
headerEditButtonProps: import("vue").PropType<import("./interface").MappingCardInterface["headerEditButtonProps"]>;
|
|
@@ -1065,6 +1069,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
1065
1069
|
readonly type: import("vue").PropType<import("./interface").MappingCardInterface["hideCopy"]>;
|
|
1066
1070
|
readonly default: false;
|
|
1067
1071
|
};
|
|
1072
|
+
hideHeaderActions: {
|
|
1073
|
+
readonly type: import("vue").PropType<import("./interface").MappingCardInterface["hideHeaderActions"]>;
|
|
1074
|
+
readonly default: false;
|
|
1075
|
+
};
|
|
1068
1076
|
copyButtonProps: import("vue").PropType<import("./interface").MappingCardInterface["copyButtonProps"]>;
|
|
1069
1077
|
copyIconProps: import("vue").PropType<import("./interface").MappingCardInterface["copyIconProps"]>;
|
|
1070
1078
|
headerEditButtonProps: import("vue").PropType<import("./interface").MappingCardInterface["headerEditButtonProps"]>;
|
|
@@ -2087,5 +2095,6 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
2087
2095
|
cols: number | undefined;
|
|
2088
2096
|
defaultSpan: number | undefined;
|
|
2089
2097
|
hideCopy: boolean | undefined;
|
|
2098
|
+
hideHeaderActions: boolean | undefined;
|
|
2090
2099
|
}, {}>;
|
|
2091
2100
|
export default _default;
|
|
@@ -40,7 +40,7 @@ export default defineComponent({
|
|
|
40
40
|
default: () => locale.copyTooltip
|
|
41
41
|
}))))
|
|
42
42
|
}),
|
|
43
|
-
h(UFlex, { align: "center", size: "small" }, {
|
|
43
|
+
!props.hideHeaderActions && (h(UFlex, { align: "center", size: "small" }, {
|
|
44
44
|
default: () => resolveSlot(slots.headerActions, () => {
|
|
45
45
|
var _a, _b;
|
|
46
46
|
const buttons = [];
|
|
@@ -71,6 +71,6 @@ export default defineComponent({
|
|
|
71
71
|
}));
|
|
72
72
|
return buttons;
|
|
73
73
|
})
|
|
74
|
-
})));
|
|
74
|
+
}))));
|
|
75
75
|
}
|
|
76
76
|
});
|
|
@@ -36,6 +36,7 @@ export interface MappingCardInterface {
|
|
|
36
36
|
defaultSpan?: number;
|
|
37
37
|
copy?: () => string;
|
|
38
38
|
hideCopy?: boolean;
|
|
39
|
+
hideHeaderActions?: boolean;
|
|
39
40
|
copyButtonProps?: Partial<ButtonProps>;
|
|
40
41
|
copyIconProps?: Partial<IconProps>;
|
|
41
42
|
headerEditButtonProps?: Partial<ButtonProps>;
|
|
@@ -72,6 +73,10 @@ export declare const mappingCardProps: {
|
|
|
72
73
|
readonly type: PropType<MappingCardInterface["hideCopy"]>;
|
|
73
74
|
readonly default: false;
|
|
74
75
|
};
|
|
76
|
+
readonly hideHeaderActions: {
|
|
77
|
+
readonly type: PropType<MappingCardInterface["hideHeaderActions"]>;
|
|
78
|
+
readonly default: false;
|
|
79
|
+
};
|
|
75
80
|
readonly copyButtonProps: PropType<MappingCardInterface["copyButtonProps"]>;
|
|
76
81
|
readonly copyIconProps: PropType<MappingCardInterface["copyIconProps"]>;
|
|
77
82
|
readonly headerEditButtonProps: PropType<MappingCardInterface["headerEditButtonProps"]>;
|
package/es/version.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "1.14.
|
|
1
|
+
declare const _default: "1.14.5";
|
|
2
2
|
export default _default;
|
package/es/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export default '1.14.
|
|
1
|
+
export default '1.14.5';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import type { TreeNode } from 'treemate';
|
|
2
|
+
import type { PropType, Ref } from 'vue';
|
|
3
3
|
import type { SelectOption } from '../../../select/src/interface';
|
|
4
|
-
import {
|
|
4
|
+
import type { RenderLabelImpl, RenderOptionImpl } from './interface';
|
|
5
5
|
declare const _default: import("vue").DefineComponent<{
|
|
6
6
|
clsPrefix: {
|
|
7
7
|
type: StringConstructor;
|