@opentiny/vue-renderless 3.6.0 → 3.6.1-alpha.2

package/image-viewer/vue.js

@@ -1,25 +1,59 @@
-import { computedIsSingle, watchVisible, computedIsFirst, computedIsLast, computedCurrentImg, computedImgStyle, hide, deviceSupportInstall, deviceSupportUninstall, handleImgLoad, handleImgError, handleMouseDown, reset, toggleMode, prev, next, handleActions, handleVisible, getImageWidth, swipeLeft, swipeRight, handleDelete, touchstart, touchmove, touchend, computeZIndex } from './index';
-export var api = ['state', 'zIndex', 'touchstart', 'touchmove', 'touchend', 'urlList', 'hide', 'prev', 'next', 'handleActions', 'toggleMode', 'handleImgLoad', 'handleImgError', 'handleMouseDown', 'handleVisible', 'swipeLeft', 'swipeRight', 'handleDelete'];
-var initState = function initState(_ref) {
-  var reactive = _ref.reactive,
-    computed = _ref.computed,
-    api = _ref.api,
-    mode = _ref.mode,
-    props = _ref.props,
-    constants = _ref.constants;
-  var state = reactive({
-    index: mode == 'pc' ? 0 : props.startPosition,
+import "../chunk-PKUHTIDK.js";
+import {
+  computedIsSingle,
+  watchVisible,
+  computedIsFirst,
+  computedIsLast,
+  computedCurrentImg,
+  computedImgStyle,
+  hide,
+  deviceSupportInstall,
+  deviceSupportUninstall,
+  handleImgLoad,
+  handleImgError,
+  handleMouseDown,
+  reset,
+  toggleMode,
+  prev,
+  next,
+  handleActions,
+  handleVisible,
+  getImageWidth,
+  swipeLeft,
+  swipeRight,
+  handleDelete,
+  touchstart,
+  touchmove,
+  touchend,
+  computeZIndex
+} from "./index";
+const api = [
+  "state",
+  "zIndex",
+  "touchstart",
+  "touchmove",
+  "touchend",
+  "urlList",
+  "hide",
+  "prev",
+  "next",
+  "handleActions",
+  "toggleMode",
+  "handleImgLoad",
+  "handleImgError",
+  "handleMouseDown",
+  "handleVisible",
+  "swipeLeft",
+  "swipeRight",
+  "handleDelete"
+];
+const initState = ({ reactive, computed, api: api2, mode, props, constants }) => {
+  const state = reactive({
+    index: mode == "pc" ? 0 : props.startPosition,
     isShow: false,
     infinite: true,
     loading: false,
-    transform: {
-      scale: 1,
-      deg: 0,
-      offsetX: 0,
-      offsetY: 0,
-      objfit: 'contain',
-      enableTransition: false
-    },
+    transform: { scale: 1, deg: 0, offsetX: 0, offsetY: 0, objfit: "contain", enableTransition: false },
     urlList: props.urlList,
     mode: constants.MODE.CONTAIN,
     previewVisible: props.previewVisible,
@@ -32,212 +66,103 @@ var initState = function initState(_ref) {
     imageTransition: 300,
     imageList: null,
     arrowStyle: null,
-    "delete": false,
-    isLast: computed(function () {
-      return api.computedIsLast();
-    }),
-    isFirst: computed(function () {
-      return api.computedIsFirst();
-    }),
-    isSingle: computed(function () {
-      return api.computedIsSingle();
-    }),
-    imgStyle: computed(function () {
-      return api.computedImgStyle();
-    }),
-    currentImg: computed(function () {
-      return api.computedCurrentImg();
-    }),
-    zIndex: computed(function () {
-      return api.computeZIndex();
-    })
+    delete: false,
+    isLast: computed(() => api2.computedIsLast()),
+    isFirst: computed(() => api2.computedIsFirst()),
+    isSingle: computed(() => api2.computedIsSingle()),
+    imgStyle: computed(() => api2.computedImgStyle()),
+    currentImg: computed(() => api2.computedCurrentImg()),
+    zIndex: computed(() => api2.computeZIndex())
   });
   return state;
 };
-var initApi = function initApi(_ref2) {
-  var api = _ref2.api,
-    state = _ref2.state,
-    props = _ref2.props,
-    parent = _ref2.parent,
-    nextTick = _ref2.nextTick,
-    emit = _ref2.emit,
-    t = _ref2.t,
-    constants = _ref2.constants;
-  Object.assign(api, {
-    state: state,
+const initApi = ({ api: api2, state, props, parent, nextTick, emit, t, constants }) => {
+  Object.assign(api2, {
+    state,
     touchstart: touchstart(state),
     touchmove: touchmove(state),
     touchend: touchend(state),
     reset: reset(state),
-    prev: prev({
-      state: state,
-      props: props
-    }),
-    next: next({
-      state: state,
-      props: props
-    }),
-    getImageWidth: getImageWidth({
-      state: state,
-      parent: parent,
-      props: props,
-      nextTick: nextTick
-    }),
-    handleVisible: handleVisible({
-      state: state,
-      emit: emit,
-      props: props
-    }),
+    prev: prev({ state, props }),
+    next: next({ state, props }),
+    getImageWidth: getImageWidth({ state, parent, props, nextTick }),
+    handleVisible: handleVisible({ state, emit, props }),
     handleActions: handleActions(state),
     handleImgLoad: handleImgLoad(state),
     handleMouseDown: handleMouseDown(state),
     computedIsFirst: computedIsFirst(state),
     computedIsSingle: computedIsSingle(props),
-    handleImgError: handleImgError({
-      state: state,
-      t: t
-    }),
-    computedIsLast: computedIsLast({
-      state: state,
-      props: props
-    }),
+    handleImgError: handleImgError({ state, t }),
+    computedIsLast: computedIsLast({ state, props }),
     watchVisible: watchVisible(state),
     deviceSupportUninstall: deviceSupportUninstall(state),
-    computedCurrentImg: computedCurrentImg({
-      state: state,
-      props: props
-    }),
-    computedImgStyle: computedImgStyle({
-      state: state,
-      constants: constants
-    }),
-    computeZIndex: computeZIndex({
-      constants: constants,
-      props: props
-    }),
-    hide: hide({
-      props: props,
-      api: api
-    }),
-    deviceSupportInstall: deviceSupportInstall({
-      state: state,
-      api: api
-    }),
-    toggleMode: toggleMode({
-      state: state,
-      constants: constants,
-      api: api
-    }),
-    swipeRight: swipeRight({
-      api: api,
-      state: state,
-      emit: emit
-    }),
-    swipeLeft: swipeLeft({
-      api: api,
-      state: state,
-      emit: emit
-    }),
-    handleDelete: handleDelete({
-      api: api,
-      state: state,
-      emit: emit
-    })
+    computedCurrentImg: computedCurrentImg({ state, props }),
+    computedImgStyle: computedImgStyle({ state, constants }),
+    computeZIndex: computeZIndex({ constants, props }),
+    hide: hide({ props, api: api2 }),
+    deviceSupportInstall: deviceSupportInstall({ state, api: api2 }),
+    toggleMode: toggleMode({ state, constants, api: api2 }),
+    swipeRight: swipeRight({ api: api2, state, emit }),
+    swipeLeft: swipeLeft({ api: api2, state, emit }),
+    handleDelete: handleDelete({ api: api2, state, emit })
   });
 };
-var initWatch = function initWatch(_ref3) {
-  var watch = _ref3.watch,
-    state = _ref3.state,
-    api = _ref3.api,
-    props = _ref3.props,
-    nextTick = _ref3.nextTick,
-    vm = _ref3.vm;
-  watch(function () {
-    return state.index;
-  }, function (value) {
-    api.reset();
-    props.onSwitch(value);
-  }, {
-    immediate: true
-  });
-  watch(function () {
-    return props.previewVisible;
-  }, function (value) {
-    api.watchVisible(value);
-    if (props.previewVisible) {
-      nextTick(function () {
-        state.urlList = props.urlList;
-        api.getImageWidth();
-      });
-    }
-  }, {
-    immediate: true
-  });
-  watch(function () {
-    return state.currentImg;
-  }, function (value) {
-    nextTick(function () {
-      var index = state.urlList.indexOf(value);
-      var imageIns = vm.$refs["img_".concat(index)];
-      if (Array.isArray(imageIns)) {
-        imageIns = imageIns[0];
-      }
-      if (imageIns) {
-        state.loading = !imageIns.complete;
+const initWatch = ({ watch, state, api: api2, props, nextTick, vm }) => {
+  watch(
+    () => state.index,
+    (value) => {
+      api2.reset();
+      props.onSwitch(value);
+    },
+    { immediate: true }
+  );
+  watch(
+    () => props.previewVisible,
+    (value) => {
+      api2.watchVisible(value);
+      if (props.previewVisible) {
+        nextTick(() => {
+          state.urlList = props.urlList;
+          api2.getImageWidth();
+        });
       }
-    });
-  }, {
-    immediate: true
-  });
+    },
+    { immediate: true }
+  );
+  watch(
+    () => state.currentImg,
+    (value) => {
+      nextTick(() => {
+        const index = state.urlList.indexOf(value);
+        let imageIns = vm.$refs[`img_${index}`];
+        if (Array.isArray(imageIns)) {
+          imageIns = imageIns[0];
+        }
+        if (imageIns) {
+          state.loading = !imageIns.complete;
+        }
+      });
+    },
+    { immediate: true }
+  );
 };
-export var renderless = function renderless(props, _ref4, _ref5) {
-  var computed = _ref4.computed,
-    onMounted = _ref4.onMounted,
-    onUpdated = _ref4.onUpdated,
-    reactive = _ref4.reactive,
-    watch = _ref4.watch;
-  var t = _ref5.t,
-    parent = _ref5.parent,
-    nextTick = _ref5.nextTick,
-    emit = _ref5.emit,
-    constants = _ref5.constants,
-    vm = _ref5.vm,
-    mode = _ref5.mode;
-  var api = {};
-  var state = initState({
-    reactive: reactive,
-    computed: computed,
-    api: api,
-    mode: mode,
-    props: props,
-    constants: constants
-  });
-  initApi({
-    api: api,
-    state: state,
-    props: props,
-    parent: parent,
-    nextTick: nextTick,
-    emit: emit,
-    t: t,
-    constants: constants
-  });
-  initWatch({
-    watch: watch,
-    state: state,
-    api: api,
-    props: props,
-    nextTick: nextTick,
-    vm: vm
-  });
-  onMounted(api.deviceSupportInstall);
-  onUpdated(function () {
+const renderless = (props, { computed, onMounted, onUpdated, reactive, watch }, { t, parent, nextTick, emit, constants, vm, mode }) => {
+  const api2 = {};
+  const state = initState({ reactive, computed, api: api2, mode, props, constants });
+  initApi({ api: api2, state, props, parent, nextTick, emit, t, constants });
+  initWatch({ watch, state, api: api2, props, nextTick, vm });
+  onMounted(api2.deviceSupportInstall);
+  onUpdated(() => {
     if (props.asyncClose) {
-      setTimeout(function () {
+      setTimeout(() => {
         state.previewVisible = false;
-        emit('update:preview-visible', false);
-      }, 3000);
+        emit("update:preview-visible", false);
+      }, 3e3);
     }
   });
-  return api;
-};
+  return api2;
+};
+export {
+  api,
+  renderless
+};

package/index-bar/index.js

@@ -1,76 +1,67 @@
-export var switchIndex = function switchIndex(index, state, emit) {
+import "../chunk-PKUHTIDK.js";
+const switchIndex = (index, state, emit) => {
   if (index === state.index) {
     return;
   }
-  emit('select', index);
+  emit("select", index);
   state.index = index;
   if (index < state.childrenAnchor.length) {
-    var item = state.childrenAnchor[index];
+    const item = state.childrenAnchor[index];
     document.documentElement.scrollTop = item.offsetTop;
   }
 };
-export var handleTouchDown = function handleTouchDown(_ref) {
-  var state = _ref.state;
-  return function () {
-    state.isMouseDown = true;
-  };
+const handleTouchDown = ({ state }) => () => {
+  state.isMouseDown = true;
 };
-export var handleTouchMove = function handleTouchMove(_ref2) {
-  var emit = _ref2.emit,
-    state = _ref2.state;
-  return function (e) {
-    console.log(e, state.isMouseDown);
-    if (state.isMouseDown && e.target.id) {
-      switchIndex(Number(e.target.id), state, emit);
-    }
-  };
+const handleTouchMove = ({ emit, state }) => (e) => {
+  console.log(e, state.isMouseDown);
+  if (state.isMouseDown && e.target.id) {
+    switchIndex(Number(e.target.id), state, emit);
+  }
 };
-export var handleTouchUp = function handleTouchUp(_ref3) {
-  var state = _ref3.state;
-  return function () {
-    state.isMouseDown = false;
-  };
+const handleTouchUp = ({ state }) => () => {
+  state.isMouseDown = false;
 };
-export var handleIndexClick = function handleIndexClick(_ref4) {
-  var emit = _ref4.emit,
-    state = _ref4.state;
-  return function (value) {
-    switchIndex(value.index, state, emit);
-  };
+const handleIndexClick = ({ emit, state }) => (value) => {
+  switchIndex(value.index, state, emit);
 };
-export var updateAnchorChildren = function updateAnchorChildren(_ref5) {
-  var state = _ref5.state,
-    refs = _ref5.refs;
-  return function () {
-    var node = refs.indexBarContent;
-    if (node) {
-      state.childrenAnchor = [];
-      getAnchorChildren(node, state);
-    }
-  };
+const updateAnchorChildren = ({ state, refs }) => () => {
+  const node = refs.indexBarContent;
+  if (node) {
+    state.childrenAnchor = [];
+    getAnchorChildren(node, state);
+  }
 };
-export var getAnchorChildren = function getAnchorChildren(node, state) {
-  node.childNodes.forEach(function (ele) {
-    if (ele.className === 'tiny-mobile-index-bar-anchor') {
+const getAnchorChildren = (node, state) => {
+  node.childNodes.forEach((ele) => {
+    if (ele.className === "tiny-mobile-index-bar-anchor") {
       state.childrenAnchor.push(ele);
     } else {
       getAnchorChildren(ele, state);
     }
   });
 };
-export var handleScroll = function handleScroll(_ref6) {
-  var state = _ref6.state;
-  return function () {
-    findTopAnchor(state);
-  };
+const handleScroll = ({ state }) => () => {
+  findTopAnchor(state);
 };
-export var findTopAnchor = function findTopAnchor(state) {
-  var scrollTop = document.documentElement.scrollTop;
-  for (var index = 0; index < state.childrenAnchor.length; index++) {
-    var item = state.childrenAnchor[index];
+const findTopAnchor = (state) => {
+  const scrollTop = document.documentElement.scrollTop;
+  for (let index = 0; index < state.childrenAnchor.length; index++) {
+    const item = state.childrenAnchor[index];
     if (item.offsetTop + item.offsetHeight > scrollTop) {
       state.index = index;
       break;
     }
   }
-};
+};
+export {
+  findTopAnchor,
+  getAnchorChildren,
+  handleIndexClick,
+  handleScroll,
+  handleTouchDown,
+  handleTouchMove,
+  handleTouchUp,
+  switchIndex,
+  updateAnchorChildren
+};

package/index-bar/vue.js

@@ -1,87 +1,66 @@
-import { handleScroll, updateAnchorChildren, handleTouchDown, handleTouchMove, handleTouchUp, handleIndexClick } from './index';
-export var api = ['state', 'handleIndexClick', 'handleScroll', 'updateAnchorChildren', 'handleTouchDown', 'handleTouchMove', 'handleTouchUp', 'handleIndexClick'];
-export var renderless = function renderless(props, _ref, _ref2) {
-  var computed = _ref.computed,
-    reactive = _ref.reactive,
-    onMounted = _ref.onMounted,
-    onUnmounted = _ref.onUnmounted,
-    onUpdated = _ref.onUpdated,
-    watch = _ref.watch;
-  var emit = _ref2.emit,
-    parent = _ref2.parent,
-    refs = _ref2.refs;
-  var state = reactive({
+import "../chunk-PKUHTIDK.js";
+import { handleScroll, updateAnchorChildren, handleTouchDown, handleTouchMove, handleTouchUp, handleIndexClick } from "./index";
+const api = [
+  "state",
+  "handleIndexClick",
+  "handleScroll",
+  "updateAnchorChildren",
+  "handleTouchDown",
+  "handleTouchMove",
+  "handleTouchUp",
+  "handleIndexClick"
+];
+const renderless = (props, { computed, reactive, onMounted, onUnmounted, onUpdated, watch }, { emit, parent, refs }) => {
+  const state = reactive({
     index: 0,
     childrenAnchor: [],
     isFistUpdate: true
   });
-  var api = {
-    state: state,
+  const api2 = {
+    state,
     isMouseDown: false,
-    handleScroll: handleScroll({
-      state: state
-    }),
-    updateAnchorChildren: updateAnchorChildren({
-      emit: emit,
-      parent: parent,
-      refs: refs,
-      state: state
-    }),
-    handleTouchDown: handleTouchDown({
-      state: state
-    }),
-    handleTouchMove: handleTouchMove({
-      emit: emit,
-      state: state
-    }),
-    handleTouchUp: handleTouchUp({
-      state: state
-    }),
-    handleIndexClick: handleIndexClick({
-      emit: emit,
-      parent: parent,
-      refs: refs,
-      state: state
-    })
+    handleScroll: handleScroll({ state }),
+    updateAnchorChildren: updateAnchorChildren({ emit, parent, refs, state }),
+    handleTouchDown: handleTouchDown({ state }),
+    handleTouchMove: handleTouchMove({ emit, state }),
+    handleTouchUp: handleTouchUp({ state }),
+    handleIndexClick: handleIndexClick({ emit, parent, refs, state })
   };
-  Object.assign(api, {
-    state: state
+  Object.assign(api2, {
+    state
   });
-  onMounted(function (e) {
-    window.addEventListener('scroll', api.handleScroll);
+  onMounted((e) => {
+    window.addEventListener("scroll", api2.handleScroll);
   });
-  onUnmounted(function () {
-    window.removeEventListener('scroll', api.handleScroll);
+  onUnmounted(() => {
+    window.removeEventListener("scroll", api2.handleScroll);
   });
-  watch(function () {
-    return state.index;
-  }, function (value, oldValue) {
-    var isChange = value !== oldValue && value >= 0 && value < parent.indexList.length;
-    if (isChange) {
-      emit('change', value);
-    }
-  }, {
-    immediate: false
-  });
-  watch(function () {
-    return props.indexList;
-  }, function () {
-    api.updateAnchorChildren({
-      refs: refs,
-      state: state
-    });
-  }, {
-    immediate: false,
-    deep: true
-  });
-  onUpdated(function () {
+  watch(
+    () => state.index,
+    (value, oldValue) => {
+      const isChange = value !== oldValue && value >= 0 && value < parent.indexList.length;
+      if (isChange) {
+        emit("change", value);
+      }
+    },
+    { immediate: false }
+  );
+  watch(
+    () => props.indexList,
+    () => {
+      api2.updateAnchorChildren({ refs, state });
+    },
+    { immediate: false, deep: true }
+  );
+  onUpdated(() => {
     if (state.isFistUpdate) {
       state.isFistUpdate = false;
-      api.updateAnchorChildren({
-        refs: refs,
-        state: state
-      });
+      api2.updateAnchorChildren({ refs, state });
     }
   });
-  return api;
-};
+  return api2;
+};
+export {
+  api,
+  renderless
+};

package/index-bar-anchor/vue.js

@@ -1,20 +1,16 @@
-import './index';
-export var api = ['state'];
-export var renderless = function renderless(props, _ref, _ref2) {
-  var computed = _ref.computed,
-    reactive = _ref.reactive,
-    onMounted = _ref.onMounted,
-    onUpdated = _ref.onUpdated,
-    watch = _ref.watch;
-  var emit = _ref2.emit,
-    parent = _ref2.parent,
-    refs = _ref2.refs;
-  var state = reactive({});
-  var api = {
-    state: state
+import "../chunk-PKUHTIDK.js";
+const api = ["state"];
+const renderless = (props, { computed, reactive, onMounted, onUpdated, watch }, { emit, parent, refs }) => {
+  const state = reactive({});
+  const api2 = {
+    state
   };
-  Object.assign(api, {
-    state: state
+  Object.assign(api2, {
+    state
   });
-  return api;
-};
+  return api2;
+};
+export {
+  api,
+  renderless
+};