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

Fixes

Browse Source
This commit is contained in:
Bryce
2024-10-15 19:22:19 -07:00
parent 631ee905da
commit ca27fcdb57
8 changed files with 104 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
resources/input.css
View File

@@ -154,70 +154,6 @@
min-height: calc(100vh - 4em); min-height: calc(100vh - 4em);
} }
.choices {
@apply border-0 mb-0 !important;
}
.choices__list--multiple {
}
.choices__inner {
@apply bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 dark:bg-gray-700 p-1 group-[.has-error]:bg-red-50 group-[.has-error]:border-red-500 group-[.has-error]:text-red-900 group-[.has-error]:placeholder-red-700 group-[.has-error]:focus:ring-red-500 group-[.has-error]:dark:bg-gray-700 group-[.has-error]:focus:border-red-500 group-[.has-error]:dark:text-red-500 group-[.has-error]:dark:placeholder-red-500 group-[.has-error]:dark:border-red-500 !important;
}
.choices:focus-within .choices__inner {
@apply ring-blue-500 border-blue-500 dark:ring-blue-500 dark:border-blue-500 !important;
outline: 2px solid transparent !important;
outline-offset: 2px;
--tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: #007dbb;
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
border-color: #007dbb;
}
.choices__inner .choices__input {
@apply m-0 bg-gray-50 dark:bg-gray-700 dark:text-white !important;
}
.choices__inner .choices__item {
@apply bg-green-300 text-green-800 dark:bg-green-900 dark:text-green-300 text-xs font-medium px-2 py-0.5 rounded whitespace-nowrap border-gray-400 !important;
}
.choices__list--dropdown {
@apply bg-white rounded-lg shadow dark:bg-gray-700 !important;
}
.choices__list--dropdown .choices__item--selectable.is-highlighted {
@apply bg-green-300 text-green-800 dark:bg-green-900 dark:text-green-300 !important;
}
.choices[data-type*="select-multiple"] .choices__button {
@apply border-gray-500 focus:ring-blue-500 focus:border-blue-500 !important;
}
.choices__inner .choices__item:focus-within {
@apply bg-green-500 border-gray-500 ring-blue-500 border-blue-500 !important;
}
.choices__list--single .choices__item {
@apply w-auto flex !important;
}
.choices__list--single {
@apply w-auto !important;
}
.choices__list--single button {
@apply block relative m-0 h-auto !important;
}
.choices[data-type*="select-one"] .choices__button {
right:auto !important;
}
.arrow, .arrow,
.arrow::before { .arrow::before {
position: absolute; position: absolute;
@@ -267,4 +203,8 @@
} }
[x-cloak] { [x-cloak] {
display:none display:none
} }
.tippy-box[data-theme~="dropdown"] .tippy-content{
padding: 0px;
}

2
resources/public/output.css
View File

File diff suppressed because one or more lines are too long

2
src/clj/auto_ap/ssr/company.clj
View File

@@ -271,7 +271,7 @@
"limit" 300})))) "limit" 300}))))
valid-clients (for [n name-like-ids valid-clients (for [n name-like-ids
:when (valid-client-ids n)] :when (valid-client-ids n)]
{"value" n "label" (pull-attr (dc/db conn) :client/name n)})] {"value" n "label" (pull-attr (dc/db conn) :client/name n) "warning" "this is bad"})]
{:body (take 10 valid-clients)})) {:body (take 10 valid-clients)}))
(def search (wrap-json-response search)) (def search (wrap-json-response search))

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

