UNPKG

@dialpad/dialtone

Version:

Dialpad's Dialtone design system monorepo

1 lines 6.11 kB
{"version":3,"file":"dom.cjs","sources":["../../../common/mixins/dom.js"],"sourcesContent":["export default {\n methods: {\n /**\n * Scroll an element into view if it is not fully visible in its nearest scrollable ancestor.\n * @param {Element} ref\n */\n scrollElementIntoViewIfNeeded (ref, opt_center, opt_behavior, opt_parent) {\n if (ref.scrollIntoViewIfNeeded) {\n this.scrollIntoViewIfNeeded(ref, opt_center, opt_behavior, opt_parent);\n } else {\n this.scrollIntoView(ref, 'bottom', false, opt_behavior, opt_parent);\n }\n },\n\n /**\n * Scroll an element to the top or bottom of its scroll ancestor.\n * @param {Element} ref\n */\n scrollElementIntoView (ref, opt_scrollToTop, opt_behavior, opt_parent) {\n if (opt_scrollToTop === 'center') {\n this.scrollIntoView(ref, 'center', false, opt_behavior, opt_parent);\n return;\n }\n\n if (opt_scrollToTop === false) {\n this.scrollIntoView(ref, 'bottom', false, opt_behavior, opt_parent);\n } else {\n this.scrollIntoView(ref, 'top', false, opt_behavior, opt_parent);\n }\n },\n\n scrollIntoViewIfNeeded (ref, opt_center, opt_behavior, opt_parent) {\n const dir = opt_center ? 'center' : undefined;\n this.scrollIntoView(ref, dir, true, opt_behavior, opt_parent);\n },\n\n scrollIntoView (ref, opt_dir, opt_ifNeeded, opt_behavior, opt_parent) {\n if (!ref || !ref.parentElement) {\n return;\n }\n const offsetTop = ref.offsetTop;\n const refParent = opt_parent || ref.parentElement;\n const scrollBounds = this._getScrollBounds(refParent);\n const parentHeight = scrollBounds.bottom - scrollBounds.top;\n const elHeight = this._getElementHeight(ref);\n const offsetBottom = offsetTop + elHeight;\n let scrollTop = -1;\n switch (opt_dir) {\n case 'top':\n scrollTop = offsetTop;\n break;\n case 'center':\n scrollTop = offsetTop + (elHeight - parentHeight) / 2;\n break;\n case 'bottom':\n scrollTop = scrollTop = offsetBottom - parentHeight;\n break;\n default:\n // Go to the closest edge if needed and no direction is provided.\n if (offsetTop - scrollBounds.top <= (parentHeight / 2)) {\n // Lock it to the top edge.\n scrollTop = offsetTop;\n } else {\n scrollTop = offsetBottom - parentHeight;\n }\n break;\n }\n this._setScrollTop(refParent, scrollTop, scrollBounds, offsetTop, offsetBottom, opt_ifNeeded, opt_behavior);\n },\n\n _setScrollTop (el, scrollTop, bounds, offsetTop, offsetBottom, opt_isNeeded, opt_behavior) {\n bounds = bounds || this._getScrollBounds(el);\n const parentHeight = bounds.bottom - bounds.top;\n if (opt_isNeeded && this._inScrollBounds(offsetTop, offsetBottom, bounds)) {\n // Then lock to the top or bottom if it's hanging off the edge.\n if (offsetTop < bounds.top) {\n // Snap it to the top.\n scrollTop = offsetTop;\n } else if (offsetBottom > bounds.bottom) {\n scrollTop = offsetBottom - parentHeight;\n } else {\n return;\n }\n }\n\n if (opt_behavior) {\n el.scrollTo({ top: scrollTop, behavior: opt_behavior });\n } else {\n el.scrollTop = scrollTop;\n }\n },\n\n _getElementHeight (el) {\n return el.getBoundingClientRect().height;\n },\n\n _getScrollBounds (el) {\n const height = this._getElementHeight(el);\n const scrollTop = el.scrollTop;\n return {\n top: scrollTop,\n bottom: scrollTop + height,\n };\n },\n\n _inScrollBounds (top, bottom, bounds) {\n // Since we read from top to bottom, we want more than 3/4 to be visible at the top\n // (bc you're looking at the bottom half) or a quarter visible at the bottom (bc you\n // can read the beginning of it)\n\n const height = bottom - top;\n return (bottom <= bounds.bottom + (3 * height / 4)) && (top >= bounds.top - (height / 4));\n },\n },\n};\n"],"names":["Dom","ref","opt_center","opt_behavior","opt_parent","opt_scrollToTop","dir","opt_dir","opt_ifNeeded","offsetTop","refParent","scrollBounds","parentHeight","elHeight","offsetBottom","scrollTop","el","bounds","opt_isNeeded","height","top","bottom"],"mappings":"4GAAA,MAAAA,EAAe,CACb,QAAS,CAKP,8BAA+BC,EAAKC,EAAYC,EAAcC,EAAY,CACpEH,EAAI,uBACN,KAAK,uBAAuBA,EAAKC,EAAYC,EAAcC,CAAU,EAErE,KAAK,eAAeH,EAAK,SAAU,GAAOE,EAAcC,CAAU,CAEtE,EAMA,sBAAuBH,EAAKI,EAAiBF,EAAcC,EAAY,CACrE,GAAIC,IAAoB,SAAU,CAChC,KAAK,eAAeJ,EAAK,SAAU,GAAOE,EAAcC,CAAU,EAClE,MACF,CAEIC,IAAoB,GACtB,KAAK,eAAeJ,EAAK,SAAU,GAAOE,EAAcC,CAAU,EAElE,KAAK,eAAeH,EAAK,MAAO,GAAOE,EAAcC,CAAU,CAEnE,EAEA,uBAAwBH,EAAKC,EAAYC,EAAcC,EAAY,CACjE,MAAME,EAAMJ,EAAa,SAAW,OACpC,KAAK,eAAeD,EAAKK,EAAK,GAAMH,EAAcC,CAAU,CAC9D,EAEA,eAAgBH,EAAKM,EAASC,EAAcL,EAAcC,EAAY,CACpE,GAAI,CAACH,GAAO,CAACA,EAAI,cACf,OAEF,MAAMQ,EAAYR,EAAI,UAChBS,EAAYN,GAAcH,EAAI,cAC9BU,EAAe,KAAK,iBAAiBD,CAAS,EAC9CE,EAAeD,EAAa,OAASA,EAAa,IAClDE,EAAW,KAAK,kBAAkBZ,CAAG,EACrCa,EAAeL,EAAYI,EACjC,IAAIE,EAAY,GAChB,OAAQR,EAAO,CACb,IAAK,MACHQ,EAAYN,EACZ,MACF,IAAK,SACHM,EAAYN,GAAaI,EAAWD,GAAgB,EACpD,MACF,IAAK,SACHG,EAAYA,EAAYD,EAAeF,EACvC,MACF,QAEMH,EAAYE,EAAa,KAAQC,EAAe,EAElDG,EAAYN,EAEZM,EAAYD,EAAeF,EAE7B,KACV,CACM,KAAK,cAAcF,EAAWK,EAAWJ,EAAcF,EAAWK,EAAcN,EAAcL,CAAY,CAC5G,EAEA,cAAea,EAAID,EAAWE,EAAQR,EAAWK,EAAcI,EAAcf,EAAc,CACzFc,EAASA,GAAU,KAAK,iBAAiBD,CAAE,EAC3C,MAAMJ,EAAeK,EAAO,OAASA,EAAO,IAC5C,GAAIC,GAAgB,KAAK,gBAAgBT,EAAWK,EAAcG,CAAM,EAEtE,GAAIR,EAAYQ,EAAO,IAErBF,EAAYN,UACHK,EAAeG,EAAO,OAC/BF,EAAYD,EAAeF,MAE3B,QAIAT,EACFa,EAAG,SAAS,CAAE,IAAKD,EAAW,SAAUZ,EAAc,EAEtDa,EAAG,UAAYD,CAEnB,EAEA,kBAAmBC,EAAI,CACrB,OAAOA,EAAG,sBAAqB,EAAG,MACpC,EAEA,iBAAkBA,EAAI,CACpB,MAAMG,EAAS,KAAK,kBAAkBH,CAAE,EAClCD,EAAYC,EAAG,UACrB,MAAO,CACL,IAAKD,EACL,OAAQA,EAAYI,CAC5B,CACI,EAEA,gBAAiBC,EAAKC,EAAQJ,EAAQ,CAKpC,MAAME,EAASE,EAASD,EACxB,OAAQC,GAAUJ,EAAO,OAAU,EAAIE,EAAS,GAAQC,GAAOH,EAAO,IAAOE,EAAS,CACxF,CACJ,CACA"}