notid/integreat
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fixes

Browse Source
This commit is contained in:
Bryce
2023-10-27 15:08:06 -07:00
parent 1e64afce8d
commit a4678c8fde
6 changed files with 111 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/clj/auto_ap/ssr/components/dialog.clj
View File

@@ -1,19 +1,42 @@
(ns auto-ap.ssr.components.dialog
(:require
[auto-ap.ssr.hiccup-helper :as hh]))
[auto-ap.ssr.hiccup-helper :as hh]
[auto-ap.ssr.hx :as hx]))
(defn modal- [params & children]
[:div (-> params
(assoc "@click.outside" "open=false")
(update :class (fnil hh/add-class "") "w-full h-full"))
(assoc "@click.outside" "open=false"
:x-data (hx/json {:index 0 :hidingIndex -1})
:x-ref "modalStack"
"@modalnext"
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', '-translate-x-full scale-0 opacity-0' );
$refs.modalStack.children[index + 1].setAttribute('x-transition:enter-start', 'translate-x-full scale-0 opacity-0' );
hidingIndex = index;
setTimeout(() => {index ++; hidingIndex = -1 }, 150)"
"@modalprevious"
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
$refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
hidingIndex = index;
setTimeout(() => { index --; hidingIndex = -1; }, 150)"
"@modalpop"
"$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
$refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
hidingIndex = index;
setTimeout(() => index --, 150)
setTimeout(() => { $refs.modalStack.removeChild($refs.modalStack.children[index+1]); hidingIndex=-1; }, 300)
"
)
(update :class (fnil hh/add-class "") "w-full h-full modal-stack"))
children])
(defn modal-card- [params header content footer]
[:div (update params
:class (fn [c] (-> c
(or "")
(hh/add-class "w-full p-4 h-full modal-card")
)))
:class (fn [c] (-> c
(or "")
(hh/add-class "w-full p-4 h-full modal-card")
)))
[:div {:class "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white modal-content w-full flex flex-col h-full"}
[:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0"} header]
[:div {:class "px-6 space-y-6 overflow-y-scroll w-full shrink"}
@@ -22,3 +45,19 @@
content]
(when footer [:div {:class "p-4 shrink-0"} footer])]])
(defn stacked-modal-card- [index params header content footer]
[:div (merge params
{:class "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white modal-content flex flex-col"
:x-data (hx/json {:i index})
:x-show "index == i && hidingIndex != i"
"x-transition:enter" "transition duration-150",
"x-transition:enter-end" "translate-x-0 scale-100 opacity-100",
"x-transition:leave" "transition duration-150",
"x-transition:leave-start" "translate-x-0 scale-100 opacity-100",
})
[:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0"} header]
[:div {:class "px-6 space-y-6 overflow-y-scroll w-full shrink"}
content]
(when footer [:div {:class "p-4 shrink-0"} footer])])