{"version":3,"sources":["webpack:///./node_modules/@ionic/core/dist/esm-es5/ion-ripple-effect.entry.js"],"names":["RippleEffect","class_1","hostRef","this","type","prototype","addRipple","x","y","_this","_a","Promise","resolve","rect","el","getBoundingClientRect","width","height","hypotenuse","Math","sqrt","maxDim","max","maxRadius","unbounded","PADDING","initialSize","floor","INITIAL_ORIGIN_SCALE","finalScale","posX","left","posY","top","styleX","styleY","moveX","moveY","div","document","createElement","classList","add","style","setProperty","container","shadowRoot","appendChild","setTimeout","removeRipple","Object","defineProperty","get","enumerable","configurable","render","mode","role","class","ripple","remove"],"mappings":"gHAAA,qFAGIA,GAHJ,UAGkC,WAC9B,SAASC,EAAQC,GACb,eAAiBC,KAAMD,GAUvBC,KAAKC,KAAO,UA+EhB,OAvEAH,EAAQI,UAAUC,UAAY,SAAUC,EAAGC,GACvC,OAAO,eAAUL,UAAM,OAAQ,GAAQ,WACnC,IAAIM,EAAQN,KACZ,OAAO,eAAYA,MAAM,SAAUO,GAC/B,MAAO,CAAC,EAAc,IAAIC,SAAQ,SAAUC,GACpC,gBAAS,WACL,IAAIC,EAAOJ,EAAMK,GAAGC,wBAChBC,EAAQH,EAAKG,MACbC,EAASJ,EAAKI,OACdC,EAAaC,KAAKC,KAAKJ,EAAQA,EAAQC,EAASA,GAChDI,EAASF,KAAKG,IAAIL,EAAQD,GAC1BO,EAAYd,EAAMe,UAAYH,EAASH,EAAaO,EACpDC,EAAcP,KAAKQ,MAAMN,EAASO,GAClCC,EAAaN,EAAYG,EACzBI,EAAOvB,EAAIM,EAAKkB,KAChBC,EAAOxB,EAAIK,EAAKoB,IAChBxB,EAAMe,YACNM,EAAe,GAARd,EACPgB,EAAgB,GAATf,GAEX,IAAIiB,EAASJ,EAAqB,GAAdJ,EAChBS,EAASH,EAAqB,GAAdN,EAChBU,EAAgB,GAARpB,EAAcc,EACtBO,EAAiB,GAATpB,EAAee,EAC3B,gBAAU,WACN,IAAIM,EAAMC,SAASC,cAAc,OACjCF,EAAIG,UAAUC,IAAI,iBAClB,IAAIC,EAAQL,EAAIK,MAChBA,EAAMV,IAAME,EAAS,KACrBQ,EAAMZ,KAAOG,EAAS,KACtBS,EAAM3B,MAAQ2B,EAAM1B,OAASS,EAAc,KAC3CiB,EAAMC,YAAY,gBAAiB,GAAKf,GACxCc,EAAMC,YAAY,kBAAmBR,EAAQ,OAASC,EAAQ,MAC9D,IAAIQ,EAAYpC,EAAMK,GAAGgC,YAAcrC,EAAMK,GAC7C+B,EAAUE,YAAYT,GACtBU,YAAW,WACPpC,GAAQ,WACJqC,EAAaX,QAElB,sBAO/BY,OAAOC,eAAelD,EAAQI,UAAW,YAAa,CAClD+C,IAAK,WACD,MAAqB,cAAdjD,KAAKC,MAEhBiD,YAAY,EACZC,cAAc,IAElBrD,EAAQI,UAAUkD,OAAS,WACvB,IAAI7C,EACA8C,EAAO,eAAWrD,MACtB,OAAQ,cAAD,CAAG,OAAM,CAAEsD,KAAM,eAAgBC,OAAQhD,EAAK,GAC7CA,EAAG8C,IAAQ,EACX9C,EAAG,aAAeP,KAAKqB,UACvBd,MAEZwC,OAAOC,eAAelD,EAAQI,UAAW,KAAM,CAC3C+C,IAAK,WAAc,OAAO,eAAWjD,OACrCkD,YAAY,EACZC,cAAc,IAElBJ,OAAOC,eAAelD,EAAS,QAAS,CACpCmD,IAAK,WAAc,MAAO,m4DAC1BC,YAAY,EACZC,cAAc,IAEXrD,EA3FsB,IA6F7BgD,EAAe,SAAUU,GACzBA,EAAOlB,UAAUC,IAAI,YACrBM,YAAW,WACPW,EAAOC,WACR,MAEHnC,EAAU,GACVG,EAAuB","file":"js/chunk-2d218068.2ffcb75c.js","sourcesContent":["import { __awaiter, __generator } from \"tslib\";\nimport { r as registerInstance, f as readTask, w as writeTask, c as getIonMode, h, e as getElement, H as Host } from './core-feeeff0d.js';\nimport './config-3c7f3790.js';\nvar RippleEffect = /** @class */ (function () {\n    function class_1(hostRef) {\n        registerInstance(this, hostRef);\n        /**\n         * Sets the type of ripple-effect:\n         *\n         * - `bounded`: the ripple effect expands from the user's click position\n         * - `unbounded`: the ripple effect expands from the center of the button and overflows the container.\n         *\n         * NOTE: Surfaces for bounded ripples should have the overflow property set to hidden,\n         * while surfaces for unbounded ripples should have it set to visible.\n         */\n        this.type = 'bounded';\n    }\n    /**\n     * Adds the ripple effect to the parent element.\n     *\n     * @param x The horizontal coordinate of where the ripple should start.\n     * @param y The vertical coordinate of where the ripple should start.\n     */\n    class_1.prototype.addRipple = function (x, y) {\n        return __awaiter(this, void 0, void 0, function () {\n            var _this = this;\n            return __generator(this, function (_a) {\n                return [2 /*return*/, new Promise(function (resolve) {\n                        readTask(function () {\n                            var rect = _this.el.getBoundingClientRect();\n                            var width = rect.width;\n                            var height = rect.height;\n                            var hypotenuse = Math.sqrt(width * width + height * height);\n                            var maxDim = Math.max(height, width);\n                            var maxRadius = _this.unbounded ? maxDim : hypotenuse + PADDING;\n                            var initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);\n                            var finalScale = maxRadius / initialSize;\n                            var posX = x - rect.left;\n                            var posY = y - rect.top;\n                            if (_this.unbounded) {\n                                posX = width * 0.5;\n                                posY = height * 0.5;\n                            }\n                            var styleX = posX - initialSize * 0.5;\n                            var styleY = posY - initialSize * 0.5;\n                            var moveX = width * 0.5 - posX;\n                            var moveY = height * 0.5 - posY;\n                            writeTask(function () {\n                                var div = document.createElement('div');\n                                div.classList.add('ripple-effect');\n                                var style = div.style;\n                                style.top = styleY + 'px';\n                                style.left = styleX + 'px';\n                                style.width = style.height = initialSize + 'px';\n                                style.setProperty('--final-scale', \"\" + finalScale);\n                                style.setProperty('--translate-end', moveX + \"px, \" + moveY + \"px\");\n                                var container = _this.el.shadowRoot || _this.el;\n                                container.appendChild(div);\n                                setTimeout(function () {\n                                    resolve(function () {\n                                        removeRipple(div);\n                                    });\n                                }, 225 + 100);\n                            });\n                        });\n                    })];\n            });\n        });\n    };\n    Object.defineProperty(class_1.prototype, \"unbounded\", {\n        get: function () {\n            return this.type === 'unbounded';\n        },\n        enumerable: true,\n        configurable: true\n    });\n    class_1.prototype.render = function () {\n        var _a;\n        var mode = getIonMode(this);\n        return (h(Host, { role: \"presentation\", class: (_a = {},\n                _a[mode] = true,\n                _a['unbounded'] = this.unbounded,\n                _a) }));\n    };\n    Object.defineProperty(class_1.prototype, \"el\", {\n        get: function () { return getElement(this); },\n        enumerable: true,\n        configurable: true\n    });\n    Object.defineProperty(class_1, \"style\", {\n        get: function () { return \":host{left:0;right:0;top:0;bottom:0;position:absolute;contain:strict;pointer-events:none}:host(.unbounded){contain:layout size style}.ripple-effect{border-radius:50%;position:absolute;background-color:currentColor;color:inherit;contain:strict;opacity:0;-webkit-animation:rippleAnimation 225ms forwards,fadeInAnimation 75ms forwards;animation:rippleAnimation 225ms forwards,fadeInAnimation 75ms forwards;will-change:transform,opacity;pointer-events:none}.fade-out{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale,1));transform:translate(var(--translate-end)) scale(var(--final-scale,1));-webkit-animation:fadeOutAnimation .15s forwards;animation:fadeOutAnimation .15s forwards}\\@-webkit-keyframes rippleAnimation{0%{-webkit-animation-timing-function:cubic-bezier(.4,0,.2,1);animation-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale,1));transform:translate(var(--translate-end)) scale(var(--final-scale,1))}}\\@keyframes rippleAnimation{0%{-webkit-animation-timing-function:cubic-bezier(.4,0,.2,1);animation-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale,1));transform:translate(var(--translate-end)) scale(var(--final-scale,1))}}\\@-webkit-keyframes fadeInAnimation{0%{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:.16}}\\@keyframes fadeInAnimation{0%{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:.16}}\\@-webkit-keyframes fadeOutAnimation{0%{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:.16}to{opacity:0}}\\@keyframes fadeOutAnimation{0%{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:.16}to{opacity:0}}\"; },\n        enumerable: true,\n        configurable: true\n    });\n    return class_1;\n}());\nvar removeRipple = function (ripple) {\n    ripple.classList.add('fade-out');\n    setTimeout(function () {\n        ripple.remove();\n    }, 200);\n};\nvar PADDING = 10;\nvar INITIAL_ORIGIN_SCALE = 0.5;\nexport { RippleEffect as ion_ripple_effect };\n"],"sourceRoot":""}