Templui update to v0.84.0

.templui.json

@@ -1,5 +1,7 @@
 {
   "componentsDir": "server/web/templui/components",
   "utilsDir": "server/web/templui/utils",
-  "moduleName": "git.jmbit.de/jmb/scanfile"
+  "moduleName": "git.jmbit.de/jmb/scanfile",
+  "jsDir": "server/web/assets/js",
+  "jsPublicPath": "/assets/js"
 }

server/web/assets/js/avatar.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function n(e){if(!e||e.hasAttribute("data-initialized"))return;e.setAttribute("data-initialized","true");let t=e.querySelector("[data-avatar-image]"),a=e.querySelector("[data-avatar-fallback]");if(t&&a){t.style.display="none",a.style.display="none";let i=()=>{t.style.display="none",a.style.display=""},d=()=>{t.style.display="",a.style.display="none"};t.complete?t.naturalWidth>0&&t.naturalHeight>0?d():i():(t.addEventListener("load",d,{once:!0}),t.addEventListener("error",i,{once:!0}),setTimeout(()=>{t.complete&&!(t.naturalWidth>0&&t.naturalHeight>0)&&i()},50))}else a?a.style.display="":t&&(t.style.display="")}function l(e=document){e instanceof Element&&e.matches("[data-avatar]")&&n(e);for(let t of e.querySelectorAll("[data-avatar]:not([data-initialized])"))n(t)}window.templUI=window.templUI||{},window.templUI.avatar={init:l},document.addEventListener("DOMContentLoaded",()=>l())})();})();

server/web/assets/js/calendar.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function w(e){if(!e||e.hasAttribute("data-initialized"))return;e.setAttribute("data-initialized","true");let f=e.querySelector("[data-calendar-month-display]"),g=e.querySelector("[data-calendar-weekdays]"),h=e.querySelector("[data-calendar-days]"),v=e.querySelector("[data-calendar-prev]"),b=e.querySelector("[data-calendar-next]"),M=e.closest("[data-calendar-wrapper]"),y=M?M.querySelector("[data-calendar-hidden-input]"):null;if(!f||!g||!h||!v||!b||!y){console.error("Calendar init error: Missing required elements (or hidden input relative to wrapper).",e);return}let D=e.dataset.localeTag||"en-US",C;try{C=Array.from({length:12},(a,t)=>new Intl.DateTimeFormat(D,{month:"long",timeZone:"UTC"}).format(new Date(Date.UTC(2e3,t,1))))}catch(a){console.error(`Calendar: Error generating month names via Intl (locale: "${D}"). Falling back to English.`,a),C=["January","February","March","April","May","June","July","August","September","October","November","December"]}let U=["Su","Mo","Tu","We","Th","Fr","Sa"];try{U=Array.from({length:7},(a,t)=>new Intl.DateTimeFormat(D,{weekday:"short"}).format(new Date(Date.UTC(2e3,0,t))))}catch(a){console.error("Error generating calendar day names via Intl:",a)}let n=parseInt(e.dataset.initialMonth),l=parseInt(e.dataset.initialYear),u=null;e.dataset.selectedDate&&(u=E(e.dataset.selectedDate));function E(a){if(!a)return null;try{let t=a.split("-"),o=parseInt(t[0],10),i=parseInt(t[1],10)-1,c=parseInt(t[2],10),s=new Date(Date.UTC(o,i,c));if(!isNaN(s)&&s.getUTCFullYear()===o&&s.getUTCMonth()===i&&s.getUTCDate()===c)return s}catch{}return null}function p(){let a=Math.max(0,Math.min(11,n)),o=`${C[a]} ${l}`;f.textContent=o}function S(){g.innerHTML="",U.forEach(a=>{let t=document.createElement("div");t.className="text-center text-xs text-muted-foreground font-medium",t.textContent=a,g.appendChild(t)})}function m(){h.innerHTML="";let o=new Date(Date.UTC(l,n,1)).getUTCDay(),i=new Date(Date.UTC(l,n+1,0)).getUTCDate(),c=new Date,s=new Date(Date.UTC(c.getFullYear(),c.getMonth(),c.getDate()));for(let d=0;d<o;d++){let r=document.createElement("div");r.className="h-8 w-8",h.appendChild(r)}for(let d=1;d<=i;d++){let r=document.createElement("button");r.type="button",r.className="inline-flex h-8 w-8 items-center justify-center rounded-md text-sm font-medium focus:outline-none focus:ring-1 focus:ring-ring",r.textContent=d,r.dataset.day=d;let x=new Date(Date.UTC(l,n,d)),F=u&&x.getTime()===u.getTime(),q=x.getTime()===s.getTime();F?r.classList.add("bg-primary","text-primary-foreground","hover:bg-primary/90"):q?r.classList.add("bg-accent","text-accent-foreground"):r.classList.add("hover:bg-accent","hover:text-accent-foreground"),r.addEventListener("click",N),h.appendChild(r)}}function k(){n--,n<0&&(n=11,l--),p(),m()}function L(){n++,n>11&&(n=0,l++),p(),m()}function N(a){let t=parseInt(a.target.dataset.day);if(!t)return;let o=new Date(Date.UTC(l,n,t));u=o;let i=o.toISOString().split("T")[0];y.value=i,y.dispatchEvent(new Event("change",{bubbles:!0})),e.dispatchEvent(new CustomEvent("calendar-date-selected",{bubbles:!0,detail:{date:o}})),m()}v.addEventListener("click",k),b.addEventListener("click",L),p(),S(),m();let I=e.closest("form");I&&I.addEventListener("reset",()=>{u=null,y.value="",n=new Date().getMonth(),l=new Date().getFullYear(),p(),m()}),e._calendarInitialized=!0}function T(e=document){e instanceof Element&&e.matches("[data-calendar-container]")&&w(e);for(let f of e.querySelectorAll("[data-calendar-container]:not([data-initialized])"))w(f)}window.templUI=window.templUI||{},window.templUI.calendar={init:T},document.addEventListener("DOMContentLoaded",()=>T())})();})();

server/web/assets/js/carousel.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function c(n){if(!n||n.hasAttribute("data-initialized"))return;n.setAttribute("data-initialized","true");let o=n.querySelector(".carousel-track"),f=Array.from(o?.querySelectorAll(".carousel-item")||[]);if(f.length===0)return;let p=Array.from(n.querySelectorAll(".carousel-indicator")),i=n.querySelector(".carousel-prev"),a=n.querySelector(".carousel-next"),t={currentIndex:0,slideCount:f.length,autoplay:n.dataset.autoplay==="true",interval:parseInt(n.dataset.interval||5e3),loop:n.dataset.loop==="true",autoplayInterval:null,isHovering:!1,touchStartX:0};function v(){o.style.transform=`translateX(-${t.currentIndex*100}%)`}function y(){p.forEach((e,l)=>{l<t.slideCount?(l===t.currentIndex?(e.classList.add("bg-white"),e.classList.remove("bg-white/50")):(e.classList.remove("bg-white"),e.classList.add("bg-white/50")),e.style.display=""):e.style.display="none"})}function I(){i&&(i.disabled=!t.loop&&t.currentIndex===0,i.classList.toggle("opacity-50",i.disabled),i.classList.toggle("cursor-not-allowed",i.disabled)),a&&(a.disabled=!t.loop&&t.currentIndex===t.slideCount-1,a.classList.toggle("opacity-50",a.disabled),a.classList.toggle("cursor-not-allowed",a.disabled))}function s(){t.autoplayInterval&&clearInterval(t.autoplayInterval),t.autoplay&&(t.autoplayInterval=setInterval(()=>{t.isHovering||r()},t.interval))}function g(){t.autoplayInterval&&(clearInterval(t.autoplayInterval),t.autoplayInterval=null)}function r(){let e=t.currentIndex+1;if(e>=t.slideCount)if(t.loop)e=0;else return;u(e)}function h(){let e=t.currentIndex-1;if(e<0)if(t.loop)e=t.slideCount-1;else return;u(e)}function u(e){if(e<0||e>=t.slideCount)if(t.loop)e=(e+t.slideCount)%t.slideCount;else return;e!==t.currentIndex&&(t.currentIndex=e,v(),y(),I(),t.autoplay&&!t.isHovering&&(g(),s()))}o&&(o.addEventListener("touchstart",e=>{t.touchStartX=e.touches[0].clientX},{passive:!0}),o.addEventListener("touchend",e=>{let l=e.changedTouches[0].clientX,m=t.touchStartX-l;Math.abs(m)>50&&(m>0?r():h())},{passive:!0})),p.forEach((e,l)=>{l<t.slideCount&&e.addEventListener("click",()=>u(l))}),i&&i.addEventListener("click",h),a&&a.addEventListener("click",r),n.addEventListener("mouseenter",()=>{t.isHovering=!0,t.autoplay&&g()}),n.addEventListener("mouseleave",()=>{t.isHovering=!1,t.autoplay&&s()}),v(),y(),I(),t.autoplay&&s()}function d(n=document){n instanceof Element&&n.matches(".carousel-component")&&c(n);for(let o of n.querySelectorAll(".carousel-component:not([data-initialized])"))c(o)}window.templUI=window.templUI||{},window.templUI.carousel={init:d},document.addEventListener("DOMContentLoaded",()=>d())})();})();

server/web/assets/js/datepicker.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function D(e){if(!e||typeof e!="string")return null;let a=e.match(/^(\d{4})-(\d{2})-(\d{2})$/);if(!a)return null;let t=parseInt(a[1],10),n=parseInt(a[2],10)-1,i=parseInt(a[3],10),l=new Date(Date.UTC(t,n,i));return l.getUTCFullYear()===t&&l.getUTCMonth()===n&&l.getUTCDate()===i?l:null}function f(e,a,t){if(!e||isNaN(e.getTime()))return"";let n={timeZone:"UTC"};switch(a){case"locale-short":n.dateStyle="short";break;case"locale-long":n.dateStyle="long";break;case"locale-full":n.dateStyle="full";break;case"locale-medium":default:n.dateStyle="medium";break}try{return new Intl.DateTimeFormat(t,n).format(e)}catch(i){console.error(`Error formatting date with Intl (locale: ${t}, format: ${a}, timezone: UTC):`,i);try{let l={dateStyle:"medium",timeZone:"UTC"};return new Intl.DateTimeFormat(t,l).format(e)}catch(l){console.error(`Error formatting date with fallback Intl (locale: ${t}, timezone: UTC):`,l);let s=e.getUTCFullYear(),o=(e.getUTCMonth()+1).toString().padStart(2,"0"),r=e.getUTCDate().toString().padStart(2,"0");return`${s}-${o}-${r}`}}}function p(e){if(!e||e.hasAttribute("data-initialized"))return;e.setAttribute("data-initialized","true");let a=e.id,t=e.querySelector("[data-datepicker-display]"),n=a+"-calendar-instance",i=document.getElementById(n),l=n+"-hidden",s=document.getElementById(l),o=i,r=s;if(!i||!s){let d=e.getAttribute("aria-controls"),c=d?document.getElementById(d):null;if(c&&(o||(o=c.querySelector("[data-calendar-container]")),!r)){let u=c.querySelector("[data-calendar-wrapper]");r=u?u.querySelector("[data-calendar-hidden-input]"):null}}if(!t||!o||!r){console.error("DatePicker init error: Missing required elements.",{datePickerID:a,displaySpan:t,calendar:o,hiddenInput:r});return}let I=e.dataset.displayFormat||"locale-medium",C=e.dataset.localeTag||"en-US",m=e.dataset.placeholder||"Select a date",h=d=>{if(!d.detail||!d.detail.date||!(d.detail.date instanceof Date))return;let c=d.detail.date,u=f(c,I,C);t.textContent=u,t.classList.remove("text-muted-foreground");let S=e.closest("[data-popover]")?.querySelector("[data-popover-trigger]");S instanceof HTMLElement?S.click():e.click()},T=()=>{if(r&&r.value){let d=D(r.value);if(d){let c=f(d,I,C);t.textContent.trim()!==c&&(t.textContent=c,t.classList.remove("text-muted-foreground"))}else t.textContent=m,t.classList.add("text-muted-foreground")}else t.textContent=m,t.classList.add("text-muted-foreground")};o.addEventListener("calendar-date-selected",h),T(),e._datePickerInitialized=!0,e._datePickerCleanup=()=>{o&&o.removeEventListener("calendar-date-selected",h)};let k=e.closest("form");k&&k.addEventListener("reset",()=>{r&&(r.value=""),t.textContent=m,t.classList.add("text-muted-foreground")})}function y(e=document){e instanceof Element&&e.matches('[data-datepicker="true"]')&&p(e),e.querySelectorAll('[data-datepicker="true"]:not([data-initialized])').forEach(a=>{p(a)})}window.templUI=window.templUI||{},window.templUI.datePicker={init:y},document.addEventListener("DOMContentLoaded",()=>y())})();})();

server/web/assets/js/drawer.min.js

@@ -0,0 +1 @@
+(()=>{(function(){let d=new Map;function w(t,i){document.querySelectorAll(`[data-drawer-trigger="${t}"]`).forEach(n=>{n.setAttribute("data-open",i)})}function g(t,i){if(i)return"translate(0)";switch(t){case"left":return"translateX(-100%)";case"right":return"translateX(100%)";case"top":return"translateY(-100%)";case"bottom":return"translateY(100%)";default:return"translateX(100%)"}}function E(t){if(!t||t.hasAttribute("data-initialized"))return null;t.setAttribute("data-initialized","true");let i=t.id,n=document.getElementById(i+"-content"),v=n?.getAttribute("data-drawer-position")||"right",u=t.hasAttribute("data-initial-open");if(!n||!i)return null;let a=u;function l(e){a=e;let s=e?"block":"none",o=e?"1":"0";e&&(t.style.display=s,n.style.display=s,n.offsetHeight,t.style.transition="opacity 300ms ease",n.style.transition="opacity 300ms ease, transform 300ms ease"),t.style.opacity=o,n.style.opacity=o,n.style.transform=g(v,e),t.setAttribute("data-open",e),w(i,e),document.body.style.overflow=e?"hidden":""}function f(){l(!0),t.addEventListener("click",r),document.addEventListener("keydown",y),document.addEventListener("click",m)}function r(){l(!1),t.removeEventListener("click",r),document.removeEventListener("keydown",y),document.removeEventListener("click",m),setTimeout(()=>{a||(t.style.display="none",n.style.display="none")},300)}function A(){a?r():f()}function y(e){e.key==="Escape"&&a&&r()}function m(e){!n.contains(e.target)&&!h(e.target)&&r()}function h(e){let s=document.querySelectorAll(`[data-drawer-trigger="${i}"]`);return Array.from(s).some(o=>o.contains(e))}return n.querySelectorAll("[data-drawer-close]").forEach(e=>{e.addEventListener("click",r)}),n.querySelector("[data-drawer-inner]")?.addEventListener("click",e=>{e.stopPropagation()}),l(u),{open:f,close:r,toggle:A}}function c(t=document){t.querySelectorAll('[data-component="drawer"]:not([data-initialized])').forEach(i=>{let n=E(i);n&&i.id&&d.set(i.id,n)}),t.querySelectorAll("[data-drawer-trigger]").forEach(i=>{if(i.dataset.initialized)return;i.dataset.initialized="true";let n=i.getAttribute("data-drawer-trigger");i.addEventListener("click",()=>{d.get(n)?.toggle()})})}window.templUI=window.templUI||{},window.templUI.drawer={init:c},document.addEventListener("DOMContentLoaded",()=>c())})();})();

server/web/assets/js/dropdown.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function n(o){let t=o.currentTarget;if(t.dataset.preventClose==="true")return;let e=t.closest("[data-popover-id]");if(e){let d=e.dataset.popoverId;window.closePopover?window.closePopover(d,!0):(console.warn("popover.Script's closePopover function not found."),document.body.click())}}function i(o=document){o.querySelectorAll("[data-dropdown-item]:not([data-dropdown-submenu-trigger]):not([data-initialized])").forEach(e=>{e.setAttribute("data-initialized","true"),e.removeEventListener("click",n),e.addEventListener("click",n)})}window.templUI=window.templUI||{},window.templUI.dropdown={init:i},document.addEventListener("DOMContentLoaded",()=>i())})();})();

server/web/assets/js/input.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function s(t){t.hasAttribute("data-initialized")||(t.setAttribute("data-initialized","true"),t.addEventListener("click",function(){let n=t.getAttribute("data-toggle-password"),e=document.getElementById(n);if(e){let d=t.querySelector(".icon-open"),o=t.querySelector(".icon-closed");e.type==="password"?(e.type="text",d.classList.add("hidden"),o.classList.remove("hidden")):(e.type="password",d.classList.remove("hidden"),o.classList.add("hidden"))}}))}function i(t=document){t.querySelectorAll("[data-toggle-password]:not([data-initialized])").forEach(e=>{s(e)})}window.templUI=window.templUI||{},window.templUI.input={init:i},document.addEventListener("DOMContentLoaded",()=>i())})();})();

server/web/assets/js/inputotp.min.js

@@ -0,0 +1 @@
+(()=>{typeof window.inputOTPState>"u"&&(window.inputOTPState=new WeakMap);(function(){if(window.inputOTPSystemInitialized)return;function p(i){if(!i||i.hasAttribute("data-initialized"))return;i.setAttribute("data-initialized","true");let l=i.querySelector("[data-input-otp-value-target]"),n=Array.from(i.querySelectorAll("[data-input-otp-slot]")).sort((t,e)=>parseInt(t.dataset.inputIndex)-parseInt(e.dataset.inputIndex));if(!l||n.length===0)return;i.hasAttribute("autofocus")&&requestAnimationFrame(()=>{let t=n[0];t&&(t.focus(),t.select())});let s=()=>{l.value=n.map(t=>t.value).join("")},f=()=>n.findIndex(t=>!t.value),o=t=>{t>=0&&t<n.length&&(n[t].focus(),setTimeout(()=>n[t].select(),0))},v=t=>{let e=t.target,a=parseInt(e.dataset.inputIndex);if(e.value===" "){e.value="";return}e.value.length>1&&(e.value=e.value.slice(-1)),e.value&&a<n.length-1&&o(a+1),s()},I=t=>{let e=t.target,a=parseInt(e.dataset.inputIndex);if(t.key==="Backspace"){let u=e.value;a>0&&(t.preventDefault(),u?(e.value="",s(),o(a-1)):(n[a-1].value="",s(),o(a-1)))}else t.key==="ArrowLeft"&&a>0?(t.preventDefault(),o(a-1)):t.key==="ArrowRight"&&a<n.length-1&&(t.preventDefault(),o(a+1))},h=t=>{let e=t.target,a=parseInt(e.dataset.inputIndex),u=f();if(u!==-1&&a!==u){o(u);return}setTimeout(()=>e.select(),0)},w=t=>{t.preventDefault();let a=(t.clipboardData||window.clipboardData).getData("text").replace(/\s/g,"").split(""),u=0,g=n.find(r=>r===document.activeElement);g&&(u=parseInt(g.dataset.inputIndex));for(let r=0;r<a.length&&u<n.length;r++)n[u].value=a[r],u++;s();let d=f();d===-1?d=n.length-1:d>0&&d>u&&(d=u),o(Math.min(d,n.length-1))};for(let t of n)t.addEventListener("input",v),t.addEventListener("keydown",I),t.addEventListener("focus",h);i.addEventListener("paste",w);let m=l.id;if(m){for(let t of document.querySelectorAll(`label[for="${m}"]`))if(!t.dataset.inputOtpListener){let e=a=>{a.preventDefault(),n.length>0&&o(0)};t.addEventListener("click",e),t.dataset.inputOtpListener="true",t._inputOtpClickListener=e}}if(i.dataset.value){let t=i.dataset.value;for(let e=0;e<n.length&&e<t.length;e++)n[e].value=t[e];s()}let y={slots:n,hiddenInput:l,handleInput:v,handleKeydown:I,handleFocus:h,handlePaste:w};window.inputOTPState.set(i,y)}function L(i){let l=window.inputOTPState.get(i);if(!l)return;for(let s of l.slots)s.removeEventListener("input",l.handleInput),s.removeEventListener("keydown",l.handleKeydown),s.removeEventListener("focus",l.handleFocus);i.removeEventListener("paste",l.handlePaste);let n=l.hiddenInput.id;if(n)for(let s of document.querySelectorAll(`label[for="${n}"]`))s._inputOtpClickListener&&(s.removeEventListener("click",s._inputOtpClickListener),delete s._inputOtpClickListener,delete s.dataset.inputOtpListener);window.inputOTPState.delete(i)}function c(i=document){i instanceof Element&&i.matches("[data-input-otp]")&&p(i),i.querySelectorAll("[data-input-otp]:not([data-initialized])").forEach(p)}window.templUI=window.templUI||{},window.templUI.inputOTP={init:c,cleanup:L},document.addEventListener("DOMContentLoaded",()=>c()),window.inputOTPSystemInitialized=!0})();})();

server/web/assets/js/label.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function s(t){if(!t||t.hasAttribute("data-initialized")||(t.setAttribute("data-initialized","true"),!t.hasAttribute("for")||!t.hasAttribute("data-disabled-style")))return;let e=t.getAttribute("for"),i=e?document.getElementById(e):null,a=t.getAttribute("data-disabled-style");if(!a)return;let n=a.split(" ").filter(Boolean);function d(){i&&i.disabled?t.classList.add(...n):t.classList.remove(...n)}i&&new MutationObserver(u=>{for(let r of u)r.type==="attributes"&&r.attributeName==="disabled"&&d()}).observe(i,{attributes:!0,attributeFilter:["disabled"]}),d()}function o(t=document){t instanceof Element&&t.matches("label[for][data-disabled-style]")&&s(t);for(let e of t.querySelectorAll("label[for][data-disabled-style]:not([data-initialized])"))s(e)}document.addEventListener("DOMContentLoaded",()=>o())})();})();

server/web/assets/js/modal.min.js

@@ -0,0 +1 @@
+(()=>{(function(){let o=new Map,n=null;function b(t,e){document.querySelectorAll(`[data-modal-trigger="${t}"]`).forEach(a=>{a.setAttribute("data-open",e)})}function g(t){if(!t||t.hasAttribute("data-initialized"))return null;t.setAttribute("data-initialized","true");let e=t.id,a=t.querySelector("[data-modal-content]"),u=t.hasAttribute("data-initial-open");if(!a||!e)return null;let c=u;function l(i){c=i,t.style.display=i?"flex":"none",t.setAttribute("data-open",i),b(e,i),i?(n=e,document.body.style.overflow="hidden",t.classList.remove("opacity-0"),t.classList.add("opacity-100"),a.classList.remove("scale-95","opacity-0"),a.classList.add("scale-100","opacity-100"),setTimeout(()=>{a.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')?.focus()},50)):(n===e&&(n=null,document.body.style.overflow=""),t.classList.remove("opacity-100"),t.classList.add("opacity-0"),a.classList.remove("scale-100","opacity-100"),a.classList.add("scale-95","opacity-0"))}function f(){n&&n!==e&&o.get(n)?.close(!0),t.style.display="flex",t.offsetHeight,l(!0),document.addEventListener("keydown",y),document.addEventListener("click",p)}function s(i=!1){l(!1),document.removeEventListener("keydown",y),document.removeEventListener("click",p),i||setTimeout(()=>{c||(t.style.display="none")},300)}function L(){c?s():f()}function y(i){i.key==="Escape"&&c&&t.getAttribute("data-disable-esc")!=="true"&&s()}function p(i){t.getAttribute("data-disable-click-away")!=="true"&&!a.contains(i.target)&&!v(i.target)&&s()}function v(i){let d=i.closest("[data-modal-trigger]");return d&&d.getAttribute("data-modal-trigger")===e}return t.querySelectorAll("[data-modal-close]").forEach(i=>{i.addEventListener("click",s)}),l(u),{open:f,close:s,toggle:L}}function r(t=document){t.querySelectorAll("[data-modal]:not([data-initialized])").forEach(e=>{let a=g(e);a&&e.id&&o.set(e.id,a)}),t.querySelectorAll("[data-modal-trigger]").forEach(e=>{if(e.dataset.initialized)return;e.dataset.initialized="true";let a=e.getAttribute("data-modal-trigger");e.addEventListener("click",()=>{!e.hasAttribute("disabled")&&!e.classList.contains("opacity-50")&&o.get(a)?.toggle()})})}window.templUI=window.templUI||{},window.templUI.modal={init:r},document.addEventListener("DOMContentLoaded",()=>r())})();})();

server/web/assets/js/progress.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function n(t){if(!t||t.hasAttribute("data-initialized"))return;t.setAttribute("data-initialized","true");let i=t.querySelector("[data-progress-indicator]");if(!i)return;let d=parseFloat(t.getAttribute("aria-valuenow")||"0"),e=parseFloat(t.getAttribute("aria-valuemax")||"100");e<=0&&(e=100);let l=0;e>0&&(l=Math.max(0,Math.min(d,e))/e*100),i.style.width=l+"%"}function a(t=document){if(t instanceof Element&&t.matches('[role="progressbar"]')&&n(t),t&&typeof t.querySelectorAll=="function")for(let i of t.querySelectorAll('[role="progressbar"]:not([data-initialized])'))n(i)}window.templUI=window.templUI||{},window.templUI.progress={init:a},document.addEventListener("DOMContentLoaded",()=>a())})();})();

server/web/assets/js/rating.min.js

@@ -0,0 +1 @@
+(()=>{typeof window.ratingState>"u"&&(window.ratingState=new WeakMap);(function(){function h(e){if(!e||e.hasAttribute("data-initialized"))return;e.setAttribute("data-initialized","true");let r=window.ratingState.get(e);r&&I(e,r),e.dataset.ratingInitialized="true";let a={value:parseFloat(e.dataset.initialValue)||0,precision:parseFloat(e.dataset.precision)||1,readonly:e.dataset.readonly==="true",name:e.dataset.name||"",onlyInteger:e.dataset.onlyinteger==="true",maxValue:0},d=e.querySelector("[data-rating-input]"),s=Array.from(e.querySelectorAll("[data-rating-item]")),o=a.value,u=0,f={click:L,mouseover:g,mouseleave:x};function p(){let n=0;for(let t of s){let i=parseInt(t.dataset.ratingValue,10);!isNaN(i)&&i>n&&(n=i)}a.maxValue=Math.max(1,n),o=Math.max(0,Math.min(a.maxValue,o)),o=Math.round(o/a.precision)*a.precision,v()}function v(){d&&(d.value=o.toFixed(2))}function c(n){for(let t of s){let i=parseInt(t.dataset.ratingValue,10);if(isNaN(i))continue;let b=t.querySelector("[data-rating-item-foreground]");if(!b)continue;let l=n>0?n:o,M=i<=Math.floor(l),V=!M&&i-1<l&&l<i,N=V?(l-Math.floor(l))*100:0;b.style.width=M?"100%":V?`${N}%`:"0%"}}function S(n){if(a.readonly)return;let t=n;a.onlyInteger?t=Math.round(t):o===t&&t%1===0?t=Math.max(0,t-a.precision):t=Math.round(t/a.precision)*a.precision,o=Math.max(0,Math.min(a.maxValue,t)),u=0,v(),c(0),e.dispatchEvent(new CustomEvent("rating-change",{bubbles:!0,detail:{name:a.name,value:o,maxValue:a.maxValue}})),d&&(d.dispatchEvent(new Event("input",{bubbles:!0})),d.dispatchEvent(new Event("change",{bubbles:!0})))}function g(n){if(a.readonly)return;let t=n.target.closest("[data-rating-item]");t&&(u=parseInt(t.dataset.ratingValue,10),isNaN(u)||c(u))}function x(){a.readonly||(u=0,c(0))}function L(n){if(a.readonly)return;let t=n.target.closest("[data-rating-item]");if(!t)return;let i=parseInt(t.dataset.ratingValue,10);isNaN(i)||S(i)}if(p(),c(0),a.readonly){e.style.cursor="default";for(let n of s)n.style.cursor="default"}else e.addEventListener("click",f.click),e.addEventListener("mouseover",f.mouseover),e.addEventListener("mouseleave",f.mouseleave);let y=e.closest("form");y&&y.addEventListener("reset",()=>{o=a.value,u=0,v(),c(0)});let w=new MutationObserver(()=>{try{e.querySelectorAll("[data-rating-item]").length!==s.length&&(s=Array.from(e.querySelectorAll("[data-rating-item]")),p(),c(u>0?u:0))}catch(n){console.error("Error in rating MutationObserver:",n)}});w.observe(e,{childList:!0,subtree:!0});let A={handlers:f,observer:w,items:s};window.ratingState.set(e,A)}function I(e,r){!e||!r||(!e.dataset.readonly==="true"&&(e.removeEventListener("click",r.handlers.click),e.removeEventListener("mouseover",r.handlers.mouseover),e.removeEventListener("mouseleave",r.handlers.mouseleave)),r.observer&&r.observer.disconnect(),window.ratingState.delete(e),e.removeAttribute("data-rating-initialized"))}function m(e=document){e instanceof Element&&e.matches("[data-rating-component]")&&h(e),e&&typeof e.querySelectorAll=="function"&&e.querySelectorAll("[data-rating-component]:not([data-initialized])").forEach(h)}window.templUI=window.templUI||{},window.templUI.rating={init:m},document.addEventListener("DOMContentLoaded",()=>m())})();})();

server/web/assets/js/slider.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function i(t){if(t.hasAttribute("data-initialized"))return;t.setAttribute("data-initialized","true");let e=t.id;if(!e)return;let d=document.querySelectorAll(`[data-slider-value][data-slider-value-for="${e}"]`);function a(){d.forEach(l=>{l.textContent=t.value})}a(),t.addEventListener("input",a)}function n(t=document){t instanceof Element&&t.matches('input[type="range"][data-slider-input]')&&i(t);for(let e of t.querySelectorAll('input[type="range"][data-slider-input]:not([data-initialized])'))i(e)}window.templUI=window.templUI||{},window.templUI.slider={init:n},document.addEventListener("DOMContentLoaded",()=>n())})();})();

server/web/assets/js/tabs.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function o(e){if(e.hasAttribute("data-initialized"))return;e.setAttribute("data-initialized","true");let i=e.dataset.tabsId;if(!i)return;let d=Array.from(e.querySelectorAll(`[data-tabs-trigger][data-tabs-id="${i}"]`)),u=Array.from(e.querySelectorAll(`[data-tabs-content][data-tabs-id="${i}"]`)),n=e.querySelector(`[data-tabs-marker][data-tabs-id="${i}"]`);function b(t){!n||!t||(n.style.width=t.offsetWidth+"px",n.style.height=t.offsetHeight+"px",n.style.left=t.offsetLeft+"px")}function r(t){let f=null;for(let a of d){let s=a.dataset.tabsValue===t;a.dataset.state=s?"active":"inactive",a.classList.toggle("text-foreground",s),a.classList.toggle("bg-background",s),a.classList.toggle("shadow-xs",s),s&&(f=a)}for(let a of u){let s=a.dataset.tabsValue===t;a.dataset.state=s?"active":"inactive",a.classList.toggle("hidden",!s)}b(f)}let c=d.find(t=>t.dataset.state==="active")||d[0];c&&r(c.dataset.tabsValue);for(let t of d)t.addEventListener("click",()=>{r(t.dataset.tabsValue)})}function l(e=document){e instanceof Element&&e.matches("[data-tabs]")&&o(e);for(let i of e.querySelectorAll("[data-tabs]:not([data-initialized])"))o(i)}window.templUI=window.templUI||{},window.templUI.tabs={init:l},document.addEventListener("DOMContentLoaded",()=>l())})();})();

server/web/assets/js/tagsinput.min.js

@@ -0,0 +1,5 @@
+(()=>{(function(){function g(n){if(!n||n.hasAttribute("data-initialized"))return;n.setAttribute("data-initialized","true");let a=n.querySelector("[data-text-input]"),s=n.querySelector("[data-hidden-inputs]"),d=n.querySelector("[data-tags-container]"),h=n.dataset.name,l=a?a.hasAttribute("disabled"):!1;if(!a)return;function v(t,e){let o=document.createElement("div");o.setAttribute("data-tag-chip",""),o.className="inline-flex items-center gap-2 rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent bg-primary text-primary-foreground";let i=document.createElement("span");i.textContent=t;let r=document.createElement("button");return r.type="button",r.className="ml-1 text-current hover:text-destructive disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",r.setAttribute("data-tag-remove",""),e&&(r.disabled=!0),r.innerHTML=`
+        <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 pointer-events-none" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+          <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+        </svg>
+      `,o.appendChild(i),o.appendChild(r),o}function y(t){if(l)return;let e=t.trim();if(!e)return;let o=s.querySelectorAll('input[type="hidden"]');for(let w of o)if(w.value.toLowerCase()===e.toLowerCase()){a.value="";return}let i=v(e,l),r=document.createElement("input");r.type="hidden",r.name=h,r.value=e,d.appendChild(i),s.appendChild(r),a.value=""}function c(t){if(l)return;let e=t.closest("[data-tag-chip]");if(!e)return;let o=e.querySelector("span").textContent.trim(),i=s.querySelector(`input[type="hidden"][value="${o}"]`);i&&i.remove(),e.remove()}function p(t){if(t.key==="Enter"||t.key===",")t.preventDefault(),y(a.value);else if(t.key==="Backspace"&&a.value===""){t.preventDefault();let e=d.querySelector("[data-tag-chip]:last-child");if(e){let o=e.querySelector("[data-tag-remove]");o&&c(o)}}}function f(t){t.target.closest("[data-tag-remove]")?(t.preventDefault(),t.stopPropagation(),c(t.target.closest("[data-tag-remove]"))):t.target.closest("input")||a.focus()}a.removeEventListener("keydown",p),a.addEventListener("keydown",p),n.removeEventListener("click",f),n.addEventListener("click",f);let m=n.closest("form");m&&m.addEventListener("reset",()=>{d.querySelectorAll("[data-tag-chip]").forEach(t=>t.remove()),s.querySelectorAll('input[type="hidden"]').forEach(t=>t.remove()),a.value=""})}function u(n=document){n.querySelectorAll("[data-tags-input]:not([data-initialized])").forEach(g)}window.templUI=window.templUI||{},window.templUI.tagsInput={init:u},document.addEventListener("DOMContentLoaded",()=>u())})();})();

server/web/assets/js/textarea.min.js

@@ -0,0 +1 @@
+(()=>{(function(){function e(t){if(t.hasAttribute("data-initialized")||(t.setAttribute("data-initialized","true"),!(t.dataset.autoResize==="true")))return;let d=window.getComputedStyle(t).minHeight;function n(){t.style.height=d,t.style.height=`${t.scrollHeight}px`}n(),t.addEventListener("input",n)}function a(t=document){t instanceof Element&&t.matches("textarea[data-textarea]")&&e(t);for(let i of t.querySelectorAll("textarea[data-textarea]:not([data-initialized])"))e(i)}document.addEventListener("DOMContentLoaded",()=>a())})();})();

server/web/assets/js/toast.min.js

@@ -0,0 +1 @@
+(()=>{(function(){if(typeof window.toastHandler>"u"){let a=function(t){if(!t||t.hasAttribute("data-initialized")||(t.setAttribute("data-initialized","true"),window.toasts.has(t)))return;let i=parseInt(t.dataset.duration||"0"),r=t.querySelector("[data-toast-progress]"),d=t.querySelector("[data-toast-dismiss]"),e={timer:null,remaining:i,startTime:Date.now(),progress:r,paused:!1};window.toasts.set(t,e);function o(){clearTimeout(e.timer),t.classList.remove("toast-enter-active"),t.classList.add("toast-leave-active"),t.addEventListener("transitionend",()=>{t.remove(),window.toasts.delete(t)},{once:!0})}function u(n){n<=0||(clearTimeout(e.timer),e.startTime=Date.now(),e.remaining=n,e.paused=!1,e.timer=setTimeout(o,n),e.progress&&(e.progress.style.transition=`width ${n}ms linear`,e.progress.offsetWidth,e.progress.style.width="0%"))}function l(){if(!(e.paused||e.remaining<=0)&&(clearTimeout(e.timer),e.remaining-=Date.now()-e.startTime,e.paused=!0,e.progress)){let n=window.getComputedStyle(e.progress).width;e.progress.style.transition="none",e.progress.style.width=n}}function c(){!e.paused||e.remaining<=0||u(e.remaining)}i>0&&(t.addEventListener("mouseenter",l),t.addEventListener("mouseleave",c)),d&&d.addEventListener("click",o),setTimeout(()=>{t.classList.add("toast-enter-active"),e.progress&&(e.progress.style.width="100%"),u(i)},50)},s=function(t=document){let i=[];t instanceof Element&&t.matches("[data-toast]")&&(t.hasAttribute("data-initialized")||i.push(t)),t&&typeof t.querySelectorAll=="function"&&t.querySelectorAll("[data-toast]:not([data-initialized])").forEach(r=>{i.push(r)}),i.forEach(a)};var m=a,f=s;window.toastHandler=!0,window.toasts=new Map,window.templUI=window.templUI||{},window.templUI.toast={init:s},document.addEventListener("DOMContentLoaded",()=>s())}})();})();

server/web/assets/styles.css

@@ -639,6 +639,9 @@
   .left-2 {
     left: calc(var(--spacing) * 2);
   }
+  .left-3 {
+    left: calc(var(--spacing) * 3);
+  }
   .isolate {
     isolation: isolate;
   }
@@ -1013,6 +1016,9 @@
   .max-h-\[250px\] {
     max-height: 250px;
   }
+  .max-h-\[300px\] {
+    max-height: 300px;
+  }
   .max-h-\[501px\] {
     max-height: 501px;
   }
@@ -1031,6 +1037,9 @@
   .max-h-screen {
     max-height: 100vh;
   }
+  .min-h-0 {
+    min-height: calc(var(--spacing) * 0);
+  }
   .min-h-\[80px\] {
     min-height: 80px;
   }
@@ -1136,6 +1145,9 @@
   .max-w-7xl {
     max-width: var(--container-7xl);
   }
+  .max-w-full {
+    max-width: 100%;
+  }
   .max-w-md {
     max-width: var(--container-md);
   }
@@ -1943,6 +1955,9 @@
   .rounded-md {
     border-radius: calc(var(--radius) - 2px);
   }
+  .rounded-none {
+    border-radius: 0;
+  }
   .rounded-sm {
     border-radius: calc(var(--radius) - 4px);
   }
@@ -2616,6 +2631,9 @@
   .object-top-right {
     object-position: right top;
   }
+  .p-0 {
+    padding: calc(var(--spacing) * 0);
+  }
   .p-1 {
     padding: calc(var(--spacing) * 1);
   }
@@ -2634,6 +2652,9 @@
   .p-8 {
     padding: calc(var(--spacing) * 8);
   }
+  .px-0 {
+    padding-inline: calc(var(--spacing) * 0);
+  }
   .px-2 {
     padding-inline: calc(var(--spacing) * 2);
   }
@@ -2709,6 +2730,9 @@
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
   }
+  .pl-8 {
+    padding-left: calc(var(--spacing) * 8);
+  }
   .text-center {
     text-align: center;
   }
@@ -2923,6 +2947,9 @@
   .text-card-foreground {
     color: var(--card-foreground);
   }
+  .text-current {
+    color: currentcolor;
+  }
   .text-destructive {
     color: var(--destructive);
   }
@@ -3194,6 +3221,12 @@
   .ring-destructive {
     --tw-ring-color: var(--destructive);
   }
+  .ring-destructive\/20 {
+    --tw-ring-color: var(--destructive);
+    @supports (color: color-mix(in lab, red, red)) {
+      --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+    }
+  }
   .ring-ring {
     --tw-ring-color: var(--ring);
   }
@@ -3262,6 +3295,9 @@
   .filter {
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
+  .filter\! {
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
+  }
   .backdrop-blur {
     --tw-backdrop-blur: blur(8px);
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
@@ -3798,6 +3834,25 @@
       border-color: #f3d5a3;
     }
   }
+  .focus-within\:border-ring {
+    &:focus-within {
+      border-color: var(--ring);
+    }
+  }
+  .focus-within\:ring-\[3px\] {
+    &:focus-within {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .focus-within\:ring-ring\/50 {
+    &:focus-within {
+      --tw-ring-color: var(--ring);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+      }
+    }
+  }
   .hover\:-translate-y-px {
     &:hover {
       @media (hover: hover) {
@@ -3918,6 +3973,13 @@
       }
     }
   }
+  .hover\:text-destructive {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--destructive);
+      }
+    }
+  }
   .hover\:text-foreground {
     &:hover {
       @media (hover: hover) {
@@ -4016,6 +4078,11 @@
       outline-style: none;
     }
   }
+  .focus-visible\:border-ring {
+    &:focus-visible {
+      border-color: var(--ring);
+    }
+  }
   .focus-visible\:ring-0 {
     &:focus-visible {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -4034,11 +4101,33 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
+  .focus-visible\:ring-\[3px\] {
+    &:focus-visible {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .focus-visible\:ring-destructive\/20 {
+    &:focus-visible {
+      --tw-ring-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
+      }
+    }
+  }
   .focus-visible\:ring-ring {
     &:focus-visible {
       --tw-ring-color: var(--ring);
     }
   }
+  .focus-visible\:ring-ring\/50 {
+    &:focus-visible {
+      --tw-ring-color: var(--ring);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+      }
+    }
+  }
   .focus-visible\:ring-offset-0 {
     &:focus-visible {
       --tw-ring-offset-width: 0px;
@@ -4093,6 +4182,11 @@
       opacity: 50%;
     }
   }
+  .disabled\:opacity-100 {
+    &:disabled {
+      opacity: 100%;
+    }
+  }
   .has-\[\>svg\]\:px-2\.5 {
     &:has(>svg) {
       padding-inline: calc(var(--spacing) * 2.5);
@@ -4349,6 +4443,40 @@
       padding-inline: calc(var(--spacing) * 8);
     }
   }
+  .dark\:border-input {
+    &:where(.dark, .dark *) {
+      border-color: var(--input);
+    }
+  }
+  .dark\:bg-destructive\/60 {
+    &:where(.dark, .dark *) {
+      background-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
+      }
+    }
+  }
+  .dark\:bg-input\/30 {
+    &:where(.dark, .dark *) {
+      background-color: var(--input);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--input) 30%, transparent);
+      }
+    }
+  }
+  .dark\:bg-transparent {
+    &:where(.dark, .dark *) {
+      background-color: transparent;
+    }
+  }
+  .dark\:ring-destructive\/40 {
+    &:where(.dark, .dark *) {
+      --tw-ring-color: var(--destructive);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
+      }
+    }
+  }
   .dark\:ring-ring\/20 {
     &:where(.dark, .dark *) {
       --tw-ring-color: var(--ring);
@@ -4365,6 +4493,40 @@
       }
     }
   }
+  .dark\:hover\:bg-accent\/50 {
+    &:where(.dark, .dark *) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--accent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--accent) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .dark\:hover\:bg-input\/50 {
+    &:where(.dark, .dark *) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--input);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--input) 50%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .dark\:focus-visible\:ring-destructive\/40 {
+    &:where(.dark, .dark *) {
+      &:focus-visible {
+        --tw-ring-color: var(--destructive);
+        @supports (color: color-mix(in lab, red, red)) {
+          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
+        }
+      }
+    }
+  }
   .dark\:aria-invalid\:border-destructive {
     &:where(.dark, .dark *) {
       &[aria-invalid="true"] {
@@ -4586,6 +4748,11 @@
       }
     }
   }
+  .\[\&\>svg\]\:pointer-events-none {
+    &>svg {
+      pointer-events: none;
+    }
+  }
   .\[\&\>svg\]\:absolute {
     &>svg {
       position: absolute;
@@ -4601,6 +4768,12 @@
       left: calc(var(--spacing) * 4);
     }
   }
+  .\[\&\>svg\]\:size-3 {
+    &>svg {
+      width: calc(var(--spacing) * 3);
+      height: calc(var(--spacing) * 3);
+    }
+  }
   .\[\&\>svg\+div\]\:translate-y-\[-3px\] {
     &>svg+div {
       --tw-translate-y: -3px;
@@ -4615,6 +4788,60 @@
       }
     }
   }