@@ -24,11 +24,10 @@
:class (fn [c] (-> c :class (fn [c] (-> c
(or "") (or "")
(hh/add-class "w-full p-4 modal-card flex max-h-[inherit]")))) (hh/add-class "w-full p-4 modal-card flex max-h-[inherit]"))))
[:div {:class "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white modal-content w-full flex flex-col max-h-full overflow-hidden"} [:div {:class "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white modal-content w-full flex flex-col max-h-full overflow-hidden" }
[:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0"} header] [:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0"} header]
[:div {:class "px-6 py-2 space-y-6 overflow-y-scroll w-full contents"} [:div {:class "px-6 py-2 space-y-6 overflow-y-scroll w-full shrink"}
#_[:div.bg-green-300.w-full.h-64
"hello"]
content] content]
(when footer [:div {:class "p-4"} (when footer [:div {:class "p-4"}
[:span.items-center.bg-red-100.text-red-800.text-xs.font-medium.mb-2.p-1.rounded-full.inline-flex (hx/alpine-appear {:x-show "unexpectedError" :class "dark:bg-red-900 dark:text-red-300"}) [:span.items-center.bg-red-100.text-red-800.text-xs.font-medium.mb-2.p-1.rounded-full.inline-flex (hx/alpine-appear {:x-show "unexpectedError" :class "dark:bg-red-900 dark:text-red-300"})

204
src/clj/auto_ap/ssr/components/inputs.clj
View File

@@ -38,31 +38,28 @@
(defn typeahead- [params] (defn typeahead- [params]
[:div.relative {:x-data (hx/json {:open false [:div.relative {:x-data (hx/json { :baseUrl (if (str/includes? (:url params) "?")
:baseUrl (if (str/includes? (:url params) "?")
(str (:url params) "&q=") (str (:url params) "&q=")
(str (:url params) "?q=")) (str (:url params) "?q="))
:value {:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))} :value {:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))}
:tippy nil
:search "" :search ""
:active -1 :active -1
:elements (if ((:value-fn params identity) (:value params)) :elements (if ((:value-fn params identity) (:value params))
[{:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))}] [{:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))}]
[]) [])
:popper nil })
:warning_badge nil})
:x-modelable "value.value" :x-modelable "value.value"
:x-model (:x-model params) :x-model (:x-model params)}
:x-init "popper = Popper.createPopper($refs.input, $refs.dropdown, {placement: 'bottom-start', strategy: 'fixed', modifiers: {name: 'offset', options: {offset: [0, 10]}}})
warning_badge = Popper.createPopper($refs.warning_badge, $refs.warning_pop, {placement: 'top', strategy: 'fixed', modifiers: {name: 'offset', options: {offset: [10,0 ]}}})"}
(if (:disabled params) (if (:disabled params)
[:span {:x-text "value.label"}] [:span {:x-text "value.label"}]
[:a {:class (-> (hh/add-class (or (:class params) "") default-input-classes) [:a {:class (-> (hh/add-class (or (:class params) "") default-input-classes)
(hh/add-class "cursor-pointer")) (hh/add-class "cursor-pointer"))
"@click.prevent" "open = !open; popper.update()" "x-tooltip.on.click" "{content: ()=>$refs.dropdown.innerHTML, placement: 'bottom', onMount(i) {htmx.process(i.popper); }, popperOptions: {strategy: 'fixed', modifiers: [{name: 'flip', options: {fallbackPlacements: ['top']}}]}, theme: 'dropdown', allowHTML: true, interactive:true}"
"@keydown.down.prevent.stop" "open = true; popper.update()" "@keydown.down.prevent.stop" "tippy.show();"
"@keydown.backspace" "value = {value: '', label: '' }" "@keydown.backspace" "tippy.hide(); value = {value: '', label: '' }"
:tabindex 0 :tabindex 0
:x-init (:x-init params) :x-init (str "$nextTick(() => tippy = $el.__x_tippy); " (:x-init params))
:x-ref "input"} :x-ref "input"}
[:input (-> params [:input (-> params
(dissoc :class) (dissoc :class)
@@ -81,63 +78,50 @@
[:span.flex-grow.text-left {"x-text" "value.label"}] [:span.flex-grow.text-left {"x-text" "value.label"}]
[:div {:class "w-3 h-3 m-1 inline ml-1 justify-self-end text-gray-500 self-center"} [:div {:class "w-3 h-3 m-1 inline ml-1 justify-self-end text-gray-500 self-center"}
svg/drop-down] svg/drop-down]
[:div {:x-show "value.warning" [:div {:x-show "value.warning" }
:x-ref "warning_badge" (tags/badge- {:class "peer"
:x-effect "if (value.warning) { $nextTick(()=> warning_badge.update()) }"} :x-tooltip "value.warning"} "!") ]]])
(tags/badge- {:class "peer"} "!")
[:template {:x-ref "dropdown"}
[:ul.dropdown-contents {:class "bg-gray-100 dark:bg-gray-600 ring-1"
"@keydown.escape" "tippy.hide(); value = {value: '', label: '' }; "
:x-destroy "if ($refs.input) {$refs.input.focus();}"}
[:div {:x-show "value.warning" [:input {:type "text"
:x-ref "warning_pop" :autofocus true
:class "hidden peer-hover:block bg-red-50 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 p-4" :class (-> (:class params)
:x-text "value.warning"}]]]]) (or "")
(hh/add-class default-input-classes)
[:ul.dropdown-contents {:class "bg-gray-100 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 ring-1" (hh/replace-wildcard ["rounded" "border"] "border-bottom bg-gray-100 rounded-t-lg w-full"))
"x-ref" "dropdown" "x-model" "search"
"@keydown.escape" "open = false; value = {value: '', label: '' }" "placeholder" (:placeholder params)
"x-transition:enter" "ease-[cubic-bezier(.3,2.3,.6,1)] duration-200" "@keydown.down.prevent" "active ++; active = active >= elements.length - 1 ? elements.length - 1 : active"
"x-transition:enter-start" "!opacity-0" "@keydown.up.prevent" "active --; active = active < 0 ? 0 : active"
"x-transition:enter-end" "!opacity-1" "@keydown.enter.prevent.stop" "tippy.hide(); value = elements.length > 0 ? $data.elements[active] : {'value': '', label: ''}; $refs.input.focus()"
"x-transition:leave" "ease-out duration-200" "x-init" "$el.focus(); $watch('search', s => { if($el.value.length > 2) {fetch(baseUrl + s).then(data=>data.json()).then(data => {elements = data; active=-1; tippy.popperInstance.update()}) }})"}]
"x-transition:leave-start" "!opacity-1" [:div.dropdown-options {:class "rounded-b-lg overflow-hidden"}
"x-transition:leave-end" "!opacity-0" [:template {:x-for "(element, index) in elements"}
"x-show " "open" [:li [:a {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-300 [&.active]:dark:bg-primary-700 text-gray-800 dark:text-gray-100"
"x-trap" "open" :href "#"
"@click.outside" "open=false;"} ":class" "active == index ? 'active' : ''"
"@mouseover" "active = index"
[:input {:type "text" "@mouseout" "active = -1"
:class (-> (:class params) "@click.prevent" "value = element; tippy.hide(); $refs.input.focus()"
(or "") "x-html" "element.label"}]]]
(hh/add-class default-input-classes) [:template {:x-if "elements.length == 0"}
(hh/replace-wildcard ["rounded" "border"] "border-bottom bg-gray-100 rounded-t-lg w-full")) [:li {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800 dark:text-gray-100 text-xs "}
"x-model" "search" "No results found"]]]]]])
"placeholder" (:placeholder params)
"@keydown.down.prevent" "active ++; active = active >= elements.length - 1 ? elements.length - 1 : active"
"@keydown.up.prevent" "active --; active = active < 0 ? 0 : active"
"@keydown.enter.prevent.stop" "open = false; value = elements.length > 0 ? $data.elements[active] : {'value': '', label: ''};"
"x-init" "$watch('search', s => { if($el.value.length > 2) {fetch(baseUrl + s).then(data=>data.json()).then(data => {elements = data; active=-1}) }})"}]
[:div.dropdown-options {:class "rounded-b-lg overflow-hidden"}
[:template {:x-for "(element, index) in elements"}
[:li [:a {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-300 [&.active]:dark:bg-primary-700 text-gray-800 dark:text-gray-100"
:href "#"
":class" "active == index ? 'active' : ''"
"@mouseover" "active = index"
"@mouseout" "active = -1"
"@click.prevent" "value = element; open=false; "
"x-html" "element.label"}]]]
[:template {:x-if "elements.length == 0"}
[:li {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800 dark:text-gray-100 text-xs "}
"No results found"]]]]])
(defn multi-typeahead- [params] (defn multi-typeahead- [params]
[:div.relative {:x-data (hx/json {:open false [:div.relative {:x-data (hx/json {:baseUrl (if (str/includes? (:url params) "?")
:baseUrl (if (str/includes? (:url params) "?")
(str (:url params) "&q=") (str (:url params) "&q=")
(str (:url params) "?q=")) (str (:url params) "?q="))
:value (map (fn [v] ((:value-fn params identity) v)) :value (map (fn [v] ((:value-fn params identity) v))
(:value params)) (:value params))
:tippy nil
:lookup (into {} :lookup (into {}
(map (fn [v] [ ((:value-fn params identity) v) (map (fn [v] [((:value-fn params identity) v)
((:content-fn params identity) v)]) ((:content-fn params identity) v)])
(:value params))) (:value params)))
:x-init (str "$watch('value', v => $dispatch('change')); ") :x-init (str "$watch('value', v => $dispatch('change')); ")
@@ -146,42 +130,40 @@
:elements (if ((:value-fn params identity) (:value params)) :elements (if ((:value-fn params identity) (:value params))
[{:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))}] [{:value ((:value-fn params identity) (:value params)) :label ((:content-fn params identity) (:value params))}]
[]) [])
:popper nil :x-ref "r"})
:warning_badge nil})
;; :x-modelable "value.value" TODO ;; :x-modelable "value.value" TODO
;; :x-model (:x-model params) TODO ;; :x-model (:x-model params) TODO
:x-init "value=new Set(value || []); popper = Popper.createPopper($refs.input, $refs.dropdown, {placement: 'bottom-start', strategy: 'fixed', modifiers: {name: 'offset', options: {offset: [0, 10]}}}) :x-init "value=new Set(value || []); "}
warning_badge = Popper.createPopper($refs.warning_badge, $refs.warning_pop, {placement: 'top', strategy: 'fixed', modifiers: {name: 'offset', options: {offset: [10,0 ]}}})"}
(if (:disabled params) (if (:disabled params)
[:span {:x-text "value.label"}] [:span {:x-text "value.label"}]
[:a {:class (-> (hh/add-class (or (:class params) "") default-input-classes) [:a {:class (-> (hh/add-class (or (:class params) "") default-input-classes)
(hh/add-class "cursor-pointer")) (hh/add-class "cursor-pointer"))
"@click.prevent" "open = !open; popper.update()" "x-tooltip.on.click.prevent" "{content: ()=>$refs.dropdown.innerHTML, placement: 'bottom', onMount(i) {htmx.process(i.popper); }, popperOptions: {strategy: 'fixed', modifiers: [{name: 'flip', options: {fallbackPlacements: ['top']}}]}, theme: 'dropdown', allowHTML: true, interactive:true}"
"@keydown.down.prevent.stop" "open = true; popper.update()" "@keydown.down.prevent.stop" "tippy.show();"
"@keydown.backspace" "tippy.hide(); value=new Set( []);"
:tabindex 0 :tabindex 0
:x-init (:x-init params) :x-init (str "$nextTick(() => tippy = $el.__x_tippy); " (:x-init params))
:x-ref "input"} :x-ref "input"}
[:template {:x-for "v in Array.from(value.values())"} [:template {:x-for "v in Array.from(value.values())"}
[:input (-> params [:input (-> params
(dissoc :class :value-fn :content-fn :placeholder :x-model) (dissoc :class :value-fn :content-fn :placeholder :x-model)
(assoc (assoc
:type "hidden" :type "hidden"
"x-bind:value" "v" "x-bind:value" "v"))]]
))]]
[:div.flex.w-full.justify-items-stretch [:div.flex.w-full.justify-items-stretch
[:div.flex-grow.flex [:div.flex-grow.flex
[:template {:x-if "value.size > 0"} [:template {:x-if "value.size > 0"}
[:a.bg-blue-100.rounded-full.px-3 {:x-data "popper()"} [:a.bg-blue-100.rounded-full.px-3 {:x-tooltip "{content: ()=>$refs.selected_tt.innerHTML, popperOptions: {strategy: 'fixed', modifiers: [{name: 'flip', options: {fallbackPlacements: ['top']}}]}, placement: 'bottom', theme: 'light', allowHTML: true, appendTo: $el}"}
[:span.text-left {:x-ref "source"} [:span.text-left {:x-ref "source"}
[:span {"x-text" "value.size"}] [:span {"x-text" "value.size"}]
" selected"] " selected"]
(buttons/tooltip- {:x-bind "tooltip" } [:template {:x-ref "selected_tt"}
[:div.flex.flex-wrap.gap-4.w-64 [:div.flex.flex-wrap.gap-4.w-64.p-4
[:template {:x-for "v in Array.from(value.values())"} [:template {:x-for "v in Array.from(value.values())"}
[:div.bg-green-50.rounded-full.px-3.text-ellipsis.whitespace-nowrap.shrink.overflow-hidden.text-green-800 {:x-text "lookup[v]"}]]])]] [:div.bg-green-50.rounded-full.px-3.text-ellipsis.whitespace-nowrap.shrink.overflow-hidden.text-green-800 {:x-text "lookup[v]"}]]]]]]
[:template {:x-if "value.size == 0"} [:template {:x-if "value.size == 0"}
[:span.text-left.text-gray-400 "None selected"]] [:span.text-left.text-gray-400 "None selected"]]
[:div {:class "w-4 h-4 ml-2 inline text-gray-500 self-center rounded-full bg-gray-100 text-gray-500" [:div {:class "w-4 h-4 ml-2 inline text-gray-500 self-center rounded-full bg-gray-100 text-gray-500"
"@click.prevent.stop" "value = new Set([])" "@click.prevent.stop" "value = new Set([])"
:x-show "value.size > 0"} :x-show "value.size > 0"}
@@ -192,52 +174,42 @@
:x-ref "warning_badge" :x-ref "warning_badge"
:x-effect "if (value.warning) { $nextTick(()=> warning_badge.update()) }"} :x-effect "if (value.warning) { $nextTick(()=> warning_badge.update()) }"}
(tags/badge- {:class "peer"} "!") (tags/badge- {:class "peer"} "!")
[:div {:x-show "value.warning" [:div {:x-show "value.warning"
:x-ref "warning_pop" :x-ref "warning_pop"
:class "hidden peer-hover:block bg-red-50 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 p-4" :class "hidden peer-hover:block bg-red-50 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 p-4"
:x-text "value.warning"}]]]]) :x-text "value.warning"}]]]
[:template {:x-ref "dropdown"}
[:ul.dropdown-contents {:class "bg-gray-100 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 ring-1"
"@keydown.escape.prevent" "tippy.hide();"
:x-destroy "if ($refs.input) {$refs.input.focus();}"}
[:ul.dropdown-contents {:class "bg-gray-100 dark:bg-gray-600 rounded-lg shadow-2xl w-max z-50 ring-1" [:input {:type "text"
"x-ref" "dropdown" :class (-> (:class params)
"@keydown.escape" "open = false;" (or "")
"x-transition:enter" "ease-[cubic-bezier(.3,2.3,.6,1)] duration-200" (hh/add-class default-input-classes)
"x-transition:enter-start" "!opacity-0" (hh/replace-wildcard ["rounded" "border"] "border-bottom bg-gray-100 rounded-t-lg w-full"))
"x-transition:enter-end" "!opacity-1" "x-model" "search"
"x-transition:leave" "ease-out duration-200" "placeholder" (:placeholder params)
"x-transition:leave-start" "!opacity-1" "@keydown.down.prevent" "active ++; active = active >= elements.length - 1 ? elements.length - 1 : active"
"x-transition:leave-end" "!opacity-0" "@keydown.up.prevent" "active --; active = active < 0 ? 0 : active"
"x-show " "open" "@keydown.enter.prevent.stop" "if ($data.elements[active]) { if (value.has($data.elements[active].value)) { value.delete($data.elements[active].value) } else {value.add($data.elements[active].value); lookup[$data.elements[active].value] = $data.elements[active].label} } "
"x-trap" "open" "x-init" " $el.focus(); $watch('search', s => { if($el.value.length > 2) {fetch(baseUrl + s).then(data=>data.json()).then(data => {elements = data; active=-1}) }})"}]
"@click.outside" "open=false;"} [:div.dropdown-options {:class "rounded-b-lg overflow-hidden"}
[:template {:x-for "(element, index) in elements"}
[:input {:type "text" [:li
:class (-> (:class params) [:label {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-300 [&.active]:dark:bg-primary-700 text-gray-800 dark:text-gray-100 cursor-pointer"
(or "") :href "#"
(hh/add-class default-input-classes) ":class" "active == index ? 'active' : ''"
(hh/replace-wildcard ["rounded" "border"] "border-bottom bg-gray-100 rounded-t-lg w-full")) "@mouseover" "active = index"
"x-model" "search" "@mouseout" "active = -1"
"placeholder" (:placeholder params) "@click.prevent" "if (value.has(element.value)) { value.delete(element.value) } else {value.add(element.value); lookup[element.value] = element.label}"}
"@keydown.down.prevent" "active ++; active = active >= elements.length - 1 ? elements.length - 1 : active" [:input {:type "checkbox" ":checked" "value.has(element.value)"}]
"@keydown.up.prevent" "active --; active = active < 0 ? 0 : active" [:span {"x-html" "element.label"}]]]]
"@keydown.enter.prevent.stop" "if ($data.elements[active]) { if (value.has($data.elements[active].value)) { value.delete($data.elements[active].value) } else {value.add($data.elements[active].value); lookup[$data.elements[active].value] = $data.elements[active].label} } " [:template {:x-if "elements.length == 0"}
"x-init" "$watch('search', s => { if($el.value.length > 2) {fetch(baseUrl + s).then(data=>data.json()).then(data => {elements = data; active=-1}) }})"}] [:li {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800 dark:text-gray-100 text-xs "}
[:div.dropdown-options {:class "rounded-b-lg overflow-hidden"} "No results found"]]]]]])])
[:template {:x-for "(element, index) in elements"}
[:li
[:label {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-300 [&.active]:dark:bg-primary-700 text-gray-800 dark:text-gray-100 cursor-pointer"
:href "#"
":class" "active == index ? 'active' : ''"
"@mouseover" "active = index"
"@mouseout" "active = -1"
"@click.prevent" "if (value.has(element.value)) { value.delete(element.value) } else {value.add(element.value); lookup[element.value] = element.label}"
}
[ :input {:type "checkbox" ":checked" "value.has(element.value)"} ]
[:span {"x-html" "element.label"}]]]]
[:template {:x-if "elements.length == 0"}
[:li {:class "px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800 dark:text-gray-100 text-xs "}
"No results found"]]]]])
(defn use-size [size] (defn use-size [size]

10
src/clj/auto_ap/ssr/components/tags.clj
View File

@@ -21,9 +21,9 @@
children)) children))
(defn badge- [params & children] (defn badge- [params & children]
[:div {:class (-> (hh/add-class "absolute inline-flex items-center justify-center w-6 h-6 text-xs font-black text-white [:div (merge params {:class (-> (hh/add-class "absolute inline-flex items-center justify-center w-6 h-6 text-xs font-black text-white
border-3 border-white rounded-full -top-2 -right-2 dark:border-gray-900" border-3 border-white rounded-full -top-2 -right-2 dark:border-gray-900"
(:class params) (:class params)
) )
(hh/add-class (or (some-> (:color params) (#(str "bg-" % "-300"))) (hh/add-class (or (some-> (:color params) (#(str "bg-" % "-300")))
"bg-red-300")))} children]) "bg-red-300")))}) children])

