vue-devui 1.0.0-beta.2 → 1.0.0-beta.20220808

package/steps-guide/index.es.js

@@ -1,211 +0,0 @@
-import { computed, ref, reactive, nextTick, defineComponent, onMounted, createVNode, Teleport } from "vue";
-var stepsGuide = "";
-const stepsGuideProps = {
-  steps: Array,
-  showClose: {
-    type: Boolean,
-    default: true
-  },
-  showDots: {
-    type: Boolean,
-    default: true
-  }
-};
-function useStepsGuideNav(steps, stepIndex) {
-  const currentStep = computed(() => {
-    const _step = steps[stepIndex.value];
-    _step.position = _step.position || "top";
-    return _step;
-  });
-  const guideClassList = ["d-steps-guide"];
-  const stepsRef = ref(null);
-  const guidePosition = reactive({
-    left: "",
-    top: "",
-    zIndex: 1100
-  });
-  const updateGuidePosition = () => {
-    const baseTop = window.pageYOffset - document.documentElement.clientTop;
-    const baseLeft = window.pageXOffset - document.documentElement.clientLeft;
-    const currentStepPosition = currentStep.value.position;
-    let _left, _top;
-    if (typeof currentStepPosition !== "string") {
-      const { top = 0, left = 0, type = "top" } = currentStepPosition;
-      guideClassList.splice(1, 1, type);
-      _left = left;
-      _top = top;
-    } else {
-      guideClassList.splice(1, 1, currentStepPosition);
-      const stepGuideElement = stepsRef.value;
-      const triggerSelector = currentStep.value.target || currentStep.value.trigger;
-      const triggerElement = document.querySelector(triggerSelector);
-      const targetRect = triggerElement.getBoundingClientRect();
-      _left = targetRect.left + triggerElement.clientWidth / 2 - stepGuideElement.clientWidth / 2 + baseLeft;
-      _top = targetRect.top + triggerElement.clientHeight / 2 - stepGuideElement.clientHeight / 2 + baseTop;
-      const positionTypes = currentStepPosition.split("-");
-      switch (positionTypes[0]) {
-        case "top":
-          _top += -stepGuideElement.clientHeight / 2 - triggerElement.clientHeight;
-          break;
-        case "bottom":
-          _top += stepGuideElement.clientHeight / 2 + triggerElement.clientHeight;
-          break;
-        case "left":
-          _top += stepGuideElement.clientHeight / 2 - triggerElement.clientHeight;
-          _left += -stepGuideElement.clientWidth / 2 - triggerElement.clientWidth / 2;
-          break;
-        case "right":
-          _top += stepGuideElement.clientHeight / 2 - triggerElement.clientHeight;
-          _left += stepGuideElement.clientWidth / 2 + triggerElement.clientWidth / 2;
-          break;
-      }
-      switch (positionTypes[1]) {
-        case "left":
-          _left += stepGuideElement.clientWidth / 2 - triggerElement.clientWidth / 2;
-          break;
-        case "right":
-          _left += -stepGuideElement.clientWidth / 2 + triggerElement.clientWidth / 2;
-          break;
-      }
-    }
-    guidePosition.left = _left + "px";
-    guidePosition.top = _top + "px";
-  };
-  return {
-    currentStep,
-    stepsRef,
-    guidePosition,
-    guideClassList,
-    updateGuidePosition
-  };
-}
-function useStepsGuideCtrl(stepsCount, stepIndex, updateGuidePosition) {
-  const showSteps = ref(true);
-  const closeSteps = () => {
-    showSteps.value = false;
-  };
-  const setCurrentIndex = (index2) => {
-    if (index2 > stepsCount.value || index2 < 0)
-      index2 = 0;
-    stepIndex.value = index2;
-    if (!showSteps.value) {
-      showSteps.value = true;
-      nextTick(() => {
-        updateGuidePosition();
-      });
-    } else {
-      updateGuidePosition();
-    }
-  };
-  return {
-    showSteps,
-    closeSteps,
-    setCurrentIndex
-  };
-}
-var StepsGuide = defineComponent({
-  name: "DStepsGuide",
-  props: stepsGuideProps,
-  emits: [],
-  setup(props, ctx) {
-    const stepsCount = computed(() => props.steps.length - 1);
-    const stepIndex = ref(0);
-    const {
-      currentStep,
-      stepsRef,
-      guidePosition,
-      guideClassList,
-      updateGuidePosition
-    } = useStepsGuideNav(props.steps, stepIndex);
-    const {
-      showSteps,
-      closeSteps,
-      setCurrentIndex
-    } = useStepsGuideCtrl(stepsCount, stepIndex, updateGuidePosition);
-    onMounted(() => {
-      updateGuidePosition();
-    });
-    return {
-      stepsCount,
-      stepIndex,
-      showSteps,
-      guidePosition,
-      guideClassList,
-      stepsRef,
-      currentStep,
-      setCurrentIndex,
-      closeSteps
-    };
-  },
-  render(props) {
-    const {
-      showSteps,
-      guidePosition,
-      guideClassList,
-      currentStep,
-      stepIndex,
-      stepsCount,
-      setCurrentIndex,
-      closeSteps,
-      showClose,
-      showDots
-    } = props;
-    return showSteps ? createVNode(Teleport, {
-      "to": "body"
-    }, {
-      default: () => [createVNode("div", {
-        "style": guidePosition,
-        "class": guideClassList,
-        "ref": "stepsRef"
-      }, [createVNode("div", {
-        "class": "devui-shining-dot"
-      }, null), createVNode("div", {
-        "class": "devui-shining-plus"
-      }, null), createVNode("div", {
-        "class": "devui-arrow"
-      }, null), createVNode("div", {
-        "class": "devui-guide-container"
-      }, [createVNode("p", {
-        "class": "devui-title"
-      }, [currentStep.title]), showClose ? createVNode("div", {
-        "class": "icon icon-close",
-        "onClick": closeSteps
-      }, null) : null, createVNode("div", {
-        "class": "devui-content"
-      }, [currentStep.content]), createVNode("div", {
-        "class": "devui-ctrl"
-      }, [showDots ? createVNode("div", {
-        "class": "devui-dots"
-      }, [props.steps.map((step, index2) => {
-        return createVNode("em", {
-          "class": ["icon icon-dot-status", currentStep === step ? "devui-active" : ""],
-          "key": index2
-        }, null);
-      })]) : null, createVNode("div", {
-        "class": "devui-guide-btn"
-      }, [stepIndex > 0 ? createVNode("div", {
-        "class": "devui-prev-step",
-        "onClick": () => setCurrentIndex(--props.stepIndex)
-      }, ["\u4E0A\u4E00\u6B65"]) : null, stepIndex === stepsCount ? createVNode("div", {
-        "onClick": closeSteps
-      }, ["\u6211\u77E5\u9053\u5566"]) : createVNode("div", {
-        "class": "devui-next-step",
-        "onClick": () => {
-          setCurrentIndex(++props.stepIndex);
-        }
-      }, ["\u6211\u77E5\u9053\u5566,\u7EE7\u7EED"])])])])])]
-    }) : null;
-  }
-});
-StepsGuide.install = function(app) {
-  app.component(StepsGuide.name, StepsGuide);
-};
-var index = {
-  title: "StepsGuide \u64CD\u4F5C\u6307\u5F15",
-  category: "\u5BFC\u822A",
-  status: "50%",
-  install(app) {
-    app.use(StepsGuide);
-  }
-};
-export { StepsGuide, index as default };

