@aliyun-sls/guide - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

dist/index.esm.js

@@ -436,2 +436,3 @@ import React, { useState, useRef, useEffect, useMemo } from 'react';
   scrollContainer.style.overflow = 'hidden';
+  console.log('scrollHeight', scrollHeight, 'scrollTop', scrollTop);
   var anchorPos = anchorEl.getBoundingClientRect();
@@ -441,8 +442,10 @@ var height = anchorPos.height,
       left = anchorPos.left;
+  console.log('height', height);
+  var totalHeight = document.body.clientHeight;
   var top = anchorPos.top + scrollTop;
   return {
     width: scrollWidth,
-    height: scrollHeight,
+    height: height,
     borderTopWidth: Math.max(top, 0),
-    borderBottomWidth: Math.max(scrollHeight - height - top, 0),
+    borderBottomWidth: Math.max(totalHeight - height - top, 0),
     borderRightWidth: Math.max(scrollWidth - width - left, 0),
@@ -449,0 +452,0 @@ borderLeftWidth: Math.max(left, 0)

dist/index.js

@@ -445,2 +445,3 @@ 'use strict';
   scrollContainer.style.overflow = 'hidden';
+  console.log('scrollHeight', scrollHeight, 'scrollTop', scrollTop);
   var anchorPos = anchorEl.getBoundingClientRect();
@@ -450,8 +451,10 @@ var height = anchorPos.height,
       left = anchorPos.left;
+  console.log('height', height);
+  var totalHeight = document.body.clientHeight;
   var top = anchorPos.top + scrollTop;
   return {
     width: scrollWidth,
-    height: scrollHeight,
+    height: height,
     borderTopWidth: Math.max(top, 0),
-    borderBottomWidth: Math.max(scrollHeight - height - top, 0),
+    borderBottomWidth: Math.max(totalHeight - height - top, 0),
     borderRightWidth: Math.max(scrollWidth - width - left, 0),
@@ -458,0 +461,0 @@ borderLeftWidth: Math.max(left, 0)

dist/index.umd.js

@@ -444,2 +444,3 @@ (function (global, factory) {
     scrollContainer.style.overflow = 'hidden';
+    console.log('scrollHeight', scrollHeight, 'scrollTop', scrollTop);
     var anchorPos = anchorEl.getBoundingClientRect();
@@ -449,8 +450,10 @@ var height = anchorPos.height,
         left = anchorPos.left;
+    console.log('height', height);
+    var totalHeight = document.body.clientHeight;
     var top = anchorPos.top + scrollTop;
     return {
       width: scrollWidth,
-      height: scrollHeight,
+      height: height,
       borderTopWidth: Math.max(top, 0),
-      borderBottomWidth: Math.max(scrollHeight - height - top, 0),
+      borderBottomWidth: Math.max(totalHeight - height - top, 0),
       borderRightWidth: Math.max(scrollWidth - width - left, 0),
@@ -457,0 +460,0 @@ borderLeftWidth: Math.max(left, 0)

dist/index.umd.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).guide={},e.React,e.ReactDOM)}(this,(function(e,t,o){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(t),i=n(o);function l(e){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function a(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function u(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function c(e){for(var t=1;arguments.length>t;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?u(Object(o),!0).forEach((function(t){a(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):u(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var o=[],n=!0,r=!1,i=void 0;try{for(var l,a=e[Symbol.iterator]();!(n=(l=a.next()).done)&&(o.push(l.value),!t||o.length!==t);n=!0);}catch(e){r=!0,i=e}finally{try{n||null==a.return||a.return()}finally{if(r)throw i}}return o}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return d(e,t);var o=Object.prototype.toString.call(e).slice(8,-1);"Object"===o&&e.constructor&&(o=e.constructor.name);if("Map"===o||"Set"===o)return Array.from(e);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return d(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e,t){(null==t||t>e.length)&&(t=e.length);for(var o=0,n=Array(t);t>o;o++)n[o]=e[o];return n}var s="j-byted-guide__custom-anchor",p=function(e){if(""+e!="[object Window]"){var t=e.ownerDocument;return t&&t.defaultView||window}return e},h=function(e){return(x(e)?e.ownerDocument:e.document)||window.document},m=function(e){return h(e).documentElement},g=function(e){return p(e).getComputedStyle(e)},b=function(e){return e?(e.nodeName||"").toLowerCase():""},v=function(e){return e&&"html"!==b(e)?e.assignedSlot||e.parentNode||e.host||m(e):e},x=function(e){return e instanceof p(e).Element||e instanceof Element},y=function(e){return e instanceof p(e).HTMLElement||e instanceof HTMLElement},w=function(e){return["table","td","th"].indexOf(b(e))>=0},E=function(e){return y(e)&&"fixed"!==g(e).position?e.offsetParent:null},k=function(e,t){var o=p(e);null==t||t(e);for(var n=E(e);n&&w(n)&&"static"===g(n).position;)null==t||t(n),n=E(n);return n||function(e,t){null==t||t(e);for(var o=v(e);y(o)&&0>["html","body"].indexOf(b(o));){null==t||t(o);var n=g(o);if("none"!==n.transform||"none"!==n.perspective||n.willChange&&"auto"!==n.willChange)return o;o=v(o)}return o}(e,t)||o},S=function(e){var t=0;return k(e,(function(e){t+=e.offsetTop})),t},C=12,O=function(e){return{bottom:"top",top:"bottom",left:"right",right:"left"}[e]},T={NEXT_STEP:{zh:"下一步",en:"Next step",ja:"次のステップ"},I_KNOW:{zh:"我知道了",en:"I know",ja:"知ってる"},STEP_NUMBER:{zh:function(e,t){return"第".concat(e,"步， 共").concat(t,"步")},en:function(e,t){return"Step ".concat(e," of ").concat(t)},ja:function(e,t){return"Step ".concat(e," of ").concat(t)}}};function j(e,t){void 0===t&&(t={});var o=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}j('.guide-mask{position:absolute;left:0;top:0;border-color:rgba(0,0,0,.6);border-style:solid;z-index:1001;box-sizing:border-box}.guide-mask:after{content:"";display:block;position:absolute;top:-1px;left:-1px;width:100%;height:100%;border-radius:4px;border:1px solid #fff;box-shadow:0 0 0 1px #fff;background:transparent}');var N=function(e){var o=e.className,n=e.anchorEl,l=e.realWindow,a=f(t.useState({}),2),u=a[0],c=a[1],d=t.useRef(0),s=function(){var e=function(e){var t=m(e),o=t.scrollWidth,n=t.scrollHeight,r=t.scrollTop;t.style.overflow="hidden";var i=e.getBoundingClientRect(),l=i.height,a=i.width,u=i.left,c=i.top+r;return{width:o,height:n,borderTopWidth:Math.max(c,0),borderBottomWidth:Math.max(n-l-c,0),borderRightWidth:Math.max(o-a-u,0),borderLeftWidth:Math.max(u,0)}}(n);Object.assign(e,{position:"absolute",left:0,top:0,"border-color":"rgba(0, 0, 0, 0.6)","border-style":"solid","z-index":1001,"box-sizing":"border-box"}),c(e)},p=function(){d.current&&l.cancelAnimationFrame(d.current),d.current=l.requestAnimationFrame((function(){s()}))};return t.useEffect((function(){s()}),[n]),t.useEffect((function(){return l.addEventListener("resize",p),function(){l.removeEventListener("resize",p)}}),[l,n]),n?i.default.createPortal(r.default.createElement("div",{className:"guide-mask ".concat(o),style:u}),h(n).body):null},M=function(e){var t=e.size,o=void 0===t?"16":t,n=e.fill,i=void 0===n?"#666":n,l=e.onClick,a=e.className;return r.default.createElement("div",{onClick:void 0===l?function(){}:l,className:void 0===a?"":a},r.default.createElement("svg",{width:o,height:o,viewBox:"0 0 48 48",xmlns:"http://www.w3.org/2000/svg"},r.default.createElement("g",null,r.default.createElement("g",null,r.default.createElement("rect",{fillOpacity:"0.01",fill:"#FFFFFF",x:"0",y:"0",width:"48",height:"48",strokeWidth:"4",stroke:"none",fillRule:"evenodd"}),r.default.createElement("path",{d:"M14,14 L34,34",stroke:i,strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round",fill:"none",fillRule:"evenodd"}),r.default.createElement("path",{d:"M14,34 L34,14",stroke:i,strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round",fill:"none",fillRule:"evenodd"})))))};j(".guide-modal{position:absolute;width:240px;z-index:1100;background:#fff;box-shadow:0 0 4px 0 #999;border-radius:4px;padding:16px;box-shadow:0 2px 6px 0 #999}.guide-modal *{font-family:PingFangSC-Regular,PingFang SC;text-align:left}.guide-modal-title{display:block;font-size:14px;font-weight:600;height:22px;line-height:22px;margin-bottom:8px}.guide-modal-content{color:#666;font-size:12px;font-weight:400;line-height:20px;margin-bottom:16px}.guide-modal-close-icon{position:absolute;top:16px;right:16px;cursor:pointer}.guide-modal-arrow{position:absolute;width:10px;height:10px;background:#fff;transform:rotate(45deg)}.guide-modal-hotspot{position:absolute;width:16px;height:16px;border-radius:50%;background-color:#4e83fd;-webkit-animation:pulse 1s infinite;animation:pulse 1s infinite}.guide-modal-footer{width:100%;max-height:26px;display:flex;align-items:center;justify-content:space-between}.guide-modal-footer *{font-size:12px;font-weight:400}.guide-modal-footer-text{color:#999}.guide-modal-footer-btn{padding:3px 16px;line-height:20px;border-radius:4px;color:#fff;background:#2f88ff;box-shadow:0 2px 6px 0 rgba(0,0,0,.08);border:none;outline:none;cursor:pointer;word-break:keep-all}.guide-modal-footer-btn:hover{background-color:#40a9ff}.guide-modal-footer-btn:focus{outline:none;box-shadow:0 0 4px #338aff;transition:.3s}.guide-modal-title:focus{background:#ff0;box-shadow:0 0 4px #338aff;border:1px dotted #ccc}@-webkit-keyframes pulse{0%{box-shadow:0 0 0 0 #4e83fd}to{box-shadow:0 0 0 8px transparent}}@keyframes pulse{0%{box-shadow:0 0 0 0 #4e83fd}to{box-shadow:0 0 0 8px transparent}}");var P="guide-modal",R=function(e){var o=e.anchorEl,n=e.parentEl,l=e.realWindow,u=e.steps,d=e.stepIndex,s=e.mask,p=e.arrow,h=e.hotspot,x=e.closable,w=e.onClose,E=e.onChange,k=e.stepText,T=e.nextText,j=e.okText,N=e.className,R=e.TEXT,L=u[d],z=!Object.prototype.hasOwnProperty.call(L,"visible")||L.visible,W=t.useRef(null),B=t.useRef(0),_=t.useRef(null),A=t.useRef(0),F=f(t.useState({}),2),D=F[0],I=F[1],q=f(t.useState({}),2),H=q[0],K=q[1],U=f(t.useState({}),2),X=U[0],V=U[1],Y=t.useMemo((function(){return function(e,t){for(var o=v(e);y(o)&&0>["html","body"].indexOf(b(o));){var n=g(o).overflowY,r="visible"!==n&&"hidden"!==n;if(null==t||t(o),r&&o.scrollHeight>o.clientHeight)return o;o=o.parentNode}return m(e)}(o)}),[o]),$=d!==u.length-1?T||R("NEXT_STEP"):j||R("I_KNOW"),G=k||R("STEP_NUMBER"),J=function(){var e=L.placement,t=W.current;if(t){var r=function(e,t,o,n){var r=arguments.length>4&&void 0!==arguments[4]?arguments[4]:"bottom",i=arguments.length>5&&void 0!==arguments[5]?arguments[5]:{x:0,y:0},l=e.getBoundingClientRect(),a=t.getBoundingClientRect(),u=o.getBoundingClientRect(),c=n.scrollTop,f="body"===b(o),d="fixed"===g(t).position,s=S(t),p=d?a.top:f?a.top+c:s,h=a.height+p,m=a.left-u.left,v=a.width,x=a.height,y={x:i.x||0,y:i.y||0},w={top:{top:p-l.height-C,left:m+v/2-l.width/2},bottom:{top:h+C,left:m+v/2-l.width/2},left:{top:p+x/2-l.height/2,left:m-l.width-C},right:{top:p+x/2-l.height/2,left:m+v+C},"top-right":{top:p-l.height-C,left:m+v-l.width},"top-left":{top:p-l.height-C,left:m},"bottom-right":{top:h+C,left:m+v-l.width},"bottom-left":{top:h+C,left:m},"right-top":{top:p,left:m+v+C},"left-top":{top:p,left:m-l.width-C},"right-bottom":{top:h-l.height,left:m+v+C},"left-bottom":{top:h-l.height,left:m-l.width-C}}[r];return{position:d?"fixed":"absolute",top:w.top+y.y,left:w.left+y.x}}(t,o,n,Y,e,L.offset),i=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"bottom",o=arguments.length>2&&void 0!==arguments[2]&&arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:12,r=e.getBoundingClientRect(),i=10,l=f(t.split("-"),2),u=l[0],d=l[1],s={top:"1px 1px 1px 0px #ccc",right:"-1px 1px 1px 0px #ccc",bottom:"-1px -1px 1px 0px #ccc",left:"1px -1px 1px 0px #ccc"},p=a({boxShadow:o?"none":s[u]},O(u),-i/2);if(d)return c(a({},d,2*n),p);var h={};return["bottom","top"].includes(u)&&(h.right=(r.width-i)/2),["left","right"].includes(u)&&(h.top=(r.height-i)/2),c(c({},h),p)}(t,e,s),l=function(){var e,t,o=arguments.length>1?arguments[1]:void 0,n=f((arguments.length>0&&void 0!==arguments[0]?arguments[0]:"bottom").split("-"),2),r=n[0],i=n[1],l=O(r),u=24;return["top","bottom"].includes(r)?i&&"right"!==i?(a(e={},l,o[l]-u),a(e,"left",o.left-3),e):(a(t={},l,o[l]-u),a(t,"right",o.right-3),t):["right","left"].includes(r)?a(i&&"top"!==i?{bottom:o.bottom-3}:{top:o.top-3},l,o[l]-u):o}(e,i);I(r),K(i),V(l)}},Q=function(){B.current&&l.cancelAnimationFrame(B.current),B.current=l.requestAnimationFrame((function(){J()}))},Z=function(e){var t,o,n,r=(null===(t=W.current)||void 0===t?void 0:t.querySelectorAll(".guide-modal-title, .guide-modal-content, .guide-modal-footer-text, .guide-modal-footer-btn"))||null;if(9===e.keyCode&&r){null==e||null===(o=e.preventDefault)||void 0===o||o.call(e);var i=A.current,l=r.length,a=r[i];null===(n=_.current)||void 0===n||n.blur(),a.focus(),_.current=a,i!==l-1||e.shiftKey?0===i&&e.shiftKey?A.current=l-1:e.shiftKey?A.current--:A.current++:A.current=0}};return t.useEffect((function(){if(L.skip)E();else if(z)return A.current=0,function(){var e=W.current,t=o.getBoundingClientRect(),n=e.getBoundingClientRect(),r=Y.getBoundingClientRect(),i="html"===b(Y),l=Y.clientHeight,a=i?0:r.top;if(l>t.top-a+t.height+n.height+C&&t.top>n.height+C||Y.scrollTo({left:0,top:Y.scrollTop+t.top-a+t.height/2-l/2+C,behavior:"smooth"}),"html"!==b(Y)){var u=m(o);r.top+r.height<window.innerHeight&&r.height>=r.bottom||u.scrollTo({left:0,top:u.scrollTop+r.top+r.height/2-window.innerHeight/2+C,behavior:"smooth"})}}(),Z({keyCode:9}),J(),l.addEventListener("resize",Q),l.addEventListener("keydown",Z),function(){l.removeEventListener("resize",Q),l.removeEventListener("keydown",Z)}}),[z,L,o]),z?i.default.createPortal(r.default.createElement("div",{ref:W,className:"".concat(P," ").concat(N),style:D},p&&r.default.createElement("span",{className:"".concat(P,"-arrow"),style:H}),h&&r.default.createElement("div",{className:"".concat(P,"-hotspot"),style:X}),x&&r.default.createElement(M,{className:"".concat(P,"-close-icon"),onClick:w}),r.default.createElement("div",{className:"".concat(P,"-title")},L.title),r.default.createElement("div",{className:"".concat(P,"-content")},"function"==typeof L.content?L.content():L.content),r.default.createElement("div",{className:"".concat(P,"-footer")},r.default.createElement("span",{className:"".concat(P,"-footer-text")},G(d+1,u.length)),r.default.createElement("button",{className:"".concat(P,"-footer-btn"),onClick:function(){var e;null===(e=L.beforeStepChange)||void 0===e||e.call(L,L,d,u),E()}},$))),n):null};j(".j-byted-guide__custom-anchor{position:absolute;pointer-events:none;opacity:0}"),e.CUSTOM_ELEMENT_CLASS=s,e.default=function(e){var o=e.steps,n=e.localKey,i=e.mask,a=void 0===i||i,u=e.arrow,c=void 0===u||u,d=e.hotspot,g=void 0!==d&&d,b=e.closable,v=void 0===b||b,x=e.modalClassName,y=void 0===x?"":x,w=e.maskClassName,E=void 0===w?"":w,S=e.expireDate,C=void 0===S?"":S,O=e.step,j=void 0===O?0:O,M=e.beforeStepChange,P=e.afterStepChange,L=e.onClose,z=e.stepText,W=e.nextText,B=e.okText,_=e.lang,A=void 0===_?"zh":_,F=f(t.useState(-1),2),D=F[0],I=F[1],q=f(t.useState(""),2),H=q[0],K=q[1],U=f(t.useState(0),2),X=U[0],V=U[1],Y=t.useMemo((function(){return function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"zh";return function(t){var o;return null===(o=T[t])||void 0===o?void 0:o[e]}}(A)}),[A]),$=!Object.prototype.hasOwnProperty.call(e,"visible")||e.visible,G=t.useMemo((function(){if(D>=0&&o.length>D){var e=o[D],t=e.targetPos,n=e.selector;if(n)return function(e){var t=l(e);return"string"===t?document.querySelector(e):"function"===t?e():e}(n);if(t)return function(e){var t=document.querySelector(s);t&&document.body.removeChild(t);var o=document.createElement("div");return o.className=s,Object.entries(e).forEach((function(e){var t=f(e,2);o.style[t[0]]=t[1]+"px"})),document.body.appendChild(o),o}(t)}return null}),[D,o[D],X]),J=t.useMemo((function(){return G?"body"===o[D].parent||a?h(G).body:k(G):null}),[G]),Q=t.useMemo((function(){return G?p(G):null}),[G]),Z=t.useMemo((function(){return G?m(G):null}),[G]),ee=function(){a&&(Z.style.overflow=H);var e=document.querySelector(s);e&&document.body.removeChild(e),I(-1),null==L||L(),n&&localStorage.setItem(n,"true")},te=function(e){"Escape"!==e.key||!v&&D!==o.length-1||ee()};return t.useEffect((function(){if($){var e=!!n&&localStorage.getItem(n),t=new Date(Date.parse(C.replace(/-/g,"/")));e||C&&new Date>t||I(j)}else I(-1)}),[$,j]),t.useEffect((function(){if(Q&&Z)return Q.addEventListener("keydown",te),function(){Q.removeEventListener("keydown",te)}}),[Q,Z]),t.useEffect((function(){0>D||null==P||P(D,o[D])}),[D]),t.useEffect((function(){a&&Z&&K(Z.style.overflow||"scroll")}),[a,Z]),t.useEffect((function(){if(D>=0){var e=new MutationObserver((function(){V(X+1)}));return e.observe(document,{childList:!0,subtree:!0}),function(){e.disconnect()}}}),[D,X]),a&&!H||!J?null:r.default.createElement(r.default.Fragment,null,a&&r.default.createElement(N,{className:E,anchorEl:G,realWindow:Q}),r.default.createElement(R,{anchorEl:G,parentEl:J,realWindow:Q,steps:o,stepIndex:D,mask:a,arrow:c,hotspot:g,closable:v,onClose:ee,onChange:function(){D===o.length-1?ee():0>D||null==M||M(D,o[D]),I(D+1)},stepText:z,nextText:W,okText:B,className:y,TEXT:Y}))},Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).guide={},e.React,e.ReactDOM)}(this,(function(e,t,o){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(t),i=n(o);function l(e){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function a(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function u(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function c(e){for(var t=1;arguments.length>t;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?u(Object(o),!0).forEach((function(t){a(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):u(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var o=[],n=!0,r=!1,i=void 0;try{for(var l,a=e[Symbol.iterator]();!(n=(l=a.next()).done)&&(o.push(l.value),!t||o.length!==t);n=!0);}catch(e){r=!0,i=e}finally{try{n||null==a.return||a.return()}finally{if(r)throw i}}return o}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return d(e,t);var o=Object.prototype.toString.call(e).slice(8,-1);"Object"===o&&e.constructor&&(o=e.constructor.name);if("Map"===o||"Set"===o)return Array.from(e);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return d(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e,t){(null==t||t>e.length)&&(t=e.length);for(var o=0,n=Array(t);t>o;o++)n[o]=e[o];return n}var s="j-byted-guide__custom-anchor",p=function(e){if(""+e!="[object Window]"){var t=e.ownerDocument;return t&&t.defaultView||window}return e},h=function(e){return(x(e)?e.ownerDocument:e.document)||window.document},m=function(e){return h(e).documentElement},g=function(e){return p(e).getComputedStyle(e)},b=function(e){return e?(e.nodeName||"").toLowerCase():""},v=function(e){return e&&"html"!==b(e)?e.assignedSlot||e.parentNode||e.host||m(e):e},x=function(e){return e instanceof p(e).Element||e instanceof Element},y=function(e){return e instanceof p(e).HTMLElement||e instanceof HTMLElement},w=function(e){return["table","td","th"].indexOf(b(e))>=0},E=function(e){return y(e)&&"fixed"!==g(e).position?e.offsetParent:null},k=function(e,t){var o=p(e);null==t||t(e);for(var n=E(e);n&&w(n)&&"static"===g(n).position;)null==t||t(n),n=E(n);return n||function(e,t){null==t||t(e);for(var o=v(e);y(o)&&0>["html","body"].indexOf(b(o));){null==t||t(o);var n=g(o);if("none"!==n.transform||"none"!==n.perspective||n.willChange&&"auto"!==n.willChange)return o;o=v(o)}return o}(e,t)||o},S=function(e){var t=0;return k(e,(function(e){t+=e.offsetTop})),t},C=12,T=function(e){return{bottom:"top",top:"bottom",left:"right",right:"left"}[e]},O={NEXT_STEP:{zh:"下一步",en:"Next step",ja:"次のステップ"},I_KNOW:{zh:"我知道了",en:"I know",ja:"知ってる"},STEP_NUMBER:{zh:function(e,t){return"第".concat(e,"步， 共").concat(t,"步")},en:function(e,t){return"Step ".concat(e," of ").concat(t)},ja:function(e,t){return"Step ".concat(e," of ").concat(t)}}};function j(e,t){void 0===t&&(t={});var o=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}j('.guide-mask{position:absolute;left:0;top:0;border-color:rgba(0,0,0,.6);border-style:solid;z-index:1001;box-sizing:border-box}.guide-mask:after{content:"";display:block;position:absolute;top:-1px;left:-1px;width:100%;height:100%;border-radius:4px;border:1px solid #fff;box-shadow:0 0 0 1px #fff;background:transparent}');var N=function(e){var o=e.className,n=e.anchorEl,l=e.realWindow,a=f(t.useState({}),2),u=a[0],c=a[1],d=t.useRef(0),s=function(){var e=function(e){var t=m(e),o=t.scrollWidth,n=t.scrollHeight,r=t.scrollTop;t.style.overflow="hidden",console.log("scrollHeight",n,"scrollTop",r);var i=e.getBoundingClientRect(),l=i.height,a=i.width,u=i.left;console.log("height",l);var c=document.body.clientHeight,f=i.top+r;return{width:o,height:l,borderTopWidth:Math.max(f,0),borderBottomWidth:Math.max(c-l-f,0),borderRightWidth:Math.max(o-a-u,0),borderLeftWidth:Math.max(u,0)}}(n);Object.assign(e,{position:"absolute",left:0,top:0,"border-color":"rgba(0, 0, 0, 0.6)","border-style":"solid","z-index":1001,"box-sizing":"border-box"}),c(e)},p=function(){d.current&&l.cancelAnimationFrame(d.current),d.current=l.requestAnimationFrame((function(){s()}))};return t.useEffect((function(){s()}),[n]),t.useEffect((function(){return l.addEventListener("resize",p),function(){l.removeEventListener("resize",p)}}),[l,n]),n?i.default.createPortal(r.default.createElement("div",{className:"guide-mask ".concat(o),style:u}),h(n).body):null},M=function(e){var t=e.size,o=void 0===t?"16":t,n=e.fill,i=void 0===n?"#666":n,l=e.onClick,a=e.className;return r.default.createElement("div",{onClick:void 0===l?function(){}:l,className:void 0===a?"":a},r.default.createElement("svg",{width:o,height:o,viewBox:"0 0 48 48",xmlns:"http://www.w3.org/2000/svg"},r.default.createElement("g",null,r.default.createElement("g",null,r.default.createElement("rect",{fillOpacity:"0.01",fill:"#FFFFFF",x:"0",y:"0",width:"48",height:"48",strokeWidth:"4",stroke:"none",fillRule:"evenodd"}),r.default.createElement("path",{d:"M14,14 L34,34",stroke:i,strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round",fill:"none",fillRule:"evenodd"}),r.default.createElement("path",{d:"M14,34 L34,14",stroke:i,strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round",fill:"none",fillRule:"evenodd"})))))};j(".guide-modal{position:absolute;width:240px;z-index:1100;background:#fff;box-shadow:0 0 4px 0 #999;border-radius:4px;padding:16px;box-shadow:0 2px 6px 0 #999}.guide-modal *{font-family:PingFangSC-Regular,PingFang SC;text-align:left}.guide-modal-title{display:block;font-size:14px;font-weight:600;height:22px;line-height:22px;margin-bottom:8px}.guide-modal-content{color:#666;font-size:12px;font-weight:400;line-height:20px;margin-bottom:16px}.guide-modal-close-icon{position:absolute;top:16px;right:16px;cursor:pointer}.guide-modal-arrow{position:absolute;width:10px;height:10px;background:#fff;transform:rotate(45deg)}.guide-modal-hotspot{position:absolute;width:16px;height:16px;border-radius:50%;background-color:#4e83fd;-webkit-animation:pulse 1s infinite;animation:pulse 1s infinite}.guide-modal-footer{width:100%;max-height:26px;display:flex;align-items:center;justify-content:space-between}.guide-modal-footer *{font-size:12px;font-weight:400}.guide-modal-footer-text{color:#999}.guide-modal-footer-btn{padding:3px 16px;line-height:20px;border-radius:4px;color:#fff;background:#2f88ff;box-shadow:0 2px 6px 0 rgba(0,0,0,.08);border:none;outline:none;cursor:pointer;word-break:keep-all}.guide-modal-footer-btn:hover{background-color:#40a9ff}.guide-modal-footer-btn:focus{outline:none;box-shadow:0 0 4px #338aff;transition:.3s}.guide-modal-title:focus{background:#ff0;box-shadow:0 0 4px #338aff;border:1px dotted #ccc}@-webkit-keyframes pulse{0%{box-shadow:0 0 0 0 #4e83fd}to{box-shadow:0 0 0 8px transparent}}@keyframes pulse{0%{box-shadow:0 0 0 0 #4e83fd}to{box-shadow:0 0 0 8px transparent}}");var P="guide-modal",R=function(e){var o=e.anchorEl,n=e.parentEl,l=e.realWindow,u=e.steps,d=e.stepIndex,s=e.mask,p=e.arrow,h=e.hotspot,x=e.closable,w=e.onClose,E=e.onChange,k=e.stepText,O=e.nextText,j=e.okText,N=e.className,R=e.TEXT,L=u[d],z=!Object.prototype.hasOwnProperty.call(L,"visible")||L.visible,W=t.useRef(null),B=t.useRef(0),_=t.useRef(null),A=t.useRef(0),F=f(t.useState({}),2),D=F[0],H=F[1],I=f(t.useState({}),2),q=I[0],K=I[1],U=f(t.useState({}),2),X=U[0],V=U[1],Y=t.useMemo((function(){return function(e,t){for(var o=v(e);y(o)&&0>["html","body"].indexOf(b(o));){var n=g(o).overflowY,r="visible"!==n&&"hidden"!==n;if(null==t||t(o),r&&o.scrollHeight>o.clientHeight)return o;o=o.parentNode}return m(e)}(o)}),[o]),$=d!==u.length-1?O||R("NEXT_STEP"):j||R("I_KNOW"),G=k||R("STEP_NUMBER"),J=function(){var e=L.placement,t=W.current;if(t){var r=function(e,t,o,n){var r=arguments.length>4&&void 0!==arguments[4]?arguments[4]:"bottom",i=arguments.length>5&&void 0!==arguments[5]?arguments[5]:{x:0,y:0},l=e.getBoundingClientRect(),a=t.getBoundingClientRect(),u=o.getBoundingClientRect(),c=n.scrollTop,f="body"===b(o),d="fixed"===g(t).position,s=S(t),p=d?a.top:f?a.top+c:s,h=a.height+p,m=a.left-u.left,v=a.width,x=a.height,y={x:i.x||0,y:i.y||0},w={top:{top:p-l.height-C,left:m+v/2-l.width/2},bottom:{top:h+C,left:m+v/2-l.width/2},left:{top:p+x/2-l.height/2,left:m-l.width-C},right:{top:p+x/2-l.height/2,left:m+v+C},"top-right":{top:p-l.height-C,left:m+v-l.width},"top-left":{top:p-l.height-C,left:m},"bottom-right":{top:h+C,left:m+v-l.width},"bottom-left":{top:h+C,left:m},"right-top":{top:p,left:m+v+C},"left-top":{top:p,left:m-l.width-C},"right-bottom":{top:h-l.height,left:m+v+C},"left-bottom":{top:h-l.height,left:m-l.width-C}}[r];return{position:d?"fixed":"absolute",top:w.top+y.y,left:w.left+y.x}}(t,o,n,Y,e,L.offset),i=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"bottom",o=arguments.length>2&&void 0!==arguments[2]&&arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:12,r=e.getBoundingClientRect(),i=10,l=f(t.split("-"),2),u=l[0],d=l[1],s={top:"1px 1px 1px 0px #ccc",right:"-1px 1px 1px 0px #ccc",bottom:"-1px -1px 1px 0px #ccc",left:"1px -1px 1px 0px #ccc"},p=a({boxShadow:o?"none":s[u]},T(u),-i/2);if(d)return c(a({},d,2*n),p);var h={};return["bottom","top"].includes(u)&&(h.right=(r.width-i)/2),["left","right"].includes(u)&&(h.top=(r.height-i)/2),c(c({},h),p)}(t,e,s),l=function(){var e,t,o=arguments.length>1?arguments[1]:void 0,n=f((arguments.length>0&&void 0!==arguments[0]?arguments[0]:"bottom").split("-"),2),r=n[0],i=n[1],l=T(r),u=24;return["top","bottom"].includes(r)?i&&"right"!==i?(a(e={},l,o[l]-u),a(e,"left",o.left-3),e):(a(t={},l,o[l]-u),a(t,"right",o.right-3),t):["right","left"].includes(r)?a(i&&"top"!==i?{bottom:o.bottom-3}:{top:o.top-3},l,o[l]-u):o}(e,i);H(r),K(i),V(l)}},Q=function(){B.current&&l.cancelAnimationFrame(B.current),B.current=l.requestAnimationFrame((function(){J()}))},Z=function(e){var t,o,n,r=(null===(t=W.current)||void 0===t?void 0:t.querySelectorAll(".guide-modal-title, .guide-modal-content, .guide-modal-footer-text, .guide-modal-footer-btn"))||null;if(9===e.keyCode&&r){null==e||null===(o=e.preventDefault)||void 0===o||o.call(e);var i=A.current,l=r.length,a=r[i];null===(n=_.current)||void 0===n||n.blur(),a.focus(),_.current=a,i!==l-1||e.shiftKey?0===i&&e.shiftKey?A.current=l-1:e.shiftKey?A.current--:A.current++:A.current=0}};return t.useEffect((function(){if(L.skip)E();else if(z)return A.current=0,function(){var e=W.current,t=o.getBoundingClientRect(),n=e.getBoundingClientRect(),r=Y.getBoundingClientRect(),i="html"===b(Y),l=Y.clientHeight,a=i?0:r.top;if(l>t.top-a+t.height+n.height+C&&t.top>n.height+C||Y.scrollTo({left:0,top:Y.scrollTop+t.top-a+t.height/2-l/2+C,behavior:"smooth"}),"html"!==b(Y)){var u=m(o);r.top+r.height<window.innerHeight&&r.height>=r.bottom||u.scrollTo({left:0,top:u.scrollTop+r.top+r.height/2-window.innerHeight/2+C,behavior:"smooth"})}}(),Z({keyCode:9}),J(),l.addEventListener("resize",Q),l.addEventListener("keydown",Z),function(){l.removeEventListener("resize",Q),l.removeEventListener("keydown",Z)}}),[z,L,o]),z?i.default.createPortal(r.default.createElement("div",{ref:W,className:"".concat(P," ").concat(N),style:D},p&&r.default.createElement("span",{className:"".concat(P,"-arrow"),style:q}),h&&r.default.createElement("div",{className:"".concat(P,"-hotspot"),style:X}),x&&r.default.createElement(M,{className:"".concat(P,"-close-icon"),onClick:w}),r.default.createElement("div",{className:"".concat(P,"-title")},L.title),r.default.createElement("div",{className:"".concat(P,"-content")},"function"==typeof L.content?L.content():L.content),r.default.createElement("div",{className:"".concat(P,"-footer")},r.default.createElement("span",{className:"".concat(P,"-footer-text")},G(d+1,u.length)),r.default.createElement("button",{className:"".concat(P,"-footer-btn"),onClick:function(){var e;null===(e=L.beforeStepChange)||void 0===e||e.call(L,L,d,u),E()}},$))),n):null};j(".j-byted-guide__custom-anchor{position:absolute;pointer-events:none;opacity:0}"),e.CUSTOM_ELEMENT_CLASS=s,e.default=function(e){var o=e.steps,n=e.localKey,i=e.mask,a=void 0===i||i,u=e.arrow,c=void 0===u||u,d=e.hotspot,g=void 0!==d&&d,b=e.closable,v=void 0===b||b,x=e.modalClassName,y=void 0===x?"":x,w=e.maskClassName,E=void 0===w?"":w,S=e.expireDate,C=void 0===S?"":S,T=e.step,j=void 0===T?0:T,M=e.beforeStepChange,P=e.afterStepChange,L=e.onClose,z=e.stepText,W=e.nextText,B=e.okText,_=e.lang,A=void 0===_?"zh":_,F=f(t.useState(-1),2),D=F[0],H=F[1],I=f(t.useState(""),2),q=I[0],K=I[1],U=f(t.useState(0),2),X=U[0],V=U[1],Y=t.useMemo((function(){return function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"zh";return function(t){var o;return null===(o=O[t])||void 0===o?void 0:o[e]}}(A)}),[A]),$=!Object.prototype.hasOwnProperty.call(e,"visible")||e.visible,G=t.useMemo((function(){if(D>=0&&o.length>D){var e=o[D],t=e.targetPos,n=e.selector;if(n)return function(e){var t=l(e);return"string"===t?document.querySelector(e):"function"===t?e():e}(n);if(t)return function(e){var t=document.querySelector(s);t&&document.body.removeChild(t);var o=document.createElement("div");return o.className=s,Object.entries(e).forEach((function(e){var t=f(e,2);o.style[t[0]]=t[1]+"px"})),document.body.appendChild(o),o}(t)}return null}),[D,o[D],X]),J=t.useMemo((function(){return G?"body"===o[D].parent||a?h(G).body:k(G):null}),[G]),Q=t.useMemo((function(){return G?p(G):null}),[G]),Z=t.useMemo((function(){return G?m(G):null}),[G]),ee=function(){a&&(Z.style.overflow=q);var e=document.querySelector(s);e&&document.body.removeChild(e),H(-1),null==L||L(),n&&localStorage.setItem(n,"true")},te=function(e){"Escape"!==e.key||!v&&D!==o.length-1||ee()};return t.useEffect((function(){if($){var e=!!n&&localStorage.getItem(n),t=new Date(Date.parse(C.replace(/-/g,"/")));e||C&&new Date>t||H(j)}else H(-1)}),[$,j]),t.useEffect((function(){if(Q&&Z)return Q.addEventListener("keydown",te),function(){Q.removeEventListener("keydown",te)}}),[Q,Z]),t.useEffect((function(){0>D||null==P||P(D,o[D])}),[D]),t.useEffect((function(){a&&Z&&K(Z.style.overflow||"scroll")}),[a,Z]),t.useEffect((function(){if(D>=0){var e=new MutationObserver((function(){V(X+1)}));return e.observe(document,{childList:!0,subtree:!0}),function(){e.disconnect()}}}),[D,X]),a&&!q||!J?null:r.default.createElement(r.default.Fragment,null,a&&r.default.createElement(N,{className:E,anchorEl:G,realWindow:Q}),r.default.createElement(R,{anchorEl:G,parentEl:J,realWindow:Q,steps:o,stepIndex:D,mask:a,arrow:c,hotspot:g,closable:v,onClose:ee,onChange:function(){D===o.length-1?ee():0>D||null==M||M(D,o[D]),H(D+1)},stepText:z,nextText:W,okText:B,className:y,TEXT:Y}))},Object.defineProperty(e,"__esModule",{value:!0})}));

package.json

@@ -6,3 +6,3 @@ {
   "name": "@aliyun-sls/guide",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "New feature guide",
@@ -9,0 +9,0 @@ "keywords": [

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

902517

increased by0.06%

Lines of code

4038

increased by0.22%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes