From cae888e8c792aa330fbbe2d19619e3fd5c077808 Mon Sep 17 00:00:00 2001 From: DCloud_LXH <283700113@qq.com> Date: Mon, 24 May 2021 17:37:11 +0800 Subject: [PATCH] refactor: scroll-view --- .../uni-components/src/components/index.ts | 2 +- .../src/components/scroll-view/index.tsx | 616 +++++++++++ .../src/components/scroll-view/index.vue | 525 ---------- packages/uni-h5/dist/uni-h5.cjs.js | 904 +++++++--------- packages/uni-h5/dist/uni-h5.es.js | 965 +++++++++--------- 5 files changed, 1463 insertions(+), 1549 deletions(-) create mode 100644 packages/uni-components/src/components/scroll-view/index.tsx delete mode 100644 packages/uni-components/src/components/scroll-view/index.vue diff --git a/packages/uni-components/src/components/index.ts b/packages/uni-components/src/components/index.ts index c126d3e51..0a5dc3f08 100644 --- a/packages/uni-components/src/components/index.ts +++ b/packages/uni-components/src/components/index.ts @@ -19,7 +19,7 @@ import Radio from './radio/index' import RadioGroup from './radio-group/index' import ResizeSensor from './resize-sensor/index' import RichText from './rich-text' -import ScrollView from './scroll-view/index.vue' +import ScrollView from './scroll-view/index' import Slider from './slider/index' import Swiper from './swiper/index' import SwiperItem from './swiper-item/index' diff --git a/packages/uni-components/src/components/scroll-view/index.tsx b/packages/uni-components/src/components/scroll-view/index.tsx new file mode 100644 index 000000000..745d6538f --- /dev/null +++ b/packages/uni-components/src/components/scroll-view/index.tsx @@ -0,0 +1,616 @@ +import { + Ref, + ref, + ExtractPropTypes, + computed, + reactive, + onMounted, + onBeforeUnmount, + onActivated, + watch, +} from 'vue' +import { passive } from '@dcloudio/uni-shared' +import { initScrollBounce, disableScrollBounce } from '../../helpers/scroll' +import { + useCustomEvent, + CustomEventTrigger, + EmitEvent, +} from '../../helpers/useEvent' +import { defineBuiltInComponent } from '@dcloudio/uni-components' + +type HTMLRef = Ref +type Props = ExtractPropTypes +type RefreshState = 'refreshing' | 'restore' | 'pulling' | '' +interface State { + lastScrollTop: number + lastScrollLeft: number + lastScrollToUpperTime: number + lastScrollToLowerTime: number + refresherHeight: number + refreshRotate: number + refreshState: RefreshState +} + +const passiveOptions = passive(true) + +const props = { + scrollX: { + type: [Boolean, String], + default: false, + }, + scrollY: { + type: [Boolean, String], + default: false, + }, + upperThreshold: { + type: [Number, String], + default: 50, + }, + lowerThreshold: { + type: [Number, String], + default: 50, + }, + scrollTop: { + type: [Number, String], + default: 0, + }, + scrollLeft: { + type: [Number, String], + default: 0, + }, + scrollIntoView: { + type: String, + default: '', + }, + scrollWithAnimation: { + type: [Boolean, String], + default: false, + }, + enableBackToTop: { + type: [Boolean, String], + default: false, + }, + refresherEnabled: { + type: [Boolean, String], + default: false, + }, + refresherThreshold: { + type: Number, + default: 45, + }, + refresherDefaultStyle: { + type: String, + default: 'back', + }, + refresherBackground: { + type: String, + default: '#fff', + }, + refresherTriggered: { + type: [Boolean, String], + default: false, + }, +} + +export default /*#__PURE__*/ defineBuiltInComponent({ + name: 'ScrollView', + compatConfig: { + MODE: 3, + }, + props, + emits: ['scroll', 'scrolltoupper', 'scrolltolower', 'refresherabort'], + setup(props, { emit, slots }) { + const rootRef: HTMLRef = ref(null) + const main: HTMLRef = ref(null) + const wrap: HTMLRef = ref(null) + const content: HTMLRef = ref(null) + const refresherinner: HTMLRef = ref(null) + + const trigger = useCustomEvent>(rootRef, emit) + + const { state, scrollTopNumber, scrollLeftNumber } = + useScrollViewState(props) + useScrollViewLoader( + props, + state, + scrollTopNumber, + scrollLeftNumber, + trigger, + rootRef, + main, + content + ) + + return () => { + const { + scrollX, + refresherEnabled, + refresherBackground, + refresherDefaultStyle, + } = props + const { refresherHeight, refreshState, refreshRotate } = state + + return ( + +
+
+
+ {refresherEnabled ? ( +
+ {refresherDefaultStyle !== 'none' ? ( +
+
+ {refreshState == 'pulling' ? ( + + + + + ) : null} + {refreshState == 'refreshing' ? ( + + ) : null} +
+
+ ) : null} + {refresherDefaultStyle == 'none' + ? slots.refresher && slots.refresher() + : null} +
+ ) : null} + {slots.default && slots.default()} +
+
+
+ + ) + } + }, +}) + +function useScrollViewState(props: Props) { + const scrollTopNumber = computed(() => { + return Number(props.scrollTop) || 0 + }) + const scrollLeftNumber = computed(() => { + return Number(props.scrollLeft) || 0 + }) + + const state: State = reactive({ + lastScrollTop: scrollTopNumber.value, + lastScrollLeft: scrollLeftNumber.value, + lastScrollToUpperTime: 0, + lastScrollToLowerTime: 0, + refresherHeight: 0, + refreshRotate: 0, + refreshState: '', + }) + + return { + state, + scrollTopNumber, + scrollLeftNumber, + } +} + +function useScrollViewLoader( + props: Props, + state: State, + scrollTopNumber: Ref, + scrollLeftNumber: Ref, + trigger: CustomEventTrigger, + rootRef: HTMLRef, + main: HTMLRef, + content: HTMLRef +) { + let _lastScrollTime = 0 + let _innerSetScrollTop = false + let _innerSetScrollLeft = false + let __transitionEnd = () => {} + const upperThresholdNumber = computed(() => { + var val = Number(props.upperThreshold) + return isNaN(val) ? 50 : val + }) + const lowerThresholdNumber = computed(() => { + var val = Number(props.lowerThreshold) + return isNaN(val) ? 50 : val + }) + + function scrollTo(t: number, n: 'x' | 'y') { + var i = main.value! + t < 0 + ? (t = 0) + : n === 'x' && t > i.scrollWidth - i.offsetWidth + ? (t = i.scrollWidth - i.offsetWidth) + : n === 'y' && + t > i.scrollHeight - i.offsetHeight && + (t = i.scrollHeight - i.offsetHeight) + var r = 0 + var o = '' + n === 'x' ? (r = i.scrollLeft - t) : n === 'y' && (r = i.scrollTop - t) + if (r !== 0) { + content.value!.style.transition = 'transform .3s ease-out' + content.value!.style.webkitTransition = '-webkit-transform .3s ease-out' + if (n === 'x') { + o = 'translateX(' + r + 'px) translateZ(0)' + } else { + n === 'y' && (o = 'translateY(' + r + 'px) translateZ(0)') + } + content.value!.removeEventListener('transitionend', __transitionEnd) + content.value!.removeEventListener('webkitTransitionEnd', __transitionEnd) + __transitionEnd = () => _transitionEnd(t, n) + content.value!.addEventListener('transitionend', __transitionEnd) + content.value!.addEventListener('webkitTransitionEnd', __transitionEnd) + if (n === 'x') { + // if (e !== 'ios') { + i.style.overflowX = 'hidden' + // } + } else if (n === 'y') { + i.style.overflowY = 'hidden' + } + + content.value!.style.transform = o + content.value!.style.webkitTransform = o + } + } + function _handleScroll($event: MouseEvent) { + if ($event.timeStamp - _lastScrollTime > 20) { + _lastScrollTime = $event.timeStamp + const target = $event.target as HTMLElement + trigger('scroll', $event, { + scrollLeft: target.scrollLeft, + scrollTop: target.scrollTop, + scrollHeight: target.scrollHeight, + scrollWidth: target.scrollWidth, + deltaX: state.lastScrollLeft - target.scrollLeft, + deltaY: state.lastScrollTop - target.scrollTop, + }) + if (props.scrollY) { + if ( + target.scrollTop <= upperThresholdNumber.value && + state.lastScrollTop - target.scrollTop > 0 && + $event.timeStamp - state.lastScrollToUpperTime > 200 + ) { + trigger('scrolltoupper', $event, { + direction: 'top', + }) + state.lastScrollToUpperTime = $event.timeStamp + } + if ( + target.scrollTop + target.offsetHeight + lowerThresholdNumber.value >= + target.scrollHeight && + state.lastScrollTop - target.scrollTop < 0 && + $event.timeStamp - state.lastScrollToLowerTime > 200 + ) { + trigger('scrolltolower', $event, { + direction: 'bottom', + }) + state.lastScrollToLowerTime = $event.timeStamp + } + } + if (props.scrollX) { + if ( + target.scrollLeft <= upperThresholdNumber.value && + state.lastScrollLeft - target.scrollLeft > 0 && + $event.timeStamp - state.lastScrollToUpperTime > 200 + ) { + trigger('scrolltoupper', $event, { + direction: 'left', + }) + state.lastScrollToUpperTime = $event.timeStamp + } + if ( + target.scrollLeft + target.offsetWidth + lowerThresholdNumber.value >= + target.scrollWidth && + state.lastScrollLeft - target.scrollLeft < 0 && + $event.timeStamp - state.lastScrollToLowerTime > 200 + ) { + trigger('scrolltolower', $event, { + direction: 'right', + }) + state.lastScrollToLowerTime = $event.timeStamp + } + } + state.lastScrollTop = target.scrollTop + state.lastScrollLeft = target.scrollLeft + } + } + function _scrollTopChanged(val: number) { + if (props.scrollY) { + if (_innerSetScrollTop) { + _innerSetScrollTop = false + } else { + if (props.scrollWithAnimation) { + scrollTo(val, 'y') + } else { + main.value!.scrollTop = val + } + } + } + } + function _scrollLeftChanged(val: number) { + if (props.scrollX) { + if (_innerSetScrollLeft) { + _innerSetScrollLeft = false + } else { + if (props.scrollWithAnimation) { + scrollTo(val, 'x') + } else { + main.value!.scrollLeft = val + } + } + } + } + function _scrollIntoViewChanged(val: string) { + if (val) { + if (!/^[_a-zA-Z][-_a-zA-Z0-9:]*$/.test(val)) { + console.error(`id error: scroll-into-view=${val}`) + return + } + var element = rootRef.value!.querySelector('#' + val) + if (element) { + var mainRect = main.value!.getBoundingClientRect() + var elRect = element.getBoundingClientRect() + if (props.scrollX) { + var left = elRect.left - mainRect.left + var scrollLeft = main.value!.scrollLeft + var x = scrollLeft + left + if (props.scrollWithAnimation) { + scrollTo(x, 'x') + } else { + main.value!.scrollLeft = x + } + } + if (props.scrollY) { + var top = elRect.top - mainRect.top + var scrollTop = main.value!.scrollTop + var y = scrollTop + top + if (props.scrollWithAnimation) { + scrollTo(y, 'y') + } else { + main.value!.scrollTop = y + } + } + } + } + } + function _transitionEnd(val: number, type: 'x' | 'y') { + content.value!.style.transition = '' + content.value!.style.webkitTransition = '' + content.value!.style.transform = '' + content.value!.style.webkitTransform = '' + let _main = main.value! + if (type === 'x') { + _main.style.overflowX = props.scrollX ? 'auto' : 'hidden' + _main.scrollLeft = val + } else if (type === 'y') { + _main.style.overflowY = props.scrollY ? 'auto' : 'hidden' + _main.scrollTop = val + } + content.value!.removeEventListener('transitionend', __transitionEnd) + content.value!.removeEventListener('webkitTransitionEnd', __transitionEnd) + } + function _setRefreshState(_state: RefreshState) { + switch (_state) { + case 'refreshing': + state.refresherHeight = props.refresherThreshold + trigger('refresherrefresh', {} as Event, {}) + break + case 'restore': + state.refresherHeight = 0 + trigger('refresherrestore', {} as Event, {}) + break + } + state.refreshState = _state + } + /* function getScrollPosition() { + const _main = main.value! + return { + scrollLeft: _main.scrollLeft, + scrollTop: _main.scrollTop, + scrollHeight: _main.scrollHeight, + scrollWidth: _main.scrollWidth, + } + } */ + + onMounted(() => { + _scrollTopChanged(scrollTopNumber.value) + _scrollLeftChanged(scrollLeftNumber.value) + _scrollIntoViewChanged(props.scrollIntoView) + let __handleScroll = function (event: Event) { + // Unable to preventDefault inside passive event listener invocation. + // event.preventDefault(); + event.stopPropagation() + _handleScroll(event as MouseEvent) + } + let touchStart: { + x: number + y: number + } = { + x: 0, + y: 0, + } + let needStop: boolean | null = null + let __handleTouchMove = function (_event: Event) { + const event = _event as TouchEvent + var x = event.touches[0].pageX + var y = event.touches[0].pageY + var _main = main.value! + if (needStop === null) { + if (Math.abs(x - touchStart.x) > Math.abs(y - touchStart.y)) { + // 横向滑动 + if (self.scrollX) { + if (_main.scrollLeft === 0 && x > touchStart.x) { + needStop = false + return + } else if ( + _main.scrollWidth === _main.offsetWidth + _main.scrollLeft && + x < touchStart.x + ) { + needStop = false + return + } + needStop = true + } else { + needStop = false + } + } else { + // 纵向滑动 + if (self.scrollY) { + if (_main.scrollTop === 0 && y > touchStart.y) { + needStop = false + return + } else if ( + _main.scrollHeight === _main.offsetHeight + _main.scrollTop && + y < touchStart.y + ) { + needStop = false + return + } + needStop = true + } else { + needStop = false + } + } + } + if (needStop) { + event.stopPropagation() + } + + if (props.refresherEnabled && state.refreshState === 'pulling') { + const dy = y - touchStart.y + state.refresherHeight = dy + + let rotate = dy / props.refresherThreshold + if (rotate > 1) { + rotate = 1 + } else { + rotate = rotate * 360 + } + state.refreshRotate = rotate + + trigger('refresherpulling', event, { + deltaY: dy, + }) + } + } + let __handleTouchStart = function (_event: Event) { + const event = _event as TouchEvent + if (event.touches.length === 1) { + disableScrollBounce({ + disable: true, + }) + needStop = null + touchStart = { + x: event.touches[0].pageX, + y: event.touches[0].pageY, + } + if ( + props.refresherEnabled && + state.refreshState !== 'refreshing' && + main.value!.scrollTop === 0 + ) { + state.refreshState = 'pulling' + } + } + } + let __handleTouchEnd = function (_event: Event) { + const event = _event as TouchEvent + touchStart = { + x: 0, + y: 0, + } + disableScrollBounce({ + disable: false, + }) + if (state.refresherHeight >= props.refresherThreshold) { + _setRefreshState('refreshing') + } else { + state.refresherHeight = 0 + trigger('refresherabort', event, {}) + } + } + main.value!.addEventListener( + 'touchstart', + __handleTouchStart, + passiveOptions + ) + main.value!.addEventListener('touchmove', __handleTouchMove, passiveOptions) + main.value!.addEventListener('scroll', __handleScroll, passiveOptions) + main.value!.addEventListener('touchend', __handleTouchEnd, passiveOptions) + initScrollBounce() + + onBeforeUnmount(() => { + main.value!.removeEventListener('touchstart', __handleTouchStart) + main.value!.removeEventListener('touchmove', __handleTouchMove) + main.value!.removeEventListener('scroll', __handleScroll) + main.value!.removeEventListener('touchend', __handleTouchEnd) + }) + }) + + onActivated(() => { + // 还原 scroll-view 滚动位置 + props.scrollY && (main.value!.scrollTop = state.lastScrollTop) + props.scrollX && (main.value!.scrollLeft = state.lastScrollLeft) + }) + + watch(scrollTopNumber, (val) => { + _scrollTopChanged(val) + }) + watch(scrollLeftNumber, (val) => { + _scrollLeftChanged(val) + }) + watch( + () => props.scrollIntoView, + (val) => { + _scrollIntoViewChanged(val) + } + ) + watch( + () => props.refresherTriggered, + (val) => { + // TODO + if (val === true) { + _setRefreshState('refreshing') + } else if (val === false) { + _setRefreshState('restore') + } + } + ) +} diff --git a/packages/uni-components/src/components/scroll-view/index.vue b/packages/uni-components/src/components/scroll-view/index.vue deleted file mode 100644 index 42ffb1e09..000000000 --- a/packages/uni-components/src/components/scroll-view/index.vue +++ /dev/null @@ -1,525 +0,0 @@ - - diff --git a/packages/uni-h5/dist/uni-h5.cjs.js b/packages/uni-h5/dist/uni-h5.cjs.js index 318983e68..8402c7e49 100644 --- a/packages/uni-h5/dist/uni-h5.cjs.js +++ b/packages/uni-h5/dist/uni-h5.cjs.js @@ -867,7 +867,7 @@ function throttle(fn, wait) { }; return newFn; } -const _sfc_main$3 = { +const _sfc_main$2 = { name: "Audio", mixins: [subscriber], props: { @@ -986,13 +986,13 @@ const _sfc_main$3 = { } } }; -const _hoisted_1$2 = {class: "uni-audio-default"}; -const _hoisted_2$2 = {class: "uni-audio-right"}; -const _hoisted_3$2 = {class: "uni-audio-time"}; -const _hoisted_4$2 = {class: "uni-audio-info"}; -const _hoisted_5$1 = {class: "uni-audio-name"}; -const _hoisted_6$1 = {class: "uni-audio-author"}; -function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { +const _hoisted_1$1 = {class: "uni-audio-default"}; +const _hoisted_2$1 = {class: "uni-audio-right"}; +const _hoisted_3$1 = {class: "uni-audio-time"}; +const _hoisted_4$1 = {class: "uni-audio-info"}; +const _hoisted_5 = {class: "uni-audio-name"}; +const _hoisted_6 = {class: "uni-audio-author"}; +function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) { return vue.openBlock(), vue.createBlock("uni-audio", vue.mergeProps({ id: $props.id, controls: !!$props.controls @@ -1002,7 +1002,7 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { loop: $props.loop, style: {"display": "none"} }, null, 8, ["loop"]), - vue.createVNode("div", _hoisted_1$2, [ + vue.createVNode("div", _hoisted_1$1, [ vue.createVNode("div", { style: "background-image: url(" + _ctx.$getRealPath($props.poster) + ");", class: "uni-audio-left" @@ -1012,17 +1012,17 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { onClick: _cache[1] || (_cache[1] = (...args) => $options.trigger && $options.trigger(...args)) }, null, 2) ], 4), - vue.createVNode("div", _hoisted_2$2, [ - vue.createVNode("div", _hoisted_3$2, vue.toDisplayString($data.currentTime), 1), - vue.createVNode("div", _hoisted_4$2, [ - vue.createVNode("div", _hoisted_5$1, vue.toDisplayString($props.name), 1), - vue.createVNode("div", _hoisted_6$1, vue.toDisplayString($props.author), 1) + vue.createVNode("div", _hoisted_2$1, [ + vue.createVNode("div", _hoisted_3$1, vue.toDisplayString($data.currentTime), 1), + vue.createVNode("div", _hoisted_4$1, [ + vue.createVNode("div", _hoisted_5, vue.toDisplayString($props.name), 1), + vue.createVNode("div", _hoisted_6, vue.toDisplayString($props.author), 1) ]) ]) ]) ], 16, ["id", "controls"]); } -_sfc_main$3.render = _sfc_render$3; +_sfc_main$2.render = _sfc_render$2; function converPx(value) { if (/^-?\d+[ur]px$/i.test(value)) { return value.replace(/(^-?\d+)[ur]px$/i, (text, num) => { @@ -1254,7 +1254,7 @@ function normalizeCustomEvent(name, domEvt, el, detail) { }; } const uniFormKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniForm" : "uf"); -var index$w = /* @__PURE__ */ defineBuiltInComponent({ +var index$x = /* @__PURE__ */ defineBuiltInComponent({ name: "Form", setup(_props, { slots, @@ -1294,15 +1294,15 @@ function provideForm(emit2) { return fields2; } const uniLabelKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniLabel" : "ul"); -const props$t = { +const props$u = { for: { type: String, default: "" } }; -var index$v = /* @__PURE__ */ defineBuiltInComponent({ +var index$w = /* @__PURE__ */ defineBuiltInComponent({ name: "Label", - props: props$t, + props: props$u, setup(props2, { slots }) { @@ -1344,7 +1344,7 @@ function useProvideLabel() { }); return handlers; } -var index$u = /* @__PURE__ */ defineBuiltInComponent({ +var index$v = /* @__PURE__ */ defineBuiltInComponent({ name: "Button", props: { id: { @@ -1543,7 +1543,7 @@ function getTempCanvas(width = 0, height = 0) { tempCanvas.height = height; return tempCanvas; } -const props$s = { +const props$t = { canvasId: { type: String, default: "" @@ -1553,13 +1553,13 @@ const props$s = { default: false } }; -var index$t = /* @__PURE__ */ defineBuiltInComponent({ +var index$u = /* @__PURE__ */ defineBuiltInComponent({ inheritAttrs: false, name: "Canvas", compatConfig: { MODE: 3 }, - props: props$s, + props: props$t, computed: { id() { return this.canvasId; @@ -2035,15 +2035,15 @@ function useMethods(canvasRef, actionsWaiting) { }); } const uniCheckGroupKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniCheckGroup" : "ucg"); -const props$r = { +const props$s = { name: { type: String, default: "" } }; -var index$s = /* @__PURE__ */ defineBuiltInComponent({ +var index$t = /* @__PURE__ */ defineBuiltInComponent({ name: "CheckboxGroup", - props: props$r, + props: props$s, emits: ["change"], setup(props2, { emit: emit2, @@ -2095,7 +2095,7 @@ function useProvideCheckGroup(props2, trigger) { } return getFieldsValue; } -const props$q = { +const props$r = { checked: { type: [Boolean, String], default: false @@ -2117,9 +2117,9 @@ const props$q = { default: "" } }; -var index$r = /* @__PURE__ */ defineBuiltInComponent({ +var index$s = /* @__PURE__ */ defineBuiltInComponent({ name: "Checkbox", - props: props$q, + props: props$r, setup(props2, { slots }) { @@ -2188,7 +2188,7 @@ function useCheckboxInject(checkboxChecked, checkboxValue, reset) { let resetTimer; function iosHideKeyboard() { } -const props$p = { +const props$q = { cursorSpacing: { type: [Number, String], default: 0 @@ -2374,7 +2374,7 @@ function useQuill(props2, rootRef, trigger) { } }, id, true); } -const props$o = /* @__PURE__ */ Object.assign({}, props$p, { +const props$p = /* @__PURE__ */ Object.assign({}, props$q, { id: { type: String, default: "" @@ -2400,9 +2400,9 @@ const props$o = /* @__PURE__ */ Object.assign({}, props$p, { default: false } }); -var index$q = /* @__PURE__ */ defineBuiltInComponent({ +var index$r = /* @__PURE__ */ defineBuiltInComponent({ name: "Editor", - props: props$o, + props: props$p, emit: ["ready", "focus", "blur", "input", "statuschange", ...emit$1], setup(props2, { emit: emit2 @@ -2461,7 +2461,7 @@ const ICONS = { c: GREY_COLOR } }; -var index$p = /* @__PURE__ */ defineBuiltInComponent({ +var index$q = /* @__PURE__ */ defineBuiltInComponent({ name: "Icon", props: { type: { @@ -2488,7 +2488,7 @@ var index$p = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$n = { +const props$o = { src: { type: String, default: "" @@ -2525,9 +2525,9 @@ const IMAGE_MODES = { "bottom left": ["left bottom"], "bottom right": ["right bottom"] }; -var index$o = /* @__PURE__ */ defineBuiltInComponent({ +var index$p = /* @__PURE__ */ defineBuiltInComponent({ name: "Image", - props: props$n, + props: props$o, setup(props2, { emit: emit2 }) { @@ -2762,7 +2762,7 @@ const UniViewJSBridgeSubscribe = function() { function getValueString(value) { return value === null ? "" : String(value); } -const props$m = /* @__PURE__ */ Object.assign({}, { +const props$n = /* @__PURE__ */ Object.assign({}, { name: { type: String, default: "" @@ -2827,7 +2827,7 @@ const props$m = /* @__PURE__ */ Object.assign({}, { type: String, default: "done" } -}, props$p); +}, props$q); const emit = [ "input", "focus", @@ -3014,7 +3014,7 @@ function useField(props2, rootRef, emit2, beforeInput) { trigger }; } -const props$l = /* @__PURE__ */ Object.assign({}, props$m, { +const props$m = /* @__PURE__ */ Object.assign({}, props$n, { placeholderClass: { type: String, default: "input-placeholder" @@ -3022,7 +3022,7 @@ const props$l = /* @__PURE__ */ Object.assign({}, props$m, { }); var Input = /* @__PURE__ */ defineBuiltInComponent({ name: "Input", - props: props$l, + props: props$m, emits: ["confirm", ...emit], setup(props2, { emit: emit2 @@ -3178,16 +3178,16 @@ function flatVNode(nodes) { } return array; } -const props$k = { +const props$l = { scaleArea: { type: Boolean, default: false } }; -var index$n = /* @__PURE__ */ defineBuiltInComponent({ +var index$o = /* @__PURE__ */ defineBuiltInComponent({ inheritAttrs: false, name: "MovableArea", - props: props$k, + props: props$l, setup(props2, { slots }) { @@ -3773,7 +3773,7 @@ STD.prototype.reconfigure = function(e2, t2, n) { this._springY.reconfigure(e2, t2, n); this._springScale.reconfigure(e2, t2, n); }; -const props$j = { +const props$k = { direction: { type: String, default: "none" @@ -3827,9 +3827,9 @@ const props$j = { default: true } }; -var index$m = /* @__PURE__ */ defineBuiltInComponent({ +var index$n = /* @__PURE__ */ defineBuiltInComponent({ name: "MovableView", - props: props$j, + props: props$k, emits: ["change", "scale"], setup(props2, { slots, @@ -4201,7 +4201,7 @@ function useMovableViewState(props2, trigger, rootRef) { }; } const OPEN_TYPES = ["navigate", "redirect", "switchTab", "reLaunch", "navigateBack"]; -const props$i = { +const props$j = { hoverClass: { type: String, default: "navigator-hover" @@ -4238,12 +4238,12 @@ const props$i = { default: false } }; -var index$l = /* @__PURE__ */ defineBuiltInComponent({ +var index$m = /* @__PURE__ */ defineBuiltInComponent({ name: "Navigator", compatConfig: { MODE: 3 }, - props: props$i, + props: props$j, setup(props2, { slots }) { @@ -4298,7 +4298,7 @@ var index$l = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$h = { +const props$i = { value: { type: Array, default() { @@ -4345,7 +4345,7 @@ function useState$1(props2) { } var PickerView = /* @__PURE__ */ defineBuiltInComponent({ name: "PickerView", - props: props$h, + props: props$i, emits: ["change", "pickstart", "pickend", "update:value"], setup(props2, { slots, @@ -5190,7 +5190,7 @@ const VALUES = { backgroundColor: "#EBEBEB", activeMode: "backwards" }; -const props$g = { +const props$h = { percent: { type: [Number, String], default: 0, @@ -5237,9 +5237,9 @@ const props$g = { } } }; -var index$k = /* @__PURE__ */ defineBuiltInComponent({ +var index$l = /* @__PURE__ */ defineBuiltInComponent({ name: "Progress", - props: props$g, + props: props$h, setup(props2) { const state = useProgressState(props2); _activeAnimation(state, props2); @@ -5310,15 +5310,15 @@ function _activeAnimation(state, props2) { } } const uniRadioGroupKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniCheckGroup" : "ucg"); -const props$f = { +const props$g = { name: { type: String, default: "" } }; -var index$j = /* @__PURE__ */ defineBuiltInComponent({ +var index$k = /* @__PURE__ */ defineBuiltInComponent({ name: "RadioGroup", - props: props$f, + props: props$g, setup(props2, { emit: emit2, slots @@ -5394,7 +5394,7 @@ function useProvideRadioGroup(props2, trigger) { } return fields2; } -const props$e = { +const props$f = { checked: { type: [Boolean, String], default: false @@ -5416,9 +5416,9 @@ const props$e = { default: "" } }; -var index$i = /* @__PURE__ */ defineBuiltInComponent({ +var index$j = /* @__PURE__ */ defineBuiltInComponent({ name: "Radio", - props: props$e, + props: props$f, setup(props2, { slots }) { @@ -5702,7 +5702,7 @@ function parseNodes(nodes, parentNode) { }); return parentNode; } -const props$d = { +const props$e = { nodes: { type: [Array, String], default: function() { @@ -5710,12 +5710,12 @@ const props$d = { } } }; -var index$h = /* @__PURE__ */ defineBuiltInComponent({ +var index$i = /* @__PURE__ */ defineBuiltInComponent({ name: "RichText", compatConfig: { MODE: 3 }, - props: props$d, + props: props$e, setup(props2) { const rootRef = vue.ref(null); function _renderNodes(nodes) { @@ -5736,482 +5736,318 @@ var index$h = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const passiveOptions = uniShared.passive(true); -const _sfc_main$2 = { - name: "ScrollView", - compatConfig: { - MODE: 3 +uniShared.passive(true); +const props$d = { + scrollX: { + type: [Boolean, String], + default: false }, - props: { - scrollX: { - type: [Boolean, String], - default: false - }, - scrollY: { - type: [Boolean, String], - default: false - }, - upperThreshold: { - type: [Number, String], - default: 50 - }, - lowerThreshold: { - type: [Number, String], - default: 50 - }, - scrollTop: { - type: [Number, String], - default: 0 - }, - scrollLeft: { - type: [Number, String], - default: 0 - }, - scrollIntoView: { - type: String, - default: "" - }, - scrollWithAnimation: { - type: [Boolean, String], - default: false - }, - enableBackToTop: { - type: [Boolean, String], - default: false - }, - refresherEnabled: { - type: [Boolean, String], - default: false - }, - refresherThreshold: { - type: Number, - default: 45 - }, - refresherDefaultStyle: { - type: String, - default: "back" - }, - refresherBackground: { - type: String, - default: "#fff" - }, - refresherTriggered: { - type: [Boolean, String], - default: false - } + scrollY: { + type: [Boolean, String], + default: false }, - data() { - return { - lastScrollTop: this.scrollTopNumber, - lastScrollLeft: this.scrollLeftNumber, - lastScrollToUpperTime: 0, - lastScrollToLowerTime: 0, - refresherHeight: 0, - refreshRotate: 0, - refreshState: "" - }; + upperThreshold: { + type: [Number, String], + default: 50 }, - computed: { - upperThresholdNumber() { - var val = Number(this.upperThreshold); - return isNaN(val) ? 50 : val; - }, - lowerThresholdNumber() { - var val = Number(this.lowerThreshold); - return isNaN(val) ? 50 : val; - }, - scrollTopNumber() { - return Number(this.scrollTop) || 0; - }, - scrollLeftNumber() { - return Number(this.scrollLeft) || 0; - } + lowerThreshold: { + type: [Number, String], + default: 50 }, - watch: { - scrollTopNumber(val) { - this._scrollTopChanged(val); - }, - scrollLeftNumber(val) { - this._scrollLeftChanged(val); - }, - scrollIntoView(val) { - this._scrollIntoViewChanged(val); - }, - refresherTriggered(val) { - if (val === true) { - this._setRefreshState("refreshing"); - } else if (val === false) { - this._setRefreshState("restore"); - } - } + scrollTop: { + type: [Number, String], + default: 0 }, - mounted() { - this.$trigger = useCustomEvent({ - value: this.rootRef - }, this.$emit); - var self = this; - this._attached = true; - this._scrollTopChanged(this.scrollTopNumber); - this._scrollLeftChanged(this.scrollLeftNumber); - this._scrollIntoViewChanged(this.scrollIntoView); - this.__handleScroll = function(event) { - event.stopPropagation(); - self._handleScroll.bind(self, event)(); + scrollLeft: { + type: [Number, String], + default: 0 + }, + scrollIntoView: { + type: String, + default: "" + }, + scrollWithAnimation: { + type: [Boolean, String], + default: false + }, + enableBackToTop: { + type: [Boolean, String], + default: false + }, + refresherEnabled: { + type: [Boolean, String], + default: false + }, + refresherThreshold: { + type: Number, + default: 45 + }, + refresherDefaultStyle: { + type: String, + default: "back" + }, + refresherBackground: { + type: String, + default: "#fff" + }, + refresherTriggered: { + type: [Boolean, String], + default: false + } +}; +var index$h = /* @__PURE__ */ defineBuiltInComponent({ + name: "ScrollView", + compatConfig: { + MODE: 3 + }, + props: props$d, + emits: ["scroll", "scrolltoupper", "scrolltolower", "refresherabort"], + setup(props2, { + emit: emit2, + slots + }) { + const rootRef = vue.ref(null); + const main = vue.ref(null); + const wrap = vue.ref(null); + const content = vue.ref(null); + const refresherinner = vue.ref(null); + const trigger = useCustomEvent(rootRef, emit2); + const { + state, + scrollTopNumber, + scrollLeftNumber + } = useScrollViewState(props2); + useScrollViewLoader(props2, state, scrollTopNumber, scrollLeftNumber, trigger, rootRef, main, content); + return () => { + const { + scrollX, + refresherEnabled, + refresherBackground, + refresherDefaultStyle + } = props2; + const { + refresherHeight, + refreshState, + refreshRotate + } = state; + return vue.createVNode("uni-scroll-view", { + "ref": rootRef + }, [vue.createVNode("div", { + "ref": wrap, + "class": "uni-scroll-view" + }, [vue.createVNode("div", { + "ref": main, + "style": { + overflowX: scrollX ? "auto" : "hidden", + overflowY: scrollY ? "auto" : "hidden" + }, + "class": "uni-scroll-view" + }, [vue.createVNode("div", { + "ref": content, + "class": "uni-scroll-view-content" + }, [refresherEnabled ? vue.createVNode("div", { + "ref": refresherinner, + "style": { + backgroundColor: refresherBackground, + height: refresherHeight + "px" + }, + "class": "uni-scroll-view-refresher" + }, [refresherDefaultStyle !== "none" ? vue.createVNode("div", { + "class": "uni-scroll-view-refresh" + }, [vue.createVNode("div", { + "class": "uni-scroll-view-refresh-inner" + }, [refreshState == "pulling" ? vue.createVNode("svg", { + "style": { + transform: "rotate(" + refreshRotate + "deg)" + }, + "fill": "#2BD009", + "class": "uni-scroll-view-refresh__icon", + "width": "24", + "height": "24", + "viewBox": "0 0 24 24" + }, [vue.createVNode("path", { + "d": "M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" + }, null), vue.createVNode("path", { + "d": "M0 0h24v24H0z", + "fill": "none" + }, null)], 4) : null, refreshState == "refreshing" ? vue.createVNode("svg", { + "class": "uni-scroll-view-refresh__spinner", + "width": "24", + "height": "24", + "viewBox": "25 25 50 50" + }, [vue.createVNode("circle", { + "cx": "50", + "cy": "50", + "r": "20", + "fill": "none", + "style": "color: #2bd009", + "stroke-width": "3" + }, null)]) : null])]) : null, refresherDefaultStyle == "none" ? slots.refresher && slots.refresher() : null], 4) : null, slots.default && slots.default()], 512)], 4)], 512)], 512); }; - var touchStart = null; - var needStop = null; - this.__handleTouchMove = function(event) { - var x = event.touches[0].pageX; - var y = event.touches[0].pageY; - var main = self.main; - if (needStop === null) { - if (Math.abs(x - touchStart.x) > Math.abs(y - touchStart.y)) { - if (self.scrollX) { - if (main.scrollLeft === 0 && x > touchStart.x) { - needStop = false; - return; - } else if (main.scrollWidth === main.offsetWidth + main.scrollLeft && x < touchStart.x) { - needStop = false; - return; - } - needStop = true; - } else { - needStop = false; - } - } else { - if (self.scrollY) { - if (main.scrollTop === 0 && y > touchStart.y) { - needStop = false; - return; - } else if (main.scrollHeight === main.offsetHeight + main.scrollTop && y < touchStart.y) { - needStop = false; - return; - } - needStop = true; - } else { - needStop = false; - } - } + } +}); +function useScrollViewState(props2) { + const scrollTopNumber = vue.computed(() => { + return Number(props2.scrollTop) || 0; + }); + const scrollLeftNumber = vue.computed(() => { + return Number(props2.scrollLeft) || 0; + }); + const state = vue.reactive({ + lastScrollTop: scrollTopNumber.value, + lastScrollLeft: scrollLeftNumber.value, + lastScrollToUpperTime: 0, + lastScrollToLowerTime: 0, + refresherHeight: 0, + refreshRotate: 0, + refreshState: "" + }); + return { + state, + scrollTopNumber, + scrollLeftNumber + }; +} +function useScrollViewLoader(props2, state, scrollTopNumber, scrollLeftNumber, trigger, rootRef, main, content) { + let __transitionEnd = () => { + }; + vue.computed(() => { + var val = Number(props2.upperThreshold); + return isNaN(val) ? 50 : val; + }); + vue.computed(() => { + var val = Number(props2.lowerThreshold); + return isNaN(val) ? 50 : val; + }); + function scrollTo(t2, n) { + var i = main.value; + t2 < 0 ? t2 = 0 : n === "x" && t2 > i.scrollWidth - i.offsetWidth ? t2 = i.scrollWidth - i.offsetWidth : n === "y" && t2 > i.scrollHeight - i.offsetHeight && (t2 = i.scrollHeight - i.offsetHeight); + var r = 0; + var o2 = ""; + n === "x" ? r = i.scrollLeft - t2 : n === "y" && (r = i.scrollTop - t2); + if (r !== 0) { + content.value.style.transition = "transform .3s ease-out"; + content.value.style.webkitTransition = "-webkit-transform .3s ease-out"; + if (n === "x") { + o2 = "translateX(" + r + "px) translateZ(0)"; + } else { + n === "y" && (o2 = "translateY(" + r + "px) translateZ(0)"); } - if (needStop) { - event.stopPropagation(); + content.value.removeEventListener("transitionend", __transitionEnd); + content.value.removeEventListener("webkitTransitionEnd", __transitionEnd); + __transitionEnd = () => _transitionEnd(t2, n); + content.value.addEventListener("transitionend", __transitionEnd); + content.value.addEventListener("webkitTransitionEnd", __transitionEnd); + if (n === "x") { + i.style.overflowX = "hidden"; + } else if (n === "y") { + i.style.overflowY = "hidden"; } - if (self.refresherEnabled && self.refreshState === "pulling") { - const dy = y - touchStart.y; - self.refresherHeight = dy; - let rotate = dy / self.refresherThreshold; - if (rotate > 1) { - rotate = 1; + content.value.style.transform = o2; + content.value.style.webkitTransform = o2; + } + } + function _scrollTopChanged(val) { + if (props2.scrollY) { + { + if (props2.scrollWithAnimation) { + scrollTo(val, "y"); } else { - rotate = rotate * 360; - } - self.refreshRotate = rotate; - self.$trigger("refresherpulling", event, { - deltaY: dy - }); - } - }; - this.__handleTouchStart = function(event) { - if (event.touches.length === 1) { - needStop = null; - touchStart = { - x: event.touches[0].pageX, - y: event.touches[0].pageY - }; - if (self.refresherEnabled && self.refreshState !== "refreshing" && self.main.scrollTop === 0) { - self.refreshState = "pulling"; + main.value.scrollTop = val; } } - }; - this.__handleTouchEnd = function(event) { - touchStart = null; - if (self.refresherHeight >= self.refresherThreshold) { - self._setRefreshState("refreshing"); - } else { - self.refresherHeight = 0; - self.$trigger("refresherabort", event, {}); - } - }; - this.main.addEventListener("touchstart", this.__handleTouchStart, passiveOptions); - this.main.addEventListener("touchmove", this.__handleTouchMove, passiveOptions); - this.main.addEventListener("scroll", this.__handleScroll, passiveOptions); - this.main.addEventListener("touchend", this.__handleTouchEnd, passiveOptions); - }, - activated() { - this.scrollY && (this.main.scrollTop = this.lastScrollTop); - this.scrollX && (this.main.scrollLeft = this.lastScrollLeft); - }, - beforeUnmount() { - this.main.removeEventListener("touchstart", this.__handleTouchStart, passiveOptions); - this.main.removeEventListener("touchmove", this.__handleTouchMove, passiveOptions); - this.main.removeEventListener("scroll", this.__handleScroll, passiveOptions); - this.main.removeEventListener("touchend", this.__handleTouchEnd, passiveOptions); - }, - methods: { - scrollTo: function(t2, n) { - var i = this.main; - t2 < 0 ? t2 = 0 : n === "x" && t2 > i.scrollWidth - i.offsetWidth ? t2 = i.scrollWidth - i.offsetWidth : n === "y" && t2 > i.scrollHeight - i.offsetHeight && (t2 = i.scrollHeight - i.offsetHeight); - var r = 0; - var o2 = ""; - n === "x" ? r = i.scrollLeft - t2 : n === "y" && (r = i.scrollTop - t2); - if (r !== 0) { - this.content.style.transition = "transform .3s ease-out"; - this.content.style.webkitTransition = "-webkit-transform .3s ease-out"; - if (n === "x") { - o2 = "translateX(" + r + "px) translateZ(0)"; + } + } + function _scrollLeftChanged(val) { + if (props2.scrollX) { + { + if (props2.scrollWithAnimation) { + scrollTo(val, "x"); } else { - n === "y" && (o2 = "translateY(" + r + "px) translateZ(0)"); - } - this.content.removeEventListener("transitionend", this.__transitionEnd); - this.content.removeEventListener("webkitTransitionEnd", this.__transitionEnd); - this.__transitionEnd = this._transitionEnd.bind(this, t2, n); - this.content.addEventListener("transitionend", this.__transitionEnd); - this.content.addEventListener("webkitTransitionEnd", this.__transitionEnd); - if (n === "x") { - i.style.overflowX = "hidden"; - } else if (n === "y") { - i.style.overflowY = "hidden"; + main.value.scrollLeft = val; } - this.content.style.transform = o2; - this.content.style.webkitTransform = o2; } - }, - _handleScroll: function($event) { - if (!($event.timeStamp - this._lastScrollTime < 20)) { - this._lastScrollTime = $event.timeStamp; - const target = $event.target; - this.$trigger("scroll", $event, { - scrollLeft: target.scrollLeft, - scrollTop: target.scrollTop, - scrollHeight: target.scrollHeight, - scrollWidth: target.scrollWidth, - deltaX: this.lastScrollLeft - target.scrollLeft, - deltaY: this.lastScrollTop - target.scrollTop - }); - if (this.scrollY) { - if (target.scrollTop <= this.upperThresholdNumber && this.lastScrollTop - target.scrollTop > 0 && $event.timeStamp - this.lastScrollToUpperTime > 200) { - this.$trigger("scrolltoupper", $event, { - direction: "top" - }); - this.lastScrollToUpperTime = $event.timeStamp; - } - if (target.scrollTop + target.offsetHeight + this.lowerThresholdNumber >= target.scrollHeight && this.lastScrollTop - target.scrollTop < 0 && $event.timeStamp - this.lastScrollToLowerTime > 200) { - this.$trigger("scrolltolower", $event, { - direction: "bottom" - }); - this.lastScrollToLowerTime = $event.timeStamp; - } - } - if (this.scrollX) { - if (target.scrollLeft <= this.upperThresholdNumber && this.lastScrollLeft - target.scrollLeft > 0 && $event.timeStamp - this.lastScrollToUpperTime > 200) { - this.$trigger("scrolltoupper", $event, { - direction: "left" - }); - this.lastScrollToUpperTime = $event.timeStamp; - } - if (target.scrollLeft + target.offsetWidth + this.lowerThresholdNumber >= target.scrollWidth && this.lastScrollLeft - target.scrollLeft < 0 && $event.timeStamp - this.lastScrollToLowerTime > 200) { - this.$trigger("scrolltolower", $event, { - direction: "right" - }); - this.lastScrollToLowerTime = $event.timeStamp; - } - } - this.lastScrollTop = target.scrollTop; - this.lastScrollLeft = target.scrollLeft; + } + } + function _scrollIntoViewChanged(val) { + if (val) { + if (!/^[_a-zA-Z][-_a-zA-Z0-9:]*$/.test(val)) { + console.error(`id error: scroll-into-view=${val}`); + return; } - }, - _scrollTopChanged: function(val) { - if (this.scrollY) { - if (this._innerSetScrollTop) { - this._innerSetScrollTop = false; - } else { - if (this.scrollWithAnimation) { - this.scrollTo(val, "y"); + var element = rootRef.value.querySelector("#" + val); + if (element) { + var mainRect = main.value.getBoundingClientRect(); + var elRect = element.getBoundingClientRect(); + if (props2.scrollX) { + var left = elRect.left - mainRect.left; + var scrollLeft = main.value.scrollLeft; + var x = scrollLeft + left; + if (props2.scrollWithAnimation) { + scrollTo(x, "x"); } else { - this.main.scrollTop = val; + main.value.scrollLeft = x; } } - } - }, - _scrollLeftChanged: function(val) { - if (this.scrollX) { - if (this._innerSetScrollLeft) { - this._innerSetScrollLeft = false; - } else { - if (this.scrollWithAnimation) { - this.scrollTo(val, "x"); + if (props2.scrollY) { + var top = elRect.top - mainRect.top; + var scrollTop = main.value.scrollTop; + var y = scrollTop + top; + if (props2.scrollWithAnimation) { + scrollTo(y, "y"); } else { - this.main.scrollLeft = val; - } - } - } - }, - _scrollIntoViewChanged: function(val) { - if (val) { - if (!/^[_a-zA-Z][-_a-zA-Z0-9:]*$/.test(val)) { - console.error(`id error: scroll-into-view=${val}`); - return; - } - var element = this.rootRef.querySelector("#" + val); - if (element) { - var mainRect = this.main.getBoundingClientRect(); - var elRect = element.getBoundingClientRect(); - if (this.scrollX) { - var left = elRect.left - mainRect.left; - var scrollLeft = this.main.scrollLeft; - var x = scrollLeft + left; - if (this.scrollWithAnimation) { - this.scrollTo(x, "x"); - } else { - this.main.scrollLeft = x; - } - } - if (this.scrollY) { - var top = elRect.top - mainRect.top; - var scrollTop = this.main.scrollTop; - var y = scrollTop + top; - if (this.scrollWithAnimation) { - this.scrollTo(y, "y"); - } else { - this.main.scrollTop = y; - } + main.value.scrollTop = y; } } } - }, - _transitionEnd: function(val, type) { - this.content.style.transition = ""; - this.content.style.webkitTransition = ""; - this.content.style.transform = ""; - this.content.style.webkitTransform = ""; - var main = this.main; - if (type === "x") { - main.style.overflowX = this.scrollX ? "auto" : "hidden"; - main.scrollLeft = val; - } else if (type === "y") { - main.style.overflowY = this.scrollY ? "auto" : "hidden"; - main.scrollTop = val; - } - this.content.removeEventListener("transitionend", this.__transitionEnd); - this.content.removeEventListener("webkitTransitionEnd", this.__transitionEnd); - }, - _setRefreshState(state) { - switch (state) { - case "refreshing": - this.refresherHeight = this.refresherThreshold; - this.$trigger("refresherrefresh", {}, {}); - break; - case "restore": - this.refresherHeight = 0; - this.$trigger("refresherrestore", {}, {}); - break; - } - this.refreshState = state; - }, - getScrollPosition() { - const main = this.main; - return { - scrollLeft: main.scrollLeft, - scrollTop: main.scrollTop, - scrollHeight: main.scrollHeight, - scrollWidth: main.scrollWidth - }; } - }, - setup(props2) { - const rootRef = vue.ref(null); - const main = vue.ref(null); - const content = vue.ref(null); - return { - rootRef, - main, - content - }; } -}; -const _hoisted_1$1 = {ref: "rootRef"}; -const _hoisted_2$1 = { - ref: "wrap", - class: "uni-scroll-view" -}; -const _hoisted_3$1 = { - ref: "content", - class: "uni-scroll-view-content" -}; -const _hoisted_4$1 = { - key: 0, - class: "uni-scroll-view-refresh" -}; -const _hoisted_5 = {class: "uni-scroll-view-refresh-inner"}; -const _hoisted_6 = /* @__PURE__ */ vue.createVNode("path", {d: "M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"}, null, -1); -const _hoisted_7 = /* @__PURE__ */ vue.createVNode("path", { - d: "M0 0h24v24H0z", - fill: "none" -}, null, -1); -const _hoisted_8 = { - key: 1, - class: "uni-scroll-view-refresh__spinner", - width: "24", - height: "24", - viewBox: "25 25 50 50" -}; -const _hoisted_9 = /* @__PURE__ */ vue.createVNode("circle", { - cx: "50", - cy: "50", - r: "20", - fill: "none", - style: {"color": "#2bd009"}, - "stroke-width": "3" -}, null, -1); -function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) { - return vue.openBlock(), vue.createBlock("uni-scroll-view", _hoisted_1$1, [ - vue.createVNode("div", _hoisted_2$1, [ - vue.createVNode("div", { - ref: "main", - style: { - "overflow-x": $props.scrollX ? "auto" : "hidden", - "overflow-y": $props.scrollY ? "auto" : "hidden" - }, - class: "uni-scroll-view" - }, [ - vue.createVNode("div", _hoisted_3$1, [ - $props.refresherEnabled ? (vue.openBlock(), vue.createBlock("div", { - key: 0, - ref: "refresherinner", - style: { - "background-color": $props.refresherBackground, - height: $data.refresherHeight + "px" - }, - class: "uni-scroll-view-refresher" - }, [ - $props.refresherDefaultStyle !== "none" ? (vue.openBlock(), vue.createBlock("div", _hoisted_4$1, [ - vue.createVNode("div", _hoisted_5, [ - $data.refreshState == "pulling" ? (vue.openBlock(), vue.createBlock("svg", { - key: 0, - style: {transform: "rotate(" + $data.refreshRotate + "deg)"}, - fill: "#2BD009", - class: "uni-scroll-view-refresh__icon", - width: "24", - height: "24", - viewBox: "0 0 24 24" - }, [ - _hoisted_6, - _hoisted_7 - ], 4)) : vue.createCommentVNode("", true), - $data.refreshState == "refreshing" ? (vue.openBlock(), vue.createBlock("svg", _hoisted_8, [ - _hoisted_9 - ])) : vue.createCommentVNode("", true) - ]) - ])) : vue.createCommentVNode("", true), - $props.refresherDefaultStyle == "none" ? vue.renderSlot(_ctx.$slots, "refresher", {key: 1}) : vue.createCommentVNode("", true) - ], 4)) : vue.createCommentVNode("", true), - vue.renderSlot(_ctx.$slots, "default") - ], 512) - ], 4) - ], 512) - ], 512); + function _transitionEnd(val, type) { + content.value.style.transition = ""; + content.value.style.webkitTransition = ""; + content.value.style.transform = ""; + content.value.style.webkitTransform = ""; + let _main = main.value; + if (type === "x") { + _main.style.overflowX = props2.scrollX ? "auto" : "hidden"; + _main.scrollLeft = val; + } else if (type === "y") { + _main.style.overflowY = props2.scrollY ? "auto" : "hidden"; + _main.scrollTop = val; + } + content.value.removeEventListener("transitionend", __transitionEnd); + content.value.removeEventListener("webkitTransitionEnd", __transitionEnd); + } + function _setRefreshState(_state) { + switch (_state) { + case "refreshing": + state.refresherHeight = props2.refresherThreshold; + trigger("refresherrefresh", {}, {}); + break; + case "restore": + state.refresherHeight = 0; + trigger("refresherrestore", {}, {}); + break; + } + state.refreshState = _state; + } + vue.watch(scrollTopNumber, (val) => { + _scrollTopChanged(val); + }); + vue.watch(scrollLeftNumber, (val) => { + _scrollLeftChanged(val); + }); + vue.watch(() => props2.scrollIntoView, (val) => { + _scrollIntoViewChanged(val); + }); + vue.watch(() => props2.refresherTriggered, (val) => { + if (val === true) { + _setRefreshState("refreshing"); + } else if (val === false) { + _setRefreshState("restore"); + } + }); } -_sfc_main$2.render = _sfc_render$2; const props$c = { name: { type: String, @@ -7102,7 +6938,7 @@ var index$c = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$8 = /* @__PURE__ */ shared.extend({}, props$m, { +const props$8 = /* @__PURE__ */ shared.extend({}, props$n, { placeholderClass: { type: String, default: "input-placeholder" @@ -11322,35 +11158,35 @@ var index = /* @__PURE__ */ defineSystemComponent({ }); exports.AsyncErrorComponent = index$1; exports.AsyncLoadingComponent = index; -exports.Audio = _sfc_main$3; -exports.Button = index$u; -exports.Canvas = index$t; -exports.Checkbox = index$r; -exports.CheckboxGroup = index$s; +exports.Audio = _sfc_main$2; +exports.Button = index$v; +exports.Canvas = index$u; +exports.Checkbox = index$s; +exports.CheckboxGroup = index$t; exports.CoverImage = index$3; exports.CoverView = index$4; -exports.Editor = index$q; -exports.Form = index$w; +exports.Editor = index$r; +exports.Form = index$x; exports.Friction = Friction; -exports.Icon = index$p; -exports.Image = index$o; +exports.Icon = index$q; +exports.Image = index$p; exports.Input = Input; -exports.Label = index$v; +exports.Label = index$w; exports.LayoutComponent = LayoutComponent; exports.Map = index$5; -exports.MovableArea = index$n; -exports.MovableView = index$m; -exports.Navigator = index$l; +exports.MovableArea = index$o; +exports.MovableView = index$n; +exports.Navigator = index$m; exports.PageComponent = index$2; exports.Picker = _sfc_main$1; exports.PickerView = PickerView; exports.PickerViewColumn = PickerViewColumn; -exports.Progress = index$k; -exports.Radio = index$i; -exports.RadioGroup = index$j; +exports.Progress = index$l; +exports.Radio = index$j; +exports.RadioGroup = index$k; exports.ResizeSensor = ResizeSensor; -exports.RichText = index$h; -exports.ScrollView = _sfc_main$2; +exports.RichText = index$i; +exports.ScrollView = index$h; exports.Scroller = Scroller; exports.Slider = index$g; exports.Spring = Spring; diff --git a/packages/uni-h5/dist/uni-h5.es.js b/packages/uni-h5/dist/uni-h5.es.js index 7fef435ac..8da548da6 100644 --- a/packages/uni-h5/dist/uni-h5.es.js +++ b/packages/uni-h5/dist/uni-h5.es.js @@ -1,5 +1,5 @@ import {isFunction, extend, hyphenate, isPlainObject, isString, isArray, hasOwn, isObject, capitalize, toRawType, makeMap as makeMap$1, isPromise, invokeArrayFns as invokeArrayFns$1} from "@vue/shared"; -import {injectHook, withModifiers, createVNode, getCurrentInstance, inject, provide, reactive, openBlock, createBlock, mergeProps, toDisplayString, defineComponent, ref, computed, watch, onUnmounted, onBeforeUnmount, onActivated, onMounted, nextTick, onBeforeMount, withDirectives, vShow, shallowRef, watchEffect, isVNode, Fragment, markRaw, createCommentVNode, renderSlot, createTextVNode, onBeforeActivate, onBeforeDeactivate, renderList, onDeactivated, Teleport, createApp, Transition, resolveComponent, withCtx, KeepAlive, resolveDynamicComponent} from "vue"; +import {injectHook, withModifiers, createVNode, getCurrentInstance, inject, provide, reactive, openBlock, createBlock, mergeProps, toDisplayString, defineComponent, ref, computed, watch, onUnmounted, onBeforeUnmount, onActivated, onMounted, nextTick, onBeforeMount, withDirectives, vShow, shallowRef, watchEffect, isVNode, Fragment, markRaw, createTextVNode, onBeforeActivate, onBeforeDeactivate, renderList, onDeactivated, Teleport, createApp, Transition, resolveComponent, withCtx, createCommentVNode, renderSlot, KeepAlive, resolveDynamicComponent} from "vue"; import {once, passive, normalizeTarget, isBuiltInComponent, initCostomDataset, invokeArrayFns, NAVBAR_HEIGHT, parseQuery, PRIMARY_COLOR, debounce, getCostomDataset, callOptions, removeLeadingSlash, getLen, ON_REACH_BOTTOM_DISTANCE, decodedQuery, updateElementStyle, addFont, scrollTo, formatDateTime} from "@dcloudio/uni-shared"; import {initVueI18n, LOCALE_EN, LOCALE_ES, LOCALE_FR, LOCALE_ZH_HANS, LOCALE_ZH_HANT} from "@dcloudio/uni-i18n"; import {useRoute, createRouter, createWebHistory, createWebHashHistory, useRouter, isNavigationFailure, RouterView} from "vue-router"; @@ -200,9 +200,9 @@ E.prototype = { return this; }, once: function(name, callback, ctx) { - var self = this; + var self2 = this; function listener2() { - self.off(name, listener2); + self2.off(name, listener2); callback.apply(ctx, arguments); } listener2._ = callback; @@ -485,7 +485,7 @@ var safeAreaInsets = { onChange, offChange }; -var out = safeAreaInsets; +var D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out = safeAreaInsets; const onEventPrevent = /* @__PURE__ */ withModifiers(() => { }, ["prevent"]); const onEventStop = /* @__PURE__ */ withModifiers(() => { @@ -497,10 +497,10 @@ function getWindowOffset() { const left = parseInt(style.getPropertyValue("--window-left")); const right = parseInt(style.getPropertyValue("--window-right")); return { - top: top ? top + out.top : 0, - bottom: bottom ? bottom + out.bottom : 0, - left: left ? left + out.left : 0, - right: right ? right + out.right : 0 + top: top ? top + D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top : 0, + bottom: bottom ? bottom + D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.bottom : 0, + left: left ? left + D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.left : 0, + right: right ? right + D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.right : 0 }; } function updateCssVar(cssVars) { @@ -606,8 +606,8 @@ function createScrollListener({ const isReachBottom = () => { const {scrollHeight} = document.documentElement; const windowHeight = window.innerHeight; - const scrollY = window.scrollY; - const isBottom = scrollY > 0 && scrollHeight > windowHeight && scrollY + windowHeight + onReachBottomDistance >= scrollHeight; + const scrollY2 = window.scrollY; + const isBottom = scrollY2 > 0 && scrollHeight > windowHeight && scrollY2 + windowHeight + onReachBottomDistance >= scrollHeight; const heightChanged = Math.abs(scrollHeight - lastScrollHeight) > onReachBottomDistance; if (isBottom && (!hasReachBottom || heightChanged)) { lastScrollHeight = scrollHeight; @@ -1194,7 +1194,7 @@ function normalizePageMeta(pageMeta) { let offset = rpx2px(refreshOptions.offset); const {type} = navigationBar; if (type !== "transparent" && type !== "none") { - offset += NAVBAR_HEIGHT + out.top; + offset += NAVBAR_HEIGHT + D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top; } refreshOptions.offset = offset; refreshOptions.height = rpx2px(refreshOptions.height); @@ -1828,7 +1828,7 @@ function throttle(fn, wait) { }; return newFn; } -const _sfc_main$3 = { +const _sfc_main$2 = { name: "Audio", mixins: [subscriber], props: { @@ -1947,13 +1947,13 @@ const _sfc_main$3 = { } } }; -const _hoisted_1$2 = {class: "uni-audio-default"}; -const _hoisted_2$2 = {class: "uni-audio-right"}; -const _hoisted_3$2 = {class: "uni-audio-time"}; -const _hoisted_4$2 = {class: "uni-audio-info"}; -const _hoisted_5$1 = {class: "uni-audio-name"}; -const _hoisted_6$1 = {class: "uni-audio-author"}; -function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { +const _hoisted_1$1 = {class: "uni-audio-default"}; +const _hoisted_2$1 = {class: "uni-audio-right"}; +const _hoisted_3$1 = {class: "uni-audio-time"}; +const _hoisted_4$1 = {class: "uni-audio-info"}; +const _hoisted_5 = {class: "uni-audio-name"}; +const _hoisted_6 = {class: "uni-audio-author"}; +function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) { return openBlock(), createBlock("uni-audio", mergeProps({ id: $props.id, controls: !!$props.controls @@ -1963,7 +1963,7 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { loop: $props.loop, style: {"display": "none"} }, null, 8, ["loop"]), - createVNode("div", _hoisted_1$2, [ + createVNode("div", _hoisted_1$1, [ createVNode("div", { style: "background-image: url(" + _ctx.$getRealPath($props.poster) + ");", class: "uni-audio-left" @@ -1973,17 +1973,17 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) { onClick: _cache[1] || (_cache[1] = (...args) => $options.trigger && $options.trigger(...args)) }, null, 2) ], 4), - createVNode("div", _hoisted_2$2, [ - createVNode("div", _hoisted_3$2, toDisplayString($data.currentTime), 1), - createVNode("div", _hoisted_4$2, [ - createVNode("div", _hoisted_5$1, toDisplayString($props.name), 1), - createVNode("div", _hoisted_6$1, toDisplayString($props.author), 1) + createVNode("div", _hoisted_2$1, [ + createVNode("div", _hoisted_3$1, toDisplayString($data.currentTime), 1), + createVNode("div", _hoisted_4$1, [ + createVNode("div", _hoisted_5, toDisplayString($props.name), 1), + createVNode("div", _hoisted_6, toDisplayString($props.author), 1) ]) ]) ]) ], 16, ["id", "controls"]); } -_sfc_main$3.render = _sfc_render$3; +_sfc_main$2.render = _sfc_render$2; function converPx(value) { if (/^-?\d+[ur]px$/i.test(value)) { return value.replace(/(^-?\d+)[ur]px$/i, (text2, num) => { @@ -2255,7 +2255,7 @@ function provideForm(emit2) { return fields2; } const uniLabelKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniLabel" : "ul"); -const props$A = { +const props$B = { for: { type: String, default: "" @@ -2263,7 +2263,7 @@ const props$A = { }; var index$s = /* @__PURE__ */ defineBuiltInComponent({ name: "Label", - props: props$A, + props: props$B, setup(props2, { slots }) { @@ -2685,7 +2685,7 @@ function getTempCanvas(width = 0, height = 0) { tempCanvas.height = height; return tempCanvas; } -const props$z = { +const props$A = { canvasId: { type: String, default: "" @@ -2701,7 +2701,7 @@ var index$q = /* @__PURE__ */ defineBuiltInComponent({ compatConfig: { MODE: 3 }, - props: props$z, + props: props$A, computed: { id() { return this.canvasId; @@ -3180,7 +3180,7 @@ function useMethods(canvasRef, actionsWaiting) { }); } const uniCheckGroupKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniCheckGroup" : "ucg"); -const props$y = { +const props$z = { name: { type: String, default: "" @@ -3188,7 +3188,7 @@ const props$y = { }; var index$p = /* @__PURE__ */ defineBuiltInComponent({ name: "CheckboxGroup", - props: props$y, + props: props$z, emits: ["change"], setup(props2, { emit: emit2, @@ -3240,7 +3240,7 @@ function useProvideCheckGroup(props2, trigger) { } return getFieldsValue; } -const props$x = { +const props$y = { checked: { type: [Boolean, String], default: false @@ -3264,7 +3264,7 @@ const props$x = { }; var index$o = /* @__PURE__ */ defineBuiltInComponent({ name: "Checkbox", - props: props$x, + props: props$y, setup(props2, { slots }) { @@ -3343,7 +3343,7 @@ function useCheckboxInject(checkboxChecked, checkboxValue, reset) { let resetTimer; function iosHideKeyboard() { } -const props$w = { +const props$x = { cursorSpacing: { type: [Number, String], default: 0 @@ -4093,7 +4093,7 @@ function useQuill(props2, rootRef, trigger) { } }, id2, true); } -const props$v = /* @__PURE__ */ Object.assign({}, props$w, { +const props$w = /* @__PURE__ */ Object.assign({}, props$x, { id: { type: String, default: "" @@ -4121,7 +4121,7 @@ const props$v = /* @__PURE__ */ Object.assign({}, props$w, { }); var index$n = /* @__PURE__ */ defineBuiltInComponent({ name: "Editor", - props: props$v, + props: props$w, emit: ["ready", "focus", "blur", "input", "statuschange", ...emit$1], setup(props2, { emit: emit2 @@ -4208,7 +4208,7 @@ var index$m = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$u = { +const props$v = { src: { type: String, default: "" @@ -4247,7 +4247,7 @@ const IMAGE_MODES = { }; var index$l = /* @__PURE__ */ defineBuiltInComponent({ name: "Image", - props: props$u, + props: props$v, setup(props2, { emit: emit2 }) { @@ -4549,7 +4549,7 @@ const UniViewJSBridgeSubscribe = function() { function getValueString(value) { return value === null ? "" : String(value); } -const props$t = /* @__PURE__ */ Object.assign({}, { +const props$u = /* @__PURE__ */ Object.assign({}, { name: { type: String, default: "" @@ -4614,7 +4614,7 @@ const props$t = /* @__PURE__ */ Object.assign({}, { type: String, default: "done" } -}, props$w); +}, props$x); const emit = [ "input", "focus", @@ -4810,7 +4810,7 @@ function useField(props2, rootRef, emit2, beforeInput) { trigger }; } -const props$s = /* @__PURE__ */ Object.assign({}, props$t, { +const props$t = /* @__PURE__ */ Object.assign({}, props$u, { placeholderClass: { type: String, default: "input-placeholder" @@ -4818,7 +4818,7 @@ const props$s = /* @__PURE__ */ Object.assign({}, props$t, { }); var Input = /* @__PURE__ */ defineBuiltInComponent({ name: "Input", - props: props$s, + props: props$t, emits: ["confirm", ...emit], setup(props2, { emit: emit2 @@ -4974,7 +4974,7 @@ function flatVNode(nodes) { } return array; } -const props$r = { +const props$s = { scaleArea: { type: Boolean, default: false @@ -4983,7 +4983,7 @@ const props$r = { var MovableArea = /* @__PURE__ */ defineBuiltInComponent({ inheritAttrs: false, name: "MovableArea", - props: props$r, + props: props$s, setup(props2, { slots }) { @@ -5584,7 +5584,7 @@ STD.prototype.reconfigure = function(e2, t2, n) { this._springY.reconfigure(e2, t2, n); this._springScale.reconfigure(e2, t2, n); }; -const props$q = { +const props$r = { direction: { type: String, default: "none" @@ -5640,7 +5640,7 @@ const props$q = { }; var MovableView = /* @__PURE__ */ defineBuiltInComponent({ name: "MovableView", - props: props$q, + props: props$r, emits: ["change", "scale"], setup(props2, { slots, @@ -6223,7 +6223,7 @@ function useMovableViewState(props2, trigger, rootRef) { }; } const OPEN_TYPES = ["navigate", "redirect", "switchTab", "reLaunch", "navigateBack"]; -const props$p = { +const props$q = { hoverClass: { type: String, default: "navigator-hover" @@ -6265,7 +6265,7 @@ var index$k = /* @__PURE__ */ defineBuiltInComponent({ compatConfig: { MODE: 3 }, - props: props$p, + props: props$q, setup(props2, { slots }) { @@ -6320,7 +6320,7 @@ var index$k = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$o = { +const props$p = { value: { type: Array, default() { @@ -6367,7 +6367,7 @@ function useState$2(props2) { } var PickerView = /* @__PURE__ */ defineBuiltInComponent({ name: "PickerView", - props: props$o, + props: props$p, emits: ["change", "pickstart", "pickend", "update:value"], setup(props2, { slots, @@ -7293,7 +7293,7 @@ const VALUES = { backgroundColor: "#EBEBEB", activeMode: "backwards" }; -const props$n = { +const props$o = { percent: { type: [Number, String], default: 0, @@ -7342,7 +7342,7 @@ const props$n = { }; var index$j = /* @__PURE__ */ defineBuiltInComponent({ name: "Progress", - props: props$n, + props: props$o, setup(props2) { const state2 = useProgressState(props2); _activeAnimation(state2, props2); @@ -7413,7 +7413,7 @@ function _activeAnimation(state2, props2) { } } const uniRadioGroupKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniCheckGroup" : "ucg"); -const props$m = { +const props$n = { name: { type: String, default: "" @@ -7421,7 +7421,7 @@ const props$m = { }; var index$i = /* @__PURE__ */ defineBuiltInComponent({ name: "RadioGroup", - props: props$m, + props: props$n, setup(props2, { emit: emit2, slots @@ -7497,7 +7497,7 @@ function useProvideRadioGroup(props2, trigger) { } return fields2; } -const props$l = { +const props$m = { checked: { type: [Boolean, String], default: false @@ -7521,7 +7521,7 @@ const props$l = { }; var index$h = /* @__PURE__ */ defineBuiltInComponent({ name: "Radio", - props: props$l, + props: props$m, setup(props2, { slots }) { @@ -7815,7 +7815,7 @@ function parseNodes(nodes, parentNode) { }); return parentNode; } -const props$k = { +const props$l = { nodes: { type: [Array, String], default: function() { @@ -7828,7 +7828,7 @@ var index$g = /* @__PURE__ */ defineBuiltInComponent({ compatConfig: { MODE: 3 }, - props: props$k, + props: props$l, setup(props2) { const rootRef = ref(null); function _renderNodes(nodes) { @@ -7853,140 +7853,370 @@ var index$g = /* @__PURE__ */ defineBuiltInComponent({ } }); const passiveOptions = passive(true); -const _sfc_main$2 = { +const props$k = { + scrollX: { + type: [Boolean, String], + default: false + }, + scrollY: { + type: [Boolean, String], + default: false + }, + upperThreshold: { + type: [Number, String], + default: 50 + }, + lowerThreshold: { + type: [Number, String], + default: 50 + }, + scrollTop: { + type: [Number, String], + default: 0 + }, + scrollLeft: { + type: [Number, String], + default: 0 + }, + scrollIntoView: { + type: String, + default: "" + }, + scrollWithAnimation: { + type: [Boolean, String], + default: false + }, + enableBackToTop: { + type: [Boolean, String], + default: false + }, + refresherEnabled: { + type: [Boolean, String], + default: false + }, + refresherThreshold: { + type: Number, + default: 45 + }, + refresherDefaultStyle: { + type: String, + default: "back" + }, + refresherBackground: { + type: String, + default: "#fff" + }, + refresherTriggered: { + type: [Boolean, String], + default: false + } +}; +var ScrollView = /* @__PURE__ */ defineBuiltInComponent({ name: "ScrollView", compatConfig: { MODE: 3 }, - props: { - scrollX: { - type: [Boolean, String], - default: false - }, - scrollY: { - type: [Boolean, String], - default: false - }, - upperThreshold: { - type: [Number, String], - default: 50 - }, - lowerThreshold: { - type: [Number, String], - default: 50 - }, - scrollTop: { - type: [Number, String], - default: 0 - }, - scrollLeft: { - type: [Number, String], - default: 0 - }, - scrollIntoView: { - type: String, - default: "" - }, - scrollWithAnimation: { - type: [Boolean, String], - default: false - }, - enableBackToTop: { - type: [Boolean, String], - default: false - }, - refresherEnabled: { - type: [Boolean, String], - default: false - }, - refresherThreshold: { - type: Number, - default: 45 - }, - refresherDefaultStyle: { - type: String, - default: "back" - }, - refresherBackground: { - type: String, - default: "#fff" - }, - refresherTriggered: { - type: [Boolean, String], - default: false - } - }, - data() { - return { - lastScrollTop: this.scrollTopNumber, - lastScrollLeft: this.scrollLeftNumber, - lastScrollToUpperTime: 0, - lastScrollToLowerTime: 0, - refresherHeight: 0, - refreshRotate: 0, - refreshState: "" + props: props$k, + emits: ["scroll", "scrolltoupper", "scrolltolower", "refresherabort"], + setup(props2, { + emit: emit2, + slots + }) { + const rootRef = ref(null); + const main = ref(null); + const wrap = ref(null); + const content = ref(null); + const refresherinner = ref(null); + const trigger = useCustomEvent(rootRef, emit2); + const { + state: state2, + scrollTopNumber, + scrollLeftNumber + } = useScrollViewState(props2); + useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber, trigger, rootRef, main, content); + return () => { + const { + scrollX, + refresherEnabled, + refresherBackground, + refresherDefaultStyle + } = props2; + const { + refresherHeight, + refreshState, + refreshRotate + } = state2; + return createVNode("uni-scroll-view", { + "ref": rootRef + }, [createVNode("div", { + "ref": wrap, + "class": "uni-scroll-view" + }, [createVNode("div", { + "ref": main, + "style": { + overflowX: scrollX ? "auto" : "hidden", + overflowY: scrollY ? "auto" : "hidden" + }, + "class": "uni-scroll-view" + }, [createVNode("div", { + "ref": content, + "class": "uni-scroll-view-content" + }, [refresherEnabled ? createVNode("div", { + "ref": refresherinner, + "style": { + backgroundColor: refresherBackground, + height: refresherHeight + "px" + }, + "class": "uni-scroll-view-refresher" + }, [refresherDefaultStyle !== "none" ? createVNode("div", { + "class": "uni-scroll-view-refresh" + }, [createVNode("div", { + "class": "uni-scroll-view-refresh-inner" + }, [refreshState == "pulling" ? createVNode("svg", { + "style": { + transform: "rotate(" + refreshRotate + "deg)" + }, + "fill": "#2BD009", + "class": "uni-scroll-view-refresh__icon", + "width": "24", + "height": "24", + "viewBox": "0 0 24 24" + }, [createVNode("path", { + "d": "M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" + }, null), createVNode("path", { + "d": "M0 0h24v24H0z", + "fill": "none" + }, null)], 4) : null, refreshState == "refreshing" ? createVNode("svg", { + "class": "uni-scroll-view-refresh__spinner", + "width": "24", + "height": "24", + "viewBox": "25 25 50 50" + }, [createVNode("circle", { + "cx": "50", + "cy": "50", + "r": "20", + "fill": "none", + "style": "color: #2bd009", + "stroke-width": "3" + }, null)]) : null])]) : null, refresherDefaultStyle == "none" ? slots.refresher && slots.refresher() : null], 4) : null, slots.default && slots.default()], 512)], 4)], 512)], 512); }; - }, - computed: { - upperThresholdNumber() { - var val = Number(this.upperThreshold); - return isNaN(val) ? 50 : val; - }, - lowerThresholdNumber() { - var val = Number(this.lowerThreshold); - return isNaN(val) ? 50 : val; - }, - scrollTopNumber() { - return Number(this.scrollTop) || 0; - }, - scrollLeftNumber() { - return Number(this.scrollLeft) || 0; + } +}); +function useScrollViewState(props2) { + const scrollTopNumber = computed(() => { + return Number(props2.scrollTop) || 0; + }); + const scrollLeftNumber = computed(() => { + return Number(props2.scrollLeft) || 0; + }); + const state2 = reactive({ + lastScrollTop: scrollTopNumber.value, + lastScrollLeft: scrollLeftNumber.value, + lastScrollToUpperTime: 0, + lastScrollToLowerTime: 0, + refresherHeight: 0, + refreshRotate: 0, + refreshState: "" + }); + return { + state: state2, + scrollTopNumber, + scrollLeftNumber + }; +} +function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber, trigger, rootRef, main, content) { + let _lastScrollTime = 0; + let __transitionEnd = () => { + }; + const upperThresholdNumber = computed(() => { + var val = Number(props2.upperThreshold); + return isNaN(val) ? 50 : val; + }); + const lowerThresholdNumber = computed(() => { + var val = Number(props2.lowerThreshold); + return isNaN(val) ? 50 : val; + }); + function scrollTo2(t2, n) { + var i = main.value; + t2 < 0 ? t2 = 0 : n === "x" && t2 > i.scrollWidth - i.offsetWidth ? t2 = i.scrollWidth - i.offsetWidth : n === "y" && t2 > i.scrollHeight - i.offsetHeight && (t2 = i.scrollHeight - i.offsetHeight); + var r = 0; + var o2 = ""; + n === "x" ? r = i.scrollLeft - t2 : n === "y" && (r = i.scrollTop - t2); + if (r !== 0) { + content.value.style.transition = "transform .3s ease-out"; + content.value.style.webkitTransition = "-webkit-transform .3s ease-out"; + if (n === "x") { + o2 = "translateX(" + r + "px) translateZ(0)"; + } else { + n === "y" && (o2 = "translateY(" + r + "px) translateZ(0)"); + } + content.value.removeEventListener("transitionend", __transitionEnd); + content.value.removeEventListener("webkitTransitionEnd", __transitionEnd); + __transitionEnd = () => _transitionEnd(t2, n); + content.value.addEventListener("transitionend", __transitionEnd); + content.value.addEventListener("webkitTransitionEnd", __transitionEnd); + if (n === "x") { + i.style.overflowX = "hidden"; + } else if (n === "y") { + i.style.overflowY = "hidden"; + } + content.value.style.transform = o2; + content.value.style.webkitTransform = o2; + } + } + function _handleScroll($event) { + if ($event.timeStamp - _lastScrollTime > 20) { + _lastScrollTime = $event.timeStamp; + const target = $event.target; + trigger("scroll", $event, { + scrollLeft: target.scrollLeft, + scrollTop: target.scrollTop, + scrollHeight: target.scrollHeight, + scrollWidth: target.scrollWidth, + deltaX: state2.lastScrollLeft - target.scrollLeft, + deltaY: state2.lastScrollTop - target.scrollTop + }); + if (props2.scrollY) { + if (target.scrollTop <= upperThresholdNumber.value && state2.lastScrollTop - target.scrollTop > 0 && $event.timeStamp - state2.lastScrollToUpperTime > 200) { + trigger("scrolltoupper", $event, { + direction: "top" + }); + state2.lastScrollToUpperTime = $event.timeStamp; + } + if (target.scrollTop + target.offsetHeight + lowerThresholdNumber.value >= target.scrollHeight && state2.lastScrollTop - target.scrollTop < 0 && $event.timeStamp - state2.lastScrollToLowerTime > 200) { + trigger("scrolltolower", $event, { + direction: "bottom" + }); + state2.lastScrollToLowerTime = $event.timeStamp; + } + } + if (props2.scrollX) { + if (target.scrollLeft <= upperThresholdNumber.value && state2.lastScrollLeft - target.scrollLeft > 0 && $event.timeStamp - state2.lastScrollToUpperTime > 200) { + trigger("scrolltoupper", $event, { + direction: "left" + }); + state2.lastScrollToUpperTime = $event.timeStamp; + } + if (target.scrollLeft + target.offsetWidth + lowerThresholdNumber.value >= target.scrollWidth && state2.lastScrollLeft - target.scrollLeft < 0 && $event.timeStamp - state2.lastScrollToLowerTime > 200) { + trigger("scrolltolower", $event, { + direction: "right" + }); + state2.lastScrollToLowerTime = $event.timeStamp; + } + } + state2.lastScrollTop = target.scrollTop; + state2.lastScrollLeft = target.scrollLeft; } - }, - watch: { - scrollTopNumber(val) { - this._scrollTopChanged(val); - }, - scrollLeftNumber(val) { - this._scrollLeftChanged(val); - }, - scrollIntoView(val) { - this._scrollIntoViewChanged(val); - }, - refresherTriggered(val) { - if (val === true) { - this._setRefreshState("refreshing"); - } else if (val === false) { - this._setRefreshState("restore"); + } + function _scrollTopChanged(val) { + if (props2.scrollY) { + { + if (props2.scrollWithAnimation) { + scrollTo2(val, "y"); + } else { + main.value.scrollTop = val; + } } } - }, - mounted() { - this.$trigger = useCustomEvent({ - value: this.rootRef - }, this.$emit); - var self = this; - this._attached = true; - this._scrollTopChanged(this.scrollTopNumber); - this._scrollLeftChanged(this.scrollLeftNumber); - this._scrollIntoViewChanged(this.scrollIntoView); - this.__handleScroll = function(event) { + } + function _scrollLeftChanged(val) { + if (props2.scrollX) { + { + if (props2.scrollWithAnimation) { + scrollTo2(val, "x"); + } else { + main.value.scrollLeft = val; + } + } + } + } + function _scrollIntoViewChanged(val) { + if (val) { + if (!/^[_a-zA-Z][-_a-zA-Z0-9:]*$/.test(val)) { + console.error(`id error: scroll-into-view=${val}`); + return; + } + var element = rootRef.value.querySelector("#" + val); + if (element) { + var mainRect = main.value.getBoundingClientRect(); + var elRect = element.getBoundingClientRect(); + if (props2.scrollX) { + var left = elRect.left - mainRect.left; + var scrollLeft = main.value.scrollLeft; + var x = scrollLeft + left; + if (props2.scrollWithAnimation) { + scrollTo2(x, "x"); + } else { + main.value.scrollLeft = x; + } + } + if (props2.scrollY) { + var top = elRect.top - mainRect.top; + var scrollTop = main.value.scrollTop; + var y = scrollTop + top; + if (props2.scrollWithAnimation) { + scrollTo2(y, "y"); + } else { + main.value.scrollTop = y; + } + } + } + } + } + function _transitionEnd(val, type) { + content.value.style.transition = ""; + content.value.style.webkitTransition = ""; + content.value.style.transform = ""; + content.value.style.webkitTransform = ""; + let _main = main.value; + if (type === "x") { + _main.style.overflowX = props2.scrollX ? "auto" : "hidden"; + _main.scrollLeft = val; + } else if (type === "y") { + _main.style.overflowY = props2.scrollY ? "auto" : "hidden"; + _main.scrollTop = val; + } + content.value.removeEventListener("transitionend", __transitionEnd); + content.value.removeEventListener("webkitTransitionEnd", __transitionEnd); + } + function _setRefreshState(_state) { + switch (_state) { + case "refreshing": + state2.refresherHeight = props2.refresherThreshold; + trigger("refresherrefresh", {}, {}); + break; + case "restore": + state2.refresherHeight = 0; + trigger("refresherrestore", {}, {}); + break; + } + state2.refreshState = _state; + } + onMounted(() => { + _scrollTopChanged(scrollTopNumber.value); + _scrollLeftChanged(scrollLeftNumber.value); + _scrollIntoViewChanged(props2.scrollIntoView); + let __handleScroll = function(event) { event.stopPropagation(); - self._handleScroll.bind(self, event)(); + _handleScroll(event); + }; + let touchStart = { + x: 0, + y: 0 }; - var touchStart = null; - var needStop = null; - this.__handleTouchMove = function(event) { + let needStop = null; + let __handleTouchMove = function(_event) { + const event = _event; var x = event.touches[0].pageX; var y = event.touches[0].pageY; - var main = self.main; + var _main = main.value; if (needStop === null) { if (Math.abs(x - touchStart.x) > Math.abs(y - touchStart.y)) { if (self.scrollX) { - if (main.scrollLeft === 0 && x > touchStart.x) { + if (_main.scrollLeft === 0 && x > touchStart.x) { needStop = false; return; - } else if (main.scrollWidth === main.offsetWidth + main.scrollLeft && x < touchStart.x) { + } else if (_main.scrollWidth === _main.offsetWidth + _main.scrollLeft && x < touchStart.x) { needStop = false; return; } @@ -7996,10 +8226,10 @@ const _sfc_main$2 = { } } else { if (self.scrollY) { - if (main.scrollTop === 0 && y > touchStart.y) { + if (_main.scrollTop === 0 && y > touchStart.y) { needStop = false; return; - } else if (main.scrollHeight === main.offsetHeight + main.scrollTop && y < touchStart.y) { + } else if (_main.scrollHeight === _main.offsetHeight + _main.scrollTop && y < touchStart.y) { needStop = false; return; } @@ -8012,322 +8242,79 @@ const _sfc_main$2 = { if (needStop) { event.stopPropagation(); } - if (self.refresherEnabled && self.refreshState === "pulling") { + if (props2.refresherEnabled && state2.refreshState === "pulling") { const dy = y - touchStart.y; - self.refresherHeight = dy; - let rotate = dy / self.refresherThreshold; + state2.refresherHeight = dy; + let rotate = dy / props2.refresherThreshold; if (rotate > 1) { rotate = 1; } else { rotate = rotate * 360; } - self.refreshRotate = rotate; - self.$trigger("refresherpulling", event, { + state2.refreshRotate = rotate; + trigger("refresherpulling", event, { deltaY: dy }); } }; - this.__handleTouchStart = function(event) { + let __handleTouchStart = function(_event) { + const event = _event; if (event.touches.length === 1) { needStop = null; touchStart = { x: event.touches[0].pageX, y: event.touches[0].pageY }; - if (self.refresherEnabled && self.refreshState !== "refreshing" && self.main.scrollTop === 0) { - self.refreshState = "pulling"; + if (props2.refresherEnabled && state2.refreshState !== "refreshing" && main.value.scrollTop === 0) { + state2.refreshState = "pulling"; } } }; - this.__handleTouchEnd = function(event) { - touchStart = null; - if (self.refresherHeight >= self.refresherThreshold) { - self._setRefreshState("refreshing"); + let __handleTouchEnd = function(_event) { + const event = _event; + touchStart = { + x: 0, + y: 0 + }; + if (state2.refresherHeight >= props2.refresherThreshold) { + _setRefreshState("refreshing"); } else { - self.refresherHeight = 0; - self.$trigger("refresherabort", event, {}); + state2.refresherHeight = 0; + trigger("refresherabort", event, {}); } }; - this.main.addEventListener("touchstart", this.__handleTouchStart, passiveOptions); - this.main.addEventListener("touchmove", this.__handleTouchMove, passiveOptions); - this.main.addEventListener("scroll", this.__handleScroll, passiveOptions); - this.main.addEventListener("touchend", this.__handleTouchEnd, passiveOptions); - }, - activated() { - this.scrollY && (this.main.scrollTop = this.lastScrollTop); - this.scrollX && (this.main.scrollLeft = this.lastScrollLeft); - }, - beforeUnmount() { - this.main.removeEventListener("touchstart", this.__handleTouchStart, passiveOptions); - this.main.removeEventListener("touchmove", this.__handleTouchMove, passiveOptions); - this.main.removeEventListener("scroll", this.__handleScroll, passiveOptions); - this.main.removeEventListener("touchend", this.__handleTouchEnd, passiveOptions); - }, - methods: { - scrollTo: function(t2, n) { - var i = this.main; - t2 < 0 ? t2 = 0 : n === "x" && t2 > i.scrollWidth - i.offsetWidth ? t2 = i.scrollWidth - i.offsetWidth : n === "y" && t2 > i.scrollHeight - i.offsetHeight && (t2 = i.scrollHeight - i.offsetHeight); - var r = 0; - var o2 = ""; - n === "x" ? r = i.scrollLeft - t2 : n === "y" && (r = i.scrollTop - t2); - if (r !== 0) { - this.content.style.transition = "transform .3s ease-out"; - this.content.style.webkitTransition = "-webkit-transform .3s ease-out"; - if (n === "x") { - o2 = "translateX(" + r + "px) translateZ(0)"; - } else { - n === "y" && (o2 = "translateY(" + r + "px) translateZ(0)"); - } - this.content.removeEventListener("transitionend", this.__transitionEnd); - this.content.removeEventListener("webkitTransitionEnd", this.__transitionEnd); - this.__transitionEnd = this._transitionEnd.bind(this, t2, n); - this.content.addEventListener("transitionend", this.__transitionEnd); - this.content.addEventListener("webkitTransitionEnd", this.__transitionEnd); - if (n === "x") { - i.style.overflowX = "hidden"; - } else if (n === "y") { - i.style.overflowY = "hidden"; - } - this.content.style.transform = o2; - this.content.style.webkitTransform = o2; - } - }, - _handleScroll: function($event) { - if (!($event.timeStamp - this._lastScrollTime < 20)) { - this._lastScrollTime = $event.timeStamp; - const target = $event.target; - this.$trigger("scroll", $event, { - scrollLeft: target.scrollLeft, - scrollTop: target.scrollTop, - scrollHeight: target.scrollHeight, - scrollWidth: target.scrollWidth, - deltaX: this.lastScrollLeft - target.scrollLeft, - deltaY: this.lastScrollTop - target.scrollTop - }); - if (this.scrollY) { - if (target.scrollTop <= this.upperThresholdNumber && this.lastScrollTop - target.scrollTop > 0 && $event.timeStamp - this.lastScrollToUpperTime > 200) { - this.$trigger("scrolltoupper", $event, { - direction: "top" - }); - this.lastScrollToUpperTime = $event.timeStamp; - } - if (target.scrollTop + target.offsetHeight + this.lowerThresholdNumber >= target.scrollHeight && this.lastScrollTop - target.scrollTop < 0 && $event.timeStamp - this.lastScrollToLowerTime > 200) { - this.$trigger("scrolltolower", $event, { - direction: "bottom" - }); - this.lastScrollToLowerTime = $event.timeStamp; - } - } - if (this.scrollX) { - if (target.scrollLeft <= this.upperThresholdNumber && this.lastScrollLeft - target.scrollLeft > 0 && $event.timeStamp - this.lastScrollToUpperTime > 200) { - this.$trigger("scrolltoupper", $event, { - direction: "left" - }); - this.lastScrollToUpperTime = $event.timeStamp; - } - if (target.scrollLeft + target.offsetWidth + this.lowerThresholdNumber >= target.scrollWidth && this.lastScrollLeft - target.scrollLeft < 0 && $event.timeStamp - this.lastScrollToLowerTime > 200) { - this.$trigger("scrolltolower", $event, { - direction: "right" - }); - this.lastScrollToLowerTime = $event.timeStamp; - } - } - this.lastScrollTop = target.scrollTop; - this.lastScrollLeft = target.scrollLeft; - } - }, - _scrollTopChanged: function(val) { - if (this.scrollY) { - if (this._innerSetScrollTop) { - this._innerSetScrollTop = false; - } else { - if (this.scrollWithAnimation) { - this.scrollTo(val, "y"); - } else { - this.main.scrollTop = val; - } - } - } - }, - _scrollLeftChanged: function(val) { - if (this.scrollX) { - if (this._innerSetScrollLeft) { - this._innerSetScrollLeft = false; - } else { - if (this.scrollWithAnimation) { - this.scrollTo(val, "x"); - } else { - this.main.scrollLeft = val; - } - } - } - }, - _scrollIntoViewChanged: function(val) { - if (val) { - if (!/^[_a-zA-Z][-_a-zA-Z0-9:]*$/.test(val)) { - console.error(`id error: scroll-into-view=${val}`); - return; - } - var element = this.rootRef.querySelector("#" + val); - if (element) { - var mainRect = this.main.getBoundingClientRect(); - var elRect = element.getBoundingClientRect(); - if (this.scrollX) { - var left = elRect.left - mainRect.left; - var scrollLeft = this.main.scrollLeft; - var x = scrollLeft + left; - if (this.scrollWithAnimation) { - this.scrollTo(x, "x"); - } else { - this.main.scrollLeft = x; - } - } - if (this.scrollY) { - var top = elRect.top - mainRect.top; - var scrollTop = this.main.scrollTop; - var y = scrollTop + top; - if (this.scrollWithAnimation) { - this.scrollTo(y, "y"); - } else { - this.main.scrollTop = y; - } - } - } - } - }, - _transitionEnd: function(val, type) { - this.content.style.transition = ""; - this.content.style.webkitTransition = ""; - this.content.style.transform = ""; - this.content.style.webkitTransform = ""; - var main = this.main; - if (type === "x") { - main.style.overflowX = this.scrollX ? "auto" : "hidden"; - main.scrollLeft = val; - } else if (type === "y") { - main.style.overflowY = this.scrollY ? "auto" : "hidden"; - main.scrollTop = val; - } - this.content.removeEventListener("transitionend", this.__transitionEnd); - this.content.removeEventListener("webkitTransitionEnd", this.__transitionEnd); - }, - _setRefreshState(state2) { - switch (state2) { - case "refreshing": - this.refresherHeight = this.refresherThreshold; - this.$trigger("refresherrefresh", {}, {}); - break; - case "restore": - this.refresherHeight = 0; - this.$trigger("refresherrestore", {}, {}); - break; - } - this.refreshState = state2; - }, - getScrollPosition() { - const main = this.main; - return { - scrollLeft: main.scrollLeft, - scrollTop: main.scrollTop, - scrollHeight: main.scrollHeight, - scrollWidth: main.scrollWidth - }; + main.value.addEventListener("touchstart", __handleTouchStart, passiveOptions); + main.value.addEventListener("touchmove", __handleTouchMove, passiveOptions); + main.value.addEventListener("scroll", __handleScroll, passiveOptions); + main.value.addEventListener("touchend", __handleTouchEnd, passiveOptions); + onBeforeUnmount(() => { + main.value.removeEventListener("touchstart", __handleTouchStart); + main.value.removeEventListener("touchmove", __handleTouchMove); + main.value.removeEventListener("scroll", __handleScroll); + main.value.removeEventListener("touchend", __handleTouchEnd); + }); + }); + onActivated(() => { + props2.scrollY && (main.value.scrollTop = state2.lastScrollTop); + props2.scrollX && (main.value.scrollLeft = state2.lastScrollLeft); + }); + watch(scrollTopNumber, (val) => { + _scrollTopChanged(val); + }); + watch(scrollLeftNumber, (val) => { + _scrollLeftChanged(val); + }); + watch(() => props2.scrollIntoView, (val) => { + _scrollIntoViewChanged(val); + }); + watch(() => props2.refresherTriggered, (val) => { + if (val === true) { + _setRefreshState("refreshing"); + } else if (val === false) { + _setRefreshState("restore"); } - }, - setup(props2) { - const rootRef = ref(null); - const main = ref(null); - const content = ref(null); - return { - rootRef, - main, - content - }; - } -}; -const _hoisted_1$1 = {ref: "rootRef"}; -const _hoisted_2$1 = { - ref: "wrap", - class: "uni-scroll-view" -}; -const _hoisted_3$1 = { - ref: "content", - class: "uni-scroll-view-content" -}; -const _hoisted_4$1 = { - key: 0, - class: "uni-scroll-view-refresh" -}; -const _hoisted_5 = {class: "uni-scroll-view-refresh-inner"}; -const _hoisted_6 = /* @__PURE__ */ createVNode("path", {d: "M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"}, null, -1); -const _hoisted_7 = /* @__PURE__ */ createVNode("path", { - d: "M0 0h24v24H0z", - fill: "none" -}, null, -1); -const _hoisted_8 = { - key: 1, - class: "uni-scroll-view-refresh__spinner", - width: "24", - height: "24", - viewBox: "25 25 50 50" -}; -const _hoisted_9 = /* @__PURE__ */ createVNode("circle", { - cx: "50", - cy: "50", - r: "20", - fill: "none", - style: {"color": "#2bd009"}, - "stroke-width": "3" -}, null, -1); -function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) { - return openBlock(), createBlock("uni-scroll-view", _hoisted_1$1, [ - createVNode("div", _hoisted_2$1, [ - createVNode("div", { - ref: "main", - style: { - "overflow-x": $props.scrollX ? "auto" : "hidden", - "overflow-y": $props.scrollY ? "auto" : "hidden" - }, - class: "uni-scroll-view" - }, [ - createVNode("div", _hoisted_3$1, [ - $props.refresherEnabled ? (openBlock(), createBlock("div", { - key: 0, - ref: "refresherinner", - style: { - "background-color": $props.refresherBackground, - height: $data.refresherHeight + "px" - }, - class: "uni-scroll-view-refresher" - }, [ - $props.refresherDefaultStyle !== "none" ? (openBlock(), createBlock("div", _hoisted_4$1, [ - createVNode("div", _hoisted_5, [ - $data.refreshState == "pulling" ? (openBlock(), createBlock("svg", { - key: 0, - style: {transform: "rotate(" + $data.refreshRotate + "deg)"}, - fill: "#2BD009", - class: "uni-scroll-view-refresh__icon", - width: "24", - height: "24", - viewBox: "0 0 24 24" - }, [ - _hoisted_6, - _hoisted_7 - ], 4)) : createCommentVNode("", true), - $data.refreshState == "refreshing" ? (openBlock(), createBlock("svg", _hoisted_8, [ - _hoisted_9 - ])) : createCommentVNode("", true) - ]) - ])) : createCommentVNode("", true), - $props.refresherDefaultStyle == "none" ? renderSlot(_ctx.$slots, "refresher", {key: 1}) : createCommentVNode("", true) - ], 4)) : createCommentVNode("", true), - renderSlot(_ctx.$slots, "default") - ], 512) - ], 4) - ], 512) - ], 512); + }); } -_sfc_main$2.render = _sfc_render$2; const props$j = { name: { type: String, @@ -9371,7 +9358,7 @@ var index$d = /* @__PURE__ */ defineBuiltInComponent({ }; } }); -const props$f = /* @__PURE__ */ extend({}, props$t, { +const props$f = /* @__PURE__ */ extend({}, props$u, { placeholderClass: { type: String, default: "input-placeholder" @@ -10709,7 +10696,7 @@ class CanvasContext { }); } set font(value) { - var self = this; + var self2 = this; this.state.font = value; var fontFormat = value.match(/^(([\w\-]+\s)*)(\d+r?px)(\/(\d+\.?\d*(r?px)?))?\s+(.*)/); if (fontFormat) { @@ -10723,19 +10710,19 @@ class CanvasContext { method: "setFontStyle", data: [value2] }); - self.state.fontStyle = value2; + self2.state.fontStyle = value2; } else if (["bold", "normal"].indexOf(value2) > -1) { actions.push({ method: "setFontWeight", data: [value2] }); - self.state.fontWeight = value2; + self2.state.fontWeight = value2; } else if (index2 === 0) { actions.push({ method: "setFontStyle", data: ["normal"] }); - self.state.fontStyle = "normal"; + self2.state.fontStyle = "normal"; } else if (index2 === 1) { pushAction(); } @@ -10760,7 +10747,7 @@ class CanvasContext { method: "setFontWeight", data: ["normal"] }); - self.state.fontWeight = "normal"; + self2.state.fontWeight = "normal"; } } get font() { @@ -15020,7 +15007,7 @@ const getSystemInfoSync = /* @__PURE__ */ defineSyncApi("getSystemInfoSync", () const windowWidth = getWindowWidth(screenWidth); let windowHeight = window.innerHeight; const language = navigator.language; - const statusBarHeight = out.top; + const statusBarHeight = D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top; let osname; let osversion; let model; @@ -15133,12 +15120,12 @@ const getSystemInfoSync = /* @__PURE__ */ defineSyncApi("getSystemInfoSync", () const system = `${osname} ${osversion}`; const platform = osname.toLocaleLowerCase(); const safeArea = { - left: out.left, - right: windowWidth - out.right, - top: out.top, - bottom: windowHeight - out.bottom, - width: windowWidth - out.left - out.right, - height: windowHeight - out.top - out.bottom + left: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.left, + right: windowWidth - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.right, + top: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top, + bottom: windowHeight - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.bottom, + width: windowWidth - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.left - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.right, + height: windowHeight - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top - D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.bottom }; const {top: windowTop, bottom: windowBottom} = getWindowOffset(); windowHeight -= windowTop; @@ -15158,10 +15145,10 @@ const getSystemInfoSync = /* @__PURE__ */ defineSyncApi("getSystemInfoSync", () model, safeArea, safeAreaInsets: { - top: out.top, - right: out.right, - bottom: out.bottom, - left: out.left + top: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.top, + right: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.right, + bottom: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.bottom, + left: D__DCloud_local_git_uniAppNext_node_modules_safeAreaInsets_out.left } }; }); @@ -16949,7 +16936,7 @@ var LoctaionPicker = /* @__PURE__ */ defineSystemComponent({ state2.searching = false; state2.keyword = ""; } - }, [createTextVNode("\u53D6\u6D88")], 8, ["onClick"])]), createVNode(_sfc_main$2, { + }, [createTextVNode("\u53D6\u6D88")], 8, ["onClick"])]), createVNode(ScrollView, { "scroll-y": true, "class": "list", "onScrolltolower": loadMore @@ -20273,4 +20260,4 @@ var index = /* @__PURE__ */ defineSystemComponent({ return openBlock(), createBlock("div", clazz, [loadingVNode]); } }); -export {$emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$3 as Audio, index$r as Button, index$q as Canvas, index$o as Checkbox, index$p as CheckboxGroup, index$3 as CoverImage, index$4 as CoverView, index$n as Editor, index$t as Form, Friction, index$m as Icon, index$l as Image, Input, index$s as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$k as Navigator, index$2 as PageComponent, _sfc_main$1 as Picker, PickerView, PickerViewColumn, index$j as Progress, index$h as Radio, index$i as RadioGroup, ResizeSensor, index$g as RichText, _sfc_main$2 as ScrollView, Scroller, index$f as Slider, Spring, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$7 as Video, index$b as View, index$6 as WebView, addInterceptor, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, defineBuiltInComponent, defineSystemComponent, disableScrollBounce, downloadFile, getApp$1 as getApp, getContextInfo, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLocation, getNetworkType, getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getVideoInfo, hideKeyboard, hideLoading, hideNavigationBarLoading, hideTabBar, hideTabBarRedDot, hideToast, initScrollBounce, loadFontFace, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onWindowResize, openDocument, openLocation, pageScrollTo, index$8 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeStorage, removeStorageSync, removeTabBarBadge, request, sendSocketMessage, setNavigationBarColor, setNavigationBarTitle, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setupApp, setupPage, showActionSheet, showLoading, showModal, showNavigationBarLoading, showTabBar, showTabBarRedDot, showToast, startAccelerometer, startCompass, startPullDownRefresh, stopAccelerometer, stopCompass, stopPullDownRefresh, switchTab, uni$1 as uni, uniFormKey, uploadFile, upx2px, useAttrs, useBooleanAttr, useContextInfo, useCustomEvent, useNativeEvent, useOn, useScroller, useSubscribe, useTouchtrack, useUserAction, vibrateLong, vibrateShort, withWebEvent}; +export {$emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$2 as Audio, index$r as Button, index$q as Canvas, index$o as Checkbox, index$p as CheckboxGroup, index$3 as CoverImage, index$4 as CoverView, index$n as Editor, index$t as Form, Friction, index$m as Icon, index$l as Image, Input, index$s as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$k as Navigator, index$2 as PageComponent, _sfc_main$1 as Picker, PickerView, PickerViewColumn, index$j as Progress, index$h as Radio, index$i as RadioGroup, ResizeSensor, index$g as RichText, ScrollView, Scroller, index$f as Slider, Spring, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$7 as Video, index$b as View, index$6 as WebView, addInterceptor, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, defineBuiltInComponent, defineSystemComponent, disableScrollBounce, downloadFile, getApp$1 as getApp, getContextInfo, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLocation, getNetworkType, getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getVideoInfo, hideKeyboard, hideLoading, hideNavigationBarLoading, hideTabBar, hideTabBarRedDot, hideToast, initScrollBounce, loadFontFace, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onWindowResize, openDocument, openLocation, pageScrollTo, index$8 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeStorage, removeStorageSync, removeTabBarBadge, request, sendSocketMessage, setNavigationBarColor, setNavigationBarTitle, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setupApp, setupPage, showActionSheet, showLoading, showModal, showNavigationBarLoading, showTabBar, showTabBarRedDot, showToast, startAccelerometer, startCompass, startPullDownRefresh, stopAccelerometer, stopCompass, stopPullDownRefresh, switchTab, uni$1 as uni, uniFormKey, uploadFile, upx2px, useAttrs, useBooleanAttr, useContextInfo, useCustomEvent, useNativeEvent, useOn, useScroller, useSubscribe, useTouchtrack, useUserAction, vibrateLong, vibrateShort, withWebEvent}; -- GitLab