+  .\[a\&\]\:hover\:bg-accent {
+    a& {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--accent);
+        }
+      }
+    }
+  }
+  .\[a\&\]\:hover\:bg-destructive\/90 {
+    a& {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--destructive);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[a\&\]\:hover\:bg-primary\/90 {
+    a& {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--primary);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--primary) 90%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[a\&\]\:hover\:bg-secondary\/90 {
+    a& {
+      &:hover {
+        @media (hover: hover) {
+          background-color: var(--secondary);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--secondary) 90%, transparent);
+          }
+        }
+      }
+    }
+  }
+  .\[a\&\]\:hover\:text-accent-foreground {
+    a& {
+      &:hover {
+        @media (hover: hover) {
+          color: var(---accent-foreground);
+        }
+      }
+    }
+  }
 }
 :root {
   --background: hsl(0 0% 100%);

server/web/fileView.templ

@@ -28,7 +28,7 @@ templ FileView(file sqlc.File, fileProperties sqlc.FileProperty) {
 
 templ FileViewDeleteModal(fileid string) {
 @modal.Trigger(modal.TriggerProps{
-	  ModalID: "delete-modal",
+	  For: "delete-modal",
     Class: "p-1",
 	}) {
     @button.Button(button.Props{
@@ -52,14 +52,14 @@ templ FileViewDeleteModal(fileid string) {
 		@modal.Footer() {
 			<div class="flex gap-2">
 				@modal.Close(modal.CloseProps{
-					ModalID: "delete-modal",
+					For: "delete-modal",
 				}) {
 					@button.Button() {
 						Cancel
 					}
 				}
 				@modal.Close(modal.CloseProps{
-					ModalID: "delete-modal",
+					For: "delete-modal",
 				}) {
 					@button.Button(button.Props{
 						Variant: button.VariantDestructive,
@@ -76,7 +76,7 @@ templ FileViewDeleteModal(fileid string) {
 
 templ FileViewDownloadModal(fileid string) {
  @modal.Trigger(modal.TriggerProps{
-	  ModalID: "download-modal",
+	  For: "download-modal",
     Class: "p-1",
 	}) {
     @button.Button(button.Props{
@@ -100,14 +100,14 @@ templ FileViewDownloadModal(fileid string) {
 		@modal.Footer() {
 			<div class="flex gap-2">
 				@modal.Close(modal.CloseProps{
-					ModalID: "download-modal",
+					For: "download-modal",
 				}) {
 					@button.Button() {
 						Cancel
 					}
 				}
 				@modal.Close(modal.CloseProps{
-					ModalID: "download-modal",
+					For: "download-modal",
 				}) {
 					@button.Button(button.Props{
 						Variant: button.VariantDestructive,

server/web/fileView_templ.go

@@ -166,8 +166,8 @@ func FileViewDeleteModal(fileid string) templ.Component {
 			return nil
 		})
 		templ_7745c5c3_Err = modal.Trigger(modal.TriggerProps{
-			ModalID: "delete-modal",
+			For:   "delete-modal",
-			Class:   "p-1",
+			Class: "p-1",
 		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
@@ -289,7 +289,7 @@ func FileViewDeleteModal(fileid string) templ.Component {
 					return nil
 				})
 				templ_7745c5c3_Err = modal.Close(modal.CloseProps{
-					ModalID: "delete-modal",
+					For: "delete-modal",
 				}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
@@ -334,7 +334,7 @@ func FileViewDeleteModal(fileid string) templ.Component {
 					return nil
 				})
 				templ_7745c5c3_Err = modal.Close(modal.CloseProps{
-					ModalID: "delete-modal",
+					For: "delete-modal",
 				}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var13), templ_7745c5c3_Buffer)
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
@@ -431,8 +431,8 @@ func FileViewDownloadModal(fileid string) templ.Component {
 			return nil
 		})
 		templ_7745c5c3_Err = modal.Trigger(modal.TriggerProps{
-			ModalID: "download-modal",
+			For:   "download-modal",
-			Class:   "p-1",
+			Class: "p-1",
 		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var16), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
@@ -554,7 +554,7 @@ func FileViewDownloadModal(fileid string) templ.Component {
 					return nil
 				})
 				templ_7745c5c3_Err = modal.Close(modal.CloseProps{
-					ModalID: "download-modal",
+					For: "download-modal",
 				}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var22), templ_7745c5c3_Buffer)
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
@@ -599,7 +599,7 @@ func FileViewDownloadModal(fileid string) templ.Component {
 					return nil
 				})
 				templ_7745c5c3_Err = modal.Close(modal.CloseProps{
-					ModalID: "download-modal",
+					For: "download-modal",
 				}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var24), templ_7745c5c3_Buffer)
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err

server/web/templui/components/accordion/accordion.templ

@@ -1,4 +1,4 @@
-// templui component accordion - version: main installed by templui v0.71.0
+// templui component accordion - version: v0.84.0 installed by templui v0.84.0
 package accordion
 
 import (

server/web/templui/components/accordion/accordion_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component accordion - version: main installed by templui v0.71.0
+// templui component accordion - version: v0.84.0 installed by templui v0.84.0
 
 package accordion
 

server/web/templui/components/alert/alert.templ

@@ -1,4 +1,4 @@
-// templui component alert - version: main installed by templui v0.71.0
+// templui component alert - version: v0.84.0 installed by templui v0.84.0
 package alert
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"

server/web/templui/components/alert/alert_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component alert - version: main installed by templui v0.71.0
+// templui component alert - version: v0.84.0 installed by templui v0.84.0
 
 package alert
 

server/web/templui/components/aspectratio/aspectratio.templ

@@ -0,0 +1,62 @@
+// templui component aspectratio - version: v0.84.0 installed by templui v0.84.0
+package aspectratio
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Ratio string
+
+const (
+	RatioAuto     Ratio = "auto"
+	RatioSquare   Ratio = "square"
+	RatioVideo    Ratio = "video"
+	RatioPortrait Ratio = "portrait"
+	RatioWide     Ratio = "wide"
+)
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Ratio      Ratio
+}
+
+templ AspectRatio(props ...Props) {
+	{{ var p Props }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"relative w-full",
+				ratioClass(p.Ratio),
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		<div class="absolute inset-0">
+			{ children... }
+		</div>
+	</div>
+}
+
+func ratioClass(ratio Ratio) string {
+	switch ratio {
+	case RatioSquare:
+		return "aspect-square"
+	case RatioVideo:
+		return "aspect-video"
+	case RatioPortrait:
+		return "aspect-[3/4]"
+	case RatioWide:
+		return "aspect-[2/1]"
+	case RatioAuto:
+		return "aspect-auto"
+	default:
+		return "aspect-auto"
+	}
+}

server/web/templui/components/aspectratio/aspectratio_templ.go

@@ -0,0 +1,145 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component aspectratio - version: v0.84.0 installed by templui v0.84.0
+
+package aspectratio
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Ratio string
+
+const (
+	RatioAuto     Ratio = "auto"
+	RatioSquare   Ratio = "square"
+	RatioVideo    Ratio = "video"
+	RatioPortrait Ratio = "portrait"
+	RatioWide     Ratio = "wide"
+)
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Ratio      Ratio
+}
+
+func AspectRatio(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var2 = []any{
+			utils.TwMerge(
+				"relative w-full",
+				ratioClass(p.Ratio),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/aspectratio/aspectratio.templ`, Line: 30, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var4 string
+		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/aspectratio/aspectratio.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "><div class=\"absolute inset-0\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func ratioClass(ratio Ratio) string {
+	switch ratio {
+	case RatioSquare:
+		return "aspect-square"
+	case RatioVideo:
+		return "aspect-video"
+	case RatioPortrait:
+		return "aspect-[3/4]"
+	case RatioWide:
+		return "aspect-[2/1]"
+	case RatioAuto:
+		return "aspect-auto"
+	default:
+		return "aspect-auto"
+	}
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/avatar/avatar.templ

@@ -1,4 +1,4 @@
-// templui component avatar - version: main installed by templui v0.71.0
+// templui component avatar - version: v0.84.0 installed by templui v0.84.0
 package avatar
 
 import (
@@ -52,7 +52,6 @@ type GroupProps struct {
 }
 
 templ Avatar(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -188,7 +187,7 @@ func Initials(name string) string {
 			break
 		}
 		if len(part) > 0 {
-			initials += string(part[0])
+			initials += string([]rune(part)[0])
 		}
 	}
 	return strings.ToUpper(initials)
@@ -221,71 +220,6 @@ func avatarAlt(p ImageProps) string {
 	return ""
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/avatar.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE
-				function initAvatar(avatar) {
-					const image = avatar.querySelector('[data-avatar-image]');
-					const fallback = avatar.querySelector('[data-avatar-fallback]');
-
-					if (image && fallback) {
-						image.style.display = 'none';
-						fallback.style.display = 'none';
-
-						const showFallback = () => {
-							image.style.display = 'none';
-							fallback.style.display = '';
-						};
-
-						const showImage = () => {
-							image.style.display = '';
-							fallback.style.display = 'none';
-						};
-
-						if (image.complete) {
-							image.naturalWidth > 0 && image.naturalHeight > 0 ? showImage() : showFallback();
-						} else {
-							image.addEventListener('load', showImage, { once: true });
-							image.addEventListener('error', showFallback, { once: true });
-							
-							setTimeout(() => {
-								if (image.complete && !(image.naturalWidth > 0 && image.naturalHeight > 0)) {
-									showFallback();
-								}
-							}, 50);
-						}
-					} else if (fallback) {
-						fallback.style.display = '';
-					} else if (image) {
-						image.style.display = '';
-					}
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-avatar]')) {
-						initAvatar(root);
-					}
-
-					for (const avatar of root.querySelectorAll('[data-avatar]')) {
-						initAvatar(avatar);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/avatar/avatar_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component avatar - version: main installed by templui v0.71.0
+// templui component avatar - version: v0.84.0 installed by templui v0.84.0
 
 package avatar
 
@@ -81,10 +81,6 @@ func Avatar(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		var p Props
 		if len(props) > 0 {
 			p = props[0]
@@ -114,7 +110,7 @@ func Avatar(props ...Props) templ.Component {
 			var templ_7745c5c3_Var3 string
 			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 63, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 62, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
@@ -210,7 +206,7 @@ func Image(props ...ImageProps) templ.Component {
 			var templ_7745c5c3_Var7 string
 			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 88, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 87, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
 			if templ_7745c5c3_Err != nil {
@@ -229,7 +225,7 @@ func Image(props ...ImageProps) templ.Component {
 			var templ_7745c5c3_Var8 string
 			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.Src)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 91, Col: 14}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 90, Col: 14}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 			if templ_7745c5c3_Err != nil {
@@ -247,7 +243,7 @@ func Image(props ...ImageProps) templ.Component {
 		var templ_7745c5c3_Var9 string
 		templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(avatarAlt(p))
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 93, Col: 20}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 92, Col: 20}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
 		if templ_7745c5c3_Err != nil {
@@ -329,7 +325,7 @@ func Fallback(props ...FallbackProps) templ.Component {
 			var templ_7745c5c3_Var13 string
 			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 113, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 112, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
 			if templ_7745c5c3_Err != nil {
@@ -425,7 +421,7 @@ func Group(props ...GroupProps) templ.Component {
 			var templ_7745c5c3_Var17 string
 			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 134, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 133, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
 			if templ_7745c5c3_Err != nil {
@@ -522,7 +518,7 @@ func GroupOverflow(count int, props ...Props) templ.Component {
 			var templ_7745c5c3_Var21 string
 			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 156, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 155, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
 			if templ_7745c5c3_Err != nil {
@@ -561,7 +557,7 @@ func GroupOverflow(count int, props ...Props) templ.Component {
 		var templ_7745c5c3_Var23 string
 		templ_7745c5c3_Var23, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprint(count))
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 168, Col: 56}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 167, Col: 56}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var23))
 		if templ_7745c5c3_Err != nil {
@@ -594,7 +590,7 @@ func Initials(name string) string {
 			break
 		}
 		if len(part) > 0 {
-			initials += string(part[0])
+			initials += string([]rune(part)[0])
 		}
 	}
 	return strings.ToUpper(initials)
@@ -627,8 +623,6 @@ func avatarAlt(p ImageProps) string {
 	return ""
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -650,38 +644,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var24 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var25 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "<script defer src=\"/assets/js/avatar.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "<script defer nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var26 string
-			templ_7745c5c3_Var26, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/avatar/avatar.templ`, Line: 228, Col: 43}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var26))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\">\n\t\t\t(function() { // IIFE\n\t\t\t\tfunction initAvatar(avatar) {\n\t\t\t\t\tconst image = avatar.querySelector('[data-avatar-image]');\n\t\t\t\t\tconst fallback = avatar.querySelector('[data-avatar-fallback]');\n\n\t\t\t\t\tif (image && fallback) {\n\t\t\t\t\t\timage.style.display = 'none';\n\t\t\t\t\t\tfallback.style.display = 'none';\n\n\t\t\t\t\t\tconst showFallback = () => {\n\t\t\t\t\t\t\timage.style.display = 'none';\n\t\t\t\t\t\t\tfallback.style.display = '';\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tconst showImage = () => {\n\t\t\t\t\t\t\timage.style.display = '';\n\t\t\t\t\t\t\tfallback.style.display = 'none';\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (image.complete) {\n\t\t\t\t\t\t\timage.naturalWidth > 0 && image.naturalHeight > 0 ? showImage() : showFallback();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\timage.addEventListener('load', showImage, { once: true });\n\t\t\t\t\t\t\timage.addEventListener('error', showFallback, { once: true });\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\t\tif (image.complete && !(image.naturalWidth > 0 && image.naturalHeight > 0)) {\n\t\t\t\t\t\t\t\t\tshowFallback();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}, 50);\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (fallback) {\n\t\t\t\t\t\tfallback.style.display = '';\n\t\t\t\t\t} else if (image) {\n\t\t\t\t\t\timage.style.display = '';\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('[data-avatar]')) {\n\t\t\t\t\t\tinitAvatar(root);\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (const avatar of root.querySelectorAll('[data-avatar]')) {\n\t\t\t\t\t\tinitAvatar(avatar);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // End of IIFE\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var25), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/badge/badge.templ

@@ -1,4 +1,4 @@
-// templui component badge - version: main installed by templui v0.71.0
+// templui component badge - version: v0.84.0 installed by templui v0.84.0
 package badge
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
@@ -24,15 +24,16 @@ templ Badge(props ...Props) {
 	if len(props) > 0 {
 		{{ p = props[0] }}
 	}
-	<div
+	<span
 		if p.ID != "" {
 			id={ p.ID }
 		}
 		class={
 			utils.TwMerge(
-				"inline-flex items-center gap-2",
+				"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none",
-				"rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors",
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-				"focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2",
+				"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+				"transition-[color,box-shadow] overflow-hidden",
 				p.variantClasses(),
 				p.Class,
 			),
@@ -40,18 +41,18 @@ templ Badge(props ...Props) {
 		{ p.Attributes... }
 	>
 		{ children... }
-	</div>
+	</span>
 }
 
 func (p Props) variantClasses() string {
 	switch p.Variant {
 	case VariantDestructive:
-		return "border-transparent bg-destructive text-destructive-foreground"
+		return "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
 	case VariantOutline:
-		return "text-foreground border-border"
+		return "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
 	case VariantSecondary:
-		return "border-transparent bg-secondary text-secondary-foreground"
+		return "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90"
 	default:
-		return "border-transparent bg-primary text-primary-foreground"
+		return "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90"
 	}
 }

server/web/templui/components/badge/badge_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component badge - version: main installed by templui v0.71.0
+// templui component badge - version: v0.84.0 installed by templui v0.84.0
 
 package badge
 
@@ -55,9 +55,10 @@ func Badge(props ...Props) templ.Component {
 		}
 		var templ_7745c5c3_Var2 = []any{
 			utils.TwMerge(
-				"inline-flex items-center gap-2",
+				"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none",
-				"rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors",
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-				"focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2",
+				"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+				"transition-[color,box-shadow] overflow-hidden",
 				p.variantClasses(),
 				p.Class,
 			),
@@ -66,7 +67,7 @@ func Badge(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<span")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -118,7 +119,7 @@ func Badge(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</span>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -129,13 +130,13 @@ func Badge(props ...Props) templ.Component {
 func (p Props) variantClasses() string {
 	switch p.Variant {
 	case VariantDestructive:
-		return "border-transparent bg-destructive text-destructive-foreground"
+		return "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
 	case VariantOutline:
-		return "text-foreground border-border"
+		return "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
 	case VariantSecondary:
-		return "border-transparent bg-secondary text-secondary-foreground"
+		return "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90"
 	default:
-		return "border-transparent bg-primary text-primary-foreground"
+		return "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90"
 	}
 }
 

server/web/templui/components/breadcrumb/breadcrumb.templ

@@ -1,4 +1,4 @@
-// templui component breadcrumb - version: main installed by templui v0.71.0
+// templui component breadcrumb - version: v0.84.0 installed by templui v0.84.0
 package breadcrumb
 
 import (

server/web/templui/components/breadcrumb/breadcrumb_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component breadcrumb - version: main installed by templui v0.71.0
+// templui component breadcrumb - version: v0.84.0 installed by templui v0.84.0
 
 package breadcrumb
 

server/web/templui/components/button/button.templ

@@ -1,4 +1,4 @@
-// templui component button - version: main installed by templui v0.71.0
+// templui component button - version: v0.84.0 installed by templui v0.84.0
 package button
 
 import (
@@ -26,28 +26,23 @@ const (
 )
 
 const (
-	SizeIcon Size = "icon"
+	SizeDefault Size = "default"
+	SizeSm      Size = "sm"
+	SizeLg      Size = "lg"
+	SizeIcon    Size = "icon"
 )
 
 type Props struct {
-	ID           string
+	ID         string
-	Class        string
+	Class      string
-	Attributes   templ.Attributes
+	Attributes templ.Attributes
-	Variant      Variant
+	Variant    Variant
-	Size         Size
+	Size       Size
-	FullWidth    bool
+	FullWidth  bool
-	Href         string
+	Href       string
-	Target       string
+	Target     string
-	Disabled     bool
+	Disabled   bool
-	Type         Type
+	Type       Type
-	HxGet        string
-	HxPost       string
-	HxPut        string
-	HxDelete     string
-	HxTrigger    string
-	HxTarget     string
-	HxSwap       string
-	HxReplaceUrl string
 }
 
 templ Button(props ...Props) {
@@ -69,8 +64,10 @@ templ Button(props ...Props) {
 			}
 			class={
 				utils.TwMerge(
-					"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
+					"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all",
-					"focus-visible:outline-hidden focus-visible:ring-2 focus:ring-ring focus-visible:ring-offset-2",
+					"disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
+					"outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
 					"cursor-pointer",
 					p.variantClasses(),
 					p.sizeClasses(),
@@ -89,9 +86,10 @@ templ Button(props ...Props) {
 			}
 			class={
 				utils.TwMerge(
-					"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
+					"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all",
-					"focus-visible:outline-hidden focus-visible:ring-2 focus:ring-ring focus-visible:ring-offset-2",
+					"disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
-					"disabled:opacity-50 disabled:cursor-not-allowed",
+					"outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
 					"cursor-pointer",
 					p.variantClasses(),
 					p.sizeClasses(),
@@ -103,30 +101,6 @@ templ Button(props ...Props) {
 				type={ string(p.Type) }
 			}
 			disabled?={ p.Disabled }
-			if p.HxGet != "" {
-				hx-get={ p.HxGet }
-			}
-			if p.HxPost != "" {
-				hx-post={ p.HxPost }
-			}
-			if p.HxPut != "" {
-				hx-put={ p.HxPut }
-			}
-			if p.HxDelete != "" {
-				hx-delete={ p.HxDelete }
-			}
-			if p.HxTrigger != "" {
-				hx-trigger={ p.HxTrigger }
-			}
-			if p.HxTarget != "" {
-				hx-target={ p.HxTarget }
-			}
-			if p.HxSwap != "" {
-				hx-swap={ p.HxSwap }
-			}
-			if p.HxReplaceUrl != "" {
-				hx-replace-url={ p.HxReplaceUrl }
-			}
 			{ p.Attributes... }
 		>
 			{ children... }
@@ -137,26 +111,30 @@ templ Button(props ...Props) {
 func (b Props) variantClasses() string {
 	switch b.Variant {
 	case VariantDestructive:
-		return "bg-destructive text-destructive-foreground hover:bg-destructive/90"
+		return "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
 	case VariantOutline:
-		return "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
+		return "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
 	case VariantSecondary:
-		return "bg-secondary text-secondary-foreground hover:bg-secondary/80"
+		return "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80"
 	case VariantGhost:
-		return "hover:bg-accent hover:text-accent-foreground"
+		return "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50"
 	case VariantLink:
 		return "text-primary underline-offset-4 hover:underline"
 	default:
-		return "bg-primary text-primary-foreground hover:bg-primary/90"
+		return "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90"
 	}
 }
 
 func (b Props) sizeClasses() string {
 	switch b.Size {
+	case SizeSm:
+		return "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5"
+	case SizeLg:
+		return "h-10 rounded-md px-6 has-[>svg]:px-4"
 	case SizeIcon:
-		return "h-10 w-10"
+		return "size-9"
-	default:
+	default: // SizeDefault
-		return "h-10 px-4 py-2 rounded-md"
+		return "h-9 px-4 py-2 has-[>svg]:px-3"
 	}
 }
 

server/web/templui/components/button/button_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component button - version: main installed by templui v0.71.0
+// templui component button - version: v0.84.0 installed by templui v0.84.0
 
 package button
 
@@ -35,28 +35,23 @@ const (
 )
 
 const (
-	SizeIcon Size = "icon"
+	SizeDefault Size = "default"
+	SizeSm      Size = "sm"
+	SizeLg      Size = "lg"
+	SizeIcon    Size = "icon"
 )
 
 type Props struct {
-	ID           string
+	ID         string
-	Class        string
+	Class      string
-	Attributes   templ.Attributes
+	Attributes templ.Attributes
-	Variant      Variant
+	Variant    Variant
-	Size         Size
+	Size       Size
-	FullWidth    bool
+	FullWidth  bool
-	Href         string
+	Href       string
-	Target       string
+	Target     string
-	Disabled     bool
+	Disabled   bool
-	Type         Type
+	Type       Type
-	HxGet        string
-	HxPost       string
-	HxPut        string
-	HxDelete     string
-	HxTrigger    string
-	HxTarget     string
-	HxSwap       string
-	HxReplaceUrl string
 }
 
 func Button(props ...Props) templ.Component {
@@ -90,8 +85,10 @@ func Button(props ...Props) templ.Component {
 		if p.Href != "" && !p.Disabled {
 			var templ_7745c5c3_Var2 = []any{
 				utils.TwMerge(
-					"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
+					"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all",
-					"focus-visible:outline-hidden focus-visible:ring-2 focus:ring-ring focus-visible:ring-offset-2",
+					"disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
+					"outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
 					"cursor-pointer",
 					p.variantClasses(),
 					p.sizeClasses(),
@@ -115,7 +112,7 @@ func Button(props ...Props) templ.Component {
 				var templ_7745c5c3_Var3 string
 				templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 64, Col: 13}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 59, Col: 13}
 				}
 				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 				if templ_7745c5c3_Err != nil {
@@ -147,7 +144,7 @@ func Button(props ...Props) templ.Component {
 				var templ_7745c5c3_Var5 string
 				templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.Target)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 68, Col: 21}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 63, Col: 21}
 				}
 				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
 				if templ_7745c5c3_Err != nil {
@@ -194,9 +191,10 @@ func Button(props ...Props) templ.Component {
 		} else {
 			var templ_7745c5c3_Var7 = []any{
 				utils.TwMerge(
-					"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
+					"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all",
-					"focus-visible:outline-hidden focus-visible:ring-2 focus:ring-ring focus-visible:ring-offset-2",
+					"disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
-					"disabled:opacity-50 disabled:cursor-not-allowed",
+					"outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
 					"cursor-pointer",
 					p.variantClasses(),
 					p.sizeClasses(),
@@ -220,7 +218,7 @@ func Button(props ...Props) templ.Component {
 				var templ_7745c5c3_Var8 string
 				templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 88, Col: 13}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 85, Col: 13}
 				}
 				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 				if templ_7745c5c3_Err != nil {
@@ -256,7 +254,7 @@ func Button(props ...Props) templ.Component {
 				var templ_7745c5c3_Var10 string
 				templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(string(p.Type))
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 103, Col: 25}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 101, Col: 25}
 				}
 				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
 				if templ_7745c5c3_Err != nil {
@@ -273,163 +271,11 @@ func Button(props ...Props) templ.Component {
 					return templ_7745c5c3_Err
 				}
 			}
-			if p.HxGet != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " hx-get=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var11 string
-				templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxGet)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 107, Col: 20}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxPost != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " hx-post=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var12 string
-				templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxPost)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 110, Col: 22}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxPut != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, " hx-put=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var13 string
-				templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxPut)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 113, Col: 20}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxDelete != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " hx-delete=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var14 string
-				templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxDelete)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 116, Col: 26}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxTrigger != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " hx-trigger=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var15 string
-				templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxTrigger)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 119, Col: 28}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxTarget != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " hx-target=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var16 string
-				templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxTarget)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 122, Col: 26}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxSwap != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " hx-swap=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var17 string
-				templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxSwap)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 125, Col: 22}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.HxReplaceUrl != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " hx-replace-url=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var18 string
-				templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxReplaceUrl)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/button/button.templ`, Line: 128, Col: 35}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
 			templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, ">")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, ">")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -437,7 +283,7 @@ func Button(props ...Props) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "</button>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</button>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -449,26 +295,30 @@ func Button(props ...Props) templ.Component {
 func (b Props) variantClasses() string {
 	switch b.Variant {
 	case VariantDestructive:
-		return "bg-destructive text-destructive-foreground hover:bg-destructive/90"
+		return "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
 	case VariantOutline:
-		return "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
+		return "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
 	case VariantSecondary:
-		return "bg-secondary text-secondary-foreground hover:bg-secondary/80"
+		return "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80"
 	case VariantGhost:
-		return "hover:bg-accent hover:text-accent-foreground"
+		return "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50"
 	case VariantLink:
 		return "text-primary underline-offset-4 hover:underline"
 	default:
-		return "bg-primary text-primary-foreground hover:bg-primary/90"
+		return "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90"
 	}
 }
 
 func (b Props) sizeClasses() string {
 	switch b.Size {
+	case SizeSm:
+		return "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5"
+	case SizeLg:
+		return "h-10 rounded-md px-6 has-[>svg]:px-4"
 	case SizeIcon:
-		return "h-10 w-10"
+		return "size-9"
-	default:
+	default: // SizeDefault
-		return "h-10 px-4 py-2 rounded-md"
+		return "h-9 px-4 py-2 has-[>svg]:px-3"
 	}
 }
 

server/web/templui/components/calendar/calendar.templ

@@ -1,4 +1,4 @@
-// templui component calendar - version: main installed by templui v0.71.0
+// templui component calendar - version: v0.84.0 installed by templui v0.84.0
 package calendar
 
 import (
@@ -32,7 +32,6 @@ type Props struct {
 }
 
 templ Calendar(props ...Props) {
-	@Script()
 	{{
 	var p Props
 	if len(props) > 0 {
@@ -93,10 +92,18 @@ templ Calendar(props ...Props) {
 			<div class="flex items-center justify-between mb-4">
 				<span data-calendar-month-display class="text-sm font-medium"></span>
 				<div class="flex gap-1">
-					<button type="button" data-calendar-prev class="inline-flex items-center justify-center rounded-md text-sm font-medium h-7 w-7 hover:bg-accent hover:text-accent-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:opacity-50">
+					<button
+						type="button"
+						data-calendar-prev
+						class="inline-flex items-center justify-center rounded-md text-sm font-medium h-7 w-7 hover:bg-accent hover:text-accent-foreground focus:outline-none disabled:opacity-50"
+					>
 						@icon.ChevronLeft()
 					</button>
-					<button type="button" data-calendar-next class="inline-flex items-center justify-center rounded-md text-sm font-medium h-7 w-7 hover:bg-accent hover:text-accent-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:opacity-50">
+					<button
+						type="button"
+						data-calendar-next
+						class="inline-flex items-center justify-center rounded-md text-sm font-medium h-7 w-7 hover:bg-accent hover:text-accent-foreground focus:outline-none disabled:opacity-50"
+					>
 						@icon.ChevronRight()
 					</button>
 				</div>
@@ -109,195 +116,6 @@ templ Calendar(props ...Props) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/calendar.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() {
-                function initCalendar(container) {
-                    if (!container || container._calendarInitialized) return;
-
-                    const monthDisplay = container.querySelector('[data-calendar-month-display]');
-                    const weekdaysContainer = container.querySelector('[data-calendar-weekdays]');
-                    const daysContainer = container.querySelector('[data-calendar-days]');
-                    const prevButton = container.querySelector('[data-calendar-prev]');
-                    const nextButton = container.querySelector('[data-calendar-next]');
-                    const wrapper = container.closest('[data-calendar-wrapper]');
-                    const hiddenInput = wrapper ? wrapper.querySelector('[data-calendar-hidden-input]') : null;
-
-                    if (!monthDisplay || !weekdaysContainer || !daysContainer || !prevButton || !nextButton || !hiddenInput) {
-                        console.error('Calendar init error: Missing required elements (or hidden input relative to wrapper).', container);
-                        return;
-                    }
-
-                    const localeTag = container.dataset.localeTag || 'en-US';
-                    let monthNames;
-                    try {
-                        monthNames = Array.from({ length: 12 }, (_, i) =>
-                            new Intl.DateTimeFormat(localeTag, { month: 'long', timeZone: 'UTC' }).format(new Date(Date.UTC(2000, i, 1)))
-                        );
-                    } catch (e) {
-                        console.error(`Calendar: Error generating month names via Intl (locale: "${localeTag}"). Falling back to English.`, e);
-                        // Fallback to English names if Intl fails for any reason
-                        monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
-                    }
-                    let dayNames = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa']; // Default fallback
-                    
-                    try {
-                        // Use days 0-6 (Sun-Sat standard). Intl provides names in the locale's typical order.
-                        dayNames = Array.from({ length: 7 }, (_, i) =>
-                            new Intl.DateTimeFormat(localeTag, { weekday: 'short' }).format(new Date(Date.UTC(2000, 0, i))) 
-                        );
-                    } catch (e) {
-                        console.error('Error generating calendar day names via Intl:', e);
-                        // Keep default dayNames on error
-                    }
-                    
-                    let currentMonth = parseInt(container.dataset.initialMonth);
-                    let currentYear = parseInt(container.dataset.initialYear);
-                    let selectedDate = null; // Stored as JS Date object (UTC midnight)
-
-                    if (container.dataset.selectedDate) {
-                        selectedDate = parseISODate(container.dataset.selectedDate);
-                    }
-
-                    function parseISODate(isoStr) {
-                        if (!isoStr) return null;
-                        try {
-                            const parts = isoStr.split('-');
-                            const year = parseInt(parts[0], 10);
-                            const month = parseInt(parts[1], 10) - 1; // JS month is 0-indexed
-                            const day = parseInt(parts[2], 10);
-                            const date = new Date(Date.UTC(year, month, day));
-                            if (!isNaN(date) && date.getUTCFullYear() === year && date.getUTCMonth() === month && date.getUTCDate() === day) {
-                                return date;
-                            }
-                        } catch {}
-                        return null;
-                    }
-
-                    function updateMonthDisplay() {
-                        // Always use the fallback month name combined with the current year
-                        // Ensure month index is within bounds (0-11)
-                        const monthIndex = Math.max(0, Math.min(11, currentMonth)); 
-                        const monthName = monthNames[monthIndex]; 
-                        const displayString = `${monthName} ${currentYear}`;
-                        monthDisplay.textContent = displayString;
-                    }
-
-                    function renderWeekdays() {
-                        weekdaysContainer.innerHTML = '';
-                        dayNames.forEach(day => {
-                            const el = document.createElement('div');
-                            el.className = 'text-center text-xs text-muted-foreground font-medium';
-                            el.textContent = day;
-                            weekdaysContainer.appendChild(el);
-                        });
-                    }
-
-                    function renderCalendar() {
-                        daysContainer.innerHTML = '';
-                        const firstDayOfMonth = new Date(Date.UTC(currentYear, currentMonth, 1));
-                        const firstDayUTCDay = firstDayOfMonth.getUTCDay(); // 0=Sun
-                        let startOffset = firstDayUTCDay; // Simple Sunday start offset
-                        // NOTE: A robust implementation might need to adjust offset based on locale's actual first day of week.
-                        // Intl doesn't directly provide this easily yet. Keep Sunday start for simplicity.
-
-                        const daysInMonth = new Date(Date.UTC(currentYear, currentMonth + 1, 0)).getUTCDate();
-                        // Calculate 'today' based on the browser's local date for correct highlighting
-                        const now = new Date(); 
-                        const today = new Date(Date.UTC(now.getFullYear(), now.getMonth(), now.getDate()));
-
-                        for (let i = 0; i < startOffset; i++) {
-                            const blank = document.createElement('div');
-                            blank.className = 'h-8 w-8';
-                            daysContainer.appendChild(blank);
-                        }
-
-                        for (let day = 1; day <= daysInMonth; day++) {
-                            const button = document.createElement('button');
-                            button.type = 'button';
-                            button.className = 'inline-flex h-8 w-8 items-center justify-center rounded-md text-sm font-medium focus:outline-none focus:ring-1 focus:ring-ring';
-                            button.textContent = day;
-                            button.dataset.day = day;
-                            const currentDate = new Date(Date.UTC(currentYear, currentMonth, day));
-                            const isSelected = selectedDate && currentDate.getTime() === selectedDate.getTime();
-                            const isToday = currentDate.getTime() === today.getTime();
-
-                            if (isSelected) button.classList.add('bg-primary', 'text-primary-foreground', 'hover:bg-primary/90');
-                            else if (isToday) button.classList.add('bg-accent', 'text-accent-foreground');
-                            else button.classList.add('hover:bg-accent', 'hover:text-accent-foreground');
-
-                            button.addEventListener('click', handleDayClick);
-                            daysContainer.appendChild(button);
-                        }
-                    }
-
-                    function handlePrevMonthClick() {
-                        currentMonth--;
-                        if (currentMonth < 0) { currentMonth = 11; currentYear--; }
-                        updateMonthDisplay(); renderCalendar();
-                    }
-
-                    function handleNextMonthClick() {
-                        currentMonth++;
-                        if (currentMonth > 11) { currentMonth = 0; currentYear++; }
-                        updateMonthDisplay(); renderCalendar();
-                    }
-
-                    function handleDayClick(event) {
-                        const day = parseInt(event.target.dataset.day);
-                        if (!day) return;
-                        const newlySelectedDate = new Date(Date.UTC(currentYear, currentMonth, day));
-
-                        selectedDate = newlySelectedDate;
-
-                        const isoFormattedValue = newlySelectedDate.toISOString().split('T')[0];
-                        hiddenInput.value = isoFormattedValue;
-                        hiddenInput.dispatchEvent(new Event('change', { bubbles: true }));
-
-                        container.dispatchEvent(new CustomEvent('calendar-date-selected', {
-                            bubbles: true,
-                            detail: { date: newlySelectedDate }
-                        }));
-
-                        renderCalendar();
-                    }
-
-                    // Initialization
-                    prevButton.addEventListener('click', handlePrevMonthClick);
-                    nextButton.addEventListener('click', handleNextMonthClick);
-
-                    updateMonthDisplay();
-                    renderWeekdays();
-                    renderCalendar();
-
-                    container._calendarInitialized = true;
-                }
-
-                function initAllComponents(root = document) {
-                    if (root instanceof Element && root.matches('[data-calendar-container]')) {
-                        initCalendar(root);
-                    }
-
-                    for (const calendar of root.querySelectorAll('[data-calendar-container]')) {
-                        initCalendar(calendar);
-                    }
-                }
-
-                const handleHtmxSwap = (event) => {
-                    const target = event.detail.target || event.detail.elt;
-                    if (target instanceof Element) {
-                        requestAnimationFrame(() => initAllComponents(target));
-                    }
-                };
-
-                initAllComponents();
-                document.addEventListener('DOMContentLoaded', () => initAllComponents());
-                document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-                document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})();
-		</script>
-	}
 }

server/web/templui/components/card/card.templ

@@ -1,30 +1,7 @@
-// templui component card - version: main installed by templui v0.71.0
+// templui component card - version: v0.84.0 installed by templui v0.84.0
 package card
 
-import (
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-	"git.jmbit.de/jmb/scanfile/server/web/templui/components/aspectratio"
-	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-)
-
-type MediaPosition string
-type MediaWidth string
-
-const (
-	MediaPositionTop    MediaPosition = "top"
-	MediaPositionBottom MediaPosition = "bottom"
-	MediaPositionLeft   MediaPosition = "left"
-	MediaPositionRight  MediaPosition = "right"
-)
-
-const (
-	MediaWidthAuto          MediaWidth = "auto"
-	MediaWidthFull          MediaWidth = "full"
-	MediaWidthHalf          MediaWidth = "half"
-	MediaWidthThird         MediaWidth = "third"
-	MediaWidthQuarter       MediaWidth = "quarter"
-	MediaWidthTwoThirds     MediaWidth = "two-thirds"
-	MediaWidthThreeQuarters MediaWidth = "three-quarters"
-)
 
 type Props struct {
 	ID         string
@@ -62,23 +39,6 @@ type FooterProps struct {
 	Attributes templ.Attributes
 }
 
-type HorizontalProps struct {
-	ID         string
-	Class      string
-	Attributes templ.Attributes
-}
-
-type MediaProps struct {
-	ID          string
-	Class       string
-	Attributes  templ.Attributes
-	Src         string
-	Alt         string
-	Position    MediaPosition
-	Width       MediaWidth
-	AspectRatio aspectratio.Ratio
-}
-
 templ Card(props ...Props) {
 	{{ var p Props }}
 	if len(props) > 0 {
@@ -204,102 +164,3 @@ templ Footer(props ...FooterProps) {
 		{ children... }
 	</div>
 }
-
-templ Horizontal(props ...HorizontalProps) {
-	{{ var p HorizontalProps }}
-	if len(props) > 0 {
-		{{ p = props[0] }}
-	}
-	<div
-		if p.ID != "" {
-			id={ p.ID }
-		}
-		class={
-			utils.TwMerge(
-				"flex overflow-hidden",
-				p.Class,
-			),
-		}
-		{ p.Attributes... }
-	>
-		{ children... }
-	</div>
-}
-
-templ Media(props ...MediaProps) {
-	{{ var p MediaProps }}
-	if len(props) > 0 {
-		{{ p = props[0] }}
-	}
-	<div
-		if p.ID != "" {
-			id={ p.ID }
-		}
-		class={
-			utils.TwMerge(
-				"overflow-hidden",
-				mediaPositionClasses(p.Position, p.Width),
-				p.Class,
-			),
-		}
-		{ p.Attributes... }
-	>
-		@aspectratio.AspectRatio(aspectratio.Props{
-			ID:    p.ID + "-aspect",
-			Ratio: p.AspectRatio,
-			Class: "h-full w-full",
-		}) {
-			<img
-				if p.Src != "" {
-					src={ p.Src }
-				}
-				if p.Alt != "" {
-					alt={ p.Alt }
-				}
-				class="h-full w-full object-cover"
-			/>
-		}
-	</div>
-}
-
-func mediaPositionClasses(position MediaPosition, width MediaWidth) string {
-	var positionClass string
-
-	switch position {
-	case MediaPositionTop:
-		return "w-full rounded-t-lg"
-	case MediaPositionBottom:
-		return "w-full rounded-b-lg"
-	case MediaPositionLeft:
-		positionClass = "shrink-0 rounded-l-lg"
-	case MediaPositionRight:
-		positionClass = "shrink-0 rounded-r-lg"
-	default:
-		positionClass = ""
-	}
-
-	if position == MediaPositionLeft || position == MediaPositionRight {
-		return positionClass + " " + widthClass(width)
-	}
-
-	return positionClass
-}
-
-func widthClass(width MediaWidth) string {
-	switch width {
-	case MediaWidthFull:
-		return "w-full"
-	case MediaWidthHalf:
-		return "w-1/2"
-	case MediaWidthThird:
-		return "w-1/3"
-	case MediaWidthQuarter:
-		return "w-1/4"
-	case MediaWidthTwoThirds:
-		return "w-2/3"
-	case MediaWidthThreeQuarters:
-		return "w-3/4"
-	default:
-		return "w-1/3"
-	}
-}

server/web/templui/components/card/card_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component card - version: main installed by templui v0.71.0
+// templui component card - version: v0.84.0 installed by templui v0.84.0
 
 package card
 
@@ -10,30 +10,7 @@ package card
 import "github.com/a-h/templ"
 import templruntime "github.com/a-h/templ/runtime"
 
-import (
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-	"git.jmbit.de/jmb/scanfile/server/web/templui/components/aspectratio"
-	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-)
-
-type MediaPosition string
-type MediaWidth string
-
-const (
-	MediaPositionTop    MediaPosition = "top"
-	MediaPositionBottom MediaPosition = "bottom"
-	MediaPositionLeft   MediaPosition = "left"
-	MediaPositionRight  MediaPosition = "right"
-)
-
-const (
-	MediaWidthAuto          MediaWidth = "auto"
-	MediaWidthFull          MediaWidth = "full"
-	MediaWidthHalf          MediaWidth = "half"
-	MediaWidthThird         MediaWidth = "third"
-	MediaWidthQuarter       MediaWidth = "quarter"
-	MediaWidthTwoThirds     MediaWidth = "two-thirds"
-	MediaWidthThreeQuarters MediaWidth = "three-quarters"
-)
 
 type Props struct {
 	ID         string
@@ -71,23 +48,6 @@ type FooterProps struct {
 	Attributes templ.Attributes
 }
 
-type HorizontalProps struct {
-	ID         string
-	Class      string
-	Attributes templ.Attributes
-}
-
-type MediaProps struct {
-	ID          string
-	Class       string
-	Attributes  templ.Attributes
-	Src         string
-	Alt         string
-	Position    MediaPosition
-	Width       MediaWidth
-	AspectRatio aspectratio.Ratio
-}
-
 func Card(props ...Props) templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -135,7 +95,7 @@ func Card(props ...Props) templ.Component {
 			var templ_7745c5c3_Var3 string
 			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 89, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 49, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
@@ -230,7 +190,7 @@ func Header(props ...HeaderProps) templ.Component {
 			var templ_7745c5c3_Var7 string
 			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 110, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 70, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
 			if templ_7745c5c3_Err != nil {
@@ -325,7 +285,7 @@ func Title(props ...TitleProps) templ.Component {
 			var templ_7745c5c3_Var11 string
 			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 131, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 91, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
 			if templ_7745c5c3_Err != nil {
@@ -420,7 +380,7 @@ func Description(props ...DescriptionProps) templ.Component {
 			var templ_7745c5c3_Var15 string
 			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 152, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 112, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
 			if templ_7745c5c3_Err != nil {
@@ -515,7 +475,7 @@ func Content(props ...ContentProps) templ.Component {
 			var templ_7745c5c3_Var19 string
 			templ_7745c5c3_Var19, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 173, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 133, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var19))
 			if templ_7745c5c3_Err != nil {
@@ -610,7 +570,7 @@ func Footer(props ...FooterProps) templ.Component {
 			var templ_7745c5c3_Var23 string
 			templ_7745c5c3_Var23, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 194, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 154, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var23))
 			if templ_7745c5c3_Err != nil {
@@ -658,301 +618,4 @@ func Footer(props ...FooterProps) templ.Component {
 	})
 }
 
-func Horizontal(props ...HorizontalProps) templ.Component {
-	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
-		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
-			return templ_7745c5c3_CtxErr
-		}
-		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-		if !templ_7745c5c3_IsBuffer {
-			defer func() {
-				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-				if templ_7745c5c3_Err == nil {
-					templ_7745c5c3_Err = templ_7745c5c3_BufErr
-				}
-			}()
-		}
-		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var25 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var25 == nil {
-			templ_7745c5c3_Var25 = templ.NopComponent
-		}
-		ctx = templ.ClearChildren(ctx)
-		var p HorizontalProps
-		if len(props) > 0 {
-			p = props[0]
-		}
-		var templ_7745c5c3_Var26 = []any{
-			utils.TwMerge(
-				"flex overflow-hidden",
-				p.Class,
-			),
-		}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var26...)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "<div")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		if p.ID != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, " id=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var27 string
-			templ_7745c5c3_Var27, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 215, Col: 12}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var27))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, " class=\"")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		var templ_7745c5c3_Var28 string
-		templ_7745c5c3_Var28, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var26).String())
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 1, Col: 0}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var28))
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "\"")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 48, ">")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templ_7745c5c3_Var25.Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 49, "</div>")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		return nil
-	})
-}
-
-func Media(props ...MediaProps) templ.Component {
-	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
-		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
-			return templ_7745c5c3_CtxErr
-		}
-		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-		if !templ_7745c5c3_IsBuffer {
-			defer func() {
-				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-				if templ_7745c5c3_Err == nil {
-					templ_7745c5c3_Err = templ_7745c5c3_BufErr
-				}
-			}()
-		}
-		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var29 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var29 == nil {
-			templ_7745c5c3_Var29 = templ.NopComponent
-		}
-		ctx = templ.ClearChildren(ctx)
-		var p MediaProps
-		if len(props) > 0 {
-			p = props[0]
-		}
-		var templ_7745c5c3_Var30 = []any{
-			utils.TwMerge(
-				"overflow-hidden",
-				mediaPositionClasses(p.Position, p.Width),
-				p.Class,
-			),
-		}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var30...)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "<div")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		if p.ID != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, " id=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var31 string
-			templ_7745c5c3_Var31, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 236, Col: 12}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var31))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, " class=\"")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		var templ_7745c5c3_Var32 string
-		templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var30).String())
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 1, Col: 0}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "\"")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, ">")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Var33 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "<img")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			if p.Src != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, " src=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var34 string
-				templ_7745c5c3_Var34, templ_7745c5c3_Err = templ.JoinStringErrs(p.Src)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 254, Col: 16}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var34))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			if p.Alt != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, " alt=\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				var templ_7745c5c3_Var35 string
-				templ_7745c5c3_Var35, templ_7745c5c3_Err = templ.JoinStringErrs(p.Alt)
-				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/card/card.templ`, Line: 257, Col: 16}
-				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var35))
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "\"")
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 61, " class=\"h-full w-full object-cover\">")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = aspectratio.AspectRatio(aspectratio.Props{
-			ID:    p.ID + "-aspect",
-			Ratio: p.AspectRatio,
-			Class: "h-full w-full",
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var33), templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 62, "</div>")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		return nil
-	})
-}
-
-func mediaPositionClasses(position MediaPosition, width MediaWidth) string {
-	var positionClass string
-
-	switch position {
-	case MediaPositionTop:
-		return "w-full rounded-t-lg"
-	case MediaPositionBottom:
-		return "w-full rounded-b-lg"
-	case MediaPositionLeft:
-		positionClass = "shrink-0 rounded-l-lg"
-	case MediaPositionRight:
-		positionClass = "shrink-0 rounded-r-lg"
-	default:
-		positionClass = ""
-	}
-
-	if position == MediaPositionLeft || position == MediaPositionRight {
-		return positionClass + " " + widthClass(width)
-	}
-
-	return positionClass
-}
-
-func widthClass(width MediaWidth) string {
-	switch width {
-	case MediaWidthFull:
-		return "w-full"
-	case MediaWidthHalf:
-		return "w-1/2"
-	case MediaWidthThird:
-		return "w-1/3"
-	case MediaWidthQuarter:
-		return "w-1/4"
-	case MediaWidthTwoThirds:
-		return "w-2/3"
-	case MediaWidthThreeQuarters:
-		return "w-3/4"
-	default:
-		return "w-1/3"
-	}
-}
-
 var _ = templruntime.GeneratedTemplate

server/web/templui/components/carousel/carousel.templ

@@ -1,4 +1,4 @@
-// templui component carousel - version: main installed by templui v0.71.0
+// templui component carousel - version: v0.84.0 installed by templui v0.84.0
 package carousel
 
 import (
@@ -49,7 +49,6 @@ type IndicatorsProps struct {
 }
 
 templ Carousel(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -198,197 +197,6 @@ templ Indicators(props ...IndicatorsProps) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/carousel.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE
-				function initCarousel(carousel) {
-					const track = carousel.querySelector('.carousel-track');
-					const items = Array.from(track?.querySelectorAll('.carousel-item') || []);
-					if (items.length === 0) return;
-					
-					const indicators = Array.from(carousel.querySelectorAll('.carousel-indicator'));
-					const prevBtn = carousel.querySelector('.carousel-prev');
-					const nextBtn = carousel.querySelector('.carousel-next');
-					
-					const state = {
-						currentIndex: 0,
-						slideCount: items.length,
-						autoplay: carousel.dataset.autoplay === 'true',
-						interval: parseInt(carousel.dataset.interval || 5000),
-						loop: carousel.dataset.loop === 'true',
-						autoplayInterval: null,
-						isHovering: false,
-						touchStartX: 0
-					};
-
-					function updateTrackPosition() {
-						track.style.transform = `translateX(-${state.currentIndex * 100}%)`;
-					}
-
-					function updateIndicators() {
-						indicators.forEach((indicator, i) => {
-							if (i < state.slideCount) {
-								if (i === state.currentIndex) {
-									indicator.classList.add('bg-white');
-									indicator.classList.remove('bg-white/50');
-								} else {
-									indicator.classList.remove('bg-white');
-									indicator.classList.add('bg-white/50');
-								}
-								indicator.style.display = '';
-							} else {
-								indicator.style.display = 'none';
-							}
-						});
-					}
-
-					function updateButtons() {
-						if (prevBtn) {
-							prevBtn.disabled = !state.loop && state.currentIndex === 0;
-							prevBtn.classList.toggle('opacity-50', prevBtn.disabled);
-							prevBtn.classList.toggle('cursor-not-allowed', prevBtn.disabled);
-						}
-						
-						if (nextBtn) {
-							nextBtn.disabled = !state.loop && state.currentIndex === state.slideCount - 1;
-							nextBtn.classList.toggle('opacity-50', nextBtn.disabled);
-							nextBtn.classList.toggle('cursor-not-allowed', nextBtn.disabled);
-						}
-					}
-
-					function startAutoplay() {
-						if (state.autoplayInterval) {
-							clearInterval(state.autoplayInterval);
-						}
-						
-						if (state.autoplay) {
-							state.autoplayInterval = setInterval(() => {
-								if (!state.isHovering) {
-									goToNext();
-								}
-							}, state.interval);
-						}
-					}
-
-					function stopAutoplay() {
-						if (state.autoplayInterval) {
-							clearInterval(state.autoplayInterval);
-							state.autoplayInterval = null;
-						}
-					}
-
-					function goToNext() {
-						let nextIndex = state.currentIndex + 1;
-						if (nextIndex >= state.slideCount) {
-							if (state.loop) {
-								nextIndex = 0;
-							} else {
-								return;
-							}
-						}
-						goToSlide(nextIndex);
-					}
-
-					function goToPrev() {
-						let prevIndex = state.currentIndex - 1;
-						if (prevIndex < 0) {
-							if (state.loop) {
-								prevIndex = state.slideCount - 1;
-							} else {
-								return;
-							}
-						}
-						goToSlide(prevIndex);
-					}
-
-					function goToSlide(index) {
-						if (index < 0 || index >= state.slideCount) {
-							if (state.loop) {
-								index = (index + state.slideCount) % state.slideCount;
-							} else {
-								return;
-							}
-						}
-						
-						if (index === state.currentIndex) return;
-
-						state.currentIndex = index;
-						updateTrackPosition();
-						updateIndicators();
-						updateButtons();
-
-						if (state.autoplay && !state.isHovering) {
-							stopAutoplay();
-							startAutoplay();
-						}
-					}
-
-					if (track) {
-						track.addEventListener('touchstart', (e) => {
-							state.touchStartX = e.touches[0].clientX;
-						}, { passive: true });
-						
-						track.addEventListener('touchend', (e) => {
-							const touchEndX = e.changedTouches[0].clientX;
-							const diff = state.touchStartX - touchEndX;
-							const sensitivity = 50;
-
-							if (Math.abs(diff) > sensitivity) {
-								diff > 0 ? goToNext() : goToPrev();
-							}
-						}, { passive: true });
-					}
-
-					indicators.forEach((indicator, index) => {
-						if (index < state.slideCount) {
-							indicator.addEventListener('click', () => goToSlide(index));
-						}
-					});
-
-					if (prevBtn) prevBtn.addEventListener('click', goToPrev);
-					if (nextBtn) nextBtn.addEventListener('click', goToNext);
-
-					carousel.addEventListener('mouseenter', () => {
-						state.isHovering = true;
-						if (state.autoplay) stopAutoplay();
-					});
-
-					carousel.addEventListener('mouseleave', () => {
-						state.isHovering = false;
-						if (state.autoplay) startAutoplay();
-					});
-
-					updateTrackPosition();
-					updateIndicators();
-					updateButtons();
-
-					if (state.autoplay) startAutoplay();
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('.carousel-component')) {
-						initCarousel(root);
-					}
-					for (const carousel of root.querySelectorAll('.carousel-component')) {
-						initCarousel(carousel);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/chart/chart.templ

@@ -1,4 +1,4 @@
-// templui component chart - version: main installed by templui v0.71.0
+// templui component chart - version: v0.84.0 installed by templui v0.84.0
 package chart
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
@@ -49,7 +49,6 @@ type Config struct {
 	Stacked     bool    `json:"stacked"`
 }
 
-// Erweiterung des Props um ID und Attributes
 type Props struct {
 	ID          string
 	Variant     Variant
@@ -69,7 +68,6 @@ type Props struct {
 }
 
 templ Chart(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -110,221 +108,5 @@ templ Chart(props ...Props) {
 }
 
 templ Script() {
-	<script defer nonce={ templ.GetNonce(ctx) } src="https://cdn.jsdelivr.net/npm/chart.js@4.4.8/dist/chart.umd.min.js"></script>
+	<script defer src="/assets/js/chart.min.js"></script>
-	<script nonce={ templ.GetNonce(ctx) }>
-		window.chartInstances = window.chartInstances || {};
-		
-		(function() { // IIFE
-			if (!window.chartScriptInitialized) {
-				function getThemeColors() {
-					const style = getComputedStyle(document.documentElement);
-					return {
-						foreground: style.getPropertyValue('--foreground').trim() || '#000',
-						background: style.getPropertyValue('--background').trim() || '#fff',
-						mutedForeground: style.getPropertyValue('--muted-foreground').trim() || '#666',
-						border: style.getPropertyValue('--border').trim() || '#ccc'
-					};
-				}
-
-				function initChart(canvas) {
-					if (!canvas || !canvas.id || !canvas.hasAttribute('data-chart-id')) return;
-					
-					if (window.chartInstances[canvas.id]) {
-						cleanupChart(canvas);
-					}
-
-					const dataId = canvas.getAttribute('data-chart-id');
-					const dataElement = document.getElementById(dataId);
-					if (!dataElement) return;
-
-					try {
-						const chartConfig = JSON.parse(dataElement.textContent);
-						const colors = getThemeColors();
-						
-						Chart.defaults.elements.point.radius = 0;
-						Chart.defaults.elements.point.hoverRadius = 5;
-
-						const isComplexChart = ["pie", "doughnut", "bar", "radar"].includes(chartConfig.type);
-
-						const legendOptions = {
-							display: chartConfig.showLegend || false,
-							labels: { color: colors.foreground }
-						};
-
-						const tooltipOptions = {
-							backgroundColor: colors.background,
-							bodyColor: colors.mutedForeground,
-							titleColor: colors.foreground,
-							borderColor: colors.border,
-							borderWidth: 1
-						};
-
-						const scalesOptions = chartConfig.type === "radar"
-							? {
-								r: {
-									grid: { 
-										color: colors.border, 
-										display: chartConfig.showYGrid !== false 
-									},
-									ticks: {
-										color: colors.mutedForeground,
-										backdropColor: "transparent",
-										display: chartConfig.showYLabels !== false
-									},
-									angleLines: { 
-										color: colors.border, 
-										display: chartConfig.showXGrid !== false 
-									},
-									pointLabels: { 
-										color: colors.foreground, 
-										font: { size: 12 } 
-									},
-									border: { 
-										display: chartConfig.showYAxis !== false, 
-										color: colors.border 
-									},
-									beginAtZero: true
-								}
-							}
-							: {
-								x: {
-									beginAtZero: true,
-									display: chartConfig.showXLabels !== false || 
-											chartConfig.showXGrid !== false || 
-											chartConfig.showXAxis !== false,
-									border: { 
-										display: chartConfig.showXAxis !== false, 
-										color: colors.border 
-									},
-									ticks: { 
-										display: chartConfig.showXLabels !== false, 
-										color: colors.mutedForeground 
-									},
-									grid: { 
-										display: chartConfig.showXGrid !== false, 
-										color: colors.border 
-									},
-									stacked: chartConfig.stacked || false
-								},
-								y: {
-									offset: true,
-									beginAtZero: true,
-									display: chartConfig.showYLabels !== false || 
-											chartConfig.showYGrid !== false || 
-											chartConfig.showYAxis !== false,
-									border: { 
-										display: chartConfig.showYAxis !== false, 
-										color: colors.border 
-									},
-									ticks: { 
-										display: chartConfig.showYLabels !== false, 
-										color: colors.mutedForeground 
-									},
-									grid: { 
-										display: chartConfig.showYGrid !== false, 
-										color: colors.border 
-									},
-									stacked: chartConfig.stacked || false
-								}
-							};
-
-						const finalChartConfig = {
-							...chartConfig,
-							options: {
-								responsive: true,
-								maintainAspectRatio: false,
-								interaction: {
-									intersect: isComplexChart ? true : false,
-									axis: "xy",
-									mode: isComplexChart ? "nearest" : "index"
-								},
-								indexAxis: chartConfig.horizontal ? "y" : "x",
-								plugins: {
-									legend: legendOptions,
-									tooltip: tooltipOptions
-								},
-								scales: scalesOptions
-							}
-						};
-
-						window.chartInstances[canvas.id] = new Chart(canvas, finalChartConfig);
-					} catch (e) {}
-				}
-
-				function cleanupChart(canvas) {
-					if (!canvas || !canvas.id || !window.chartInstances[canvas.id]) return;
-					try {
-						window.chartInstances[canvas.id].destroy();
-					} finally {
-						delete window.chartInstances[canvas.id];
-					}
-				}
-
-				function initAllComponents(root = document) {
-					if (typeof Chart === "undefined") return;
-					
-					for (const canvas of root.querySelectorAll("canvas[data-chart-id]")) {
-						initChart(canvas);
-					}
-				}
-				
-				function waitForChartAndInit() {
-					if (typeof Chart !== "undefined") {
-						initAllComponents();
-					} else {
-						setTimeout(waitForChartAndInit, 100);
-					}
-
-				}
-
-				document.addEventListener("DOMContentLoaded", waitForChartAndInit);
-				
-				document.body.addEventListener("htmx:beforeSwap", (event) => {
-					const el = event.detail.target || event.detail.elt;;
-					if (el instanceof Element) {
-						for (const canvas of el.querySelectorAll("canvas[data-chart-id]")) {
-							cleanupChart(canvas);
-						}
-						if (el.matches("canvas[data-chart-id]")) {
-							cleanupChart(el);
-						}
-					}
-				});
-
-				document.body.addEventListener("htmx:afterSwap", (event) => {
-					const target = event.detail.target || event.detail.elt;;
-					if (target instanceof Element) {
-						function tryInit(attempt = 1) {
-							if (typeof Chart !== "undefined") {
-								initAllComponents(target);
-							} else if (attempt < 10) {
-								setTimeout(() => tryInit(attempt + 1), 100);
-							}
-						}
-						tryInit();
-					}
-				});
-
-				const observer = new MutationObserver(() => {
-					let timeout;
-					clearTimeout(timeout);
-					timeout = setTimeout(() => {
-						for (const canvas of document.querySelectorAll("canvas[data-chart-id]")) {
-							if (window.chartInstances[canvas.id]) {
-								cleanupChart(canvas);
-								initChart(canvas);
-							}
-						}
-					}, 50);
-				});
-				
-				observer.observe(document.documentElement, {
-					attributes: true,
-					attributeFilter: ["class", "style"]
-				});
-
-				window.chartScriptInitialized = true;
-			}
-		})(); // End of IIFE
-	</script>
 }

server/web/templui/components/checkbox/checkbox.templ

@@ -1,4 +1,4 @@
-// templui component checkbox - version: main installed by templui v0.71.0
+// templui component checkbox - version: v0.84.0 installed by templui v0.84.0
 package checkbox
 
 import (

server/web/templui/components/checkbox/checkbox_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component checkbox - version: main installed by templui v0.71.0
+// templui component checkbox - version: v0.84.0 installed by templui v0.84.0
 
 package checkbox
 

server/web/templui/components/checkboxcard/checkboxcard.templ

@@ -0,0 +1,152 @@
+// templui component checkboxcard - version: v0.84.0 installed by templui v0.84.0
+package checkboxcard
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Checked    bool
+	Disabled   bool
+	Required   bool
+	Name       string
+	Value      string
+}
+
+type HeaderProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type DescriptionProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type FooterProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+templ CheckboxCard(props ...Props) {
+	{{ var p Props }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	if p.ID == "" {
+		{{ p.ID = utils.RandomID() }}
+	}
+	{{ inputId := p.ID + "-input" }}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"relative",
+				utils.If(p.Disabled, "opacity-60"),
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		<input
+			type="checkbox"
+			id={ inputId }
+			if p.Name != "" {
+				name={ p.Name }
+			}
+			if p.Value != "" {
+				value={ p.Value }
+			}
+			checked?={ p.Checked }
+			disabled?={ p.Disabled }
+			required?={ p.Required }
+			class="peer sr-only"
+		/>
+		<label
+			for={ inputId }
+			class={
+				utils.TwMerge(
+					"block w-full rounded-lg border overflow-hidden h-full",
+					"bg-card text-card-foreground p-4 flex flex-col",
+					"cursor-pointer",
+					"hover:border-primary/50",
+					"peer-checked:ring-1 peer-checked:ring-primary peer-checked:border-primary",
+					utils.If(p.Disabled, "cursor-not-allowed"),
+					"transition-all duration-200",
+					p.Class,
+				),
+			}
+		>
+			{ children... }
+		</label>
+	</div>
+}
+
+templ Header(props ...HeaderProps) {
+	{{ var p HeaderProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"flex items-center justify-between mb-2",
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}
+
+templ Description(props ...DescriptionProps) {
+	{{ var p DescriptionProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<p
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"text-sm text-muted-foreground",
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		{ children... }
+	</p>
+}
+
+templ Footer(props ...FooterProps) {
+	{{ var p FooterProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"mt-auto pt-4 w-full",
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}

server/web/templui/components/checkboxcard/checkboxcard_templ.go

@@ -0,0 +1,548 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component checkboxcard - version: v0.84.0 installed by templui v0.84.0
+
+package checkboxcard
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Checked    bool
+	Disabled   bool
+	Required   bool
+	Name       string
+	Value      string
+}
+
+type HeaderProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type DescriptionProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type FooterProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+func CheckboxCard(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		if p.ID == "" {
+			p.ID = utils.RandomID()
+		}
+		inputId := p.ID + "-input"
+		var templ_7745c5c3_Var2 = []any{
+			utils.TwMerge(
+				"relative",
+				utils.If(p.Disabled, "opacity-60"),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 46, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var4 string
+		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "><input type=\"checkbox\" id=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var5 string
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(inputId)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 59, Col: 15}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 61, Col: 17}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 64, Col: 19}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Checked {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " checked")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " class=\"peer sr-only\"> ")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var8 = []any{
+			utils.TwMerge(
+				"block w-full rounded-lg border overflow-hidden h-full",
+				"bg-card text-card-foreground p-4 flex flex-col",
+				"cursor-pointer",
+				"hover:border-primary/50",
+				"peer-checked:ring-1 peer-checked:ring-primary peer-checked:border-primary",
+				utils.If(p.Disabled, "cursor-not-allowed"),
+				"transition-all duration-200",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var8...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<label for=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var9 string
+		templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(inputId)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 72, Col: 16}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var10 string
+		templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var8).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</label></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Header(props ...HeaderProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p HeaderProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var12 = []any{
+			utils.TwMerge(
+				"flex items-center justify-between mb-2",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var12...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 98, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var14 string
+		templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var12).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Description(props ...DescriptionProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var15 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var15 == nil {
+			templ_7745c5c3_Var15 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p DescriptionProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var16 = []any{
+			utils.TwMerge(
+				"text-sm text-muted-foreground",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var16...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "<p")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 119, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var18 string
+		templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var16).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var15.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "</p>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Footer(props ...FooterProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var19 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var19 == nil {
+			templ_7745c5c3_Var19 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p FooterProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var20 = []any{
+			utils.TwMerge(
+				"mt-auto pt-4 w-full",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var20...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var21 string
+			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 140, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var22 string
+		templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var20).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/checkboxcard/checkboxcard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var19.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/code/code.templ

@@ -1,4 +1,4 @@
-// templui component code - version: main installed by templui v0.71.0
+// templui component code - version: v0.84.0 installed by templui v0.84.0
 package code
 
 import (
@@ -25,7 +25,7 @@ type Props struct {
 }
 
 templ Code(props ...Props) {
-	@Script()
+	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/pojoaque.min.css"/>
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -74,124 +74,6 @@ templ Code(props ...Props) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/code.min.js"></script>
-		<link rel="stylesheet" href="/assets/pojoaque.min.css"/>
-		<script nonce={ templ.GetNonce(ctx) } src="/assets/highlight.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE Start
-				function whenHljsReady(callback, attempt = 1) {
-					if (typeof hljs !== "undefined") {
-						callback();
-					} else if (attempt < 20) { // Retry for a few seconds
-						setTimeout(() => whenHljsReady(callback, attempt + 1), 100);
-					} else {
-						console.error("highlight.js (hljs) failed to load after several attempts.");
-					}
-				}
-
-				function fallbackCopyText(text, iconCheck, iconClipboard) {
-					const textArea = document.createElement('textarea');
-					textArea.value = text;
-					textArea.style.position = 'fixed';
-					textArea.style.top = '-9999px';
-					textArea.style.left = '-9999px';
-					document.body.appendChild(textArea);
-					textArea.focus();
-					textArea.select();
-					
-					try {
-						if (document.execCommand('copy')) {
-							iconCheck.style.display = 'inline';
-							iconClipboard.style.display = 'none';
-							setTimeout(() => {
-								iconCheck.style.display = 'none';
-								iconClipboard.style.display = 'inline';
-							}, 2000);
-						}
-					} catch (err) {
-						console.error('Fallback copy failed', err);
-					} finally {
-						document.body.removeChild(textArea);
-					}
-				}
-
-				function initCode(component) {
-					if (!component || component._codeInitialized) return; // Basic initialized check
-
-					const codeBlock = component.querySelector('[data-code-block]');
-					const copyButton = component.querySelector('[data-copy-button]');
-					const iconCheck = component.querySelector('[data-icon-check]');
-					const iconClipboard = component.querySelector('[data-icon-clipboard]');
-
-					// Highlight if hljs is available and not already highlighted
-					if (codeBlock && typeof hljs !== 'undefined') {
-						if (!codeBlock.classList.contains('hljs')) {
-							hljs.highlightElement(codeBlock);
-						}
-					}
-
-					// Setup copy button if elements exist
-					if (copyButton && codeBlock && iconCheck && iconClipboard) {
-						// Remove previous listener if any (important for re-initialization)
-						const oldListener = copyButton._copyListener;
-						if (oldListener) {
-							copyButton.removeEventListener('click', oldListener);
-						}
-
-						const newListener = () => {
-							const codeToCopy = codeBlock.textContent || '';
-							
-							const showCopied = () => {
-								iconCheck.style.display = 'inline';
-								iconClipboard.style.display = 'none';
-								setTimeout(() => {
-									iconCheck.style.display = 'none';
-									iconClipboard.style.display = 'inline';
-								}, 2000);
-							};
-							
-							if (navigator.clipboard && window.isSecureContext) {
-								navigator.clipboard.writeText(codeToCopy)
-									.then(showCopied)
-									.catch(() => fallbackCopyText(codeToCopy, iconCheck, iconClipboard));
-							} else {
-								fallbackCopyText(codeToCopy, iconCheck, iconClipboard);
-							}
-						};
-
-						copyButton.addEventListener('click', newListener);
-						copyButton._copyListener = newListener; // Store listener for removal
-					}
-					
-					component._codeInitialized = true; // Mark as initialized
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-code-component]')) {
-						initCode(root);
-					}
-					for (const component of root.querySelectorAll('[data-code-component]')) {
-						initCode(component);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						whenHljsReady(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => {
-					whenHljsReady(() => initAllComponents());
-				});
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // IIFE End
-		</script>
-	}
 }

server/web/templui/components/code/code_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component code - version: main installed by templui v0.71.0
+// templui component code - version: v0.84.0 installed by templui v0.84.0
 
 package code
 
@@ -54,7 +54,7 @@ func Code(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/pojoaque.min.css\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -70,7 +70,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "<div id=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -83,7 +83,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\" class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -96,7 +96,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" data-code-component")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\" data-code-component")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -104,7 +104,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "><pre class=\"overflow-hidden!\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "><pre class=\"overflow-hidden!\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -123,7 +123,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "<code data-code-block class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "<code data-code-block class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -136,7 +136,7 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -144,12 +144,12 @@ func Code(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</code></pre>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</code></pre>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		if p.ShowCopyButton {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "<button data-copy-button type=\"button\" class=\"absolute top-2 right-2 hover:bg-gray-500 hover:bg-opacity-30 text-white p-2 rounded\"><span data-icon-check class=\"hidden\">")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "<button data-copy-button type=\"button\" class=\"absolute top-2 right-2 hover:bg-gray-500 hover:bg-opacity-30 text-white p-2 rounded\"><span data-icon-check class=\"hidden\">")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -157,7 +157,7 @@ func Code(props ...Props) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "</span> <span data-icon-clipboard>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</span> <span data-icon-clipboard>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -165,12 +165,12 @@ func Code(props ...Props) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</span></button>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</span></button>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -178,8 +178,6 @@ func Code(props ...Props) templ.Component {
 	})
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -201,51 +199,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var7 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<script defer src=\"/assets/js/code.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "<link rel=\"stylesheet\" href=\"/assets/pojoaque.min.css\"><script nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var9 string
-			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/code/code.templ`, Line: 82, Col: 37}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\" src=\"/assets/highlight.min.js\"></script> <script nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var10 string
-			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/code/code.templ`, Line: 83, Col: 37}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\">\n\t\t\t(function() { // IIFE Start\n\t\t\t\tfunction whenHljsReady(callback, attempt = 1) {\n\t\t\t\t\tif (typeof hljs !== \"undefined\") {\n\t\t\t\t\t\tcallback();\n\t\t\t\t\t} else if (attempt < 20) { // Retry for a few seconds\n\t\t\t\t\t\tsetTimeout(() => whenHljsReady(callback, attempt + 1), 100);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconsole.error(\"highlight.js (hljs) failed to load after several attempts.\");\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tfunction fallbackCopyText(text, iconCheck, iconClipboard) {\n\t\t\t\t\tconst textArea = document.createElement('textarea');\n\t\t\t\t\ttextArea.value = text;\n\t\t\t\t\ttextArea.style.position = 'fixed';\n\t\t\t\t\ttextArea.style.top = '-9999px';\n\t\t\t\t\ttextArea.style.left = '-9999px';\n\t\t\t\t\tdocument.body.appendChild(textArea);\n\t\t\t\t\ttextArea.focus();\n\t\t\t\t\ttextArea.select();\n\t\t\t\t\t\n\t\t\t\t\ttry {\n\t\t\t\t\t\tif (document.execCommand('copy')) {\n\t\t\t\t\t\t\ticonCheck.style.display = 'inline';\n\t\t\t\t\t\t\ticonClipboard.style.display = 'none';\n\t\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\t\ticonCheck.style.display = 'none';\n\t\t\t\t\t\t\t\ticonClipboard.style.display = 'inline';\n\t\t\t\t\t\t\t}, 2000);\n\t\t\t\t\t\t}\n\t\t\t\t\t} catch (err) {\n\t\t\t\t\t\tconsole.error('Fallback copy failed', err);\n\t\t\t\t\t} finally {\n\t\t\t\t\t\tdocument.body.removeChild(textArea);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tfunction initCode(component) {\n\t\t\t\t\tif (!component || component._codeInitialized) return; // Basic initialized check\n\n\t\t\t\t\tconst codeBlock = component.querySelector('[data-code-block]');\n\t\t\t\t\tconst copyButton = component.querySelector('[data-copy-button]');\n\t\t\t\t\tconst iconCheck = component.querySelector('[data-icon-check]');\n\t\t\t\t\tconst iconClipboard = component.querySelector('[data-icon-clipboard]');\n\n\t\t\t\t\t// Highlight if hljs is available and not already highlighted\n\t\t\t\t\tif (codeBlock && typeof hljs !== 'undefined') {\n\t\t\t\t\t\tif (!codeBlock.classList.contains('hljs')) {\n\t\t\t\t\t\t\thljs.highlightElement(codeBlock);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Setup copy button if elements exist\n\t\t\t\t\tif (copyButton && codeBlock && iconCheck && iconClipboard) {\n\t\t\t\t\t\t// Remove previous listener if any (important for re-initialization)\n\t\t\t\t\t\tconst oldListener = copyButton._copyListener;\n\t\t\t\t\t\tif (oldListener) {\n\t\t\t\t\t\t\tcopyButton.removeEventListener('click', oldListener);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newListener = () => {\n\t\t\t\t\t\t\tconst codeToCopy = codeBlock.textContent || '';\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tconst showCopied = () => {\n\t\t\t\t\t\t\t\ticonCheck.style.display = 'inline';\n\t\t\t\t\t\t\t\ticonClipboard.style.display = 'none';\n\t\t\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\t\t\ticonCheck.style.display = 'none';\n\t\t\t\t\t\t\t\t\ticonClipboard.style.display = 'inline';\n\t\t\t\t\t\t\t\t}, 2000);\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tif (navigator.clipboard && window.isSecureContext) {\n\t\t\t\t\t\t\t\tnavigator.clipboard.writeText(codeToCopy)\n\t\t\t\t\t\t\t\t\t.then(showCopied)\n\t\t\t\t\t\t\t\t\t.catch(() => fallbackCopyText(codeToCopy, iconCheck, iconClipboard));\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tfallbackCopyText(codeToCopy, iconCheck, iconClipboard);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tcopyButton.addEventListener('click', newListener);\n\t\t\t\t\t\tcopyButton._copyListener = newListener; // Store listener for removal\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tcomponent._codeInitialized = true; // Mark as initialized\n\t\t\t\t}\n\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('[data-code-component]')) {\n\t\t\t\t\t\tinitCode(root);\n\t\t\t\t\t}\n\t\t\t\t\tfor (const component of root.querySelectorAll('[data-code-component]')) {\n\t\t\t\t\t\tinitCode(component);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\twhenHljsReady(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => {\n\t\t\t\t\twhenHljsReady(() => initAllComponents());\n\t\t\t\t});\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // IIFE End\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/datepicker/datepicker.templ

@@ -0,0 +1,141 @@
+// templui component datepicker - version: v0.84.0 installed by templui v0.84.0
+package datepicker
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/button"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/calendar"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/card"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/icon"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/popover"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"time"
+)
+
+type Format string
+type LocaleTag string
+
+const (
+	FormatLOCALE_SHORT  Format = "locale-short"  // Locale-specific short format (e.g., MM/DD/YY or DD.MM.YY)
+	FormatLOCALE_MEDIUM Format = "locale-medium" // Locale-specific medium format (e.g., Jan 5, 2024 or 5. Jan. 2024)
+	FormatLOCALE_LONG   Format = "locale-long"   // Locale-specific long format (e.g., January 5, 2024 or 5. Januar 2024)
+	FormatLOCALE_FULL   Format = "locale-full"   // Locale-specific full format (e.g., Monday, January 5, 2024 or Montag, 5. Januar 2024)
+)
+
+// Common Locale  (BCP 47)
+var (
+	LocaleDefaultTag    = LocaleTag("en-US")
+	LocaleTagChinese    = LocaleTag("zh-CN")
+	LocaleTagFrench     = LocaleTag("fr-FR")
+	LocaleTagGerman     = LocaleTag("de-DE")
+	LocaleTagItalian    = LocaleTag("it-IT")
+	LocaleTagJapanese   = LocaleTag("ja-JP")
+	LocaleTagPortuguese = LocaleTag("pt-PT")
+	LocaleTagSpanish    = LocaleTag("es-ES")
+)
+
+type Props struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Value       time.Time
+	Format      Format    // Controls the display format using Intl dateStyle options.
+	LocaleTag   LocaleTag // BCP 47 Locale Tag (e.g., "en-US", "es-ES"). Determines language and regional format defaults.
+	Placeholder string
+	Disabled    bool
+	Required    bool
+	HasError    bool
+	Name        string
+}
+
+templ DatePicker(props ...Props) {
+	{{
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		if p.ID == "" {
+			p.ID = utils.RandomID()
+		}
+		if p.Name == "" {
+			p.Name = p.ID
+		}
+		if p.Placeholder == "" {
+			p.Placeholder = "Select a date"
+		}
+		if p.LocaleTag == "" {
+			p.LocaleTag = LocaleDefaultTag
+		}
+		if p.Format == "" {
+			p.Format = FormatLOCALE_MEDIUM
+		}
+
+		var contentID = p.ID + "-content"
+		var valuePtr *time.Time
+		if !p.Value.IsZero() {
+			valuePtr = &p.Value
+		}
+	}}
+	@popover.Trigger(popover.TriggerProps{For: contentID}) {
+		@button.Button(button.Props{
+			ID:      p.ID,
+			Variant: button.VariantOutline,
+			Class: utils.TwMerge(
+				// Base styles matching input
+				"w-full h-9 px-3 py-1 text-base md:text-sm",
+				"flex items-center justify-between",
+				"rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Focus styles
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+				p.Class,
+			),
+			Disabled: p.Disabled,
+			Attributes: utils.MergeAttributes(p.Attributes, templ.Attributes{
+				"data-datepicker":     "true",
+				"data-display-format": string(p.Format),
+				"data-locale-tag":     string(p.LocaleTag),
+				"data-placeholder":    p.Placeholder,
+				"aria-invalid":        utils.If(p.HasError, "true"),
+			}),
+		}) {
+			if p.Placeholder != "" {
+				<span data-datepicker-display class={ "text-left grow text-muted-foreground" }>
+					{ p.Placeholder }
+				</span>
+			}
+			<span class="text-muted-foreground flex items-center ml-2">
+				@icon.Calendar(icon.Props{Size: 16})
+			</span>
+		}
+	}
+	@popover.Content(popover.ContentProps{
+		ID:        contentID,
+		Placement: popover.PlacementBottomStart,
+		Class:     "p-0",
+	}) {
+		@card.Card(card.Props{
+			Class: "border-0 shadow-none",
+		}) {
+			@card.Content(card.ContentProps{
+				Class: "p-3",
+			}) {
+				@calendar.Calendar(calendar.Props{
+					ID:        p.ID + "-calendar-instance",     // Pass ID for calendar instance
+					Name:      p.Name,                          // Pass Name for hidden input
+					LocaleTag: calendar.LocaleTag(p.LocaleTag), // Pass locale tag to calendar
+					Value:     valuePtr,                        // Pass pointer to value
+				})
+			}
+		}
+	}
+}
+
+templ Script() {
+	<script defer src="/assets/js/datepicker.min.js"></script>
+}

server/web/templui/components/datepicker/datepicker_templ.go

@@ -0,0 +1,322 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component datepicker - version: v0.84.0 installed by templui v0.84.0
+
+package datepicker
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/button"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/calendar"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/card"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/icon"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/popover"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"time"
+)
+
+type Format string
+type LocaleTag string
+
+const (
+	FormatLOCALE_SHORT  Format = "locale-short"  // Locale-specific short format (e.g., MM/DD/YY or DD.MM.YY)
+	FormatLOCALE_MEDIUM Format = "locale-medium" // Locale-specific medium format (e.g., Jan 5, 2024 or 5. Jan. 2024)
+	FormatLOCALE_LONG   Format = "locale-long"   // Locale-specific long format (e.g., January 5, 2024 or 5. Januar 2024)
+	FormatLOCALE_FULL   Format = "locale-full"   // Locale-specific full format (e.g., Monday, January 5, 2024 or Montag, 5. Januar 2024)
+)
+
+// Common Locale  (BCP 47)
+var (
+	LocaleDefaultTag    = LocaleTag("en-US")
+	LocaleTagChinese    = LocaleTag("zh-CN")
+	LocaleTagFrench     = LocaleTag("fr-FR")
+	LocaleTagGerman     = LocaleTag("de-DE")
+	LocaleTagItalian    = LocaleTag("it-IT")
+	LocaleTagJapanese   = LocaleTag("ja-JP")
+	LocaleTagPortuguese = LocaleTag("pt-PT")
+	LocaleTagSpanish    = LocaleTag("es-ES")
+)
+
+type Props struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Value       time.Time
+	Format      Format    // Controls the display format using Intl dateStyle options.
+	LocaleTag   LocaleTag // BCP 47 Locale Tag (e.g., "en-US", "es-ES"). Determines language and regional format defaults.
+	Placeholder string
+	Disabled    bool
+	Required    bool
+	HasError    bool
+	Name        string
+}
+
+func DatePicker(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		if p.ID == "" {
+			p.ID = utils.RandomID()
+		}
+		if p.Name == "" {
+			p.Name = p.ID
+		}
+		if p.Placeholder == "" {
+			p.Placeholder = "Select a date"
+		}
+		if p.LocaleTag == "" {
+			p.LocaleTag = LocaleDefaultTag
+		}
+		if p.Format == "" {
+			p.Format = FormatLOCALE_MEDIUM
+		}
+
+		var contentID = p.ID + "-content"
+		var valuePtr *time.Time
+		if !p.Value.IsZero() {
+			valuePtr = &p.Value
+		}
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Var3 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+				if !templ_7745c5c3_IsBuffer {
+					defer func() {
+						templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+						if templ_7745c5c3_Err == nil {
+							templ_7745c5c3_Err = templ_7745c5c3_BufErr
+						}
+					}()
+				}
+				ctx = templ.InitializeContext(ctx)
+				if p.Placeholder != "" {
+					var templ_7745c5c3_Var4 = []any{"text-left grow text-muted-foreground"}
+					templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var4...)
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<span data-datepicker-display class=\"")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					var templ_7745c5c3_Var5 string
+					templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var4).String())
+					if templ_7745c5c3_Err != nil {
+						return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/datepicker/datepicker.templ`, Line: 1, Col: 0}
+					}
+					_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\">")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					var templ_7745c5c3_Var6 string
+					templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.Placeholder)
+					if templ_7745c5c3_Err != nil {
+						return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/datepicker/datepicker.templ`, Line: 109, Col: 20}
+					}
+					_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</span>")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " <span class=\"text-muted-foreground flex items-center ml-2\">")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = icon.Calendar(icon.Props{Size: 16}).Render(ctx, templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "</span>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				return nil
+			})
+			templ_7745c5c3_Err = button.Button(button.Props{
+				ID:      p.ID,
+				Variant: button.VariantOutline,
+				Class: utils.TwMerge(
+					// Base styles matching input
+					"w-full h-9 px-3 py-1 text-base md:text-sm",
+					"flex items-center justify-between",
+					"rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+					// Dark mode background
+					"dark:bg-input/30",
+					// Selection styles
+					"selection:bg-primary selection:text-primary-foreground",
+					// Focus styles
+					"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					// Error/Invalid styles
+					"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+					utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+					p.Class,
+				),
+				Disabled: p.Disabled,
+				Attributes: utils.MergeAttributes(p.Attributes, templ.Attributes{
+					"data-datepicker":     "true",
+					"data-display-format": string(p.Format),
+					"data-locale-tag":     string(p.LocaleTag),
+					"data-placeholder":    p.Placeholder,
+					"aria-invalid":        utils.If(p.HasError, "true"),
+				}),
+			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var3), templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = popover.Trigger(popover.TriggerProps{For: contentID}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+				if !templ_7745c5c3_IsBuffer {
+					defer func() {
+						templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+						if templ_7745c5c3_Err == nil {
+							templ_7745c5c3_Err = templ_7745c5c3_BufErr
+						}
+					}()
+				}
+				ctx = templ.InitializeContext(ctx)
+				templ_7745c5c3_Var9 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+					templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+					templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+					if !templ_7745c5c3_IsBuffer {
+						defer func() {
+							templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+							if templ_7745c5c3_Err == nil {
+								templ_7745c5c3_Err = templ_7745c5c3_BufErr
+							}
+						}()
+					}
+					ctx = templ.InitializeContext(ctx)
+					templ_7745c5c3_Err = calendar.Calendar(calendar.Props{
+						ID:        p.ID + "-calendar-instance",     // Pass ID for calendar instance
+						Name:      p.Name,                          // Pass Name for hidden input
+						LocaleTag: calendar.LocaleTag(p.LocaleTag), // Pass locale tag to calendar
+						Value:     valuePtr,                        // Pass pointer to value
+					}).Render(ctx, templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					return nil
+				})
+				templ_7745c5c3_Err = card.Content(card.ContentProps{
+					Class: "p-3",
+				}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var9), templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				return nil
+			})
+			templ_7745c5c3_Err = card.Card(card.Props{
+				Class: "border-0 shadow-none",
+			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = popover.Content(popover.ContentProps{
+			ID:        contentID,
+			Placement: popover.PlacementBottomStart,
+			Class:     "p-0",
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Script() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "<script defer src=\"/assets/js/datepicker.min.js\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/drawer/drawer.templ

@@ -1,4 +1,4 @@
-// templui component drawer - version: main installed by templui v0.71.0
+// templui component drawer - version: v0.84.0 installed by templui v0.84.0
 package drawer
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
@@ -12,24 +12,19 @@ const (
 	PositionLeft   Position = "left"
 )
 
-type Props struct {
-	ID         string
-	Class      string
-	Attributes templ.Attributes
-	Side       Position
-}
-
 type TriggerProps struct {
 	ID         string
 	Class      string
 	Attributes templ.Attributes
+	For        string // ID of the drawer to trigger
 }
 
 type ContentProps struct {
-	ID         string
+	ID          string
-	Class      string
+	Class       string
-	Attributes templ.Attributes
+	Attributes  templ.Attributes
-	Position   Position
+	Position    Position
+	InitialOpen bool
 }
 
 type HeaderProps struct {
@@ -60,26 +55,7 @@ type CloseProps struct {
 	ID         string
 	Class      string
 	Attributes templ.Attributes
-}
+	For        string // ID of the drawer to close (optional, defaults to closest drawer)
-
-templ Drawer(props ...Props) {
-	@Script()
-	{{ var p Props }}
-	if len(props) > 0 {
-		{{ p = props[0] }}
-	}
-	if p.ID == "" {
-		{{ p.ID = utils.RandomID() }}
-	}
-	<div
-		id={ p.ID }
-		class={ utils.TwMerge("relative", p.Class) }
-		data-component="drawer"
-		data-drawer-id={ p.ID }
-		{ p.Attributes... }
-	>
-		{ children... }
-	</div>
 }
 
 templ Trigger(props ...TriggerProps) {
@@ -91,8 +67,11 @@ templ Trigger(props ...TriggerProps) {
 		if p.ID != "" {
 			id={ p.ID }
 		}
-		class={ utils.TwMerge("cursor-pointer", p.Class) }
+		class={ utils.TwMerge("group cursor-pointer", p.Class) }
-		data-drawer-trigger
+		if p.For != "" {
+			data-drawer-trigger={ p.For }
+		}
+		data-open="false"
 		{ p.Attributes... }
 	>
 		{ children... }
@@ -113,6 +92,11 @@ templ Content(props ...ContentProps) {
 		}
 		class="fixed inset-0 z-50 bg-background/80 backdrop-blur-xs templui-drawer-backdrop hidden"
 		data-drawer-backdrop
+		data-component="drawer"
+		data-open="false"
+		if p.InitialOpen {
+			data-initial-open="true"
+		}
 	></div>
 	<div
 		id={ p.ID + "-content" }
@@ -229,204 +213,17 @@ templ Close(props ...CloseProps) {
 				p.Class,
 			),
 		}
-		data-drawer-close
+		if p.For != "" {
+			data-drawer-close={ p.For }
+		} else {
+			data-drawer-close
+		}
 		{ p.Attributes... }
 	>
 		{ children... }
 	</button>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/drawer.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-   
-			(function() { // IIFE
-				function initDrawer(drawer) {
-					// Get the drawer elements
-					const triggers = drawer.querySelectorAll('[data-drawer-trigger]');
-					const content = drawer.querySelector('[data-drawer-content]');
-					const backdrop = drawer.querySelector('[data-drawer-backdrop]');
-					const closeButtons = drawer.querySelectorAll('[data-drawer-close]');
-					const position = content?.getAttribute('data-drawer-position') || 'right';
-					
-					if (!content || !backdrop) return;
-					
-					// Set up animations based on position
-					const transitions = {
-						'left': {
-							enterFrom: 'opacity-0 -translate-x-full',
-							enterTo: 'opacity-100 translate-x-0',
-							leaveFrom: 'opacity-100 translate-x-0',
-							leaveTo: 'opacity-0 -translate-x-full'
-						},
-						'right': {
-							enterFrom: 'opacity-0 translate-x-full',
-							enterTo: 'opacity-100 translate-x-0',
-							leaveFrom: 'opacity-100 translate-x-0',
-							leaveTo: 'opacity-0 translate-x-full'
-						},
-						'top': {
-							enterFrom: 'opacity-0 -translate-y-full',
-							enterTo: 'opacity-100 translate-y-0',
-							leaveFrom: 'opacity-100 translate-y-0',
-							leaveTo: 'opacity-0 -translate-y-full'
-						},
-						'bottom': {
-							enterFrom: 'opacity-0 translate-y-full',
-							enterTo: 'opacity-100 translate-y-0',
-							leaveFrom: 'opacity-100 translate-y-0',
-							leaveTo: 'opacity-0 translate-y-full'
-						}
-					};
-
-					// Check if drawer is already initialized
-					if (drawer.dataset.drawerInitialized) {
-						return;
-					}
-					drawer.dataset.drawerInitialized = 'true';
-
-					// Initial styles
-					content.style.transform = position === 'left' ? 'translateX(-100%)' : 
-											position === 'right' ? 'translateX(100%)' :
-											position === 'top' ? 'translateY(-100%)' : 
-											'translateY(100%)';
-					content.style.opacity = '0';
-					backdrop.style.opacity = '0';
-					content.style.display = 'none'; // Ensure it starts hidden
-					backdrop.style.display = 'none'; // Ensure it starts hidden
-					
-					// Function to open the drawer
-					function openDrawer() {
-						// Display elements
-						backdrop.style.display = 'block';
-						content.style.display = 'block';
-						
-						// Trigger reflow
-						void content.offsetWidth;
-						
-						// Apply transitions
-						backdrop.style.transition = 'opacity 300ms ease-out';
-						content.style.transition = 'opacity 300ms ease-out, transform 300ms ease-out';
-						
-						// Animate in
-						backdrop.style.opacity = '1';
-						content.style.opacity = '1';
-						content.style.transform = 'translate(0)';
-						
-						// Lock body scroll
-						document.body.style.overflow = 'hidden';
-						
-						// Add event listeners for close actions
-						backdrop.addEventListener('click', closeDrawer);
-						document.addEventListener('keydown', handleEscKey);
-						document.addEventListener('click', handleClickAway);
-					}
-					
-					// Function to close the drawer
-					function closeDrawer() {
-						// Remove event listeners before animation starts
-						backdrop.removeEventListener('click', closeDrawer);
-						document.removeEventListener('keydown', handleEscKey);
-						document.removeEventListener('click', handleClickAway);
-
-						// Apply transitions
-						backdrop.style.transition = 'opacity 300ms ease-in';
-						content.style.transition = 'opacity 300ms ease-in, transform 300ms ease-in';
-						
-						// Animate out
-						backdrop.style.opacity = '0';
-						
-						if (position === 'left') {
-							content.style.transform = 'translateX(-100%)';
-						} else if (position === 'right') {
-							content.style.transform = 'translateX(100%)';
-						} else if (position === 'top') {
-							content.style.transform = 'translateY(-100%)';
-						} else if (position === 'bottom') {
-							content.style.transform = 'translateY(100%)';
-						}
-						
-						content.style.opacity = '0';
-						
-						// Hide elements after animation
-						setTimeout(() => {
-							if (content.style.opacity === '0') { // Check if it wasn't reopened during the timeout
-								backdrop.style.display = 'none';
-								content.style.display = 'none';
-							}
-							// Unlock body scroll only if no other drawers are open
-							const anyDrawerOpen = document.querySelector('[data-component="drawer"] [data-drawer-backdrop][style*="display: block"]');
-							if (!anyDrawerOpen) {
-								document.body.style.overflow = '';
-							}
-						}, 300);
-					}
-					
-					// Click away handler
-					function handleClickAway(e) {
-						// Check if the click is outside the content AND not on any trigger associated with THIS drawer
-						if (content.style.display === 'block' &&
-							!content.contains(e.target) &&
-							!Array.from(triggers).some(trigger => trigger.contains(e.target))) {
-							closeDrawer();
-						}
-					}
-					
-					// ESC key handler
-					function handleEscKey(e) {
-						if (e.key === 'Escape' && content.style.display === 'block') {
-							closeDrawer();
-						}
-					}
-					
-					// Set up trigger click listeners
-					triggers.forEach(trigger => {
-						trigger.removeEventListener('click', openDrawer); // Remove potential duplicates
-						trigger.addEventListener('click', openDrawer);
-					});
-					
-					// Set up close button listeners
-					closeButtons.forEach(button => {
-						button.removeEventListener('click', closeDrawer); // Remove potential duplicates
-						button.addEventListener('click', closeDrawer);
-					});
-					
-					// Stop propagation on the inner content click to prevent backdrop click handler
-					const inner = content.querySelector('[data-drawer-inner]');
-					if (inner) {
-						inner.removeEventListener('click', stopPropagationHandler); // Remove potential duplicates
-						inner.addEventListener('click', stopPropagationHandler);
-					}
-				}
-
-				function stopPropagationHandler(e) {
-					e.stopPropagation();
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-component="drawer"]')) {
-						initDrawer(root);
-					}
-					if (root && typeof root.querySelectorAll === 'function') {
-						const drawers = root.querySelectorAll('[data-component="drawer"]');
-						drawers.forEach(initDrawer);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-        </script>
-	}
 }

server/web/templui/components/dropdown/dropdown.templ

@@ -1,4 +1,4 @@
-// templui component dropdown - version: main installed by templui v0.71.0
+// templui component dropdown - version: v0.84.0 installed by templui v0.84.0
 package dropdown
 
 import (
@@ -50,12 +50,13 @@ type LabelProps struct {
 }
 
 type ItemProps struct {
-	ID         string
+	ID           string
-	Class      string
+	Class        string
-	Attributes templ.Attributes
+	Attributes   templ.Attributes
-	Disabled   bool
+	Disabled     bool
-	Href       string
+	Href         string
-	Target     string
+	Target       string
+	PreventClose bool
 }
 
 type SeparatorProps struct {
@@ -95,7 +96,6 @@ type PortalProps struct {
 }
 
 templ Dropdown(props ...Props) {
-	@Script()
 	{{
 		var p Props
 		if len(props) > 0 {
@@ -107,11 +107,7 @@ templ Dropdown(props ...Props) {
 		}
 		ctx = context.WithValue(ctx, contentIDKey, contentID)
 	}}
-	@popover.Popover(popover.Props{
+	{ children... }
-		Class: p.Class,
-	}) {
-		{ children... }
-	}
 }
 
 templ Trigger(props ...TriggerProps) {
@@ -232,6 +228,9 @@ templ Item(props ...ItemProps) {
 			}
 			role="menuitem"
 			data-dropdown-item
+			if p.PreventClose {
+				data-prevent-close="true"
+			}
 			{ p.Attributes... }
 		>
 			{ children... }
@@ -250,6 +249,9 @@ templ Item(props ...ItemProps) {
 			role="menuitem"
 			data-dropdown-item
 			disabled?={ p.Disabled }
+			if p.PreventClose {
+				data-prevent-close="true"
+			}
 			{ p.Attributes... }
 		>
 			{ children... }
@@ -377,45 +379,6 @@ templ SubContent(props ...SubContentProps) {
 	}
 }
 
-var dropdownHandle = templ.NewOnceHandle()
-
 templ Script() {
-	<script nonce={ templ.GetNonce(ctx) }>
+	<script defer src="/assets/js/dropdown.min.js"></script>
-		(function() { // IIFE
-			function handleDropdownItemClick(event) {
-				const item = event.currentTarget;
-				const popoverContent = item.closest('[data-popover-id]');
-				if (popoverContent) {
-					const popoverId = popoverContent.dataset.popoverId;
-					if (window.closePopover) {
-						window.closePopover(popoverId, true);
-					} else {
-						console.warn("popover.Script's closePopover function not found.");
-						document.body.click(); // Fallback
-					}
-				}
-			}
-
-			function initAllComponents(root = document) {
-				// Select items with 'data-dropdown-item' but not 'data-dropdown-submenu-trigger'
-				const items = root.querySelectorAll('[data-dropdown-item]:not([data-dropdown-submenu-trigger])');
-				items.forEach(item => {
-					item.removeEventListener('click', handleDropdownItemClick);
-					item.addEventListener('click', handleDropdownItemClick);
-				});
-			}
-
-			const handleHtmxSwap = (event) => {
-				const target = event.detail.target || event.detail.elt;
-				if (target instanceof Element) {
-					requestAnimationFrame(() => initAllComponents(target));
-				}
-			};
-
-			initAllComponents();
-			document.addEventListener('DOMContentLoaded', () => initAllComponents());
-			document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-			document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-		})(); // End of IIFE
-	</script>
 }

server/web/templui/components/dropdown/dropdown_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component dropdown - version: main installed by templui v0.71.0
+// templui component dropdown - version: v0.84.0 installed by templui v0.84.0
 
 package dropdown
 
@@ -59,12 +59,13 @@ type LabelProps struct {
 }
 
 type ItemProps struct {
-	ID         string
+	ID           string
-	Class      string
+	Class        string
-	Attributes templ.Attributes
+	Attributes   templ.Attributes
-	Disabled   bool
+	Disabled     bool
-	Href       string
+	Href         string
-	Target     string
+	Target       string
+	PreventClose bool
 }
 
 type SeparatorProps struct {
@@ -124,10 +125,6 @@ func Dropdown(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 
 		var p Props
 		if len(props) > 0 {
@@ -138,27 +135,7 @@ func Dropdown(props ...Props) templ.Component {
 			contentID = utils.RandomID()
 		}
 		ctx = context.WithValue(ctx, contentIDKey, contentID)
-		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = popover.Popover(popover.Props{
-			Class: p.Class,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -182,9 +159,9 @@ func Trigger(props ...TriggerProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var2 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var3 == nil {
+		if templ_7745c5c3_Var2 == nil {
-			templ_7745c5c3_Var3 = templ.NopComponent
+			templ_7745c5c3_Var2 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 
@@ -196,7 +173,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 		if !ok {
 			contentID = "fallback-content-id"
 		}
-		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var3 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -208,8 +185,8 @@ func Trigger(props ...TriggerProps) templ.Component {
 				}()
 			}
 			ctx = templ.InitializeContext(ctx)
-			var templ_7745c5c3_Var5 = []any{utils.TwMerge("inline-block", p.Class)}
+			var templ_7745c5c3_Var4 = []any{utils.TwMerge("inline-block", p.Class)}
-			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var5...)
+			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var4...)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -217,12 +194,12 @@ func Trigger(props ...TriggerProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var6 string
+			var templ_7745c5c3_Var5 string
-			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var5).String())
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var4).String())
 			if templ_7745c5c3_Err != nil {
 				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -238,7 +215,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = templ_7745c5c3_Var2.Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -251,7 +228,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 		templ_7745c5c3_Err = popover.Trigger(popover.TriggerProps{
 			ID:  p.ID,
 			For: contentID, TriggerType: popover.TriggerTypeClick,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var3), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -275,9 +252,9 @@ func Content(props ...ContentProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var6 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var7 == nil {
+		if templ_7745c5c3_Var6 == nil {
-			templ_7745c5c3_Var7 = templ.NopComponent
+			templ_7745c5c3_Var6 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p ContentProps
@@ -294,7 +271,7 @@ func Content(props ...ContentProps) templ.Component {
 			maxHeight = p.MaxHeight
 		}
 		maxHeightClass := fmt.Sprintf("max-h-[%s]", maxHeight)
-		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -306,7 +283,7 @@ func Content(props ...ContentProps) templ.Component {
 				}()
 			}
 			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = templ_7745c5c3_Var6.Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -325,7 +302,7 @@ func Content(props ...ContentProps) templ.Component {
 				p.Class,
 			),
 			Attributes: p.Attributes,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -349,17 +326,17 @@ func Group(props ...GroupProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var8 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var9 == nil {
+		if templ_7745c5c3_Var8 == nil {
-			templ_7745c5c3_Var9 = templ.NopComponent
+			templ_7745c5c3_Var8 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p GroupProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		var templ_7745c5c3_Var10 = []any{utils.TwMerge("py-1", p.Class)}
+		var templ_7745c5c3_Var9 = []any{utils.TwMerge("py-1", p.Class)}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var10...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var9...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -372,12 +349,12 @@ func Group(props ...GroupProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var11 string
+			var templ_7745c5c3_Var10 string
-			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 182, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 178, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -390,12 +367,12 @@ func Group(props ...GroupProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var12 string
+		var templ_7745c5c3_Var11 string
-		templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var10).String())
+		templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var9).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -411,7 +388,7 @@ func Group(props ...GroupProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = templ_7745c5c3_Var8.Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -439,17 +416,17 @@ func Label(props ...LabelProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var13 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var12 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var13 == nil {
+		if templ_7745c5c3_Var12 == nil {
-			templ_7745c5c3_Var13 = templ.NopComponent
+			templ_7745c5c3_Var12 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p LabelProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		var templ_7745c5c3_Var14 = []any{utils.TwMerge("px-2 py-1.5 text-sm font-semibold", p.Class)}
+		var templ_7745c5c3_Var13 = []any{utils.TwMerge("px-2 py-1.5 text-sm font-semibold", p.Class)}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var14...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var13...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -462,12 +439,12 @@ func Label(props ...LabelProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var15 string
+			var templ_7745c5c3_Var14 string
-			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 199, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 195, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -480,12 +457,12 @@ func Label(props ...LabelProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var16 string
+		var templ_7745c5c3_Var15 string
-		templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var14).String())
+		templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var13).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -501,7 +478,7 @@ func Label(props ...LabelProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templ_7745c5c3_Var13.Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = templ_7745c5c3_Var12.Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -529,9 +506,9 @@ func Item(props ...ItemProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var17 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var16 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var17 == nil {
+		if templ_7745c5c3_Var16 == nil {
-			templ_7745c5c3_Var17 = templ.NopComponent
+			templ_7745c5c3_Var16 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p ItemProps
@@ -542,7 +519,7 @@ func Item(props ...ItemProps) templ.Component {
 			p.ID = utils.RandomID()
 		}
 		if p.Href != "" {
-			var templ_7745c5c3_Var18 = []any{
+			var templ_7745c5c3_Var17 = []any{
 				utils.TwMerge(
 					"flex text-left items-center px-2 py-1.5 text-sm rounded-sm",
 					utils.If(!p.Disabled, "focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground cursor-default"),
@@ -550,7 +527,7 @@ func Item(props ...ItemProps) templ.Component {
 					p.Class,
 				),
 			}
-			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var18...)
+			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var17...)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -558,12 +535,12 @@ func Item(props ...ItemProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var19 string
+			var templ_7745c5c3_Var18 string
-			templ_7745c5c3_Var19, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 218, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 214, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var19))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -576,8 +553,8 @@ func Item(props ...ItemProps) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var20 templ.SafeURL = templ.SafeURL(p.Href)
+				var templ_7745c5c3_Var19 templ.SafeURL = templ.SafeURL(p.Href)
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(string(templ_7745c5c3_Var20)))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(string(templ_7745c5c3_Var19)))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -591,12 +568,12 @@ func Item(props ...ItemProps) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var21 string
+				var templ_7745c5c3_Var20 string
-				templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(p.Target)
+				templ_7745c5c3_Var20, templ_7745c5c3_Err = templ.JoinStringErrs(p.Target)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 223, Col: 21}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 219, Col: 21}
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var20))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -609,12 +586,12 @@ func Item(props ...ItemProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var22 string
+			var templ_7745c5c3_Var21 string
-			templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var18).String())
+			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var17).String())
 			if templ_7745c5c3_Err != nil {
 				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -622,67 +599,8 @@ func Item(props ...ItemProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+			if p.PreventClose {
-			if templ_7745c5c3_Err != nil {
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, " data-prevent-close=\"true\"")
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, ">")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templ_7745c5c3_Var17.Render(ctx, templ_7745c5c3_Buffer)
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "</a>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		} else {
-			var templ_7745c5c3_Var23 = []any{
-				utils.TwMerge(
-					"w-full text-left flex items-center justify-between px-2 py-1.5 text-sm rounded-sm",
-					utils.If(!p.Disabled, "focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground cursor-default"),
-					utils.If(p.Disabled, "opacity-50 pointer-events-none"),
-					p.Class,
-				),
-			}
-			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var23...)
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "<button id=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var24 string
-			templ_7745c5c3_Var24, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 241, Col: 12}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var24))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "\" class=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var25 string
-			templ_7745c5c3_Var25, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var23).String())
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var25))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\" role=\"menuitem\" data-dropdown-item")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			if p.Disabled {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " disabled")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -691,15 +609,86 @@ func Item(props ...ItemProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, ">")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, ">")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templ_7745c5c3_Var17.Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = templ_7745c5c3_Var16.Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, "</button>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "</a>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		} else {
+			var templ_7745c5c3_Var22 = []any{
+				utils.TwMerge(
+					"w-full text-left flex items-center justify-between px-2 py-1.5 text-sm rounded-sm",
+					utils.If(!p.Disabled, "focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground cursor-default"),
+					utils.If(p.Disabled, "opacity-50 pointer-events-none"),
+					p.Class,
+				),
+			}
+			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var22...)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "<button id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var23 string
+			templ_7745c5c3_Var23, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 240, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var23))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\" class=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var24 string
+			templ_7745c5c3_Var24, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var22).String())
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var24))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "\" role=\"menuitem\" data-dropdown-item")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			if p.Disabled {
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, " disabled")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+			}
+			if p.PreventClose {
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " data-prevent-close=\"true\"")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+			}
+			templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, ">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var16.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, "</button>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -724,57 +713,57 @@ func Separator(props ...SeparatorProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var26 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var25 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var26 == nil {
+		if templ_7745c5c3_Var25 == nil {
-			templ_7745c5c3_Var26 = templ.NopComponent
+			templ_7745c5c3_Var25 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p SeparatorProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		var templ_7745c5c3_Var27 = []any{utils.TwMerge("h-px my-1 -mx-1 bg-muted", p.Class)}
+		var templ_7745c5c3_Var26 = []any{utils.TwMerge("h-px my-1 -mx-1 bg-muted", p.Class)}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var27...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var26...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "<div")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "<div")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		if p.ID != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " id=\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " id=\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var28 string
+			var templ_7745c5c3_Var27 string
-			templ_7745c5c3_Var28, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var27, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 267, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 269, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var28))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var27))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, " class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var29 string
+		var templ_7745c5c3_Var28 string
-		templ_7745c5c3_Var29, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var27).String())
+		templ_7745c5c3_Var28, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var26).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var29))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var28))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\" role=\"separator\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "\" role=\"separator\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -782,7 +771,7 @@ func Separator(props ...SeparatorProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, "></div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, "></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -806,57 +795,57 @@ func Shortcut(props ...ShortcutProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var30 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var29 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var30 == nil {
+		if templ_7745c5c3_Var29 == nil {
-			templ_7745c5c3_Var30 = templ.NopComponent
+			templ_7745c5c3_Var29 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p ShortcutProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		var templ_7745c5c3_Var31 = []any{utils.TwMerge("ml-auto text-xs tracking-widest opacity-60", p.Class)}
+		var templ_7745c5c3_Var30 = []any{utils.TwMerge("ml-auto text-xs tracking-widest opacity-60", p.Class)}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var31...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var30...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "<span")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "<span")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		if p.ID != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, " id=\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, " id=\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var32 string
+			var templ_7745c5c3_Var31 string
-			templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var31, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 282, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 284, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var31))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, " class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, " class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var33 string
+		var templ_7745c5c3_Var32 string
-		templ_7745c5c3_Var33, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var31).String())
+		templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var30).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var33))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -864,15 +853,15 @@ func Shortcut(props ...ShortcutProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, ">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 48, ">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templ_7745c5c3_Var30.Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = templ_7745c5c3_Var29.Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "</span>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 49, "</span>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -896,9 +885,9 @@ func Sub(props ...SubProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var34 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var33 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var34 == nil {
+		if templ_7745c5c3_Var33 == nil {
-			templ_7745c5c3_Var34 = templ.NopComponent
+			templ_7745c5c3_Var33 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 
@@ -911,48 +900,48 @@ func Sub(props ...SubProps) templ.Component {
 			subContentID = utils.RandomID()
 		}
 		ctx = context.WithValue(ctx, subContentIDKey, subContentID)
-		var templ_7745c5c3_Var35 = []any{utils.TwMerge("relative", p.Class)}
+		var templ_7745c5c3_Var34 = []any{utils.TwMerge("relative", p.Class)}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var35...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var34...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 48, "<div")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "<div")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		if p.ID != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 49, " id=\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, " id=\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var36 string
+			var templ_7745c5c3_Var35 string
-			templ_7745c5c3_Var36, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			templ_7745c5c3_Var35, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 305, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 307, Col: 12}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var36))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var35))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, " data-dropdown-submenu class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, " data-dropdown-submenu class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var37 string
+		var templ_7745c5c3_Var36 string
-		templ_7745c5c3_Var37, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var35).String())
+		templ_7745c5c3_Var36, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var34).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var37))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var36))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -960,15 +949,15 @@ func Sub(props ...SubProps) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, ">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, ">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templ_7745c5c3_Var34.Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = templ_7745c5c3_Var33.Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "</div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "</div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -992,9 +981,9 @@ func SubTrigger(props ...SubTriggerProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var38 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var37 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var38 == nil {
+		if templ_7745c5c3_Var37 == nil {
-			templ_7745c5c3_Var38 = templ.NopComponent
+			templ_7745c5c3_Var37 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 
@@ -1006,7 +995,7 @@ func SubTrigger(props ...SubTriggerProps) templ.Component {
 		if !ok {
 			subContentID = "fallback-subcontent-id"
 		}
-		templ_7745c5c3_Var39 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var38 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -1018,31 +1007,31 @@ func SubTrigger(props ...SubTriggerProps) templ.Component {
 				}()
 			}
 			ctx = templ.InitializeContext(ctx)
-			var templ_7745c5c3_Var40 = []any{
+			var templ_7745c5c3_Var39 = []any{
 				utils.TwMerge(
 					"w-full text-left flex items-center justify-between px-2 py-1.5 text-sm rounded-sm",
 					"focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground cursor-default",
 					p.Class,
 				),
 			}
-			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var40...)
+			templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var39...)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, "<button type=\"button\" data-dropdown-submenu-trigger class=\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, "<button type=\"button\" data-dropdown-submenu-trigger class=\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			var templ_7745c5c3_Var41 string
+			var templ_7745c5c3_Var40 string
-			templ_7745c5c3_Var41, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var40).String())
+			templ_7745c5c3_Var40, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var39).String())
 			if templ_7745c5c3_Err != nil {
 				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 1, Col: 0}
 			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var41))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var40))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "\"")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -1050,15 +1039,15 @@ func SubTrigger(props ...SubTriggerProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, "><span>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, "><span>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templ_7745c5c3_Var38.Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = templ_7745c5c3_Var37.Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "</span> <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4 ml-auto\"><path d=\"M6.5 3L11.5 8L6.5 13\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path></svg></button>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "</span> <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"h-4 w-4 ml-auto\"><path d=\"M6.5 3L11.5 8L6.5 13\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path></svg></button>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -1068,7 +1057,7 @@ func SubTrigger(props ...SubTriggerProps) templ.Component {
 			ID:          p.ID,
 			For:         subContentID,
 			TriggerType: popover.TriggerTypeHover,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var39), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var38), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -1092,9 +1081,9 @@ func SubContent(props ...SubContentProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var42 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var41 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var42 == nil {
+		if templ_7745c5c3_Var41 == nil {
-			templ_7745c5c3_Var42 = templ.NopComponent
+			templ_7745c5c3_Var41 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 
@@ -1106,7 +1095,7 @@ func SubContent(props ...SubContentProps) templ.Component {
 		if !ok {
 			subContentID = "fallback-subcontent-id"
 		}
-		templ_7745c5c3_Var43 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var42 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -1118,7 +1107,7 @@ func SubContent(props ...SubContentProps) templ.Component {
 				}()
 			}
 			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templ_7745c5c3_Var42.Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = templ_7745c5c3_Var41.Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -1135,7 +1124,7 @@ func SubContent(props ...SubContentProps) templ.Component {
 				p.Class,
 			),
 			Attributes: p.Attributes,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var43), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var42), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -1143,8 +1132,6 @@ func SubContent(props ...SubContentProps) templ.Component {
 	})
 }
 
-var dropdownHandle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -1161,25 +1148,12 @@ func Script() templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var44 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var43 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var44 == nil {
+		if templ_7745c5c3_Var43 == nil {
-			templ_7745c5c3_Var44 = templ.NopComponent
+			templ_7745c5c3_Var43 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, "<script nonce=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 61, "<script defer src=\"/assets/js/dropdown.min.js\"></script>")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		var templ_7745c5c3_Var45 string
-		templ_7745c5c3_Var45, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/dropdown/dropdown.templ`, Line: 383, Col: 36}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var45))
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "\">\n\t\t(function() { // IIFE\n\t\t\tfunction handleDropdownItemClick(event) {\n\t\t\t\tconst item = event.currentTarget;\n\t\t\t\tconst popoverContent = item.closest('[data-popover-id]');\n\t\t\t\tif (popoverContent) {\n\t\t\t\t\tconst popoverId = popoverContent.dataset.popoverId;\n\t\t\t\t\tif (window.closePopover) {\n\t\t\t\t\t\twindow.closePopover(popoverId, true);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconsole.warn(\"popover.Script's closePopover function not found.\");\n\t\t\t\t\t\tdocument.body.click(); // Fallback\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t// Select items with 'data-dropdown-item' but not 'data-dropdown-submenu-trigger'\n\t\t\t\tconst items = root.querySelectorAll('[data-dropdown-item]:not([data-dropdown-submenu-trigger])');\n\t\t\t\titems.forEach(item => {\n\t\t\t\t\titem.removeEventListener('click', handleDropdownItemClick);\n\t\t\t\t\titem.addEventListener('click', handleDropdownItemClick);\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tinitAllComponents();\n\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t})(); // End of IIFE\n\t</script>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/form/form.templ

@@ -1,4 +1,4 @@
-// templui component form - version: main installed by templui v0.71.0
+// templui component form - version: v0.84.0 installed by templui v0.84.0
 package form
 
 import (

server/web/templui/components/form/form_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component form - version: main installed by templui v0.71.0
+// templui component form - version: v0.84.0 installed by templui v0.84.0
 
 package form
 

server/web/templui/components/icon/icon.go

@@ -1,4 +1,4 @@
-// templui component icon - version: main installed by templui v0.71.0
+// templui component icon - version: v0.84.0 installed by templui v0.84.0
 package icon
 
 import (

server/web/templui/components/icon/icondata.go

@@ -1,4 +1,4 @@
-// templui component icon - version: main installed by templui v0.71.0
+// templui component icon - version: v0.84.0 installed by templui v0.84.0
 package icon
 
 // This file is auto generated
@@ -498,7 +498,7 @@ var internalSvgData = map[string]string{
   <path d="M8 12a2 2 0 0 0 2-2V8H8" />
   <path d="M14 12a2 2 0 0 0 2-2V8h-2" />`,
 	"navigation": `<polygon points="3 11 22 2 13 21 11 13 3 11" />`,
-	"minus":      `<path d="M5 12h14" />`,
+	"minus": `<path d="M5 12h14" />`,
 	"list-check": `<path d="M11 18H3" />
   <path d="m15 18 2 2 4-4" />
   <path d="M16 12H3" />
@@ -2471,7 +2471,7 @@ var internalSvgData = map[string]string{
 	"toy-brick": `<rect width="18" height="12" x="3" y="8" rx="1" />
   <path d="M10 8V5c0-.6-.4-1-1-1H6a1 1 0 0 0-1 1v3" />
   <path d="M19 8V5c0-.6-.4-1-1-1h-3a1 1 0 0 0-1 1v3" />`,
-	"wrench":               `<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />`,
+	"wrench": `<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />`,
 	"rectangle-horizontal": `<rect width="20" height="12" x="2" y="6" rx="2" />`,
 	"map-pin-check-inside": `<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0" />
   <path d="m9 10 2 2 4-4" />`,
@@ -4515,7 +4515,7 @@ var internalSvgData = map[string]string{
 	"ticket-plus": `<path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z" />
   <path d="M9 12h6" />
   <path d="M12 9v6" />`,
-	"wifi-zero":    `<path d="M12 20h.01" />`,
+	"wifi-zero": `<path d="M12 20h.01" />`,
 	"type-outline": `<path d="M14 16.5a.5.5 0 0 0 .5.5h.5a2 2 0 0 1 0 4H9a2 2 0 0 1 0-4h.5a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5V8a2 2 0 0 1-4 0V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v3a2 2 0 0 1-4 0v-.5a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5Z" />`,
 	"circle-pause": `<circle cx="12" cy="12" r="10" />
   <line x1="10" x2="10" y1="15" y2="9" />
@@ -4657,7 +4657,7 @@ var internalSvgData = map[string]string{
   <path d="M4 18v3" />
   <path d="M8 14v7" />`,
 	"chevron-down": `<path d="m6 9 6 6 6-6" />`,
-	"chevron-up":   `<path d="m18 15-6-6-6 6" />`,
+	"chevron-up": `<path d="m18 15-6-6-6 6" />`,
 	"dice-5": `<rect width="18" height="18" x="3" y="3" rx="2" ry="2" />
   <path d="M16 8h.01" />
   <path d="M8 8h.01" />

server/web/templui/components/icon/icondefs.go

@@ -1,6 +1,5 @@
-// templui component icon - version: main installed by templui v0.71.0
+// templui component icon - version: v0.84.0 installed by templui v0.84.0
 package icon
-
 // This file is auto generated
 // Using Lucide icons version 0.507.0
 var ALargeSmall = Icon("a-large-small")

server/web/templui/components/input/input.templ

@@ -1,4 +1,4 @@
-// templui component input - version: main installed by templui v0.71.0
+// templui component input - version: v0.84.0 installed by templui v0.84.0
 package input
 
 import (
@@ -49,9 +49,6 @@ templ Input(props ...Props) {
 	if p.ID == "" {
 		{{ p.ID = utils.RandomID() }}
 	}
-	if p.Type == TypePassword && !p.NoTogglePassword {
-		@Script()
-	}
 	<div class="relative w-full">
 		<input
 			id={ p.ID }
@@ -71,15 +68,28 @@ templ Input(props ...Props) {
 			disabled?={ p.Disabled }
 			readonly?={ p.Readonly }
 			required?={ p.Required }
+			if p.HasError {
+				aria-invalid="true"
+			}
 			class={
 				utils.TwMerge(
-					"peer flex h-10 w-full px-3 py-2",
+					// Base styles
-					"rounded-md border border-input bg-background text-sm ring-offset-background",
+					"flex h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
-					"file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
+					// Dark mode background
+					"dark:bg-input/30",
+					// Selection styles
+					"selection:bg-primary selection:text-primary-foreground",
+					// Placeholder
 					"placeholder:text-muted-foreground",
-					"focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+					// File input styles
-					"disabled:cursor-not-allowed disabled:opacity-50",
+					"file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
-					utils.If(p.HasError, "border-destructive ring-destructive"),
+					// Focus styles
+					"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					// Disabled styles
+					"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+					// Error/Invalid styles
+					"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+					utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
 					utils.If(p.Type == TypePassword && !p.NoTogglePassword, "pr-8"),
 					p.Class,
 				),
@@ -108,58 +118,6 @@ templ Input(props ...Props) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/input.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-		(function() { // IIFE Start
-            function initPasswordToggle(button) {
-                if (button.hasAttribute('data-password-initialized')) {
-                    return;
-                }
-                
-                button.setAttribute('data-password-initialized', 'true');
-                
-                button.addEventListener('click', function(event) {
-                    const inputId = button.getAttribute('data-toggle-password');
-                    const input = document.getElementById(inputId);
-                    if (input) {
-                        const iconOpen = button.querySelector('.icon-open');
-                        const iconClosed = button.querySelector('.icon-closed');
-
-                        if (input.type === 'password') {
-                            input.type = 'text';
-                            iconOpen.classList.add('hidden');
-                            iconClosed.classList.remove('hidden');
-                        } else {
-                            input.type = 'password';
-                            iconOpen.classList.remove('hidden');
-                            iconClosed.classList.add('hidden');
-                        }
-                    }
-                });
-            }
-
-            function initAllComponents(root = document) {
-                const buttons = root.querySelectorAll('[data-toggle-password]:not([data-password-initialized])');
-                buttons.forEach(button => {
-                    initPasswordToggle(button);
-                });
-            }
-
-            const handleHtmxSwap = (event) => {
-                const target = event.detail.target || event.detail.elt;
-                if (target instanceof Element) {
-                    requestAnimationFrame(() => initAllComponents(target));
-                }
-            };
-
-			initAllComponents();
-            document.addEventListener('DOMContentLoaded', () => initAllComponents());
-            document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-            document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-         })(); // IIFE End
-        </script>
-	}
 }

server/web/templui/components/input/input_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component input - version: main installed by templui v0.71.0
+// templui component input - version: v0.84.0 installed by templui v0.84.0
 
 package input
 
@@ -78,25 +78,29 @@ func Input(props ...Props) templ.Component {
 		if p.ID == "" {
 			p.ID = utils.RandomID()
 		}
-		if p.Type == TypePassword && !p.NoTogglePassword {
-			templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
 		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div class=\"relative w-full\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		var templ_7745c5c3_Var2 = []any{
 			utils.TwMerge(
-				"peer flex h-10 w-full px-3 py-2",
+				// Base styles
-				"rounded-md border border-input bg-background text-sm ring-offset-background",
+				"flex h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
-				"file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Placeholder
 				"placeholder:text-muted-foreground",
-				"focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+				// File input styles
-				"disabled:cursor-not-allowed disabled:opacity-50",
+				"file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
-				utils.If(p.HasError, "border-destructive ring-destructive"),
+				// Focus styles
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Disabled styles
+				"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
 				utils.If(p.Type == TypePassword && !p.NoTogglePassword, "pr-8"),
 				p.Class,
 			),
@@ -112,7 +116,7 @@ func Input(props ...Props) templ.Component {
 		var templ_7745c5c3_Var3 string
 		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 57, Col: 12}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 54, Col: 12}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 		if templ_7745c5c3_Err != nil {
@@ -125,7 +129,7 @@ func Input(props ...Props) templ.Component {
 		var templ_7745c5c3_Var4 string
 		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(string(p.Type))
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 58, Col: 24}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 55, Col: 24}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
 		if templ_7745c5c3_Err != nil {
@@ -143,7 +147,7 @@ func Input(props ...Props) templ.Component {
 			var templ_7745c5c3_Var5 string
 			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 60, Col: 17}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 57, Col: 17}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
 			if templ_7745c5c3_Err != nil {
@@ -162,7 +166,7 @@ func Input(props ...Props) templ.Component {
 			var templ_7745c5c3_Var6 string
 			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.Placeholder)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 63, Col: 31}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 60, Col: 31}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
 			if templ_7745c5c3_Err != nil {
@@ -181,7 +185,7 @@ func Input(props ...Props) templ.Component {
 			var templ_7745c5c3_Var7 string
 			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 66, Col: 19}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 63, Col: 19}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
 			if templ_7745c5c3_Err != nil {
@@ -200,7 +204,7 @@ func Input(props ...Props) templ.Component {
 			var templ_7745c5c3_Var8 string
 			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.FileAccept)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 69, Col: 25}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 66, Col: 25}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 			if templ_7745c5c3_Err != nil {
@@ -229,7 +233,13 @@ func Input(props ...Props) templ.Component {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " class=\"")
+		if p.HasError {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " aria-invalid=\"true\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -242,7 +252,7 @@ func Input(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -250,7 +260,7 @@ func Input(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "> ")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "> ")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -267,7 +277,7 @@ func Input(props ...Props) templ.Component {
 					}()
 				}
 				ctx = templ.InitializeContext(ctx)
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "<span class=\"icon-open block\">")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<span class=\"icon-open block\">")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -277,7 +287,7 @@ func Input(props ...Props) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "</span> <span class=\"icon-closed hidden\">")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</span> <span class=\"icon-closed hidden\">")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -287,7 +297,7 @@ func Input(props ...Props) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</span>")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</span>")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -303,7 +313,7 @@ func Input(props ...Props) templ.Component {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "</div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -311,8 +321,6 @@ func Input(props ...Props) templ.Component {
 	})
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -334,38 +342,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var11 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "<script defer src=\"/assets/js/input.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "<script nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var13 string
-			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/input/input.templ`, Line: 115, Col: 37}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\">\n\t\t(function() { // IIFE Start\n            function initPasswordToggle(button) {\n                if (button.hasAttribute('data-password-initialized')) {\n                    return;\n                }\n                \n                button.setAttribute('data-password-initialized', 'true');\n                \n                button.addEventListener('click', function(event) {\n                    const inputId = button.getAttribute('data-toggle-password');\n                    const input = document.getElementById(inputId);\n                    if (input) {\n                        const iconOpen = button.querySelector('.icon-open');\n                        const iconClosed = button.querySelector('.icon-closed');\n\n                        if (input.type === 'password') {\n                            input.type = 'text';\n                            iconOpen.classList.add('hidden');\n                            iconClosed.classList.remove('hidden');\n                        } else {\n                            input.type = 'password';\n                            iconOpen.classList.remove('hidden');\n                            iconClosed.classList.add('hidden');\n                        }\n                    }\n                });\n            }\n\n            function initAllComponents(root = document) {\n                const buttons = root.querySelectorAll('[data-toggle-password]:not([data-password-initialized])');\n                buttons.forEach(button => {\n                    initPasswordToggle(button);\n                });\n            }\n\n            const handleHtmxSwap = (event) => {\n                const target = event.detail.target || event.detail.elt;\n                if (target instanceof Element) {\n                    requestAnimationFrame(() => initAllComponents(target));\n                }\n            };\n\n\t\t\tinitAllComponents();\n            document.addEventListener('DOMContentLoaded', () => initAllComponents());\n            document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n            document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n         })(); // IIFE End\n        </script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/inputotp/inputotp.templ

@@ -0,0 +1,178 @@
+// templui component inputotp - version: v0.84.0 installed by templui v0.84.0
+package inputotp
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"strconv"
+)
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Value      string
+	Required   bool
+	Name       string
+	HasError   bool
+}
+
+type GroupProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type SlotProps struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Index       int
+	Type        string
+	Placeholder string
+	Disabled    bool
+	HasError    bool
+}
+
+type SeparatorProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+templ InputOTP(props ...Props) {
+	{{ var p Props }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID + "-container" }
+		}
+		if p.Value != "" {
+			data-value={ p.Value }
+		}
+		class={
+			utils.TwMerge(
+				"flex flex-row items-center gap-2 w-fit",
+				p.Class,
+			),
+		}
+		data-input-otp
+		{ p.Attributes... }
+	>
+		<input
+			type="hidden"
+			if p.ID != "" {
+				id={ p.ID }
+			}
+			if p.Name != "" {
+				name={ p.Name }
+			}
+			if p.HasError {
+				aria-invalid="true"
+			}
+			data-input-otp-value-target
+			required?={ p.Required }
+		/>
+		{ children... }
+	</div>
+}
+
+templ Group(props ...GroupProps) {
+	{{ var p GroupProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"flex gap-2",
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}
+
+templ Slot(props ...SlotProps) {
+	{{ var p SlotProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	if p.Type == "" {
+		{{ p.Type = "text" }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class="relative"
+		{ p.Attributes... }
+	>
+		<input
+			type={ p.Type }
+			inputmode="numeric"
+			if p.Placeholder != "" {
+				placeholder={ p.Placeholder }
+			}
+			maxlength="1"
+			class={
+				utils.TwMerge(
+					// Base styles - keeping the specific OTP dimensions
+					"w-10 h-12 text-center rounded-md border border-input bg-transparent text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
+					// Dark mode background
+					"dark:bg-input/30",
+					// Selection styles
+					"selection:bg-primary selection:text-primary-foreground",
+					// Placeholder
+					"placeholder:text-muted-foreground",
+					// Focus styles
+					"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					// Disabled styles
+					"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+					// Error/Invalid styles
+					"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+					utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+					p.Class,
+				),
+			}
+			disabled?={ p.Disabled }
+			if p.HasError {
+				aria-invalid="true"
+			}
+			data-input-index={ strconv.Itoa(p.Index) }
+			data-input-otp-slot
+			{ p.Attributes... }
+		/>
+	</div>
+}
+
+templ Separator(props ...SeparatorProps) {
+	{{ var p SeparatorProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"flex items-center text-muted-foreground text-xl",
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		<span>-</span>
+	</div>
+}
+
+templ Script() {
+	<script defer src="/assets/js/inputotp.min.js"></script>
+}

server/web/templui/components/inputotp/inputotp_templ.go

@@ -0,0 +1,615 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component inputotp - version: v0.84.0 installed by templui v0.84.0
+
+package inputotp
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"strconv"
+)
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Value      string
+	Required   bool
+	Name       string
+	HasError   bool
+}
+
+type GroupProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type SlotProps struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Index       int
+	Type        string
+	Placeholder string
+	Disabled    bool
+	HasError    bool
+}
+
+type SeparatorProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+func InputOTP(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var2 = []any{
+			utils.TwMerge(
+				"flex flex-row items-center gap-2 w-fit",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID + "-container")
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 49, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " data-value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 52, Col: 23}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var5 string
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\" data-input-otp")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "><input type=\"hidden\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 66, Col: 13}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 69, Col: 17}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.HasError {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " aria-invalid=\"true\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " data-input-otp-value-target")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Group(props ...GroupProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var8 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var8 == nil {
+			templ_7745c5c3_Var8 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p GroupProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var9 = []any{
+			utils.TwMerge(
+				"flex gap-2",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var9...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 88, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var11 string
+		templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var9).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var8.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Slot(props ...SlotProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var12 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var12 == nil {
+			templ_7745c5c3_Var12 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p SlotProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		if p.Type == "" {
+			p.Type = "text"
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 112, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " class=\"relative\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var14 = []any{
+			utils.TwMerge(
+				// Base styles - keeping the specific OTP dimensions
+				"w-10 h-12 text-center rounded-md border border-input bg-transparent text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Placeholder
+				"placeholder:text-muted-foreground",
+				// Focus styles
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Disabled styles
+				"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var14...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "<input type=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var15 string
+		templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(p.Type)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 118, Col: 16}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\" inputmode=\"numeric\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Placeholder != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " placeholder=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var16 string
+			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(p.Placeholder)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 121, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " maxlength=\"1\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var17 string
+		templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var14).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.HasError {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, " aria-invalid=\"true\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " data-input-index=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var18 string
+		templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(strconv.Itoa(p.Index))
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 148, Col: 43}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\" data-input-otp-slot")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, "></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Separator(props ...SeparatorProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var19 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var19 == nil {
+			templ_7745c5c3_Var19 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p SeparatorProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var20 = []any{
+			utils.TwMerge(
+				"flex items-center text-muted-foreground text-xl",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var20...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var21 string
+			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 162, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var22 string
+		templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var20).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/inputotp/inputotp.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, "><span>-</span></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Script() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var23 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var23 == nil {
+			templ_7745c5c3_Var23 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "<script defer src=\"/assets/js/inputotp.min.js\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/label/label.templ

@@ -1,4 +1,4 @@
-// templui component label - version: main installed by templui v0.71.0
+// templui component label - version: v0.84.0 installed by templui v0.84.0
 package label
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
@@ -37,75 +37,6 @@ templ Label(props ...Props) {
 	</label>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/label.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-
-			(function() { // IIFE
-				function initLabel(label) {
-					if (!label.hasAttribute('for') || !label.hasAttribute('data-disabled-style')) {
-						return;
-					}
-					
-					const forId = label.getAttribute('for');
-					const targetElement = forId ? document.getElementById(forId) : null;
-					const disabledStyle = label.getAttribute('data-disabled-style');
-					
-					if (!disabledStyle) return;
-					
-					const classes = disabledStyle.split(' ').filter(Boolean);
-					
-					function updateStyle() {
-						if (targetElement && targetElement.disabled) {
-							label.classList.add(...classes);
-						} else {
-							label.classList.remove(...classes);
-						}
-					}
-					
-					// Set up mutation observer to detect disabled state changes
-					if (targetElement) {
-						const observer = new MutationObserver(mutations => {
-							for (const mutation of mutations) {
-								if (mutation.type === 'attributes' && mutation.attributeName === 'disabled') {
-									updateStyle();
-								}
-							}
-						});
-						
-						observer.observe(targetElement, { 
-							attributes: true, 
-							attributeFilter: ['disabled'] 
-						});
-					}
-					
-					// Initial style update
-					updateStyle();
-				}
-				
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('label[for][data-disabled-style]')) {
-						initLabel(root);
-					}
-					for (const label of root.querySelectorAll('label[for][data-disabled-style]')) {
-						initLabel(label);
-					}	
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-				
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/label/label_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component label - version: main installed by templui v0.71.0
+// templui component label - version: v0.84.0 installed by templui v0.84.0
 
 package label
 
@@ -135,8 +135,6 @@ func Label(props ...Props) templ.Component {
 	})
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -158,38 +156,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var6 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "<script defer src=\"/assets/js/label.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "<script nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var8 string
-			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/label/label.templ`, Line: 44, Col: 37}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\">\n\n\t\t\t(function() { // IIFE\n\t\t\t\tfunction initLabel(label) {\n\t\t\t\t\tif (!label.hasAttribute('for') || !label.hasAttribute('data-disabled-style')) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tconst forId = label.getAttribute('for');\n\t\t\t\t\tconst targetElement = forId ? document.getElementById(forId) : null;\n\t\t\t\t\tconst disabledStyle = label.getAttribute('data-disabled-style');\n\t\t\t\t\t\n\t\t\t\t\tif (!disabledStyle) return;\n\t\t\t\t\t\n\t\t\t\t\tconst classes = disabledStyle.split(' ').filter(Boolean);\n\t\t\t\t\t\n\t\t\t\t\tfunction updateStyle() {\n\t\t\t\t\t\tif (targetElement && targetElement.disabled) {\n\t\t\t\t\t\t\tlabel.classList.add(...classes);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tlabel.classList.remove(...classes);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t// Set up mutation observer to detect disabled state changes\n\t\t\t\t\tif (targetElement) {\n\t\t\t\t\t\tconst observer = new MutationObserver(mutations => {\n\t\t\t\t\t\t\tfor (const mutation of mutations) {\n\t\t\t\t\t\t\t\tif (mutation.type === 'attributes' && mutation.attributeName === 'disabled') {\n\t\t\t\t\t\t\t\t\tupdateStyle();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t});\n\t\t\t\t\t\t\n\t\t\t\t\t\tobserver.observe(targetElement, { \n\t\t\t\t\t\t\tattributes: true, \n\t\t\t\t\t\t\tattributeFilter: ['disabled'] \n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t// Initial style update\n\t\t\t\t\tupdateStyle();\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('label[for][data-disabled-style]')) {\n\t\t\t\t\t\tinitLabel(root);\n\t\t\t\t\t}\n\t\t\t\t\tfor (const label of root.querySelectorAll('label[for][data-disabled-style]')) {\n\t\t\t\t\t\tinitLabel(label);\n\t\t\t\t\t}\t\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\t\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // End of IIFE\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/modal/modal.templ

