diff --git a/packages/overlayscrollbars/dist/overlayscrollbars.css b/packages/overlayscrollbars/dist/overlayscrollbars.css
index 9efc80f..6002eeb 100644
--- a/packages/overlayscrollbars/dist/overlayscrollbars.css
+++ b/packages/overlayscrollbars/dist/overlayscrollbars.css
@@ -118,22 +118,15 @@
min-height: 1px;
min-width: 1px; }
-.os-host-transition > .os-scrollbar,
-.os-host-transition > .os-scrollbar-corner {
+.os-scrollbar-transition {
transition: opacity 0.3s, visibility 0.3s, top 0.3s, right 0.3s, bottom 0.3s, left 0.3s; }
-.os-scrollbar,
-.os-scrollbar-corner {
- position: absolute;
- opacity: 1;
- z-index: 1; }
-
-.os-scrollbar-corner {
- bottom: 0;
- right: 0; }
-
.os-scrollbar {
- pointer-events: none; }
+ pointer-events: none;
+ position: absolute;
+ z-index: 0;
+ opacity: 0;
+ visibility: hidden; }
.os-scrollbar-track {
pointer-events: auto;
@@ -153,12 +146,13 @@
.os-scrollbar-track-off {
pointer-events: none; }
-.os-scrollbar.os-scrollbar-unusable,
-.os-scrollbar.os-scrollbar-unusable * {
+.os-scrollbar-unusable,
+.os-scrollbar-unusable * {
pointer-events: none !important; }
-.os-scrollbar.os-scrollbar-unusable .os-scrollbar-handle {
- opacity: 0 !important; }
+.os-scrollbar-unusable .os-scrollbar-handle {
+ opacity: 0 !important;
+ visibility: hidden Im !important; }
.os-scrollbar-horizontal {
bottom: 0;
@@ -168,70 +162,135 @@
top: 0;
right: 0; }
-.os-host-rtl > .os-scrollbar-horizontal {
+.os-scrollbar-horizontal-rtl {
right: 0; }
-.os-host-rtl > .os-scrollbar-vertical {
+.os-scrollbar-vertical-rtl {
right: auto;
left: 0; }
-.os-host-rtl > .os-scrollbar-corner {
- right: auto;
- left: 0; }
+.os-scrollbar-visible {
+ opacity: 1;
+ visibility: visible; }
-.os-scrollbar-auto-hidden,
-.os-padding + .os-scrollbar-corner,
-.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-corner,
-.os-host-scrollbar-horizontal-hidden > .os-scrollbar-horizontal,
-.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-corner,
-.os-host-scrollbar-vertical-hidden > .os-scrollbar-vertical,
-.os-scrollbar-horizontal.os-scrollbar-auto-hidden + .os-scrollbar-vertical + .os-scrollbar-corner,
-.os-scrollbar-horizontal + .os-scrollbar-vertical.os-scrollbar-auto-hidden + .os-scrollbar-corner,
-.os-scrollbar-horizontal.os-scrollbar-auto-hidden + .os-scrollbar-vertical.os-scrollbar-auto-hidden + .os-scrollbar-corner {
+.os-scrollbar-auto-hidden {
opacity: 0;
- visibility: hidden;
- pointer-events: none; }
+ visibility: hidden; }
-.os-scrollbar-corner-resize-both {
- cursor: nwse-resize; }
+.os-scrollbar-interaction.os-scrollbar-visible {
+ opacity: 1;
+ visibility: visible; }
-.os-host-rtl > .os-scrollbar-corner-resize-both {
- cursor: nesw-resize; }
+.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless {
+ left: 0;
+ right: 0; }
-.os-scrollbar-corner-resize-horizontal {
- cursor: ew-resize; }
-
-.os-scrollbar-corner-resize-vertical {
- cursor: ns-resize; }
-
-.os-dragging .os-scrollbar-corner.os-scrollbar-corner-resize {
- cursor: default; }
-
-.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-vertical {
+.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless {
top: 0;
bottom: 0; }
-.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-horizontal,
-.os-host-rtl.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-horizontal {
+/*
+THEMES:
+*/
+/* NONE THEME: */
+.os-theme-none.os-scrollbar {
+ display: none !important; }
+
+/* DARK & LIGHT THEME: */
+.os-theme-dark.os-scrollbar-horizontal,
+.os-theme-light.os-scrollbar-horizontal {
+ right: 10px;
+ height: 10px; }
+
+.os-theme-dark.os-scrollbar-vertical,
+.os-theme-light.os-scrollbar-vertical {
+ bottom: 10px;
+ width: 10px; }
+
+.os-theme-dark.os-scrollbar-horizontal-rtl,
+.os-theme-light.os-scrollbar-horizontal-rtl {
+ left: 10px;
+ right: 0; }
+
+.os-theme-dark.os-scrollbar,
+.os-theme-light.os-scrollbar {
+ padding: 2px;
+ box-sizing: border-box;
+ background: transparent; }
+
+.os-theme-dark.os-scrollbar-unusable,
+.os-theme-light.os-scrollbar-unusable {
+ background: transparent; }
+
+.os-theme-dark.os-scrollbar > .os-scrollbar-track,
+.os-theme-light.os-scrollbar > .os-scrollbar-track {
+ background: transparent; }
+
+.os-theme-dark.os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle,
+.os-theme-light.os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle {
+ min-width: 30px; }
+
+.os-theme-dark.os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle,
+.os-theme-light.os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle {
+ min-height: 30px; }
+
+.os-theme-dark.os-scrollbar-transition > .os-scrollbar-track > .os-scrollbar-handle,
+.os-theme-light.os-scrollbar-transition > .os-scrollbar-track > .os-scrollbar-handle {
+ transition: background-color 0.3s; }
+
+.os-theme-dark.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
+.os-theme-light.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
+.os-theme-dark.os-scrollbar > .os-scrollbar-track,
+.os-theme-light.os-scrollbar > .os-scrollbar-track {
+ border-radius: 10px; }
+
+.os-theme-dark.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
+ background: rgba(0, 0, 0, 0.4); }
+
+.os-theme-light.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
+ background: rgba(255, 255, 255, 0.4); }
+
+.os-theme-dark.os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
+ background: rgba(0, 0, 0, 0.55); }
+
+.os-theme-light.os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
+ background: rgba(255, 255, 255, 0.55); }
+
+.os-theme-dark.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active {
+ background: rgba(0, 0, 0, 0.7); }
+
+.os-theme-light.os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active {
+ background: rgba(255, 255, 255, 0.7); }
+
+.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,
+.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,
+.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before,
+.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before {
+ content: '';
+ position: absolute;
+ left: 0;
right: 0;
- left: 0; }
+ top: 0;
+ bottom: 0;
+ display: block; }
-.os-scrollbar:hover,
-.os-scrollbar-corner.os-scrollbar-corner-resize {
- opacity: 1 !important;
- visibility: visible !important; }
+.os-theme-dark.os-host-scrollbar-hidden > .os-scrollbar-handle:before {
+ display: none; }
-.os-scrollbar-corner.os-scrollbar-corner-resize {
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICB3aWR0aD0iMTAiICAgaGVpZ2h0PSIxMCIgICB2ZXJzaW9uPSIxLjEiPiAgPGcgICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwNDIuMzYyMikiICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO2ZpbGwtb3BhY2l0eTowLjQ5NDExNzY1O2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDcuNDI0MjE4NywxMDQyLjM2MjIgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjYgLTEuMzEwMTU2MiwxLjMxMDIgMCwwLjI5OSAwLjEwNDM0MTksMC41NzEgMC4yNzI5NDkyLDAuNzkxNSAwLjIwOTEwMjQsMC4xNDEzIDAuNDY1NjIwNiwwLjIxODQgMC43MzY5NjI5LDAuMjE4NCAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NiAxLjMxMDE1NjMsLTEuMzEwMiAwLC0wLjI3MTMgLTAuMDc3MDkzLC0wLjUyNzggLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0MSwtMC4xNjg2IC0wLjQ5MjU0NDMsLTAuMjcyOSAtMC43OTE1NTI4LC0wLjI3MjkgeiBtIDAsMy4wODQzIGMgLTAuNzIzNTc5MiwwIC0xLjMxMDE1NjIsMC41ODY2IC0xLjMxMDE1NjIsMS4zMTAyIDAsMC4yOTkgMC4xMDQzNDE5LDAuNTcxIDAuMjcyOTQ5MiwwLjc5MTUgMC4yMDkxMDI0LDAuMTQxMyAwLjQ2NTYyMDYsMC4yMTg0IDAuNzM2OTYyOSwwLjIxODQgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjYgMS4zMTAxNTYzLC0xLjMxMDIgMCwtMC4yNzEzIC0wLjA3NzA5MywtMC41Mjc4IC0wLjIxODM1OTQsLTAuNzM2OSAtMC4yMjA0OTQxLC0wLjE2ODYgLTAuNDkyNTQ0MywtMC4yNzMgLTAuNzkxNTUyOCwtMC4yNzMgeiBtIC0zLjA4NDMyNjEsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NiAtMS4zMTAxNTYzLDEuMzEwMiAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MSAwLjI3Mjk0OTIsMC43OTE1IDAuMjA5MTAyNCwwLjE0MTMgMC40NjU2MjA3LDAuMjE4NCAwLjczNjk2MjksMC4yMTg0IDAuNzIzNTc5MywwIDEuMzEwMTU2MywtMC41ODY2IDEuMzEwMTU2MywtMS4zMTAyIDAsLTAuMjcxMyAtMC4wNzcwOTMsLTAuNTI3OCAtMC4yMTgzNTk0LC0wLjczNjkgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzMgLTAuNzkxNTUyNywtMC4yNzMgeiBtIC0zLjAyOTczNjQsMy4wMjk4IEMgMC41ODY1NzY5MywxMDQ4LjQ3NjMgMCwxMDQ5LjA2MjggMCwxMDQ5Ljc4NjQgYyAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyMiwwLjc5MTYgMC4yMDkxMDIyOSwwLjE0MTIgMC40NjU2MjA2NSwwLjIxODMgMC43MzY5NjI4OCwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHogbSAzLjAyOTczNjQsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NSAtMS4zMTAxNTYzLDEuMzEwMSAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyLDAuNzkxNiAwLjIwOTEwMjQsMC4xNDEyIDAuNDY1NjIwNywwLjIxODMgMC43MzY5NjI5LDAuMjE4MyAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NSAxLjMxMDE1NjMsLTEuMzEwMSAwLC0wLjI3MTQgLTAuMDc3MDkzLC0wLjUyNzkgLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzI5IC0wLjc5MTU1MjcsLTAuMjcyOSB6IG0gMy4wODQzMjYxLDAgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjUgLTEuMzEwMTU2MiwxLjMxMDEgMCwwLjI5OSAwLjEwNDM0MTksMC41NzExIDAuMjcyOTQ5MiwwLjc5MTYgMC4yMDkxMDI0LDAuMTQxMiAwLjQ2NTYyMDYsMC4yMTgzIDAuNzM2OTYyOSwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHoiLz4gIDwvZz4gIDxnICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDguMjE1NzcxNSwwLjI3Mjk0OTIyIGMgMC4xNDEyNjY3LDAuMjA5MTAyMjkgMC4yMTgzNTk0LDAuNDY1NjIwNjUgMC4yMTgzNTk0LDAuNzM2OTYyODggMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDc2IC0wLjIwNTUxNzYsLTAuNzk3Nzk2NTkgLTAuNTE4NjAzNSwtMS4wMzcyMDY5OCB6IG0gMCwzLjA4NDMyNjE4IGMgMC4xNDEyNjY3LDAuMjA5MTAyMyAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MiAtMS4zMTAxNTYzLDEuMzEwMTU2MiAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTkzIDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAtMy4wODQzMjYyLDAgYyAwLjE0MTI2NjcsMC4yMDkxMDIzIDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYyIC0xLjMxMDE1NjMsMS4zMTAxNTYyIC0wLjI3MTM0MjIsMCAtMC41Mjc4NjA1LC0wLjA3NzA5MyAtMC43MzY5NjI5LC0wLjIxODM1OTMgMC4yMzk0MTA0LDAuMzEzMDg1OSAwLjYxMjYzNjMsMC41MTg2MDM1IDEuMDM3MjA3MSwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYyLC0wLjU4NjU3NyAxLjMxMDE1NjIsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NSwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogTSAyLjEwMTcwOSw2LjM4NzAxMTcgYyAwLjE0MTI2NjcsMC4yMDkxMDI0IDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYzIC0xLjMxMDE1NjMsMS4zMTAxNTYzIC0wLjI3MTM0MjIzLDAgLTAuNTI3ODYwNTksLTAuMDc3MDkzIC0wLjczNjk2Mjg4LC0wLjIxODM1OTQgMC4yMzk0MTAzOSwwLjMxMzA4NTkgMC42MTI2MzYyMiwwLjUxODYwMzUgMS4wMzcyMDY5OCwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAzLjAyOTczNjMsMCBjIDAuMTQxMjY2NywwLjIwOTEwMjQgMC4yMTgzNTk0LDAuNDY1NjIwNiAwLjIxODM1OTQsMC43MzY5NjI5IDAsMC43MjM1NzkzIC0wLjU4NjU3NywxLjMxMDE1NjMgLTEuMzEwMTU2MywxLjMxMDE1NjMgLTAuMjcxMzQyMiwwIC0wLjUyNzg2MDUsLTAuMDc3MDkzIC0wLjczNjk2MjksLTAuMjE4MzU5NCAwLjIzOTQxMDQsMC4zMTMwODU5IDAuNjEyNjM2MywwLjUxODYwMzUgMS4wMzcyMDcxLDAuNTE4NjAzNSAwLjcyMzU3OTMsMCAxLjMxMDE1NjIsLTAuNTg2NTc3IDEuMzEwMTU2MiwtMS4zMTAxNTYzIDAsLTAuNDI0NTcwOCAtMC4yMDU1MTc1LC0wLjc5Nzc5NjYgLTAuNTE4NjAzNSwtMS4wMzcyMDcgeiBtIDMuMDg0MzI2MiwwIGMgMC4xNDEyNjY3LDAuMjA5MTAyNCAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHoiIC8+ICA8L2c+PC9zdmc+);
- background-repeat: no-repeat;
- background-position: 100% 100%;
- pointer-events: auto !important; }
+.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,
+.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before {
+ top: -6px;
+ bottom: -2px; }
-.os-host-rtl > .os-scrollbar-corner.os-scrollbar-corner-resize {
- transform: scale(-1, 1); }
+.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,
+.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before {
+ left: -6px;
+ right: -2px; }
-.os-host-overflow {
- overflow: hidden !important; }
+.os-theme-dark.os-scrollbar-vertical-rtl .os-scrollbar-handle:before,
+.os-theme-light.os-scrollbar-vertical-rtl .os-scrollbar-handle:before {
+ right: -6px;
+ left: -2px; }
.os-environment {
--os-custom-prop: -1;
diff --git a/packages/overlayscrollbars/dist/overlayscrollbars.esm.js b/packages/overlayscrollbars/dist/overlayscrollbars.esm.js
index efd48da..ffa3c9e 100644
--- a/packages/overlayscrollbars/dist/overlayscrollbars.esm.js
+++ b/packages/overlayscrollbars/dist/overlayscrollbars.esm.js
@@ -35,19 +35,19 @@ function getDefaultExportFromCjs(t) {
const createCache = (t, n) => {
const {u: o, _: s, g: e} = t;
let c = o;
- let i;
+ let r;
const cacheUpdateContextual = (t, n) => {
const o = c;
- const r = t;
- const l = n || (s ? !s(o, r) : o !== r);
+ const i = t;
+ const l = n || (s ? !s(o, i) : o !== i);
if (l || e) {
- c = r;
- i = o;
+ c = i;
+ r = o;
}
- return [ c, l, i ];
+ return [ c, l, r ];
};
- const cacheUpdateIsolated = t => cacheUpdateContextual(n(c, i), t);
- const getCurrentCache = t => [ c, !!t, i ];
+ const cacheUpdateIsolated = t => cacheUpdateContextual(n(c, r), t);
+ const getCurrentCache = t => [ c, !!t, r ];
return [ n ? cacheUpdateIsolated : cacheUpdateContextual, getCurrentCache ];
};
@@ -87,9 +87,9 @@ const isPlainObject = t => {
const s = "constructor";
const e = t[s];
const c = e && e.prototype;
- const i = o.call(t, s);
- const r = c && o.call(c, "isPrototypeOf");
- if (e && !i && !r) {
+ const r = o.call(t, s);
+ const i = c && o.call(c, "isPrototypeOf");
+ if (e && !r && !i) {
return false;
}
for (n in t) {}
@@ -97,12 +97,12 @@ const isPlainObject = t => {
};
const isHTMLElement = n => {
- const o = window.HTMLElement;
+ const o = HTMLElement;
return n ? o ? n instanceof o : n.nodeType === t : false;
};
const isElement = n => {
- const o = window.Element;
+ const o = Element;
return n ? o ? n instanceof o : n.nodeType === t : false;
};
@@ -143,12 +143,12 @@ const hasOwnProperty = (t, n) => Object.prototype.hasOwnProperty.call(t, n);
const keys = t => t ? Object.keys(t) : [];
-const assignDeep = (t, n, o, s, e, c, i) => {
- const r = [ n, o, s, e, c, i ];
+const assignDeep = (t, n, o, s, e, c, r) => {
+ const i = [ n, o, s, e, c, r ];
if (("object" !== typeof t || isNull(t)) && !isFunction(t)) {
t = {};
}
- each(r, (n => {
+ each(i, (n => {
each(keys(n), (o => {
const s = n[o];
if (t === s) {
@@ -338,35 +338,35 @@ const e = [ "-webkit-", "-moz-", "-o-", "-ms-" ];
const c = [ "WebKit", "Moz", "O", "MS", "webkit", "moz", "o", "ms" ];
-const i = {};
-
const r = {};
+const i = {};
+
const cssProperty = t => {
- let n = r[t];
- if (hasOwnProperty(r, t)) {
+ let n = i[t];
+ if (hasOwnProperty(i, t)) {
return n;
}
const o = firstLetterToUpper(t);
const s = getDummyStyle();
each(e, (e => {
const c = e.replace(/-/g, "");
- const i = [ t, e + t, c + o, firstLetterToUpper(c) + o ];
- return !(n = i.find((t => void 0 !== s[t])));
+ const r = [ t, e + t, c + o, firstLetterToUpper(c) + o ];
+ return !(n = r.find((t => void 0 !== s[t])));
}));
- return r[t] = n || "";
+ return i[t] = n || "";
};
const jsAPI = t => {
- let n = i[t] || window[t];
- if (hasOwnProperty(i, t)) {
+ let n = r[t] || window[t];
+ if (hasOwnProperty(r, t)) {
return n;
}
each(c, (o => {
n = n || window[o + firstLetterToUpper(t)];
return !n;
}));
- i[t] = n;
+ r[t] = n;
return n;
};
@@ -374,11 +374,11 @@ const l = jsAPI("MutationObserver");
const a = jsAPI("IntersectionObserver");
-const f = jsAPI("ResizeObserver");
+const u = jsAPI("ResizeObserver");
-const u = jsAPI("cancelAnimationFrame");
+const d = jsAPI("cancelAnimationFrame");
-const d = jsAPI("requestAnimationFrame");
+const f = jsAPI("requestAnimationFrame");
const _ = /[^\x20\t\r\n\f]+/g;
@@ -387,9 +387,9 @@ const classListAction = (t, n, o) => {
let e = 0;
let c = false;
if (t && n && isString(n)) {
- const i = n.match(_) || [];
- c = i.length > 0;
- while (s = i[e++]) {
+ const r = n.match(_) || [];
+ c = r.length > 0;
+ while (s = r[e++]) {
c = !!o(t.classList, s) && c;
}
}
@@ -412,8 +412,8 @@ const equal = (t, n, o, s) => {
let e = true;
each(o, (o => {
const c = s ? s(t[o]) : t[o];
- const i = s ? s(n[o]) : n[o];
- if (c !== i) {
+ const r = s ? s(n[o]) : n[o];
+ if (c !== r) {
e = false;
}
}));
@@ -431,8 +431,8 @@ const equalTRBL = (t, n) => equal(t, n, [ "t", "r", "b", "l" ]);
const equalBCRWH = (t, n, o) => equal(t, n, [ "width", "height" ], o && (t => Math.round(t)));
const clearTimeouts = t => {
- t && window.clearTimeout(t);
- t && u(t);
+ t && clearTimeout(t);
+ t && d(t);
};
const noop = () => {};
@@ -442,9 +442,9 @@ const debounce = (t, n) => {
let s;
let e;
let c;
- const {v: i, p: r, m: l} = n || {};
- const a = window.setTimeout;
- const f = function invokeFunctionToDebounce(n) {
+ const {v: r, p: i, m: l} = n || {};
+ const a = setTimeout;
+ const u = function invokeFunctionToDebounce(n) {
clearTimeouts(o);
clearTimeouts(s);
s = o = e = void 0;
@@ -453,32 +453,32 @@ const debounce = (t, n) => {
const mergeParms = t => l && e ? l(e, t) : t;
const flush = () => {
if (o) {
- f(mergeParms(c) || c);
+ u(mergeParms(c) || c);
}
};
- const u = function debouncedFn() {
+ const d = function debouncedFn() {
const t = from(arguments);
- const n = isFunction(i) ? i() : i;
+ const n = isFunction(r) ? r() : r;
const l = isNumber(n) && n >= 0;
if (l) {
- const i = isFunction(r) ? r() : r;
- const l = isNumber(i) && i >= 0;
- const u = n > 0 ? a : d;
+ const r = isFunction(i) ? i() : i;
+ const l = isNumber(r) && r >= 0;
+ const d = n > 0 ? a : f;
const _ = mergeParms(t);
const g = _ || t;
- const h = f.bind(0, g);
+ const h = u.bind(0, g);
clearTimeouts(o);
- o = u(h, n);
+ o = d(h, n);
if (l && !s) {
- s = a(flush, i);
+ s = a(flush, r);
}
e = c = g;
} else {
- f(t);
+ u(t);
}
};
- u.S = flush;
- return u;
+ d.S = flush;
+ return d;
};
const g = {
@@ -512,14 +512,14 @@ const topRightBottomLeft = (t, n, o) => {
const s = n ? `${n}-` : "";
const e = o ? `-${o}` : "";
const c = `${s}top${e}`;
- const i = `${s}right${e}`;
- const r = `${s}bottom${e}`;
+ const r = `${s}right${e}`;
+ const i = `${s}bottom${e}`;
const l = `${s}left${e}`;
- const a = style(t, [ c, i, r, l ]);
+ const a = style(t, [ c, r, i, l ]);
return {
t: parseToZeroOrNumber(a[c]),
- r: parseToZeroOrNumber(a[i]),
- b: parseToZeroOrNumber(a[r]),
+ r: parseToZeroOrNumber(a[r]),
+ b: parseToZeroOrNumber(a[i]),
l: parseToZeroOrNumber(a[l])
};
};
@@ -585,24 +585,25 @@ const off = (t, n, o, s) => {
};
const on = (t, n, o, s) => {
- const e = supportPassiveEvents();
- const c = e && s && s.C || false;
+ var e;
+ const c = supportPassiveEvents();
+ const r = null != (e = c && s && s.C) ? e : c;
const i = s && s.$ || false;
- const r = s && s.O || false;
- const l = [];
- const a = e ? {
- passive: c,
+ const l = s && s.O || false;
+ const a = [];
+ const u = c ? {
+ passive: r,
capture: i
} : i;
each(splitEventNames(n), (n => {
- const s = r ? e => {
+ const s = l ? e => {
t.removeEventListener(n, s, i);
o && o(e);
} : o;
- push(l, off.bind(null, t, n, s, i));
- t.addEventListener(n, s, a);
+ push(a, off.bind(null, t, n, s, i));
+ t.addEventListener(n, s, u);
}));
- return runEachAndClear.bind(0, l);
+ return runEachAndClear.bind(0, a);
};
const stopPropagation = t => t.stopPropagation();
@@ -701,21 +702,21 @@ const O = "os-padding";
const z = "os-viewport";
-const A = `${z}-arrange`;
+const T = `${z}-arrange`;
-const I = "os-content";
+const A = "os-content";
-const T = `${z}-scrollbar-styled`;
+const I = `${z}-scrollbar-styled`;
-const P = `os-overflow-visible`;
+const E = `os-overflow-visible`;
-const L = "os-size-observer";
+const P = "os-size-observer";
-const M = `${L}-appear`;
+const L = `${P}-appear`;
-const H = `${L}-listener`;
+const H = `${P}-listener`;
-const E = `${H}-scroll`;
+const M = `${H}-scroll`;
const R = `${H}-item`;
@@ -725,14 +726,22 @@ const j = "os-trinsic-observer";
const V = "os-scrollbar";
-const B = `${V}-horizontal`;
+const k = `${V}-horizontal`;
-const k = `${V}-vertical`;
+const B = `${V}-vertical`;
const F = "os-scrollbar-track";
const Y = "os-scrollbar-handle";
+const q = `${V}-visible`;
+
+const G = `${V}-cornerless`;
+
+const N = `${V}-interaction`;
+
+const U = `${V}-auto-hidden`;
+
const opsStringify = t => JSON.stringify(t, ((t, n) => {
if (isFunction(n)) {
throw new Error;
@@ -740,7 +749,7 @@ const opsStringify = t => JSON.stringify(t, ((t, n) => {
return n;
}));
-const q = {
+const W = {
paddingAbsolute: false,
updating: {
elementEvents: [ [ "img", "load" ] ],
@@ -781,7 +790,7 @@ const getOptionsDiff = (t, n) => {
if (opsStringify(e) === opsStringify(c)) {
t = false;
}
- } catch (i) {}
+ } catch (r) {}
}
if (t) {
o[s] = c;
@@ -791,13 +800,13 @@ const getOptionsDiff = (t, n) => {
return o;
};
-let G;
+let X;
-const {abs: N, round: U} = Math;
+const {abs: J, round: K} = Math;
const diffBiggerThanOne = (t, n) => {
- const o = N(t);
- const s = N(n);
+ const o = J(t);
+ const s = J(n);
return !(o === s || o + 1 === s || o - 1 === s);
};
@@ -814,7 +823,7 @@ const getNativeScrollbarSize = (t, n, o) => {
const getNativeScrollbarsHiding = t => {
let n = false;
- const o = addClass(t, T);
+ const o = addClass(t, I);
try {
n = "none" === style(t, cssProperty("scrollbar-width")) || "none" === window.getComputedStyle(t, "::-webkit-scrollbar").getPropertyValue("display");
} catch (s) {}
@@ -845,12 +854,12 @@ const getFlexboxGlue = (t, n) => {
const s = getBoundingClientRect(t);
const e = getBoundingClientRect(n);
const c = equalBCRWH(e, s, true);
- const i = addClass(t, y);
- const r = getBoundingClientRect(t);
+ const r = addClass(t, y);
+ const i = getBoundingClientRect(t);
const l = getBoundingClientRect(n);
- const a = equalBCRWH(l, r, true);
+ const a = equalBCRWH(l, i, true);
o();
- i();
+ r();
return c && a;
};
@@ -866,100 +875,100 @@ const createEnvironment = () => {
const o = n[0];
const s = o.firstChild;
const [e, , c] = createEventListenerHub();
- const [i, r] = createCache({
+ const [r, i] = createCache({
u: getNativeScrollbarSize(t, o, s),
_: equalXY
});
- const [l] = r();
+ const [l] = i();
const a = getNativeScrollbarsHiding(o);
- const f = {
+ const u = {
x: 0 === l.x,
y: 0 === l.y
};
- const u = {
- A: !a,
- I: false
+ const d = {
+ T: !a,
+ A: false
};
- const d = assignDeep({}, q);
+ const f = assignDeep({}, W);
const _ = {
- T: l,
- P: f,
+ I: l,
+ P: u,
L: a,
- M: "-1" === style(o, "zIndex"),
- H: getRtlScrollBehavior(o, s),
+ H: "-1" === style(o, "zIndex"),
+ M: getRtlScrollBehavior(o, s),
R: getFlexboxGlue(o, s),
D: t => e("_", t),
- j: assignDeep.bind(0, {}, u),
+ j: assignDeep.bind(0, {}, d),
V(t) {
- assignDeep(u, t);
- },
- B: assignDeep.bind(0, {}, d),
- k(t) {
assignDeep(d, t);
},
- F: assignDeep({}, u),
- Y: assignDeep({}, d)
+ k: assignDeep.bind(0, {}, f),
+ B(t) {
+ assignDeep(f, t);
+ },
+ F: assignDeep({}, d),
+ Y: assignDeep({}, f)
};
removeAttr(o, "style");
removeElements(o);
- if (!a && (!f.x || !f.y)) {
+ if (!a && (!u.x || !u.y)) {
let n = windowSize();
let e = getWindowDPR();
window.addEventListener("resize", (() => {
- const r = windowSize();
+ const i = windowSize();
const l = {
- w: r.w - n.w,
- h: r.h - n.h
+ w: i.w - n.w,
+ h: i.h - n.h
};
if (0 === l.w && 0 === l.h) {
return;
}
const a = {
- w: N(l.w),
- h: N(l.h)
+ w: J(l.w),
+ h: J(l.h)
};
- const f = {
- w: N(U(r.w / (n.w / 100))),
- h: N(U(r.h / (n.h / 100)))
+ const u = {
+ w: J(K(i.w / (n.w / 100))),
+ h: J(K(i.h / (n.h / 100)))
};
- const u = getWindowDPR();
- const d = a.w > 2 && a.h > 2;
- const _ = !diffBiggerThanOne(f.w, f.h);
- const g = u !== e && e > 0;
- const h = d && _ && g;
+ const d = getWindowDPR();
+ const f = a.w > 2 && a.h > 2;
+ const _ = !diffBiggerThanOne(u.w, u.h);
+ const g = d !== e && e > 0;
+ const h = f && _ && g;
if (h) {
- const [n, e] = i(getNativeScrollbarSize(t, o, s));
- assignDeep(G.T, n);
+ const [n, e] = r(getNativeScrollbarSize(t, o, s));
+ assignDeep(X.I, n);
removeElements(o);
if (e) {
c("_");
}
}
- n = r;
- e = u;
+ n = i;
+ e = d;
}));
}
return _;
};
const getEnvironment = () => {
- if (!G) {
- G = createEnvironment();
+ if (!X) {
+ X = createEnvironment();
}
- return G;
+ return X;
};
-const W = {};
+const Q = {};
-const getPlugins = () => assignDeep({}, W);
+const getPlugins = () => assignDeep({}, Q);
const addPlugin = t => each(isArray(t) ? t : [ t ], (t => {
each(keys(t), (n => {
- W[n] = t[n];
+ Q[n] = t[n];
}));
}));
-var X = {
+var Z = {
exports: {}
};
@@ -979,11 +988,11 @@ var X = {
return _extends.apply(this, arguments);
}
t.exports = _extends, t.exports.o = true, t.exports["default"] = t.exports;
-})(X);
+})(Z);
-const J = getDefaultExportFromCjs(X.exports);
+const tt = getDefaultExportFromCjs(Z.exports);
-const K = {
+const nt = {
boolean: "__TPL_boolean_TYPE__",
number: "__TPL_number_TYPE__",
string: "__TPL_string_TYPE__",
@@ -995,52 +1004,52 @@ const K = {
const validateRecursive = (t, n, o, s) => {
const e = {};
- const c = J({}, n);
- const i = keys(t).filter((t => hasOwnProperty(n, t)));
- each(i, (i => {
- const r = n[i];
- const l = t[i];
+ const c = tt({}, n);
+ const r = keys(t).filter((t => hasOwnProperty(n, t)));
+ each(r, (r => {
+ const i = n[r];
+ const l = t[r];
const a = isPlainObject(l);
- const f = s ? `${s}.` : "";
- if (a && isPlainObject(r)) {
- const [t, n] = validateRecursive(l, r, o, f + i);
- e[i] = t;
- c[i] = n;
+ const u = s ? `${s}.` : "";
+ if (a && isPlainObject(i)) {
+ const [t, n] = validateRecursive(l, i, o, u + r);
+ e[r] = t;
+ c[r] = n;
each([ c, e ], (t => {
- if (isEmptyObject(t[i])) {
- delete t[i];
+ if (isEmptyObject(t[r])) {
+ delete t[r];
}
}));
} else if (!a) {
let t = false;
const n = [];
const s = [];
- const a = type(r);
- const u = !isArray(l) ? [ l ] : l;
- each(u, (o => {
+ const a = type(i);
+ const d = !isArray(l) ? [ l ] : l;
+ each(d, (o => {
let e;
- each(K, ((t, n) => {
+ each(nt, ((t, n) => {
if (t === o) {
e = n;
}
}));
const c = isUndefined(e);
- if (c && isString(r)) {
+ if (c && isString(i)) {
const s = o.split(" ");
- t = !!s.find((t => t === r));
+ t = !!s.find((t => t === i));
push(n, s);
} else {
- t = K[a] === o;
+ t = nt[a] === o;
}
- push(s, c ? K.string : e);
+ push(s, c ? nt.string : e);
return !t;
}));
if (t) {
- e[i] = r;
+ e[r] = i;
} else if (o) {
- console.warn(`${`The option "${f}${i}" wasn't set, because it doesn't accept the type [ ${a.toUpperCase()} ] with the value of "${r}".\r\n` + `Accepted types are: [ ${s.join(", ").toUpperCase()} ].\r\n`}${n.length > 0 ? `\r\nValid strings are: [ ${n.join(", ")} ].` : ""}`);
+ console.warn(`${`The option "${u}${r}" wasn't set, because it doesn't accept the type [ ${a.toUpperCase()} ] with the value of "${i}".\r\n` + `Accepted types are: [ ${s.join(", ").toUpperCase()} ].\r\n`}${n.length > 0 ? `\r\nValid strings are: [ ${n.join(", ")} ].` : ""}`);
}
- delete c[i];
+ delete c[r];
}
}));
return [ e, c ];
@@ -1048,106 +1057,106 @@ const validateRecursive = (t, n, o, s) => {
const validateOptions = (t, n, o) => validateRecursive(t, n, o);
-const Q = K.number;
+const ot = nt.number;
-const Z = K.boolean;
+const st = nt.boolean;
-const tt = [ K.array, K.null ];
+const et = [ nt.array, nt.null ];
-const nt = "hidden scroll visible visible-hidden";
+const ct = "hidden scroll visible visible-hidden";
-const ot = "visible hidden auto";
+const rt = "visible hidden auto";
-const st = "never scroll leavemove";
+const it = "never scroll leavemove";
-const et = {
- paddingAbsolute: Z,
+const lt = {
+ paddingAbsolute: st,
updating: {
- elementEvents: tt,
- attributes: tt,
- debounce: [ K.number, K.array, K.null ],
- ignoreMutation: [ K.function, K.null ]
+ elementEvents: et,
+ attributes: et,
+ debounce: [ nt.number, nt.array, nt.null ],
+ ignoreMutation: [ nt.function, nt.null ]
},
overflow: {
- x: nt,
- y: nt
+ x: ct,
+ y: ct
},
scrollbars: {
- visibility: ot,
- autoHide: st,
- autoHideDelay: Q,
- dragScroll: Z,
- clickScroll: Z,
- touch: Z
+ visibility: rt,
+ autoHide: it,
+ autoHideDelay: ot,
+ dragScroll: st,
+ clickScroll: st,
+ touch: st
},
nativeScrollbarsOverlaid: {
- show: Z,
- initialize: Z
+ show: st,
+ initialize: st
}
};
-const ct = "__osOptionsValidationPlugin";
+const at = "__osOptionsValidationPlugin";
-const it = {
- [ct]: {
+const ut = {
+ [at]: {
q: (t, n) => {
- const [o, s] = validateOptions(et, t, n);
- return J({}, s, o);
+ const [o, s] = validateOptions(lt, t, n);
+ return tt({}, s, o);
}
}
};
-const rt = 3333333;
+const dt = 3333333;
-const lt = "scroll";
+const ft = "scroll";
-const at = "__osSizeObserverPlugin";
+const _t = "__osSizeObserverPlugin";
-const ft = {
- [at]: {
+const gt = {
+ [_t]: {
q: (t, n, o) => {
const s = createDOM(``);
appendChildren(t, s);
- addClass(t, E);
+ addClass(t, M);
const e = s[0];
const c = e.lastChild;
- const i = e.firstChild;
- const r = null == i ? void 0 : i.firstChild;
+ const r = e.firstChild;
+ const i = null == r ? void 0 : r.firstChild;
let l = offsetSize(e);
let a = l;
- let f = false;
+ let u = false;
let _;
const reset = () => {
- scrollLeft(i, rt);
- scrollTop(i, rt);
- scrollLeft(c, rt);
- scrollTop(c, rt);
+ scrollLeft(r, dt);
+ scrollTop(r, dt);
+ scrollLeft(c, dt);
+ scrollTop(c, dt);
};
const onResized = t => {
_ = 0;
- if (f) {
+ if (u) {
l = a;
n(true === t);
}
};
const onScroll = t => {
a = offsetSize(e);
- f = !t || !equalWH(a, l);
+ u = !t || !equalWH(a, l);
if (t) {
stopAndPrevent(t);
- if (f && !_) {
- u(_);
- _ = d(onResized);
+ if (u && !_) {
+ d(_);
+ _ = f(onResized);
}
} else {
onResized(false === t);
}
reset();
};
- const g = push([], [ on(i, lt, onScroll), on(c, lt, onScroll) ]);
- style(r, {
- width: rt,
- height: rt
+ const g = push([], [ on(r, ft, onScroll), on(c, ft, onScroll) ]);
+ style(i, {
+ width: dt,
+ height: dt
});
reset();
return [ o ? onScroll.bind(0, false) : reset, g ];
@@ -1155,38 +1164,38 @@ const ft = {
}
};
-let ut = 0;
+let ht = 0;
-const dt = "__osScrollbarsHidingPlugin";
+const vt = "__osScrollbarsHidingPlugin";
-const _t = {
- [dt]: {
+const wt = {
+ [vt]: {
G: () => {
- const {L: t, P: n, M: o} = getEnvironment();
+ const {L: t, P: n, H: o} = getEnvironment();
const s = !o && !t && (n.x || n.y);
const e = s ? document.createElement("style") : false;
if (e) {
- attr(e, "id", `${A}-${ut}`);
- ut++;
+ attr(e, "id", `${T}-${ht}`);
+ ht++;
}
return e;
},
N: (t, n, o, s, e, c) => {
- const {R: i} = getEnvironment();
- const arrangeViewport = (e, c, i, r) => {
+ const {R: r} = getEnvironment();
+ const arrangeViewport = (e, c, r, i) => {
if (t) {
const {U: t} = s();
const {W: l, X: a} = e;
- const {x: f, y: u} = a;
- const {x: d, y: _} = l;
- const g = r ? "paddingRight" : "paddingLeft";
+ const {x: u, y: d} = a;
+ const {x: f, y: _} = l;
+ const g = i ? "paddingRight" : "paddingLeft";
const h = t[g];
const v = t.paddingTop;
- const w = c.w + i.w;
- const p = c.h + i.h;
+ const w = c.w + r.w;
+ const p = c.h + r.h;
const b = {
- w: _ && u ? `${_ + w - h}px` : "",
- h: d && f ? `${d + p - v}px` : ""
+ w: _ && d ? `${_ + w - h}px` : "",
+ h: f && u ? `${f + p - v}px` : ""
};
if (o) {
const {sheet: t} = o;
@@ -1194,7 +1203,7 @@ const _t = {
const {cssRules: n} = t;
if (n) {
if (!n.length) {
- t.insertRule(`#${attr(o, "id")} + .${A}::before {}`, 0);
+ t.insertRule(`#${attr(o, "id")} + .${T}::before {}`, 0);
}
const s = n[0].style;
s.width = b.w;
@@ -1210,32 +1219,32 @@ const _t = {
}
return t;
};
- const undoViewportArrange = (o, r, l) => {
+ const undoViewportArrange = (o, i, l) => {
if (t) {
const a = l || e(o);
- const {U: f} = s();
- const {X: u} = a;
- const {x: d, y: _} = u;
+ const {U: u} = s();
+ const {X: d} = a;
+ const {x: f, y: _} = d;
const g = {};
const assignProps = t => each(t.split(" "), (t => {
- g[t] = f[t];
+ g[t] = u[t];
}));
- if (d) {
+ if (f) {
assignProps("marginBottom paddingTop paddingBottom");
}
if (_) {
assignProps("marginLeft marginRight paddingLeft paddingRight");
}
const h = style(n, keys(g));
- removeClass(n, A);
- if (!i) {
+ removeClass(n, T);
+ if (!r) {
g.height = "";
}
style(n, g);
return [ () => {
- c(a, r, t, h);
+ c(a, i, t, h);
style(n, h);
- addClass(n, A);
+ addClass(n, T);
}, a ];
}
return [ noop ];
@@ -1257,7 +1266,7 @@ const dynamicInitializationElement = (t, n, o, s) => {
return true === e || isNull(e) || isUndefined(e) ? n.apply(0, t) : e;
};
-const gt = createDiv.bind(0, "");
+const pt = createDiv.bind(0, "");
const unwrap = t => {
appendChildren(parent(t), contents(t));
@@ -1271,75 +1280,75 @@ const addDataAttrHost = (t, n) => {
const createStructureSetupElements = t => {
const {j: n, L: o} = getEnvironment();
- const s = getPlugins()[dt];
+ const s = getPlugins()[vt];
const e = s && s.G;
- const {J: c, K: i, A: r, I: l} = n();
+ const {J: c, K: r, T: i, A: l} = n();
const a = isHTMLElement(t);
- const u = t;
- const d = a ? t : u.target;
- const _ = is(d, "textarea");
- const g = !_ && is(d, "body");
- const h = d.ownerDocument;
+ const d = t;
+ const f = a ? t : d.target;
+ const _ = is(f, "textarea");
+ const g = !_ && is(f, "body");
+ const h = f.ownerDocument;
const v = h.body;
const w = h.defaultView;
- const p = !!f && !_ && o;
- const b = staticInitializationElement.bind(0, [ d ]);
- const y = dynamicInitializationElement.bind(0, [ d ]);
- const C = [ b(gt, i, u.viewport), b(gt, i), b(gt) ].filter((t => !p ? t !== d : true))[0];
- const $ = C === d;
- const A = {
- Z: d,
- J: _ ? b(gt, c, u.host) : d,
+ const p = !!u && !_ && o;
+ const b = staticInitializationElement.bind(0, [ f ]);
+ const y = dynamicInitializationElement.bind(0, [ f ]);
+ const C = [ b(pt, r, d.viewport), b(pt, r), b(pt) ].filter((t => !p ? t !== f : true))[0];
+ const $ = C === f;
+ const T = {
+ Z: f,
+ J: _ ? b(pt, c, d.host) : f,
K: C,
- A: !$ && y(gt, r, u.padding),
- I: !$ && y(gt, l, u.content),
+ T: !$ && y(pt, i, d.padding),
+ A: !$ && y(pt, l, d.content),
tt: !$ && !o && e && e(),
nt: w,
ot: h,
st: parent(v),
et: v,
ct: _,
- it: g,
- rt: a,
+ rt: g,
+ it: a,
lt: $,
- ft: (t, n) => $ ? hasAttrClass(C, m, n) : hasClass(C, t),
- ut: (t, n, o) => $ ? attrClass(C, m, n, o) : (o ? addClass : removeClass)(C, t)
+ ut: (t, n) => $ ? hasAttrClass(C, m, n) : hasClass(C, t),
+ dt: (t, n, o) => $ ? attrClass(C, m, n, o) : (o ? addClass : removeClass)(C, t)
};
- const P = keys(A).reduce(((t, n) => {
- const o = A[n];
+ const E = keys(T).reduce(((t, n) => {
+ const o = T[n];
return push(t, o && !parent(o) ? o : false);
}), []);
- const elementIsGenerated = t => t ? indexOf(P, t) > -1 : null;
- const {Z: L, J: M, A: H, K: E, I: R, tt: D} = A;
+ const elementIsGenerated = t => t ? indexOf(E, t) > -1 : null;
+ const {Z: P, J: L, T: H, K: M, A: R, tt: D} = T;
const j = [];
- const V = _ && elementIsGenerated(M);
- const B = _ ? L : contents([ R, E, H, M, L ].find((t => false === elementIsGenerated(t))));
- const k = R || E;
+ const V = _ && elementIsGenerated(L);
+ const k = _ ? P : contents([ R, M, H, L, P ].find((t => false === elementIsGenerated(t))));
+ const B = R || M;
const appendElements = () => {
- const t = addDataAttrHost(M, $ ? "viewport" : "host");
+ const t = addDataAttrHost(L, $ ? "viewport" : "host");
const n = addClass(H, O);
- const s = addClass(E, !$ && z);
- const e = addClass(R, I);
+ const s = addClass(M, !$ && z);
+ const e = addClass(R, A);
if (V) {
- insertAfter(L, M);
+ insertAfter(P, L);
push(j, (() => {
- insertAfter(M, L);
- removeElements(M);
+ insertAfter(L, P);
+ removeElements(L);
}));
}
- appendChildren(k, B);
- appendChildren(M, H);
- appendChildren(H || M, !$ && E);
- appendChildren(E, R);
+ appendChildren(B, k);
+ appendChildren(L, H);
+ appendChildren(H || L, !$ && M);
+ appendChildren(M, R);
push(j, (() => {
t();
- removeAttr(E, S);
- removeAttr(E, x);
+ removeAttr(M, S);
+ removeAttr(M, x);
if (elementIsGenerated(R)) {
unwrap(R);
}
- if (elementIsGenerated(E)) {
- unwrap(E);
+ if (elementIsGenerated(M)) {
+ unwrap(M);
}
if (elementIsGenerated(H)) {
unwrap(H);
@@ -1349,79 +1358,79 @@ const createStructureSetupElements = t => {
e();
}));
if (o && !$) {
- push(j, removeClass.bind(0, E, T));
+ push(j, removeClass.bind(0, M, I));
}
if (D) {
- insertBefore(E, D);
+ insertBefore(M, D);
push(j, removeElements.bind(0, D));
}
};
- return [ A, appendElements, runEachAndClear.bind(0, j) ];
+ return [ T, appendElements, runEachAndClear.bind(0, j) ];
};
-const createTrinsicUpdate = (t, n) => {
- const {I: o} = t;
+const createTrinsicUpdateSegment = (t, n) => {
+ const {A: o} = t;
const [s] = n;
return t => {
const {R: n} = getEnvironment();
- const {dt: e} = s();
+ const {ft: e} = s();
const {_t: c} = t;
- const i = (o || !n) && c;
- if (i) {
+ const r = (o || !n) && c;
+ if (r) {
style(o, {
height: e ? "" : "100%"
});
}
return {
- gt: i,
- ht: i
+ gt: r,
+ ht: r
};
};
};
-const createPaddingUpdate = (t, n) => {
+const createPaddingUpdateSegment = (t, n) => {
const [o, s] = n;
- const {J: e, A: c, K: i, lt: r} = t;
+ const {J: e, T: c, K: r, lt: i} = t;
const [l, a] = createCache({
_: equalTRBL,
u: topRightBottomLeft()
}, topRightBottomLeft.bind(0, e, "padding", ""));
return (t, n, e) => {
- let [f, u] = a(e);
- const {L: d, R: _} = getEnvironment();
+ let [u, d] = a(e);
+ const {L: f, R: _} = getEnvironment();
const {vt: g} = o();
const {gt: h, ht: v, wt: w} = t;
const [p, b] = n("paddingAbsolute");
const y = !_ && v;
- if (h || u || y) {
- [f, u] = l(e);
+ if (h || d || y) {
+ [u, d] = l(e);
}
- const m = !r && (b || w || u);
+ const m = !i && (b || w || d);
if (m) {
- const t = !p || !c && !d;
- const n = f.r + f.l;
- const o = f.t + f.b;
+ const t = !p || !c && !f;
+ const n = u.r + u.l;
+ const o = u.t + u.b;
const e = {
marginRight: t && !g ? -n : 0,
marginBottom: t ? -o : 0,
marginLeft: t && g ? -n : 0,
- top: t ? -f.t : 0,
- right: t ? g ? -f.r : "auto" : 0,
- left: t ? g ? "auto" : -f.l : 0,
+ top: t ? -u.t : 0,
+ right: t ? g ? -u.r : "auto" : 0,
+ left: t ? g ? "auto" : -u.l : 0,
width: t ? `calc(100% + ${n}px)` : ""
};
- const r = {
- paddingTop: t ? f.t : 0,
- paddingRight: t ? f.r : 0,
- paddingBottom: t ? f.b : 0,
- paddingLeft: t ? f.l : 0
+ const i = {
+ paddingTop: t ? u.t : 0,
+ paddingRight: t ? u.r : 0,
+ paddingBottom: t ? u.b : 0,
+ paddingLeft: t ? u.l : 0
};
- style(c || i, e);
- style(i, r);
+ style(c || r, e);
+ style(r, i);
s({
- A: f,
+ T: u,
bt: !t,
- U: c ? r : assignDeep({}, e, r)
+ U: c ? i : assignDeep({}, e, i)
});
}
return {
@@ -1430,15 +1439,17 @@ const createPaddingUpdate = (t, n) => {
};
};
-const {max: ht} = Math;
+const {max: bt} = Math;
-const vt = "visible";
+const yt = bt.bind(0, 0);
-const wt = "hidden";
+const mt = "visible";
-const pt = 42;
+const St = "hidden";
-const bt = {
+const xt = 42;
+
+const Ct = {
_: equalWH,
u: {
w: 0,
@@ -1446,70 +1457,71 @@ const bt = {
}
};
-const yt = {
+const $t = {
_: equalXY,
u: {
- x: wt,
- y: wt
+ x: St,
+ y: St
}
};
-const getOverflowAmount = (t, n, o) => {
- const s = window.devicePixelRatio % 1 !== 0 ? 1 : 0;
- const e = {
- w: ht(0, t.w - n.w - ht(0, o.w)),
- h: ht(0, t.h - n.h - ht(0, o.h))
+const getOverflowAmount = (t, n) => {
+ const o = window.devicePixelRatio % 1 !== 0 ? 1 : 0;
+ const s = {
+ w: yt(t.w - n.w),
+ h: yt(t.h - n.h)
};
return {
- w: e.w > s ? e.w : 0,
- h: e.h > s ? e.h : 0
+ w: s.w > o ? s.w : 0,
+ h: s.h > o ? s.h : 0
};
};
const conditionalClass = (t, n, o) => o ? addClass(t, n) : removeClass(t, n);
-const overflowIsVisible = t => 0 === t.indexOf(vt);
+const overflowIsVisible = t => 0 === t.indexOf(mt);
-const createOverflowUpdate = (t, n) => {
+const createOverflowUpdateSegment = (t, n) => {
const [o, s] = n;
- const {J: e, A: c, K: i, tt: r, lt: l, ut: a} = t;
- const {T: f, R: u, L: d, P: _} = getEnvironment();
- const g = getPlugins()[dt];
- const h = !l && !d && (_.x || _.y);
- const [v, w] = createCache(bt, fractionalSize.bind(0, i));
- const [p, b] = createCache(bt, scrollSize.bind(0, i));
- const [y, O] = createCache(bt);
- const [z] = createCache(yt);
+ const {J: e, T: c, K: r, tt: i, lt: l, dt: a} = t;
+ const {I: u, R: d, L: f, P: _} = getEnvironment();
+ const g = getPlugins()[vt];
+ const h = !l && !f && (_.x || _.y);
+ const [v, w] = createCache(Ct, fractionalSize.bind(0, r));
+ const [p, b] = createCache(Ct, scrollSize.bind(0, r));
+ const [y, O] = createCache(Ct);
+ const [z, T] = createCache(Ct);
+ const [A] = createCache($t);
const fixFlexboxGlue = (t, n) => {
- style(i, {
+ style(r, {
height: ""
});
if (n) {
- const {bt: n, A: s} = o();
- const {St: c, W: r} = t;
+ const {bt: n, T: s} = o();
+ const {St: c, W: i} = t;
const l = fractionalSize(e);
const a = clientSize(e);
- const f = "content-box" === style(i, "boxSizing");
- const u = n || f ? s.b + s.t : 0;
- const d = !(_.x && f);
- style(i, {
- height: a.h + l.h + (c.x && d ? r.x : 0) - u
+ const u = "content-box" === style(r, "boxSizing");
+ const d = n || u ? s.b + s.t : 0;
+ const f = !(_.x && u);
+ style(r, {
+ height: a.h + l.h + (c.x && f ? i.x : 0) - d
});
}
};
const getViewportOverflowState = (t, n) => {
- const o = !d && !t ? pt : 0;
+ const o = !f && !t ? xt : 0;
const getStatePerAxis = (t, s, e) => {
- const c = style(i, t);
- const r = n ? n[t] : c;
- const l = "scroll" === r;
+ const c = style(r, t);
+ const i = n ? n[t] : c;
+ const l = "scroll" === i;
const a = s ? o : e;
- const f = l && !d ? a : 0;
- const u = s && !!o;
- return [ c, l, f, u ];
+ const u = l && !f ? a : 0;
+ const d = s && !!o;
+ return [ c, l, u, d ];
};
- const [s, e, c, r] = getStatePerAxis("overflowX", _.x, f.x);
- const [l, a, u, g] = getStatePerAxis("overflowY", _.y, f.y);
+ const [s, e, c, i] = getStatePerAxis("overflowX", _.x, u.x);
+ const [l, a, d, g] = getStatePerAxis("overflowY", _.y, u.y);
return {
xt: {
x: s,
@@ -1521,10 +1533,10 @@ const createOverflowUpdate = (t, n) => {
},
W: {
x: c,
- y: u
+ y: d
},
X: {
- x: r,
+ x: i,
y: g
}
};
@@ -1532,88 +1544,93 @@ const createOverflowUpdate = (t, n) => {
const setViewportOverflowState = (t, n, o, s) => {
const setAxisOverflowStyle = (t, n) => {
const o = overflowIsVisible(t);
- const s = n && o && t.replace(`${vt}-`, "") || "";
+ const s = n && o && t.replace(`${mt}-`, "") || "";
return [ n && !o ? t : "", overflowIsVisible(s) ? "hidden" : s ];
};
const [e, c] = setAxisOverflowStyle(o.x, n.x);
- const [i, r] = setAxisOverflowStyle(o.y, n.y);
- s.overflowX = c && i ? c : e;
- s.overflowY = r && e ? r : i;
+ const [r, i] = setAxisOverflowStyle(o.y, n.y);
+ s.overflowX = c && r ? c : e;
+ s.overflowY = i && e ? i : r;
return getViewportOverflowState(t, s);
};
const hideNativeScrollbars = (t, n, s, e) => {
- const {W: c, X: i} = t;
- const {x: r, y: l} = i;
- const {x: a, y: f} = c;
- const {U: u} = o();
- const d = n ? "marginLeft" : "marginRight";
+ const {W: c, X: r} = t;
+ const {x: i, y: l} = r;
+ const {x: a, y: u} = c;
+ const {U: d} = o();
+ const f = n ? "marginLeft" : "marginRight";
const _ = n ? "paddingLeft" : "paddingRight";
- const g = u[d];
- const h = u.marginBottom;
- const v = u[_];
- const w = u.paddingBottom;
- e.width = `calc(100% + ${f + -1 * g}px)`;
- e[d] = -f + g;
+ const g = d[f];
+ const h = d.marginBottom;
+ const v = d[_];
+ const w = d.paddingBottom;
+ e.width = `calc(100% + ${u + -1 * g}px)`;
+ e[f] = -u + g;
e.marginBottom = -a + h;
if (s) {
- e[_] = v + (l ? f : 0);
- e.paddingBottom = w + (r ? a : 0);
+ e[_] = v + (l ? u : 0);
+ e.paddingBottom = w + (i ? a : 0);
}
};
- const [A, I] = g ? g.N(h, i, r, o, getViewportOverflowState, hideNativeScrollbars) : [ () => h, () => [ noop ] ];
- return (t, n, r) => {
- const {gt: f, Ct: g, ht: h, yt: L, _t: M, wt: H} = t;
- const {dt: E, vt: R} = o();
- const [D, j] = n("nativeScrollbarsOverlaid.show");
- const [V, B] = n("overflow");
- const k = D && _.x && _.y;
- const F = !l && !u && (f || h || g || j || M);
- const Y = overflowIsVisible(V.x);
- const q = overflowIsVisible(V.y);
- const G = Y || q;
- let N = w(r);
- let U = b(r);
- let W = O(r);
- let X;
- if (j && d) {
- a(T, $, !k);
+ const [P, L] = g ? g.N(h, r, i, o, getViewportOverflowState, hideNativeScrollbars) : [ () => h, () => [ noop ] ];
+ return (t, n, i) => {
+ const {gt: u, Ct: g, ht: h, yt: H, _t: M, wt: R} = t;
+ const {ft: D, vt: j} = o();
+ const [V, k] = n("nativeScrollbarsOverlaid.show");
+ const [B, F] = n("overflow");
+ const Y = V && _.x && _.y;
+ const q = !l && !d && (u || h || g || k || M);
+ const G = overflowIsVisible(B.x);
+ const N = overflowIsVisible(B.y);
+ const U = G || N;
+ let W = w(i);
+ let X = b(i);
+ let J = O(i);
+ let K = T(i);
+ let Q;
+ if (k && f) {
+ a(I, $, !Y);
}
- if (F) {
- X = getViewportOverflowState(k);
- fixFlexboxGlue(X, E);
+ if (q) {
+ Q = getViewportOverflowState(Y);
+ fixFlexboxGlue(Q, D);
}
- if (f || L || h || H || j) {
- if (G) {
- a(P, C, false);
+ if (u || H || h || R || k) {
+ if (U) {
+ a(E, C, false);
}
- const [t, n] = I(k, R, X);
- const [o, s] = N = v(r);
- const [e, c] = U = p(r);
- const l = clientSize(i);
- let f = e;
- let u = l;
+ const [t, n] = L(Y, j, Q);
+ const [o, s] = W = v(i);
+ const [e, c] = X = p(i);
+ const l = clientSize(r);
+ let u = e;
+ let d = l;
t();
- if ((c || s || j) && n && !k && A(n, e, o, R)) {
- u = clientSize(i);
- f = scrollSize(i);
+ if ((c || s || k) && n && !Y && P(n, e, o, j)) {
+ d = clientSize(r);
+ u = scrollSize(r);
}
- W = y(getOverflowAmount({
- w: ht(e.w, f.w),
- h: ht(e.h, f.h)
- }, {
- w: u.w + ht(0, l.w - e.w),
- h: u.h + ht(0, l.h - e.h)
- }, o), r);
+ const f = {
+ w: yt(bt(e.w, u.w) + o.w),
+ h: yt(bt(e.h, u.h) + o.h)
+ };
+ const _ = {
+ w: yt(d.w + yt(l.w - e.w) + o.w),
+ h: yt(d.h + yt(l.h - e.h) + o.h)
+ };
+ K = z(_);
+ J = y(getOverflowAmount(f, _), i);
}
- const [J, K] = W;
- const [Q, Z] = U;
- const [tt, nt] = N;
- const ot = {
- x: J.w > 0,
- y: J.h > 0
+ const [Z, tt] = K;
+ const [nt, ot] = J;
+ const [st, et] = X;
+ const [ct, rt] = W;
+ const it = {
+ x: nt.w > 0,
+ y: nt.h > 0
};
- const st = Y && q && (ot.x || ot.y) || Y && ot.x && !ot.y || q && ot.y && !ot.x;
- if (L || H || nt || Z || K || B || j || F) {
+ const lt = G && N && (it.x || it.y) || G && it.x && !it.y || N && it.y && !it.x;
+ if (H || R || rt || et || tt || ot || F || k || q) {
const t = {
marginRight: 0,
marginBottom: 0,
@@ -1622,36 +1639,41 @@ const createOverflowUpdate = (t, n) => {
overflowY: "",
overflowX: ""
};
- const n = setViewportOverflowState(k, ot, V, t);
- const o = A(n, Q, tt, R);
+ const n = setViewportOverflowState(Y, it, B, t);
+ const o = P(n, st, ct, j);
if (!l) {
- hideNativeScrollbars(n, R, o, t);
+ hideNativeScrollbars(n, j, o, t);
}
- if (F) {
- fixFlexboxGlue(n, E);
+ if (q) {
+ fixFlexboxGlue(n, D);
}
if (l) {
attr(e, S, t.overflowX);
attr(e, x, t.overflowY);
} else {
- style(i, t);
+ style(r, t);
}
}
- attrClass(e, m, C, st);
- conditionalClass(c, P, st);
- !l && conditionalClass(i, P, G);
- const [et, ct] = z(getViewportOverflowState(k).xt);
+ attrClass(e, m, C, lt);
+ conditionalClass(c, E, lt);
+ !l && conditionalClass(r, E, U);
+ const [at, ut] = A(getViewportOverflowState(Y).xt);
s({
- xt: et,
+ xt: at,
$t: {
- x: J.w,
- y: J.h
+ x: Z.w,
+ y: Z.h
},
- Ot: ot
+ Ot: {
+ x: nt.w,
+ y: nt.h
+ },
+ zt: it
});
return {
- zt: ct,
- At: K
+ Tt: ut,
+ At: tt,
+ It: ot
};
};
};
@@ -1662,8 +1684,8 @@ const prepareUpdateHints = (t, n, o) => {
const c = keys(t).concat(keys(e));
each(c, (n => {
const c = t[n];
- const i = e[n];
- s[n] = !!(o || c || i);
+ const r = e[n];
+ s[n] = !!(o || c || r);
}));
return s;
};
@@ -1671,8 +1693,8 @@ const prepareUpdateHints = (t, n, o) => {
const createStructureSetupUpdate = (t, n) => {
const {K: o} = t;
const {L: s, P: e, R: c} = getEnvironment();
- const i = !s && (e.x || e.y);
- const r = [ createTrinsicUpdate(t, n), createPaddingUpdate(t, n), createOverflowUpdate(t, n) ];
+ const r = !s && (e.x || e.y);
+ const i = [ createTrinsicUpdateSegment(t, n), createPaddingUpdateSegment(t, n), createOverflowUpdateSegment(t, n) ];
return (t, n, s) => {
const e = prepareUpdateHints(assignDeep({
gt: false,
@@ -1680,46 +1702,47 @@ const createStructureSetupUpdate = (t, n) => {
wt: false,
_t: false,
At: false,
- zt: false,
+ It: false,
+ Tt: false,
Ct: false,
ht: false
}, n), {}, s);
- const l = i || !c;
+ const l = r || !c;
const a = l && scrollLeft(o);
- const f = l && scrollTop(o);
- let u = e;
- each(r, (n => {
- u = prepareUpdateHints(u, n(u, t, !!s) || {}, s);
+ const u = l && scrollTop(o);
+ let d = e;
+ each(i, (n => {
+ d = prepareUpdateHints(d, n(d, t, !!s) || {}, s);
}));
if (isNumber(a)) {
scrollLeft(o, a);
}
- if (isNumber(f)) {
- scrollTop(o, f);
+ if (isNumber(u)) {
+ scrollTop(o, u);
}
- return u;
+ return d;
};
};
-const mt = "animationstart";
+const Ot = "animationstart";
-const St = "scroll";
+const zt = "scroll";
-const xt = 3333333;
+const Tt = 3333333;
const getElmDirectionIsRTL = t => "rtl" === style(t, "direction");
const domRectHasDimensions = t => t && (t.height || t.width);
const createSizeObserver = (t, n, o) => {
- const {It: s = false, Tt: e = false} = o || {};
- const c = getPlugins()[at];
- const {H: i} = getEnvironment();
- const r = createDOM(``);
- const l = r[0];
+ const {Et: s = false, Pt: e = false} = o || {};
+ const c = getPlugins()[_t];
+ const {M: r} = getEnvironment();
+ const i = createDOM(``);
+ const l = i[0];
const a = l.firstChild;
- const u = getElmDirectionIsRTL.bind(0, l);
- const [d] = createCache({
+ const d = getElmDirectionIsRTL.bind(0, l);
+ const [f] = createCache({
u: void 0,
g: true,
_: (t, n) => !(!t || !domRectHasDimensions(t) && domRectHasDimensions(n))
@@ -1728,38 +1751,38 @@ const createSizeObserver = (t, n, o) => {
const o = isArray(t) && t.length > 0 && isObject(t[0]);
const e = !o && isBoolean(t[0]);
let c = false;
- let r = false;
+ let i = false;
let a = true;
if (o) {
- const [n, , o] = d(t.pop().contentRect);
+ const [n, , o] = f(t.pop().contentRect);
const s = domRectHasDimensions(n);
const e = domRectHasDimensions(o);
c = !o || !s;
- r = !e && s;
+ i = !e && s;
a = !c;
} else if (e) {
[, a] = t;
} else {
- r = true === t;
+ i = true === t;
}
if (s && a) {
const n = e ? t[0] : getElmDirectionIsRTL(l);
- scrollLeft(l, n ? i.n ? -xt : i.i ? 0 : xt : xt);
- scrollTop(l, xt);
+ scrollLeft(l, n ? r.n ? -Tt : r.i ? 0 : Tt : Tt);
+ scrollTop(l, Tt);
}
if (!c) {
n({
gt: !e,
- Pt: e ? t : void 0,
- Tt: !!r
+ Lt: e ? t : void 0,
+ Pt: !!i
});
}
};
const _ = [];
let g = e ? onSizeChangedCallbackProxy : false;
let h;
- if (f) {
- const t = new f(onSizeChangedCallbackProxy);
+ if (u) {
+ const t = new u(onSizeChangedCallbackProxy);
t.observe(a);
push(_, (() => {
t.disconnect();
@@ -1771,10 +1794,10 @@ const createSizeObserver = (t, n, o) => {
}
if (s) {
h = createCache({
- u: !u()
- }, u);
+ u: !d()
+ }, d);
const [t] = h;
- push(_, on(l, St, (n => {
+ push(_, on(l, zt, (n => {
const o = t();
const [s, e] = o;
if (e) {
@@ -1790,9 +1813,9 @@ const createSizeObserver = (t, n, o) => {
})));
}
if (g) {
- addClass(l, M);
- push(_, on(l, mt, g, {
- O: !!f
+ addClass(l, L);
+ push(_, on(l, Ot, g, {
+ O: !!u
}));
}
prependChildren(t, l);
@@ -1854,36 +1877,36 @@ const createEventContentChange = (t, n, o) => {
};
const updateElements = c => {
if (o) {
- const i = o.reduce(((n, o) => {
+ const r = o.reduce(((n, o) => {
if (o) {
const s = o[0];
const e = o[1];
- const i = e && s && (c ? c(s) : find(s, t));
- if (i && i.length && e && isString(e)) {
- push(n, [ i, e.trim() ], true);
+ const r = e && s && (c ? c(s) : find(s, t));
+ if (r && r.length && e && isString(e)) {
+ push(n, [ r, e.trim() ], true);
}
}
return n;
}), []);
- each(i, (t => each(t[0], (o => {
+ each(r, (t => each(t[0], (o => {
const c = t[1];
- const i = s.get(o);
- if (i) {
- const t = i[0];
- const n = i[1];
+ const r = s.get(o);
+ if (r) {
+ const t = r[0];
+ const n = r[1];
if (t === c) {
n();
}
}
- const r = on(o, c, (t => {
+ const i = on(o, c, (t => {
if (e) {
- r();
+ i();
s.delete(o);
} else {
n(t);
}
}));
- s.set(o, [ c, r ]);
+ s.set(o, [ c, i ]);
}))));
}
};
@@ -1896,47 +1919,47 @@ const createEventContentChange = (t, n, o) => {
const createDOMObserver = (t, n, o, s) => {
let e = false;
- const {Lt: c, Mt: i, Ht: r, Et: a, Rt: f, Dt: u} = s || {};
- const [d, _] = createEventContentChange(t, debounce((() => {
+ const {Ht: c, Mt: r, Rt: i, Dt: a, jt: u, Vt: d} = s || {};
+ const [f, _] = createEventContentChange(t, debounce((() => {
if (e) {
o(true);
}
}), {
v: 33,
p: 99
- }), r);
+ }), i);
const g = c || [];
- const h = i || [];
+ const h = r || [];
const v = g.concat(h);
const observerCallback = e => {
- const c = f || noop;
- const i = u || noop;
- const r = [];
+ const c = u || noop;
+ const r = d || noop;
+ const i = [];
const l = [];
- let d = false;
+ let f = false;
let g = false;
let v = false;
each(e, (o => {
- const {attributeName: e, target: f, type: u, oldValue: _, addedNodes: w} = o;
- const p = "attributes" === u;
- const b = "childList" === u;
- const y = t === f;
- const m = p && isString(e) ? attr(f, e) : 0;
+ const {attributeName: e, target: u, type: d, oldValue: _, addedNodes: w} = o;
+ const p = "attributes" === d;
+ const b = "childList" === d;
+ const y = t === u;
+ const m = p && isString(e) ? attr(u, e) : 0;
const S = 0 !== m && _ !== m;
const x = indexOf(h, e) > -1 && S;
if (n && !y) {
const n = !p;
- const r = p && x;
- const u = r && a && is(f, a);
- const d = u ? !c(f, e, _, m) : n || r;
- const h = d && !i(o, !!u, t, s);
+ const i = p && x;
+ const d = i && a && is(u, a);
+ const f = d ? !c(u, e, _, m) : n || i;
+ const h = f && !r(o, !!d, t, s);
push(l, w);
g = g || h;
v = v || b;
}
- if (!n && y && S && !c(f, e, _, m)) {
- push(r, e);
- d = d || x;
+ if (!n && y && S && !c(u, e, _, m)) {
+ push(i, e);
+ f = f || x;
}
}));
if (v && !isEmptyArray(l)) {
@@ -1947,8 +1970,8 @@ const createDOMObserver = (t, n, o, s) => {
}
if (n) {
g && o(false);
- } else if (!isEmptyArray(r) || d) {
- o(r, d);
+ } else if (!isEmptyArray(i) || f) {
+ o(i, f);
}
};
const w = new l(observerCallback);
@@ -1963,7 +1986,7 @@ const createDOMObserver = (t, n, o, s) => {
e = true;
return [ () => {
if (e) {
- d();
+ f();
w.disconnect();
e = false;
}
@@ -1974,22 +1997,22 @@ const createDOMObserver = (t, n, o, s) => {
} ];
};
-const Ct = `[${m}]`;
+const At = `[${m}]`;
-const $t = `.${z}`;
+const It = `.${z}`;
-const Ot = [ "tabindex" ];
+const Et = [ "tabindex" ];
-const zt = [ "wrap", "cols", "rows" ];
+const Pt = [ "wrap", "cols", "rows" ];
-const At = [ "id", "class", "style", "open" ];
+const Lt = [ "id", "class", "style", "open" ];
const createStructureSetupObservers = (t, n, o) => {
let s;
let e;
let c;
- const [, i] = n;
- const {J: r, K: l, I: a, ct: u, lt: d, ft: _, ut: g} = t;
+ const [, r] = n;
+ const {J: i, K: l, A: a, ct: d, lt: f, ut: _, dt: g} = t;
const {L: h, R: v} = getEnvironment();
const [w] = createCache({
_: equalWH,
@@ -1998,18 +2021,18 @@ const createStructureSetupObservers = (t, n, o) => {
h: 0
}
}, (() => {
- const t = _(P, C);
- t && g(P, C);
+ const t = _(E, C);
+ t && g(E, C);
const n = scrollSize(a);
const o = scrollSize(l);
const s = fractionalSize(l);
- t && g(P, C, true);
+ t && g(E, C, true);
return {
w: o.w + n.w + s.w,
h: o.h + n.h + s.h
};
}));
- const p = u ? zt : At.concat(zt);
+ const p = d ? Pt : Lt.concat(Pt);
const b = debounce(o, {
v: () => s,
p: () => e,
@@ -2023,9 +2046,9 @@ const createStructureSetupObservers = (t, n, o) => {
}
});
const updateViewportAttrsFromHost = t => {
- each(t || Ot, (t => {
- if (indexOf(Ot, t) > -1) {
- const n = attr(r, t);
+ each(t || Et, (t => {
+ if (indexOf(Et, t) > -1) {
+ const n = attr(i, t);
if (isString(n)) {
attr(l, t, n);
} else {
@@ -2036,20 +2059,20 @@ const createStructureSetupObservers = (t, n, o) => {
};
const onTrinsicChanged = t => {
const [n, s] = t;
- i({
- dt: n
+ r({
+ ft: n
});
o({
_t: s
});
};
- const onSizeChanged = ({gt: t, Pt: n, Tt: s}) => {
+ const onSizeChanged = ({gt: t, Lt: n, Pt: s}) => {
const e = !t || s ? o : b;
let c = false;
if (n) {
const [t, o] = n;
c = o;
- i({
+ r({
vt: t
});
}
@@ -2072,30 +2095,30 @@ const createStructureSetupObservers = (t, n, o) => {
b({
Ct: true
});
- } else if (!d) {
+ } else if (!f) {
updateViewportAttrsFromHost(t);
}
};
- const y = (a || !v) && createTrinsicObserver(r, onTrinsicChanged);
- const m = !d && createSizeObserver(r, onSizeChanged, {
- Tt: true,
- It: !h
+ const y = (a || !v) && createTrinsicObserver(i, onTrinsicChanged);
+ const m = !f && createSizeObserver(i, onSizeChanged, {
+ Pt: true,
+ Et: !h
});
- const [S] = createDOMObserver(r, false, onHostMutation, {
- Mt: At,
- Lt: At.concat(Ot)
+ const [S] = createDOMObserver(i, false, onHostMutation, {
+ Mt: Lt,
+ Ht: Lt.concat(Et)
});
- const x = d && new f(onSizeChanged.bind(0, {
+ const x = f && new u(onSizeChanged.bind(0, {
gt: true
}));
- x && x.observe(r);
+ x && x.observe(i);
updateViewportAttrsFromHost();
return [ t => {
const [n] = t("updating.ignoreMutation");
- const [o, i] = t("updating.attributes");
- const [r, f] = t("updating.elementEvents");
- const [u, d] = t("updating.debounce");
- const _ = f || i;
+ const [o, r] = t("updating.attributes");
+ const [i, u] = t("updating.elementEvents");
+ const [d, f] = t("updating.debounce");
+ const _ = u || r;
const ignoreMutationFromOptions = t => isFunction(n) && n(t);
if (_) {
if (c) {
@@ -2104,25 +2127,25 @@ const createStructureSetupObservers = (t, n, o) => {
}
c = createDOMObserver(a || l, true, onContentMutation, {
Mt: p.concat(o || []),
- Lt: p.concat(o || []),
- Ht: r,
- Et: Ct,
- Dt: (t, n) => {
+ Ht: p.concat(o || []),
+ Rt: i,
+ Dt: At,
+ Vt: (t, n) => {
const {target: o, attributeName: s} = t;
- const e = !n && s ? liesBetween(o, Ct, $t) : false;
+ const e = !n && s ? liesBetween(o, At, It) : false;
return e || !!ignoreMutationFromOptions(t);
}
});
}
- if (d) {
+ if (f) {
b.S();
- if (isArray(u)) {
- const t = u[0];
- const n = u[1];
+ if (isArray(d)) {
+ const t = d[0];
+ const n = d[1];
s = isNumber(t) ? t : false;
e = isNumber(n) ? n : false;
- } else if (isNumber(u)) {
- s = u;
+ } else if (isNumber(d)) {
+ s = d;
e = false;
} else {
s = false;
@@ -2138,8 +2161,13 @@ const createStructureSetupObservers = (t, n, o) => {
} ];
};
-const It = {
- A: {
+const Ht = {
+ x: 0,
+ y: 0
+};
+
+const Mt = {
+ T: {
t: 0,
r: 0,
b: 0,
@@ -2155,137 +2183,255 @@ const It = {
paddingBottom: 0,
paddingLeft: 0
},
- $t: {
- x: 0,
- y: 0
- },
+ $t: Ht,
+ Ot: Ht,
xt: {
x: "hidden",
y: "hidden"
},
- Ot: {
+ zt: {
x: false,
y: false
},
- dt: false,
+ ft: false,
vt: false
};
const createStructureSetup = (t, n) => {
const o = createOptionCheck(n, {});
- const s = createState(It);
- const [e, c, i] = createEventListenerHub();
- const [r] = s;
- const [l, a, f] = createStructureSetupElements(t);
- const u = createStructureSetupUpdate(l, s);
- const [d, _] = createStructureSetupObservers(l, s, (t => {
- i("u", [ u(o, t), {}, false ]);
+ const s = createState(Mt);
+ const [e, c, r] = createEventListenerHub();
+ const [i] = s;
+ const [l, a, u] = createStructureSetupElements(t);
+ const d = createStructureSetupUpdate(l, s);
+ const [f, _] = createStructureSetupObservers(l, s, (t => {
+ r("u", [ d(o, t), {}, false ]);
}));
- const g = r.bind(0);
- g.jt = t => {
+ const g = i.bind(0);
+ g.kt = t => {
e("u", t);
};
- g.Vt = a;
- g.Bt = l;
+ g.Bt = a;
+ g.Ft = l;
return [ (t, o) => {
const s = createOptionCheck(n, t, o);
- d(s);
- i("u", [ u(s, {}, o), t, !!o ]);
+ f(s);
+ r("u", [ d(s, {}, o), t, !!o ]);
}, g, () => {
c();
_();
- f();
+ u();
} ];
};
-const generateScrollbarDOM = t => {
- const n = createDiv(`${V} ${t}`);
- const o = createDiv(F);
- const s = createDiv(Y);
- appendChildren(n, o);
- appendChildren(o, s);
- return {
- kt: n,
- Ft: o,
- Yt: s
- };
-};
+const Rt = "touchstart mouseenter";
+
+const Dt = "touchend touchcancel mouseleave";
const createScrollbarsSetupElements = (t, n) => {
const {j: o} = getEnvironment();
- const {qt: s} = o();
- const {Z: e, J: c, K: i, rt: r} = n;
- const l = !r && t.scrollbarsSlot;
- const a = dynamicInitializationElement([ e, c, i ], (() => c), s, l);
- const f = generateScrollbarDOM(B);
- const u = generateScrollbarDOM(k);
- const {kt: d} = f;
- const {kt: _} = u;
- const appendElements = () => {
- appendChildren(a, d);
- appendChildren(a, _);
+ const {Yt: s} = o();
+ const {Z: e, J: c, K: r, it: i} = n;
+ const l = !i && t.scrollbarsSlot;
+ const a = dynamicInitializationElement([ e, c, r ], (() => c), s, l);
+ const scrollbarsAddRemoveClass = (t, n, o) => {
+ const s = o ? addClass : removeClass;
+ each(t, (t => {
+ s(t.qt, n);
+ }));
};
+ const u = [];
+ const d = [];
+ const f = [];
+ const _ = scrollbarsAddRemoveClass.bind(0, d);
+ const g = scrollbarsAddRemoveClass.bind(0, f);
+ const generateScrollbarDOM = t => {
+ const n = t ? k : B;
+ const o = t ? d : f;
+ const s = createDiv(`${V} ${n} os-theme-dark`);
+ const e = createDiv(F);
+ const c = createDiv(Y);
+ const r = {
+ qt: s,
+ Gt: e,
+ Nt: c
+ };
+ appendChildren(s, e);
+ appendChildren(e, c);
+ push(u, removeElements.bind(0, s));
+ push(o, r);
+ push(u, on(s, Rt, (() => {
+ _(N, true);
+ g(N, true);
+ })));
+ push(u, on(s, Dt, (() => {
+ _(N);
+ g(N);
+ })));
+ return r;
+ };
+ const h = generateScrollbarDOM.bind(0, true);
+ const v = generateScrollbarDOM.bind(0, false);
+ const appendElements = () => {
+ appendChildren(a, d[0].qt);
+ appendChildren(a, f[0].qt);
+ };
+ h();
+ v();
return [ {
- Gt: f,
- Nt: u
- }, appendElements, removeElements.bind(0, [ d, _ ]) ];
+ Ut: {
+ Wt: d,
+ Xt: h,
+ Jt: _
+ },
+ Kt: {
+ Wt: f,
+ Xt: v,
+ Jt: g
+ }
+ }, appendElements, runEachAndClear.bind(0, u) ];
+};
+
+const createSelfCancelTimeout = t => {
+ let n;
+ const o = t ? window.setTimeout : f;
+ const s = t ? window.clearTimeout : d;
+ return [ e => {
+ s(n);
+ n = o(e, isFunction(t) ? t() : t);
+ }, () => s(n) ];
};
const createScrollbarsSetup = (t, n, o) => {
- const s = createState({});
- const [e] = s;
- const [c, i, r] = createScrollbarsSetupElements(t, o);
- const l = e.bind(0);
- l.Bt = c;
- l.Vt = i;
- return [ (t, o) => {
- const s = createOptionCheck(n, t, o);
- console.log(s);
- }, l, () => {
- r();
- } ];
+ let s = 0;
+ let e;
+ let c;
+ let r;
+ let i;
+ const l = createState({});
+ const [a] = l;
+ const [u, d] = createSelfCancelTimeout();
+ const [f, _] = createSelfCancelTimeout();
+ const [g, h] = createSelfCancelTimeout(100);
+ const [v, w] = createSelfCancelTimeout(100);
+ const [p, b] = createSelfCancelTimeout((() => s));
+ const [y, m, S] = createScrollbarsSetupElements(t, o.Ft);
+ const {Ut: x, Kt: C} = y;
+ const {Jt: $} = x;
+ const {Jt: O} = C;
+ const manageScrollbarsAutoHide = (t, n) => {
+ b();
+ if (t) {
+ $(U);
+ O(U);
+ } else {
+ const hide = () => {
+ $(U, true);
+ O(U, true);
+ };
+ if (s > 0 && !n) {
+ p(hide);
+ } else {
+ hide();
+ }
+ }
+ };
+ const z = [ h, b, w, _, d, S, on(o.Ft.J, "mouseenter", (() => {
+ i = true;
+ c && manageScrollbarsAutoHide(true);
+ })), on(o.Ft.J, "mouseleave", (() => {
+ i = false;
+ c && manageScrollbarsAutoHide(false);
+ })), on(o.Ft.J, "mousemove", (() => {
+ e && u((() => {
+ h();
+ manageScrollbarsAutoHide(true);
+ v((() => {
+ e && manageScrollbarsAutoHide(false);
+ }));
+ }));
+ })), on(o.Ft.K, "scroll", (() => {
+ r && f((() => {
+ manageScrollbarsAutoHide(true);
+ g((() => {
+ r && !i && manageScrollbarsAutoHide(false);
+ }));
+ }));
+ })) ];
+ const T = a.bind(0);
+ T.Ft = y;
+ T.Bt = m;
+ return [ (t, i, l) => {
+ const {At: a, It: u, Tt: d} = l;
+ const f = createOptionCheck(n, t, i);
+ const [_, g] = f("scrollbars.visibility");
+ const [h, v] = f("scrollbars.autoHide");
+ const [w] = f("scrollbars.autoHideDelay");
+ f("scrollbars.dragScrolling");
+ f("scrollbars.touchSupport");
+ const p = d || g;
+ const setScrollbarVisibility = (t, n) => {
+ const o = "visible" === _ || "auto" === _ && "scroll" === t;
+ n(q, o);
+ return o;
+ };
+ s = w;
+ if (p) {
+ const {xt: t} = o();
+ const n = setScrollbarVisibility(t.x, $);
+ const s = setScrollbarVisibility(t.y, O);
+ const e = n && s;
+ $(G, !e);
+ O(G, !e);
+ }
+ if (v) {
+ e = "move" === h;
+ c = "leave" === h;
+ r = "never" !== h;
+ manageScrollbarsAutoHide(!r, true);
+ }
+ }, T, runEachAndClear.bind(0, z) ];
};
-const Tt = new Set;
+const jt = new Set;
-const Pt = new WeakMap;
+const Vt = new WeakMap;
const addInstance = (t, n) => {
- Pt.set(t, n);
- Tt.add(t);
+ Vt.set(t, n);
+ jt.add(t);
};
const removeInstance = t => {
- Pt.delete(t);
- Tt.delete(t);
+ Vt.delete(t);
+ jt.delete(t);
};
-const getInstance = t => Pt.get(t);
+const getInstance = t => Vt.get(t);
const OverlayScrollbars = (t, n, o) => {
let s = false;
- const {B: e, P: c, D: i} = getEnvironment();
- const r = getPlugins();
+ const {k: e, P: c, D: r} = getEnvironment();
+ const i = getPlugins();
const l = isHTMLElement(t) ? t : t.target;
const a = getInstance(l);
if (a) {
return a;
}
- const f = r[ct];
+ const u = i[at];
const validateOptions = t => {
const n = t || {};
- const o = f && f.q;
+ const o = u && u.q;
return o ? o(n, true) : n;
};
- const u = assignDeep({}, e(), validateOptions(n));
- const [d, _, g] = createEventListenerHub(o);
- const [h, v, w] = createStructureSetup(t, u);
- const [p, b, y] = createScrollbarsSetup(t, u, v.Bt);
+ const d = assignDeep({}, e(), validateOptions(n));
+ const [f, _, g] = createEventListenerHub(o);
+ const [h, v, w] = createStructureSetup(t, d);
+ const [p, b, y] = createScrollbarsSetup(t, d, v);
const update = (t, n) => {
- h(t, n);
- p(t, n);
+ h(t, !!n);
};
- const m = i(update.bind(0, {}, true));
+ const m = r(update.bind(0, {}, true));
const destroy = t => {
removeInstance(l);
m();
@@ -2298,31 +2444,32 @@ const OverlayScrollbars = (t, n, o) => {
const S = {
options(t) {
if (t) {
- const n = getOptionsDiff(u, validateOptions(t));
+ const n = getOptionsDiff(d, validateOptions(t));
if (!isEmptyObject(n)) {
- assignDeep(u, n);
+ assignDeep(d, n);
update(n);
}
}
- return assignDeep({}, u);
+ return assignDeep({}, d);
},
- on: d,
+ on: f,
off: (t, n) => {
t && n && _(t, n);
},
state() {
- const {$t: t, xt: n, Ot: o, A: e, bt: c} = v();
+ const {$t: t, Ot: n, xt: o, zt: e, T: c, bt: r} = v();
return assignDeep({}, {
- overflowAmount: t,
- overflowStyle: n,
- hasOverflow: o,
- padding: e,
- paddingAbsolute: c,
+ overflowEdge: t,
+ overflowAmount: n,
+ overflowStyle: o,
+ hasOverflow: e,
+ padding: c,
+ paddingAbsolute: r,
destroyed: s
});
},
elements() {
- const {Z: t, J: n, A: o, K: s, I: e} = v.Bt;
+ const {Z: t, J: n, T: o, K: s, A: e} = v.Ft;
return assignDeep({}, {
target: t,
host: n,
@@ -2337,31 +2484,35 @@ const OverlayScrollbars = (t, n, o) => {
},
destroy: destroy.bind(0)
};
- each(keys(r), (t => {
- const n = r[t];
+ v.kt(((t, n, o) => {
+ p(n, o, t);
+ }));
+ each(keys(i), (t => {
+ const n = i[t];
if (isFunction(n)) {
n(OverlayScrollbars, S);
}
}));
- if (c.x && c.y && !u.nativeScrollbarsOverlaid.initialize) {
+ if (c.x && c.y && !d.nativeScrollbarsOverlaid.initialize) {
destroy(true);
return S;
}
- v.Vt();
- b.Vt();
+ v.Bt();
+ b.Bt();
addInstance(l, S);
g("initialized", [ S ]);
- v.jt(((t, n, o) => {
- const {gt: s, wt: e, _t: c, At: i, zt: r, ht: l, Ct: a} = t;
+ v.kt(((t, n, o) => {
+ const {gt: s, wt: e, _t: c, At: r, It: i, Tt: l, ht: a, Ct: u} = t;
g("updated", [ S, {
updateHints: {
sizeChanged: s,
directionChanged: e,
heightIntrinsicChanged: c,
+ overflowEdgeChanged: r,
overflowAmountChanged: i,
- overflowStyleChanged: r,
- contentMutation: l,
- hostMutation: a
+ overflowStyleChanged: l,
+ contentMutation: a,
+ hostMutation: u
},
changedOptions: n,
force: o
@@ -2373,7 +2524,7 @@ const OverlayScrollbars = (t, n, o) => {
OverlayScrollbars.plugin = addPlugin;
OverlayScrollbars.env = () => {
- const {T: t, P: n, L: o, H: s, R: e, M: c, F: i, Y: r, j: l, V: a, B: f, k: u} = getEnvironment();
+ const {I: t, P: n, L: o, M: s, R: e, H: c, F: r, Y: i, j: l, V: a, k: u, B: d} = getEnvironment();
return assignDeep({}, {
scrollbarsSize: t,
scrollbarsOverlaid: n,
@@ -2381,14 +2532,14 @@ OverlayScrollbars.env = () => {
rtlScrollBehavior: s,
flexboxGlue: e,
cssCustomProperties: c,
- defaultInitializationStrategy: i,
- defaultDefaultOptions: r,
+ defaultInitializationStrategy: r,
+ defaultDefaultOptions: i,
getInitializationStrategy: l,
setInitializationStrategy: a,
- getDefaultOptions: f,
- setDefaultOptions: u
+ getDefaultOptions: u,
+ setDefaultOptions: d
});
};
-export { OverlayScrollbars, it as optionsValidationPlugin, _t as scrollbarsHidingPlugin, ft as sizeObserverPlugin };
+export { OverlayScrollbars, ut as optionsValidationPlugin, wt as scrollbarsHidingPlugin, gt as sizeObserverPlugin };
//# sourceMappingURL=overlayscrollbars.esm.js.map
diff --git a/packages/overlayscrollbars/dist/overlayscrollbars.esm.js.map b/packages/overlayscrollbars/dist/overlayscrollbars.esm.js.map
index f75e983..8498c4d 100644
--- a/packages/overlayscrollbars/dist/overlayscrollbars.esm.js.map
+++ b/packages/overlayscrollbars/dist/overlayscrollbars.esm.js.map
@@ -1 +1 @@
-{"version":3,"file":"overlayscrollbars.esm.js","sources":["../src/support/utils/array.ts","../src/support/dom/style.ts","../src/support/cache.ts","../src/support/utils/types.ts","../src/support/utils/object.ts","../src/support/dom/attribute.ts","../src/support/dom/traversal.ts","../src/support/dom/manipulation.ts","../src/support/dom/create.ts","../src/support/compatibility/vendors.ts","../src/support/compatibility/apis.ts","../src/support/dom/class.ts","../src/support/utils/equal.ts","../src/support/utils/function.ts","../src/support/dom/dimensions.ts","../src/support/dom/events.ts","../src/support/dom/offset.ts","../src/support/eventListeners.ts","../src/setups/setups.ts","../src/classnames.ts","../src/options.ts","../src/environment.ts","../src/plugins/plugins.ts","../../../node_modules/@babel/runtime/helpers/extends.js","../src/plugins/optionsValidationPlugin/validation.ts","../src/plugins/optionsValidationPlugin/optionsValidationPlugin.ts","../src/plugins/sizeObserverPlugin/sizeObserverPlugin.ts","../src/plugins/scrollbarsHidingPlugin/scrollbarsHidingPlugin.ts","../src/initialization.ts","../src/setups/structureSetup/structureSetup.elements.ts","../src/setups/structureSetup/updateSegments/trinsicUpdateSegment.ts","../src/setups/structureSetup/updateSegments/paddingUpdateSegment.ts","../src/setups/structureSetup/updateSegments/overflowUpdateSegment.ts","../src/setups/structureSetup/structureSetup.update.ts","../src/observers/sizeObserver.ts","../src/observers/trinsicObserver.ts","../src/observers/domObserver.ts","../src/setups/structureSetup/structureSetup.observers.ts","../src/setups/structureSetup/structureSetup.ts","../src/setups/scrollbarsSetup/scrollbarsSetup.elements.ts","../src/setups/scrollbarsSetup/scrollbarsSetup.ts","../src/instances.ts","../src/overlayscrollbars.ts"],"sourcesContent":["import { isArrayLike, isString } from 'support/utils/types';\r\nimport { PlainObject } from 'typings';\r\n\r\ntype RunEachItem = ((...args: any) => any | any[]) | null | undefined;\r\n\r\n/**\r\n * Iterates through a array or object\r\n * @param arrayLikeOrObject The array or object through which shall be iterated.\r\n * @param callback The function which is responsible for the iteration.\r\n * If the function returns true its treated like a \"continue\" statement.\r\n * If the function returns false its treated like a \"break\" statement.\r\n */\r\nexport function each(\r\n array: Array | ReadonlyArray,\r\n callback: (value: T, indexOrKey: number, source: Array) => boolean | unknown\r\n): Array | ReadonlyArray;\r\nexport function each(\r\n array: Array | ReadonlyArray | null | undefined,\r\n callback: (value: T, indexOrKey: number, source: Array) => boolean | unknown\r\n): Array | ReadonlyArray | null | undefined;\r\nexport function each(\r\n arrayLikeObject: ArrayLike,\r\n callback: (value: T, indexOrKey: number, source: ArrayLike) => boolean | unknown\r\n): ArrayLike;\r\nexport function each(\r\n arrayLikeObject: ArrayLike | null | undefined,\r\n callback: (value: T, indexOrKey: number, source: ArrayLike) => boolean | unknown\r\n): ArrayLike | null | undefined;\r\nexport function each(\r\n obj: PlainObject,\r\n callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown\r\n): PlainObject;\r\nexport function each(\r\n obj: PlainObject | null | undefined,\r\n callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown\r\n): PlainObject | null | undefined;\r\nexport function each(\r\n source: Array | ArrayLike | ReadonlyArray | PlainObject | null | undefined,\r\n callback: (value: T, indexOrKey: any, source: any) => boolean | unknown\r\n): Array | ArrayLike | ReadonlyArray | PlainObject | null | undefined {\r\n if (isArrayLike(source)) {\r\n for (let i = 0; i < source.length; i++) {\r\n if (callback(source[i], i, source) === false) {\r\n break;\r\n }\r\n }\r\n } else if (source) {\r\n each(Object.keys(source), (key) => callback(source[key], key, source));\r\n }\r\n return source;\r\n}\r\n\r\n/**\r\n * Returns the index of the given inside the given array or -1 if the given item isn't part of the given array.\r\n * @param arr The array.\r\n * @param item The item.\r\n * @param fromIndex The array index at which to begin the search. If fromIndex is omitted, the search starts at index 0.\r\n */\r\nexport const indexOf = (arr: T[], item: T, fromIndex?: number): number =>\r\n arr.indexOf(item, fromIndex);\r\n\r\n/**\r\n * Pushesh all given items into the given array and returns it.\r\n * @param array The array the items shall be pushed into.\r\n * @param items The items which shall be pushed into the array.\r\n */\r\nexport const push = (array: T[], items: T | ArrayLike, arrayIsSingleItem?: boolean): T[] => {\r\n !arrayIsSingleItem && !isString(items) && isArrayLike(items)\r\n ? Array.prototype.push.apply(array, items as T[])\r\n : array.push(items as T);\r\n return array;\r\n};\r\n\r\n/**\r\n * Creates a shallow-copied Array instance from an array-like or iterable object.\r\n * @param arr The object from which the array instance shall be created.\r\n */\r\nexport const from = (arr?: ArrayLike | Set) => {\r\n const original = Array.from;\r\n const result: T[] = [];\r\n\r\n if (original && arr) {\r\n return original(arr);\r\n }\r\n\r\n if (arr instanceof Set) {\r\n arr.forEach((value) => {\r\n push(result, value);\r\n });\r\n } else {\r\n each(arr, (elm) => {\r\n push(result, elm);\r\n });\r\n }\r\n\r\n return result;\r\n};\r\n\r\n/**\r\n * Check whether the passed array is empty.\r\n * @param array The array which shall be checked.\r\n */\r\nexport const isEmptyArray = (array: any[] | null | undefined): boolean =>\r\n !!array && array.length === 0;\r\n\r\n/**\r\n * Calls all functions in the passed array/set of functions.\r\n * @param arr The array filled with function which shall be called.\r\n * @param args The args with which each function is called.\r\n * @param keep True when the Set / array should not be cleared afterwards, false otherwise.\r\n */\r\nexport const runEachAndClear = (arr: RunEachItem[], args?: any[], keep?: boolean): void => {\r\n // eslint-disable-next-line prefer-spread\r\n const runFn = (fn: RunEachItem) => fn && fn.apply(undefined, args || []);\r\n each(arr, runFn);\r\n !keep && ((arr as any[]).length = 0);\r\n};\r\n","import { each, keys } from 'support/utils';\r\nimport { isString, isNumber, isArray, isUndefined } from 'support/utils/types';\r\nimport { PlainObject, StyleObject } from 'typings';\r\n\r\nexport interface TRBL {\r\n t: number;\r\n r: number;\r\n b: number;\r\n l: number;\r\n}\r\n\r\nconst cssNumber = {\r\n // animationiterationcount: 1,\r\n // columncount: 1,\r\n // fillopacity: 1,\r\n // flexgrow: 1,\r\n // flexshrink: 1,\r\n // fontweight: 1,\r\n // lineheight: 1,\r\n // order: 1,\r\n // orphans: 1,\r\n // widows: 1,\r\n // zoom: 1,\r\n opacity: 1,\r\n zindex: 1,\r\n};\r\n\r\nconst parseToZeroOrNumber = (value: string, toFloat?: boolean): number => {\r\n /* istanbul ignore next */\r\n const num = toFloat ? parseFloat(value) : parseInt(value, 10);\r\n // num === num means num is not NaN\r\n /* istanbul ignore next */\r\n return num === num ? num : 0; // eslint-disable-line no-self-compare\r\n};\r\n\r\nconst adaptCSSVal = (prop: string, val: string | number): string | number =>\r\n !cssNumber[prop.toLowerCase()] && isNumber(val) ? `${val}px` : val;\r\n\r\nconst getCSSVal = (elm: HTMLElement, computedStyle: CSSStyleDeclaration, prop: string): string =>\r\n /* istanbul ignore next */\r\n computedStyle != null\r\n ? computedStyle[prop] || computedStyle.getPropertyValue(prop)\r\n : elm.style[prop];\r\n\r\nconst setCSSVal = (\r\n elm: HTMLElement | false | null | undefined,\r\n prop: string,\r\n val: string | number\r\n): void => {\r\n try {\r\n if (elm) {\r\n const { style: elmStyle } = elm;\r\n if (!isUndefined(elmStyle[prop])) {\r\n elmStyle[prop] = adaptCSSVal(prop, val);\r\n } else {\r\n elmStyle.setProperty(prop, val as string);\r\n }\r\n }\r\n } catch (e) {}\r\n};\r\n\r\n/**\r\n * Gets or sets the passed styles to the passed element.\r\n * @param elm The element to which the styles shall be applied to / be read from.\r\n * @param styles The styles which shall be set or read.\r\n */\r\nexport function style(\r\n elm: HTMLElement | false | null | undefined,\r\n styles: StyleObject\r\n): void;\r\nexport function style(\r\n elm: HTMLElement | false | null | undefined,\r\n styles: string\r\n): string;\r\nexport function style(\r\n elm: HTMLElement | false | null | undefined,\r\n styles: Array | string\r\n): { [key: string]: string };\r\nexport function style(\r\n elm: HTMLElement | false | null | undefined,\r\n styles: StyleObject | Array | string\r\n): { [key: string]: string } | string | void {\r\n const getSingleStyle = isString(styles);\r\n const getStyles = isArray(styles) || getSingleStyle;\r\n\r\n if (getStyles) {\r\n let getStylesResult: string | PlainObject = getSingleStyle ? '' : {};\r\n if (elm) {\r\n const computedStyle: CSSStyleDeclaration = window.getComputedStyle(elm, null);\r\n getStylesResult = getSingleStyle\r\n ? getCSSVal(elm, computedStyle, styles as string)\r\n : (styles as Array).reduce((result, key) => {\r\n result[key] = getCSSVal(elm, computedStyle, key as string);\r\n return result;\r\n }, getStylesResult);\r\n }\r\n return getStylesResult;\r\n }\r\n each(keys(styles), (key) => setCSSVal(elm, key, styles[key]));\r\n}\r\n\r\n/**\r\n * Hides the passed element (display: none).\r\n * @param elm The element which shall be hidden.\r\n */\r\nexport const hide = (elm: HTMLElement | false | null | undefined): void => {\r\n style(elm, { display: 'none' });\r\n};\r\n\r\n/**\r\n * Shows the passed element (display: block).\r\n * @param elm The element which shall be shown.\r\n */\r\nexport const show = (elm: HTMLElement | false | null | undefined): void => {\r\n style(elm, { display: 'block' });\r\n};\r\n\r\n/**\r\n * Returns the top right bottom left values of the passed css property.\r\n * @param elm The element of which the values shall be returned.\r\n * @param propertyPrefix The css property prefix. (e.g. \"border\")\r\n * @param propertySuffix The css property suffix. (e.g. \"width\")\r\n */\r\nexport const topRightBottomLeft = (\r\n elm?: HTMLElement | false | null | undefined,\r\n propertyPrefix?: string,\r\n propertySuffix?: string\r\n): TRBL => {\r\n const finalPrefix = propertyPrefix ? `${propertyPrefix}-` : '';\r\n const finalSuffix = propertySuffix ? `-${propertySuffix}` : '';\r\n const top = `${finalPrefix}top${finalSuffix}`;\r\n const right = `${finalPrefix}right${finalSuffix}`;\r\n const bottom = `${finalPrefix}bottom${finalSuffix}`;\r\n const left = `${finalPrefix}left${finalSuffix}`;\r\n const result = style(elm, [top, right, bottom, left]);\r\n return {\r\n t: parseToZeroOrNumber(result[top]),\r\n r: parseToZeroOrNumber(result[right]),\r\n b: parseToZeroOrNumber(result[bottom]),\r\n l: parseToZeroOrNumber(result[left]),\r\n };\r\n};\r\n","export interface CacheOptions {\r\n // initial value of _value.\r\n _initialValue: Value;\r\n // Custom comparison function if shallow compare isn't enough. Returns true if nothing changed.\r\n _equal?: EqualCachePropFunction;\r\n // If true always updates _value and _previous, otherwise they update only when they changed.\r\n _alwaysUpdateValues?: boolean;\r\n}\r\n\r\nexport type CacheValues = [value: T, changed: boolean, previous?: T];\r\n\r\nexport type EqualCachePropFunction = (currentVal: Value, newVal: Value) => boolean;\r\n\r\nexport type CacheUpdater = (current: Value, previous?: Value) => Value;\r\n\r\nexport type UpdateCacheContextual = (newValue: Value, force?: boolean) => CacheValues;\r\n\r\nexport type UpdateCache = (force?: boolean) => CacheValues;\r\n\r\nexport type GetCurrentCache = (force?: boolean) => CacheValues;\r\n\r\nexport type Cache = [UpdateCache, GetCurrentCache];\r\n\r\nexport type CacheContextual = [UpdateCacheContextual, GetCurrentCache];\r\n\r\ntype CreateCache = {\r\n (options: CacheOptions): CacheContextual;\r\n (options: CacheOptions, update: CacheUpdater): Cache;\r\n (options: CacheOptions, update?: CacheUpdater):\r\n | CacheContextual\r\n | Cache;\r\n};\r\n\r\nexport const createCache: CreateCache = (\r\n options: CacheOptions,\r\n update?: CacheUpdater\r\n): CacheContextual | Cache => {\r\n const { _initialValue, _equal, _alwaysUpdateValues } = options;\r\n let _value: Value = _initialValue;\r\n let _previous: Value | undefined;\r\n\r\n const cacheUpdateContextual: UpdateCacheContextual = (newValue, force?) => {\r\n const curr = _value;\r\n\r\n const newVal = newValue;\r\n const changed = force || (_equal ? !_equal(curr, newVal) : curr !== newVal);\r\n\r\n if (changed || _alwaysUpdateValues) {\r\n _value = newVal;\r\n _previous = curr;\r\n }\r\n\r\n return [_value, changed, _previous];\r\n };\r\n const cacheUpdateIsolated: UpdateCache = (force?) =>\r\n cacheUpdateContextual(update!(_value, _previous), force);\r\n\r\n const getCurrentCache: GetCurrentCache = (force?: boolean) => [\r\n _value,\r\n !!force, // changed\r\n _previous,\r\n ];\r\n\r\n return [update ? cacheUpdateIsolated : cacheUpdateContextual, getCurrentCache] as\r\n | CacheContextual\r\n | Cache;\r\n};\r\n","import { PlainObject } from 'typings';\r\n\r\nconst ElementNodeType = Node.ELEMENT_NODE;\r\nconst { toString, hasOwnProperty } = Object.prototype;\r\n\r\nexport const isUndefined = (obj: any): obj is undefined => obj === undefined;\r\n\r\nexport const isNull = (obj: any): obj is null => obj === null;\r\n\r\nexport const type = (obj: any): string =>\r\n isUndefined(obj) || isNull(obj)\r\n ? `${obj}`\r\n : toString\r\n .call(obj)\r\n .replace(/^\\[object (.+)\\]$/, '$1')\r\n .toLowerCase();\r\n\r\nexport const isNumber = (obj: any): obj is number => typeof obj === 'number';\r\n\r\nexport const isString = (obj: any): obj is string => typeof obj === 'string';\r\n\r\nexport const isBoolean = (obj: any): obj is boolean => typeof obj === 'boolean';\r\n\r\nexport const isFunction = (obj: any): obj is (...args: any[]) => any => typeof obj === 'function';\r\n\r\nexport const isArray = (obj: any): obj is Array => Array.isArray(obj);\r\n\r\nexport const isObject = (obj: any): boolean =>\r\n typeof obj === 'object' && !isArray(obj) && !isNull(obj);\r\n\r\n/**\r\n * Returns true if the given object is array like, false otherwise.\r\n * @param obj The Object\r\n */\r\nexport const isArrayLike = (obj: any): obj is ArrayLike => {\r\n const length = !!obj && obj.length;\r\n const lengthCorrectFormat = isNumber(length) && length > -1 && length % 1 == 0; // eslint-disable-line eqeqeq\r\n\r\n return isArray(obj) || (!isFunction(obj) && lengthCorrectFormat)\r\n ? length > 0 && isObject(obj)\r\n ? length - 1 in obj\r\n : true\r\n : false;\r\n};\r\n\r\n/**\r\n * Returns true if the given object is a \"plain\" (e.g. { key: value }) object, false otherwise.\r\n * @param obj The Object.\r\n */\r\nexport const isPlainObject = (obj: any): obj is PlainObject => {\r\n if (!obj || !isObject(obj) || type(obj) !== 'object') return false;\r\n\r\n let key;\r\n const cstr = 'constructor';\r\n const ctor = obj[cstr];\r\n const ctorProto = ctor && ctor.prototype;\r\n const hasOwnConstructor = hasOwnProperty.call(obj, cstr);\r\n const hasIsPrototypeOf = ctorProto && hasOwnProperty.call(ctorProto, 'isPrototypeOf');\r\n\r\n if (ctor && !hasOwnConstructor && !hasIsPrototypeOf) {\r\n return false;\r\n }\r\n\r\n /* eslint-disable no-restricted-syntax */\r\n for (key in obj) {\r\n /**/\r\n }\r\n /* eslint-enable */\r\n\r\n return isUndefined(key) || hasOwnProperty.call(obj, key);\r\n};\r\n\r\n/**\r\n * Checks whether the given object is a HTMLElement.\r\n * @param obj The object which shall be checked.\r\n */\r\nexport const isHTMLElement = (obj: any): obj is HTMLElement => {\r\n const instanceofObj = window.HTMLElement;\r\n return obj\r\n ? instanceofObj\r\n ? obj instanceof instanceofObj\r\n : obj.nodeType === ElementNodeType\r\n : false;\r\n};\r\n\r\n/**\r\n * Checks whether the given object is a Element.\r\n * @param obj The object which shall be checked.\r\n */\r\nexport const isElement = (obj: any): obj is Element => {\r\n const instanceofObj = window.Element;\r\n return obj\r\n ? instanceofObj\r\n ? obj instanceof instanceofObj\r\n : obj.nodeType === ElementNodeType\r\n : false;\r\n};\r\n","import { isArray, isFunction, isPlainObject, isNull } from 'support/utils/types';\r\nimport { each } from 'support/utils/array';\r\n\r\n/**\r\n * Determines whether the passed object has a property with the passed name.\r\n * @param obj The object.\r\n * @param prop The name of the property.\r\n */\r\nexport const hasOwnProperty = (obj: any, prop: string | number | symbol): boolean =>\r\n Object.prototype.hasOwnProperty.call(obj, prop);\r\n\r\n/**\r\n * Returns the names of the enumerable string properties and methods of an object.\r\n * @param obj The object of which the properties shall be returned.\r\n */\r\nexport const keys = (obj: any): Array => (obj ? Object.keys(obj) : []);\r\n\r\ntype AssignDeep = {\r\n (target: T, object1: U): T & U;\r\n (target: T, object1: U, object2: V): T & U & V;\r\n (target: T, object1: U, object2: V, object3: W): T & U & V & W;\r\n (target: T, object1: U, object2: V, object3: W, object4: X): T & U & V & W & X;\r\n (target: T, object1: U, object2: V, object3: W, object4: X, object5: Y): T &\r\n U &\r\n V &\r\n W &\r\n X &\r\n Y;\r\n (\r\n target: T,\r\n object1?: U,\r\n object2?: V,\r\n object3?: W,\r\n object4?: X,\r\n object5?: Y,\r\n object6?: Z\r\n ): T & U & V & W & X & Y & Z;\r\n};\r\n\r\n// https://github.com/jquery/jquery/blob/master/src/core.js#L116\r\nexport const assignDeep: AssignDeep = (\r\n target: T,\r\n object1?: U,\r\n object2?: V,\r\n object3?: W,\r\n object4?: X,\r\n object5?: Y,\r\n object6?: Z\r\n): T & U & V & W & X & Y & Z => {\r\n const sources: Array = [object1, object2, object3, object4, object5, object6];\r\n\r\n // Handle case when target is a string or something (possible in deep copy)\r\n if ((typeof target !== 'object' || isNull(target)) && !isFunction(target)) {\r\n target = {} as T;\r\n }\r\n\r\n each(sources, (source) => {\r\n // Extend the base object\r\n each(keys(source), (key) => {\r\n const copy: any = source[key];\r\n\r\n // Prevent Object.prototype pollution\r\n // Prevent never-ending loop\r\n if (target === copy) {\r\n return true;\r\n }\r\n\r\n const copyIsArray = isArray(copy);\r\n\r\n // Recurse if we're merging plain objects or arrays\r\n if (copy && (isPlainObject(copy) || copyIsArray)) {\r\n const src = target[key];\r\n let clone: any = src;\r\n\r\n // Ensure proper type for the source value\r\n if (copyIsArray && !isArray(src)) {\r\n clone = [];\r\n } else if (!copyIsArray && !isPlainObject(src)) {\r\n clone = {};\r\n }\r\n\r\n // Never move original objects, clone them\r\n target[key] = assignDeep(clone, copy) as any;\r\n } else {\r\n target[key] = copy;\r\n }\r\n });\r\n });\r\n\r\n // Return the modified object\r\n return target as any;\r\n};\r\n\r\n/**\r\n * Returns true if the given object is empty, false otherwise.\r\n * @param obj The Object.\r\n */\r\nexport const isEmptyObject = (obj: any): boolean => {\r\n /* eslint-disable no-restricted-syntax, guard-for-in */\r\n for (const name in obj) return false;\r\n return true;\r\n /* eslint-enable */\r\n};\r\n","import { from } from 'support/utils/array';\r\nimport { isUndefined } from 'support/utils/types';\r\n\r\ntype GetSetPropName = 'scrollLeft' | 'scrollTop' | 'value';\r\n\r\ntype Attr = {\r\n (elm: HTMLElement | false | null | undefined, attrName: string): string | null;\r\n (elm: HTMLElement | false | null | undefined, attrName: string, value: string): void;\r\n (elm: HTMLElement | false | null | undefined, attrName: string, value?: string):\r\n | string\r\n | null\r\n | void;\r\n};\r\n\r\ntype GetSetProp = {\r\n (elm: HTMLElement | false | null | undefined): T;\r\n (elm: HTMLElement | false | null | undefined, value: T): void;\r\n (elm: HTMLElement | false | null | undefined, value?: T): number | void;\r\n};\r\n\r\nconst getSetProp = (\r\n topLeft: GetSetPropName,\r\n fallback: number | string,\r\n elm: HTMLElement | HTMLInputElement | false | null | undefined,\r\n value?: number | string\r\n): number | string | void => {\r\n if (isUndefined(value)) {\r\n return elm ? elm[topLeft] : fallback;\r\n }\r\n elm && (elm[topLeft] = value);\r\n};\r\n\r\n/**\r\n * Gets or sets a attribute with the given attribute of the given element depending whether the value attribute is given.\r\n * Returns null if the element has no attribute with the given name.\r\n * @param elm The element of which the attribute shall be get or set.\r\n * @param attrName The attribute name which shall be get or set.\r\n * @param value The value of the attribute which shall be set.\r\n */\r\nexport const attr = ((\r\n elm: HTMLElement | false | null | undefined,\r\n attrName: string,\r\n value?: string\r\n): string | null | void => {\r\n if (isUndefined(value)) {\r\n return elm ? elm.getAttribute(attrName) : null;\r\n }\r\n elm && elm.setAttribute(attrName, value);\r\n}) as Attr;\r\n\r\n/**\r\n * Treats the given attribute like the \"class\" attribute and adds or removes the given value from it.\r\n * @param elm The element.\r\n * @param attrName The attributeName to which the value shall be added or removed.\r\n * @param value The value which shall be added or removed.\r\n * @param add True if the value shall be added, false otherwise.\r\n */\r\nexport const attrClass = (\r\n elm: HTMLElement | false | null | undefined,\r\n attrName: string,\r\n value: string,\r\n add?: boolean\r\n) => {\r\n const currValues = attr(elm, attrName) || '';\r\n const currValuesSet = new Set(currValues.split(' '));\r\n currValuesSet[add ? 'add' : 'delete'](value);\r\n\r\n attr(elm, attrName, from(currValuesSet).join(' ').trim());\r\n};\r\n\r\n/**\r\n * Treats the given attribute like the \"class\" attribute and checks if the given value is in it.\r\n * @param elm The element.\r\n * @param attrName The attributeName from which the content shall be checked.\r\n * @param value The value.\r\n * @returns True if the given attribute has the value in it, false otherwise.\r\n */\r\nexport const hasAttrClass = (\r\n elm: HTMLElement | false | null | undefined,\r\n attrName: string,\r\n value: string\r\n) => {\r\n const currValues = attr(elm, attrName) || '';\r\n const currValuesSet = new Set(currValues.split(' '));\r\n return currValuesSet.has(value);\r\n};\r\n\r\n/**\r\n * Removes the given attribute from the given element.\r\n * @param elm The element of which the attribute shall be removed.\r\n * @param attrName The attribute name.\r\n */\r\nexport const removeAttr = (elm: Element | false | null | undefined, attrName: string): void => {\r\n elm && elm.removeAttribute(attrName);\r\n};\r\n\r\n/**\r\n * Gets or sets the scrollLeft value of the given element depending whether the value attribute is given.\r\n * @param elm The element of which the scrollLeft value shall be get or set.\r\n * @param value The scrollLeft value which shall be set.\r\n */\r\nexport const scrollLeft = ((\r\n elm: HTMLElement | false | null | undefined,\r\n value?: number\r\n): number | void => getSetProp('scrollLeft', 0, elm, value) as number) as GetSetProp;\r\n\r\n/**\r\n * Gets or sets the scrollTop value of the given element depending whether the value attribute is given.\r\n * @param elm The element of which the scrollTop value shall be get or set.\r\n * @param value The scrollTop value which shall be set.\r\n */\r\nexport const scrollTop = ((\r\n elm: HTMLElement | false | null | undefined,\r\n value?: number\r\n): number | void => getSetProp('scrollTop', 0, elm, value) as number) as GetSetProp;\r\n\r\n/**\r\n * Gets or sets the value of the given input element depending whether the value attribute is given.\r\n * @param elm The input element of which the value shall be get or set.\r\n * @param value The value which shall be set.\r\n */\r\nexport const val = ((\r\n elm: HTMLInputElement | false | null | undefined,\r\n value?: string\r\n): string | void => getSetProp('value', '', elm, value) as string) as GetSetProp;\r\n","import { isElement } from 'support/utils/types';\r\nimport { push, from } from 'support/utils/array';\r\n\r\ntype InputElementType = Element | Node | false | null | undefined;\r\ntype OutputElementType = Element | null;\r\n\r\nconst elmPrototype = Element.prototype;\r\n\r\n/**\r\n * Find all elements with the passed selector, outgoing (and including) the passed element or the document if no element was provided.\r\n * @param selector The selector which has to be searched by.\r\n * @param elm The element from which the search shall be outgoing.\r\n */\r\nconst find = (selector: string, elm?: InputElementType): Element[] => {\r\n const arr: Array = [];\r\n const rootElm = elm ? (isElement(elm) ? elm : null) : document;\r\n\r\n return rootElm ? push(arr, rootElm.querySelectorAll(selector)) : arr;\r\n};\r\n\r\n/**\r\n * Find the first element with the passed selector, outgoing (and including) the passed element or the document if no element was provided.\r\n * @param selector The selector which has to be searched by.\r\n * @param elm The element from which the search shall be outgoing.\r\n */\r\nconst findFirst = (selector: string, elm?: InputElementType): OutputElementType => {\r\n const rootElm = elm ? (isElement(elm) ? elm : null) : document;\r\n\r\n return rootElm ? rootElm.querySelector(selector) : null;\r\n};\r\n\r\n/**\r\n * Determines whether the passed element is matching with the passed selector.\r\n * @param elm The element which has to be compared with the passed selector.\r\n * @param selector The selector which has to be compared with the passed element. Additional selectors: ':visible' and ':hidden'.\r\n */\r\nconst is = (elm: InputElementType, selector: string): boolean => {\r\n if (isElement(elm)) {\r\n /* istanbul ignore next */\r\n // eslint-disable-next-line\r\n // @ts-ignore\r\n const fn: (...args: any) => boolean = elmPrototype.matches || elmPrototype.msMatchesSelector;\r\n return fn.call(elm, selector);\r\n }\r\n return false;\r\n};\r\n\r\n/**\r\n * Returns the children (no text-nodes or comments) of the passed element which are matching the passed selector. An empty array is returned if the passed element is null.\r\n * @param elm The element of which the children shall be returned.\r\n * @param selector The selector which must match with the children elements.\r\n */\r\nconst children = (elm: InputElementType, selector?: string): ReadonlyArray => {\r\n const childs: Array = [];\r\n\r\n return isElement(elm)\r\n ? push(\r\n childs,\r\n from(elm.children).filter((child) => (selector ? is(child, selector) : child))\r\n )\r\n : childs;\r\n};\r\n\r\n/**\r\n * Returns the childNodes (incl. text-nodes or comments etc.) of the passed element. An empty array is returned if the passed element is null.\r\n * @param elm The element of which the childNodes shall be returned.\r\n */\r\nconst contents = (elm: InputElementType): ReadonlyArray =>\r\n elm ? from(elm.childNodes) : [];\r\n\r\n/**\r\n * Returns the parent element of the passed element, or null if the passed element is null.\r\n * @param elm The element of which the parent element shall be returned.\r\n */\r\nconst parent = (elm: InputElementType): OutputElementType => (elm ? elm.parentElement : null);\r\n\r\nconst closest = (elm: InputElementType, selector: string): OutputElementType => {\r\n if (isElement(elm)) {\r\n const closestFn = elmPrototype.closest;\r\n if (closestFn) {\r\n return closestFn.call(elm, selector);\r\n }\r\n\r\n do {\r\n if (is(elm, selector)) {\r\n return elm as Element;\r\n }\r\n elm = parent(elm);\r\n } while (elm);\r\n }\r\n\r\n return null;\r\n};\r\n\r\n/**\r\n * Determines whether the given element lies between two selectors in the DOM.\r\n * @param elm The element.\r\n * @param highBoundarySelector The high boundary selector.\r\n * @param deepBoundarySelector The deep boundary selector.\r\n */\r\nconst liesBetween = (\r\n elm: InputElementType,\r\n highBoundarySelector: string,\r\n deepBoundarySelector: string\r\n): boolean => {\r\n const closestHighBoundaryElm = elm && closest(elm, highBoundarySelector);\r\n const closestDeepBoundaryElm = elm && findFirst(deepBoundarySelector, closestHighBoundaryElm);\r\n\r\n return closestHighBoundaryElm && closestDeepBoundaryElm\r\n ? closestHighBoundaryElm === elm ||\r\n closestDeepBoundaryElm === elm ||\r\n closest(closest(elm, deepBoundarySelector), highBoundarySelector) !== closestHighBoundaryElm\r\n : false;\r\n};\r\n\r\nexport { find, findFirst, is, children, contents, parent, liesBetween };\r\n","import { isArrayLike } from 'support/utils/types';\r\nimport { each, from } from 'support/utils/array';\r\nimport { parent } from 'support/dom/traversal';\r\n\r\ntype NodeCollection = ArrayLike | Node | false | null | undefined;\r\n\r\n/**\r\n * Inserts Nodes before the given preferredAnchor element.\r\n * @param parentElm The parent of the preferredAnchor element or the element which shall be the parent of the inserted Nodes.\r\n * @param preferredAnchor The element before which the Nodes shall be inserted or null if the elements shall be appended at the end.\r\n * @param insertedElms The Nodes which shall be inserted.\r\n */\r\nconst before = (\r\n parentElm: Node | false | null | undefined,\r\n preferredAnchor: Node | false | null | undefined,\r\n insertedElms: NodeCollection\r\n): void => {\r\n if (insertedElms) {\r\n let anchor: Node | false | null | undefined = preferredAnchor;\r\n let fragment: DocumentFragment | Node | null | undefined;\r\n\r\n // parent must be defined\r\n if (parentElm) {\r\n if (isArrayLike(insertedElms)) {\r\n fragment = document.createDocumentFragment();\r\n\r\n // append all insertedElms to the fragment and if one of these is the anchor, change the anchor\r\n each(insertedElms, (insertedElm) => {\r\n if (insertedElm === anchor) {\r\n anchor = insertedElm.previousSibling;\r\n }\r\n fragment!.appendChild(insertedElm);\r\n });\r\n } else {\r\n fragment = insertedElms;\r\n }\r\n\r\n // if the preferred anchor isn't null set it to a valid anchor\r\n if (preferredAnchor) {\r\n if (!anchor) {\r\n anchor = parentElm.firstChild;\r\n } else if (anchor !== preferredAnchor) {\r\n anchor = anchor.nextSibling;\r\n }\r\n }\r\n\r\n parentElm.insertBefore(fragment, anchor || null);\r\n }\r\n }\r\n};\r\n\r\n/**\r\n * Appends the given children at the end of the given Node.\r\n * @param node The Node to which the children shall be appended.\r\n * @param children The Nodes which shall be appended.\r\n */\r\nexport const appendChildren = (\r\n node: Node | false | null | undefined,\r\n children: NodeCollection\r\n): void => {\r\n before(node, null, children);\r\n};\r\n\r\n/**\r\n * Prepends the given children at the start of the given Node.\r\n * @param node The Node to which the children shall be prepended.\r\n * @param children The Nodes which shall be prepended.\r\n */\r\nexport const prependChildren = (\r\n node: Node | false | null | undefined,\r\n children: NodeCollection\r\n): void => {\r\n before(node, node && node.firstChild, children);\r\n};\r\n\r\n/**\r\n * Inserts the given Nodes before the given Node.\r\n * @param node The Node before which the given Nodes shall be inserted.\r\n * @param insertedNodes The Nodes which shall be inserted.\r\n */\r\nexport const insertBefore = (\r\n node: Node | false | null | undefined,\r\n insertedNodes: NodeCollection\r\n): void => {\r\n before(parent(node), node, insertedNodes);\r\n};\r\n\r\n/**\r\n * Inserts the given Nodes after the given Node.\r\n * @param node The Node after which the given Nodes shall be inserted.\r\n * @param insertedNodes The Nodes which shall be inserted.\r\n */\r\nexport const insertAfter = (\r\n node: Node | false | null | undefined,\r\n insertedNodes: NodeCollection\r\n): void => {\r\n before(parent(node), node && node.nextSibling, insertedNodes);\r\n};\r\n\r\n/**\r\n * Removes the given Nodes from their parent.\r\n * @param nodes The Nodes which shall be removed.\r\n */\r\nexport const removeElements = (nodes: NodeCollection): void => {\r\n if (isArrayLike(nodes)) {\r\n each(from(nodes), (e) => removeElements(e));\r\n } else if (nodes) {\r\n const parentElm = parent(nodes);\r\n if (parentElm) {\r\n parentElm.removeChild(nodes);\r\n }\r\n }\r\n};\r\n","import { each } from 'support/utils/array';\r\nimport { attr } from 'support/dom/attribute';\r\nimport { contents } from 'support/dom/traversal';\r\nimport { removeElements } from 'support/dom/manipulation';\r\n\r\n/**\r\n * Creates a div DOM node.\r\n */\r\nexport const createDiv = (classNames?: string): HTMLDivElement => {\r\n const div = document.createElement('div');\r\n if (classNames) {\r\n attr(div, 'class', classNames);\r\n }\r\n return div;\r\n};\r\n\r\n/**\r\n * Creates DOM nodes modeled after the passed html string and returns the root dom nodes as a array.\r\n * @param html The html string after which the DOM nodes shall be created.\r\n */\r\nexport const createDOM = (html: string): ReadonlyArray => {\r\n const createdDiv = createDiv();\r\n createdDiv.innerHTML = html.trim();\r\n\r\n return each(contents(createdDiv), (elm) => removeElements(elm));\r\n};\r\n","import { each } from 'support/utils/array';\r\nimport { hasOwnProperty } from 'support/utils/object';\r\nimport { createDiv } from 'support/dom/create';\r\n\r\nconst firstLetterToUpper = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1);\r\nconst getDummyStyle = (): CSSStyleDeclaration => createDiv().style;\r\n\r\n// https://developer.mozilla.org/en-US/docs/Glossary/Vendor_Prefix\r\n\r\nexport const cssPrefixes: ReadonlyArray = ['-webkit-', '-moz-', '-o-', '-ms-'];\r\nexport const jsPrefixes: ReadonlyArray = [\r\n 'WebKit',\r\n 'Moz',\r\n 'O',\r\n 'MS',\r\n 'webkit',\r\n 'moz',\r\n 'o',\r\n 'ms',\r\n];\r\n\r\nexport const jsCache: { [key: string]: any } = {};\r\nexport const cssCache: { [key: string]: string } = {};\r\n\r\n/**\r\n * Gets the name of the given CSS property with vendor prefix if it isn't supported without it, or and empty string if unsupported.\r\n * @param name The name of the CSS property which shall be get.\r\n */\r\nexport const cssProperty = (name: string): string => {\r\n let result: string | undefined = cssCache[name];\r\n\r\n if (hasOwnProperty(cssCache, name)) {\r\n return result;\r\n }\r\n\r\n const uppercasedName: string = firstLetterToUpper(name);\r\n const elmStyle: CSSStyleDeclaration = getDummyStyle();\r\n\r\n each(cssPrefixes, (prefix: string) => {\r\n const prefixWithoutDashes: string = prefix.replace(/-/g, '');\r\n const resultPossibilities: Array = [\r\n name, // transition\r\n prefix + name, // -webkit-transition\r\n prefixWithoutDashes + uppercasedName, // webkitTransition\r\n firstLetterToUpper(prefixWithoutDashes) + uppercasedName, // WebkitTransition\r\n ];\r\n\r\n // eslint-disable-next-line no-return-assign\r\n return !(result = resultPossibilities.find(\r\n (resultPossibility: string) => elmStyle[resultPossibility] !== undefined\r\n ));\r\n });\r\n\r\n // eslint-disable-next-line no-return-assign\r\n return (cssCache[name] = result || '');\r\n};\r\n\r\n/**\r\n * Get the name of the given CSS property value(s), with vendor prefix if it isn't supported without it, or an empty string if no value is supported.\r\n * @param property The CSS property to which the CSS property value(s) belong.\r\n * @param values The value(s) separated by spaces which shall be get.\r\n * @param suffix A suffix which is added to each value in case the value is a function or something else more advanced.\r\n */\r\nexport const cssPropertyValue = (property: string, values: string, suffix?: string): string => {\r\n const name = `${property} ${values}`;\r\n let result: string | undefined = cssCache[name];\r\n\r\n if (hasOwnProperty(cssCache, name)) {\r\n return result;\r\n }\r\n\r\n const dummyStyle: CSSStyleDeclaration = getDummyStyle();\r\n const possbleValues: Array = values.split(' ');\r\n const preparedSuffix: string = suffix || '';\r\n const cssPrefixesWithFirstEmpty = [''].concat(cssPrefixes);\r\n\r\n each(possbleValues, (possibleValue: string) => {\r\n each(cssPrefixesWithFirstEmpty, (prefix: string) => {\r\n const prop = prefix + possibleValue;\r\n dummyStyle.cssText = `${property}:${prop}${preparedSuffix}`;\r\n if (dummyStyle.length) {\r\n result = prop;\r\n return false;\r\n }\r\n });\r\n return !result;\r\n });\r\n\r\n // eslint-disable-next-line no-return-assign\r\n return (cssCache[name] = result || '');\r\n};\r\n\r\n/**\r\n * Get the requested JS function, object or constructor with vendor prefix if it isn't supported without or undefined if unsupported.\r\n * @param name The name of the JS function, object or constructor.\r\n */\r\nexport const jsAPI = (name: string): T | undefined => {\r\n let result: any = jsCache[name] || window[name];\r\n\r\n if (hasOwnProperty(jsCache, name)) {\r\n return result;\r\n }\r\n\r\n each(jsPrefixes, (prefix: string) => {\r\n result = result || window[prefix + firstLetterToUpper(name)];\r\n return !result;\r\n });\r\n\r\n jsCache[name] = result;\r\n return result;\r\n};\r\n","import { jsAPI } from 'support/compatibility/vendors';\r\n\r\nexport const MutationObserverConstructor = jsAPI('MutationObserver');\r\nexport const IntersectionObserverConstructor = jsAPI(\r\n 'IntersectionObserver'\r\n);\r\nexport const ResizeObserverConstructor = jsAPI('ResizeObserver');\r\nexport const cAF = jsAPI('cancelAnimationFrame');\r\nexport const rAF = jsAPI('requestAnimationFrame');\r\n","import { isString } from 'support/utils/types';\r\nimport { each } from 'support/utils/array';\r\nimport { keys } from 'support/utils/object';\r\n\r\nconst rnothtmlwhite = /[^\\x20\\t\\r\\n\\f]+/g;\r\nconst classListAction = (\r\n elm: Element | false | null | undefined,\r\n className: string | false | null | undefined,\r\n action: (elmClassList: DOMTokenList, clazz: string) => boolean | void\r\n): boolean => {\r\n let clazz: string;\r\n let i = 0;\r\n let result = false;\r\n\r\n if (elm && className && isString(className)) {\r\n const classes: Array = className.match(rnothtmlwhite) || [];\r\n result = classes.length > 0;\r\n while ((clazz = classes[i++])) {\r\n result = !!action(elm.classList, clazz) && result;\r\n }\r\n }\r\n return result;\r\n};\r\n\r\n/**\r\n * Check whether the given element has the given class name(s).\r\n * @param elm The element.\r\n * @param className The class name(s).\r\n */\r\nexport const hasClass = (\r\n elm: Element | false | null | undefined,\r\n className: string | false | null | undefined\r\n): boolean => classListAction(elm, className, (classList, clazz) => classList.contains(clazz));\r\n\r\n/**\r\n * Removes the given class name(s) from the given element.\r\n * @param elm The element.\r\n * @param className The class name(s) which shall be removed. (separated by spaces)\r\n */\r\nexport const removeClass = (\r\n elm: Element | false | null | undefined,\r\n className: string | false | null | undefined\r\n): void => {\r\n classListAction(elm, className, (classList, clazz) => classList.remove(clazz));\r\n};\r\n\r\n/**\r\n * Adds the given class name(s) to the given element.\r\n * @param elm The element.\r\n * @param className The class name(s) which shall be added. (separated by spaces)\r\n * @returns A function which removes the added class name(s).\r\n */\r\nexport const addClass = (\r\n elm: Element | false | null | undefined,\r\n className: string | false | null | undefined\r\n): (() => void) => {\r\n classListAction(elm, className, (classList, clazz) => classList.add(clazz));\r\n return removeClass.bind(0, elm, className);\r\n};\r\n\r\n/**\r\n * Takes two className strings, compares them and returns the difference as array.\r\n * @param classNameA ClassName A.\r\n * @param classNameB ClassName B.\r\n */\r\nexport const diffClass = (\r\n classNameA: string | null | undefined,\r\n classNameB: string | null | undefined\r\n) => {\r\n const classNameASplit = classNameA && classNameA.split(' ');\r\n const classNameBSplit = classNameB && classNameB.split(' ');\r\n const tempObj = {};\r\n\r\n each(classNameASplit, (className) => {\r\n tempObj[className] = 1;\r\n });\r\n each(classNameBSplit, (className) => {\r\n if (tempObj[className]) {\r\n delete tempObj[className];\r\n } else {\r\n tempObj[className] = 1;\r\n }\r\n });\r\n\r\n return keys(tempObj);\r\n};\r\n","import { each } from 'support/utils/array';\r\nimport { WH, XY, TRBL } from 'support/dom';\r\nimport { PlainObject } from 'typings';\r\n\r\n/**\r\n * Compares two objects and returns true if all values of the passed prop names are identical, false otherwise or if one of the two object is falsy.\r\n * @param a Object a.\r\n * @param b Object b.\r\n * @param props The props which shall be compared.\r\n */\r\nexport const equal = (\r\n a: T | undefined,\r\n b: T | undefined,\r\n props: Array,\r\n propMutation?: ((value: any) => any) | null | false\r\n): boolean => {\r\n if (a && b) {\r\n let result = true;\r\n each(props, (prop) => {\r\n const compareA = propMutation ? propMutation(a[prop]) : a[prop];\r\n const compareB = propMutation ? propMutation(b[prop]) : b[prop];\r\n if (compareA !== compareB) {\r\n result = false;\r\n }\r\n });\r\n return result;\r\n }\r\n return false;\r\n};\r\n\r\n/**\r\n * Compares object a with object b and returns true if both have the same property values, false otherwise.\r\n * Also returns false if one of the objects is undefined or null.\r\n * @param a Object a.\r\n * @param b Object b.\r\n */\r\nexport const equalWH = (a?: WH, b?: WH) => equal>(a, b, ['w', 'h']);\r\n\r\n/**\r\n * Compares object a with object b and returns true if both have the same property values, false otherwise.\r\n * Also returns false if one of the objects is undefined or null.\r\n * @param a Object a.\r\n * @param b Object b.\r\n */\r\nexport const equalXY = (a?: XY, b?: XY) => equal>(a, b, ['x', 'y']);\r\n\r\n/**\r\n * Compares object a with object b and returns true if both have the same property values, false otherwise.\r\n * Also returns false if one of the objects is undefined or null.\r\n * @param a Object a.\r\n * @param b Object b.\r\n */\r\nexport const equalTRBL = (a?: TRBL, b?: TRBL) => equal(a, b, ['t', 'r', 'b', 'l']);\r\n\r\n/**\r\n * Compares two DOM Rects for their equality of their width and height properties\r\n * Also returns false if one of the DOM Rects is undefined or null.\r\n * @param a DOM Rect a.\r\n * @param b DOM Rect b.\r\n * @param round Whether the values should be rounded.\r\n */\r\nexport const equalBCRWH = (a?: DOMRect, b?: DOMRect, round?: boolean) =>\r\n equal(a, b, ['width', 'height'], round && ((value) => Math.round(value)));\r\n","import { isNumber, isFunction } from 'support/utils/types';\r\nimport { from } from 'support/utils/array';\r\nimport { rAF, cAF } from 'support/compatibility/apis';\r\n\r\nconst clearTimeouts = (id: number | undefined) => {\r\n id && window.clearTimeout(id);\r\n id && cAF!(id);\r\n};\r\n\r\ntype DebounceTiming = number | false | null | undefined;\r\n\r\nexport interface DebounceOptions any> {\r\n /**\r\n * The timeout for debouncing. If null, no debounce is applied.\r\n */\r\n _timeout?: DebounceTiming | (() => DebounceTiming);\r\n /**\r\n * A maximum amount of ms. before the function will be called even with debounce.\r\n */\r\n _maxDelay?: DebounceTiming | (() => DebounceTiming);\r\n /**\r\n * Function which merges parameters for each canceled debounce.\r\n * If parameters can't be merged the function will return null, otherwise it returns the merged parameters.\r\n */\r\n _mergeParams?: (\r\n prev: Parameters,\r\n curr: Parameters\r\n ) => Parameters | false | null | undefined;\r\n}\r\n\r\nexport interface Debounced any> {\r\n (...args: Parameters): ReturnType;\r\n _flush(): void;\r\n}\r\n\r\nexport const noop = () => {}; // eslint-disable-line\r\n\r\n/**\r\n * Debounces the given function either with a timeout or a animation frame.\r\n * @param functionToDebounce The function which shall be debounced.\r\n * @param options Options for debouncing.\r\n */\r\nexport const debounce = any>(\r\n functionToDebounce: FunctionToDebounce,\r\n options?: DebounceOptions\r\n): Debounced => {\r\n let timeoutId: number | undefined;\r\n let maxTimeoutId: number | undefined;\r\n let prevArguments: Parameters | null | undefined;\r\n let latestArguments: Parameters | null | undefined;\r\n const { _timeout, _maxDelay, _mergeParams } = options || {};\r\n const setT = window.setTimeout;\r\n\r\n const invokeFunctionToDebounce = function (args: IArguments) {\r\n clearTimeouts(timeoutId);\r\n clearTimeouts(maxTimeoutId);\r\n maxTimeoutId = timeoutId = prevArguments = undefined;\r\n // eslint-disable-next-line\r\n // @ts-ignore\r\n functionToDebounce.apply(this, args);\r\n };\r\n\r\n const mergeParms = (\r\n curr: Parameters\r\n ): Parameters | false | null | undefined =>\r\n _mergeParams && prevArguments ? _mergeParams(prevArguments, curr) : curr;\r\n\r\n const flush = () => {\r\n /* istanbul ignore next */\r\n if (timeoutId) {\r\n invokeFunctionToDebounce(mergeParms(latestArguments!) || latestArguments!);\r\n }\r\n };\r\n\r\n const debouncedFn = function () {\r\n // eslint-disable-next-line prefer-rest-params\r\n const args: Parameters = from(arguments) as Parameters;\r\n const finalTimeout = isFunction(_timeout) ? _timeout() : _timeout;\r\n const hasTimeout = isNumber(finalTimeout) && finalTimeout >= 0;\r\n\r\n if (hasTimeout) {\r\n const finalMaxWait = isFunction(_maxDelay) ? _maxDelay() : _maxDelay;\r\n const hasMaxWait = isNumber(finalMaxWait) && finalMaxWait >= 0;\r\n const setTimeoutFn = finalTimeout > 0 ? setT : rAF!;\r\n const mergeParamsResult = mergeParms(args);\r\n const invokedArgs = mergeParamsResult || args;\r\n const boundInvoke = invokeFunctionToDebounce.bind(0, invokedArgs);\r\n\r\n // if (!mergeParamsResult) {\r\n // invokeFunctionToDebounce(prevArguments || args);\r\n // }\r\n\r\n clearTimeouts(timeoutId);\r\n // @ts-ignore\r\n timeoutId = setTimeoutFn(boundInvoke, finalTimeout as number) as number;\r\n\r\n if (hasMaxWait && !maxTimeoutId) {\r\n maxTimeoutId = setT(flush, finalMaxWait as number);\r\n }\r\n\r\n prevArguments = latestArguments = invokedArgs;\r\n } else {\r\n invokeFunctionToDebounce(args);\r\n }\r\n };\r\n debouncedFn._flush = flush;\r\n\r\n return debouncedFn as Debounced;\r\n};\r\n","import { style } from 'support/dom/style';\r\n\r\nexport interface WH {\r\n w: T;\r\n h: T;\r\n}\r\n\r\nconst elementHasDimensions = (elm: HTMLElement): boolean =>\r\n !!(elm.offsetWidth || elm.offsetHeight || elm.getClientRects().length);\r\nconst zeroObj: WH = {\r\n w: 0,\r\n h: 0,\r\n};\r\n\r\n/**\r\n * Returns the window inner- width and height.\r\n */\r\nexport const windowSize = (): WH => ({\r\n w: window.innerWidth,\r\n h: window.innerHeight,\r\n});\r\n\r\n/**\r\n * Returns the scroll- width and height of the passed element. If the element is null the width and height values are 0.\r\n * @param elm The element of which the scroll- width and height shall be returned.\r\n */\r\nexport const offsetSize = (elm: HTMLElement | null | undefined): WH =>\r\n elm\r\n ? {\r\n w: elm.offsetWidth,\r\n h: elm.offsetHeight,\r\n }\r\n : zeroObj;\r\n\r\n/**\r\n * Returns the client- width and height of the passed element. If the element is null the width and height values are 0.\r\n * @param elm The element of which the client- width and height shall be returned.\r\n */\r\nexport const clientSize = (elm: HTMLElement | false | null | undefined): WH =>\r\n elm\r\n ? {\r\n w: elm.clientWidth,\r\n h: elm.clientHeight,\r\n }\r\n : zeroObj;\r\n\r\n/**\r\n * Returns the client- width and height of the passed element. If the element is null the width and height values are 0.\r\n * @param elm The element of which the client- width and height shall be returned.\r\n */\r\nexport const scrollSize = (elm: HTMLElement | false | null | undefined): WH =>\r\n elm\r\n ? {\r\n w: elm.scrollWidth,\r\n h: elm.scrollHeight,\r\n }\r\n : zeroObj;\r\n\r\n/**\r\n * Returns the fractional- width and height of the passed element. If the element is null the width and height values are 0.\r\n * @param elm The element of which the fractional- width and height shall be returned.\r\n */\r\nexport const fractionalSize = (elm: HTMLElement | false | null | undefined): WH => {\r\n const cssHeight = parseFloat(style(elm, 'height')) || 0;\r\n const cssWidth = parseFloat(style(elm, 'height')) || 0;\r\n return {\r\n w: cssWidth - Math.round(cssWidth),\r\n h: cssHeight - Math.round(cssHeight),\r\n };\r\n};\r\n\r\n/**\r\n * Returns the BoundingClientRect of the passed element.\r\n * @param elm The element of which the BoundingClientRect shall be returned.\r\n */\r\nexport const getBoundingClientRect = (elm: HTMLElement): DOMRect => elm.getBoundingClientRect();\r\n\r\n/**\r\n * Determines whether the passed element has any dimensions.\r\n * @param elm The element.\r\n */\r\nexport const hasDimensions = (elm: HTMLElement | false | null | undefined): boolean =>\r\n elm ? elementHasDimensions(elm as HTMLElement) : false;\r\n","import { isUndefined } from 'support/utils/types';\r\nimport { each, push, runEachAndClear } from 'support/utils/array';\r\n\r\nlet passiveEventsSupport: boolean;\r\nconst supportPassiveEvents = (): boolean => {\r\n if (isUndefined(passiveEventsSupport)) {\r\n passiveEventsSupport = false;\r\n try {\r\n /* eslint-disable */\r\n // @ts-ignore\r\n window.addEventListener(\r\n 'test',\r\n null,\r\n Object.defineProperty({}, 'passive', {\r\n get() {\r\n passiveEventsSupport = true;\r\n },\r\n })\r\n );\r\n /* eslint-enable */\r\n } catch (e) {}\r\n }\r\n return passiveEventsSupport;\r\n};\r\nconst splitEventNames = (eventNames: string) => eventNames.split(' ');\r\n\r\nexport interface OnOptions {\r\n _capture?: boolean;\r\n _passive?: boolean;\r\n _once?: boolean;\r\n}\r\n\r\n/**\r\n * Removes the passed event listener for the passed events with the passed options.\r\n * @param target The element from which the listener shall be removed.\r\n * @param eventNames The eventsnames for which the listener shall be removed.\r\n * @param listener The listener which shall be removed.\r\n * @param capture The options of the removed listener.\r\n */\r\nexport const off = (\r\n target: EventTarget,\r\n eventNames: string,\r\n listener: (event: T) => any,\r\n capture?: boolean\r\n): void => {\r\n each(splitEventNames(eventNames), (eventName) => {\r\n target.removeEventListener(eventName, listener as EventListener, capture);\r\n });\r\n};\r\n\r\n/**\r\n * Adds the passed event listener for the passed eventnames with the passed options.\r\n * @param target The element to which the listener shall be added.\r\n * @param eventNames The eventsnames for which the listener shall be called.\r\n * @param listener The listener which is called on the eventnames.\r\n * @param options The options of the added listener.\r\n */\r\nexport const on = (\r\n target: EventTarget,\r\n eventNames: string,\r\n listener: (event: T) => any,\r\n options?: OnOptions\r\n): (() => void) => {\r\n const doSupportPassiveEvents = supportPassiveEvents();\r\n const passive = (doSupportPassiveEvents && options && options._passive) || false;\r\n const capture = (options && options._capture) || false;\r\n const once = (options && options._once) || false;\r\n const offListeners: (() => void)[] = [];\r\n const nativeOptions: AddEventListenerOptions | boolean = doSupportPassiveEvents\r\n ? {\r\n passive,\r\n capture,\r\n }\r\n : capture;\r\n\r\n each(splitEventNames(eventNames), (eventName) => {\r\n const finalListener = (\r\n once\r\n ? (evt: T) => {\r\n target.removeEventListener(eventName, finalListener, capture);\r\n listener && listener(evt);\r\n }\r\n : listener\r\n ) as EventListener;\r\n\r\n push(offListeners, off.bind(null, target, eventName, finalListener, capture));\r\n target.addEventListener(eventName, finalListener, nativeOptions);\r\n });\r\n\r\n return runEachAndClear.bind(0, offListeners);\r\n};\r\n\r\n/**\r\n * Shorthand for the stopPropagation event Method.\r\n * @param evt The event of which the stopPropagation method shall be called.\r\n */\r\nexport const stopPropagation = (evt: Event): void => evt.stopPropagation();\r\n\r\n/**\r\n * Shorthand for the preventDefault event Method.\r\n * @param evt The event of which the preventDefault method shall be called.\r\n */\r\nexport const preventDefault = (evt: Event): void => evt.preventDefault();\r\n\r\n/**\r\n * Shorthand for the stopPropagation and preventDefault event Method.\r\n * @param evt The event of which the stopPropagation and preventDefault methods shall be called.\r\n */\r\nexport const stopAndPrevent = (evt: Event): void =>\r\n (stopPropagation(evt) as undefined) || (preventDefault(evt) as undefined);\r\n","import { getBoundingClientRect } from 'support/dom/dimensions';\r\n\r\nexport interface XY {\r\n x: T;\r\n y: T;\r\n}\r\n\r\nconst zeroObj: XY = {\r\n x: 0,\r\n y: 0,\r\n};\r\n\r\n/**\r\n * Returns the offset- left and top coordinates of the passed element relative to the document. If the element is null the top and left values are 0.\r\n * @param elm The element of which the offset- top and left coordinates shall be returned.\r\n */\r\nexport const absoluteCoordinates = (elm: HTMLElement | null | undefined): XY => {\r\n const rect = elm ? getBoundingClientRect(elm) : 0;\r\n return rect\r\n ? {\r\n x: rect.left + window.pageYOffset,\r\n y: rect.top + window.pageXOffset,\r\n }\r\n : zeroObj;\r\n};\r\n\r\n/**\r\n * Returns the offset- left and top coordinates of the passed element. If the element is null the top and left values are 0.\r\n * @param elm The element of which the offset- top and left coordinates shall be returned.\r\n */\r\nexport const offsetCoordinates = (elm: HTMLElement | null | undefined): XY =>\r\n elm\r\n ? {\r\n x: elm.offsetLeft,\r\n y: elm.offsetTop,\r\n }\r\n : zeroObj;\r\n","import { isArray } from 'support/utils/types';\r\nimport { keys } from 'support/utils/object';\r\nimport { each, from, isEmptyArray } from 'support/utils/array';\r\n\r\nexport type EventListener<\r\n EventMap extends Record,\r\n Name extends keyof EventMap = keyof EventMap\r\n> = (...args: EventMap[Name]) => void;\r\n\r\nexport type InitialEventListeners> = {\r\n [K in keyof EventMap]?: EventListener | EventListener[];\r\n};\r\n\r\nconst manageListener = >(\r\n callback: (listener?: EventListener) => void,\r\n listener?: EventListener | EventListener[]\r\n) => {\r\n each(isArray(listener) ? listener : [listener], callback);\r\n};\r\n\r\nexport const createEventListenerHub = >(\r\n initialEventListeners?: InitialEventListeners\r\n) => {\r\n type EventListener = (\r\n ...args: EventMap[Name]\r\n ) => void;\r\n type RemoveEvent = {\r\n (name?: Name, listener?: EventListener): void;\r\n (name?: Name, listener?: EventListener[]): void;\r\n (\r\n name?: Name,\r\n listener?: EventListener | EventListener[]\r\n ): void;\r\n };\r\n type AddEvent = {\r\n (name: Name, listener: EventListener): () => void;\r\n (name: Name, listener: EventListener[]): () => void;\r\n (\r\n name: Name,\r\n listener: EventListener | EventListener[]\r\n ): () => void;\r\n };\r\n type TriggerEvent = {\r\n (name: Name, args?: EventMap[Name]): void;\r\n };\r\n\r\n const events = new Map>();\r\n\r\n const removeEvent: RemoveEvent = (\r\n name?: Name,\r\n listener?: EventListener | EventListener[]\r\n ): void => {\r\n if (name) {\r\n const eventSet = events.get(name);\r\n manageListener((currListener) => {\r\n if (eventSet) {\r\n eventSet[currListener ? 'delete' : 'clear'](currListener!);\r\n }\r\n }, listener as any);\r\n } else {\r\n events.forEach((eventSet) => {\r\n eventSet.clear();\r\n });\r\n events.clear();\r\n }\r\n };\r\n\r\n const addEvent: AddEvent = (\r\n name: Name,\r\n listener: EventListener | EventListener[]\r\n ): (() => void) => {\r\n const eventSet = events.get(name) || new Set();\r\n events.set(name, eventSet);\r\n\r\n manageListener((currListener) => {\r\n currListener && eventSet.add(currListener);\r\n }, listener as any);\r\n\r\n return removeEvent.bind(0, name as any, listener as any);\r\n };\r\n\r\n const triggerEvent: TriggerEvent = (\r\n name: Name,\r\n args?: EventMap[Name]\r\n ): void => {\r\n const eventSet = events.get(name);\r\n\r\n each(from(eventSet), (event) => {\r\n if (args && !isEmptyArray(args)) {\r\n (event as (...args: EventMap[keyof EventMap]) => void).apply(0, args as any);\r\n } else {\r\n (event as () => void)();\r\n }\r\n });\r\n };\r\n\r\n const initialListenerKeys = keys(initialEventListeners) as Extract[];\r\n each(initialListenerKeys, (key) => {\r\n addEvent(key, initialEventListeners![key] as any);\r\n });\r\n\r\n return [addEvent, removeEvent, triggerEvent] as [AddEvent, RemoveEvent, TriggerEvent];\r\n};\r\n","import { assignDeep, hasOwnProperty } from 'support';\r\nimport type { Options, ReadonlyOSOptions } from 'options';\r\nimport type { PartialOptions } from 'typings';\r\n\r\nexport type SetupElements> = [elements: T, destroy: () => void];\r\n\r\nexport type SetupUpdate = (changedOptions: PartialOptions, force?: boolean) => T;\r\n\r\nexport type SetupUpdateCheckOption = (path: string) => [value: T, changed: boolean];\r\n\r\nexport type SetupUpdateSegment> = (\r\n updateHints: Hints,\r\n checkOption: SetupUpdateCheckOption,\r\n force: boolean\r\n) => Partial | void;\r\n\r\nexport type SetupState> = [\r\n get: () => T,\r\n set: (newState: Partial) => void\r\n];\r\n\r\nexport type Setup = Record> = [\r\n update: SetupUpdate,\r\n state: (() => DynamicState) & StaticState,\r\n destroy: () => void\r\n];\r\n\r\nconst getPropByPath = (obj: any, path: string): T =>\r\n obj\r\n ? path.split('.').reduce((o, prop) => (o && hasOwnProperty(o, prop) ? o[prop] : undefined), obj)\r\n : undefined;\r\n\r\nexport const createOptionCheck =\r\n (\r\n options: ReadonlyOSOptions,\r\n changedOptions: PartialOptions,\r\n force?: boolean\r\n ): SetupUpdateCheckOption =>\r\n (path: string) =>\r\n [getPropByPath(options, path), force || getPropByPath(changedOptions, path) !== undefined];\r\n\r\nexport const createState = (initialState: S): SetupState => {\r\n let state: S = initialState;\r\n return [\r\n () => state,\r\n (newState: Partial) => {\r\n state = assignDeep({}, state, newState);\r\n },\r\n ];\r\n};\r\n","export const classNameEnvironment = 'os-environment';\r\nexport const classNameEnvironmentFlexboxGlue = `${classNameEnvironment}-flexbox-glue`;\r\nexport const classNameEnvironmentFlexboxGlueMax = `${classNameEnvironmentFlexboxGlue}-max`;\r\n\r\nexport const dataAttributeHost = 'data-overlayscrollbars';\r\nexport const dataAttributeHostOverflowX = `${dataAttributeHost}-overflow-x`;\r\nexport const dataAttributeHostOverflowY = `${dataAttributeHost}-overflow-y`;\r\nexport const dataValueHostOverflowVisible = 'overflowVisible';\r\nexport const dataValueHostViewportScrollbarStyling = 'viewportStyled';\r\nexport const classNamePadding = 'os-padding';\r\nexport const classNameViewport = 'os-viewport';\r\nexport const classNameViewportArrange = `${classNameViewport}-arrange`;\r\nexport const classNameContent = 'os-content';\r\nexport const classNameViewportScrollbarStyling = `${classNameViewport}-scrollbar-styled`;\r\nexport const classNameOverflowVisible = `os-overflow-visible`;\r\n\r\nexport const classNameSizeObserver = 'os-size-observer';\r\nexport const classNameSizeObserverAppear = `${classNameSizeObserver}-appear`;\r\nexport const classNameSizeObserverListener = `${classNameSizeObserver}-listener`;\r\nexport const classNameSizeObserverListenerScroll = `${classNameSizeObserverListener}-scroll`;\r\nexport const classNameSizeObserverListenerItem = `${classNameSizeObserverListener}-item`;\r\nexport const classNameSizeObserverListenerItemFinal = `${classNameSizeObserverListenerItem}-final`;\r\n\r\nexport const classNameTrinsicObserver = 'os-trinsic-observer';\r\n\r\nexport const classNameScrollbar = 'os-scrollbar';\r\nexport const classNameScrollbarHorizontal = `${classNameScrollbar}-horizontal`;\r\nexport const classNameScrollbarVertical = `${classNameScrollbar}-vertical`;\r\nexport const classNameScrollbarTrack = 'os-scrollbar-track';\r\nexport const classNameScrollbarHandle = 'os-scrollbar-handle';\r\n","import { assignDeep, each, isObject, keys, isArray, hasOwnProperty, isFunction } from 'support';\r\nimport { PartialOptions, ReadonlyOptions } from 'typings';\r\n\r\nconst opsStringify = (value: any) =>\r\n JSON.stringify(value, (_, val) => {\r\n if (isFunction(val)) {\r\n throw new Error();\r\n }\r\n return val;\r\n });\r\n\r\nexport type ResizeBehavior = 'none' | 'both' | 'horizontal' | 'vertical';\r\n\r\nexport type OverflowBehavior =\r\n | 'hidden'\r\n | 'scroll'\r\n | 'visible'\r\n | 'visible-hidden'\r\n | 'visible-scroll';\r\n\r\nexport type VisibilityBehavior = 'visible' | 'hidden' | 'auto';\r\n\r\nexport type AutoHideBehavior = 'never' | 'scroll' | 'leave' | 'move';\r\n\r\nexport type ScrollBehavior = 'always' | 'ifneeded' | 'never';\r\n\r\nexport type BasicEventCallback = (this: any) => void;\r\n\r\nexport type ScrollEventCallback = (this: any, args?: UIEvent) => void;\r\n\r\nexport type OverflowChangedCallback = (this: any, args?: OverflowChangedArgs) => void;\r\n\r\nexport type OverflowAmountChangedCallback = (this: any, args?: OverflowAmountChangedArgs) => void;\r\n\r\nexport type DirectionChangedCallback = (this: any, args?: DirectionChangedArgs) => void;\r\n\r\nexport type SizeChangedCallback = (this: any, args?: SizeChangedArgs) => void;\r\n\r\nexport type UpdatedCallback = (this: any, args?: UpdatedArgs) => void;\r\n\r\nexport interface Options {\r\n paddingAbsolute: boolean;\r\n updating: {\r\n elementEvents: Array<[elementSelector: string, eventNames: string]> | null;\r\n attributes: string[] | null;\r\n debounce: [timeout: number, maxWait: number] | number | null; // (if tuple: [timeout: 0, maxWait: 33], if number: [timeout: number, maxWait: false]) debounce for content Changes\r\n ignoreMutation: ((mutation: MutationRecord) => any) | null;\r\n };\r\n overflow: {\r\n x: OverflowBehavior;\r\n y: OverflowBehavior;\r\n };\r\n scrollbars: {\r\n visibility: VisibilityBehavior;\r\n autoHide: AutoHideBehavior;\r\n autoHideDelay: number;\r\n dragScroll: boolean;\r\n clickScroll: boolean;\r\n touch: boolean;\r\n };\r\n nativeScrollbarsOverlaid: {\r\n show: boolean;\r\n initialize: boolean;\r\n };\r\n}\r\n\r\nexport type ReadonlyOSOptions = ReadonlyOptions;\r\n\r\nexport interface OverflowChangedArgs {\r\n x: boolean;\r\n y: boolean;\r\n xScrollable: boolean;\r\n yScrollable: boolean;\r\n clipped: boolean;\r\n}\r\n\r\nexport interface OverflowAmountChangedArgs {\r\n x: number;\r\n y: number;\r\n}\r\n\r\nexport interface DirectionChangedArgs {\r\n isRTL: number;\r\n dir: string;\r\n}\r\n\r\nexport interface SizeChangedArgs {\r\n width: number;\r\n height: number;\r\n}\r\n\r\nexport interface UpdatedArgs {\r\n forced: boolean;\r\n}\r\n\r\nexport const defaultOptions: Options = {\r\n // resize: 'none', // none || both || horizontal || vertical || n || b || h || v\r\n paddingAbsolute: false, // true || false\r\n updating: {\r\n elementEvents: [['img', 'load']], // array of tuples || null\r\n debounce: [0, 33], // number || number array || null\r\n attributes: null, // string array || null\r\n ignoreMutation: null, // () => any || null\r\n },\r\n overflow: {\r\n x: 'scroll', // visible-hidden || visible-scroll || hidden || scroll || v-h || v-s || h || s\r\n y: 'scroll', // visible-hidden || visible-scroll || hidden || scroll || v-h || v-s || h || s\r\n },\r\n nativeScrollbarsOverlaid: {\r\n show: false, // true || false\r\n initialize: false, // true || false\r\n },\r\n scrollbars: {\r\n visibility: 'auto', // visible || hidden || auto || v || h || a\r\n autoHide: 'never', // never || scroll || leave || move || n || s || l || m\r\n autoHideDelay: 800, // number\r\n dragScroll: true, // true || false\r\n clickScroll: false, // true || false\r\n touch: true, // true || false\r\n },\r\n /*\r\n textarea: {\r\n dynWidth: false, // true || false\r\n dynHeight: false, // true || false\r\n inheritedAttrs: ['style', 'class'], // string || array || null\r\n },\r\n */\r\n};\r\n\r\nexport const getOptionsDiff = (\r\n currOptions: T,\r\n newOptions: PartialOptions\r\n): PartialOptions => {\r\n const diff: PartialOptions = {};\r\n const optionsKeys = keys(newOptions).concat(keys(currOptions));\r\n\r\n each(optionsKeys, (optionKey) => {\r\n const currOptionValue = currOptions[optionKey];\r\n const newOptionValue = newOptions[optionKey];\r\n\r\n if (isObject(currOptionValue) && isObject(newOptionValue)) {\r\n assignDeep((diff[optionKey] = {}), getOptionsDiff(currOptionValue, newOptionValue));\r\n } else if (hasOwnProperty(newOptions, optionKey) && newOptionValue !== currOptionValue) {\r\n let isDiff = true;\r\n\r\n if (isArray(currOptionValue) || isArray(newOptionValue)) {\r\n try {\r\n if (opsStringify(currOptionValue) === opsStringify(newOptionValue)) {\r\n isDiff = false;\r\n }\r\n } catch {}\r\n }\r\n\r\n if (isDiff) {\r\n diff[optionKey] = newOptionValue;\r\n }\r\n }\r\n });\r\n\r\n return diff;\r\n};\r\n","import {\r\n createDOM,\r\n addClass,\r\n style,\r\n appendChildren,\r\n fractionalSize,\r\n clientSize,\r\n absoluteCoordinates,\r\n offsetSize,\r\n scrollLeft,\r\n XY,\r\n removeAttr,\r\n removeElements,\r\n windowSize,\r\n equalBCRWH,\r\n getBoundingClientRect,\r\n assignDeep,\r\n cssProperty,\r\n createCache,\r\n equalXY,\r\n createEventListenerHub,\r\n EventListener,\r\n} from 'support';\r\nimport {\r\n classNameEnvironment,\r\n classNameEnvironmentFlexboxGlue,\r\n classNameEnvironmentFlexboxGlueMax,\r\n classNameViewportScrollbarStyling,\r\n} from 'classnames';\r\nimport { Options, defaultOptions } from 'options';\r\nimport { PartialOptions } from 'typings';\r\nimport { InitializationStrategy } from 'initialization';\r\n\r\ntype EnvironmentEventMap = {\r\n _: [];\r\n};\r\n\r\nexport interface InternalEnvironment {\r\n readonly _nativeScrollbarsSize: XY;\r\n readonly _nativeScrollbarsOverlaid: XY;\r\n readonly _nativeScrollbarsHiding: boolean;\r\n readonly _rtlScrollBehavior: { n: boolean; i: boolean };\r\n readonly _flexboxGlue: boolean;\r\n readonly _cssCustomProperties: boolean;\r\n readonly _defaultInitializationStrategy: InitializationStrategy;\r\n readonly _defaultDefaultOptions: Options;\r\n _addListener(listener: EventListener): () => void;\r\n _getInitializationStrategy(): InitializationStrategy;\r\n _setInitializationStrategy(newInitializationStrategy: Partial): void;\r\n _getDefaultOptions(): Options;\r\n _setDefaultOptions(newDefaultOptions: PartialOptions): void;\r\n}\r\n\r\nlet environmentInstance: InternalEnvironment;\r\nconst { abs, round } = Math;\r\n\r\nconst diffBiggerThanOne = (valOne: number, valTwo: number): boolean => {\r\n const absValOne = abs(valOne);\r\n const absValTwo = abs(valTwo);\r\n return !(absValOne === absValTwo || absValOne + 1 === absValTwo || absValOne - 1 === absValTwo);\r\n};\r\n\r\nconst getNativeScrollbarSize = (\r\n body: HTMLElement,\r\n measureElm: HTMLElement,\r\n measureElmChild: HTMLElement\r\n): XY => {\r\n appendChildren(body, measureElm);\r\n\r\n const cSize = clientSize(measureElm);\r\n const oSize = offsetSize(measureElm);\r\n const fSize = fractionalSize(measureElmChild);\r\n\r\n return {\r\n x: oSize.h - cSize.h + fSize.h,\r\n y: oSize.w - cSize.w + fSize.w,\r\n };\r\n};\r\n\r\nconst getNativeScrollbarsHiding = (testElm: HTMLElement): boolean => {\r\n let result = false;\r\n const revertClass = addClass(testElm, classNameViewportScrollbarStyling);\r\n try {\r\n result =\r\n style(testElm, cssProperty('scrollbar-width')) === 'none' ||\r\n window.getComputedStyle(testElm, '::-webkit-scrollbar').getPropertyValue('display') ===\r\n 'none';\r\n } catch (ex) {}\r\n revertClass();\r\n return result;\r\n};\r\n\r\nconst getRtlScrollBehavior = (\r\n parentElm: HTMLElement,\r\n childElm: HTMLElement\r\n): { i: boolean; n: boolean } => {\r\n const strHidden = 'hidden';\r\n style(parentElm, { overflowX: strHidden, overflowY: strHidden, direction: 'rtl' });\r\n scrollLeft(parentElm, 0);\r\n\r\n const parentOffset = absoluteCoordinates(parentElm);\r\n const childOffset = absoluteCoordinates(childElm);\r\n scrollLeft(parentElm, -999); // https://github.com/KingSora/OverlayScrollbars/issues/187\r\n const childOffsetAfterScroll = absoluteCoordinates(childElm);\r\n return {\r\n /**\r\n * origin direction = determines if the zero scroll position is on the left or right side\r\n * 'i' means 'invert' (i === true means that the axis must be inverted to be correct)\r\n * true = on the left side\r\n * false = on the right side\r\n */\r\n i: parentOffset.x === childOffset.x,\r\n /**\r\n * negative = determines if the maximum scroll is positive or negative\r\n * 'n' means 'negate' (n === true means that the axis must be negated to be correct)\r\n * true = negative\r\n * false = positive\r\n */\r\n n: childOffset.x !== childOffsetAfterScroll.x,\r\n };\r\n};\r\n\r\nconst getFlexboxGlue = (parentElm: HTMLElement, childElm: HTMLElement): boolean => {\r\n const revertFbxGlue = addClass(parentElm, classNameEnvironmentFlexboxGlue);\r\n const minOffsetsizeParent = getBoundingClientRect(parentElm);\r\n const minOffsetsize = getBoundingClientRect(childElm);\r\n const supportsMin = equalBCRWH(minOffsetsize, minOffsetsizeParent, true);\r\n\r\n const revertFbxGlueMax = addClass(parentElm, classNameEnvironmentFlexboxGlueMax);\r\n const maxOffsetsizeParent = getBoundingClientRect(parentElm);\r\n const maxOffsetsize = getBoundingClientRect(childElm);\r\n const supportsMax = equalBCRWH(maxOffsetsize, maxOffsetsizeParent, true);\r\n\r\n revertFbxGlue();\r\n revertFbxGlueMax();\r\n\r\n return supportsMin && supportsMax;\r\n};\r\n\r\nconst getWindowDPR = (): number => {\r\n // eslint-disable-next-line\r\n // @ts-ignore\r\n const dDPI = window.screen.deviceXDPI || 0;\r\n // eslint-disable-next-line\r\n // @ts-ignore\r\n const sDPI = window.screen.logicalXDPI || 1;\r\n return window.devicePixelRatio || dDPI / sDPI;\r\n};\r\n\r\nconst createEnvironment = (): InternalEnvironment => {\r\n const { body } = document;\r\n const envDOM = createDOM(``);\r\n const envElm = envDOM[0] as HTMLElement;\r\n const envChildElm = envElm.firstChild as HTMLElement;\r\n const [addEvent, , triggerEvent] = createEventListenerHub();\r\n const [updateNativeScrollbarSizeCache, getNativeScrollbarSizeCache] = createCache({\r\n _initialValue: getNativeScrollbarSize(body, envElm, envChildElm),\r\n _equal: equalXY,\r\n });\r\n const [nativeScrollbarsSize] = getNativeScrollbarSizeCache();\r\n const nativeScrollbarsHiding = getNativeScrollbarsHiding(envElm);\r\n const nativeScrollbarsOverlaid = {\r\n x: nativeScrollbarsSize.x === 0,\r\n y: nativeScrollbarsSize.y === 0,\r\n };\r\n const initializationStrategy = {\r\n _padding: !nativeScrollbarsHiding,\r\n _content: false,\r\n };\r\n const defaultDefaultOptions = assignDeep({}, defaultOptions);\r\n\r\n const env: InternalEnvironment = {\r\n _nativeScrollbarsSize: nativeScrollbarsSize,\r\n _nativeScrollbarsOverlaid: nativeScrollbarsOverlaid,\r\n _nativeScrollbarsHiding: nativeScrollbarsHiding,\r\n _cssCustomProperties: style(envElm, 'zIndex') === '-1',\r\n _rtlScrollBehavior: getRtlScrollBehavior(envElm, envChildElm),\r\n _flexboxGlue: getFlexboxGlue(envElm, envChildElm),\r\n _addListener: (listener) => addEvent('_', listener),\r\n _getInitializationStrategy: assignDeep.bind(\r\n 0,\r\n {} as InitializationStrategy,\r\n initializationStrategy\r\n ),\r\n _setInitializationStrategy(newInitializationStrategy) {\r\n assignDeep(initializationStrategy, newInitializationStrategy);\r\n },\r\n _getDefaultOptions: assignDeep.bind(0, {} as Options, defaultDefaultOptions),\r\n _setDefaultOptions(newDefaultOptions) {\r\n assignDeep(defaultDefaultOptions, newDefaultOptions);\r\n },\r\n _defaultInitializationStrategy: assignDeep({}, initializationStrategy),\r\n _defaultDefaultOptions: assignDeep({}, defaultDefaultOptions),\r\n };\r\n\r\n removeAttr(envElm, 'style');\r\n removeElements(envElm);\r\n\r\n if (!nativeScrollbarsHiding && (!nativeScrollbarsOverlaid.x || !nativeScrollbarsOverlaid.y)) {\r\n let size = windowSize();\r\n let dpr = getWindowDPR();\r\n\r\n window.addEventListener('resize', () => {\r\n const sizeNew = windowSize();\r\n const deltaSize = {\r\n w: sizeNew.w - size.w,\r\n h: sizeNew.h - size.h,\r\n };\r\n\r\n if (deltaSize.w === 0 && deltaSize.h === 0) return;\r\n\r\n const deltaAbsSize = {\r\n w: abs(deltaSize.w),\r\n h: abs(deltaSize.h),\r\n };\r\n const deltaAbsRatio = {\r\n w: abs(round(sizeNew.w / (size.w / 100.0))),\r\n h: abs(round(sizeNew.h / (size.h / 100.0))),\r\n };\r\n const dprNew = getWindowDPR();\r\n const deltaIsBigger = deltaAbsSize.w > 2 && deltaAbsSize.h > 2;\r\n const difference = !diffBiggerThanOne(deltaAbsRatio.w, deltaAbsRatio.h);\r\n const dprChanged = dprNew !== dpr && dpr > 0;\r\n const isZoom = deltaIsBigger && difference && dprChanged;\r\n\r\n if (isZoom) {\r\n const [scrollbarSize, scrollbarSizeChanged] = updateNativeScrollbarSizeCache(\r\n getNativeScrollbarSize(body, envElm, envChildElm)\r\n );\r\n\r\n assignDeep(environmentInstance._nativeScrollbarsSize, scrollbarSize); // keep the object same!\r\n removeElements(envElm);\r\n\r\n if (scrollbarSizeChanged) {\r\n triggerEvent('_');\r\n }\r\n }\r\n\r\n size = sizeNew;\r\n dpr = dprNew;\r\n });\r\n }\r\n\r\n return env;\r\n};\r\n\r\nconst getEnvironment = (): InternalEnvironment => {\r\n if (!environmentInstance) {\r\n environmentInstance = createEnvironment();\r\n }\r\n return environmentInstance;\r\n};\r\n\r\nexport { getEnvironment };\r\n","import { assignDeep, each, isArray, keys } from 'support';\r\nimport { OverlayScrollbars, OverlayScrollbarsStatic } from 'overlayscrollbars';\r\n\r\nexport type PluginInstance =\r\n | Record\r\n | ((staticObj: OverlayScrollbarsStatic, instanceObj: OverlayScrollbars) => void);\r\nexport type Plugin = {\r\n [pluginName: string]: T;\r\n};\r\n\r\nconst pluginRegistry: Record = {};\r\n\r\nexport const getPlugins = () => assignDeep({}, pluginRegistry);\r\n\r\nexport const addPlugin = (addedPlugin: Plugin | Plugin[]) =>\r\n each((isArray(addedPlugin) ? addedPlugin : [addedPlugin]) as Plugin[], (plugin) => {\r\n each(keys(plugin), (pluginName) => {\r\n pluginRegistry[pluginName] = plugin[pluginName];\r\n });\r\n });\r\n","function _extends() {\n module.exports = _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n }, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;\n return _extends.apply(this, arguments);\n}\n\nmodule.exports = _extends, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","import { each, hasOwnProperty, keys, push, isEmptyObject } from 'support/utils';\r\nimport { type, isArray, isUndefined, isPlainObject, isString } from 'support/utils/types';\r\nimport { PlainObject, PartialOptions } from 'typings';\r\n\r\nexport type OptionsObjectType = Record;\r\nexport type OptionsFunctionType = (this: any, ...args: any[]) => any;\r\nexport type OptionsTemplateType = ExtractPropsKey<\r\n OptionsTemplateTypeMap,\r\n T\r\n>;\r\nexport type OptionsTemplateTypes = keyof OptionsTemplateTypeMap;\r\nexport type OptionsTemplateNativeTypes = OptionsTemplateTypeMap[keyof OptionsTemplateTypeMap];\r\n\r\nexport type OptionsTemplateValue = T extends string\r\n ? string extends T\r\n ? OptionsTemplateValueNonEnum\r\n : string\r\n : OptionsTemplateValueNonEnum;\r\n\r\nexport type OptionsTemplate = {\r\n [P in keyof T]: T[P] extends OptionsObjectType\r\n ? OptionsTemplate\r\n : T[P] extends OptionsTemplateNativeTypes\r\n ? OptionsTemplateValue\r\n : never;\r\n};\r\n\r\nexport type OptionsValidationResult = [\r\n PartialOptions, // validated\r\n Record // foreign\r\n];\r\n\r\ntype OptionsTemplateTypeMap = {\r\n __TPL_boolean_TYPE__: boolean;\r\n __TPL_number_TYPE__: number;\r\n __TPL_string_TYPE__: string;\r\n __TPL_array_TYPE__: Array | ReadonlyArray;\r\n __TPL_function_TYPE__: OptionsFunctionType;\r\n __TPL_null_TYPE__: null;\r\n __TPL_object_TYPE__: OptionsObjectType;\r\n};\r\n\r\ntype OptionsTemplateValueNonEnum =\r\n | OptionsTemplateType\r\n | [OptionsTemplateType, ...Array];\r\n\r\ntype ExtractPropsKey = {\r\n [P in keyof T]: TProps extends T[P] ? P : never;\r\n}[keyof T];\r\n\r\ntype OptionsTemplateTypesDictionary = {\r\n readonly boolean: OptionsTemplateType;\r\n readonly number: OptionsTemplateType;\r\n readonly string: OptionsTemplateType;\r\n readonly array: OptionsTemplateType>;\r\n readonly object: OptionsTemplateType;\r\n readonly function: OptionsTemplateType;\r\n readonly null: OptionsTemplateType;\r\n};\r\n\r\nconst optionsTemplateTypes: OptionsTemplateTypesDictionary = {\r\n boolean: '__TPL_boolean_TYPE__',\r\n number: '__TPL_number_TYPE__',\r\n string: '__TPL_string_TYPE__',\r\n array: '__TPL_array_TYPE__',\r\n object: '__TPL_object_TYPE__',\r\n function: '__TPL_function_TYPE__',\r\n null: '__TPL_null_TYPE__',\r\n};\r\n\r\n/**\r\n * Validates the given options object according to the given template object and returns a object which looks like:\r\n * {\r\n * foreign : a object which consists of properties which aren't defined inside the template. (foreign properties)\r\n * validated : a object which consists only of valid properties. (property name is inside the template and value has a correct type)\r\n * }\r\n * @param template The template according to which the options object shall be validated.\r\n * @param options The options object which shall be validated.\r\n * @param optionsDiff When provided the returned validated object will only have properties which are different to this objects properties.\r\n * Example (assume all properties are valid to the template):\r\n * Options object : { a: 'a', b: 'b', c: 'c' }\r\n * optionsDiff object : { a: 'a', b: 'b', c: undefined }\r\n * Returned validated object : { c: 'c' }\r\n * Because the value of the properties a and b didn't change, they aren't included in the returned object.\r\n * Without the optionsDiff object the returned validated object would be: { a: 'a', b: 'b', c: 'c' }\r\n * @param doWriteErrors True if errors shall be logged into the console, false otherwise.\r\n * @param propPath The propertyPath which lead to this object. (used for error logging)\r\n */\r\nconst validateRecursive = (\r\n template: OptionsTemplate,\r\n options: PartialOptions,\r\n doWriteErrors?: boolean,\r\n propPath?: string\r\n): OptionsValidationResult => {\r\n const validatedOptions: PartialOptions = {};\r\n const optionsCopy: PartialOptions = { ...options };\r\n const props = keys(template).filter((prop) => hasOwnProperty(options, prop));\r\n\r\n each(props, (prop: Extract) => {\r\n const optionsValue: any = options[prop];\r\n const templateValue: PlainObject | string | OptionsTemplateTypes | Array =\r\n template[prop];\r\n const templateIsComplex = isPlainObject(templateValue);\r\n const propPrefix = propPath ? `${propPath}.` : '';\r\n\r\n // if the template has a object as value, it means that the options are complex (verschachtelt)\r\n if (templateIsComplex && isPlainObject(optionsValue)) {\r\n const [validated, foreign] = validateRecursive(\r\n templateValue as T,\r\n optionsValue,\r\n doWriteErrors,\r\n propPrefix + prop\r\n );\r\n validatedOptions[prop] = validated as any;\r\n optionsCopy[prop] = foreign as any;\r\n\r\n each([optionsCopy, validatedOptions], (value) => {\r\n if (isEmptyObject(value[prop])) {\r\n delete value[prop];\r\n }\r\n });\r\n } else if (!templateIsComplex) {\r\n let isValid = false;\r\n const errorEnumStrings: Array = [];\r\n const errorPossibleTypes: Array = [];\r\n const optionsValueType = type(optionsValue);\r\n const templateValueArr: Array = !isArray(templateValue)\r\n ? [templateValue as string | OptionsTemplateTypes]\r\n : (templateValue as Array);\r\n\r\n each(templateValueArr, (currTemplateType) => {\r\n // if currType value isn't inside possibleTemplateTypes we assume its a enum string value\r\n let typeString: string | undefined;\r\n each(optionsTemplateTypes, (value: string, key: string) => {\r\n if (value === currTemplateType) {\r\n typeString = key;\r\n }\r\n });\r\n const isEnumString = isUndefined(typeString);\r\n if (isEnumString && isString(optionsValue)) {\r\n // split it into a array which contains all possible values for example: [\"yes\", \"no\", \"maybe\"]\r\n const enumStringSplit = currTemplateType.split(' ');\r\n isValid = !!enumStringSplit.find((possibility) => possibility === optionsValue);\r\n\r\n // build error message\r\n push(errorEnumStrings, enumStringSplit);\r\n } else {\r\n isValid = optionsTemplateTypes[optionsValueType] === currTemplateType;\r\n }\r\n\r\n // build error message\r\n push(errorPossibleTypes, isEnumString ? optionsTemplateTypes.string : typeString!);\r\n\r\n // continue if invalid, break if valid\r\n return !isValid;\r\n });\r\n\r\n if (isValid) {\r\n validatedOptions[prop] = optionsValue;\r\n } else if (doWriteErrors) {\r\n console.warn(\r\n `${\r\n `The option \"${propPrefix}${prop}\" wasn't set, because it doesn't accept the type [ ${optionsValueType.toUpperCase()} ] with the value of \"${optionsValue}\".\\r\\n` +\r\n `Accepted types are: [ ${errorPossibleTypes.join(', ').toUpperCase()} ].\\r\\n`\r\n }${\r\n errorEnumStrings.length > 0\r\n ? `\\r\\nValid strings are: [ ${errorEnumStrings.join(', ')} ].`\r\n : ''\r\n }`\r\n );\r\n }\r\n\r\n delete optionsCopy[prop];\r\n }\r\n });\r\n\r\n return [validatedOptions, optionsCopy]; // optionsCopy equals now to foreign options\r\n};\r\n\r\n/**\r\n * Validates the given options object according to the given template object and returns a tuple which looks like:\r\n * [\r\n * validated : a object which consists only of valid properties. (property name is inside the template and value has a correct type)\r\n * foreign : a object which consists of properties which aren't defined inside the template. (foreign properties)\r\n * ]\r\n * @param template The template according to which the options object shall be validated.\r\n * @param options The options object which shall be validated.\r\n * @param doWriteErrors True if errors shall be logged into the console, false otherwise.\r\n */\r\nconst validateOptions = (\r\n template: OptionsTemplate