@ehfuse/overlay-scrollbar 1.6.0 → 1.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/OverlayScrollbar.d.ts +86 -0
- package/dist/OverlayScrollbar.d.ts.map +1 -0
- package/dist/components/ScrollbarArrows.d.ts +29 -0
- package/dist/components/ScrollbarArrows.d.ts.map +1 -0
- package/dist/components/ScrollbarThumb.d.ts +35 -0
- package/dist/components/ScrollbarThumb.d.ts.map +1 -0
- package/dist/components/ScrollbarTrack.d.ts +32 -0
- package/dist/components/ScrollbarTrack.d.ts.map +1 -0
- package/dist/hooks/useArrowNavigation.d.ts +27 -0
- package/dist/hooks/useArrowNavigation.d.ts.map +1 -0
- package/dist/hooks/useAutoHide.d.ts +19 -0
- package/dist/hooks/useAutoHide.d.ts.map +1 -0
- package/dist/hooks/useDragScroll.d.ts +23 -0
- package/dist/hooks/useDragScroll.d.ts.map +1 -0
- package/dist/hooks/useKeyboardNavigation.d.ts +18 -0
- package/dist/hooks/useKeyboardNavigation.d.ts.map +1 -0
- package/dist/hooks/useScrollEvents.d.ts +20 -0
- package/dist/hooks/useScrollEvents.d.ts.map +1 -0
- package/dist/hooks/useScrollbarConfig.d.ts +53 -0
- package/dist/hooks/useScrollbarConfig.d.ts.map +1 -0
- package/dist/hooks/useScrollbarInitialization.d.ts +21 -0
- package/dist/hooks/useScrollbarInitialization.d.ts.map +1 -0
- package/dist/hooks/useScrollbarUpdate.d.ts +27 -0
- package/dist/hooks/useScrollbarUpdate.d.ts.map +1 -0
- package/dist/hooks/useThumbDrag.d.ts +25 -0
- package/dist/hooks/useThumbDrag.d.ts.map +1 -0
- package/dist/hooks/useTrackClick.d.ts +20 -0
- package/dist/hooks/useTrackClick.d.ts.map +1 -0
- package/dist/index.d.ts +8 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +43 -21
- package/dist/index.esm.js.map +4 -4
- package/dist/index.js +43 -21
- package/dist/index.js.map +4 -4
- package/dist/src/OverlayScrollbar.d.ts +61 -2
- package/dist/src/OverlayScrollbar.d.ts.map +1 -1
- package/dist/types.d.ts +70 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/utils/dragScrollUtils.d.ts +40 -0
- package/dist/utils/dragScrollUtils.d.ts.map +1 -0
- package/package.json +4 -11
package/dist/index.js
CHANGED
|
@@ -1,22 +1,44 @@
|
|
|
1
|
-
"use strict";var te=Object.defineProperty;var $e=Object.getOwnPropertyDescriptor;var We=Object.getOwnPropertyNames;var ze=Object.prototype.hasOwnProperty;var je=(t,e)=>{for(var n in e)te(t,n,{get:e[n],enumerable:!0})},Be=(t,e,n,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of We(e))!ze.call(t,o)&&o!==n&&te(t,o,{get:()=>e[o],enumerable:!(r=$e(e,o))||r.enumerable});return t};var qe=t=>Be(te({},"__esModule",{value:!0}),t);var Ye={};je(Ye,{OverlayScrollbar:()=>re,default:()=>re});module.exports=qe(Ye);var C=require("react");var ae={},ce={},se={},ue={},de={};var q=require("react"),me=({thumb:t,track:e,arrows:n,dragScroll:r,autoHide:o})=>{let a=(0,q.useMemo)(()=>{let s=t.color??"#606060";return{width:t.width??8,minHeight:t.minHeight??50,radius:t.radius??(t.width??8)/2,color:s,opacity:t.opacity??.6,hoverColor:t.hoverColor??s,hoverOpacity:t.hoverOpacity??1}},[t]),c=(0,q.useMemo)(()=>({width:e.width??16,color:e.color??"rgba(128, 128, 128, 0.1)",visible:e.visible??!0,alignment:e.alignment??"center",radius:e.radius??a.radius??4,margin:e.margin??4}),[e,a.radius]),b=(0,q.useMemo)(()=>{let s=n.color??"#808080";return{visible:n.visible??!1,step:n.step??50,color:s,opacity:n.opacity??.6,hoverColor:n.hoverColor??s,hoverOpacity:n.hoverOpacity??1}},[n]),d=(0,q.useMemo)(()=>({enabled:r.enabled??!0,excludeClasses:r.excludeClasses??[],excludeSelectors:r.excludeSelectors??[]}),[r]),l=(0,q.useMemo)(()=>({enabled:o.enabled??!0,delay:o.delay??1500,delayOnWheel:o.delayOnWheel??700}),[o]);return{finalThumbConfig:a,finalTrackConfig:c,finalArrowsConfig:b,finalDragScrollConfig:d,finalAutoHideConfig:l}};var O=require("react"),pe=({wrapperRef:t,scrollbarRef:e,contentRef:n,findScrollableElement:r,clearHideTimer:o,setScrollbarVisible:a,thumb:c,track:b,arrows:d,autoHide:l})=>{let[s,g]=(0,O.useState)(0),[f,T]=(0,O.useState)(0),[E,i]=(0,O.useState)(!1),m=c.minHeight??50,h=c.width??8,p=d.visible??!1,u=b.margin??4,v=l.enabled??!0,y=(0,O.useCallback)(()=>{let w=r();if(!w){a(!1),i(!1),o();return}if(i(!0),!e.current)return;v||(a(!0),o());let M=w.clientHeight,H=w.scrollHeight,U=w.scrollTop,z=0;if(t.current){let D=window.getComputedStyle(t.current),Y=parseFloat(D.paddingTop)||0,L=parseFloat(D.paddingBottom)||0;z=Y+L}let S=p?h*2+u*4:u*2,P=M-S+z,V=M/H,Z=Math.max(P*V,m),j=H-M,K=P-Z,Q=j>0?U/j*K:0;g(Z),T(Q)},[r,o,a,t,e,m,h,p,u,v]);return(0,O.useEffect)(()=>{y()},[y]),(0,O.useEffect)(()=>{let w=r();if(!w)return;let M=new ResizeObserver(()=>{y()});return M.observe(w),n.current&&M.observe(n.current),()=>M.disconnect()},[r,n,y]),{thumbHeight:s,thumbTop:f,hasScrollableContent:E,updateScrollbar:y}};var A=require("react"),be=({findScrollableElement:t,thumbHeight:e,clearHideTimer:n,setScrollbarVisible:r,updateScrollbar:o,setHideTimer:a,hideDelay:c,isScrollable:b,maintainFocus:d})=>{let[l,s]=(0,A.useState)(!1),[g,f]=(0,A.useState)(!1),[T,E]=(0,A.useState)({y:0,scrollTop:0}),i=(0,A.useCallback)(p=>{p.preventDefault(),p.stopPropagation();let u=t();u&&(s(!0),E({y:p.clientY,scrollTop:u.scrollTop}),n(),r(!0),d())},[t,n,r,d]),m=(0,A.useCallback)(p=>{if(!l)return;let u=t();if(!u)return;let v=u.clientHeight,w=u.scrollHeight-v,M=p.clientY-T.y,H=v-e,U=M/H*w,z=Math.max(0,Math.min(w,T.scrollTop+U));u.scrollTop=z,o()},[l,T,e,t,o]),h=(0,A.useCallback)(()=>{s(!1),b()&&a(c)},[b,a,c]);return(0,A.useEffect)(()=>{if(l)return document.addEventListener("mousemove",m),document.addEventListener("mouseup",h),()=>{document.removeEventListener("mousemove",m),document.removeEventListener("mouseup",h)}},[l,m,h]),{isDragging:l,isThumbHovered:g,setIsThumbHovered:f,handleThumbMouseDown:i}};var fe=require("react"),ge=({scrollbarRef:t,findScrollableElement:e,updateScrollbar:n,setScrollbarVisible:r,setHideTimer:o,hideDelay:a,maintainFocus:c})=>({handleTrackClick:(0,fe.useCallback)(d=>{if(!t.current)return;let s=t.current.getBoundingClientRect(),g=d.clientY-s.top,f=e();if(!f)return;let T=f.clientHeight,E=f.scrollHeight,m=g/T*(E-T);f.scrollTop=Math.max(0,Math.min(E-T,m)),n(),r(!0),o(a),c()},[t,n,o,a,e,c,r])});var G=require("react"),he=({arrows:t,containerRef:e,contentRef:n,updateScrollbar:r,setScrollbarVisible:o,setHideTimer:a,hideDelay:c,maintainFocus:b})=>{let[d,l]=(0,G.useState)(null),[s,g]=(0,G.useState)(null),f=t.step??50,T=(0,G.useCallback)(i=>{if(i.preventDefault(),i.stopPropagation(),!e.current)return;let m=Math.max(0,e.current.scrollTop-f);e.current.scrollTop=m,r(),o(!0),a(c),b()},[e,r,a,f,c,b,o]),E=(0,G.useCallback)(i=>{if(i.preventDefault(),i.stopPropagation(),!e.current||!n.current)return;let m=e.current,p=n.current.scrollHeight-m.clientHeight,u=Math.min(p,m.scrollTop+f);m.scrollTop=u,r(),o(!0),a(c),b()},[e,n,r,a,f,c,b,o]);return{activeArrow:d,setActiveArrow:l,hoveredArrow:s,setHoveredArrow:g,handleUpArrowClick:T,handleDownArrowClick:E}};var R=require("react");var Ge=["editor","textarea","input","select","textfield","form-control","contenteditable","MuiInputBase-input","MuiSelect-select","MuiOutlinedInput-input","MuiFilledInput-input","MuiInput-input","MuiFormControl-root","MuiTextField-root","MuiSelect-root","MuiOutlinedInput-root","MuiFilledInput-root","MuiInput-root","MuiAutocomplete-input","MuiDatePicker-input","MuiSlider-thumb","MuiSlider-rail","MuiSlider-track","MuiSlider-mark","MuiSlider-markLabel","MuiSlider-root","MuiSlider-colorPrimary","MuiSlider-sizeMedium","MuiIconButton-root","MuiButton-root","MuiButtonBase-root","MuiTouchRipple-root","MuiCheckbox-root","MuiRadio-root","MuiSwitch-root","PrivateSwitchBase-root","ant-input","ant-input-affix-wrapper","ant-input-group-addon","ant-input-number","ant-input-number-handler","ant-select","ant-select-selector","ant-select-selection-search","ant-select-dropdown","ant-cascader","ant-cascader-input","ant-picker","ant-picker-input","ant-time-picker","ant-calendar-picker","ant-slider","ant-slider-track","ant-slider-handle","ant-switch","ant-checkbox","ant-checkbox-wrapper","ant-radio","ant-radio-wrapper","ant-rate","ant-upload","ant-upload-drag","ant-form-item","ant-form-item-control","ant-btn","ant-dropdown","ant-dropdown-trigger","ant-menu","ant-menu-item","ant-tooltip","ant-popover","ant-modal","ant-drawer","ant-tree-select","ant-auto-complete","ant-mentions","ant-transfer","ui-input","ui-textarea","ui-select","ui-select-trigger","ui-select-content","ui-select-item","ui-button","ui-checkbox","ui-radio-group","ui-switch","ui-slider","ui-range-slider","ui-calendar","ui-date-picker","ui-combobox","ui-command","ui-command-input","ui-popover","ui-dialog","ui-sheet","ui-dropdown-menu","ui-context-menu","ui-menubar","ui-navigation-menu","ui-form","ui-form-control","ui-form-item","ui-form-field","ui-label","radix-ui","radix-select","radix-dropdown","radix-dialog","radix-popover","radix-accordion","radix-tabs","radix-slider","radix-switch","radix-checkbox","radix-radio","ql-editor","ql-container","ql-toolbar","ql-picker","ql-picker-label","ql-picker-options","ql-formats","ql-snow","ql-bubble","quill","quilleditor","monaco-editor","monaco-editor-background","view-lines","decorationsOverviewRuler","monaco-scrollable-element","CodeMirror","CodeMirror-code","CodeMirror-lines","CodeMirror-scroll","CodeMirror-sizer","cm-editor","cm-focused","cm-content","tox-editor-container","tox-editor-header","tox-edit-area","tox-tinymce","mce-content-body","ck-editor","ck-content","ck-toolbar","ck-editor__editable","ck-widget","slate-editor","slate-content","DraftEditor-root","DraftEditor-editorContainer","public-DraftEditor-content","ehfuse-editor","ehfuse-editor-wrapper","ehfuse-editor-content","ehfuse-toolbar","ehfuse-toolbar-group","ehfuse-cursor","text-editor","rich-text-editor","wysiwyg","ace_editor","ace_content"],ve=(t,e)=>{let n=t.tagName.toLowerCase(),r=["text","password","email","number","search","tel","url","checkbox","radio"];if(n==="input"){let o=t.type;return r.includes(o)}if(["textarea","select","button"].includes(n)||["svg","path","circle","rect","line","polygon","polyline"].includes(n)||t.getAttribute("contenteditable")==="true")return!0;if(e?.excludeSelectors){for(let o of e.excludeSelectors)if(t.matches(o))return!0}return Ke(t,e)},Ke=(t,e)=>{let n=[...Ge,...e?.excludeClasses||[]],r=t,o=0,a=5;for(;r&&o<=a;){if(n.some(c=>r.classList.contains(c)))return!0;if(r.classList.contains("MuiDialogContent-root"))break;r=r.parentElement,o++}return!1};var Te=({dragScroll:t,findScrollableElement:e,clearHideTimer:n,setScrollbarVisible:r,updateScrollbar:o,setHideTimer:a,hideDelay:c,isScrollable:b})=>{let[d,l]=(0,R.useState)(!1),[s,g]=(0,R.useState)(!1),[f,T]=(0,R.useState)({x:0,y:0,scrollTop:0,scrollLeft:0}),E=t.enabled??!0,i=5,m=(0,R.useCallback)(u=>{if(!E)return;let v=u.target;if(ve(v,t)||u.button!==0)return;let y=e();y&&(y.scrollHeight<=y.clientHeight||(u.preventDefault(),l(!0),g(!1),T({x:u.clientX,y:u.clientY,scrollTop:y.scrollTop,scrollLeft:y.scrollLeft||0})))},[E,t,e,n,r]),h=(0,R.useCallback)(u=>{if(!d)return;let v=e();if(!v)return;let y=f.x-u.clientX,w=f.y-u.clientY;if(!s)if(Math.sqrt(y*y+w*w)>=i)g(!0),n(),r(!0);else return;let M=Math.max(0,Math.min(v.scrollHeight-v.clientHeight,f.scrollTop+w));v.scrollTop=M,o()},[d,s,f,i,e,o,n,r]),p=(0,R.useCallback)(()=>{l(!1),g(!1),b()&&a(c)},[b,a,c]);return(0,R.useEffect)(()=>{if(d)return document.addEventListener("mousemove",h),document.addEventListener("mouseup",p),()=>{document.removeEventListener("mousemove",h),document.removeEventListener("mouseup",p)}},[d,h,p]),{isDragScrolling:d,handleDragScrollStart:m}};var X=require("react"),ye=({containerRef:t,findScrollableElement:e,updateScrollbar:n,clearHideTimer:r,setScrollbarVisible:o,setHideTimer:a,autoHide:c,onScroll:b})=>{let d=(0,X.useRef)(null),l=(0,X.useRef)(!1),s=c.delay??1500,g=c.delayOnWheel??700;(0,X.useEffect)(()=>{let f=h=>{let p=h.target,u=e();if(!u||p!==u)return;n(),r(),o(!0);let v=l.current?g:s;a(v),b&&b(h)},T=h=>{let p=h.target,u=t.current;if(!u||!u.contains(p)||p.classList.contains("overlay-scrollbar-container")&&p!==u)return;let v=p.parentElement;for(;v&&v!==u;){if(v.classList.contains("overlay-scrollbar-container"))return;v=v.parentElement}l.current=!0,d.current&&clearTimeout(d.current),d.current=setTimeout(()=>{l.current=!1},300),r(),o(!0)},E=[],i=e();i&&E.push(i);let m=t.current;return m&&!i&&(E.push(m),m.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]').forEach(p=>{let u=p;if(u!==m&&u.classList.contains("overlay-scrollbar-container"))return;let v=u.parentElement;for(;v&&v!==m;){if(v.classList.contains("overlay-scrollbar-container")&&v!==m)return;v=v.parentElement}E.push(u)})),E.forEach(h=>{h.addEventListener("scroll",f,{passive:!0}),h.addEventListener("wheel",T,{passive:!0})}),()=>{E.forEach(h=>{h.removeEventListener("scroll",f),h.removeEventListener("wheel",T)}),d.current&&clearTimeout(d.current)}},[t,e,n,b,r,a,s,g,o])};var Ee=require("react"),Ce=({containerRef:t,findScrollableElement:e,updateScrollbar:n,clearHideTimer:r,setScrollbarVisible:o,setHideTimer:a,hideDelay:c})=>{(0,Ee.useEffect)(()=>{let b=l=>{let s=l.target;if(s.tagName==="INPUT"||s.tagName==="TEXTAREA"||s.tagName==="SELECT"||s.isContentEditable||s.getAttribute("role")==="textbox"||s.classList.contains("MuiInputBase-input")||s.closest(".MuiTextField-root")||s.closest('[contenteditable="true"]'))return;let g=e();if(!g)return;let{key:f}=l,{scrollTop:T,scrollHeight:E,clientHeight:i}=g,m=E-i,h=50,p=null;switch(f){case"ArrowUp":l.preventDefault(),p=Math.max(0,T-h);break;case"ArrowDown":l.preventDefault(),p=Math.min(m,T+h);break;case"PageUp":l.preventDefault(),p=Math.max(0,T-i);break;case"PageDown":l.preventDefault(),p=Math.min(m,T+i);break;case"Home":l.preventDefault(),p=0;break;case"End":l.preventDefault(),p=m;break;default:return}p!==null&&(g.scrollTop=p,n(),r(),o(!0),a(c))},d=t.current;if(d)return d.addEventListener("keydown",b),()=>{d.removeEventListener("keydown",b)}},[t,e,n,r,o,a,c])};var I=require("react"),we=({containerRef:t,contentRef:e,cachedScrollContainerRef:n,updateScrollbar:r,setScrollbarVisible:o,isScrollable:a,autoHide:c})=>{let[b,d]=(0,I.useState)(!1);return(0,I.useEffect)(()=>{r();let l=setTimeout(()=>{r()},100);return()=>clearTimeout(l)},[r]),(0,I.useLayoutEffect)(()=>{d(!0),r(),!c.enabled&&a()&&o(!0)},[a,r,c.enabled,o]),(0,I.useEffect)(()=>{let l=new ResizeObserver(()=>{r()}),s=[];return t.current&&s.push(t.current),e.current&&s.push(e.current),n.current&&document.contains(n.current)&&s.push(n.current),s.forEach(g=>{l.observe(g)}),()=>l.disconnect()},[r,t,e,n]),(0,I.useEffect)(()=>{if(!t.current)return;let l=new MutationObserver(()=>{n.current=null,r()});return l.observe(t.current,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}),()=>l.disconnect()},[r,t,n]),(0,I.useEffect)(()=>{let l="overlay-scrollbar-webkit-hide",s=document.getElementById(l);s&&s.remove();let g=document.createElement("style");return g.id=l,g.textContent=`
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
1
|
+
"use strict";var Me=Object.defineProperty;var dt=Object.getOwnPropertyDescriptor;var pt=Object.getOwnPropertyNames;var mt=Object.prototype.hasOwnProperty;var ht=(g,v)=>{for(var S in v)Me(g,S,{get:v[S],enumerable:!0})},ft=(g,v,S,E)=>{if(v&&typeof v=="object"||typeof v=="function")for(let w of pt(v))!mt.call(g,w)&&w!==S&&Me(g,w,{get:()=>v[w],enumerable:!(E=dt(v,w))||E.enumerable});return g};var bt=g=>ft(Me({},"__esModule",{value:!0}),g);var Et={};ht(Et,{OverlayScrollbar:()=>Ee,default:()=>Ee});module.exports=bt(Et);var t=require("react");var gt=["editor","textarea","input","select","textfield","form-control","contenteditable","MuiInputBase-input","MuiSelect-select","MuiOutlinedInput-input","MuiFilledInput-input","MuiInput-input","MuiFormControl-root","MuiTextField-root","MuiSelect-root","MuiOutlinedInput-root","MuiFilledInput-root","MuiInput-root","MuiAutocomplete-input","MuiDatePicker-input","MuiSlider-thumb","MuiSlider-rail","MuiSlider-track","MuiSlider-mark","MuiSlider-markLabel","MuiSlider-root","MuiSlider-colorPrimary","MuiSlider-sizeMedium","MuiIconButton-root","MuiButton-root","MuiButtonBase-root","MuiTouchRipple-root","MuiCheckbox-root","MuiRadio-root","MuiSwitch-root","PrivateSwitchBase-root","ant-input","ant-input-affix-wrapper","ant-input-group-addon","ant-input-number","ant-input-number-handler","ant-select","ant-select-selector","ant-select-selection-search","ant-select-dropdown","ant-cascader","ant-cascader-input","ant-picker","ant-picker-input","ant-time-picker","ant-calendar-picker","ant-slider","ant-slider-track","ant-slider-handle","ant-switch","ant-checkbox","ant-checkbox-wrapper","ant-radio","ant-radio-wrapper","ant-rate","ant-upload","ant-upload-drag","ant-form-item","ant-form-item-control","ant-btn","ant-dropdown","ant-dropdown-trigger","ant-menu","ant-menu-item","ant-tooltip","ant-popover","ant-modal","ant-drawer","ant-tree-select","ant-auto-complete","ant-mentions","ant-transfer","ui-input","ui-textarea","ui-select","ui-select-trigger","ui-select-content","ui-select-item","ui-button","ui-checkbox","ui-radio-group","ui-switch","ui-slider","ui-range-slider","ui-calendar","ui-date-picker","ui-combobox","ui-command","ui-command-input","ui-popover","ui-dialog","ui-sheet","ui-dropdown-menu","ui-context-menu","ui-menubar","ui-navigation-menu","ui-form","ui-form-control","ui-form-item","ui-form-field","ui-label","radix-ui","radix-select","radix-dropdown","radix-dialog","radix-popover","radix-accordion","radix-tabs","radix-slider","radix-switch","radix-checkbox","radix-radio","ql-editor","ql-container","ql-toolbar","ql-picker","ql-picker-label","ql-picker-options","ql-formats","ql-snow","ql-bubble","quill","quilleditor","monaco-editor","monaco-editor-background","view-lines","decorationsOverviewRuler","monaco-scrollable-element","CodeMirror","CodeMirror-code","CodeMirror-lines","CodeMirror-scroll","CodeMirror-sizer","cm-editor","cm-focused","cm-content","tox-editor-container","tox-editor-header","tox-edit-area","tox-tinymce","mce-content-body","ck-editor","ck-content","ck-toolbar","ck-editor__editable","ck-widget","slate-editor","slate-content","DraftEditor-root","DraftEditor-editorContainer","public-DraftEditor-content","ehfuse-editor","ehfuse-editor-wrapper","ehfuse-editor-content","ehfuse-toolbar","ehfuse-toolbar-group","ehfuse-cursor","text-editor","rich-text-editor","wysiwyg","ace_editor","ace_content"],Se=(g,v)=>{let S=g.tagName.toLowerCase(),E=["text","password","email","number","search","tel","url","checkbox","radio"];if(S==="input"){let w=g.type;return E.includes(w)}if(["textarea","select","button"].includes(S)||["svg","path","circle","rect","line","polygon","polyline"].includes(S)||g.getAttribute("contenteditable")==="true")return!0;if(v?.excludeSelectors){for(let w of v.excludeSelectors)if(g.matches(w))return!0}return vt(g,v)},vt=(g,v)=>{let S=[...gt,...v?.excludeClasses||[]],E=g,w=0,I=5;for(;E&&w<=I;){if(S.some(C=>E.classList.contains(C)))return!0;if(E.classList.contains("MuiDialogContent-root"))break;E=E.parentElement,w++}return!1};var M=require("react/jsx-runtime"),yt={},xt={},Tt={},wt={},Mt={},St=(0,t.forwardRef)(({className:g="",style:v={},containerStyle:S={},contentStyle:E={},children:w,onScroll:I,thumb:C=yt,track:A=xt,arrows:O=Tt,dragScroll:X=wt,autoHide:$=Mt,showScrollbar:Y=!0,detectInnerScroll:_e=!1},Ue)=>{let qe=(0,t.useRef)({});(0,t.useEffect)(()=>{qe.current={children:w,onScroll:I,showScrollbar:Y,thumb:C,track:A,arrows:O,dragScroll:X,autoHide:$}});let ce=(0,t.useRef)(null),a=(0,t.useRef)(null),z=(0,t.useRef)(null),U=(0,t.useRef)(null),Be=(0,t.useRef)(null),L=(0,t.useRef)(null),[ee,T]=(0,t.useState)(!1),[N,Ce]=(0,t.useState)(!1),[He,De]=(0,t.useState)(!1),[se,Xe]=(0,t.useState)({y:0,scrollTop:0}),[G,Ye]=(0,t.useState)(0),[Ge,ke]=(0,t.useState)(0),[ue,Le]=(0,t.useState)(!1),[Re,Ie]=(0,t.useState)(!1),[P,Ae]=(0,t.useState)(!1),[de,Je]=(0,t.useState)({x:0,scrollLeft:0}),[pe,Ke]=(0,t.useState)(0),[Ze,je]=(0,t.useState)(0),[Ve,me]=(0,t.useState)(!1),[J,Oe]=(0,t.useState)(!1),[K,Qe]=(0,t.useState)({x:0,y:0,scrollTop:0,scrollLeft:0}),[Ct,Ht]=(0,t.useState)(null),[te,oe]=(0,t.useState)(null),[Dt,et]=(0,t.useState)(!1),Z=(0,t.useRef)(null),[We,$e]=(0,t.useState)(!1),j=(0,t.useRef)(null),F=(0,t.useRef)(null),_=(0,t.useRef)(null),h=(0,t.useMemo)(()=>{let e=C.color??"#606060";return{width:C.width??8,minHeight:C.minHeight??50,radius:C.radius??(C.width??8)/2,color:e,opacity:C.opacity??.6,hoverColor:C.hoverColor??e,hoverOpacity:C.hoverOpacity??1}},[C]),s=(0,t.useMemo)(()=>({width:A.width??16,color:A.color??"rgba(128, 128, 128, 0.1)",visible:A.visible??!0,alignment:A.alignment??"center",radius:A.radius??h.radius??4,margin:A.margin??4}),[A,h.radius]),k=(0,t.useMemo)(()=>{let e=O.color??"#808080";return{visible:O.visible??!1,step:O.step??50,color:e,opacity:O.opacity??.6,hoverColor:O.hoverColor??e,hoverOpacity:O.hoverOpacity??1}},[O]),he=(0,t.useMemo)(()=>({enabled:X.enabled??!0,excludeClasses:X.excludeClasses??[],excludeSelectors:X.excludeSelectors??[]}),[X]),l=(0,t.useMemo)(()=>({enabled:$.enabled??!0,delay:$.delay??1500,delayOnWheel:$.delayOnWheel??700,initialDelay:$.initialDelay??200}),[$]),[q,tt]=(0,t.useState)(()=>($.initialDelay??200)>0),f=h.width,ot=s.width,fe=h.minHeight,R=k.visible,re=k.step,H=(0,t.useCallback)(()=>{if(!a.current)return;let e=document.activeElement;e&&a.current.contains(e)&&e!==a.current||a.current.focus()},[]);(0,t.useImperativeHandle)(Ue,()=>({getScrollContainer:()=>a.current,scrollTo:e=>{a.current&&a.current.scrollTo(e)},get scrollTop(){return a.current?.scrollTop||0},get scrollHeight(){return a.current?.scrollHeight||0},get clientHeight(){return a.current?.clientHeight||0}}),[]);let d=(0,t.useCallback)(()=>{if(L.current){let o=L.current;if(document.contains(o)&&o.scrollHeight>o.clientHeight+2)return o;L.current=null}if(!a.current)return null;if(z.current&&z.current.scrollHeight>a.current.clientHeight+2)return L.current=a.current,a.current;if(!_e)return null;let e=a.current.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]');for(let o of e){let r=o;if(r!==a.current&&r.classList.contains("overlay-scrollbar-container"))continue;let c=r.parentElement,n=!1;for(;c&&c!==a.current;){if(c.classList.contains("overlay-scrollbar-container")&&c!==a.current){n=!0;break}c=c.parentElement}if(!n&&r.scrollHeight>r.clientHeight+2)return L.current=r,r}return null},[]),W=(0,t.useCallback)(()=>d()!==null,[d]),y=(0,t.useCallback)(()=>{j.current&&(clearTimeout(j.current),j.current=null)},[]),ze=(0,t.useCallback)(()=>{F.current&&(clearTimeout(F.current),F.current=null)},[]),Ne=(0,t.useCallback)(()=>{_.current&&(clearTimeout(_.current),_.current=null)},[]),p=(0,t.useCallback)(e=>{l.enabled&&(y(),j.current=setTimeout(()=>{T(!1),j.current=null},e))},[y,l.enabled]),u=(0,t.useCallback)(()=>{let e=d();if(!e){T(!1),Le(!1),me(!1),y();return}if(Le(!0),!U.current)return;!l.enabled&&!q&&(T(!0),y());let o=e.clientHeight,r=e.scrollHeight,c=e.scrollTop,n=e.clientWidth,i=e.scrollWidth,x=e.scrollLeft,b=0;if(ce.current){let ie=window.getComputedStyle(ce.current),ae=parseFloat(ie.paddingTop)||0,we=parseFloat(ie.paddingBottom)||0;b=ae+we}let m=R?f*2+s.margin*4:s.margin*2,V=o-m+b,D=o/r,ne=Math.max(V*D,fe),le=r-o,Pe=V-ne,Fe=le>0?c/le*Pe:0;Ye(ne),ke(Fe);let Q=i-n;if(Q>0){me(!0);let ie=n/i,ae=Math.max(n*ie,50),we=n-ae,ut=Q>0?x/Q*we:0;Ke(ae),je(ut)}else me(!1)},[d,y,R,f,fe,l.enabled,q]),rt=(0,t.useCallback)(e=>{e.preventDefault(),e.stopPropagation();let o=d();o&&(Ce(!0),Xe({y:e.clientY,scrollTop:o.scrollTop}),y(),T(!0),H())},[d,y,H]),be=(0,t.useCallback)(e=>{if(!N)return;let o=d();if(!o)return;let r=o.clientHeight,n=o.scrollHeight-r,i=e.clientY-se.y,x=r-G,b=i/x*n,m=Math.max(0,Math.min(n,se.scrollTop+b));o.scrollTop=m,u()},[N,se,G,u,d]),ge=(0,t.useCallback)(()=>{Ce(!1),W()&&p(l.delay)},[W,p,l.delay]),nt=(0,t.useCallback)(e=>{if(!U.current)return;let r=U.current.getBoundingClientRect(),c=e.clientY-r.top,n=d();if(!n)return;let i=n.clientHeight,x=n.scrollHeight,m=c/i*(x-i);n.scrollTop=Math.max(0,Math.min(x-i,m)),u(),T(!0),p(l.delay),H()},[u,p,l.delay,d,H]),lt=(0,t.useCallback)(e=>{if(e.preventDefault(),e.stopPropagation(),!a.current)return;let o=Math.max(0,a.current.scrollTop-re);a.current.scrollTop=o,u(),T(!0),p(l.delay),H()},[u,p,re,l.delay,H]),it=(0,t.useCallback)(e=>{if(e.preventDefault(),e.stopPropagation(),!a.current||!z.current)return;let o=a.current,c=z.current.scrollHeight-o.clientHeight,n=Math.min(c,o.scrollTop+re);o.scrollTop=n,u(),T(!0),p(l.delay),H()},[u,p,re,l.delay,H]),at=(0,t.useCallback)(e=>{e.preventDefault(),e.stopPropagation();let o=d();o&&(Ae(!0),Je({x:e.clientX,scrollLeft:o.scrollLeft}),y(),T(!0),H())},[d,y,H]),ve=(0,t.useCallback)(e=>{if(!P)return;let o=d();if(!o)return;let r=o.clientWidth,n=o.scrollWidth-r,i=e.clientX-de.x,x=r-pe,b=i/x*n,m=Math.max(0,Math.min(n,de.scrollLeft+b));o.scrollLeft=m,u()},[P,de,pe,u,d]),ye=(0,t.useCallback)(()=>{Ae(!1),W()&&p(l.delay)},[W,p,l.delay]),ct=(0,t.useCallback)(e=>{if(!U.current)return;let r=U.current.getBoundingClientRect(),c=e.clientX-r.left,n=d();if(!n)return;let i=n.clientWidth,x=n.scrollWidth,m=c/i*(x-i);n.scrollLeft=Math.max(0,Math.min(x-i,m)),u(),T(!0),p(l.delay),H()},[u,p,l.delay,d,H]),st=(0,t.useCallback)(e=>{if(!he.enabled)return;let o=e.target;if(Se(o,he)||e.button!==0)return;let r=d();r&&(r.scrollHeight<=r.clientHeight&&r.scrollWidth<=r.clientWidth||(e.preventDefault(),Oe(!0),Qe({x:e.clientX,y:e.clientY,scrollTop:r.scrollTop,scrollLeft:r.scrollLeft||0}),y()))},[he,Se,d,y]),xe=(0,t.useCallback)(e=>{if(!J)return;let o=d();if(!o)return;let r=K.x-e.clientX,c=K.y-e.clientY;if(Math.abs(c)<3&&Math.abs(r)<3)return;T(!0);let n=Math.max(0,Math.min(o.scrollHeight-o.clientHeight,K.scrollTop+c)),i=Math.max(0,Math.min(o.scrollWidth-o.clientWidth,K.scrollLeft+r));o.scrollTop=n,o.scrollLeft=i,u()},[J,K,d,u]),Te=(0,t.useCallback)(()=>{Oe(!1),W()&&p(l.delay)},[W,p,l.delay]);(0,t.useEffect)(()=>{let e=i=>{if(u(),q){I&&I(i);return}y(),T(!0),Ne();let x=We?l.delayOnWheel:l.delay;p(x),I&&I(i)},o=()=>{$e(!0),Z.current&&clearTimeout(Z.current),Z.current=setTimeout(()=>{$e(!1)},300),Ne(),_.current=setTimeout(()=>{T(!0),_.current=null,p(l.delayOnWheel)},50)},r=[],c=d();c&&r.push(c);let n=a.current;return n&&!c&&(r.push(n),n.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]').forEach(x=>{let b=x;if(b!==n&&b.classList.contains("overlay-scrollbar-container"))return;let m=b.parentElement;for(;m&&m!==n;){if(m.classList.contains("overlay-scrollbar-container")&&m!==n)return;m=m.parentElement}r.push(b)})),r.forEach(i=>{i.addEventListener("scroll",e,{passive:!0}),i.addEventListener("wheel",o,{passive:!0})}),()=>{r.forEach(i=>{i.removeEventListener("scroll",e),i.removeEventListener("wheel",o)}),Z.current&&clearTimeout(Z.current),_.current&&clearTimeout(_.current)}},[d,u,I,y,p,l,We,q]),(0,t.useEffect)(()=>{let e=r=>{let c=d();if(!c)return;let{key:n}=r,{scrollTop:i,scrollHeight:x,clientHeight:b}=c,m=x-b,V=50,D=null;switch(n){case"ArrowUp":r.preventDefault(),D=Math.max(0,i-V);break;case"ArrowDown":r.preventDefault(),D=Math.min(m,i+V);break;case"PageUp":r.preventDefault(),D=Math.max(0,i-b);break;case"PageDown":r.preventDefault(),D=Math.min(m,i+b);break;case"Home":r.preventDefault(),D=0;break;case"End":r.preventDefault(),D=m;break;default:return}if(D!==null){let ne=D/m,le=R?f*2+s.margin*4:s.margin*2,Q=(b-le-G)*ne;ke(Q),c.scrollTop=D,y(),T(!0),p(l.delay)}},o=a.current;if(o)return o.addEventListener("keydown",e),()=>{o.removeEventListener("keydown",e)}},[d,R,f,s.margin,G,y,p,l.delay]),(0,t.useEffect)(()=>{if(J)return document.addEventListener("mousemove",xe),document.addEventListener("mouseup",Te),()=>{document.removeEventListener("mousemove",xe),document.removeEventListener("mouseup",Te)}},[J,xe,Te]),(0,t.useEffect)(()=>{if(N)return document.addEventListener("mousemove",be),document.addEventListener("mouseup",ge),()=>{document.removeEventListener("mousemove",be),document.removeEventListener("mouseup",ge)}},[N,be,ge]),(0,t.useEffect)(()=>{if(P)return document.addEventListener("mousemove",ve),document.addEventListener("mouseup",ye),()=>{document.removeEventListener("mousemove",ve),document.removeEventListener("mouseup",ye)}},[P,ve,ye]),(0,t.useEffect)(()=>{u();let e=setTimeout(()=>{u()},100);return()=>clearTimeout(e)},[u]),(0,t.useLayoutEffect)(()=>{et(!0),u(),!l.enabled&&!q&&W()&&T(!0)},[W,u,l.enabled,q]),(0,t.useEffect)(()=>{if(l.initialDelay>0){let e=setTimeout(()=>{tt(!1)},l.initialDelay);return()=>clearTimeout(e)}},[l.initialDelay]),(0,t.useEffect)(()=>{let e=new ResizeObserver(()=>{u()}),o=[];return a.current&&o.push(a.current),z.current&&o.push(z.current),L.current&&document.contains(L.current)&&o.push(L.current),o.forEach(r=>{e.observe(r)}),()=>e.disconnect()},[u]),(0,t.useEffect)(()=>{if(!a.current)return;let e=new MutationObserver(()=>{L.current=null,u()});return e.observe(a.current,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}),()=>e.disconnect()},[u]);let B=Math.max(ot,f);return(0,t.useEffect)(()=>{let e="overlay-scrollbar-webkit-hide",o=document.getElementById(e);o&&o.remove();let r=document.createElement("style");return r.id=e,r.textContent=`
|
|
2
|
+
.overlay-scrollbar-container::-webkit-scrollbar {
|
|
3
|
+
display: none !important;
|
|
4
|
+
width: 0 !important;
|
|
5
|
+
height: 0 !important;
|
|
6
|
+
}
|
|
7
|
+
.overlay-scrollbar-container::-webkit-scrollbar-track {
|
|
8
|
+
display: none !important;
|
|
9
|
+
}
|
|
10
|
+
.overlay-scrollbar-container::-webkit-scrollbar-thumb {
|
|
11
|
+
display: none !important;
|
|
12
|
+
}
|
|
13
|
+
/* ehfuse-editor-content\uB294 \uC2A4\uD06C\uB864\uBC14 \uC720\uC9C0 */
|
|
14
|
+
.overlay-scrollbar-container .ehfuse-editor-content {
|
|
15
|
+
scrollbar-width: thin !important;
|
|
16
|
+
-ms-overflow-style: auto !important;
|
|
17
|
+
}
|
|
18
|
+
.overlay-scrollbar-container .ehfuse-editor-content::-webkit-scrollbar {
|
|
19
|
+
display: block !important;
|
|
20
|
+
width: 8px !important;
|
|
21
|
+
height: 8px !important;
|
|
22
|
+
}
|
|
23
|
+
.overlay-scrollbar-container .ehfuse-editor-content::-webkit-scrollbar-track {
|
|
24
|
+
display: block !important;
|
|
25
|
+
background: #f1f1f1 !important;
|
|
26
|
+
}
|
|
27
|
+
.overlay-scrollbar-container .ehfuse-editor-content::-webkit-scrollbar-thumb {
|
|
28
|
+
display: block !important;
|
|
29
|
+
background: #c1c1c1 !important;
|
|
30
|
+
border-radius: 4px !important;
|
|
31
|
+
}
|
|
32
|
+
.overlay-scrollbar-container .ehfuse-editor-content::-webkit-scrollbar-thumb:hover {
|
|
33
|
+
background: #a1a1a1 !important;
|
|
34
|
+
}
|
|
35
|
+
.overlay-scrollbar-container:focus {
|
|
36
|
+
outline: 2px solid rgba(0, 123, 255, 0.3);
|
|
37
|
+
outline-offset: -2px;
|
|
38
|
+
}
|
|
39
|
+
.overlay-scrollbar-container:focus-visible {
|
|
40
|
+
outline: 2px solid rgba(0, 123, 255, 0.5);
|
|
41
|
+
outline-offset: -2px;
|
|
42
|
+
}
|
|
43
|
+
`,document.head.appendChild(r),()=>{let c=document.getElementById(e);c&&c.remove()}},[]),(0,M.jsxs)("div",{ref:ce,className:`overlay-scrollbar-wrapper ${g}`,style:{display:"flex",flexDirection:"column",position:"relative",minHeight:0,height:"100%",flex:"1 1 0%",...v},children:[(0,M.jsx)("div",{ref:a,className:"overlay-scrollbar-container",tabIndex:-1,onMouseDown:st,style:{display:"flex",width:"100%",flex:"1 1 auto",minHeight:0,overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none",outline:"none",userSelect:J?"none":"auto",...S},children:(0,M.jsx)("div",{ref:z,className:"overlay-scrollbar-content",style:{flex:"1 1 0%",minHeight:0,display:"flex",flexDirection:"column",...E},children:w})}),Y&&ue&&(0,M.jsxs)("div",{ref:U,className:"overlay-scrollbar-track",onMouseEnter:()=>{y(),F.current=setTimeout(()=>{T(!0),F.current=null},100)},onMouseLeave:()=>{ze(),N||p(l.delay)},style:{position:"absolute",top:0,right:0,width:`${B}px`,height:"100%",opacity:ee?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[s.visible&&(0,M.jsx)("div",{className:"overlay-scrollbar-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),nt(e)},style:{position:"absolute",top:R?`${h.width+s.margin*2}px`:`${s.margin}px`,right:s.alignment==="outside"?"0px":`${(B-h.width)/2}px`,width:`${h.width}px`,height:R?`calc(100% - ${h.width*2+s.margin*4}px)`:`calc(100% - ${s.margin*2}px)`,backgroundColor:s.color,borderRadius:`${s.radius}px`,cursor:"pointer"}}),(0,M.jsx)("div",{ref:Be,className:"overlay-scrollbar-thumb",onMouseDown:rt,onMouseEnter:()=>De(!0),onMouseLeave:()=>De(!1),style:{position:"absolute",top:`${(R?f+s.margin*2:s.margin)+Ge}px`,right:s.alignment==="outside"?"0px":`${(B-f)/2}px`,width:`${f}px`,height:`${Math.max(G,fe)}px`,backgroundColor:He||N?h.hoverColor:h.color,opacity:He||N?h.hoverOpacity:h.opacity,borderRadius:`${h.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]}),Y&&ue&&R&&(0,M.jsx)("div",{className:"overlay-scrollbar-up-arrow",onClick:lt,onMouseEnter:()=>oe("up"),onMouseLeave:()=>oe(null),style:{position:"absolute",top:`${s.margin}px`,right:s.alignment==="outside"?"0px":`${(B-f)/2}px`,width:`${f}px`,height:`${f}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(f*.75,8)}px`,color:te==="up"?k.hoverColor:k.color,userSelect:"none",zIndex:1001,opacity:ee?te==="up"?k.hoverOpacity:k.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25B2"}),Y&&ue&&R&&(0,M.jsx)("div",{className:"overlay-scrollbar-down-arrow",onClick:it,onMouseEnter:()=>oe("down"),onMouseLeave:()=>oe(null),style:{position:"absolute",bottom:`${s.margin}px`,right:s.alignment==="outside"?"0px":`${(B-f)/2}px`,width:`${f}px`,height:`${f}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(f*.75,8)}px`,color:te==="down"?k.hoverColor:k.color,userSelect:"none",zIndex:1001,opacity:ee?te==="down"?k.hoverOpacity:k.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25BC"}),Y&&Ve&&(0,M.jsxs)("div",{className:"overlay-scrollbar-horizontal-track",onMouseEnter:()=>{y(),F.current=setTimeout(()=>{T(!0),F.current=null},100)},onMouseLeave:()=>{ze(),P||p(l.delay)},style:{position:"absolute",bottom:0,left:0,width:"100%",height:`${B}px`,opacity:ee?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[s.visible&&(0,M.jsx)("div",{className:"overlay-scrollbar-horizontal-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),ct(e)},style:{position:"absolute",bottom:`${s.margin}px`,left:`${s.margin}px`,width:`calc(100% - ${s.margin*2}px)`,height:`${f}px`,backgroundColor:s.color,borderRadius:`${s.radius}px`,cursor:"pointer"}}),(0,M.jsx)("div",{className:"overlay-scrollbar-horizontal-thumb",onMouseDown:at,onMouseEnter:()=>Ie(!0),onMouseLeave:()=>Ie(!1),style:{position:"absolute",bottom:`${s.margin}px`,left:`${s.margin+Ze}px`,width:`${Math.max(pe,50)}px`,height:`${f}px`,backgroundColor:Re||P?h.hoverColor:h.color,opacity:Re||P?h.hoverOpacity:h.opacity,borderRadius:`${h.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]})]})}),Ee=St;
|
|
22
44
|
//# sourceMappingURL=index.js.map
|