@@ -1,10 +1,7 @@
-// templui component modal - version: main installed by templui v0.71.0
+// templui component modal - version: v0.84.0 installed by templui v0.84.0
 package modal
 
-import (
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
-	"strconv"
-)
 
 type Props struct {
 	ID               string
@@ -12,6 +9,7 @@ type Props struct {
 	Attributes       templ.Attributes
 	DisableClickAway bool
 	DisableESC       bool
+	InitialOpen      bool
 }
 
 type TriggerProps struct {
@@ -19,14 +17,14 @@ type TriggerProps struct {
 	Class      string
 	Attributes templ.Attributes
 	Disabled   bool
-	ModalID    string // ID of the modal to trigger
+	For        string // ID of the modal to trigger
 }
 
 type CloseProps struct {
 	ID         string
 	Class      string
 	Attributes templ.Attributes
-	ModalID    string // ID of the modal to close (optional, defaults to closest modal)
+	For        string // ID of the modal to close (optional, defaults to closest modal)
 }
 
 type HeaderProps struct {
@@ -48,7 +46,6 @@ type FooterProps struct {
 }
 
 templ Modal(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -59,12 +56,20 @@ templ Modal(props ...Props) {
 	<div
 		id={ p.ID }
 		data-modal
-		data-disable-click-away={ strconv.FormatBool(p.DisableClickAway) }
+		data-open="false"
-		data-disable-esc={ strconv.FormatBool(p.DisableESC) }
+		class="modal-container fixed inset-0 z-50 items-center justify-center overflow-y-auto opacity-0 transition-opacity duration-300 ease-out hidden"
-		class="modal-container fixed inset-0 z-50 flex items-center justify-center overflow-y-auto opacity-0 transition-opacity duration-300 ease-out hidden"
 		aria-labelledby={ p.ID + "-title" }
 		role="dialog"
 		aria-modal="true"
+		if p.DisableClickAway {
+			data-disable-click-away="true"
+		}
+		if p.DisableESC {
+			data-disable-esc="true"
+		}
+		if p.InitialOpen {
+			data-initial-open="true"
+		}
 		{ p.Attributes... }
 	>
 		<div data-modal-backdrop class="fixed inset-0 bg-background/70 bg-opacity-50" aria-hidden="true"></div>
@@ -93,12 +98,13 @@ templ Trigger(props ...TriggerProps) {
 		if p.ID != "" {
 			id={ p.ID }
 		}
-		data-modal-trigger
+		if p.For != "" {
-		if p.ModalID != "" {
+			data-modal-trigger={ p.For }
-			data-modal-target-id={ p.ModalID }
 		}
+		data-open="false"
 		class={
 			utils.TwMerge(
+				"group",
 				utils.IfElse(p.Disabled, "cursor-not-allowed opacity-50", "cursor-pointer"),
 				p.Class,
 			),
@@ -118,9 +124,10 @@ templ Close(props ...CloseProps) {
 		if p.ID != "" {
 			id={ p.ID }
 		}
-		data-modal-close
+		if p.For != "" {
-		if p.ModalID != "" {
+			data-modal-close={ p.For }
-			data-modal-target-id={ p.ModalID }
+		} else {
+			data-modal-close
 		}
 		class={ utils.TwMerge("cursor-pointer", p.Class) }
 		{ p.Attributes... }
@@ -180,183 +187,6 @@ templ Footer(props ...FooterProps) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/modal.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-			if (typeof window.modalState === 'undefined') {
-				window.modalState = {
-					openModalId: null
-				};
-			}
-			
-			(function() { // IIFE
-				function closeModal(modal, immediate = false) {
-					if (!modal || modal.style.display === 'none') return;
-					
-					const content = modal.querySelector('[data-modal-content]');
-					const modalId = modal.id;
-					
-					// Apply leaving transitions
-					modal.classList.remove('opacity-100');
-					modal.classList.add('opacity-0');
-					
-					if (content) {
-						content.classList.remove('scale-100', 'opacity-100');
-						content.classList.add('scale-95', 'opacity-0');
-					}
-					
-					function hideModal() {
-						modal.style.display = 'none';
-						
-						if (window.modalState.openModalId === modalId) {
-							window.modalState.openModalId = null;
-							document.body.style.overflow = '';
-						}
-					}
-					
-					if (immediate) {
-						hideModal();
-					} else {
-						setTimeout(hideModal, 300);
-					}
-				}
-				
-				function openModal(modal) {
-					if (!modal) return;
-					
-					// Close any open modal first
-					if (window.modalState.openModalId) {
-						const openModal = document.getElementById(window.modalState.openModalId);
-						if (openModal && openModal !== modal) {
-							closeModal(openModal, true);
-						}
-					}
-					
-					const content = modal.querySelector('[data-modal-content]');
-					
-					// Display and prepare for animation
-					modal.style.display = 'flex';
-					
-					// Store as currently open modal
-					window.modalState.openModalId = modal.id;
-					document.body.style.overflow = 'hidden';
-					
-					// Force reflow before adding transition classes
-					void modal.offsetHeight;
-					
-					// Start animations
-					modal.classList.remove('opacity-0');
-					modal.classList.add('opacity-100');
-					
-					if (content) {
-						content.classList.remove('scale-95', 'opacity-0');
-						content.classList.add('scale-100', 'opacity-100');
-						
-						// Focus first focusable element
-						setTimeout(() => {
-							const focusable = content.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-							if (focusable) focusable.focus();
-						}, 50);
-					}
-				}
-				
-				function closeModalById(modalId, immediate = false) {
-					const modal = document.getElementById(modalId);
-					if (modal) closeModal(modal, immediate);
-				}
-				
-				function openModalById(modalId) {
-					const modal = document.getElementById(modalId);
-					if (modal) openModal(modal);
-				}
-				
-				function handleClickAway(e) {
-					const openModalId = window.modalState.openModalId;
-					if (!openModalId) return;
-					
-					const modal = document.getElementById(openModalId);
-					if (!modal || modal.getAttribute('data-disable-click-away') === 'true') return;
-					
-					const content = modal.querySelector('[data-modal-content]');
-					const trigger = e.target.closest('[data-modal-trigger]');
-					
-					if (content && !content.contains(e.target) && 
-						(!trigger || trigger.getAttribute('data-modal-target-id') !== openModalId)) {
-						closeModal(modal);
-					}
-				}
-				
-				function handleEscKey(e) {
-					if (e.key !== 'Escape' || !window.modalState.openModalId) return;
-					
-					const modal = document.getElementById(window.modalState.openModalId);
-					if (modal && modal.getAttribute('data-disable-esc') !== 'true') {
-						closeModal(modal);
-					}
-				}
-				
-				function initTrigger(trigger) {
-					const targetId = trigger.getAttribute('data-modal-target-id');
-					if (!targetId) return;
-					
-					trigger.addEventListener('click', () => {
-						if (!trigger.hasAttribute('disabled') && 
-							!trigger.classList.contains('opacity-50')) {
-							openModalById(targetId);
-						}
-					});
-				}
-				
-				function initCloseButton(closeBtn) {
-					closeBtn.addEventListener('click', () => {
-						const targetId = closeBtn.getAttribute('data-modal-target-id');
-						if (targetId) {
-							closeModalById(targetId);
-						} else {
-							const modal = closeBtn.closest('[data-modal]');
-							if (modal && modal.id) {
-								closeModal(modal);
-							}
-						}
-					});
-				}
-				
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-modal-trigger]')) {
-						initTrigger(root);
-					}
-					for (const trigger of root.querySelectorAll('[data-modal-trigger]')) {
-						initTrigger(trigger);
-					}
-
-					if (root instanceof Element && root.matches('[data-modal-close]')) {
-						initCloseButton(root);
-					}
-					for (const closeBtn of root.querySelectorAll('[data-modal-close]')) {
-						initCloseButton(closeBtn);
-					}	
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				if (typeof window.modalEventsInitialized === 'undefined') {
-					document.addEventListener('click', handleClickAway);
-					document.addEventListener('keydown', handleEscKey);
-					window.modalEventsInitialized = true;
-				}
-				
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/pagination/pagination.templ

@@ -1,4 +1,4 @@
-// templui component pagination - version: main installed by templui v0.71.0
+// templui component pagination - version: v0.84.0 installed by templui v0.84.0
 package pagination
 
 import (
@@ -32,9 +32,6 @@ type LinkProps struct {
 	Href       string
 	IsActive   bool
 	Disabled   bool
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 type PreviousProps struct {
@@ -44,9 +41,6 @@ type PreviousProps struct {
 	Href       string
 	Disabled   bool
 	Label      string
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 type NextProps struct {
@@ -56,9 +50,6 @@ type NextProps struct {
 	Href       string
 	Disabled   bool
 	Label      string
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 templ Pagination(props ...Props) {
@@ -126,19 +117,6 @@ templ Link(props ...LinkProps) {
 		}) {
 			{ children... }
 		}
-	} else if p.HxGet != "" {
-		@button.Button(button.Props{
-			ID:         p.ID,
-			HxGet:      p.HxGet,
-			HxTarget:   p.HxTarget,
-			HxSwap:     p.HxSwap,
-			Size:       button.SizeIcon,
-			Variant:    button.Variant(buttonVariant(p.IsActive)),
-			Class:      p.Class,
-			Attributes: p.Attributes,
-		}) {
-			{ children... }
-		}
 	} else {
 		@button.Button(button.Props{
 			ID:         p.ID,
@@ -161,9 +139,6 @@ templ Previous(props ...PreviousProps) {
 	@button.Button(button.Props{
 		ID:         p.ID,
 		Href:       p.Href,
-		HxGet:      p.HxGet,
-		HxTarget:   p.HxTarget,
-		HxSwap:     p.HxSwap,
 		Disabled:   p.Disabled,
 		Variant:    button.VariantGhost,
 		Class:      utils.TwMerge("gap-1", p.Class),
@@ -184,9 +159,6 @@ templ Next(props ...NextProps) {
 	@button.Button(button.Props{
 		ID:         p.ID,
 		Href:       p.Href,
-		HxGet:      p.HxGet,
-		HxTarget:   p.HxTarget,
-		HxSwap:     p.HxSwap,
 		Disabled:   p.Disabled,
 		Variant:    button.VariantGhost,
 		Class:      utils.TwMerge("gap-1", p.Class),

server/web/templui/components/pagination/pagination_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component pagination - version: main installed by templui v0.71.0
+// templui component pagination - version: v0.84.0 installed by templui v0.84.0
 
 package pagination
 
@@ -41,9 +41,6 @@ type LinkProps struct {
 	Href       string
 	IsActive   bool
 	Disabled   bool
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 type PreviousProps struct {
@@ -53,9 +50,6 @@ type PreviousProps struct {
 	Href       string
 	Disabled   bool
 	Label      string
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 type NextProps struct {
@@ -65,9 +59,6 @@ type NextProps struct {
 	Href       string
 	Disabled   bool
 	Label      string
-	HxGet      string
-	HxTarget   string
-	HxSwap     string
 }
 
 func Pagination(props ...Props) templ.Component {
@@ -112,7 +103,7 @@ func Pagination(props ...Props) templ.Component {
 			var templ_7745c5c3_Var3 string
 			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 71, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 62, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
@@ -197,7 +188,7 @@ func Content(props ...ContentProps) templ.Component {
 			var templ_7745c5c3_Var6 string
 			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 89, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 80, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
 			if templ_7745c5c3_Err != nil {
@@ -269,7 +260,7 @@ func Item(props ...ItemProps) templ.Component {
 			var templ_7745c5c3_Var8 string
 			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 105, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 96, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 			if templ_7745c5c3_Err != nil {
@@ -355,40 +346,8 @@ func Link(props ...LinkProps) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-		} else if p.HxGet != "" {
-			templ_7745c5c3_Var11 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
-				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-				if !templ_7745c5c3_IsBuffer {
-					defer func() {
-						templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-						if templ_7745c5c3_Err == nil {
-							templ_7745c5c3_Err = templ_7745c5c3_BufErr
-						}
-					}()
-				}
-				ctx = templ.InitializeContext(ctx)
-				templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
-				if templ_7745c5c3_Err != nil {
-					return templ_7745c5c3_Err
-				}
-				return nil
-			})
-			templ_7745c5c3_Err = button.Button(button.Props{
-				ID:         p.ID,
-				HxGet:      p.HxGet,
-				HxTarget:   p.HxTarget,
-				HxSwap:     p.HxSwap,
-				Size:       button.SizeIcon,
-				Variant:    button.Variant(buttonVariant(p.IsActive)),
-				Class:      p.Class,
-				Attributes: p.Attributes,
-			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
 		} else {
-			templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_Var11 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 				if !templ_7745c5c3_IsBuffer {
@@ -413,7 +372,7 @@ func Link(props ...LinkProps) templ.Component {
 				Variant:    button.Variant(buttonVariant(p.IsActive)),
 				Class:      p.Class,
 				Attributes: p.Attributes,
-			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -438,16 +397,16 @@ func Previous(props ...PreviousProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var13 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var12 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var13 == nil {
+		if templ_7745c5c3_Var12 == nil {
-			templ_7745c5c3_Var13 = templ.NopComponent
+			templ_7745c5c3_Var12 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p PreviousProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		templ_7745c5c3_Var14 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var13 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -472,12 +431,12 @@ func Previous(props ...PreviousProps) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var15 string
+				var templ_7745c5c3_Var14 string
-				templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
+				templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 174, Col: 18}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 149, Col: 18}
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -491,14 +450,11 @@ func Previous(props ...PreviousProps) templ.Component {
 		templ_7745c5c3_Err = button.Button(button.Props{
 			ID:         p.ID,
 			Href:       p.Href,
-			HxGet:      p.HxGet,
-			HxTarget:   p.HxTarget,
-			HxSwap:     p.HxSwap,
 			Disabled:   p.Disabled,
 			Variant:    button.VariantGhost,
 			Class:      utils.TwMerge("gap-1", p.Class),
 			Attributes: p.Attributes,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var14), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var13), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -522,16 +478,16 @@ func Next(props ...NextProps) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var16 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var15 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var16 == nil {
+		if templ_7745c5c3_Var15 == nil {
-			templ_7745c5c3_Var16 = templ.NopComponent
+			templ_7745c5c3_Var15 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		var p NextProps
 		if len(props) > 0 {
 			p = props[0]
 		}
-		templ_7745c5c3_Var17 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Var16 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
 			if !templ_7745c5c3_IsBuffer {
@@ -548,12 +504,12 @@ func Next(props ...NextProps) templ.Component {
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var18 string
+				var templ_7745c5c3_Var17 string
-				templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
+				templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 196, Col: 18}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/pagination/pagination.templ`, Line: 168, Col: 18}
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
@@ -575,14 +531,11 @@ func Next(props ...NextProps) templ.Component {
 		templ_7745c5c3_Err = button.Button(button.Props{
 			ID:         p.ID,
 			Href:       p.Href,
-			HxGet:      p.HxGet,
-			HxTarget:   p.HxTarget,
-			HxSwap:     p.HxSwap,
 			Disabled:   p.Disabled,
 			Variant:    button.VariantGhost,
 			Class:      utils.TwMerge("gap-1", p.Class),
 			Attributes: p.Attributes,
-		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var17), templ_7745c5c3_Buffer)
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var16), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -606,9 +559,9 @@ func Ellipsis() templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var19 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var18 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var19 == nil {
+		if templ_7745c5c3_Var18 == nil {
-			templ_7745c5c3_Var19 = templ.NopComponent
+			templ_7745c5c3_Var18 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		templ_7745c5c3_Err = icon.Ellipsis(icon.Props{Size: 16}).Render(ctx, templ_7745c5c3_Buffer)

server/web/templui/components/popover/popover.templ

@@ -1,4 +1,4 @@
-// templui component popover - version: main installed by templui v0.71.0
+// templui component popover - version: v0.84.0 installed by templui v0.84.0
 package popover
 
 import (
@@ -30,12 +30,10 @@ const (
 	TriggerTypeClick TriggerType = "click"
 )
 
-type Props struct {
-	Class string
-}
-
 type TriggerProps struct {
 	ID          string
+	Class       string
+	Attributes  templ.Attributes
 	For         string
 	TriggerType TriggerType
 }
@@ -54,17 +52,6 @@ type ContentProps struct {
 	MatchWidth       bool
 }
 
-templ Popover(props ...Props) {
-	@Script()
-	{{ var p Props }}
-	if len(props) > 0 {
-		{{ p = props[0] }}
-	}
-	<div class={ p.Class }>
-		{ children... }
-	</div>
-}
-
 templ Trigger(props ...TriggerProps) {
 	{{ var p TriggerProps }}
 	if len(props) > 0 {
@@ -77,9 +64,13 @@ templ Trigger(props ...TriggerProps) {
 		if p.ID != "" {
 			id={ p.ID }
 		}
-		data-popover-trigger
+		class={ utils.TwMerge("group cursor-pointer", p.Class) }
-		data-popover-for={ p.For }
+		if p.For != "" {
+			data-popover-trigger={ p.For }
+		}
+		data-open="false"
 		data-popover-type={ string(p.TriggerType) }
+		{ p.Attributes... }
 	>
 		{ children... }
 	</span>
@@ -103,6 +94,7 @@ templ Content(props ...ContentProps) {
 	<div
 		id={ p.ID }
 		data-popover-id={ p.ID }
+		data-open="false"
 		data-popover-placement={ string(p.Placement) }
 		data-popover-offset={ strconv.Itoa(p.Offset) }
 		data-popover-disable-clickaway={ strconv.FormatBool(p.DisableClickAway) }
@@ -114,7 +106,7 @@ templ Content(props ...ContentProps) {
 			data-popover-match-width="true"
 		}
 		class={ utils.TwMerge(
-			"bg-background rounded-lg border text-sm shadow-lg pointer-events-auto absolute z-[9999] hidden top-0 left-0",
+			"bg-popover rounded-lg border text-popover-foreground text-sm shadow-lg pointer-events-auto absolute z-[9999] hidden top-0 left-0",
 			p.Class,
 		) }
 		{ p.Attributes... }
@@ -128,362 +120,6 @@ templ Content(props ...ContentProps) {
 	</div>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/popover.min.js"></script>
-		@FloatingUICore()
-		@FloatingUIDom()
-		<script nonce={ templ.GetNonce(ctx) }>
-			if (typeof window.popoverState === 'undefined') {
-				window.popoverState = new Map();
-			}
-
-			(function() { // IIFE Start
-				if (window.popoverSystemInitialized) return;
-
-				// --- Ensure Global Portal Container ---
-				let portalContainer = document.querySelector('[data-popover-portal-container]');
-				if (!portalContainer) {
-					portalContainer = document.createElement('div');
-					portalContainer.setAttribute('data-popover-portal-container', '');
-					portalContainer.className = 'fixed inset-0 z-[9999] pointer-events-none';
-					document.body.appendChild(portalContainer);
-				}
-				// --- End Ensure Global Portal Container ---
-
-				// --- Floating UI Check & Helper ---
-				let FloatingUIDOM = null;
-
-				function whenFloatingUiReady(callback, attempt = 1) {
-					if (window.FloatingUIDOM) {
-						FloatingUIDOM = window.FloatingUIDOM;
-						callback();
-					} else if (attempt < 40) {
-						setTimeout(() => whenFloatingUiReady(callback, attempt + 1), 50);
-					} else {
-						console.error("Floating UI DOM failed to load after several attempts.");
-					}
-				}
-
-				// --- Helper Functions ---
-				function findReferenceElement(triggerSpan) {
-					const children = triggerSpan.children;
-					if (children.length === 0) return triggerSpan;
-					let bestElement = triggerSpan;
-					let largestArea = 0;
-					for (const child of children) {
-						if (typeof child.getBoundingClientRect !== 'function') continue;
-						const rect = child.getBoundingClientRect();
-						const area = rect.width * rect.height;
-						if (area > largestArea) {
-							largestArea = area;
-							bestElement = child;
-						}
-					}
-					return bestElement;
-				}
-
-				function positionArrow(arrowElement, placement, arrowData, content) {
-					const { x: arrowX, y: arrowY } = arrowData;
-					const staticSide = { top: 'bottom', right: 'left', bottom: 'top', left: 'right' }[placement.split('-')[0]];
-					Object.assign(arrowElement.style, { left: arrowX != null ? `${arrowX}px` : '', top: arrowY != null ? `${arrowY}px` : '', right: '', bottom: '', [staticSide]: '-5px' });
-					const popoverStyle = window.getComputedStyle(content);
-					const popoverBorderColor = popoverStyle.borderColor;
-					arrowElement.style.backgroundColor = popoverStyle.backgroundColor;
-					arrowElement.style.borderTopColor = popoverBorderColor;
-					arrowElement.style.borderRightColor = popoverBorderColor;
-					arrowElement.style.borderBottomColor = popoverBorderColor;
-					arrowElement.style.borderLeftColor = popoverBorderColor;
-					switch (staticSide) {
-						case 'top': arrowElement.style.borderBottomColor = 'transparent'; arrowElement.style.borderRightColor = 'transparent'; break;
-						case 'bottom': arrowElement.style.borderTopColor = 'transparent'; arrowElement.style.borderLeftColor = 'transparent'; break;
-						case 'left': arrowElement.style.borderTopColor = 'transparent'; arrowElement.style.borderRightColor = 'transparent'; break;
-						case 'right': arrowElement.style.borderBottomColor = 'transparent'; arrowElement.style.borderLeftColor = 'transparent'; break;
-					}
-				}
-
-				function addAnimationStyles() {
-					if (document.getElementById('popover-animations')) return;
-					const style = document.createElement('style');
-					style.id = 'popover-animations';
-					style.textContent = `
-						@keyframes popover-in { 0% { opacity: 0; transform: scale(0.95); } 100% { opacity: 1; transform: scale(1); } }
-						@keyframes popover-out { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(0.95); } }
-						[data-popover-id].popover-animate-in { animation: popover-in 0.15s cubic-bezier(0.16, 1, 0.3, 1); }
-						[data-popover-id].popover-animate-out { animation: popover-out 0.1s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
-					`;
-					document.head.appendChild(style);
-				}
-				
-				// --- Core Popover Logic ---				
-				function updatePosition(state) {
-					if (!FloatingUIDOM || !state || !state.trigger || !state.content) return;
-					const { computePosition, offset, flip, shift, arrow } = FloatingUIDOM;
-					const referenceElement = findReferenceElement(state.trigger);
-					const arrowElement = state.content.querySelector('[data-popover-arrow]');
-					const placement = state.content.dataset.popoverPlacement || 'bottom';
-					const offsetValue = parseInt(state.content.dataset.popoverOffset) || (arrowElement ? 8 : 4);
-					const shouldMatchWidth = state.content.dataset.popoverMatchWidth === 'true';
-					
-					const middleware = [offset(offsetValue), flip({ padding: 10 }), shift({ padding: 10 })];
-					if (arrowElement) middleware.push(arrow({ element: arrowElement, padding: 5 }));
-
-					computePosition(referenceElement, state.content, { placement, middleware }).then(({ x, y, placement, middlewareData }) => {
-						Object.assign(state.content.style, { left: `${x}px`, top: `${y}px` });
-						
-						if (shouldMatchWidth) {
-							const triggerWidth = referenceElement.offsetWidth;
-							state.content.style.setProperty('--popover-trigger-width', `${triggerWidth}px`);
-						}
-
-						if (arrowElement && middlewareData.arrow) {
-							positionArrow(arrowElement, placement, middlewareData.arrow, state.content);
-						}
-					});
-				}
-
-				function addGlobalListeners(popoverId, state) {
-					removeGlobalListeners(state); // Ensure no duplicates
-					if (state.content.dataset.popoverDisableClickaway !== 'true') {
-						const handler = (e) => {
-							// Close if click is outside trigger and content
-							if (!state.trigger.contains(e.target) && !state.content.contains(e.target)) {
-								closePopover(popoverId);
-							}
-						};
-						// Use setTimeout to avoid capturing the click that opened the popover
-						setTimeout(() => document.addEventListener('click', handler), 0);
-						state.eventListeners.clickAway = handler;
-					}
-					if (state.content.dataset.popoverDisableEsc !== 'true') {
-						const handler = (e) => { if (e.key === 'Escape') closePopover(popoverId); };
-						document.addEventListener('keydown', handler);
-						state.eventListeners.esc = handler;
-					}
-				}
-
-				function removeGlobalListeners(state) {
-					if (state.eventListeners.clickAway) document.removeEventListener('click', state.eventListeners.clickAway);
-					if (state.eventListeners.esc) document.removeEventListener('keydown', state.eventListeners.esc);
-					state.eventListeners = {}; // Clear stored handlers
-				}
-
-				function openPopover(popoverId, trigger) {
-					if (!FloatingUIDOM) return; 
-					const { autoUpdate } = FloatingUIDOM;
-					const content = document.getElementById(popoverId);
-					if (!content) return;
-
-					let state = window.popoverState.get(popoverId);
-					if (!state) { // Should be created by initTrigger, but as a fallback
-						state = { trigger, content, isOpen: false, cleanup: null, hoverState: {}, eventListeners: {} };
-						window.popoverState.set(popoverId, state);
-					} else if (state.isOpen) return;
-
-					state.trigger = trigger; // Ensure trigger reference is current
-					state.content = content; // Ensure content reference is current
-
-					const portal = document.querySelector('[data-popover-portal-container]');
-					if (portal && content.parentNode !== portal) portal.appendChild(content);
-					
-					content.style.display = 'block';
-					content.classList.remove('popover-animate-out');
-					content.classList.add('popover-animate-in');
-
-					// Initial position update before autoUpdate starts
-					updatePosition(state); 
-
-					if (state.cleanup) state.cleanup();
-					state.cleanup = autoUpdate(findReferenceElement(trigger), content, () => updatePosition(state), { animationFrame: true }); // Use animationFrame for smoother updates
-
-					addGlobalListeners(popoverId, state);
-					state.isOpen = true;
-				}
-
-				function closePopover(popoverId, immediate = false) {
-					const state = window.popoverState.get(popoverId);
-					if (!state || !state.isOpen) return;
-
-					if (state.cleanup) { state.cleanup(); state.cleanup = null; }
-					removeGlobalListeners(state);
-
-					const content = state.content;
-					function hideContent() { content.style.display = 'none'; content.classList.remove('popover-animate-in', 'popover-animate-out'); }
-					
-					if (immediate) hideContent();
-					else {
-						content.classList.remove('popover-animate-in');
-						content.classList.add('popover-animate-out');
-						setTimeout(hideContent, 150); // Match animation duration
-					}
-					state.isOpen = false;
-				}
-				
-				// Expose closePopover globally
-				window.closePopover = closePopover;
-
-				// --- Trigger Initialization & Handling ---
-
-				function attachClickTrigger(trigger, popoverId) {
-					const handler = (e) => {
-						e.stopPropagation();
-						const state = window.popoverState.get(popoverId);
-						if (state?.isOpen) closePopover(popoverId);
-						else openPopover(popoverId, trigger);
-					};
-					trigger.addEventListener('click', handler);
-					trigger._popoverListener = handler; 
-				}
-
-				function attachHoverTrigger(trigger, popoverId) {
-					const content = document.getElementById(popoverId);
-					if (!content) return;
-					let state = window.popoverState.get(popoverId);
-					if (!state) return; // State should exist from initTrigger
-					
-					const hoverDelay = parseInt(content.dataset.popoverHoverDelay) || 100;
-					const hoverOutDelay = parseInt(content.dataset.popoverHoverOutDelay) || 200;
-
-					const handleTriggerEnter = () => { clearTimeout(state.hoverState.leaveTimeout); state.hoverState.enterTimeout = setTimeout(() => openPopover(popoverId, trigger), hoverDelay); };
-					const handleTriggerLeave = (e) => { clearTimeout(state.hoverState.enterTimeout); state.hoverState.leaveTimeout = setTimeout(() => { if (!content.contains(e.relatedTarget)) closePopover(popoverId); }, hoverOutDelay); };
-					const handleContentEnter = () => clearTimeout(state.hoverState.leaveTimeout);
-					const handleContentLeave = (e) => { state.hoverState.leaveTimeout = setTimeout(() => { if (!trigger.contains(e.relatedTarget)) closePopover(popoverId); }, hoverOutDelay); };
-
-					trigger.addEventListener('mouseenter', handleTriggerEnter);
-					trigger.addEventListener('mouseleave', handleTriggerLeave);
-					content.addEventListener('mouseenter', handleContentEnter);
-					content.addEventListener('mouseleave', handleContentLeave);
-
-					// Store handlers for cleanup
-					trigger._popoverHoverListeners = { handleTriggerEnter, handleTriggerLeave };
-					content._popoverHoverListeners = { handleContentEnter, handleContentLeave };
-				}
-				
-				function initTrigger(trigger) {
-					const popoverId = trigger.dataset.popoverFor;
-					const content = document.getElementById(popoverId);
-					if (!popoverId || !content) return;
-					
-					// Prevent re-attaching listeners to the same DOM element instance
-					if (trigger._popoverListenerAttached) return;
-
-					// Ensure state object exists
-					if (!window.popoverState.has(popoverId)) {
-						window.popoverState.set(popoverId, {
-							trigger, content, isOpen: false, cleanup: null, 
-							hoverState: {}, eventListeners: {}
-						});
-					} else {
-						// Update refs in existing state if trigger persisted
-						const state = window.popoverState.get(popoverId);
-						state.trigger = trigger;
-						state.content = content;
-						// Ensure closed state after potential swap/cleanup
-						if (state.isOpen) closePopover(popoverId, true);
-					}
-					
-					// Cleanup any stray listeners before attaching new ones
-					if (trigger._popoverListener) trigger.removeEventListener('click', trigger._popoverListener);
-					if (trigger._popoverHoverListeners) { trigger.removeEventListener('mouseenter', trigger._popoverHoverListeners.handleTriggerEnter); trigger.removeEventListener('mouseleave', trigger._popoverHoverListeners.handleTriggerLeave); }
-					if (content._popoverHoverListeners) { content.removeEventListener('mouseenter', content._popoverHoverListeners.handleContentEnter); content.removeEventListener('mouseleave', content._popoverHoverListeners.handleContentLeave); }
-					delete trigger._popoverListener;
-					delete trigger._popoverHoverListeners;
-					if (content) delete content._popoverHoverListeners;
-
-					// Attach the correct listener type
-					const triggerType = trigger.dataset.popoverType || 'click';
-					if (triggerType === 'click') {
-						attachClickTrigger(trigger, popoverId);
-					} else if (triggerType === 'hover') {
-						attachHoverTrigger(trigger, popoverId);
-					}
-					trigger._popoverListenerAttached = true;
-				}
-				
-				// --- Cleanup ---
-				
-				function cleanupPopovers(element) {
-					const cleanupTrigger = (trigger) => {
-						const popoverId = trigger.dataset.popoverFor;
-						if (popoverId) {
-							closePopover(popoverId, true); // Close popover, remove global listeners, stop Floating UI
-						}
-						
-						// Remove listeners directly attached to the trigger
-						if (trigger._popoverListener) trigger.removeEventListener('click', trigger._popoverListener);
-						if (trigger._popoverHoverListeners) { 
-							trigger.removeEventListener('mouseenter', trigger._popoverHoverListeners.handleTriggerEnter);
-							trigger.removeEventListener('mouseleave', trigger._popoverHoverListeners.handleTriggerLeave);
-						}
-						
-						// Remove listeners attached to the content (for hover)
-						const content = document.getElementById(popoverId);
-						if (content && content._popoverHoverListeners) {
-							content.removeEventListener('mouseenter', content._popoverHoverListeners.handleContentEnter);
-							content.removeEventListener('mouseleave', content._popoverHoverListeners.handleContentLeave);
-							delete content._popoverHoverListeners;
-						}
-						
-						// Clean up stored references and flags on the trigger
-						delete trigger._popoverListener;
-						delete trigger._popoverHoverListeners;
-						delete trigger._popoverListenerAttached;
-						
-						// Optionally remove state - might be desired if the element is definitely gone
-						// window.popoverState.delete(popoverId);
-					};
-
-					// Cleanup element itself if it's a trigger
-					if (element.matches && element.matches('[data-popover-trigger]')) {
-						cleanupTrigger(element);
-					}
-					// Cleanup descendants
-					if (element.querySelectorAll) {
-						element.querySelectorAll('[data-popover-trigger]').forEach(cleanupTrigger);
-					}
-				}
-
-				function initAllComponents(root = document) {
-					if (!FloatingUIDOM) return; // Don't init if library isn't ready
-					if (root instanceof Element && root.matches('[data-popover-trigger]')) {
-						initTrigger(root);
-					}
-					if (root && typeof root.querySelectorAll === 'function') {
-						for (const trigger of root.querySelectorAll('[data-popover-trigger]')) {
-							initTrigger(trigger);
-						}
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						whenFloatingUiReady(() => initAllComponents(target));
-					}
-				};
-				
-				initAllComponents();
-				
-				document.addEventListener('DOMContentLoaded', () => {
-					whenFloatingUiReady(() => {
-						addAnimationStyles();
-						initAllComponents(); 
-					});
-				});
-
-				document.body.addEventListener('htmx:beforeSwap', (event) => {
-					const target = event.detail.target || event.detail.elt;;
-					if (target instanceof Element) {
-						cleanupPopovers(target);
-					}
-				});
-
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-
-				window.popoverSystemInitialized = true;
-			})(); // IIFE End
-		</script>
-	}
 }

server/web/templui/components/progress/progress.templ

@@ -1,4 +1,4 @@
-// templui component progress - version: main installed by templui v0.71.0
+// templui component progress - version: v0.84.0 installed by templui v0.84.0
 package progress
 
 import (
@@ -32,14 +32,9 @@ type Props struct {
 	Size       Size
 	Variant    Variant
 	BarClass   string
-	HxGet      string
-	HxTrigger  string
-	HxTarget   string
-	HxSwap     string
 }
 
 templ Progress(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -50,18 +45,6 @@ templ Progress(props ...Props) {
 	<div
 		id={ p.ID }
 		class={ utils.TwMerge("w-full", p.Class) }
-		if p.HxGet != "" {
-			hx-get={ p.HxGet }
-		}
-		if p.HxTrigger != "" {
-			hx-trigger={ p.HxTrigger }
-		}
-		if p.HxTarget != "" {
-			hx-target={ p.HxTarget }
-		}
-		if p.HxSwap != "" {
-			hx-swap={ p.HxSwap }
-		}
 		aria-valuemin="0"
 		aria-valuemax={ fmt.Sprintf("%d", maxValue(p.Max)) }
 		aria-valuenow={ fmt.Sprintf("%d", p.Value) }
@@ -138,53 +121,6 @@ func variantClasses(variant Variant) string {
 	}
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/progress.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE Start
-				function updateProgressWidth(progressBar) {
-					if (!progressBar) return;
-					
-					const indicator = progressBar.querySelector('[data-progress-indicator]');
-					if (!indicator) return;
-					
-					const value = parseFloat(progressBar.getAttribute('aria-valuenow') || '0');
-					let max = parseFloat(progressBar.getAttribute('aria-valuemax') || '100');
-					if (max <= 0) max = 100;
-					
-					let percentage = 0;
-					if (max > 0) {
-						percentage = (Math.max(0, Math.min(value, max)) / max) * 100;
-					}
-					
-					indicator.style.width = percentage + '%';
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[role="progressbar"]')) {
-						updateProgressWidth(root);
-					}
-					if (root && typeof root.querySelectorAll === 'function') {
-						for (const progressBar of root.querySelectorAll('[role="progressbar"]')) {
-							updateProgressWidth(progressBar);
-						}
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // IIFE End
-		</script>
-	}
 }

server/web/templui/components/progress/progress_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component progress - version: main installed by templui v0.71.0
+// templui component progress - version: v0.84.0 installed by templui v0.84.0
 
 package progress
 
@@ -41,10 +41,6 @@ type Props struct {
 	Size       Size
 	Variant    Variant
 	BarClass   string
-	HxGet      string
-	HxTrigger  string
-	HxTarget   string
-	HxSwap     string
 }
 
 func Progress(props ...Props) templ.Component {
@@ -68,10 +64,6 @@ func Progress(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		var p Props
 		if len(props) > 0 {
 			p = props[0]
@@ -91,7 +83,7 @@ func Progress(props ...Props) templ.Component {
 		var templ_7745c5c3_Var3 string
 		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 51, Col: 11}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 46, Col: 11}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 		if templ_7745c5c3_Err != nil {
@@ -110,113 +102,33 @@ func Progress(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" aria-valuemin=\"0\" aria-valuemax=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		if p.HxGet != "" {
+		var templ_7745c5c3_Var5 string
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " hx-get=\"")
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", maxValue(p.Max)))
-			if templ_7745c5c3_Err != nil {
+		if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 49, Col: 52}
-			}
-			var templ_7745c5c3_Var5 string
-			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxGet)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 54, Col: 19}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
 		}
-		if p.HxTrigger != "" {
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " hx-trigger=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var6 string
-			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxTrigger)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 57, Col: 27}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
-		if p.HxTarget != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " hx-target=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var7 string
-			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxTarget)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 60, Col: 25}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
-		if p.HxSwap != "" {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " hx-swap=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var8 string
-			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.HxSwap)
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 63, Col: 21}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " aria-valuemin=\"0\" aria-valuemax=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var9 string
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\" aria-valuenow=\"")
-		templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", maxValue(p.Max)))
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 66, Col: 52}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\" aria-valuenow=\"")
+		var templ_7745c5c3_Var6 string
+		templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Value))
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 50, Col: 44}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var10 string
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\" role=\"progressbar\"")
-		templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Value))
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 67, Col: 44}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\" role=\"progressbar\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -224,63 +136,63 @@ func Progress(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, ">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, ">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		if p.Label != "" || p.ShowValue {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<div class=\"flex justify-between items-center mb-1\">")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "<div class=\"flex justify-between items-center mb-1\">")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 			if p.Label != "" {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "<span class=\"text-sm font-medium\">")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "<span class=\"text-sm font-medium\">")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var11 string
+				var templ_7745c5c3_Var7 string
-				templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
+				templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.Label)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 74, Col: 48}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 57, Col: 48}
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "</span> ")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "</span> ")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
 			}
 			if p.ShowValue {
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "<span class=\"text-sm font-medium\">")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "<span class=\"text-sm font-medium\">")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				var templ_7745c5c3_Var12 string
+				var templ_7745c5c3_Var8 string
-				templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d%%", percentage(p.Value, p)))
+				templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d%%", percentage(p.Value, p)))
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 78, Col: 51}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 61, Col: 51}
 				}
-				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "</span>")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</span>")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
 			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</div>")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<div class=\"w-full overflow-hidden rounded-full bg-secondary\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<div class=\"w-full overflow-hidden rounded-full bg-secondary\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var13 = []any{
+		var templ_7745c5c3_Var9 = []any{
 			utils.TwMerge(
 				"h-full rounded-full transition-all",
 				sizeClasses(p.Size),
@@ -288,24 +200,24 @@ func Progress(props ...Props) templ.Component {
 				p.BarClass,
 			),
 		}
-		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var13...)
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var9...)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "<div data-progress-indicator class=\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "<div data-progress-indicator class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var14 string
+		var templ_7745c5c3_Var10 string
-		templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var13).String())
+		templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var9).String())
 		if templ_7745c5c3_Err != nil {
 			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 1, Col: 0}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\"></div></div></div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"></div></div></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -355,8 +267,6 @@ func variantClasses(variant Variant) string {
 	}
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -373,43 +283,12 @@ func Script() templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var15 := templ.GetChildren(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var15 == nil {
+		if templ_7745c5c3_Var11 == nil {
-			templ_7745c5c3_Var15 = templ.NopComponent
+			templ_7745c5c3_Var11 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var16 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<script defer src=\"/assets/js/progress.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<script nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var17 string
-			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/progress/progress.templ`, Line: 145, Col: 37}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "\">\n\t\t\t(function() { // IIFE Start\n\t\t\t\tfunction updateProgressWidth(progressBar) {\n\t\t\t\t\tif (!progressBar) return;\n\t\t\t\t\t\n\t\t\t\t\tconst indicator = progressBar.querySelector('[data-progress-indicator]');\n\t\t\t\t\tif (!indicator) return;\n\t\t\t\t\t\n\t\t\t\t\tconst value = parseFloat(progressBar.getAttribute('aria-valuenow') || '0');\n\t\t\t\t\tlet max = parseFloat(progressBar.getAttribute('aria-valuemax') || '100');\n\t\t\t\t\tif (max <= 0) max = 100;\n\t\t\t\t\t\n\t\t\t\t\tlet percentage = 0;\n\t\t\t\t\tif (max > 0) {\n\t\t\t\t\t\tpercentage = (Math.max(0, Math.min(value, max)) / max) * 100;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tindicator.style.width = percentage + '%';\n\t\t\t\t}\n\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('[role=\"progressbar\"]')) {\n\t\t\t\t\t\tupdateProgressWidth(root);\n\t\t\t\t\t}\n\t\t\t\t\tif (root && typeof root.querySelectorAll === 'function') {\n\t\t\t\t\t\tfor (const progressBar of root.querySelectorAll('[role=\"progressbar\"]')) {\n\t\t\t\t\t\t\tupdateProgressWidth(progressBar);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // IIFE End\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var16), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/radio/radio.templ

@@ -1,4 +1,4 @@
-// templui component radio - version: main installed by templui v0.71.0
+// templui component radio - version: v0.84.0 installed by templui v0.84.0
 package radio
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"

server/web/templui/components/radio/radio_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component radio - version: main installed by templui v0.71.0
+// templui component radio - version: v0.84.0 installed by templui v0.84.0
 
 package radio
 

server/web/templui/components/radiocard/radiocard.templ

@@ -0,0 +1,135 @@
+// templui component radiocard - version: v0.84.0 installed by templui v0.84.0
+package radiocard
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Name       string
+	Value      string
+	Checked    bool
+	Disabled   bool
+	Required   bool
+}
+
+type HeaderProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type DescriptionProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type FooterProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+templ RadioCard(props ...Props) {
+	{{ var p Props }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	if p.ID == "" {
+		{{ p.ID = utils.RandomID() }}
+	}
+	<div
+		id={ p.ID + "-container" }
+		class={
+			utils.TwMerge(
+				"relative",
+				utils.If(p.Disabled, "opacity-60"),
+				p.Class,
+			),
+		}
+		{ p.Attributes... }
+	>
+		<input
+			type="radio"
+			id={ p.ID }
+			if p.Name != "" {
+				name={ p.Name }
+			}
+			if p.Value != "" {
+				value={ p.Value }
+			}
+			checked?={ p.Checked }
+			disabled?={ p.Disabled }
+			required?={ p.Required }
+			class="peer sr-only"
+		/>
+		<label
+			for={ p.ID }
+			class={
+				utils.TwMerge(
+					"block w-full rounded-lg border overflow-hidden h-full",
+					"bg-card text-card-foreground p-4 flex flex-col",
+					"cursor-pointer",
+					"hover:border-primary/50",
+					"peer-checked:ring-1 peer-checked:ring-primary peer-checked:border-primary",
+					utils.If(p.Disabled, "cursor-not-allowed"),
+					"transition-all duration-200",
+					p.Class,
+				),
+			}
+			{ p.Attributes... }
+		>
+			{ children... }
+		</label>
+	</div>
+}
+
+templ Header(props ...HeaderProps) {
+	{{ var p HeaderProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("flex items-center justify-between mb-2", p.Class) }
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}
+
+templ Description(props ...DescriptionProps) {
+	{{ var p DescriptionProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<p
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("text-sm text-muted-foreground", p.Class) }
+		{ p.Attributes... }
+	>
+		{ children... }
+	</p>
+}
+
+templ Footer(props ...FooterProps) {
+	{{ var p FooterProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("mt-auto pt-4 w-full", p.Class) }
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}

server/web/templui/components/radiocard/radiocard_templ.go

@@ -0,0 +1,530 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component radiocard - version: v0.84.0 installed by templui v0.84.0
+
+package radiocard
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Name       string
+	Value      string
+	Checked    bool
+	Disabled   bool
+	Required   bool
+}
+
+type HeaderProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type DescriptionProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type FooterProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+func RadioCard(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		if p.ID == "" {
+			p.ID = utils.RandomID()
+		}
+		var templ_7745c5c3_Var2 = []any{
+			utils.TwMerge(
+				"relative",
+				utils.If(p.Disabled, "opacity-60"),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var3 string
+		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID + "-container")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 44, Col: 26}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var4 string
+		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "><input type=\"radio\" id=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var5 string
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 56, Col: 12}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 58, Col: 17}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 61, Col: 19}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Checked {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " checked")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " class=\"peer sr-only\"> ")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var8 = []any{
+			utils.TwMerge(
+				"block w-full rounded-lg border overflow-hidden h-full",
+				"bg-card text-card-foreground p-4 flex flex-col",
+				"cursor-pointer",
+				"hover:border-primary/50",
+				"peer-checked:ring-1 peer-checked:ring-primary peer-checked:border-primary",
+				utils.If(p.Disabled, "cursor-not-allowed"),
+				"transition-all duration-200",
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var8...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "<label for=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var9 string
+		templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 69, Col: 13}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var10 string
+		templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var8).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "</label></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Header(props ...HeaderProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p HeaderProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var12 = []any{utils.TwMerge("flex items-center justify-between mb-2", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var12...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 96, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var14 string
+		templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var12).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Description(props ...DescriptionProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var15 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var15 == nil {
+			templ_7745c5c3_Var15 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p DescriptionProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var16 = []any{utils.TwMerge("text-sm text-muted-foreground", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var16...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "<p")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 112, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var18 string
+		templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var16).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var15.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "</p>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Footer(props ...FooterProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var19 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var19 == nil {
+			templ_7745c5c3_Var19 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p FooterProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var20 = []any{utils.TwMerge("mt-auto pt-4 w-full", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var20...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var21 string
+			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 128, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var22 string
+		templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var20).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/radiocard/radiocard.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var19.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/rating/rating.templ

@@ -1,4 +1,4 @@
-// templui component rating - version: main installed by templui v0.71.0
+// templui component rating - version: v0.84.0 installed by templui v0.84.0
 package rating
 
 import (
@@ -42,7 +42,6 @@ type ItemProps struct {
 }
 
 templ Rating(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -184,243 +183,6 @@ func (p *Props) setDefaults() {
 	}
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/rating.min.js"></script>
-		<script nonce={ templ.GetNonce(ctx) }>
-			if (typeof window.ratingState === 'undefined') {
-				window.ratingState = new WeakMap();
-			}
-			
-			(function() { // IIFE
-				function initRating(ratingElement) {
-					if (!ratingElement) return;
-					
-					const existingState = window.ratingState.get(ratingElement);
-					if (existingState) {
-						cleanupRating(ratingElement, existingState);
-					}
-					
-					ratingElement.dataset.ratingInitialized = 'true';
-					
-					const config = {
-						value: parseFloat(ratingElement.dataset.initialValue) || 0,
-						precision: parseFloat(ratingElement.dataset.precision) || 1,
-						readonly: ratingElement.dataset.readonly === 'true',
-						name: ratingElement.dataset.name || '',
-						onlyInteger: ratingElement.dataset.onlyinteger === 'true',
-						maxValue: 0
-					};
-
-					const hiddenInput = ratingElement.querySelector('[data-rating-input]');
-					let items = Array.from(ratingElement.querySelectorAll('[data-rating-item]'));
-
-					let currentValue = config.value;
-					let previewValue = 0;
-					
-					const handlers = {
-						click: handleClick,
-						mouseover: handleMouseOver,
-						mouseleave: handleMouseLeave
-					};
-					
-					function calculateMaxValue() {
-						let highestValue = 0;
-						for (const item of items) {
-							const value = parseInt(item.dataset.ratingValue, 10);
-							if (!isNaN(value) && value > highestValue) {
-								highestValue = value;
-							}
-						}
-						config.maxValue = Math.max(1, highestValue);
-						currentValue = Math.max(0, Math.min(config.maxValue, currentValue));
-						currentValue = Math.round(currentValue / config.precision) * config.precision;
-						updateHiddenInput();
-					}
-
-					function updateHiddenInput() {
-						if (hiddenInput) {
-							hiddenInput.value = currentValue.toFixed(2);
-						}
-					}
-
-					function updateItemStyles(displayValue) {
-						for (const item of items) {
-							const itemValue = parseInt(item.dataset.ratingValue, 10);
-							if (isNaN(itemValue)) continue;
-							
-							const foreground = item.querySelector('[data-rating-item-foreground]');
-							if (!foreground) continue;
-							
-							const valueToCompare = displayValue > 0 ? displayValue : currentValue;
-							
-							const filled = itemValue <= Math.floor(valueToCompare);
-							const partial = !filled && (itemValue - 1 < valueToCompare && valueToCompare < itemValue);
-							const percentage = partial ? (valueToCompare - Math.floor(valueToCompare)) * 100 : 0;
-							
-							foreground.style.width = filled ? '100%' : (partial ? `${percentage}%` : '0%');
-						}
-					}
-
-					function setValue(itemValue) {
-						if (config.readonly) return;
-						
-						let newValue = itemValue;
-						if (config.onlyInteger) {
-							newValue = Math.round(newValue);
-						} else {
-							if (currentValue === newValue && newValue % 1 === 0) {
-								newValue = Math.max(0, newValue - config.precision);
-							} else {
-								newValue = Math.round(newValue / config.precision) * config.precision;
-							}
-						}
-						
-						currentValue = Math.max(0, Math.min(config.maxValue, newValue));
-						previewValue = 0;
-						updateHiddenInput();
-						updateItemStyles(0);
-						
-						ratingElement.dispatchEvent(new CustomEvent('rating-change', {
-							bubbles: true,
-							detail: { 
-								name: config.name, 
-								value: currentValue, 
-								maxValue: config.maxValue 
-							}
-						}));
-						
-						if (hiddenInput) {
-							hiddenInput.dispatchEvent(new Event('input', { bubbles: true }));
-							hiddenInput.dispatchEvent(new Event('change', { bubbles: true }));
-						}
-					}
-					
-					function handleMouseOver(event) {
-						if (config.readonly) return;
-						const item = event.target.closest('[data-rating-item]');
-						if (!item) return;
-						
-						previewValue = parseInt(item.dataset.ratingValue, 10);
-						if (!isNaN(previewValue)) {
-							updateItemStyles(previewValue);
-						}
-					}
-					
-					function handleMouseLeave() {
-						if (config.readonly) return;
-						previewValue = 0;
-						updateItemStyles(0);
-					}
-					
-					function handleClick(event) {
-						if (config.readonly) return;
-						const item = event.target.closest('[data-rating-item]');
-						if (!item) return;
-						
-						const itemValue = parseInt(item.dataset.ratingValue, 10);
-						if (!isNaN(itemValue)) {
-							setValue(itemValue);
-						}
-					}
-					
-					calculateMaxValue();
-					updateItemStyles(0);
-					
-					if (config.readonly) {
-						ratingElement.style.cursor = 'default';
-						for (const item of items) {
-							item.style.cursor = 'default';
-						}
-					} else {
-						ratingElement.addEventListener('click', handlers.click);
-						ratingElement.addEventListener('mouseover', handlers.mouseover);
-						ratingElement.addEventListener('mouseleave', handlers.mouseleave);
-					}
-					
-					const observer = new MutationObserver(() => {
-						try {
-							const currentItemCount = ratingElement.querySelectorAll('[data-rating-item]').length;
-							if (currentItemCount !== items.length) {
-								items = Array.from(ratingElement.querySelectorAll('[data-rating-item]'));
-								calculateMaxValue();
-								updateItemStyles(previewValue > 0 ? previewValue : 0);
-							}
-						} catch (err) {
-							console.error('Error in rating MutationObserver:', err);
-						}
-					});
-					
-					observer.observe(ratingElement, { childList: true, subtree: true });
-					
-					const state = {
-						handlers,
-						observer,
-						items
-					};
-					
-					window.ratingState.set(ratingElement, state);
-				}
-				
-				function cleanupRating(ratingElement, state) {
-					if (!ratingElement || !state) return;
-					
-					if (!ratingElement.dataset.readonly === 'true') {
-						ratingElement.removeEventListener('click', state.handlers.click);
-						ratingElement.removeEventListener('mouseover', state.handlers.mouseover);
-						ratingElement.removeEventListener('mouseleave', state.handlers.mouseleave);
-					}
-					
-					if (state.observer) {
-						state.observer.disconnect();
-					}
-					
-					window.ratingState.delete(ratingElement);
-					ratingElement.removeAttribute('data-rating-initialized');
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-rating-component]')) {
-						initRating(root); // initRating handles already initialized check internally
-					}
-					if (root && typeof root.querySelectorAll === 'function') {
-						root.querySelectorAll('[data-rating-component]').forEach(initRating);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-
-				document.body.addEventListener('htmx:beforeCleanup', event => {
-					const containerToRemove = event.detail.target || event.detail.elt;; // Use elt for beforeCleanup
-					if (containerToRemove instanceof Element) {
-						// Cleanup target itself
-						if (containerToRemove.matches && containerToRemove.matches('[data-rating-component][data-rating-initialized]')) {
-							const state = window.ratingState.get(containerToRemove);
-							if (state) cleanupRating(containerToRemove, state);
-						}
-						// Cleanup descendants
-						if (containerToRemove.querySelectorAll) {
-							for (const ratingEl of containerToRemove.querySelectorAll('[data-rating-component][data-rating-initialized]')) {
-								const state = window.ratingState.get(ratingEl);
-								if (state) cleanupRating(ratingEl, state);
-							}
-						}
-					}
-				});
-
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/selectbox/selectbox.templ

@@ -0,0 +1,319 @@
+// templui component selectbox - version: v0.84.0 installed by templui v0.84.0
+package selectbox
+
+import (
+	"context"
+	"fmt"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/button"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/icon"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/input"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/popover"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"strconv"
+)
+
+type contextKey string
+
+var contentIDKey contextKey = "contentID"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Multiple   bool
+}
+
+type TriggerProps struct {
+	ID                string
+	Class             string
+	Attributes        templ.Attributes
+	Name              string
+	Required          bool
+	Disabled          bool
+	HasError          bool
+	Multiple          bool
+	ShowPills         bool
+	SelectedCountText string
+}
+
+type ValueProps struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Placeholder string
+	Multiple    bool
+}
+
+type ContentProps struct {
+	ID                string
+	Class             string
+	Attributes        templ.Attributes
+	NoSearch          bool
+	SearchPlaceholder string
+}
+
+type GroupProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type LabelProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type ItemProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Value      string
+	Selected   bool
+	Disabled   bool
+}
+
+templ SelectBox(props ...Props) {
+	{{
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		wrapperID := p.ID
+		if wrapperID == "" {
+			wrapperID = utils.RandomID()
+		}
+		contentID := fmt.Sprintf("%s-content", wrapperID)
+		ctx = context.WithValue(ctx, contentIDKey, contentID)
+	}}
+	<div
+		id={ wrapperID }
+		class={ utils.TwMerge("select-container w-full relative", p.Class) }
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}
+
+templ Trigger(props ...TriggerProps) {
+	{{
+		var p TriggerProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		contentID, ok := ctx.Value(contentIDKey).(string)
+		if !ok {
+			contentID = "fallback-select-content-id"
+		}
+		if p.ShowPills {
+			p.Multiple = true
+		}
+	}}
+	@popover.Trigger(popover.TriggerProps{
+		For:         contentID,
+		TriggerType: popover.TriggerTypeClick,
+	}) {
+		@button.Button(button.Props{
+			ID:      p.ID,
+			Type:    "button",
+			Variant: button.VariantOutline,
+			Class: utils.TwMerge(
+				// Required class for JavaScript
+				"select-trigger",
+				// Base styles matching input
+				"w-full h-9 px-3 py-1 text-base md:text-sm",
+				"flex items-center justify-between",
+				"rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Focus styles
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+				p.Class,
+			),
+			Disabled: p.Disabled,
+			Attributes: utils.MergeAttributes(
+				templ.Attributes{
+					"data-tui-selectbox-content-id":          contentID,
+					"data-tui-selectbox-multiple":            strconv.FormatBool(p.Multiple),
+					"data-tui-selectbox-show-pills":          strconv.FormatBool(p.ShowPills),
+					"data-tui-selectbox-selected-count-text": p.SelectedCountText,
+					"tabindex":                 "0",
+					"required":                 strconv.FormatBool(p.Required),
+					"aria-invalid":             utils.If(p.HasError, "true"),
+				},
+			),
+		}) {
+			<input
+				type="hidden"
+				if p.Name != "" {
+					name={ p.Name }
+				}
+				required?={ p.Required }
+				{ p.Attributes... }
+			/>
+			{ children... }
+			<span class="pointer-events-none ml-1">
+				@icon.ChevronDown(icon.Props{
+					Size:  16,
+					Class: "text-muted-foreground",
+				})
+			</span>
+		}
+	}
+}
+
+templ Value(props ...ValueProps) {
+	{{ var p ValueProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<span
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("block truncate select-value text-muted-foreground", p.Class) }
+		{ p.Attributes... }
+	>
+		if p.Placeholder != "" {
+			{ p.Placeholder }
+		}
+		{ children... }
+	</span>
+}
+
+templ Content(props ...ContentProps) {
+	{{
+		var p ContentProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		contentID, ok := ctx.Value(contentIDKey).(string)
+		if !ok {
+			contentID = "fallback-select-content-id"
+		}
+	}}
+	@popover.Content(popover.ContentProps{
+		ID:         contentID,
+		Placement:  popover.PlacementBottomStart,
+		Offset:     4,
+		MatchWidth: true,
+		DisableESC: !p.NoSearch,
+		Class: utils.TwMerge(
+			"p-1 select-content z-50 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+			"min-w-[var(--popover-trigger-width)] w-[var(--popover-trigger-width)]",
+			p.Class,
+		),
+		Attributes: utils.MergeAttributes(
+			templ.Attributes{
+				"role":     "listbox",
+				"tabindex": "-1",
+			},
+			p.Attributes,
+		),
+	}) {
+		if !p.NoSearch {
+			<div class="sticky top-0 bg-popover p-1">
+				<div class="relative">
+					<span class="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground z-10 pointer-events-none">
+						@icon.Search(icon.Props{Size: 16})
+					</span>
+					@input.Input(input.Props{
+						Type:        input.TypeSearch,
+						Class:       "pl-8",
+						Placeholder: utils.IfElse(p.SearchPlaceholder != "", p.SearchPlaceholder, "Search..."),
+						Attributes: templ.Attributes{
+							"data-tui-selectbox-search": "",
+						},
+					})
+				</div>
+			</div>
+		}
+		<div class="max-h-[300px] overflow-y-auto">
+			{ children... }
+		</div>
+	}
+}
+
+templ Group(props ...GroupProps) {
+	{{ var p GroupProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("p-1", p.Class) }
+		role="group"
+		{ p.Attributes... }
+	>
+		{ children... }
+	</div>
+}
+
+templ Label(props ...LabelProps) {
+	{{ var p LabelProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<span
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={ utils.TwMerge("px-2 py-1.5 text-sm font-medium", p.Class) }
+		{ p.Attributes... }
+	>
+		{ children... }
+	</span>
+}
+
+templ Item(props ...ItemProps) {
+	{{ var p ItemProps }}
+	if len(props) > 0 {
+		{{ p = props[0] }}
+	}
+	<div
+		if p.ID != "" {
+			id={ p.ID }
+		}
+		class={
+			utils.TwMerge(
+				"select-item relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 px-2 text-sm font-light outline-none",
+				"hover:bg-accent hover:text-accent-foreground",
+				"focus:bg-accent focus:text-accent-foreground",
+				utils.If(p.Selected, "bg-accent text-accent-foreground"),
+				utils.If(p.Disabled, "pointer-events-none opacity-50"),
+				p.Class,
+			),
+		}
+		role="option"
+		data-tui-selectbox-value={ p.Value }
+		data-tui-selectbox-selected={ strconv.FormatBool(p.Selected) }
+		data-tui-selectbox-disabled={ strconv.FormatBool(p.Disabled) }
+		tabindex="0"
+		{ p.Attributes... }
+	>
+		<span class="truncate select-item-text">
+			{ children... }
+		</span>
+		<span
+			class={
+				utils.TwMerge(
+					"select-check absolute right-2 flex h-3.5 w-3.5 items-center justify-center",
+					utils.IfElse(p.Selected, "opacity-100", "opacity-0"),
+				),
+			}
+		>
+			@icon.Check(icon.Props{Size: 16})
+		</span>
+	</div>
+}
+
+templ Script() {
+	<script defer src="/assets/js/selectbox.min.js"></script>
+}

server/web/templui/components/selectbox/selectbox_templ.go

@@ -0,0 +1,932 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component selectbox - version: v0.84.0 installed by templui v0.84.0
+
+package selectbox
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"context"
+	"fmt"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/button"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/icon"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/input"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/popover"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+	"strconv"
+)
+
+type contextKey string
+
+var contentIDKey contextKey = "contentID"
+
+type Props struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Multiple   bool
+}
+
+type TriggerProps struct {
+	ID                string
+	Class             string
+	Attributes        templ.Attributes
+	Name              string
+	Required          bool
+	Disabled          bool
+	HasError          bool
+	Multiple          bool
+	ShowPills         bool
+	SelectedCountText string
+}
+
+type ValueProps struct {
+	ID          string
+	Class       string
+	Attributes  templ.Attributes
+	Placeholder string
+	Multiple    bool
+}
+
+type ContentProps struct {
+	ID                string
+	Class             string
+	Attributes        templ.Attributes
+	NoSearch          bool
+	SearchPlaceholder string
+}
+
+type GroupProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type LabelProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+}
+
+type ItemProps struct {
+	ID         string
+	Class      string
+	Attributes templ.Attributes
+	Value      string
+	Selected   bool
+	Disabled   bool
+}
+
+func SelectBox(props ...Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+
+		var p Props
+		if len(props) > 0 {
+			p = props[0]
+		}
+		wrapperID := p.ID
+		if wrapperID == "" {
+			wrapperID = utils.RandomID()
+		}
+		contentID := fmt.Sprintf("%s-content", wrapperID)
+		ctx = context.WithValue(ctx, contentIDKey, contentID)
+		var templ_7745c5c3_Var2 = []any{utils.TwMerge("select-container w-full relative", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var3 string
+		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(wrapperID)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 90, Col: 16}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var4 string
+		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Trigger(props ...TriggerProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+
+		var p TriggerProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		contentID, ok := ctx.Value(contentIDKey).(string)
+		if !ok {
+			contentID = "fallback-select-content-id"
+		}
+		if p.ShowPills {
+			p.Multiple = true
+		}
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+				if !templ_7745c5c3_IsBuffer {
+					defer func() {
+						templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+						if templ_7745c5c3_Err == nil {
+							templ_7745c5c3_Err = templ_7745c5c3_BufErr
+						}
+					}()
+				}
+				ctx = templ.InitializeContext(ctx)
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "<input type=\"hidden\"")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				if p.Name != "" {
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " name=\"")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					var templ_7745c5c3_Var8 string
+					templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+					if templ_7745c5c3_Err != nil {
+						return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 154, Col: 18}
+					}
+					_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+				}
+				if p.Required {
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " required")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+				}
+				templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, ">")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " <span class=\"pointer-events-none ml-1\">")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = icon.ChevronDown(icon.Props{
+					Size:  16,
+					Class: "text-muted-foreground",
+				}).Render(ctx, templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</span>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				return nil
+			})
+			templ_7745c5c3_Err = button.Button(button.Props{
+				ID:      p.ID,
+				Type:    "button",
+				Variant: button.VariantOutline,
+				Class: utils.TwMerge(
+					// Required class for JavaScript
+					"select-trigger",
+					// Base styles matching input
+					"w-full h-9 px-3 py-1 text-base md:text-sm",
+					"flex items-center justify-between",
+					"rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+					// Dark mode background
+					"dark:bg-input/30",
+					// Selection styles
+					"selection:bg-primary selection:text-primary-foreground",
+					// Focus styles
+					"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+					// Error/Invalid styles
+					"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+					utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+					p.Class,
+				),
+				Disabled: p.Disabled,
+				Attributes: utils.MergeAttributes(
+					templ.Attributes{
+						"data-tui-selectbox-content-id":          contentID,
+						"data-tui-selectbox-multiple":            strconv.FormatBool(p.Multiple),
+						"data-tui-selectbox-show-pills":          strconv.FormatBool(p.ShowPills),
+						"data-tui-selectbox-selected-count-text": p.SelectedCountText,
+						"tabindex":                               "0",
+						"required":                               strconv.FormatBool(p.Required),
+						"aria-invalid":                           utils.If(p.HasError, "true"),
+					},
+				),
+			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = popover.Trigger(popover.TriggerProps{
+			For:         contentID,
+			TriggerType: popover.TriggerTypeClick,
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Value(props ...ValueProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var9 == nil {
+			templ_7745c5c3_Var9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p ValueProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var10 = []any{utils.TwMerge("block truncate select-value text-muted-foreground", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var10...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<span")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 177, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var12 string
+		templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var10).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.Placeholder != "" {
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.Placeholder)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 183, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</span>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Content(props ...ContentProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var14 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var14 == nil {
+			templ_7745c5c3_Var14 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+
+		var p ContentProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		contentID, ok := ctx.Value(contentIDKey).(string)
+		if !ok {
+			contentID = "fallback-select-content-id"
+		}
+		templ_7745c5c3_Var15 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			if !p.NoSearch {
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div class=\"sticky top-0 bg-popover p-1\"><div class=\"relative\"><span class=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground z-10 pointer-events-none\">")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = icon.Search(icon.Props{Size: 16}).Render(ctx, templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</span>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = input.Input(input.Props{
+					Type:        input.TypeSearch,
+					Class:       "pl-8",
+					Placeholder: utils.IfElse(p.SearchPlaceholder != "", p.SearchPlaceholder, "Search..."),
+					Attributes: templ.Attributes{
+						"data-tui-selectbox-search": "",
+					},
+				}).Render(ctx, templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</div></div>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " <div class=\"max-h-[300px] overflow-y-auto\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templ_7745c5c3_Var14.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = popover.Content(popover.ContentProps{
+			ID:         contentID,
+			Placement:  popover.PlacementBottomStart,
+			Offset:     4,
+			MatchWidth: true,
+			DisableESC: !p.NoSearch,
+			Class: utils.TwMerge(
+				"p-1 select-content z-50 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+				"min-w-[var(--popover-trigger-width)] w-[var(--popover-trigger-width)]",
+				p.Class,
+			),
+			Attributes: utils.MergeAttributes(
+				templ.Attributes{
+					"role":     "listbox",
+					"tabindex": "-1",
+				},
+				p.Attributes,
+			),
+		}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var15), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Group(props ...GroupProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var16 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var16 == nil {
+			templ_7745c5c3_Var16 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p GroupProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var17 = []any{utils.TwMerge("p-1", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var17...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var18 string
+			templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 249, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var19 string
+		templ_7745c5c3_Var19, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var17).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var19))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\" role=\"group\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var16.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Label(props ...LabelProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var20 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var20 == nil {
+			templ_7745c5c3_Var20 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p LabelProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var21 = []any{utils.TwMerge("px-2 py-1.5 text-sm font-medium", p.Class)}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var21...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "<span")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var22 string
+			templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 266, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var23 string
+		templ_7745c5c3_Var23, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var21).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var23))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var20.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "</span>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Item(props ...ItemProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var24 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var24 == nil {
+			templ_7745c5c3_Var24 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var p ItemProps
+		if len(props) > 0 {
+			p = props[0]
+		}
+		var templ_7745c5c3_Var25 = []any{
+			utils.TwMerge(
+				"select-item relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 px-2 text-sm font-light outline-none",
+				"hover:bg-accent hover:text-accent-foreground",
+				"focus:bg-accent focus:text-accent-foreground",
+				utils.If(p.Selected, "bg-accent text-accent-foreground"),
+				utils.If(p.Disabled, "pointer-events-none opacity-50"),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var25...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "<div")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if p.ID != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, " id=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var26 string
+			templ_7745c5c3_Var26, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 282, Col: 12}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var26))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, " class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var27 string
+		templ_7745c5c3_Var27, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var25).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var27))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "\" role=\"option\" data-tui-selectbox-value=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var28 string
+		templ_7745c5c3_Var28, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 295, Col: 36}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var28))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, "\" data-tui-selectbox-selected=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var29 string
+		templ_7745c5c3_Var29, templ_7745c5c3_Err = templ.JoinStringErrs(strconv.FormatBool(p.Selected))
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 296, Col: 62}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var29))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\" data-tui-selectbox-disabled=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var30 string
+		templ_7745c5c3_Var30, templ_7745c5c3_Err = templ.JoinStringErrs(strconv.FormatBool(p.Disabled))
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 297, Col: 62}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var30))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, "\" tabindex=\"0\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "><span class=\"truncate select-item-text\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var24.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 48, "</span> ")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var31 = []any{
+			utils.TwMerge(
+				"select-check absolute right-2 flex h-3.5 w-3.5 items-center justify-center",
+				utils.IfElse(p.Selected, "opacity-100", "opacity-0"),
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var31...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 49, "<span class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var32 string
+		templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var31).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/selectbox/selectbox.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = icon.Check(icon.Props{Size: 16}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, "</span></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Script() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var33 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var33 == nil {
+			templ_7745c5c3_Var33 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "<script defer src=\"/assets/js/selectbox.min.js\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/separator/separator.templ

@@ -1,4 +1,4 @@
-// templui component separator - version: main installed by templui v0.71.0
+// templui component separator - version: v0.84.0 installed by templui v0.84.0
 package separator
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"

server/web/templui/components/separator/separator_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component separator - version: main installed by templui v0.71.0
+// templui component separator - version: v0.84.0 installed by templui v0.84.0
 
 package separator
 

server/web/templui/components/skeleton/skeleton.templ

@@ -1,4 +1,4 @@
-// templui component skeleton - version: main installed by templui v0.71.0
+// templui component skeleton - version: v0.84.0 installed by templui v0.84.0
 package skeleton
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"

server/web/templui/components/skeleton/skeleton_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component skeleton - version: main installed by templui v0.71.0
+// templui component skeleton - version: v0.84.0 installed by templui v0.84.0
 
 package skeleton
 

server/web/templui/components/slider/slider.templ

@@ -1,4 +1,4 @@
-// templui component slider - version: main installed by templui v0.71.0
+// templui component slider - version: v0.84.0 installed by templui v0.84.0
 package slider
 
 import (
@@ -32,7 +32,6 @@ type ValueProps struct {
 }
 
 templ Slider(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -116,53 +115,6 @@ templ Value(props ...ValueProps) {
 	</span>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/slider.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE
-				function initSlider(sliderInput) {
-					if (sliderInput.hasAttribute('data-initialized')) return;
-					
-					sliderInput.setAttribute('data-initialized', 'true');
-
-					const sliderId = sliderInput.id;
-					if (!sliderId) return;
-
-					const valueElements = document.querySelectorAll(`[data-slider-value][data-slider-value-for="${sliderId}"]`);
-					
-					function updateValues() {
-						valueElements.forEach(el => {
-							el.textContent = sliderInput.value;
-						});
-					}
-
-					updateValues(); 
-					sliderInput.addEventListener('input', updateValues);
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('input[type="range"][data-slider-input]')) {
-						initSlider(root);
-					}
-					for (const slider of root.querySelectorAll('input[type="range"][data-slider-input]:not([data-initialized])')) {
-						initSlider(slider);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/slider/slider_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component slider - version: main installed by templui v0.71.0
+// templui component slider - version: v0.84.0 installed by templui v0.84.0
 
 package slider
 
@@ -61,10 +61,6 @@ func Slider(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		var p Props
 		if len(props) > 0 {
 			p = props[0]
@@ -86,7 +82,7 @@ func Slider(props ...Props) templ.Component {
 			var templ_7745c5c3_Var3 string
 			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 42, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 41, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
@@ -187,7 +183,7 @@ func Input(props ...InputProps) templ.Component {
 		var templ_7745c5c3_Var7 string
 		templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 62, Col: 11}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 61, Col: 11}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
 		if templ_7745c5c3_Err != nil {
@@ -205,7 +201,7 @@ func Input(props ...InputProps) templ.Component {
 			var templ_7745c5c3_Var8 string
 			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 65, Col: 16}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 64, Col: 16}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 			if templ_7745c5c3_Err != nil {
@@ -224,7 +220,7 @@ func Input(props ...InputProps) templ.Component {
 			var templ_7745c5c3_Var9 string
 			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Value))
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 68, Col: 37}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 67, Col: 37}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
 			if templ_7745c5c3_Err != nil {
@@ -243,7 +239,7 @@ func Input(props ...InputProps) templ.Component {
 			var templ_7745c5c3_Var10 string
 			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Min))
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 71, Col: 33}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 70, Col: 33}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
 			if templ_7745c5c3_Err != nil {
@@ -262,7 +258,7 @@ func Input(props ...InputProps) templ.Component {
 			var templ_7745c5c3_Var11 string
 			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Max))
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 74, Col: 33}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 73, Col: 33}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
 			if templ_7745c5c3_Err != nil {
@@ -281,7 +277,7 @@ func Input(props ...InputProps) templ.Component {
 			var templ_7745c5c3_Var12 string
 			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("%d", p.Step))
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 77, Col: 35}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 76, Col: 35}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
 			if templ_7745c5c3_Err != nil {
@@ -375,7 +371,7 @@ func Value(props ...ValueProps) templ.Component {
 			var templ_7745c5c3_Var16 string
 			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 108, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 107, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
 			if templ_7745c5c3_Err != nil {
@@ -393,7 +389,7 @@ func Value(props ...ValueProps) templ.Component {
 		var templ_7745c5c3_Var17 string
 		templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(p.For)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 111, Col: 31}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 110, Col: 31}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
 		if templ_7745c5c3_Err != nil {
@@ -428,8 +424,6 @@ func Value(props ...ValueProps) templ.Component {
 	})
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -451,38 +445,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var19 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var20 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "<script defer src=\"/assets/js/slider.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "<script defer nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var21 string
-			templ_7745c5c3_Var21, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/slider/slider.templ`, Line: 123, Col: 43}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var21))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\">\n\t\t\t(function() { // IIFE\n\t\t\t\tfunction initSlider(sliderInput) {\n\t\t\t\t\tif (sliderInput.hasAttribute('data-initialized')) return;\n\t\t\t\t\t\n\t\t\t\t\tsliderInput.setAttribute('data-initialized', 'true');\n\n\t\t\t\t\tconst sliderId = sliderInput.id;\n\t\t\t\t\tif (!sliderId) return;\n\n\t\t\t\t\tconst valueElements = document.querySelectorAll(`[data-slider-value][data-slider-value-for=\"${sliderId}\"]`);\n\t\t\t\t\t\n\t\t\t\t\tfunction updateValues() {\n\t\t\t\t\t\tvalueElements.forEach(el => {\n\t\t\t\t\t\t\tel.textContent = sliderInput.value;\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\n\t\t\t\t\tupdateValues(); \n\t\t\t\t\tsliderInput.addEventListener('input', updateValues);\n\t\t\t\t}\n\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('input[type=\"range\"][data-slider-input]')) {\n\t\t\t\t\t\tinitSlider(root);\n\t\t\t\t\t}\n\t\t\t\t\tfor (const slider of root.querySelectorAll('input[type=\"range\"][data-slider-input]:not([data-initialized])')) {\n\t\t\t\t\t\tinitSlider(slider);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // End of IIFE\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var20), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/table/table.templ

@@ -1,4 +1,4 @@
-// templui component table - version: main installed by templui v0.71.0
+// templui component table - version: v0.84.0 installed by templui v0.84.0
 package table
 
 import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"

server/web/templui/components/table/table_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component table - version: main installed by templui v0.71.0
+// templui component table - version: v0.84.0 installed by templui v0.84.0
 
 package table
 

server/web/templui/components/tabs/tabs.templ

@@ -1,4 +1,4 @@
-// templui component tabs - version: main installed by templui v0.71.0
+// templui component tabs - version: v0.84.0 installed by templui v0.84.0
 package tabs
 
 import (
@@ -37,7 +37,6 @@ type ContentProps struct {
 }
 
 templ Tabs(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -163,87 +162,6 @@ func IDFromContext(ctx context.Context) string {
 	return ""
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/tabs.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE
-				function initTabs(container) {
-					if (container.hasAttribute('data-initialized')) return;
-					
-					container.setAttribute('data-initialized', 'true');
-
-					const tabsId = container.dataset.tabsId;
-					if (!tabsId) return;
-
-					const triggers = Array.from(container.querySelectorAll(`[data-tabs-trigger][data-tabs-id="${tabsId}"]`));
-					const contents = Array.from(container.querySelectorAll(`[data-tabs-content][data-tabs-id="${tabsId}"]`));
-					const marker = container.querySelector(`[data-tabs-marker][data-tabs-id="${tabsId}"]`);
-
-					function updateMarker(activeTrigger) {
-						if (!marker || !activeTrigger) return;
-						
-						marker.style.width = activeTrigger.offsetWidth + 'px';
-						marker.style.height = activeTrigger.offsetHeight + 'px';
-						marker.style.left = activeTrigger.offsetLeft + 'px';
-					}
-
-					function setActiveTab(value) {
-						let activeTrigger = null;
-						
-						for (const trigger of triggers) {
-							const isActive = trigger.dataset.tabsValue === value;
-							trigger.dataset.state = isActive ? "active" : "inactive";
-							trigger.classList.toggle('text-foreground', isActive);
-							trigger.classList.toggle('bg-background', isActive);
-							trigger.classList.toggle('shadow-xs', isActive);
-							
-							if (isActive) activeTrigger = trigger;
-						}
-
-						for (const content of contents) {
-							const isActive = content.dataset.tabsValue === value;
-							content.dataset.state = isActive ? "active" : "inactive";
-							content.classList.toggle('hidden', !isActive);
-						}
-
-						updateMarker(activeTrigger);
-					}
-
-					const defaultTrigger = triggers.find(t => t.dataset.state === 'active') || triggers[0];
-					if (defaultTrigger) {
-						setActiveTab(defaultTrigger.dataset.tabsValue);
-					}
-
-					for (const trigger of triggers) {
-						trigger.addEventListener('click', () => {
-							setActiveTab(trigger.dataset.tabsValue);
-						});
-					}
-				}
-
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('[data-tabs]')) {
-						initTabs(root);
-					}
-					for (const tabs of root.querySelectorAll('[data-tabs]:not([data-initialized])')) {
-						initTabs(tabs);
-					}
-				}
-
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/tabs/tabs_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component tabs - version: main installed by templui v0.71.0
+// templui component tabs - version: v0.84.0 installed by templui v0.84.0
 
 package tabs
 
@@ -66,10 +66,6 @@ func Tabs(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		var p Props
 		if len(props) > 0 {
 			p = props[0]
@@ -95,7 +91,7 @@ func Tabs(props ...Props) templ.Component {
 			var templ_7745c5c3_Var3 string
 			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 51, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 50, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
@@ -126,7 +122,7 @@ func Tabs(props ...Props) templ.Component {
 		var templ_7745c5c3_Var5 string
 		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(tabsID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 55, Col: 23}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 54, Col: 23}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
 		if templ_7745c5c3_Err != nil {
@@ -205,7 +201,7 @@ func List(props ...ListProps) templ.Component {
 			var templ_7745c5c3_Var8 string
 			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 71, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 70, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 			if templ_7745c5c3_Err != nil {
@@ -252,7 +248,7 @@ func List(props ...ListProps) templ.Component {
 		var templ_7745c5c3_Var10 string
 		templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(tabsID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 84, Col: 24}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 83, Col: 24}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
 		if templ_7745c5c3_Err != nil {
@@ -323,7 +319,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 			var templ_7745c5c3_Var13 string
 			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 106, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 105, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
 			if templ_7745c5c3_Err != nil {
@@ -354,7 +350,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 		var templ_7745c5c3_Var15 string
 		templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(tabsID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 116, Col: 23}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 115, Col: 23}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
 		if templ_7745c5c3_Err != nil {
@@ -367,7 +363,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 		var templ_7745c5c3_Var16 string
 		templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 117, Col: 27}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 116, Col: 27}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
 		if templ_7745c5c3_Err != nil {
@@ -380,7 +376,7 @@ func Trigger(props ...TriggerProps) templ.Component {
 		var templ_7745c5c3_Var17 string
 		templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(utils.IfElse(p.IsActive, "active", "inactive"))
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 118, Col: 61}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 117, Col: 61}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
 		if templ_7745c5c3_Err != nil {
@@ -468,7 +464,7 @@ func Content(props ...ContentProps) templ.Component {
 			var templ_7745c5c3_Var20 string
 			templ_7745c5c3_Var20, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 140, Col: 12}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 139, Col: 12}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var20))
 			if templ_7745c5c3_Err != nil {
@@ -499,7 +495,7 @@ func Content(props ...ContentProps) templ.Component {
 		var templ_7745c5c3_Var22 string
 		templ_7745c5c3_Var22, templ_7745c5c3_Err = templ.JoinStringErrs(tabsID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 150, Col: 23}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 149, Col: 23}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var22))
 		if templ_7745c5c3_Err != nil {
@@ -512,7 +508,7 @@ func Content(props ...ContentProps) templ.Component {
 		var templ_7745c5c3_Var23 string
 		templ_7745c5c3_Var23, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 151, Col: 27}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 150, Col: 27}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var23))
 		if templ_7745c5c3_Err != nil {
@@ -525,7 +521,7 @@ func Content(props ...ContentProps) templ.Component {
 		var templ_7745c5c3_Var24 string
 		templ_7745c5c3_Var24, templ_7745c5c3_Err = templ.JoinStringErrs(utils.IfElse(p.IsActive, "active", "inactive"))
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 152, Col: 61}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 151, Col: 61}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var24))
 		if templ_7745c5c3_Err != nil {
@@ -562,8 +558,6 @@ func IDFromContext(ctx context.Context) string {
 	return ""
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -585,38 +579,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var25 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var26 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "<script defer src=\"/assets/js/tabs.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "<script defer nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var27 string
-			templ_7745c5c3_Var27, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tabs/tabs.templ`, Line: 170, Col: 43}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var27))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, "\">\n\t\t\t(function() { // IIFE\n\t\t\t\tfunction initTabs(container) {\n\t\t\t\t\tif (container.hasAttribute('data-initialized')) return;\n\t\t\t\t\t\n\t\t\t\t\tcontainer.setAttribute('data-initialized', 'true');\n\n\t\t\t\t\tconst tabsId = container.dataset.tabsId;\n\t\t\t\t\tif (!tabsId) return;\n\n\t\t\t\t\tconst triggers = Array.from(container.querySelectorAll(`[data-tabs-trigger][data-tabs-id=\"${tabsId}\"]`));\n\t\t\t\t\tconst contents = Array.from(container.querySelectorAll(`[data-tabs-content][data-tabs-id=\"${tabsId}\"]`));\n\t\t\t\t\tconst marker = container.querySelector(`[data-tabs-marker][data-tabs-id=\"${tabsId}\"]`);\n\n\t\t\t\t\tfunction updateMarker(activeTrigger) {\n\t\t\t\t\t\tif (!marker || !activeTrigger) return;\n\t\t\t\t\t\t\n\t\t\t\t\t\tmarker.style.width = activeTrigger.offsetWidth + 'px';\n\t\t\t\t\t\tmarker.style.height = activeTrigger.offsetHeight + 'px';\n\t\t\t\t\t\tmarker.style.left = activeTrigger.offsetLeft + 'px';\n\t\t\t\t\t}\n\n\t\t\t\t\tfunction setActiveTab(value) {\n\t\t\t\t\t\tlet activeTrigger = null;\n\t\t\t\t\t\t\n\t\t\t\t\t\tfor (const trigger of triggers) {\n\t\t\t\t\t\t\tconst isActive = trigger.dataset.tabsValue === value;\n\t\t\t\t\t\t\ttrigger.dataset.state = isActive ? \"active\" : \"inactive\";\n\t\t\t\t\t\t\ttrigger.classList.toggle('text-foreground', isActive);\n\t\t\t\t\t\t\ttrigger.classList.toggle('bg-background', isActive);\n\t\t\t\t\t\t\ttrigger.classList.toggle('shadow-xs', isActive);\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\tif (isActive) activeTrigger = trigger;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tfor (const content of contents) {\n\t\t\t\t\t\t\tconst isActive = content.dataset.tabsValue === value;\n\t\t\t\t\t\t\tcontent.dataset.state = isActive ? \"active\" : \"inactive\";\n\t\t\t\t\t\t\tcontent.classList.toggle('hidden', !isActive);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tupdateMarker(activeTrigger);\n\t\t\t\t\t}\n\n\t\t\t\t\tconst defaultTrigger = triggers.find(t => t.dataset.state === 'active') || triggers[0];\n\t\t\t\t\tif (defaultTrigger) {\n\t\t\t\t\t\tsetActiveTab(defaultTrigger.dataset.tabsValue);\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (const trigger of triggers) {\n\t\t\t\t\t\ttrigger.addEventListener('click', () => {\n\t\t\t\t\t\t\tsetActiveTab(trigger.dataset.tabsValue);\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('[data-tabs]')) {\n\t\t\t\t\t\tinitTabs(root);\n\t\t\t\t\t}\n\t\t\t\t\tfor (const tabs of root.querySelectorAll('[data-tabs]:not([data-initialized])')) {\n\t\t\t\t\t\tinitTabs(tabs);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // End of IIFE\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var26), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

server/web/templui/components/tagsinput/tagsinput.templ

@@ -0,0 +1,87 @@
+// templui component tagsinput - version: v0.84.0 installed by templui v0.84.0
+package tagsinput
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/badge"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/input"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+)
+
+type Props struct {
+	ID          string
+	Name        string
+	Value       []string
+	Placeholder string
+	Class       string
+	HasError    bool
+	Attributes  templ.Attributes
+	Disabled    bool
+	Readonly    bool
+}
+
+templ TagsInput(p Props) {
+	<div
+		id={ p.ID + "-container" }
+		class={
+			utils.TwMerge(
+				// Base styles
+				"flex items-center flex-wrap gap-2 p-2 rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Focus styles
+				"focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]",
+				// Disabled styles
+				utils.If(p.Disabled, "opacity-50 cursor-not-allowed"),
+				// Width
+				"w-full",
+				// Error/Invalid styles
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+				p.Class,
+			),
+		}
+		data-tags-input
+		data-name={ p.Name }
+		{ p.Attributes... }
+	>
+		<div class="flex items-center flex-wrap gap-2" data-tags-container>
+			for _, tag := range p.Value {
+				@badge.Badge(badge.Props{
+					Attributes: templ.Attributes{"data-tag-chip": ""},
+				}) {
+					<span>{ tag }</span>
+					<button
+						type="button"
+						class="ml-1 text-current hover:text-destructive disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer"
+						disabled?={ p.Disabled }
+						data-tag-remove
+					>
+						<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 pointer-events-none" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+							<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
+						</svg>
+					</button>
+				}
+			}
+		</div>
+		@input.Input(input.Props{
+			ID:          p.ID,
+			Class:       "border-0 shadow-none focus-visible:ring-0 h-auto py-0 px-0 bg-transparent rounded-none min-h-0 disabled:opacity-100 dark:bg-transparent",
+			Type:        input.TypeText,
+			Placeholder: p.Placeholder,
+			Disabled:    p.Disabled,
+			Readonly:    p.Readonly,
+			Attributes: utils.MergeAttributes(
+				templ.Attributes{"data-text-input": ""},
+				p.Attributes,
+			),
+		})
+		<div data-hidden-inputs>
+			for _, tag := range p.Value {
+				<input type="hidden" name={ p.Name } value={ tag }/>
+			}
+		</div>
+	</div>
+}
+
+templ Script() {
+	<script defer src="/assets/js/tagsinput.min.js"></script>
+}

server/web/templui/components/tagsinput/tagsinput_templ.go

@@ -0,0 +1,265 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.865
+// templui component tagsinput - version: v0.84.0 installed by templui v0.84.0
+
+package tagsinput
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/badge"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/components/input"
+	"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
+)
+
+type Props struct {
+	ID          string
+	Name        string
+	Value       []string
+	Placeholder string
+	Class       string
+	HasError    bool
+	Attributes  templ.Attributes
+	Disabled    bool
+	Readonly    bool
+}
+
+func TagsInput(p Props) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		var templ_7745c5c3_Var2 = []any{
+			utils.TwMerge(
+				// Base styles
+				"flex items-center flex-wrap gap-2 p-2 rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] outline-none",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Focus styles
+				"focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]",
+				// Disabled styles
+				utils.If(p.Disabled, "opacity-50 cursor-not-allowed"),
+				// Width
+				"w-full",
+				// Error/Invalid styles
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
+				p.Class,
+			),
+		}
+		templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var2...)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var3 string
+		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID + "-container")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 24, Col: 26}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\" class=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var4 string
+		templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var2).String())
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 1, Col: 0}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" data-tags-input data-name=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var5 string
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 43, Col: 20}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, p.Attributes)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "><div class=\"flex items-center flex-wrap gap-2\" data-tags-container>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		for _, tag := range p.Value {
+			templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+				templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+				templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+				if !templ_7745c5c3_IsBuffer {
+					defer func() {
+						templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+						if templ_7745c5c3_Err == nil {
+							templ_7745c5c3_Err = templ_7745c5c3_BufErr
+						}
+					}()
+				}
+				ctx = templ.InitializeContext(ctx)
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "<span>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				var templ_7745c5c3_Var7 string
+				templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(tag)
+				if templ_7745c5c3_Err != nil {
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 51, Col: 16}
+				}
+				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</span> <button type=\"button\" class=\"ml-1 text-current hover:text-destructive disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer\"")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				if p.Disabled {
+					templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " disabled")
+					if templ_7745c5c3_Err != nil {
+						return templ_7745c5c3_Err
+					}
+				}
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " data-tag-remove><svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-3 w-3 pointer-events-none\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\"></path></svg></button>")
+				if templ_7745c5c3_Err != nil {
+					return templ_7745c5c3_Err
+				}
+				return nil
+			})
+			templ_7745c5c3_Err = badge.Badge(badge.Props{
+				Attributes: templ.Attributes{"data-tag-chip": ""},
+			}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = input.Input(input.Props{
+			ID:          p.ID,
+			Class:       "border-0 shadow-none focus-visible:ring-0 h-auto py-0 px-0 bg-transparent rounded-none min-h-0 disabled:opacity-100 dark:bg-transparent",
+			Type:        input.TypeText,
+			Placeholder: p.Placeholder,
+			Disabled:    p.Disabled,
+			Readonly:    p.Readonly,
+			Attributes: utils.MergeAttributes(
+				templ.Attributes{"data-text-input": ""},
+				p.Attributes,
+			),
+		}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "<div data-hidden-inputs>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		for _, tag := range p.Value {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "<input type=\"hidden\" name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 79, Col: 38}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\" value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(tag)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/tagsinput/tagsinput.templ`, Line: 79, Col: 52}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+func Script() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<script defer src=\"/assets/js/tagsinput.min.js\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

server/web/templui/components/textarea/textarea.templ

@@ -1,4 +1,4 @@
-// templui component textarea - version: main installed by templui v0.71.0
+// templui component textarea - version: v0.84.0 installed by templui v0.84.0
 package textarea
 
 import (
@@ -17,10 +17,11 @@ type Props struct {
 	AutoResize  bool
 	Disabled    bool
 	Required    bool
+	Readonly    bool
+	HasError    bool
 }
 
 templ Textarea(props ...Props) {
-	@Script()
 	{{ var p Props }}
 	if len(props) > 0 {
 		{{ p = props[0] }}
@@ -42,18 +43,31 @@ templ Textarea(props ...Props) {
 		}
 		disabled?={ p.Disabled }
 		required?={ p.Required }
+		readonly?={ p.Readonly }
+		if p.HasError {
+			aria-invalid="true"
+		}
 		if p.AutoResize {
 			data-auto-resize="true"
 		}
 		class={
 			utils.TwMerge(
-				"flex w-full px-3 py-2",
+				// Base styles
-				"min-h-[80px]", // Default min-height (adjust if needed)
+				"flex w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
-				"rounded-md border border-input bg-background text-sm",
+				"min-h-[80px]", // Default min-height
-				"ring-offset-background",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Placeholder
 				"placeholder:text-muted-foreground",
-				"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+				// Focus styles
-				"disabled:cursor-not-allowed disabled:opacity-50",
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Disabled styles
+				"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
 				// Add overflow-hidden only if auto-resizing to prevent scrollbar flicker
 				utils.If(p.AutoResize, "overflow-hidden resize-none"),
 				p.Class,
@@ -63,53 +77,6 @@ templ Textarea(props ...Props) {
 	>{ p.Value }</textarea>
 }
 
-var handle = templ.NewOnceHandle()
-
 templ Script() {
-	@handle.Once() {
+	<script defer src="/assets/js/textarea.min.js"></script>
-		<script defer nonce={ templ.GetNonce(ctx) }>
-			(function() { // IIFE
-				function initTextarea(textarea) {
-					if (textarea.hasAttribute('data-initialized')) return;
-					
-					textarea.setAttribute('data-initialized', 'true');
-					
-					const autoResize = textarea.dataset.autoResize === 'true';
-					if (!autoResize) return;
-					
-					const computedStyle = window.getComputedStyle(textarea);
-					const initialMinHeight = computedStyle.minHeight;
-					
-					function resize() {
-						textarea.style.height = initialMinHeight;
-						textarea.style.height = `${textarea.scrollHeight}px`;
-					}
-					
-					resize();
-					textarea.addEventListener('input', resize);
-				}
-				
-				function initAllComponents(root = document) {
-					if (root instanceof Element && root.matches('textarea[data-textarea]')) {
-						initTextarea(root);
-					}
-					for (const textarea of root.querySelectorAll('textarea[data-textarea]:not([data-initialized])')) {
-						initTextarea(textarea);
-					}
-				}
-				
-				const handleHtmxSwap = (event) => {
-					const target = event.detail.target || event.detail.elt;
-					if (target instanceof Element) {
-						requestAnimationFrame(() => initAllComponents(target));
-					}
-				};
-
-				initAllComponents();
-				document.addEventListener('DOMContentLoaded', () => initAllComponents());
-				document.body.addEventListener('htmx:afterSwap', handleHtmxSwap);
-				document.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);
-			})(); // End of IIFE
-		</script>
-	}
 }

server/web/templui/components/textarea/textarea_templ.go

@@ -1,7 +1,7 @@
 // Code generated by templ - DO NOT EDIT.
 
 // templ: version: v0.3.865
-// templui component textarea - version: main installed by templui v0.71.0
+// templui component textarea - version: v0.84.0 installed by templui v0.84.0
 
 package textarea
 
@@ -26,6 +26,8 @@ type Props struct {
 	AutoResize  bool
 	Disabled    bool
 	Required    bool
+	Readonly    bool
+	HasError    bool
 }
 
 func Textarea(props ...Props) templ.Component {
@@ -49,10 +51,6 @@ func Textarea(props ...Props) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = Script().Render(ctx, templ_7745c5c3_Buffer)
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
 		var p Props
 		if len(props) > 0 {
 			p = props[0]
@@ -62,13 +60,22 @@ func Textarea(props ...Props) templ.Component {
 		}
 		var templ_7745c5c3_Var2 = []any{
 			utils.TwMerge(
-				"flex w-full px-3 py-2",
+				// Base styles
-				"min-h-[80px]", // Default min-height (adjust if needed)
+				"flex w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
-				"rounded-md border border-input bg-background text-sm",
+				"min-h-[80px]", // Default min-height
-				"ring-offset-background",
+				// Dark mode background
+				"dark:bg-input/30",
+				// Selection styles
+				"selection:bg-primary selection:text-primary-foreground",
+				// Placeholder
 				"placeholder:text-muted-foreground",
-				"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+				// Focus styles
-				"disabled:cursor-not-allowed disabled:opacity-50",
+				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+				// Disabled styles
+				"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+				// Error/Invalid styles
+				"aria-invalid:ring-destructive/20 aria-invalid:border-destructive dark:aria-invalid:ring-destructive/40",
+				utils.If(p.HasError, "border-destructive ring-destructive/20 dark:ring-destructive/40"),
 				// Add overflow-hidden only if auto-resizing to prevent scrollbar flicker
 				utils.If(p.AutoResize, "overflow-hidden resize-none"),
 				p.Class,
@@ -85,7 +92,7 @@ func Textarea(props ...Props) templ.Component {
 		var templ_7745c5c3_Var3 string
 		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(p.ID)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 32, Col: 11}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 33, Col: 11}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 		if templ_7745c5c3_Err != nil {
@@ -103,7 +110,7 @@ func Textarea(props ...Props) templ.Component {
 			var templ_7745c5c3_Var4 string
 			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(p.Name)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 35, Col: 16}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 36, Col: 16}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
 			if templ_7745c5c3_Err != nil {
@@ -122,7 +129,7 @@ func Textarea(props ...Props) templ.Component {
 			var templ_7745c5c3_Var5 string
 			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(p.Placeholder)
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 38, Col: 30}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 39, Col: 30}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
 			if templ_7745c5c3_Err != nil {
@@ -141,7 +148,7 @@ func Textarea(props ...Props) templ.Component {
 			var templ_7745c5c3_Var6 string
 			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(strconv.Itoa(p.Rows))
 			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 41, Col: 30}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 42, Col: 30}
 			}
 			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
 			if templ_7745c5c3_Err != nil {
@@ -164,13 +171,25 @@ func Textarea(props ...Props) templ.Component {
 				return templ_7745c5c3_Err
 			}
 		}
-		if p.AutoResize {
+		if p.Readonly {
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " data-auto-resize=\"true\"")
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " readonly")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " class=\"")
+		if p.HasError {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " aria-invalid=\"true\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if p.AutoResize {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " data-auto-resize=\"true\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " class=\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -183,7 +202,7 @@ func Textarea(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -191,20 +210,20 @@ func Textarea(props ...Props) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, ">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, ">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		var templ_7745c5c3_Var8 string
 		templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(p.Value)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 63, Col: 11}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 77, Col: 11}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</textarea>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</textarea>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -212,8 +231,6 @@ func Textarea(props ...Props) templ.Component {
 	})
 }
 
-var handle = templ.NewOnceHandle()
-
 func Script() templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
@@ -235,38 +252,7 @@ func Script() templ.Component {
 			templ_7745c5c3_Var9 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Var10 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<script defer src=\"/assets/js/textarea.min.js\"></script>")
-			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
-			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
-			if !templ_7745c5c3_IsBuffer {
-				defer func() {
-					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
-					if templ_7745c5c3_Err == nil {
-						templ_7745c5c3_Err = templ_7745c5c3_BufErr
-					}
-				}()
-			}
-			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<script defer nonce=\"")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			var templ_7745c5c3_Var11 string
-			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(templ.GetNonce(ctx))
-			if templ_7745c5c3_Err != nil {
-				return templ.Error{Err: templ_7745c5c3_Err, FileName: `server/web/templui/components/textarea/textarea.templ`, Line: 70, Col: 43}
-			}
-			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\">\n\t\t\t(function() { // IIFE\n\t\t\t\tfunction initTextarea(textarea) {\n\t\t\t\t\tif (textarea.hasAttribute('data-initialized')) return;\n\t\t\t\t\t\n\t\t\t\t\ttextarea.setAttribute('data-initialized', 'true');\n\t\t\t\t\t\n\t\t\t\t\tconst autoResize = textarea.dataset.autoResize === 'true';\n\t\t\t\t\tif (!autoResize) return;\n\t\t\t\t\t\n\t\t\t\t\tconst computedStyle = window.getComputedStyle(textarea);\n\t\t\t\t\tconst initialMinHeight = computedStyle.minHeight;\n\t\t\t\t\t\n\t\t\t\t\tfunction resize() {\n\t\t\t\t\t\ttextarea.style.height = initialMinHeight;\n\t\t\t\t\t\ttextarea.style.height = `${textarea.scrollHeight}px`;\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\tresize();\n\t\t\t\t\ttextarea.addEventListener('input', resize);\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\tfunction initAllComponents(root = document) {\n\t\t\t\t\tif (root instanceof Element && root.matches('textarea[data-textarea]')) {\n\t\t\t\t\t\tinitTextarea(root);\n\t\t\t\t\t}\n\t\t\t\t\tfor (const textarea of root.querySelectorAll('textarea[data-textarea]:not([data-initialized])')) {\n\t\t\t\t\t\tinitTextarea(textarea);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\tconst handleHtmxSwap = (event) => {\n\t\t\t\t\tconst target = event.detail.target || event.detail.elt;\n\t\t\t\t\tif (target instanceof Element) {\n\t\t\t\t\t\trequestAnimationFrame(() => initAllComponents(target));\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\tinitAllComponents();\n\t\t\t\tdocument.addEventListener('DOMContentLoaded', () => initAllComponents());\n\t\t\t\tdocument.body.addEventListener('htmx:afterSwap', handleHtmxSwap);\n\t\t\t\tdocument.body.addEventListener('htmx:oobAfterSwap', handleHtmxSwap);\n\t\t\t})(); // End of IIFE\n\t\t</script>")
-			if templ_7745c5c3_Err != nil {
-				return templ_7745c5c3_Err
-			}
-			return nil
-		})
-		templ_7745c5c3_Err = handle.Once().Render(templ.WithChildren(ctx, templ_7745c5c3_Var10), templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}