4
src/clj/auto_ap/ssr/ui.clj
View File

@@ -30,7 +30,6 @@
[:link {:rel "stylesheet", :href "/output.css"}] [:link {:rel "stylesheet", :href "/output.css"}]
[:script {:src "https://unpkg.com/hyperscript.org@0.9.7/dist/_hyperscript.min.js"}] [:script {:src "https://unpkg.com/hyperscript.org@0.9.7/dist/_hyperscript.min.js"}]
[:script {:src "https://unpkg.com/@popperjs/core@2.11.8/dist/umd/popper.min.js"}]
[:script {:src "https://cdn.plaid.com/link/v2/stable/link-initialize.js"}] [:script {:src "https://cdn.plaid.com/link/v2/stable/link-initialize.js"}]
[:script { :src "https://cdn.jsdelivr.net/npm/@ryangjchandler/alpine-tooltip@1.x.x/dist/cdn.min.js" :defer true}] [:script { :src "https://cdn.jsdelivr.net/npm/@ryangjchandler/alpine-tooltip@1.x.x/dist/cdn.min.js" :defer true}]
[:link {:rel "stylesheet" :href "https://unpkg.com/tippy.js@6/dist/tippy.css"}] [:link {:rel "stylesheet" :href "https://unpkg.com/tippy.js@6/dist/tippy.css"}]
@@ -49,9 +48,6 @@
[:script {:type "text/javascript", :src "https://cdn.yodlee.com/fastlink/v4/initialize.js", :async "async"}]] [:script {:type "text/javascript", :src "https://cdn.yodlee.com/fastlink/v4/initialize.js", :async "async"}]]
[:link {:rel "stylesheet" :href "https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/css/datepicker.min.css"}] [:link {:rel "stylesheet" :href "https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/css/datepicker.min.css"}]
[:script {:type "text/javascript" :src "https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/js/datepicker-full.min.js"}] [:script {:type "text/javascript" :src "https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/js/datepicker-full.min.js"}]
[:link {:rel "stylesheet" :href "https://cdn.jsdelivr.net/npm/choices.js@9.0.1/public/assets/styles/choices.min.css"}]
[:script {:src "https://cdn.jsdelivr.net/npm/choices.js@9.0.1/public/assets/scripts/choices.min.js"}]
[:script {:src "https://unpkg.com/htmx.org/dist/ext/response-targets.js"}] [:script {:src "https://unpkg.com/htmx.org/dist/ext/response-targets.js"}]
[:script {:src "https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js" :integrity "sha512-CQBWl4fJHWbryGE+Pc7UAxWMUMNMWzWxF4SQo9CgkJIN1kx6djDQZjh3Y8SZ1d+6I+1zze6Z7kHXO7q3UyZAWw==" :crossorigin "anonymous" :referrerpolicy "no-referrer"}] [:script {:src "https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js" :integrity "sha512-CQBWl4fJHWbryGE+Pc7UAxWMUMNMWzWxF4SQo9CgkJIN1kx6djDQZjh3Y8SZ1d+6I+1zze6Z7kHXO7q3UyZAWw==" :crossorigin "anonymous" :referrerpolicy "no-referrer"}]

2
src/clj/auto_ap/ssr/vendor.clj
View File

@@ -30,7 +30,7 @@
"fields" "id" "fields" "id"
"limit" 300}))) "limit" 300})))
valid-clients (for [n name-like-ids] valid-clients (for [n name-like-ids]
{"value" n "label" (pull-attr (dc/db conn) :vendor/name n)})] {"value" n "label" (pull-attr (dc/db conn) :vendor/name n)} )]
{:body (take 10 valid-clients)})) {:body (take 10 valid-clients)}))
(def search (wrap-json-response search)) (def search (wrap-json-response search))