Sha256: 4c08107f52fc21834fdeee2836bdcebb647225bce87e8c21411342c464b87ec9
Contents?: true
Size: 1.09 KB
Versions: 119
Compression:
Stored size: 1.09 KB
Contents
import { Controller } from '@hotwired/stimulus'
import { leave, toggle } from 'el-transition'
import { useClickOutside } from 'stimulus-use'
export default class extends Controller {
static targets = ['panel']
static values = {
// One may want to have an element that is exempt from triggerring the click outside event
exemptionContainer: String,
}
get exemptionContainerTarget() {
return document.querySelector(this.exemptionContainerValue)
}
connect() {
useClickOutside(this)
}
clickOutside(e) {
if (this.hasPanelTarget) {
if (this.hasExemptionContainerValue) {
const inExemptionContainer = this.exemptionContainerTarget.contains(e.target)
if (!inExemptionContainer) {
leave(this.panelTarget)
}
} else {
leave(this.panelTarget)
}
}
}
togglePanel() {
if (this.hasPanelTarget) {
toggle(this.panelTarget)
}
}
outlet({ params }) {
const { outlet } = params
if (outlet && document.querySelector(outlet)) {
document.querySelector(outlet).classList.toggle('hidden')
}
}
}
Version data entries
119 entries across 119 versions & 1 rubygems