diff --git a/UI/sigpro-ui.js b/UI/sigpro-ui.js index 11727e2..7a15ad7 100644 --- a/UI/sigpro-ui.js +++ b/UI/sigpro-ui.js @@ -133,16 +133,16 @@ export const UI = ($, defaultLang = "es") => { /** BUTTON */ ui.Button = (props, children) => { - const { badge, badgeClass, tooltip, icon, $loading, ...rest } = props; + const { badge, badgeClass, tooltip, icon, loading, ...rest } = props; const btn = $.html( "button", { ...rest, - class: joinClass("btn", props.$class || props.class), - $disabled: () => val($loading) || val(props.$disabled) || val(props.disabled), + class: joinClass("btn", props.class || props.class), + disabled: () => val(loading) || val(props.disabled) || val(props.disabled), }, [ - () => (val($loading) ? $.html("span", { class: "loading loading-spinner" }) : null), + () => (val(loading) ? $.html("span", { class: "loading loading-spinner" }) : null), icon ? $.html("span", { class: "mr-1" }, icon) : null, children, ], @@ -159,8 +159,7 @@ export const UI = ($, defaultLang = "es") => { /** INPUT */ ui.Input = (props) => { - const { label, tip, $value, $error, isSearch, icon, type = "text", ...rest } = props; - + const { label, tip, value, error, isSearch, icon, type = "text", ...rest } = props; const isPassword = type === "password"; const visible = $(false); @@ -176,13 +175,10 @@ export const UI = ($, defaultLang = "es") => { ...rest, type: () => (isPassword ? (visible() ? "text" : "password") : type), placeholder: props.placeholder || label || (isSearch ? tt("search")() : " "), - class: joinClass("grow order-2 focus:outline-none", props.$class || props.class), - $value: $value, - oninput: (e) => { - $value?.(e.target.value); - props.oninput?.(e); - }, - $disabled: () => val(props.$disabled) || val(props.disabled), + class: joinClass("grow order-2 focus:outline-none", props.class), + value: value, + oninput: (e) => props.oninput?.(e), + disabled: () => val(props.disabled), }); const leftIcon = icon ? icon : iconsByType[type] ? $.html("img", { src: iconsByType[type], class: "w-5 h-5 opacity-50", alt: type }) : null; @@ -190,7 +186,7 @@ export const UI = ($, defaultLang = "es") => { return $.html( "label", { - class: () => joinClass("input input-bordered floating-label flex items-center gap-2 w-full relative", val($error) ? "input-error" : ""), + class: () => joinClass("input input-bordered floating-label flex items-center gap-2 w-full relative", val(error) ? "input-error" : ""), }, [ leftIcon ? $.html("div", { class: "order-1 shrink-0" }, leftIcon) : null, @@ -198,47 +194,44 @@ export const UI = ($, defaultLang = "es") => { inputEl, isPassword ? $.html( - "button", - { - type: "button", - class: "order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100", - onclick: (e) => { - e.preventDefault(); - visible(!visible()); - }, + "button", + { + type: "button", + class: "order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100", + onclick: (e) => { + e.preventDefault(); + visible(!visible()); }, - () => - $.html("img", { - class: "w-5 h-5", - src: visible() ? iconShow : iconHide, - }), - ) + }, + () => + $.html("img", { + class: "w-5 h-5", + src: visible() ? iconShow : iconHide, + }), + ) : null, - tip ? $.html( - "div", - { class: "tooltip tooltip-left order-4", "data-tip": tip }, - $.html("span", { class: "badge badge-ghost badge-xs cursor-help" }, "?"), - ) + "div", + { class: "tooltip tooltip-left order-4", "data-tip": tip }, + $.html("span", { class: "badge badge-ghost badge-xs cursor-help" }, "?"), + ) : null, - - () => (val($error) ? $.html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val($error)) : null), + () => (val(error) ? $.html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val(error)) : null), ], ); }; /** SELECT */ ui.Select = (props) => { - const { label, options, $value, ...rest } = props; + const { label, options, value, ...rest } = props; const selectEl = $.html( "select", { ...rest, - class: joinClass("select select-bordered w-full", props.$class || props.class), - $value: $value, - onchange: (e) => $value?.(e.target.value), + class: joinClass("select select-bordered w-full", props.class || props.class), + value: value }, $.for( () => val(options) || [], @@ -247,7 +240,7 @@ export const UI = ($, defaultLang = "es") => { "option", { value: opt.value, - $selected: () => String(val($value)) === String(opt.value), + $selected: () => String(val(value)) === String(opt.value), }, opt.label, ), @@ -262,9 +255,9 @@ export const UI = ($, defaultLang = "es") => { /** AUTOCOMPLETE */ ui.Autocomplete = (props) => { - const { options = [], $value, onSelect, label, placeholder, ...rest } = props; + const { options = [], value, onSelect, label, placeholder, ...rest } = props; - const query = $(val($value) || ""); + const query = $(val(value) || ""); const isOpen = $(false); const cursor = $(-1); @@ -279,7 +272,7 @@ export const UI = ($, defaultLang = "es") => { const labelStr = typeof opt === "string" ? opt : opt.label; query(labelStr); - if (typeof $value === "function") $value(valStr); + if (typeof value === "function") value(valStr); onSelect?.(opt); isOpen(false); @@ -307,14 +300,14 @@ export const UI = ($, defaultLang = "es") => { ui.Input({ label, placeholder: placeholder || tt("search")(), - $value: query, + value: query, onfocus: () => isOpen(true), onblur: () => setTimeout(() => isOpen(false), 150), onkeydown: nav, oninput: (e) => { const v = e.target.value; query(v); - if (typeof $value === "function") $value(v); + if (typeof value === "function") value(v); isOpen(true); cursor(-1); }, @@ -351,7 +344,7 @@ export const UI = ($, defaultLang = "es") => { /** DATEPICKER */ ui.Datepicker = (props) => { - const { $value, range, label, placeholder, ...rest } = props; + const { value, range, label, placeholder, ...rest } = props; const isOpen = $(false); const internalDate = $(new Date()); @@ -370,26 +363,26 @@ export const UI = ($, defaultLang = "es") => { const selectDate = (date) => { const dateStr = formatDate(date); - const current = val($value); + const current = val(value); if (isRangeMode()) { if (!current?.start || (current.start && current.end)) { - if (typeof $value === "function") $value({ start: dateStr, end: null }); + if (typeof value === "function") value({ start: dateStr, end: null }); } else { const start = current.start; - if (typeof $value === "function") { - $value(dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }); + if (typeof value === "function") { + value(dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }); } isOpen(false); } } else { - if (typeof $value === "function") $value(dateStr); + if (typeof value === "function") value(dateStr); isOpen(false); } }; const displayValue = $(() => { - const v = val($value); + const v = val(value); if (!v) return ""; if (typeof v === "string") return v; if (v.start && v.end) return `${v.start} - ${v.end}`; @@ -411,7 +404,7 @@ export const UI = ($, defaultLang = "es") => { ui.Input({ label, placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."), - $value: displayValue, + value: displayValue, readonly: true, icon: $.html("img", { src: iconCalendar, class: "opacity-40" }), onclick: (e) => { @@ -482,7 +475,7 @@ export const UI = ($, defaultLang = "es") => { { type: "button", class: () => { - const v = val($value); + const v = val(value); const h = hoverDate(); const isStart = typeof v === "string" ? v === dStr : v?.start === dStr; const isEnd = v?.end === dStr; @@ -525,7 +518,7 @@ export const UI = ($, defaultLang = "es") => { /** COLORPICKER */ ui.Colorpicker = (props) => { - const { $value, label, ...rest } = props; + const { value, label, ...rest } = props; const isOpen = $(false); const palette = [ @@ -539,7 +532,7 @@ export const UI = ($, defaultLang = "es") => { ...["#2e1065", "#4c1d95", "#6d28d9", "#7c3aed", "#8b5cf6", "#a855f7", "#d946ef", "#fae8ff"], ]; - const getColor = () => val($value) || "#000000"; + const getColor = () => val(value) || "#000000"; return $.html("div", { class: "relative w-fit" }, [ $.html( @@ -583,7 +576,7 @@ export const UI = ($, defaultLang = "es") => { ${active ? "ring-2 ring-offset-1 ring-primary z-10 scale-110" : ""}`; }, onclick: () => { - $value(c); + value(c); isOpen(false); }, }), @@ -604,13 +597,12 @@ export const UI = ($, defaultLang = "es") => { /** CHECKBOX */ ui.CheckBox = (props) => { - const { $value, tooltip, toggle, ...rest } = props; + const { value, tooltip, toggle, ...rest } = props; const checkEl = $.html("input", { ...rest, type: "checkbox", class: () => (val(toggle) ? "toggle" : "checkbox"), - $checked: $value, - onchange: (e) => $value?.(e.target.checked), + checked: value }); const layout = $.html("label", { class: "label cursor-pointer justify-start gap-3" }, [ @@ -623,15 +615,15 @@ export const UI = ($, defaultLang = "es") => { /** RADIO */ ui.Radio = (props) => { - const { label, tooltip, $value, value, ...rest } = props; + const { label, tooltip, value, ...rest } = props; const radioEl = $.html("input", { ...rest, type: "radio", - class: joinClass("radio", props.$class || props.class), - $checked: () => val($value) === value, - $disabled: () => val(props.$disabled) || val(props.disabled), - onclick: () => typeof $value === "function" && $value(value), + class: joinClass("radio", props.class || props.class), + checked: () => val(value) === value, + disabled: () => val(props.disabled) || val(props.disabled), + onclick: () => typeof value === "function" && value(value), }); if (!label && !tooltip) return radioEl; @@ -646,30 +638,32 @@ export const UI = ($, defaultLang = "es") => { /** RANGE */ ui.Range = (props) => { - const { label, tooltip, $value, ...rest } = props; + const { label, tooltip, value, ...rest } = props; const rangeEl = $.html("input", { ...rest, type: "range", - class: joinClass("range", props.$class || props.class), - $value: $value, - $disabled: () => val(props.$disabled) || val(props.disabled), - oninput: (e) => typeof $value === "function" && $value(e.target.value), + class: joinClass("range", props.class), + value: value, + disabled: () => val(props.disabled) }); if (!label && !tooltip) return rangeEl; - const layout = $.html("div", { class: "flex flex-col gap-2" }, [label ? $.html("span", { class: "label-text" }, label) : null, rangeEl]); + const layout = $.html("div", { class: "flex flex-col gap-2" }, [ + label ? $.html("span", { class: "label-text" }, label) : null, + rangeEl + ]); return tooltip ? $.html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; }; /** MODAL */ ui.Modal = (props, children) => { - const { title, buttons, $open, ...rest } = props; - const close = () => $open(false); + const { title, buttons, open, ...rest } = props; + const close = () => open(false); - return $.if($open, () => + return $.if(open, () => $.html("dialog", { ...rest, class: "modal modal-open" }, [ $.html("div", { class: "modal-box" }, [ title ? $.html("h3", { class: "text-lg font-bold mb-4" }, title) : null, @@ -756,7 +750,7 @@ export const UI = ($, defaultLang = "es") => { "div", { ...rest, - class: () => `dropdown ${val(props.$class) || props.class || ""}`, + class: () => `dropdown ${val(props.class) || props.class || ""}`, }, [ $.html( @@ -782,20 +776,19 @@ export const UI = ($, defaultLang = "es") => { /** ACCORDION */ ui.Accordion = (props, children) => { - const { title, name, $open, open, ...rest } = props; + const { title, name, open, ...rest } = props; return $.html( "div", { ...rest, - class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.$class || props.class), + class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class || props.class), }, [ $.html("input", { type: name ? "radio" : "checkbox", name: name, - $checked: () => val($open) || val(open), - onchange: (e) => typeof $open === "function" && $open(e.target.checked), + checked: open }), $.html("div", { class: "collapse-title text-xl font-medium" }, title), $.html("div", { class: "collapse-content" }, children), @@ -813,7 +806,7 @@ export const UI = ($, defaultLang = "es") => { "div", { role: "tablist", - class: joinClass("tabs tabs-box", props.$class || props.class), + class: joinClass("tabs tabs-box", props.class || props.class), }, $.for( itemsSignal, @@ -841,15 +834,15 @@ export const UI = ($, defaultLang = "es") => { }; /** BADGE */ - ui.Badge = (props, children) => $.html("span", { ...props, class: joinClass("badge", props.$class || props.class) }, children); + ui.Badge = (props, children) => $.html("span", { ...props, class: joinClass("badge", props.class || props.class) }, children); /** TOOLTIP */ ui.Tooltip = (props, children) => - $.html("div", { ...props, class: joinClass("tooltip", props.$class || props.class), "data-tip": props.tip }, children); + $.html("div", { ...props, class: joinClass("tooltip", props.class || props.class), "data-tip": props.tip }, children); /** NAVBAR */ ui.Navbar = (props, children) => - $.html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.$class || props.class) }, children); + $.html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.class || props.class) }, children); /** MENU */ ui.Menu = (props) => { @@ -860,32 +853,32 @@ export const UI = ($, defaultLang = "es") => { $.html("li", {}, [ it.children ? $.html("details", { open: it.open }, [ - $.html("summary", {}, [it.icon && $.html("span", { class: "mr-2" }, it.icon), it.label]), - $.html("ul", {}, renderItems(it.children)), - ]) + $.html("summary", {}, [it.icon && $.html("span", { class: "mr-2" }, it.icon), it.label]), + $.html("ul", {}, renderItems(it.children)), + ]) : $.html("a", { class: () => (val(it.active) ? "active" : ""), onclick: it.onclick }, [ - it.icon && $.html("span", { class: "mr-2" }, it.icon), - it.label, - ]), + it.icon && $.html("span", { class: "mr-2" }, it.icon), + it.label, + ]), ]), (it, i) => it.label || i, ); - return $.html("ul", { ...props, class: joinClass("menu bg-base-200 rounded-box", props.$class || props.class) }, renderItems(props.items)); + return $.html("ul", { ...props, class: joinClass("menu bg-base-200 rounded-box", props.class || props.class) }, renderItems(props.items)); }; /** DRAWER */ ui.Drawer = (props) => - $.html("div", { class: joinClass("drawer", props.$class || props.class) }, [ + $.html("div", { class: joinClass("drawer", props.class || props.class) }, [ $.html("input", { id: props.id, type: "checkbox", class: "drawer-toggle", - $checked: props.$open, + checked: props.open, }), $.html("div", { class: "drawer-content" }, props.content), $.html("div", { class: "drawer-side" }, [ - $.html("label", { for: props.id, class: "drawer-overlay", onclick: () => props.$open?.(false) }), + $.html("label", { for: props.id, class: "drawer-overlay", onclick: () => props.open?.(false) }), $.html("div", { class: "min-h-full bg-base-200 w-80" }, props.side), ]), ]); @@ -896,7 +889,7 @@ export const UI = ($, defaultLang = "es") => { "fieldset", { ...props, - class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.$class || props.class), + class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.class || props.class), }, [ () => { @@ -924,24 +917,23 @@ export const UI = ($, defaultLang = "es") => { }; /** STACK */ - ui.Stack = (props, children) => $.html("div", { ...props, class: joinClass("stack", props.$class || props.class) }, children); + ui.Stack = (props, children) => $.html("div", { ...props, class: joinClass("stack", props.class || props.class) }, children); /** STAT */ ui.Stat = (props) => - $.html("div", { ...props, class: joinClass("stat", props.$class || props.class) }, [ + $.html("div", { ...props, class: joinClass("stat", props.class || props.class) }, [ props.icon && $.html("div", { class: "stat-figure text-secondary" }, props.icon), props.label && $.html("div", { class: "stat-title" }, props.label), - $.html("div", { class: "stat-value" }, () => val(props.$value) ?? props.value), + $.html("div", { class: "stat-value" }, () => val(props.value) ?? props.value), props.desc && $.html("div", { class: "stat-desc" }, props.desc), ]); /** SWAP */ ui.Swap = (props) => - $.html("label", { class: joinClass("swap", props.$class || props.class) }, [ + $.html("label", { class: joinClass("swap", props.class || props.class) }, [ $.html("input", { type: "checkbox", - $checked: props.$value, - onchange: (e) => props.$value?.(e.target.checked), + checked: props.value }), $.html("div", { class: "swap-on" }, props.on), $.html("div", { class: "swap-off" }, props.off), @@ -949,37 +941,36 @@ export const UI = ($, defaultLang = "es") => { /** INDICATOR */ ui.Indicator = (props, children) => - $.html("div", { class: joinClass("indicator", props.$class || props.class) }, [ + $.html("div", { class: joinClass("indicator", props.class || props.class) }, [ children, $.html("span", { class: joinClass("indicator-item badge", props.badgeClass) }, props.badge), ]); /** RATING */ ui.Rating = (props) => { - const { $value, count = 5, name = `rating-${Math.random().toString(36).slice(2, 7)}`, mask = "mask-star", readonly = false, ...rest } = props; + const { value, count = 5, mask = "mask-star", readonly = false, ...rest } = props; + const ratingGroup = `rating-${Math.random().toString(36).slice(2, 7)}`; - return $.html( - "div", - { - ...rest, - class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}`, - }, + return $.html("div", { + ...rest, + class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}`, + }, Array.from({ length: val(count) }, (_, i) => { - const ratingValue = i + 1; + const starValue = i + 1; + return $.html("input", { type: "radio", - name: name, + name: ratingGroup, class: `mask ${mask}`, - "aria-label": `${ratingValue} star`, - checked: () => Math.round(val($value)) === ratingValue, + "aria-label": `${starValue} star`, + checked: () => Math.round(val(value)) === starValue, onchange: () => { - if (!val(readonly) && typeof $value === "function") { - $value(ratingValue); + if (!val(readonly) && typeof value === "function") { + value(starValue); } }, }); - }), - ); + })); }; /** ALERT */ @@ -1180,8 +1171,13 @@ export const UI = ($, defaultLang = "es") => { ui.tt = tt; Object.keys(ui).forEach((key) => { - window[key] = ui[key]; $[key] = ui[key]; + Object.defineProperty(window, key, { + value: ui[key], + writable: false, + configurable: true, + enumerable: true + }); }); return ui; diff --git a/UI/sigpro-ui.min.js b/UI/sigpro-ui.min.js index e041a43..576adba 100644 --- a/UI/sigpro-ui.min.js +++ b/UI/sigpro-ui.min.js @@ -1 +1 @@ -export const UI=(t,e="es")=>{const l={},a={es:{close:"Cerrar",confirm:"Confirmar",cancel:"Cancelar",search:"Buscar...",loading:"Cargando..."},en:{close:"Close",confirm:"Confirm",cancel:"Cancel",search:"Search...",loading:"Loading..."}},s=t(e);l.SetLocale=t=>s(t);const n=t=>()=>a[s()][t]||t,A=t=>"function"==typeof t?t():t,o=(t,e)=>"function"==typeof e?()=>`${t} ${e()||""}`.trim():`${t} ${e||""}`.trim(),c="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC",i="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC",r="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg==",d="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC",m="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII=";return l.Request=(e,l=null,a={})=>{const s=t(null),n=t(!1),o=t(null),c=t(!1);let i=null;const r=async(t=null)=>{const r=A(e);if(r){i&&i.abort(),i=new AbortController,n(!0),o(null),c(!1);try{const e=t||l,A=await fetch(r,{method:a.method||(e?"POST":"GET"),headers:{"Content-Type":"application/json",...a.headers},body:e?JSON.stringify(e):null,signal:i.signal,...a});if(!A.ok)throw new Error(`HTTP ${A.status}`);let o=await A.json();"function"==typeof a.transform&&(o=a.transform(o)),s(o),c(!0)}catch(t){"AbortError"!==t.name&&o(t.message)}finally{n(!1)}}};return t((()=>(r(),()=>i?.abort()))),{data:s,loading:n,error:o,success:c,reload:t=>r(t)}},l.Response=(e,a)=>t.html("div",{class:"res-container"},[t.if(e.loading,t.html("div",{class:"flex justify-center p-4"},t.html("span",{class:"loading loading-dots text-primary"}))),t.if(e.error,(()=>t.html("div",{role:"alert",class:"alert alert-error"},[t.html("span",{},e.error()),l.Button({class:"btn-xs btn-ghost border-current",onclick:()=>e.reload()},"Retry")]))),t.if(e.success,(()=>{const t=e.data();return null!==t?a(t):null}))]),l.Button=(e,l)=>{const{badge:a,badgeClass:s,tooltip:n,icon:c,$loading:i,...r}=e;let d=t.html("button",{...r,class:o("btn",e.$class||e.class),$disabled:()=>A(i)||A(e.$disabled)||A(e.disabled)},[()=>A(i)?t.html("span",{class:"loading loading-spinner"}):null,c?t.html("span",{class:"mr-1"},c):null,l]);return a&&(d=t.html("div",{class:"indicator"},[t.html("span",{class:o("indicator-item badge",s||"badge-secondary")},a),d])),n?t.html("div",{class:"tooltip","data-tip":n},d):d},l.Input=e=>{const{label:l,tip:a,$value:s,$error:i,isSearch:r,icon:d,type:m="text",...h}=e,u="password"===m,g=t(!1),b={text:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMRJREFUOI3t0bFKAmAUBeAPURD1HQwUTKPJEmzQoSWQcKpVfIuWdvU9WnqNhsYWBx0a2lvLSMKGbvQ7SO564HA497/3cu/92SPFAS5QDN9CftviDhZYYRpNPtH/rzATOsQT6jhCFzmc4DTJL6AX067hPiimuAr95RglzMJ/4AyyUXSMw3iEauhN6C0eUEMFAyzTFZ7xiOvwL3jbsPYSr3hPg3dB/o43SVYY+TnsPPwXztMG5SDr39dGM8kr4RKNDdPtJL4BNXEmsdKC+S4AAAAASUVORK5CYII=",password:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII=",date:c,number:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg==",email:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"},p=t.html("input",{...h,type:()=>u?g()?"text":"password":m,placeholder:e.placeholder||l||(r?n("search")():" "),class:o("grow order-2 focus:outline-none",e.$class||e.class),$value:s,oninput:t=>{s?.(t.target.value),e.oninput?.(t)},$disabled:()=>A(e.$disabled)||A(e.disabled)}),f=d||(b[m]?t.html("img",{src:b[m],class:"w-5 h-5 opacity-50",alt:m}):null);return t.html("label",{class:()=>o("input input-bordered floating-label flex items-center gap-2 w-full relative",A(i)?"input-error":"")},[f?t.html("div",{class:"order-1 shrink-0"},f):null,l?t.html("span",{class:"text-base-content/60 order-0"},l):null,p,u?t.html("button",{type:"button",class:"order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100",onclick:t=>{t.preventDefault(),g(!g())}},(()=>t.html("img",{class:"w-5 h-5",src:g()?"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg==":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"}))):null,a?t.html("div",{class:"tooltip tooltip-left order-4","data-tip":a},t.html("span",{class:"badge badge-ghost badge-xs cursor-help"},"?")):null,()=>A(i)?t.html("span",{class:"text-error text-[10px] absolute -bottom-5 left-2"},A(i)):null])},l.Select=e=>{const{label:l,options:a,$value:s,...n}=e,c=t.html("select",{...n,class:o("select select-bordered w-full",e.$class||e.class),$value:s,onchange:t=>s?.(t.target.value)},t.for((()=>A(a)||[]),(e=>t.html("option",{value:e.value,$selected:()=>String(A(s))===String(e.value)},e.label)),(t=>t.value)));return l?t.html("label",{class:"fieldset-label flex flex-col gap-1"},[t.html("span",{},l),c]):c},l.Autocomplete=e=>{const{options:a=[],$value:s,onSelect:o,label:c,placeholder:i,...r}=e,d=t(A(s)||""),m=t(!1),h=t(-1),u=t((()=>{const t=d().toLowerCase(),e=A(a)||[];return t?e.filter((e=>("string"==typeof e?e:e.label).toLowerCase().includes(t))):e})),g=t=>{const e="string"==typeof t?t:t.value,l="string"==typeof t?t:t.label;d(l),"function"==typeof s&&s(e),o?.(t),m(!1),h(-1)};return t.html("div",{class:"relative w-full"},[l.Input({label:c,placeholder:i||n("search")(),$value:d,onfocus:()=>m(!0),onblur:()=>setTimeout((()=>m(!1)),150),onkeydown:t=>{const e=u();"ArrowDown"===t.key?(t.preventDefault(),m(!0),h(Math.min(h()+1,e.length-1))):"ArrowUp"===t.key?(t.preventDefault(),h(Math.max(h()-1,0))):"Enter"===t.key&&h()>=0?(t.preventDefault(),g(e[h()])):"Escape"===t.key&&m(!1)},oninput:t=>{const e=t.target.value;d(e),"function"==typeof s&&s(e),m(!0),h(-1)},...r}),t.html("ul",{class:"absolute left-0 w-full menu bg-base-100 rounded-box mt-1 p-2 shadow-xl max-h-60 overflow-y-auto border border-base-300 z-50",style:()=>m()&&u().length?"display:block":"display:none"},[t.for(u,((e,l)=>t.html("li",{},[t.html("a",{class:()=>"block w-full "+(h()===l?"active bg-primary text-primary-content":""),onclick:()=>g(e),onmouseenter:()=>h(l)},"string"==typeof e?e:e.label)])),((t,e)=>("string"==typeof t?t:t.value)+e)),()=>u().length?null:t.html("li",{class:"p-2 text-center opacity-50"},"No results")])])},l.Datepicker=e=>{const{$value:a,range:s,label:n,placeholder:o,...i}=e,r=t(!1),d=t(new Date),m=t(null),h=()=>!0===A(s),u=new Date,g=`${u.getFullYear()}-${String(u.getMonth()+1).padStart(2,"0")}-${String(u.getDate()).padStart(2,"0")}`,b=t=>`${t.getFullYear()}-${String(t.getMonth()+1).padStart(2,"0")}-${String(t.getDate()).padStart(2,"0")}`,p=t=>{const e=b(t),l=A(a);if(h())if(!l?.start||l.start&&l.end)"function"==typeof a&&a({start:e,end:null});else{const t=l.start;"function"==typeof a&&a(e{const t=A(a);return t?"string"==typeof t?t:t.start&&t.end?`${t.start} - ${t.end}`:t.start?`${t.start}...`:"":""})),v=t=>{const e=d();d(new Date(e.getFullYear(),e.getMonth()+t,1))},B=t=>{const e=d();d(new Date(e.getFullYear()+t,e.getMonth(),1))};return t.html("div",{class:"relative w-full"},[l.Input({label:n,placeholder:o||(h()?"Seleccionar rango...":"Seleccionar fecha..."),$value:f,readonly:!0,icon:t.html("img",{src:c,class:"opacity-40"}),onclick:t=>{t.stopPropagation(),r(!r())},...i}),t.if(r,(()=>t.html("div",{class:"absolute left-0 mt-2 p-4 bg-base-100 border border-base-300 shadow-2xl rounded-box z-[100] w-80 select-none",onclick:t=>t.stopPropagation()},[t.html("div",{class:"flex justify-between items-center mb-4 gap-1"},[t.html("div",{class:"flex gap-0.5"},[t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>B(-1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg==",class:"opacity-40"})),t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>v(-1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg==",class:"opacity-40"}))]),t.html("span",{class:"font-bold uppercase flex-1 text-center"},[()=>d().toLocaleString("es-ES",{month:"short",year:"numeric"})]),t.html("div",{class:"flex gap-0.5"},[t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>v(1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg==",class:"opacity-40"})),t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>B(1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII=",class:"opacity-40"}))])]),t.html("div",{class:"grid grid-cols-7 gap-1",onmouseleave:()=>m(null)},[...["L","M","X","J","V","S","D"].map((e=>t.html("div",{class:"text-[10px] opacity-40 font-bold text-center"},e))),()=>{const e=d(),l=e.getFullYear(),s=e.getMonth(),n=new Date(l,s,1).getDay(),o=0===n?6:n-1,c=new Date(l,s+1,0).getDate(),i=[];for(let e=0;e{const t=A(a),e=m(),l="string"==typeof t?t===o:t?.start===o,s=t?.end===o;let n=!1;if(h()&&t?.start){const l=t.start;!t.end&&e?n=o>l&&o<=e||o=e:t.end&&(n=o>l&&o{h()&&m(o)},onclick:()=>p(n)},[e.toString()]))}return i}])]))),t.if(r,(()=>t.html("div",{class:"fixed inset-0 z-[90]",onclick:()=>r(!1)})))])},l.Colorpicker=e=>{const{$value:l,label:a,...s}=e,n=t(!1),o=["#000","#1A1A1A","#333","#4D4D4D","#666","#808080","#B3B3B3","#FFF","#450a0a","#7f1d1d","#991b1b","#b91c1c","#dc2626","#ef4444","#f87171","#fca5a5","#431407","#7c2d12","#9a3412","#c2410c","#ea580c","#f97316","#fb923c","#ffedd5","#713f12","#a16207","#ca8a04","#eab308","#facc15","#fde047","#fef08a","#fff9c4","#064e3b","#065f46","#059669","#10b981","#34d399","#4ade80","#84cc16","#d9f99d","#082f49","#075985","#0284c7","#0ea5e9","#38bdf8","#7dd3fc","#22d3ee","#cffafe","#1e1b4b","#312e81","#4338ca","#4f46e5","#6366f1","#818cf8","#a5b4fc","#e0e7ff","#2e1065","#4c1d95","#6d28d9","#7c3aed","#8b5cf6","#a855f7","#d946ef","#fae8ff"],c=()=>A(l)||"#000000";return t.html("div",{class:"relative w-fit"},[t.html("button",{type:"button",class:"btn px-3 bg-base-100 border-base-300 hover:border-primary/50 flex items-center gap-2 shadow-sm font-normal normal-case",onclick:t=>{t.stopPropagation(),n(!n())},...s},[t.html("div",{class:"size-5 rounded-sm shadow-inner border border-black/10 shrink-0",style:()=>`background-color: ${c()}`}),a?t.html("span",{class:"opacity-80"},a):null]),t.if(n,(()=>t.html("div",{class:"absolute left-0 mt-2 p-3 bg-base-100 border border-base-300 shadow-2xl rounded-box z-[110] w-64 select-none",onclick:t=>t.stopPropagation()},[t.html("div",{class:"grid grid-cols-8 gap-1"},o.map((e=>t.html("button",{type:"button",style:`background-color: ${e}`,class:()=>"size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 \n "+(c().toLowerCase()===e.toLowerCase()?"ring-2 ring-offset-1 ring-primary z-10 scale-110":""),onclick:()=>{l(e),n(!1)}}))))]))),t.if(n,(()=>t.html("div",{class:"fixed inset-0 z-[100]",onclick:()=>n(!1)})))])},l.CheckBox=e=>{const{$value:l,tooltip:a,toggle:s,...n}=e,o=t.html("input",{...n,type:"checkbox",class:()=>A(s)?"toggle":"checkbox",$checked:l,onchange:t=>l?.(t.target.checked)}),c=t.html("label",{class:"label cursor-pointer justify-start gap-3"},[o,e.label?t.html("span",{class:"label-text"},e.label):null]);return a?t.html("div",{class:"tooltip","data-tip":a},c):c},l.Radio=e=>{const{label:l,tooltip:a,$value:s,value:n,...c}=e,i=t.html("input",{...c,type:"radio",class:o("radio",e.$class||e.class),$checked:()=>A(s)===n,$disabled:()=>A(e.$disabled)||A(e.disabled),onclick:()=>"function"==typeof s&&s(n)});if(!l&&!a)return i;const r=t.html("label",{class:"label cursor-pointer justify-start gap-3"},[i,l?t.html("span",{class:"label-text"},l):null]);return a?t.html("div",{class:"tooltip","data-tip":a},r):r},l.Range=e=>{const{label:l,tooltip:a,$value:s,...n}=e,c=t.html("input",{...n,type:"range",class:o("range",e.$class||e.class),$value:s,$disabled:()=>A(e.$disabled)||A(e.disabled),oninput:t=>"function"==typeof s&&s(t.target.value)});if(!l&&!a)return c;const i=t.html("div",{class:"flex flex-col gap-2"},[l?t.html("span",{class:"label-text"},l):null,c]);return a?t.html("div",{class:"tooltip","data-tip":a},i):i},l.Modal=(e,a)=>{const{title:s,buttons:A,$open:o,...c}=e,i=()=>o(!1);return t.if(o,(()=>t.html("dialog",{...c,class:"modal modal-open"},[t.html("div",{class:"modal-box"},[s?t.html("h3",{class:"text-lg font-bold mb-4"},s):null,"function"==typeof a?a():a,t.html("div",{class:"modal-action flex gap-2"},[...(Array.isArray(A)?A:[A]).filter(Boolean),l.Button({onclick:i},n("close")())])]),t.html("form",{method:"dialog",class:"modal-backdrop",onclick:t=>(t.preventDefault(),i())},[t.html("button",{},"close")])])))},l.Grid=e=>{const{data:l,options:a,class:s}=e;let n=null;const o=t.html("div",{style:"height: 100%; width: 100%;",class:s}),c=new MutationObserver((()=>{n&&n.setGridOption("theme",getTheme(isDark()))}));c.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]}),o._cleanups.add((()=>c.disconnect()));const i=t.watch((()=>{const t=isDark(),e=getTheme(t),s=A(l)||[];n?n.setGridOption("theme",e):n=createGrid(o,{...A(a)||{},theme:e,rowData:s})}));o._cleanups.add(i);const r=t.watch((()=>{const t=A(l);n&&Array.isArray(t)&&n.setGridOption("rowData",t)}));return o._cleanups.add(r),o._cleanups.add((()=>{n&&(n.destroy(),n=null)})),o},l.Dropdown=(e,l)=>{const{label:a,icon:s,...n}=e;return t.html("div",{...n,class:()=>`dropdown ${A(e.$class)||e.class||""}`},[t.html("div",{tabindex:0,role:"button",class:"btn m-1 flex items-center gap-2"},[s?"function"==typeof s?s():s:null,a?"function"==typeof a?a():a:null]),t.html("ul",{tabindex:0,class:"dropdown-content z-[50] menu p-2 shadow bg-base-100 rounded-box min-w-max border border-base-300"},["function"==typeof l?l():l])])},l.Accordion=(e,l)=>{const{title:a,name:s,$open:n,open:c,...i}=e;return t.html("div",{...i,class:o("collapse collapse-arrow bg-base-200 mb-2",e.$class||e.class)},[t.html("input",{type:s?"radio":"checkbox",name:s,$checked:()=>A(n)||A(c),onchange:t=>"function"==typeof n&&n(t.target.checked)}),t.html("div",{class:"collapse-title text-xl font-medium"},a),t.html("div",{class:"collapse-content"},l)])},l.Tabs=e=>{const{items:l,...a}=e,s="function"==typeof l?l:()=>l||[];return t.html("div",{...a,class:"flex flex-col gap-4 w-full"},[t.html("div",{role:"tablist",class:o("tabs tabs-box",e.$class||e.class)},t.for(s,(e=>t.html("a",{role:"tab",class:()=>o("tab",A(e.active)&&"tab-active",A(e.disabled),e.tip),"data-tip":e.tip,onclick:t=>!A(e.disabled)&&e.onclick?.(t)},e.label)),(t=>t.label))),()=>{const e=s().find((t=>A(t.active)));if(!e)return null;const l=A(e.content);return t.html("div",{class:"p-4"},["function"==typeof l?l():l])}])},l.Badge=(e,l)=>t.html("span",{...e,class:o("badge",e.$class||e.class)},l),l.Tooltip=(e,l)=>t.html("div",{...e,class:o("tooltip",e.$class||e.class),"data-tip":e.tip},l),l.Navbar=(e,l)=>t.html("div",{...e,class:o("navbar bg-base-100 shadow-sm px-4",e.$class||e.class)},l),l.Menu=e=>{const l=e=>t.for((()=>e||[]),(e=>t.html("li",{},[e.children?t.html("details",{open:e.open},[t.html("summary",{},[e.icon&&t.html("span",{class:"mr-2"},e.icon),e.label]),t.html("ul",{},l(e.children))]):t.html("a",{class:()=>A(e.active)?"active":"",onclick:e.onclick},[e.icon&&t.html("span",{class:"mr-2"},e.icon),e.label])])),((t,e)=>t.label||e));return t.html("ul",{...e,class:o("menu bg-base-200 rounded-box",e.$class||e.class)},l(e.items))},l.Drawer=e=>t.html("div",{class:o("drawer",e.$class||e.class)},[t.html("input",{id:e.id,type:"checkbox",class:"drawer-toggle",$checked:e.$open}),t.html("div",{class:"drawer-content"},e.content),t.html("div",{class:"drawer-side"},[t.html("label",{for:e.id,class:"drawer-overlay",onclick:()=>e.$open?.(!1)}),t.html("div",{class:"min-h-full bg-base-200 w-80"},e.side)])]),l.Fieldset=(e,l)=>t.html("fieldset",{...e,class:o("fieldset bg-base-200 border border-base-300 p-4 rounded-lg",e.$class||e.class)},[()=>{const l=A(e.legend);return l?t.html("legend",{class:"fieldset-legend font-bold"},[l]):null},l]),l.List=e=>{const{items:l,header:a,render:s,keyFn:n,class:c}=e;return t.html("ul",{class:o("list bg-base-100 rounded-box shadow-md",c)},[t.if(a,(()=>t.html("li",{class:"p-4 pb-2 text-xs opacity-60 tracking-wide"},[A(a)]))),t.for(l,((e,l)=>t.html("li",{class:"list-row"},[s(e,l)])),n)])},l.Stack=(e,l)=>t.html("div",{...e,class:o("stack",e.$class||e.class)},l),l.Stat=e=>t.html("div",{...e,class:o("stat",e.$class||e.class)},[e.icon&&t.html("div",{class:"stat-figure text-secondary"},e.icon),e.label&&t.html("div",{class:"stat-title"},e.label),t.html("div",{class:"stat-value"},(()=>A(e.$value)??e.value)),e.desc&&t.html("div",{class:"stat-desc"},e.desc)]),l.Swap=e=>t.html("label",{class:o("swap",e.$class||e.class)},[t.html("input",{type:"checkbox",$checked:e.$value,onchange:t=>e.$value?.(t.target.checked)}),t.html("div",{class:"swap-on"},e.on),t.html("div",{class:"swap-off"},e.off)]),l.Indicator=(e,l)=>t.html("div",{class:o("indicator",e.$class||e.class)},[l,t.html("span",{class:o("indicator-item badge",e.badgeClass)},e.badge)]),l.Rating=e=>{const{$value:l,count:a=5,name:s=`rating-${Math.random().toString(36).slice(2,7)}`,mask:n="mask-star",readonly:o=!1,...c}=e;return t.html("div",{...c,class:()=>`rating ${A(o)?"pointer-events-none":""} ${e.class||""}`},Array.from({length:A(a)},((e,a)=>{const c=a+1;return t.html("input",{type:"radio",name:s,class:`mask ${n}`,"aria-label":`${c} star`,checked:()=>Math.round(A(l))===c,onchange:()=>{A(o)||"function"!=typeof l||l(c)}})})))},l.Alert=(e,l)=>{const{type:a="info",soft:s=!0,...n}=e,o={info:i,success:r,warning:m,error:d},c=l||e.message;return t.html("div",{...n,role:"alert",class:()=>`alert ${(()=>{const t=A(a);return{info:"alert-info",success:"alert-success",warning:"alert-warning",error:"alert-error"}[t]||t})()} ${A(s)?"alert-soft":""} ${e.class||""}`},[t.html("img",{src:o[A(a)]||o.info,class:"w-4 h-4 object-contain",alt:A(a)}),t.html("div",{class:"flex-1"},[t.html("span",{},["function"==typeof c?c():c])]),e.actions?t.html("div",{class:"flex-none"},["function"==typeof e.actions?e.actions():e.actions]):null])},l.Timeline=e=>{const{items:l=[],vertical:a=!0,compact:s=!1,...n}=e,o={info:i,success:r,warning:m,error:d};return t.html("ul",{...n,class:()=>`timeline ${A(a)?"timeline-vertical":"timeline-horizontal"} ${A(s)?"timeline-compact":""} ${e.class||""}`},[t.for(l,((e,a)=>{const s=0===a,n=a===A(l).length-1,c=e.type||"success",i=t=>"function"==typeof t?t():t;return t.html("li",{class:"flex-1"},[s?null:t.html("hr",{class:e.completed?"bg-primary":""}),t.html("div",{class:"timeline-start"},[i(e.title)]),t.html("div",{class:"timeline-middle"},[t.html("img",{src:o[c]||e.icon||o.success,class:"w-4 h-4 object-contain mx-1",alt:c})]),t.html("div",{class:"timeline-end timeline-box shadow-sm"},[i(e.detail)]),n?null:t.html("hr",{class:e.completed?"bg-primary":""})])}),((t,e)=>t.id||e))])},l.Fab=e=>{const{icon:l,label:a,actions:s=[],position:n="bottom-6 right-6",...o}=e;return t.html("div",{...o,class:()=>`fab fixed ${A(n)} flex flex-col-reverse items-end gap-3 z-[100] ${e.class||""}`},[t.html("div",{tabindex:0,role:"button",class:"btn btn-lg btn-circle btn-primary shadow-2xl"},[l?"function"==typeof l?l():l:null,!l&&a?a:null]),...A(s).map((e=>t.html("div",{class:"flex items-center gap-3 transition-all duration-300"},[e.label?t.html("span",{class:"badge badge-ghost shadow-sm whitespace-nowrap"},e.label):null,t.html("button",{type:"button",class:`btn btn-circle shadow-lg ${e.class||""}`,onclick:t=>{t.stopPropagation(),e.onclick?.(t)}},[e.icon?"function"==typeof e.icon?e.icon():e.icon:e.text||""])])))])},l.Toast=(e,a="alert-success",s=3500)=>{let n=document.getElementById("sigpro-toast-container");n||(n=t.html("div",{id:"sigpro-toast-container",class:"fixed top-0 right-0 z-[9999] p-4 flex flex-col gap-2 pointer-events-none"}),document.body.appendChild(n));const A=t.html("div",{style:"display: contents"});let o;n.appendChild(A);const c=()=>{clearTimeout(o);const t=A.firstElementChild;t&&!t.classList.contains("opacity-0")?(t.classList.add("translate-x-full","opacity-0"),setTimeout((()=>{i.destroy(),A.remove(),n.hasChildNodes()||n.remove()}),300)):(i.destroy(),A.remove())},i=t.mount((()=>{const s=t.html("div",{class:`alert alert-soft ${a} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`},[t.html("span","function"==typeof e?e:()=>e),l.Button({class:"btn-xs btn-circle btn-ghost",onclick:c},"✕")]);return requestAnimationFrame((()=>s.classList.remove("translate-x-10","opacity-0"))),s}),A);return s>0&&(o=setTimeout(c,s)),c},l.Loading=e=>t.if(e.$show,(()=>t.html("div",{class:"fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30"},[t.html("span",{class:"loading loading-spinner loading-lg text-primary"})]))),l.tt=n,Object.keys(l).forEach((e=>{window[e]=l[e],t[e]=l[e]})),l}; \ No newline at end of file +export const UI=(t,l="es")=>{const e={},a={es:{close:"Cerrar",confirm:"Confirmar",cancel:"Cancelar",search:"Buscar...",loading:"Cargando..."},en:{close:"Close",confirm:"Confirm",cancel:"Cancel",search:"Search...",loading:"Loading..."}},s=t(l);e.SetLocale=t=>s(t);const A=t=>()=>a[s()][t]||t,n=t=>"function"==typeof t?t():t,o=(t,l)=>"function"==typeof l?()=>`${t} ${l()||""}`.trim():`${t} ${l||""}`.trim(),c="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC",i="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC",r="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg==",d="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC",m="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII=";return e.Request=(l,e=null,a={})=>{const s=t(null),A=t(!1),o=t(null),c=t(!1);let i=null;const r=async(t=null)=>{const r=n(l);if(r){i&&i.abort(),i=new AbortController,A(!0),o(null),c(!1);try{const l=t||e,n=await fetch(r,{method:a.method||(l?"POST":"GET"),headers:{"Content-Type":"application/json",...a.headers},body:l?JSON.stringify(l):null,signal:i.signal,...a});if(!n.ok)throw new Error(`HTTP ${n.status}`);let o=await n.json();"function"==typeof a.transform&&(o=a.transform(o)),s(o),c(!0)}catch(t){"AbortError"!==t.name&&o(t.message)}finally{A(!1)}}};return t((()=>(r(),()=>i?.abort()))),{data:s,loading:A,error:o,success:c,reload:t=>r(t)}},e.Response=(l,a)=>t.html("div",{class:"res-container"},[t.if(l.loading,t.html("div",{class:"flex justify-center p-4"},t.html("span",{class:"loading loading-dots text-primary"}))),t.if(l.error,(()=>t.html("div",{role:"alert",class:"alert alert-error"},[t.html("span",{},l.error()),e.Button({class:"btn-xs btn-ghost border-current",onclick:()=>l.reload()},"Retry")]))),t.if(l.success,(()=>{const t=l.data();return null!==t?a(t):null}))]),e.Button=(l,e)=>{const{badge:a,badgeClass:s,tooltip:A,icon:c,loading:i,...r}=l;let d=t.html("button",{...r,class:o("btn",l.class||l.class),disabled:()=>n(i)||n(l.disabled)||n(l.disabled)},[()=>n(i)?t.html("span",{class:"loading loading-spinner"}):null,c?t.html("span",{class:"mr-1"},c):null,e]);return a&&(d=t.html("div",{class:"indicator"},[t.html("span",{class:o("indicator-item badge",s||"badge-secondary")},a),d])),A?t.html("div",{class:"tooltip","data-tip":A},d):d},e.Input=l=>{const{label:e,tip:a,value:s,error:i,isSearch:r,icon:d,type:m="text",...h}=l,u="password"===m,g=t(!1),b={text:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMRJREFUOI3t0bFKAmAUBeAPURD1HQwUTKPJEmzQoSWQcKpVfIuWdvU9WnqNhsYWBx0a2lvLSMKGbvQ7SO564HA497/3cu/92SPFAS5QDN9CftviDhZYYRpNPtH/rzATOsQT6jhCFzmc4DTJL6AX067hPiimuAr95RglzMJ/4AyyUXSMw3iEauhN6C0eUEMFAyzTFZ7xiOvwL3jbsPYSr3hPg3dB/o43SVYY+TnsPPwXztMG5SDr39dGM8kr4RKNDdPtJL4BNXEmsdKC+S4AAAAASUVORK5CYII=",password:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII=",date:c,number:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg==",email:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"},p=t.html("input",{...h,type:()=>u?g()?"text":"password":m,placeholder:l.placeholder||e||(r?A("search")():" "),class:o("grow order-2 focus:outline-none",l.class),value:s,oninput:t=>l.oninput?.(t),disabled:()=>n(l.disabled)}),f=d||(b[m]?t.html("img",{src:b[m],class:"w-5 h-5 opacity-50",alt:m}):null);return t.html("label",{class:()=>o("input input-bordered floating-label flex items-center gap-2 w-full relative",n(i)?"input-error":"")},[f?t.html("div",{class:"order-1 shrink-0"},f):null,e?t.html("span",{class:"text-base-content/60 order-0"},e):null,p,u?t.html("button",{type:"button",class:"order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100",onclick:t=>{t.preventDefault(),g(!g())}},(()=>t.html("img",{class:"w-5 h-5",src:g()?"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg==":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"}))):null,a?t.html("div",{class:"tooltip tooltip-left order-4","data-tip":a},t.html("span",{class:"badge badge-ghost badge-xs cursor-help"},"?")):null,()=>n(i)?t.html("span",{class:"text-error text-[10px] absolute -bottom-5 left-2"},n(i)):null])},e.Select=l=>{const{label:e,options:a,value:s,...A}=l,c=t.html("select",{...A,class:o("select select-bordered w-full",l.class||l.class),value:s},t.for((()=>n(a)||[]),(l=>t.html("option",{value:l.value,$selected:()=>String(n(s))===String(l.value)},l.label)),(t=>t.value)));return e?t.html("label",{class:"fieldset-label flex flex-col gap-1"},[t.html("span",{},e),c]):c},e.Autocomplete=l=>{const{options:a=[],value:s,onSelect:o,label:c,placeholder:i,...r}=l,d=t(n(s)||""),m=t(!1),h=t(-1),u=t((()=>{const t=d().toLowerCase(),l=n(a)||[];return t?l.filter((l=>("string"==typeof l?l:l.label).toLowerCase().includes(t))):l})),g=t=>{const l="string"==typeof t?t:t.value,e="string"==typeof t?t:t.label;d(e),"function"==typeof s&&s(l),o?.(t),m(!1),h(-1)};return t.html("div",{class:"relative w-full"},[e.Input({label:c,placeholder:i||A("search")(),value:d,onfocus:()=>m(!0),onblur:()=>setTimeout((()=>m(!1)),150),onkeydown:t=>{const l=u();"ArrowDown"===t.key?(t.preventDefault(),m(!0),h(Math.min(h()+1,l.length-1))):"ArrowUp"===t.key?(t.preventDefault(),h(Math.max(h()-1,0))):"Enter"===t.key&&h()>=0?(t.preventDefault(),g(l[h()])):"Escape"===t.key&&m(!1)},oninput:t=>{const l=t.target.value;d(l),"function"==typeof s&&s(l),m(!0),h(-1)},...r}),t.html("ul",{class:"absolute left-0 w-full menu bg-base-100 rounded-box mt-1 p-2 shadow-xl max-h-60 overflow-y-auto border border-base-300 z-50",style:()=>m()&&u().length?"display:block":"display:none"},[t.for(u,((l,e)=>t.html("li",{},[t.html("a",{class:()=>"block w-full "+(h()===e?"active bg-primary text-primary-content":""),onclick:()=>g(l),onmouseenter:()=>h(e)},"string"==typeof l?l:l.label)])),((t,l)=>("string"==typeof t?t:t.value)+l)),()=>u().length?null:t.html("li",{class:"p-2 text-center opacity-50"},"No results")])])},e.Datepicker=l=>{const{value:a,range:s,label:A,placeholder:o,...i}=l,r=t(!1),d=t(new Date),m=t(null),h=()=>!0===n(s),u=new Date,g=`${u.getFullYear()}-${String(u.getMonth()+1).padStart(2,"0")}-${String(u.getDate()).padStart(2,"0")}`,b=t=>`${t.getFullYear()}-${String(t.getMonth()+1).padStart(2,"0")}-${String(t.getDate()).padStart(2,"0")}`,p=t=>{const l=b(t),e=n(a);if(h())if(!e?.start||e.start&&e.end)"function"==typeof a&&a({start:l,end:null});else{const t=e.start;"function"==typeof a&&a(l{const t=n(a);return t?"string"==typeof t?t:t.start&&t.end?`${t.start} - ${t.end}`:t.start?`${t.start}...`:"":""})),v=t=>{const l=d();d(new Date(l.getFullYear(),l.getMonth()+t,1))},B=t=>{const l=d();d(new Date(l.getFullYear()+t,l.getMonth(),1))};return t.html("div",{class:"relative w-full"},[e.Input({label:A,placeholder:o||(h()?"Seleccionar rango...":"Seleccionar fecha..."),value:f,readonly:!0,icon:t.html("img",{src:c,class:"opacity-40"}),onclick:t=>{t.stopPropagation(),r(!r())},...i}),t.if(r,(()=>t.html("div",{class:"absolute left-0 mt-2 p-4 bg-base-100 border border-base-300 shadow-2xl rounded-box z-[100] w-80 select-none",onclick:t=>t.stopPropagation()},[t.html("div",{class:"flex justify-between items-center mb-4 gap-1"},[t.html("div",{class:"flex gap-0.5"},[t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>B(-1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg==",class:"opacity-40"})),t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>v(-1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg==",class:"opacity-40"}))]),t.html("span",{class:"font-bold uppercase flex-1 text-center"},[()=>d().toLocaleString("es-ES",{month:"short",year:"numeric"})]),t.html("div",{class:"flex gap-0.5"},[t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>v(1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg==",class:"opacity-40"})),t.html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>B(1)},t.html("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII=",class:"opacity-40"}))])]),t.html("div",{class:"grid grid-cols-7 gap-1",onmouseleave:()=>m(null)},[...["L","M","X","J","V","S","D"].map((l=>t.html("div",{class:"text-[10px] opacity-40 font-bold text-center"},l))),()=>{const l=d(),e=l.getFullYear(),s=l.getMonth(),A=new Date(e,s,1).getDay(),o=0===A?6:A-1,c=new Date(e,s+1,0).getDate(),i=[];for(let l=0;l{const t=n(a),l=m(),e="string"==typeof t?t===o:t?.start===o,s=t?.end===o;let A=!1;if(h()&&t?.start){const e=t.start;!t.end&&l?A=o>e&&o<=l||o=l:t.end&&(A=o>e&&o{h()&&m(o)},onclick:()=>p(A)},[l.toString()]))}return i}])]))),t.if(r,(()=>t.html("div",{class:"fixed inset-0 z-[90]",onclick:()=>r(!1)})))])},e.Colorpicker=l=>{const{value:e,label:a,...s}=l,A=t(!1),o=["#000","#1A1A1A","#333","#4D4D4D","#666","#808080","#B3B3B3","#FFF","#450a0a","#7f1d1d","#991b1b","#b91c1c","#dc2626","#ef4444","#f87171","#fca5a5","#431407","#7c2d12","#9a3412","#c2410c","#ea580c","#f97316","#fb923c","#ffedd5","#713f12","#a16207","#ca8a04","#eab308","#facc15","#fde047","#fef08a","#fff9c4","#064e3b","#065f46","#059669","#10b981","#34d399","#4ade80","#84cc16","#d9f99d","#082f49","#075985","#0284c7","#0ea5e9","#38bdf8","#7dd3fc","#22d3ee","#cffafe","#1e1b4b","#312e81","#4338ca","#4f46e5","#6366f1","#818cf8","#a5b4fc","#e0e7ff","#2e1065","#4c1d95","#6d28d9","#7c3aed","#8b5cf6","#a855f7","#d946ef","#fae8ff"],c=()=>n(e)||"#000000";return t.html("div",{class:"relative w-fit"},[t.html("button",{type:"button",class:"btn px-3 bg-base-100 border-base-300 hover:border-primary/50 flex items-center gap-2 shadow-sm font-normal normal-case",onclick:t=>{t.stopPropagation(),A(!A())},...s},[t.html("div",{class:"size-5 rounded-sm shadow-inner border border-black/10 shrink-0",style:()=>`background-color: ${c()}`}),a?t.html("span",{class:"opacity-80"},a):null]),t.if(A,(()=>t.html("div",{class:"absolute left-0 mt-2 p-3 bg-base-100 border border-base-300 shadow-2xl rounded-box z-[110] w-64 select-none",onclick:t=>t.stopPropagation()},[t.html("div",{class:"grid grid-cols-8 gap-1"},o.map((l=>t.html("button",{type:"button",style:`background-color: ${l}`,class:()=>"size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 \n "+(c().toLowerCase()===l.toLowerCase()?"ring-2 ring-offset-1 ring-primary z-10 scale-110":""),onclick:()=>{e(l),A(!1)}}))))]))),t.if(A,(()=>t.html("div",{class:"fixed inset-0 z-[100]",onclick:()=>A(!1)})))])},e.CheckBox=l=>{const{value:e,tooltip:a,toggle:s,...A}=l,o=t.html("input",{...A,type:"checkbox",class:()=>n(s)?"toggle":"checkbox",checked:e}),c=t.html("label",{class:"label cursor-pointer justify-start gap-3"},[o,l.label?t.html("span",{class:"label-text"},l.label):null]);return a?t.html("div",{class:"tooltip","data-tip":a},c):c},e.Radio=l=>{const{label:e,tooltip:a,value:s,...A}=l,c=t.html("input",{...A,type:"radio",class:o("radio",l.class||l.class),checked:()=>n(s)===s,disabled:()=>n(l.disabled)||n(l.disabled),onclick:()=>"function"==typeof s&&s(s)});if(!e&&!a)return c;const i=t.html("label",{class:"label cursor-pointer justify-start gap-3"},[c,e?t.html("span",{class:"label-text"},e):null]);return a?t.html("div",{class:"tooltip","data-tip":a},i):i},e.Range=l=>{const{label:e,tooltip:a,value:s,...A}=l,c=t.html("input",{...A,type:"range",class:o("range",l.class),value:s,disabled:()=>n(l.disabled)});if(!e&&!a)return c;const i=t.html("div",{class:"flex flex-col gap-2"},[e?t.html("span",{class:"label-text"},e):null,c]);return a?t.html("div",{class:"tooltip","data-tip":a},i):i},e.Modal=(l,a)=>{const{title:s,buttons:n,open:o,...c}=l,i=()=>o(!1);return t.if(o,(()=>t.html("dialog",{...c,class:"modal modal-open"},[t.html("div",{class:"modal-box"},[s?t.html("h3",{class:"text-lg font-bold mb-4"},s):null,"function"==typeof a?a():a,t.html("div",{class:"modal-action flex gap-2"},[...(Array.isArray(n)?n:[n]).filter(Boolean),e.Button({onclick:i},A("close")())])]),t.html("form",{method:"dialog",class:"modal-backdrop",onclick:t=>(t.preventDefault(),i())},[t.html("button",{},"close")])])))},e.Grid=l=>{const{data:e,options:a,class:s}=l;let A=null;const o=t.html("div",{style:"height: 100%; width: 100%;",class:s}),c=new MutationObserver((()=>{A&&A.setGridOption("theme",getTheme(isDark()))}));c.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]}),o._cleanups.add((()=>c.disconnect()));const i=t.watch((()=>{const t=isDark(),l=getTheme(t),s=n(e)||[];A?A.setGridOption("theme",l):A=createGrid(o,{...n(a)||{},theme:l,rowData:s})}));o._cleanups.add(i);const r=t.watch((()=>{const t=n(e);A&&Array.isArray(t)&&A.setGridOption("rowData",t)}));return o._cleanups.add(r),o._cleanups.add((()=>{A&&(A.destroy(),A=null)})),o},e.Dropdown=(l,e)=>{const{label:a,icon:s,...A}=l;return t.html("div",{...A,class:()=>`dropdown ${n(l.class)||l.class||""}`},[t.html("div",{tabindex:0,role:"button",class:"btn m-1 flex items-center gap-2"},[s?"function"==typeof s?s():s:null,a?"function"==typeof a?a():a:null]),t.html("ul",{tabindex:0,class:"dropdown-content z-[50] menu p-2 shadow bg-base-100 rounded-box min-w-max border border-base-300"},["function"==typeof e?e():e])])},e.Accordion=(l,e)=>{const{title:a,name:s,open:A,...n}=l;return t.html("div",{...n,class:o("collapse collapse-arrow bg-base-200 mb-2",l.class||l.class)},[t.html("input",{type:s?"radio":"checkbox",name:s,checked:A}),t.html("div",{class:"collapse-title text-xl font-medium"},a),t.html("div",{class:"collapse-content"},e)])},e.Tabs=l=>{const{items:e,...a}=l,s="function"==typeof e?e:()=>e||[];return t.html("div",{...a,class:"flex flex-col gap-4 w-full"},[t.html("div",{role:"tablist",class:o("tabs tabs-box",l.class||l.class)},t.for(s,(l=>t.html("a",{role:"tab",class:()=>o("tab",n(l.active)&&"tab-active",n(l.disabled),l.tip),"data-tip":l.tip,onclick:t=>!n(l.disabled)&&l.onclick?.(t)},l.label)),(t=>t.label))),()=>{const l=s().find((t=>n(t.active)));if(!l)return null;const e=n(l.content);return t.html("div",{class:"p-4"},["function"==typeof e?e():e])}])},e.Badge=(l,e)=>t.html("span",{...l,class:o("badge",l.class||l.class)},e),e.Tooltip=(l,e)=>t.html("div",{...l,class:o("tooltip",l.class||l.class),"data-tip":l.tip},e),e.Navbar=(l,e)=>t.html("div",{...l,class:o("navbar bg-base-100 shadow-sm px-4",l.class||l.class)},e),e.Menu=l=>{const e=l=>t.for((()=>l||[]),(l=>t.html("li",{},[l.children?t.html("details",{open:l.open},[t.html("summary",{},[l.icon&&t.html("span",{class:"mr-2"},l.icon),l.label]),t.html("ul",{},e(l.children))]):t.html("a",{class:()=>n(l.active)?"active":"",onclick:l.onclick},[l.icon&&t.html("span",{class:"mr-2"},l.icon),l.label])])),((t,l)=>t.label||l));return t.html("ul",{...l,class:o("menu bg-base-200 rounded-box",l.class||l.class)},e(l.items))},e.Drawer=l=>t.html("div",{class:o("drawer",l.class||l.class)},[t.html("input",{id:l.id,type:"checkbox",class:"drawer-toggle",checked:l.open}),t.html("div",{class:"drawer-content"},l.content),t.html("div",{class:"drawer-side"},[t.html("label",{for:l.id,class:"drawer-overlay",onclick:()=>l.open?.(!1)}),t.html("div",{class:"min-h-full bg-base-200 w-80"},l.side)])]),e.Fieldset=(l,e)=>t.html("fieldset",{...l,class:o("fieldset bg-base-200 border border-base-300 p-4 rounded-lg",l.class||l.class)},[()=>{const e=n(l.legend);return e?t.html("legend",{class:"fieldset-legend font-bold"},[e]):null},e]),e.List=l=>{const{items:e,header:a,render:s,keyFn:A,class:c}=l;return t.html("ul",{class:o("list bg-base-100 rounded-box shadow-md",c)},[t.if(a,(()=>t.html("li",{class:"p-4 pb-2 text-xs opacity-60 tracking-wide"},[n(a)]))),t.for(e,((l,e)=>t.html("li",{class:"list-row"},[s(l,e)])),A)])},e.Stack=(l,e)=>t.html("div",{...l,class:o("stack",l.class||l.class)},e),e.Stat=l=>t.html("div",{...l,class:o("stat",l.class||l.class)},[l.icon&&t.html("div",{class:"stat-figure text-secondary"},l.icon),l.label&&t.html("div",{class:"stat-title"},l.label),t.html("div",{class:"stat-value"},(()=>n(l.value)??l.value)),l.desc&&t.html("div",{class:"stat-desc"},l.desc)]),e.Swap=l=>t.html("label",{class:o("swap",l.class||l.class)},[t.html("input",{type:"checkbox",checked:l.value}),t.html("div",{class:"swap-on"},l.on),t.html("div",{class:"swap-off"},l.off)]),e.Indicator=(l,e)=>t.html("div",{class:o("indicator",l.class||l.class)},[e,t.html("span",{class:o("indicator-item badge",l.badgeClass)},l.badge)]),e.Rating=l=>{const{value:e,count:a=5,mask:s="mask-star",readonly:A=!1,...o}=l,c=`rating-${Math.random().toString(36).slice(2,7)}`;return t.html("div",{...o,class:()=>`rating ${n(A)?"pointer-events-none":""} ${l.class||""}`},Array.from({length:n(a)},((l,a)=>{const o=a+1;return t.html("input",{type:"radio",name:c,class:`mask ${s}`,"aria-label":`${o} star`,checked:()=>Math.round(n(e))===o,onchange:()=>{n(A)||"function"!=typeof e||e(o)}})})))},e.Alert=(l,e)=>{const{type:a="info",soft:s=!0,...A}=l,o={info:i,success:r,warning:m,error:d},c=e||l.message;return t.html("div",{...A,role:"alert",class:()=>`alert ${(()=>{const t=n(a);return{info:"alert-info",success:"alert-success",warning:"alert-warning",error:"alert-error"}[t]||t})()} ${n(s)?"alert-soft":""} ${l.class||""}`},[t.html("img",{src:o[n(a)]||o.info,class:"w-4 h-4 object-contain",alt:n(a)}),t.html("div",{class:"flex-1"},[t.html("span",{},["function"==typeof c?c():c])]),l.actions?t.html("div",{class:"flex-none"},["function"==typeof l.actions?l.actions():l.actions]):null])},e.Timeline=l=>{const{items:e=[],vertical:a=!0,compact:s=!1,...A}=l,o={info:i,success:r,warning:m,error:d};return t.html("ul",{...A,class:()=>`timeline ${n(a)?"timeline-vertical":"timeline-horizontal"} ${n(s)?"timeline-compact":""} ${l.class||""}`},[t.for(e,((l,a)=>{const s=0===a,A=a===n(e).length-1,c=l.type||"success",i=t=>"function"==typeof t?t():t;return t.html("li",{class:"flex-1"},[s?null:t.html("hr",{class:l.completed?"bg-primary":""}),t.html("div",{class:"timeline-start"},[i(l.title)]),t.html("div",{class:"timeline-middle"},[t.html("img",{src:o[c]||l.icon||o.success,class:"w-4 h-4 object-contain mx-1",alt:c})]),t.html("div",{class:"timeline-end timeline-box shadow-sm"},[i(l.detail)]),A?null:t.html("hr",{class:l.completed?"bg-primary":""})])}),((t,l)=>t.id||l))])},e.Fab=l=>{const{icon:e,label:a,actions:s=[],position:A="bottom-6 right-6",...o}=l;return t.html("div",{...o,class:()=>`fab fixed ${n(A)} flex flex-col-reverse items-end gap-3 z-[100] ${l.class||""}`},[t.html("div",{tabindex:0,role:"button",class:"btn btn-lg btn-circle btn-primary shadow-2xl"},[e?"function"==typeof e?e():e:null,!e&&a?a:null]),...n(s).map((l=>t.html("div",{class:"flex items-center gap-3 transition-all duration-300"},[l.label?t.html("span",{class:"badge badge-ghost shadow-sm whitespace-nowrap"},l.label):null,t.html("button",{type:"button",class:`btn btn-circle shadow-lg ${l.class||""}`,onclick:t=>{t.stopPropagation(),l.onclick?.(t)}},[l.icon?"function"==typeof l.icon?l.icon():l.icon:l.text||""])])))])},e.Toast=(l,a="alert-success",s=3500)=>{let A=document.getElementById("sigpro-toast-container");A||(A=t.html("div",{id:"sigpro-toast-container",class:"fixed top-0 right-0 z-[9999] p-4 flex flex-col gap-2 pointer-events-none"}),document.body.appendChild(A));const n=t.html("div",{style:"display: contents"});let o;A.appendChild(n);const c=()=>{clearTimeout(o);const t=n.firstElementChild;t&&!t.classList.contains("opacity-0")?(t.classList.add("translate-x-full","opacity-0"),setTimeout((()=>{i.destroy(),n.remove(),A.hasChildNodes()||A.remove()}),300)):(i.destroy(),n.remove())},i=t.mount((()=>{const s=t.html("div",{class:`alert alert-soft ${a} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`},[t.html("span","function"==typeof l?l:()=>l),e.Button({class:"btn-xs btn-circle btn-ghost",onclick:c},"✕")]);return requestAnimationFrame((()=>s.classList.remove("translate-x-10","opacity-0"))),s}),n);return s>0&&(o=setTimeout(c,s)),c},e.Loading=l=>t.if(l.$show,(()=>t.html("div",{class:"fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30"},[t.html("span",{class:"loading loading-spinner loading-lg text-primary"})]))),e.tt=A,Object.keys(e).forEach((l=>{t[l]=e[l],Object.defineProperty(window,l,{value:e[l],writable:!1,configurable:!0,enumerable:!0})})),e}; \ No newline at end of file diff --git a/sigpro/sigpro.js b/sigpro/sigpro.js index 3dd0128..2b0e524 100644 --- a/sigpro/sigpro.js +++ b/sigpro/sigpro.js @@ -313,7 +313,7 @@ return outlet; }; - $.go = (p) => (window.location.hash = p.replace(/^#?\/?/, "#/")); + $.go = (path) => (window.location.hash = path.replace(/^#?\/?/, "#/")); $.mount = (component, target) => { const el = typeof target === "string" ? document.querySelector(target) : target; @@ -326,8 +326,15 @@ }; const tags = `div span p h1 h2 h3 h4 h5 h6 br hr section article aside nav main header footer address ul ol li dl dt dd a em strong small i b u mark time sub sup pre code blockquote details summary dialog form label input textarea select button option fieldset legend table thead tbody tfoot tr th td caption img video audio canvas svg iframe picture source progress meter`.split(/\s+/); - tags.forEach((t) => { - window[t.charAt(0).toUpperCase() + t.slice(1)] = (p, c) => $.html(t, p, c); + tags.forEach((tagName) => { + const helperName = tagName.charAt(0).toUpperCase() + tagName.slice(1); + + Object.defineProperty(window, helperName, { + value: (props, content) => $.html(tagName, props, content), + writable: false, + configurable: true, + enumerable: true + }); }); window.$ = $; diff --git a/src/docs/api/html.md b/src/docs/api/html.md index 7f42b79..e77938f 100644 --- a/src/docs/api/html.md +++ b/src/docs/api/html.md @@ -21,40 +21,48 @@ $.html(tagName: string, props?: Object, children?: any[] | any): HTMLElement ### 1. Attribute Handling SigPro intelligently decides how to apply each property: * **Standard Props**: Applied via `setAttribute` or direct property assignment. -* **Boolean Props**: Uses `toggleAttribute` (e.g., `checked`, `disabled`, `hidden`). * **Class Names**: Supports `class` or `className` interchangeably. +* **Boolean Props**: Automatic handling for `checked`, `disabled`, `hidden`, etc. -### 2. Event Listeners & Modifiers -Events are defined by the `on` prefix. SigPro supports **Dot Notation** for common event operations: +### 2. Event Listeners +Events are defined by the `on` prefix. SigPro automatically registers the listener and ensures it is cleaned up when the element is destroyed. ```javascript -$.html("button", { - // e.preventDefault() is called automatically - "onsubmit.prevent": (e) => save(e), - - // e.stopPropagation() is called automatically - "onclick.stop": () => console.log("No bubbling"), - - // { once: true } listener option - "onclick.once": () => console.log("Runs only once") +Button({ + onclick: (e) => console.log("Clicked!", e), }, "Click Me"); ``` -### 3. Reactive Attributes +### 3. Reactive Attributes (One-Way) If an attribute value is a **function** (like a Signal), `$.html` creates an internal **`$.watch`** to keep the DOM in sync with the state. ```javascript -$.html("div", { +Div({ // Updates the class whenever 'theme()' changes class: () => theme() === "dark" ? "bg-black" : "bg-white" }); ``` -### 4. Reactive Children +### 4. Smart Two-Way Binding (Automatic) +SigPro automatically enables **bidirectional synchronization** when it detects a **Signal** assigned to a form-capable attribute (`value` or `checked`) on an input element (`input`, `textarea`, `select`). + + + +```javascript +// Syncs input value <-> signal automatically +Input({ + type: "text", + value: username // No special symbols needed! +}) +``` + +> **Note:** To use a Signal as **read-only** in an input, wrap it in an anonymous function: `value: () => username()`. + +### 5. Reactive Children Children can be static or dynamic. When a child is a function, SigPro creates a reactive boundary using `$.watch` for that specific part of the DOM. ```javascript -$.html("div", {}, [ +Div({}, [ H1("Static Title"), // Only this text node re-renders when 'count' changes () => `Current count: ${count()}` @@ -63,27 +71,16 @@ $.html("div", {}, [ --- -## 🔄 Two-Way Binding Operator (`$`) - -When a property starts with `$`, `$.html` enables bidirectional synchronization. This is primarily used for form inputs. - -```javascript -$.html("input", { - type: "text", - $value: username // Syncs input value <-> signal -}); -``` - ## 🧹 Memory Management (Internal) Every element created with `$.html` is "self-aware" regarding its reactive dependencies. * **`._cleanups`**: A hidden `Set` attached to the element that stores all `stop()` functions from its internal `$.watch` calls and event listeners. -* **Lifecycle**: When an element is removed by a Controller (`$.If`, `$.For`, or `$.router`), SigPro performs a recursive "sweep" to execute these cleanups, ensuring **zero memory leaks**. +* **Lifecycle**: When an element is removed by a Controller (`$.if`, `$.for`, or `$.router`), SigPro performs a recursive **"sweep"** to execute these cleanups, ensuring **zero memory leaks**. --- ## 💡 Tag Constructors (The Shortcuts) -Instead of writing `$.html("div", ...)` every time, SigPro provides PascalCase global functions: +Instead of writing `$.html("div", ...)` every time, SigPro provides PascalCase global functions for all standard HTML tags: ```javascript // This: diff --git a/src/docs/api/tags.md b/src/docs/api/tags.md index 62b3e82..bad34b5 100644 --- a/src/docs/api/tags.md +++ b/src/docs/api/tags.md @@ -13,7 +13,7 @@ SigPro iterates through a manifest of standard HTML tags and attaches a wrapper ## 2. The Complete Global Registry -The following functions are injected into the global scope (using **PascalCase** to prevent naming collisions with common JS variables) and are ready to use: +The following functions are injected into the global scope using **PascalCase** to prevent naming collisions with common JS variables: | Category | Available Global Functions | | :--- | :--- | @@ -24,8 +24,6 @@ The following functions are injected into the global scope (using **PascalCase** | **Tables** | `Table`, `Thead`, `Tbody`, `Tr`, `Th`, `Td`, `Tfoot`, `Caption` | | **Media** | `Img`, `Canvas`, `Video`, `Audio`, `Svg`, `Iframe`, `Picture`, `Source` | -> **The SigPro Philosophy:** Tags are not "magic strings" handled by a compiler. They are **functional constructors**. Every time you call `Div()`, you execute a pure JS function that returns a real, reactive DOM element. - --- ## 3. Usage Patterns (Smart Arguments) @@ -33,7 +31,6 @@ The following functions are injected into the global scope (using **PascalCase** SigPro tag helpers are flexible. They automatically detect if you are passing attributes, children, or both. ### A. Attributes + Children -The standard way to build structured UI. ```javascript Div({ class: 'container', id: 'main' }, [ H1("Welcome to SigPro"), @@ -42,7 +39,7 @@ Div({ class: 'container', id: 'main' }, [ ``` ### B. Children Only (The "Skipper") -If you don't need attributes, you can skip the object and pass the content (string, array, or function) directly as the first argument. +If you don't need attributes, you can pass the content directly as the first argument. ```javascript Section([ H2("Clean Syntax"), @@ -50,85 +47,79 @@ Section([ ]); ``` -### C. Primitive Content -For simple tags, just pass a string or a number. -```javascript -H1("Hello World"); -Span(42); -``` - --- ## 4. Reactive Power -These helpers are natively wired into SigPro's **`$.watch`** engine. No manual effect management is needed; the lifecycle is tied to the DOM node. +These helpers are natively wired into SigPro's **`$.watch`** engine. -### Reactive Attributes +### Reactive Attributes (One-Way) Simply pass a Signal (function) to any attribute. SigPro creates an internal `$.watch` to keep the DOM in sync. ```javascript const theme = $("light"); Div({ - // Updates 'class' automatically via internal $.watch class: () => `app-box ${theme()}` }, "Themeable Box"); ``` -### The Binding Operator (`$`) -Use the `$` prefix for **Two-Way Binding** on inputs. This bridges the Signal and the Input element bi-directionally. +### Smart Two-Way Binding (Automatic) +SigPro automatically bridges the **Signal** and the **Input** element bi-directionally when you assign a Signal to `value` or `checked`. No special operators are required. + ```javascript const search = $(""); +// UI updates Signal AND Signal updates UI automatically Input({ type: "text", placeholder: "Search...", - $value: search // UI updates Signal AND Signal updates UI + value: search }); ``` +> **Pro Tip:** If you want an input to be **read-only** but still reactive, wrap the signal in an anonymous function: `value: () => search()`. This prevents the "backwards" synchronization. + ### Dynamic Flow & Cleanup -Combine tags with Core controllers for high-performance rendering. SigPro automatically cleans up the `$.watch` instances when nodes are removed. +Combine tags with Core controllers. SigPro automatically cleans up the `$.watch` instances and event listeners when nodes are removed from the DOM. ```javascript const items = $(["Apple", "Banana", "Cherry"]); Ul({ class: "list-disc" }, [ - $.For(items, (item) => Li(item)) + $.for(items, (item) => Li(item), (item) => item) ]); ``` --- + ::: danger ## ⚠️ Important: Naming Conventions -Since SigPro injects these helpers into the global `window` object, follow these rules to avoid bugs: - -1. **Avoid Shadowing**: Don't name your local variables like the tags (e.g., `const Div = ...`). This will "hide" the SigPro helper. -2. **Custom Components**: Always use **PascalCase** for your own component functions (e.g., `UserCard`, `NavMenu`) to distinguish them from the built-in Tag Helpers and maintain architectural clarity. +1. **Avoid Shadowing**: Don't name your local variables like the tags (e.g., `const Div = ...`). This will "hide" the global SigPro helper. +2. **Custom Components**: Always use **PascalCase** for your own component functions (e.g., `UserCard`, `NavMenu`) to distinguish them from built-in Tag Helpers. ::: + --- ## 5. Logic to UI Comparison -Here is how a dynamic **User Status** component translates from SigPro logic to the final DOM structure, handled by the engine. +Here is how a dynamic **User Status** component translates from SigPro logic to the final DOM structure. ```javascript -// SigPro Component -const UserStatus = (name, $online) => ( +const UserStatus = (name, online) => ( Div({ class: 'flex items-center gap-2' }, [ Span({ - // Boolean toggle for 'hidden' attribute - hidden: () => !$online(), + hidden: () => !online(), class: 'w-3 h-3 bg-green-500 rounded-full' }), P({ - // Reactive text content via automatic $.watch - class: () => $online() ? "text-bold" : "text-gray-400" + class: () => online() ? "text-bold" : "text-gray-400" }, name) ]) ); ``` -| State (`$online`) | Rendered HTML | Memory Management | +| State (`online`) | Rendered HTML | Memory Management | | :--- | :--- | :--- | | **`true`** | `

John

` | Watcher active | | **`false`** | `

John

` | Attribute synced | + diff --git a/src/docs/ui/buttons.md b/src/docs/ui/buttons.md new file mode 100644 index 0000000..2df61cd --- /dev/null +++ b/src/docs/ui/buttons.md @@ -0,0 +1,51 @@ +# Buttons + +The **SigPro** Button component wraps [DaisyUI 5](https://daisyui.com/components/button/) styles with native reactive logic. + +## Basic Usage + + + +