package/steps-guide/index.umd.js

@@ -1 +0,0 @@
-(function(u,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(u=typeof globalThis!="undefined"?globalThis:u||self,e(u.index={},u.Vue))})(this,function(u,e){"use strict";var b="";const N={steps:Array,showClose:{type:Boolean,default:!0},showDots:{type:Boolean,default:!0}};function V(t,h){const o=e.computed(()=>{const d=t[h.value];return d.position=d.position||"top",d}),s=["d-steps-guide"],r=e.ref(null),a=e.reactive({left:"",top:"",zIndex:1100});return{currentStep:o,stepsRef:r,guidePosition:a,guideClassList:s,updateGuidePosition:()=>{const d=window.pageYOffset-document.documentElement.clientTop,g=window.pageXOffset-document.documentElement.clientLeft,f=o.value.position;let c,l;if(typeof f!="string"){const{top:i=0,left:C=0,type:n="top"}=f;s.splice(1,1,n),c=C,l=i}else{s.splice(1,1,f);const i=r.value,C=o.value.target||o.value.trigger,n=document.querySelector(C),S=n.getBoundingClientRect();c=S.left+n.clientWidth/2-i.clientWidth/2+g,l=S.top+n.clientHeight/2-i.clientHeight/2+d;const v=f.split("-");switch(v[0]){case"top":l+=-i.clientHeight/2-n.clientHeight;break;case"bottom":l+=i.clientHeight/2+n.clientHeight;break;case"left":l+=i.clientHeight/2-n.clientHeight,c+=-i.clientWidth/2-n.clientWidth/2;break;case"right":l+=i.clientHeight/2-n.clientHeight,c+=i.clientWidth/2+n.clientWidth/2;break}switch(v[1]){case"left":c+=i.clientWidth/2-n.clientWidth/2;break;case"right":c+=-i.clientWidth/2+n.clientWidth/2;break}}a.left=c+"px",a.top=l+"px"}}}function y(t,h,o){const s=e.ref(!0);return{showSteps:s,closeSteps:()=>{s.value=!1},setCurrentIndex:p=>{(p>t.value||p<0)&&(p=0),h.value=p,s.value?o():(s.value=!0,e.nextTick(()=>{o()}))}}}var m=e.defineComponent({name:"DStepsGuide",props:N,emits:[],setup(t,h){const o=e.computed(()=>t.steps.length-1),s=e.ref(0),{currentStep:r,stepsRef:a,guidePosition:p,guideClassList:d,updateGuidePosition:g}=V(t.steps,s),{showSteps:f,closeSteps:c,setCurrentIndex:l}=y(o,s,g);return e.onMounted(()=>{g()}),{stepsCount:o,stepIndex:s,showSteps:f,guidePosition:p,guideClassList:d,stepsRef:a,currentStep:r,setCurrentIndex:l,closeSteps:c}},render(t){const{showSteps:h,guidePosition:o,guideClassList:s,currentStep:r,stepIndex:a,stepsCount:p,setCurrentIndex:d,closeSteps:g,showClose:f,showDots:c}=t;return h?e.createVNode(e.Teleport,{to:"body"},{default:()=>[e.createVNode("div",{style:o,class:s,ref:"stepsRef"},[e.createVNode("div",{class:"devui-shining-dot"},null),e.createVNode("div",{class:"devui-shining-plus"},null),e.createVNode("div",{class:"devui-arrow"},null),e.createVNode("div",{class:"devui-guide-container"},[e.createVNode("p",{class:"devui-title"},[r.title]),f?e.createVNode("div",{class:"icon icon-close",onClick:g},null):null,e.createVNode("div",{class:"devui-content"},[r.content]),e.createVNode("div",{class:"devui-ctrl"},[c?e.createVNode("div",{class:"devui-dots"},[t.steps.map((l,i)=>e.createVNode("em",{class:["icon icon-dot-status",r===l?"devui-active":""],key:i},null))]):null,e.createVNode("div",{class:"devui-guide-btn"},[a>0?e.createVNode("div",{class:"devui-prev-step",onClick:()=>d(--t.stepIndex)},["\u4E0A\u4E00\u6B65"]):null,a===p?e.createVNode("div",{onClick:g},["\u6211\u77E5\u9053\u5566"]):e.createVNode("div",{class:"devui-next-step",onClick:()=>{d(++t.stepIndex)}},["\u6211\u77E5\u9053\u5566,\u7EE7\u7EED"])])])])])]}):null}});m.install=function(t){t.component(m.name,m)};var w={title:"StepsGuide \u64CD\u4F5C\u6307\u5F15",category:"\u5BFC\u822A",status:"50%",install(t){t.use(m)}};u.StepsGuide=m,u.default=w,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});

