1 line
9.3 KiB
Plaintext
1 line
9.3 KiB
Plaintext
|
{"version":3,"file":"index.mjs","sources":["../../src/ripple/BaseRipple.js","../../src/ripple/Ripple.js"],"sourcesContent":["import BaseDirective from '@primevue/core/basedirective';\nimport RippleStyle from 'primevue/ripple/style';\n\nconst BaseRipple = BaseDirective.extend({\n style: RippleStyle\n});\n\nexport default BaseRipple;\n","import { addClass, createElement, getAttribute, getHeight, getOffset, getOuterHeight, getOuterWidth, getWidth, removeClass } from '@primeuix/utils/dom';\nimport BaseRipple from './BaseRipple';\n\nconst Ripple = BaseRipple.extend('ripple', {\n watch: {\n 'config.ripple'(newValue) {\n if (newValue) {\n this.createRipple(this.$host);\n this.bindEvents(this.$host);\n\n this.$host.setAttribute('data-pd-ripple', true);\n this.$host.style['overflow'] = 'hidden';\n this.$host.style['position'] = 'relative';\n } else {\n this.remove(this.$host);\n this.$host.removeAttribute('data-pd-ripple');\n }\n }\n },\n unmounted(el) {\n this.remove(el);\n },\n timeout: undefined,\n methods: {\n bindEvents(el) {\n el.addEventListener('mousedown', this.onMouseDown.bind(this));\n },\n unbindEvents(el) {\n el.removeEventListener('mousedown', this.onMouseDown.bind(this));\n },\n createRipple(el) {\n let ink = this.getInk(el);\n\n if (!ink) {\n ink = createElement('span', {\n role: 'presentation',\n 'aria-hidden': true,\n 'data-p-ink': true,\n 'data-p-ink-active': false,\n class: !this.isUnstyled() && this.cx('root'),\n onAnimationEnd: this.onAnimationEnd.bind(this),\n [this.$attrSelector]: '',\n 'p-bind': this.ptm('root')\n });\n\n el.appendChild(ink);\n\n this.$el = ink;\n }\n },\n remove(el) {\n let ink = this.getInk(el);\n\n if (ink) {\n this.$host.style['overflow'] = '';\n this.$host.style['position'] = '';\n\n this.unbindEvents(el);\n ink.removeEventListener('animationend', this.onAnimationEnd);\n ink.remove();\n }\n },\n onMouseDown(event) {\n let target = event.currentTarget;\n let ink = this.getInk(target);\n\n if (!ink || getComputedStyle(ink, null).display === 'none') {\n return;\n }\n\n !this.isUnstyled() && removeClass(ink, 'p-ink-active');\n ink.setAttribute('data-p-ink-active', 'false');\n\n if (!getHeight(ink) && !getWidth(ink)) {\n let d = Math.max(getOuterWidth(target), getOuterHeight(target));\n\n ink.style.height = d + 'px';\n ink.style.width = d + 'px';\n }\n\n let offset = getOffset(target);\n let x = event.pageX - offset.left + document.body.scrollTop - getWidth(ink) / 2;\n let y = event.pageY - offset.top + document.body.scrollLeft - getHeight(ink) / 2;\n\n ink.style.top = y + 'px';\n ink.style.left = x + 'px';\n\n !this.isUnstyled() && addClass(ink, 'p-ink-active');\n ink.setAttribute('data-p-ink-active', 'true');\n\n this.timeout = setTimeout(() => {\n if (ink) {\n !this.isUnstyled() && removeClass(ink, 'p-ink-active');\n ink.setAttribute('data-p-ink-active', 'false');\n }\n }, 401);\n },\n onAnimationEnd(event) {\n if (this.timeout) {\n clearTimeout(this.timeout);\n }\n\n !this.isUnstyled() && removeClass(event.currentTarget, 'p-ink-active');\n event.currentTarget.setAttribute('data-p-ink-active', 'fal
|