Skip to content

Commit bc03a10

Browse files
remove element when dismissed
1 parent 3bd8575 commit bc03a10

7 files changed

+18
-36
lines changed

app/assets/plutonium.js

+3-9
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/assets/plutonium.js.map

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/assets/plutonium.min.js

+5-5
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/assets/plutonium.min.js.map

+3-3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/views/plutonium/_flash_alerts.html.erb

+1-2
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@
2020
%>
2121

2222
<div data-controller="resource-dismiss"
23-
data-resource-dismiss-target="target"
2423
data-resource-dismiss-after-value="6000"
2524
class="flex items-center p-4 mb-4 text-<%= color %>-800 rounded-lg bg-<%= color %>-50 dark:bg-stone-300 dark:text-<%= color %>-400"
2625
role="alert">
@@ -45,7 +44,7 @@
4544
<div class="ms-3 text-sm font-normal"><%= msg %></div>
4645
<button type="button"
4746
class="ms-auto -mx-1.5 -my-1.5 bg-<%= color %>-50 text-<%= color %>-500 rounded-lg focus:ring-2 focus:ring-<%= color %>-400 p-1.5 hover:bg-<%= color %>-200 inline-flex items-center justify-center h-8 w-8 dark:bg-stone-300 dark:text-<%= color %>-400 dark:hover:bg-gray-700"
48-
data-resource-dismiss-target="trigger"
47+
data-action="click->resource-dismiss#dismiss"
4948
aria-label="Close">
5049
<span class="sr-only">Close</span>
5150
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">

app/views/plutonium/_flash_toasts.html.erb

+1-2
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919
%>
2020

2121
<div data-controller="resource-dismiss"
22-
data-resource-dismiss-target="target"
2322
data-resource-dismiss-after-value="6000"
2423
class="fixed z-50 top-16 inset-x-0 mx-auto flex items-center w-full max-w-md p-4 text-gray-500 bg-<%= color %>-50 rounded-lg shadow dark:text-<%= color %>-400 dark:bg-gray-800 dark:border dark:border-gray-700 dark:shadow-none"
2524
role="alert">
@@ -47,7 +46,7 @@
4746
<div class="ms-3 text-sm font-normal"><%= msg %></div>
4847
<button type="button"
4948
class="ms-auto -mx-1.5 -my-1.5 bg-<%= color %>-50 text-<%= color %>-400 rounded-lg focus:ring-2 focus:ring-<%= color %>-400 p-1.5 hover:bg-<%= color %>-200 inline-flex items-center justify-center h-8 w-8 dark:text-<%= color %>-400 dark:bg-gray-800 dark:hover:bg-gray-700"
50-
data-resource-dismiss-target="trigger"
49+
data-action="click->resource-dismiss#dismiss"
5150
aria-label="Close">
5251
<span class="sr-only">Close</span>
5352
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,17 @@
11
import { Controller } from "@hotwired/stimulus"
2-
import { Dismiss } from 'flowbite';
3-
42

53
// Connects to data-controller="resource-dismiss"
64
export default class extends Controller {
7-
static targets = ["trigger", "target"]
8-
95
static values = {
106
after: Number,
117
}
128

139
connect() {
1410
console.log(`resource-dismiss connected: ${this.element}`)
1511

16-
// https://flowbite.com/docs/components/alerts/#javascript-behaviour
17-
this.dismiss = new Dismiss(this.targetTarget, this.triggerTarget);
18-
19-
console.log(this.hasAfterValue)
20-
console.log(this.afterValue)
2112
if (this.hasAfterValue && this.afterValue > 0) {
2213
this.autoDismissTimeout = setTimeout(() => {
23-
this.hide()
14+
this.dismiss()
2415
this.autoDismissTimeout = null
2516
}, this.afterValue);
2617
}
@@ -29,11 +20,10 @@ export default class extends Controller {
2920
disconnect() {
3021
if (this.autoDismissTimeout) clearTimeout(this.autoDismissTimeout)
3122

32-
this.dismiss = null
3323
this.autoDismissTimeout = null
3424
}
3525

36-
hide() {
37-
this.dismiss.hide()
26+
dismiss() {
27+
this.element.remove()
3828
}
3929
}

0 commit comments

Comments
 (0)