package/steps-guide/package.json

@@ -1,7 +0,0 @@
-{
-  "name": "steps-guide",
-  "version": "0.0.0",
-  "main": "index.umd.js",
-  "module": "index.es.js",
-  "style": "style.css"
-}

package/steps-guide/style.css

@@ -1 +0,0 @@
-@charset "UTF-8";.d-steps-guide{width:400px;min-height:160px;background:#5e7ce0;box-shadow:var(--devui-shadow-length-feedback-overlay, 0 4px 16px 0) #5170ff4d;border-radius:var(--devui-border-radius-feedback, 4px);font-size:12px;color:#fff;padding:20px;position:absolute}.d-steps-guide .devui-title{font-size:12px;opacity:1;margin:0 0 20px;padding:0}.d-steps-guide>.devui-arrow,.d-steps-guide>.devui-arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.d-steps-guide>.devui-arrow{border-width:8px}.d-steps-guide.left>.devui-arrow{top:23px;right:-6px;margin-top:-3px;border-right-width:0;transform:rotate(-135deg);border-left-color:#5e7ce0}.d-steps-guide.top>.devui-arrow,.d-steps-guide.top-left>.devui-arrow,.d-steps-guide.top-right>.devui-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#5e7ce0;transform:rotate(135deg)}.d-steps-guide.top>.devui-arrow{left:calc(50% - 4px)}.d-steps-guide.top-left>.devui-arrow{left:23px}.d-steps-guide.top-right>.devui-arrow{right:23px;transform:rotate(-135deg)}.d-steps-guide.right>.devui-arrow{top:23px;left:-6px;margin-top:-3px;border-left-width:0;transform:rotate(135deg);border-right-color:#5e7ce0}.d-steps-guide.bottom>.devui-arrow,.d-steps-guide.bottom-left>.devui-arrow,.d-steps-guide.bottom-right>.devui-arrow{top:-6px;margin-left:3px;border-top-width:0;border-bottom-color:#5e7ce0}.d-steps-guide.bottom>.devui-arrow{left:calc(50% - 4px);transform:rotate(-135deg)}.d-steps-guide.bottom-right>.devui-arrow{right:23px;transform:rotate(135deg)}.d-steps-guide.bottom-left>.devui-arrow{left:23px;transform:rotate(-135deg)}.d-steps-guide>.devui-shining-dot,.d-steps-guide .devui-shining-plus{position:absolute;background:#5e7ce0;width:6px;height:6px;border-radius:var(--devui-border-radius-feedback, 4px)}.d-steps-guide.left>.devui-shining-dot,.d-steps-guide.left>.devui-shining-plus{top:21px;right:-30px}.d-steps-guide.right>.devui-shining-dot,.d-steps-guide.right>.devui-shining-plus{top:21px;left:-30px}.d-steps-guide.top>.devui-shining-dot,.d-steps-guide.top>.devui-shining-plus{left:calc(50% - 3px);bottom:-30px}.d-steps-guide.top-left>.devui-shining-dot,.d-steps-guide.top-left>.devui-shining-plus{left:21px;bottom:-30px}.d-steps-guide.top-right>.devui-shining-dot,.d-steps-guide.top-right>.devui-shining-plus{right:21px;bottom:-30px}.d-steps-guide.bottom>.devui-shining-dot,.d-steps-guide.bottom>.devui-shining-plus{left:calc(50% - 3px);top:-30px}.d-steps-guide.bottom-right>.devui-shining-dot,.d-steps-guide.bottom-right>.devui-shining-plus{top:-30px;right:21px}.d-steps-guide.bottom-left>.devui-shining-dot,.d-steps-guide.bottom-left>.devui-shining-plus{top:-30px;left:21px}.d-steps-guide .devui-shining-plus{animation:devui-glow 2s 0s infinite}.d-steps-guide .devui-guide-container{position:relative}.d-steps-guide .devui-guide-container>.icon-close{position:absolute;top:0;right:0;cursor:pointer}.d-steps-guide .devui-guide-container .devui-ctrl{display:flex;flex-wrap:wrap}.d-steps-guide .devui-guide-container .devui-ctrl .devui-dots{color:#fff;position:relative;top:25px;font-size:12px;height:30px}.d-steps-guide .devui-guide-container .devui-ctrl .devui-dots>em{opacity:.2;margin:0 5px 0 2px}.d-steps-guide .devui-guide-container .devui-ctrl .devui-dots>em.devui-active{opacity:1}.d-steps-guide .devui-guide-container .devui-ctrl .devui-guide-btn{display:flex;flex-flow:row nowrap;flex-grow:1;justify-content:flex-end;padding:20px 0 0;white-space:nowrap}.d-steps-guide .devui-guide-container .devui-ctrl .devui-guide-btn>div{color:#fff;background:rgba(255,255,255,.1);border-radius:4px;padding:5px 15px;cursor:pointer;margin-left:10px}.d-steps-guide .devui-guide-container .devui-ctrl .devui-guide-btn>div.devui-prev-step{background:none;border:solid 1px rgba(255,255,255,.1)}@keyframes devui-glow{0%{transform:scale(1);opacity:.5}25%{transform:scale(2);opacity:.3}50%{transform:scale(3);opacity:.1}75%{transform:scale(2);opacity:.3}to{transform:scale(1);opacity:.5}}

package/sticky/index.es.js

@@ -1,197 +0,0 @@
-import { defineComponent, reactive, watch, onMounted, ref, createVNode } from "vue";
-var Sticky = defineComponent({
-  name: "DSticky",
-  props: {
-    zIndex: {
-      type: Number
-    },
-    container: {
-      type: Object
-    },
-    view: {
-      type: Object,
-      default: () => {
-        return {
-          top: 0,
-          bottom: 0
-        };
-      }
-    },
-    scrollTarget: {
-      type: Object
-    }
-  },
-  emits: ["statusChange"],
-  setup(props, ctx) {
-    const {
-      slots
-    } = ctx;
-    let container;
-    let scrollTarget;
-    let scrollTimer;
-    let scrollPreStart;
-    const THROTTLE_DELAY = 16;
-    const THROTTLE_TRIGGER = 100;
-    let parentNode;
-    let containerLeft = 0;
-    const state = reactive({
-      status: "normal"
-    });
-    watch(() => props.zIndex, () => {
-      init();
-    });
-    watch(() => props.container, () => {
-      init();
-    });
-    watch(() => props.scrollTarget, () => {
-      init();
-    });
-    watch(() => state.status, () => {
-      ctx.emit("statusChange", state.status);
-    }, {
-      immediate: true
-    });
-    const init = () => {
-      parentNode = stickyRef.value.parentElement;
-      if (!props.container) {
-        container = parentNode;
-      } else {
-        container = props.container;
-      }
-      stickyRef.value.style.zIndex = props.zIndex;
-      scrollTarget = props.scrollTarget || window;
-      scrollTarget.addEventListener("scroll", throttle);
-      initScrollStatus(scrollTarget);
-    };
-    const initScrollStatus = (target) => {
-      const scrollTargets = target === window ? [document.documentElement, document.body] : [target];
-      let flag = false;
-      scrollTargets.forEach((scrollTarget2) => {
-        if (scrollTarget2.scrollTop && scrollTarget2.scrollTop > 0) {
-          flag = true;
-        }
-      });
-      if (flag) {
-        setTimeout(scrollHandler);
-      }
-    };
-    const statusProcess = (status) => {
-      const wrapper = stickyRef.value || document.createElement("div");
-      switch (status) {
-        case "normal":
-          wrapper.style.top = "auto";
-          wrapper.style.left = "auto";
-          wrapper.style.position = "static";
-          break;
-        case "follow":
-          const scrollTargetElement = scrollTarget;
-          const viewOffset = scrollTarget && scrollTarget !== window ? scrollTargetElement.getBoundingClientRect().top : 0;
-          wrapper.style.top = +viewOffset + (props.view && props.view.top || 0) + "px";
-          wrapper.style.left = wrapper.getBoundingClientRect().left + "px";
-          wrapper.style.position = "fixed";
-          break;
-        case "stay":
-          wrapper.style.top = calculateRelativePosition(wrapper, parentNode, "top") + "px";
-          wrapper.style.left = "auto";
-          wrapper.style.position = "relative";
-          break;
-        case "remain":
-          if (wrapper.style.position !== "fixed" && wrapper.style.position !== "absolute") {
-            wrapper.style.top = calculateRelativePosition(wrapper, parentNode, "top") + "px";
-            wrapper.style.left = "auto";
-            wrapper.style.position = "absolute";
-          }
-          wrapper.style.top = calculateRemainPosition(wrapper, parentNode, container) + "px";
-          wrapper.style.left = calculateRelativePosition(wrapper, parentNode, "left") + "px";
-          wrapper.style.position = "relative";
-          break;
-      }
-    };
-    const throttle = () => {
-      const fn = scrollAndResizeHock;
-      const time = Date.now();
-      if (scrollTimer) {
-        clearTimeout(scrollTimer);
-      }
-      if (!scrollPreStart) {
-        scrollPreStart = time;
-      }
-      if (time - scrollPreStart > THROTTLE_TRIGGER) {
-        fn();
-        scrollPreStart = null;
-        scrollTimer = null;
-      } else {
-        scrollTimer = setTimeout(() => {
-          fn();
-          scrollPreStart = null;
-          scrollTimer = null;
-        }, THROTTLE_DELAY);
-      }
-    };
-    const scrollAndResizeHock = () => {
-      if (container.getBoundingClientRect().left - (containerLeft || 0) !== 0) {
-        state.status = "stay";
-        containerLeft = container.getBoundingClientRect().left;
-      } else {
-        scrollHandler();
-      }
-    };
-    const scrollHandler = () => {
-      const scrollTargetElement = scrollTarget;
-      const wrapper = stickyRef.value || document.createElement("div");
-      const viewOffsetTop = scrollTarget && scrollTarget !== window ? scrollTargetElement.getBoundingClientRect().top : 0;
-      const computedStyle = window.getComputedStyle(container);
-      if (parentNode.getBoundingClientRect().top - viewOffsetTop > (props.view && props.view.top || 0)) {
-        state.status = "normal";
-        statusProcess(state.status);
-      } else if (container.getBoundingClientRect().top + parseInt(computedStyle.paddingTop, 10) + parseInt(computedStyle.borderTopWidth, 10) - viewOffsetTop >= (props.view && props.view.top || 0)) {
-        state.status = "normal";
-        statusProcess(state.status);
-      } else if (container.getBoundingClientRect().bottom - parseInt(computedStyle.paddingBottom, 10) - parseInt(computedStyle.borderBottomWidth, 10) < viewOffsetTop + (props.view && props.view.top || 0) + wrapper.getBoundingClientRect().height + (props.view && props.view.bottom || 0)) {
-        state.status = "remain";
-        statusProcess(state.status);
-      } else if (container.getBoundingClientRect().top + parseInt(computedStyle.paddingTop, 10) - viewOffsetTop < (props.view && props.view.top || 0)) {
-        state.status = "follow";
-        statusProcess(state.status);
-      }
-    };
-    const calculateRelativePosition = (element, relativeElement, direction) => {
-      const key = {
-        left: ["left", "Left"],
-        top: ["top", "Top"]
-      };
-      if (window && window.getComputedStyle) {
-        const computedStyle = window.getComputedStyle(relativeElement);
-        return element.getBoundingClientRect()[key[direction][0]] - relativeElement.getBoundingClientRect()[key[direction][0]] - parseInt(computedStyle[direction === "left" ? "paddingLeft" : "paddingTop"], 10) - parseInt(computedStyle[direction === "left" ? "borderLeftWidth" : "borderTopWidth"], 10);
-      }
-    };
-    const calculateRemainPosition = (element, relativeElement, container2) => {
-      if (window && window.getComputedStyle) {
-        const computedStyle = window.getComputedStyle(container2);
-        const result = container2.getBoundingClientRect().height - element.getBoundingClientRect().height + container2.getBoundingClientRect().top - relativeElement.getBoundingClientRect().top - parseInt(computedStyle["paddingTop"], 10) - parseInt(computedStyle["borderTopWidth"], 10) - parseInt(computedStyle["paddingBottom"], 10) - parseInt(computedStyle["borderBottomWidth"], 10);
-        return result < 0 ? 0 : result;
-      }
-    };
-    onMounted(() => {
-      init();
-    });
-    const stickyRef = ref();
-    return () => {
-      return createVNode("div", {
-        "ref": stickyRef
-      }, [slots.default ? slots.default() : ""]);
-    };
-  }
-});
-Sticky.install = function(app) {
-  app.component(Sticky.name, Sticky);
-};
-var index = {
-  title: "Sticky \u4FBF\u8D34",
-  category: "\u901A\u7528",
-  status: "50%",
-  install(app) {
-    app.use(Sticky);
-  }
-};
-export { Sticky, index as default };

package/sticky/index.umd.js

@@ -1 +0,0 @@
-(function(a,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(a=typeof globalThis!="undefined"?globalThis:a||self,i(a.index={},a.Vue))})(this,function(a,i){"use strict";var r=i.defineComponent({name:"DSticky",props:{zIndex:{type:Number},container:{type:Object},view:{type:Object,default:()=>({top:0,bottom:0})},scrollTarget:{type:Object}},emits:["statusChange"],setup(e,h){const{slots:C}=h;let c,d,f,g;const B=16,S=100;let u,R=0;const s=i.reactive({status:"normal"});i.watch(()=>e.zIndex,()=>{w()}),i.watch(()=>e.container,()=>{w()}),i.watch(()=>e.scrollTarget,()=>{w()}),i.watch(()=>s.status,()=>{h.emit("statusChange",s.status)},{immediate:!0});const w=()=>{u=p.value.parentElement,e.container?c=e.container:c=u,p.value.style.zIndex=e.zIndex,d=e.scrollTarget||window,d.addEventListener("scroll",x),I(d)},I=l=>{const t=l===window?[document.documentElement,document.body]:[l];let o=!1;t.forEach(n=>{n.scrollTop&&n.scrollTop>0&&(o=!0)}),o&&setTimeout(v)},y=l=>{const t=p.value||document.createElement("div");switch(l){case"normal":t.style.top="auto",t.style.left="auto",t.style.position="static";break;case"follow":const n=d&&d!==window?d.getBoundingClientRect().top:0;t.style.top=+n+(e.view&&e.view.top||0)+"px",t.style.left=t.getBoundingClientRect().left+"px",t.style.position="fixed";break;case"stay":t.style.top=T(t,u,"top")+"px",t.style.left="auto",t.style.position="relative";break;case"remain":t.style.position!=="fixed"&&t.style.position!=="absolute"&&(t.style.top=T(t,u,"top")+"px",t.style.left="auto",t.style.position="absolute"),t.style.top=k(t,u,c)+"px",t.style.left=T(t,u,"left")+"px",t.style.position="relative";break}},x=()=>{const l=E,t=Date.now();f&&clearTimeout(f),g||(g=t),t-g>S?(l(),g=null,f=null):f=setTimeout(()=>{l(),g=null,f=null},B)},E=()=>{c.getBoundingClientRect().left-(R||0)!=0?(s.status="stay",R=c.getBoundingClientRect().left):v()},v=()=>{const l=d,t=p.value||document.createElement("div"),o=d&&d!==window?l.getBoundingClientRect().top:0,n=window.getComputedStyle(c);u.getBoundingClientRect().top-o>(e.view&&e.view.top||0)||c.getBoundingClientRect().top+parseInt(n.paddingTop,10)+parseInt(n.borderTopWidth,10)-o>=(e.view&&e.view.top||0)?(s.status="normal",y(s.status)):c.getBoundingClientRect().bottom-parseInt(n.paddingBottom,10)-parseInt(n.borderBottomWidth,10)<o+(e.view&&e.view.top||0)+t.getBoundingClientRect().height+(e.view&&e.view.bottom||0)?(s.status="remain",y(s.status)):c.getBoundingClientRect().top+parseInt(n.paddingTop,10)-o<(e.view&&e.view.top||0)&&(s.status="follow",y(s.status))},T=(l,t,o)=>{const n={left:["left","Left"],top:["top","Top"]};if(window&&window.getComputedStyle){const m=window.getComputedStyle(t);return l.getBoundingClientRect()[n[o][0]]-t.getBoundingClientRect()[n[o][0]]-parseInt(m[o==="left"?"paddingLeft":"paddingTop"],10)-parseInt(m[o==="left"?"borderLeftWidth":"borderTopWidth"],10)}},k=(l,t,o)=>{if(window&&window.getComputedStyle){const n=window.getComputedStyle(o),m=o.getBoundingClientRect().height-l.getBoundingClientRect().height+o.getBoundingClientRect().top-t.getBoundingClientRect().top-parseInt(n.paddingTop,10)-parseInt(n.borderTopWidth,10)-parseInt(n.paddingBottom,10)-parseInt(n.borderBottomWidth,10);return m<0?0:m}};i.onMounted(()=>{w()});const p=i.ref();return()=>i.createVNode("div",{ref:p},[C.default?C.default():""])}});r.install=function(e){e.component(r.name,r)};var b={title:"Sticky \u4FBF\u8D34",category:"\u901A\u7528",status:"50%",install(e){e.use(r)}};a.Sticky=r,a.default=b,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});