@ranceheart/sticky-elevator/dist/elevator.umd.js

A lightweight scroll‑spy elevator nav for React

(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('@charset "UTF-8";.elevator{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.elevator::-webkit-scrollbar{display:none}.elevator.fixed{position:fixed;top:0;left:0;right:0;margin:0 auto}.elevator.safe-padding{padding-top:env(safe-area-inset-top)}.elevator-wrapper{display:flex;width:100%;white-space:nowrap;box-sizing:content-box;padding:0;margin:0;gap:0}.elevator-item-wrapper{display:flex}.elevator-item{display:block;width:100%;background-size:cover;background-position:center;transition:background-position .2s}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
(function(C,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("clsx"),require("resize-observer-polyfill"),require("smoothscroll-polyfill")):typeof define=="function"&&define.amd?define(["exports","react","clsx","resize-observer-polyfill","smoothscroll-polyfill"],f):(C=typeof globalThis<"u"?globalThis:C||self,f(C.Elevator={},C.React,C.clsx,C.ResizeObserver,C.smoothscroll))})(this,function(C,f,me,he,Ue){"use strict";var ge=document.createElement("style");ge.textContent=`@charset "UTF-8";.elevator{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.elevator::-webkit-scrollbar{display:none}.elevator.fixed{position:fixed;top:0;left:0;right:0;margin:0 auto}.elevator.safe-padding{padding-top:env(safe-area-inset-top)}.elevator-wrapper{display:flex;width:100%;white-space:nowrap;box-sizing:content-box;padding:0;margin:0;gap:0}.elevator-item-wrapper{display:flex}.elevator-item{display:block;width:100%;background-size:cover;background-position:center;transition:background-position .2s}
/*$vite$:1*/`,document.head.appendChild(ge);var oe={exports:{}},z={};/**
 * @license React
 * react-jsx-runtime.production.min.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var ye;function Be(){if(ye)return z;ye=1;var L=f,_=Symbol.for("react.element"),I=Symbol.for("react.fragment"),O=Object.prototype.hasOwnProperty,S=L.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,b={key:!0,ref:!0,__self:!0,__source:!0};function k(P,h,W){var g,w={},D=null,F=null;W!==void 0&&(D=""+W),h.key!==void 0&&(D=""+h.key),h.ref!==void 0&&(F=h.ref);for(g in h)O.call(h,g)&&!b.hasOwnProperty(g)&&(w[g]=h[g]);if(P&&P.defaultProps)for(g in h=P.defaultProps,h)w[g]===void 0&&(w[g]=h[g]);return{$$typeof:_,type:P,key:D,ref:F,props:w,_owner:S.current}}return z.Fragment=I,z.jsx=k,z.jsxs=k,z}var J={};/**
 * @license React
 * react-jsx-runtime.development.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var Ee;function ze(){return Ee||(Ee=1,process.env.NODE_ENV!=="production"&&function(){var L=f,_=Symbol.for("react.element"),I=Symbol.for("react.portal"),O=Symbol.for("react.fragment"),S=Symbol.for("react.strict_mode"),b=Symbol.for("react.profiler"),k=Symbol.for("react.provider"),P=Symbol.for("react.context"),h=Symbol.for("react.forward_ref"),W=Symbol.for("react.suspense"),g=Symbol.for("react.suspense_list"),w=Symbol.for("react.memo"),D=Symbol.for("react.lazy"),F=Symbol.for("react.offscreen"),K=Symbol.iterator,H="@@iterator";function G(e){if(e===null||typeof e!="object")return null;var r=K&&e[K]||e[H];return typeof r=="function"?r:null}var j=L.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function m(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];N("error",e,t)}}function N(e,r,t){{var n=j.ReactDebugCurrentFrame,s=n.getStackAddendum();s!==""&&(r+="%s",t=t.concat([s]));var l=t.map(function(i){return String(i)});l.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,l)}}var ie=!1,X=!1,V=!1,A=!1,Z=!1,ee;ee=Symbol.for("react.module.reference");function a(e){return!!(typeof e=="string"||typeof e=="function"||e===O||e===b||Z||e===S||e===W||e===g||A||e===F||ie||X||V||typeof e=="object"&&e!==null&&(e.$$typeof===D||e.$$typeof===w||e.$$typeof===k||e.$$typeof===P||e.$$typeof===h||e.$$typeof===ee||e.getModuleId!==void 0))}function c(e,r,t){var n=e.displayName;if(n)return n;var s=r.displayName||r.name||"";return s!==""?t+"("+s+")":t}function d(e){return e.displayName||"Context"}function u(e){if(e==null)return null;if(typeof e.tag=="number"&&m("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case O:return"Fragment";case I:return"Portal";case b:return"Profiler";case S:return"StrictMode";case W:return"Suspense";case g:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case P:var r=e;return d(r)+".Consumer";case k:var t=e;return d(t._context)+".Provider";case h:return c(e,e.render,"ForwardRef");case w:var n=e.displayName||null;return n!==null?n:u(e.type)||"Memo";case D:{var s=e,l=s._payload,i=s._init;try{return u(i(l))}catch{return null}}}return null}var y=Object.assign,T=0,Y,Q,Re,we,_e,Te,xe;function Se(){}Se.__reactDisabledLog=!0;function Ke(){{if(T===0){Y=console.log,Q=console.info,Re=console.warn,we=console.error,_e=console.group,Te=console.groupCollapsed,xe=console.groupEnd;var e={configurable:!0,enumerable:!0,value:Se,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}T++}}function He(){{if(T--,T===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:y({},e,{value:Y}),info:y({},e,{value:Q}),warn:y({},e,{value:Re}),error:y({},e,{value:we}),group:y({},e,{value:_e}),groupCollapsed:y({},e,{value:Te}),groupEnd:y({},e,{value:xe})})}T<0&&m("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var se=j.ReactCurrentDispatcher,le;function re(e,r,t){{if(le===void 0)try{throw Error()}catch(s){var n=s.stack.trim().match(/\n( *(at )?)/);le=n&&n[1]||""}return`
`+le+e}}var ce=!1,te;{var Ge=typeof WeakMap=="function"?WeakMap:Map;te=new Ge}function Ce(e,r){if(!e||ce)return"";{var t=te.get(e);if(t!==void 0)return t}var n;ce=!0;var s=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var l;l=se.current,se.current=null,Ke();try{if(r){var i=function(){throw Error()};if(Object.defineProperty(i.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(i,[])}catch(R){n=R}Reflect.construct(e,[],i)}else{try{i.call()}catch(R){n=R}e.call(i.prototype)}}else{try{throw Error()}catch(R){n=R}e()}}catch(R){if(R&&n&&typeof R.stack=="string"){for(var o=R.stack.split(`
`),E=n.stack.split(`
`),v=o.length-1,p=E.length-1;v>=1&&p>=0&&o[v]!==E[p];)p--;for(;v>=1&&p>=0;v--,p--)if(o[v]!==E[p]){if(v!==1||p!==1)do if(v--,p--,p<0||o[v]!==E[p]){var x=`
`+o[v].replace(" at new "," at ");return e.displayName&&x.includes("<anonymous>")&&(x=x.replace("<anonymous>",e.displayName)),typeof e=="function"&&te.set(e,x),x}while(v>=1&&p>=0);break}}}finally{ce=!1,se.current=l,He(),Error.prepareStackTrace=s}var B=e?e.displayName||e.name:"",M=B?re(B):"";return typeof e=="function"&&te.set(e,M),M}function Xe(e,r,t){return Ce(e,!1)}function Ze(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function ne(e,r,t){if(e==null)return"";if(typeof e=="function")return Ce(e,Ze(e));if(typeof e=="string")return re(e);switch(e){case W:return re("Suspense");case g:return re("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case h:return Xe(e.render);case w:return ne(e.type,r,t);case D:{var n=e,s=n._payload,l=n._init;try{return ne(l(s),r,t)}catch{}}}return""}var $=Object.prototype.hasOwnProperty,Oe={},Pe=j.ReactDebugCurrentFrame;function ae(e){if(e){var r=e._owner,t=ne(e.type,e._source,r?r.type:null);Pe.setExtraStackFrame(t)}else Pe.setExtraStackFrame(null)}function Qe(e,r,t,n,s){{var l=Function.call.bind($);for(var i in e)if(l(e,i)){var o=void 0;try{if(typeof e[i]!="function"){var E=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw E.name="Invariant Violation",E}o=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(v){o=v}o&&!(o instanceof Error)&&(ae(s),m("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",t,i,typeof o),ae(null)),o instanceof Error&&!(o.message in Oe)&&(Oe[o.message]=!0,ae(s),m("Failed %s type: %s",t,o.message),ae(null))}}}var $e=Array.isArray;function ue(e){return $e(e)}function qe(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function er(e){try{return je(e),!1}catch{return!0}}function je(e){return""+e}function ke(e){if(er(e))return m("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",qe(e)),je(e)}var De=j.ReactCurrentOwner,rr={key:!0,ref:!0,__self:!0,__source:!0},Fe,Ae;function tr(e){if($.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function nr(e){if($.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function ar(e,r){typeof e.ref=="string"&&De.current}function or(e,r){{var t=function(){Fe||(Fe=!0,m("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function ir(e,r){{var t=function(){Ae||(Ae=!0,m("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var sr=function(e,r,t,n,s,l,i){var o={$$typeof:_,type:e,key:r,ref:t,props:i,_owner:l};return o._store={},Object.defineProperty(o._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(o,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(o,"_source",{configurable:!1,enumerable:!1,writable:!1,value:s}),Object.freeze&&(Object.freeze(o.props),Object.freeze(o)),o};function lr(e,r,t,n,s){{var l,i={},o=null,E=null;t!==void 0&&(ke(t),o=""+t),nr(r)&&(ke(r.key),o=""+r.key),tr(r)&&(E=r.ref,ar(r,s));for(l in r)$.call(r,l)&&!rr.hasOwnProperty(l)&&(i[l]=r[l]);if(e&&e.defaultProps){var v=e.defaultProps;for(l in v)i[l]===void 0&&(i[l]=v[l])}if(o||E){var p=typeof e=="function"?e.displayName||e.name||"Unknown":e;o&&or(i,p),E&&ir(i,p)}return sr(e,o,E,s,n,De.current,i)}}var fe=j.ReactCurrentOwner,Le=j.ReactDebugCurrentFrame;function U(e){if(e){var r=e._owner,t=ne(e.type,e._source,r?r.type:null);Le.setExtraStackFrame(t)}else Le.setExtraStackFrame(null)}var de;de=!1;function ve(e){return typeof e=="object"&&e!==null&&e.$$typeof===_}function Ie(){{if(fe.current){var e=u(fe.current.type);if(e)return`

Check the render method of \``+e+"`."}return""}}function cr(e){return""}var We={};function ur(e){{var r=Ie();if(!r){var t=typeof e=="string"?e:e.displayName||e.name;t&&(r=`

Check the top-level render call using <`+t+">.")}return r}}function Ye(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=ur(r);if(We[t])return;We[t]=!0;var n="";e&&e._owner&&e._owner!==fe.current&&(n=" It was passed a child from "+u(e._owner.type)+"."),U(e),m('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),U(null)}}function Me(e,r){{if(typeof e!="object")return;if(ue(e))for(var t=0;t<e.length;t++){var n=e[t];ve(n)&&Ye(n,r)}else if(ve(e))e._store&&(e._store.validated=!0);else if(e){var s=G(e);if(typeof s=="function"&&s!==e.entries)for(var l=s.call(e),i;!(i=l.next()).done;)ve(i.value)&&Ye(i.value,r)}}}function fr(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===h||r.$$typeof===w))t=r.propTypes;else return;if(t){var n=u(r);Qe(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!de){de=!0;var s=u(r);m("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",s||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&m("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function dr(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){U(e),m("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),U(null);break}}e.ref!==null&&(U(e),m("Invalid attribute `ref` supplied to `React.Fragment`."),U(null))}}var Ne={};function Ve(e,r,t,n,s,l){{var i=a(e);if(!i){var o="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(o+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var E=cr();E?o+=E:o+=Ie();var v;e===null?v="null":ue(e)?v="array":e!==void 0&&e.$$typeof===_?(v="<"+(u(e.type)||"Unknown")+" />",o=" Did you accidentally export a JSX literal instead of a component?"):v=typeof e,m("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",v,o)}var p=lr(e,r,t,s,l);if(p==null)return p;if(i){var x=r.children;if(x!==void 0)if(n)if(ue(x)){for(var B=0;B<x.length;B++)Me(x[B],e);Object.freeze&&Object.freeze(x)}else m("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Me(x,e)}if($.call(r,"key")){var M=u(e),R=Object.keys(r).filter(function(yr){return yr!=="key"}),pe=R.length>0?"{key: someKey, "+R.join(": ..., ")+": ...}":"{key: someKey}";if(!Ne[M+pe]){var gr=R.length>0?"{"+R.join(": ..., ")+": ...}":"{}";m(`A props object containing a "key" prop is being spread into JSX:
  let props = %s;
  <%s {...props} />
React keys must be passed directly to JSX without using spread:
  let props = %s;
  <%s key={someKey} {...props} />`,pe,M,gr,M),Ne[M+pe]=!0}}return e===O?dr(p):fr(p),p}}function vr(e,r,t){return Ve(e,r,t,!0)}function pr(e,r,t){return Ve(e,r,t,!1)}var mr=pr,hr=vr;J.Fragment=O,J.jsx=mr,J.jsxs=hr}()),J}process.env.NODE_ENV==="production"?oe.exports=Be():oe.exports=ze();var q=oe.exports;Ue.polyfill();const be=L=>{let _=0;const I="onscrollend"in window,O=()=>{window.removeEventListener("scroll",b),window.removeEventListener("scrollend",S),clearTimeout(_)},S=()=>{O(),L()},b=()=>{clearTimeout(_),_=window.setTimeout(S,480)};I?window.addEventListener("scrollend",S,{once:!0}):(window.addEventListener("scroll",b),b())},Je=({anchorPoints:L,anchorImages:_,anchorActiveImages:I,number:O,navbarHeight:S,paddingTab:b,align:k,width:P,zIndex:h,className:W,style:g})=>{const w=f.useMemo(()=>_.map((a,c)=>{const d=new Image,u=new Image;return d.src=a,u.src=I[c]||a,{id:L[c]||"",img:d,activeImg:u}}),[L,_,I]),D=f.useMemo(()=>({width:`${P??"728px"}`,margin:k==="left"?"0 auto 0 0":k==="right"?"0 0 0 auto":"0 auto",zIndex:h??10,...g}),[P,k,h,g]),F=f.useRef([]),K=f.useRef([]),H=f.useRef(null),G=f.useRef(null),j=f.useRef(!1),m=f.useRef(0),[N,ie]=f.useState(0),[X,V]=f.useState(0),A=f.useCallback(()=>{var c;return(((c=F.current[0])==null?void 0:c.offsetHeight)??S??75)+(b??0)},[S,b]);f.useLayoutEffect(()=>{K.current=w.map(d=>document.getElementById(d.id)),V(A());const a=F.current[0];if(!a)return;const c=new he(()=>V(A()));return c.observe(a),()=>c.disconnect()},[w,A]);const Z=f.useCallback((a,c=!1)=>{const d=H.current,u=F.current[a];if(!d||!u)return;const y=Math.max(u.offsetLeft-(d.clientWidth-u.offsetWidth)/2,0);c?d.scrollTo({left:y,behavior:"smooth"}):d.scrollLeft=y},[]);f.useEffect(()=>{let a=!1;const c=()=>{let u=0;K.current.forEach((y,T)=>{const Y=y==null?void 0:y.getBoundingClientRect();Y&&Y.top<X+X*.2&&(u=T)}),ie(u),a=!1},d=()=>{a||(window.requestAnimationFrame(c),a=!0)};return window.addEventListener("scroll",d,{passive:!0}),()=>window.removeEventListener("scroll",d)},[X]),f.useEffect(()=>{be(()=>{j.current||Z(N,!0)})},[N,Z]),f.useEffect(()=>{const a=()=>V(A());return window.addEventListener("resize",a,{passive:!0}),()=>window.removeEventListener("resize",a)},[A]),f.useEffect(()=>{const a=H.current;if(!a)return;const c=()=>{if(!a)return;const T=b??0;G.current&&(G.current.style.height=`${a.offsetHeight-T}px`),a.classList.contains("fixed")?a.style.paddingTop=`${T}px`:m.current=a.getBoundingClientRect().top+window.scrollY-T,V(A())},d=new he(c);d.observe(a);const u=document.createElement("div");u.style.width="100%",u.style.visibility="hidden",G.current=u,c();const y=()=>{var Y,Q;window.scrollY>=m.current&&m.current!==0?a.classList.contains("fixed")||((Y=a.parentNode)==null||Y.insertBefore(u,a),a.classList.add("fixed","safe-padding"),a.style.paddingTop=`${b??0}px`):a.classList.contains("fixed")&&(a.classList.remove("fixed","safe-padding"),(Q=u.parentNode)==null||Q.removeChild(u),a.style.paddingTop="")};return window.addEventListener("scroll",y,{passive:!0}),()=>{d.disconnect(),window.removeEventListener("scroll",y)}},[A,b]);const ee=(a,c)=>{const d=document.getElementById(c);d&&(j.current=!0,d.scrollIntoView({behavior:"smooth",block:"start"}),be(()=>{j.current=!1,Z(a,!0)}))};return q.jsx("div",{ref:H,className:me("elevator",W),style:{...D,...g},children:q.jsx("div",{className:"elevator-wrapper",children:w.map((a,c)=>q.jsx("div",{ref:d=>F.current[c]=d,className:"elevator-item-wrapper",style:{flex:`0 0 calc(100% / ${O})`},onClick:()=>ee(c,a.id),children:q.jsx("img",{src:(N===c?a.activeImg:a.img).src,alt:`sticky-elevator-tab-${c}`,className:me("elevator-item",N===c&&"elevator-item-active")})},a.id))})})};C.Elevator=Je,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})});