From 70a38f504bab9ddaab17c9385a0d86202dc9d4a9 Mon Sep 17 00:00:00 2001 From: natxocc Date: Tue, 31 Mar 2026 17:47:14 +0200 Subject: [PATCH] Using RollUp --- dist/sigpro-ui.cjs | 1673 ++++++++++++++++++++++++++++++++++++ dist/sigpro-ui.esm.js | 1617 +++++++++++++++++++++++++++++++++++ dist/sigpro-ui.js | 1385 ------------------------------ dist/sigpro-ui.min.js | 7 - dist/sigpro-ui.umd.js | 1676 +++++++++++++++++++++++++++++++++++++ dist/sigpro-ui.umd.min.js | 1 + package.json | 55 +- rollup.config.js | 49 ++ 8 files changed, 5047 insertions(+), 1416 deletions(-) create mode 100644 dist/sigpro-ui.cjs create mode 100644 dist/sigpro-ui.esm.js delete mode 100644 dist/sigpro-ui.js delete mode 100644 dist/sigpro-ui.min.js create mode 100644 dist/sigpro-ui.umd.js create mode 100644 dist/sigpro-ui.umd.min.js create mode 100644 rollup.config.js diff --git a/dist/sigpro-ui.cjs b/dist/sigpro-ui.cjs new file mode 100644 index 0000000..85f1029 --- /dev/null +++ b/dist/sigpro-ui.cjs @@ -0,0 +1,1673 @@ +'use strict'; + +Object.defineProperty(exports, '__esModule', { value: true }); + +var sigpro = require('sigpro'); + +const val = t => typeof t === "function" ? t() : t; + +const joinClass = (t, l) => typeof l === "function" + ? () => `${t} ${l() || ""}`.trim() + : `${t} ${l || ""}`.trim(); + +var Utils = /*#__PURE__*/Object.freeze({ + __proto__: null, + joinClass: joinClass, + val: val +}); + +/** ACCORDION */ +const Accordion = (props, children) => { + const { title, name, open, ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class), + }, + [ + sigpro.$html("input", { + type: name ? "radio" : "checkbox", + name: name, + checked: open + }), + sigpro.$html("div", { class: "collapse-title text-xl font-medium" }, title), + sigpro.$html("div", { class: "collapse-content" }, children), + ], + ); +}; + +var AccordionModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion +}); + +const iconShow = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg=="; +const iconHide = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"; +const iconClose = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg=="; +const iconCalendar = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC"; +const iconLock = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII="; +const iconAbc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg=="; +const icon123 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg=="; +const iconMail = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"; +const iconInfo = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC"; +const iconSuccess = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg=="; +const iconError = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC"; +const iconWarning = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII="; +const iconLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg=="; +const iconRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg=="; +const iconLLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg=="; +const iconRRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII="; +const iconUpload = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC"; + +var Icons = /*#__PURE__*/Object.freeze({ + __proto__: null, + icon123: icon123, + iconAbc: iconAbc, + iconCalendar: iconCalendar, + iconClose: iconClose, + iconError: iconError, + iconHide: iconHide, + iconInfo: iconInfo, + iconLLeft: iconLLeft, + iconLeft: iconLeft, + iconLock: iconLock, + iconMail: iconMail, + iconRRight: iconRRight, + iconRight: iconRight, + iconShow: iconShow, + iconSuccess: iconSuccess, + iconUpload: iconUpload, + iconWarning: iconWarning +}); + +/** ALERT */ +const Alert = (props, children) => { + const { type = "info", soft = true, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + const typeClass = () => { + const t = val(type); + const map = { + info: "alert-info", + success: "alert-success", + warning: "alert-warning", + error: "alert-error", + }; + return map[t] || t; + }; + + const content = children || props.message; + + return sigpro.$html( + "div", + { + ...rest, + role: "alert", + class: () => `alert ${typeClass()} ${val(soft) ? "alert-soft" : ""} ${props.class || ""}`, + }, + [ + sigpro.$html("img", { + src: icons[val(type)] || icons.info, + class: "w-4 h-4 object-contain", + alt: val(type), + }), + sigpro.$html("div", { class: "flex-1" }, [ + sigpro.$html("span", {}, [typeof content === "function" ? content() : content]) + ]), + props.actions ? sigpro.$html("div", { class: "flex-none" }, [ + typeof props.actions === "function" ? props.actions() : props.actions + ]) : null, + ], + ); +}; + +var AlertModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Alert: Alert +}); + +const i18n = { + es: { + close: "Cerrar", + confirm: "Confirmar", + cancel: "Cancelar", + search: "Buscar...", + loading: "Cargando...", + nodata: "Sin datos" + }, + en: { + close: "Close", + confirm: "Confirm", + cancel: "Cancel", + search: "Search...", + loading: "Loading...", + nodata: "No data" + } +}; + +const currentLocale = sigpro.$("es"); + +const tt = t => () => i18n[currentLocale()][t] || t; + +/** INPUT */ +const Input = (props) => { + const { label, tip, value, error, isSearch, icon, type = "text", ...rest } = props; + const isPassword = type === "password"; + const visible = sigpro.$(false); + + const iconsByType = { + text: iconAbc, + password: iconLock, + date: iconCalendar, + number: icon123, + email: iconMail, + }; + + const inputEl = sigpro.$html("input", { + ...rest, + type: () => (isPassword ? (visible() ? "text" : "password") : type), + placeholder: props.placeholder || label || (isSearch ? tt("search")() : " "), + 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] ? sigpro.$html("img", { src: iconsByType[type], class: "opacity-50", alt: type }) : null; + + return sigpro.$html( + "label", + { + class: () => joinClass("input input-bordered floating-label flex items-center gap-2 w-full relative", val(error) ? "input-error" : ""), + }, + [ + leftIcon ? sigpro.$html("div", { class: "order-1 shrink-0" }, leftIcon) : null, + label ? sigpro.$html("span", { class: "text-base-content/60 order-0" }, label) : null, + inputEl, + isPassword + ? sigpro.$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()); + }, + }, + () => + sigpro.$html("img", { + class: "w-5 h-5", + src: visible() ? iconShow : iconHide, + }), + ) + : null, + tip + ? sigpro.$html( + "div", + { class: "tooltip tooltip-left order-4", "data-tip": tip }, + sigpro.$html("span", { class: "badge badge-ghost badge-xs cursor-help" }, "?"), + ) + : null, + () => (val(error) ? sigpro.$html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val(error)) : null), + ], + ); +}; + +var InputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Input: Input +}); + +/** AUTOCOMPLETE */ +const Autocomplete = (props) => { + const { options = [], value, onSelect, label, placeholder, ...rest } = props; + + const query = sigpro.$(val(value) || ""); + const isOpen = sigpro.$(false); + const cursor = sigpro.$(-1); + + const list = sigpro.$(() => { + const q = query().toLowerCase(); + const data = val(options) || []; + return q + ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) + : data; + }); + + const pick = (opt) => { + const valStr = typeof opt === "string" ? opt : opt.value; + const labelStr = typeof opt === "string" ? opt : opt.label; + + query(labelStr); + if (typeof value === "function") value(valStr); + onSelect?.(opt); + + isOpen(false); + cursor(-1); + }; + + const nav = (e) => { + const items = list(); + if (e.key === "ArrowDown") { + e.preventDefault(); + isOpen(true); + cursor(Math.min(cursor() + 1, items.length - 1)); + } else if (e.key === "ArrowUp") { + e.preventDefault(); + cursor(Math.max(cursor() - 1, 0)); + } else if (e.key === "Enter" && cursor() >= 0) { + e.preventDefault(); + pick(items[cursor()]); + } else if (e.key === "Escape") { + isOpen(false); + } + }; + + return sigpro.$html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || tt("search")(), + 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); + isOpen(true); + cursor(-1); + }, + ...rest, + }), + sigpro.$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: () => (isOpen() && list().length ? "display:block" : "display:none"), + }, + [ + sigpro.$for( + list, + (opt, i) => + sigpro.$html("li", {}, [ + sigpro.$html( + "a", + { + class: () => `block w-full ${cursor() === i ? "active bg-primary text-primary-content" : ""}`, + onclick: () => pick(opt), + onmouseenter: () => cursor(i), + }, + typeof opt === "string" ? opt : opt.label, + ), + ]), + (opt, i) => (typeof opt === "string" ? opt : opt.value) + i, + ), + () => (list().length ? null : sigpro.$html("li", { class: "p-2 text-center opacity-50" }, "No results")), + ], + ), + ]); +}; + +var AutocompleteModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Autocomplete: Autocomplete +}); + +/** BADGE */ +const Badge = (props, children) => + sigpro.$html("span", { ...props, class: joinClass("badge", props.class) }, children); + +var BadgeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Badge: Badge +}); + +/** BUTTON */ +const Button = (props, children) => { + const { badge, badgeClass, tooltip, icon, loading, ...rest } = props; + + const btn = sigpro.$html( + "button", + { + ...rest, + // Usamos props.class directamente + class: joinClass("btn", props.class), + disabled: () => val(loading) || val(props.disabled), + }, + [ + () => (val(loading) ? sigpro.$html("span", { class: "loading loading-spinner" }) : null), + icon ? sigpro.$html("span", { class: "mr-1" }, icon) : null, + children, + ] + ); + + let out = btn; + + if (badge) { + out = sigpro.$html("div", { class: "indicator" }, [ + sigpro.$html( + "span", + { class: joinClass("indicator-item badge", badgeClass || "badge-secondary") }, + badge + ), + out, + ]); + } + + return tooltip + ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, out) + : out; +}; + +var ButtonModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Button: Button +}); + +/** CHECKBOX */ +const Checkbox = (props) => { + const { value, tooltip, toggle, label, ...rest } = props; + + const checkEl = sigpro.$html("input", { + ...rest, + type: "checkbox", + class: () => (val(toggle) ? "toggle" : "checkbox"), + checked: value + }); + + const layout = sigpro.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + checkEl, + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var CheckboxModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Checkbox: Checkbox +}); + +/** COLORPICKER */ +const Colorpicker = (props) => { + const { value, label, ...rest } = props; + const isOpen = sigpro.$(false); + + const palette = [ + ...["#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"], + ]; + + const getColor = () => val(value) || "#000000"; + + return sigpro.$html("div", { class: "relative w-fit" }, [ + sigpro.$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: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }, + [ + sigpro.$html("div", { + class: "size-5 rounded-sm shadow-inner border border-black/10 shrink-0", + style: () => `background-color: ${getColor()}`, + }), + label ? sigpro.$html("span", { class: "opacity-80" }, label) : null, + ], + ), + + sigpro.$if(isOpen, () => + sigpro.$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: (e) => e.stopPropagation(), + }, + [ + sigpro.$html( + "div", + { class: "grid grid-cols-8 gap-1" }, + palette.map((c) => + sigpro.$html("button", { + type: "button", + style: `background-color: ${c}`, + class: () => { + const active = getColor().toLowerCase() === c.toLowerCase(); + return `size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 + ${active ? "ring-2 ring-offset-1 ring-primary z-10 scale-110" : ""}`; + }, + onclick: () => { + if (typeof value === "function") value(c); + isOpen(false); + }, + }), + ), + ), + ], + ), + ), + + sigpro.$if(isOpen, () => + sigpro.$html("div", { + class: "fixed inset-0 z-[100]", + onclick: () => isOpen(false), + }), + ), + ]); +}; + +var ColorpickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Colorpicker: Colorpicker +}); + +/** DATEPICKER */ +const Datepicker = (props) => { + const { value, range, label, placeholder, hour = false, ...rest } = props; + + const isOpen = sigpro.$(false); + const internalDate = sigpro.$(new Date()); + const hoverDate = sigpro.$(null); + const startHour = sigpro.$(0); + const endHour = sigpro.$(0); + const isRangeMode = () => val(range) === true; + + const now = new Date(); + const todayStr = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")}`; + + const formatDate = (d) => { + const year = d.getFullYear(); + const month = String(d.getMonth() + 1).padStart(2, "0"); + const day = String(d.getDate()).padStart(2, "0"); + return `${year}-${month}-${day}`; + }; + + const selectDate = (date) => { + const dateStr = formatDate(date); + const current = val(value); + + if (isRangeMode()) { + if (!current?.start || (current.start && current.end)) { + if (typeof value === "function") { + value({ + start: dateStr, + end: null, + ...(hour && { startHour: startHour() }), + }); + } + } else { + const start = current.start; + if (typeof value === "function") { + const newValue = dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }; + if (hour) { + newValue.startHour = current.startHour || startHour(); + newValue.endHour = current.endHour || endHour(); + } + value(newValue); + } + isOpen(false); + } + } else { + if (typeof value === "function") { + value(hour ? `${dateStr}T${String(startHour()).padStart(2, "0")}:00:00` : dateStr); + } + isOpen(false); + } + }; + + const displayValue = sigpro.$(() => { + const v = val(value); + if (!v) return ""; + if (typeof v === "string") { + if (hour && v.includes("T")) return v.replace("T", " "); + return v; + } + if (v.start && v.end) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end; + return `${startStr} - ${endStr}`; + } + if (v.start) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + return `${startStr}...`; + } + return ""; + }); + + const move = (m) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear(), d.getMonth() + m, 1)); + }; + + const moveYear = (y) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear() + y, d.getMonth(), 1)); + }; + + const HourSlider = ({ value: hVal, onChange }) => { + return sigpro.$html("div", { class: "flex-1" }, [ + sigpro.$html("div", { class: "flex gap-2 items-center" }, [ + sigpro.$html("input", { + type: "range", + min: 0, + max: 23, + value: hVal, + class: "range range-xs flex-1", + oninput: (e) => { + const newHour = parseInt(e.target.value); + onChange(newHour); + }, + }), + sigpro.$html("span", { class: "text-sm font-mono min-w-[48px] text-center" }, + () => String(val(hVal)).padStart(2, "0") + ":00" + ), + ]), + ]); + }; + + return sigpro.$html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."), + value: displayValue, + readonly: true, + icon: sigpro.$html("img", { src: iconCalendar, class: "opacity-40" }), + onclick: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }), + + sigpro.$if(isOpen, () => + sigpro.$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: (e) => e.stopPropagation(), + }, + [ + sigpro.$html("div", { class: "flex justify-between items-center mb-4 gap-1" }, [ + sigpro.$html("div", { class: "flex gap-0.5" }, [ + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(-1) }, + sigpro.$html("img", { src: iconLLeft, class: "opacity-40" }) + ), + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(-1) }, + sigpro.$html("img", { src: iconLeft, class: "opacity-40" }) + ), + ]), + sigpro.$html("span", { class: "font-bold uppercase flex-1 text-center" }, [ + () => internalDate().toLocaleString("es-ES", { month: "short", year: "numeric" }), + ]), + sigpro.$html("div", { class: "flex gap-0.5" }, [ + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(1) }, + sigpro.$html("img", { src: iconRight, class: "opacity-40" }) + ), + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(1) }, + sigpro.$html("img", { src: iconRRight, class: "opacity-40" }) + ), + ]), + ]), + + sigpro.$html("div", { class: "grid grid-cols-7 gap-1", onmouseleave: () => hoverDate(null) }, [ + ...["L", "M", "X", "J", "V", "S", "D"].map((d) => sigpro.$html("div", { class: "text-[10px] opacity-40 font-bold text-center" }, d)), + () => { + const d = internalDate(); + const year = d.getFullYear(); + const month = d.getMonth(); + const firstDay = new Date(year, month, 1).getDay(); + const offset = firstDay === 0 ? 6 : firstDay - 1; + const daysInMonth = new Date(year, month + 1, 0).getDate(); + + const nodes = []; + for (let i = 0; i < offset; i++) nodes.push(sigpro.$html("div")); + + for (let i = 1; i <= daysInMonth; i++) { + const date = new Date(year, month, i); + const dStr = formatDate(date); + + nodes.push( + sigpro.$html( + "button", + { + type: "button", + class: () => { + const v = val(value); + const h = hoverDate(); + const isStart = typeof v === "string" ? v.split("T")[0] === dStr : v?.start === dStr; + const isEnd = v?.end === dStr; + let inRange = false; + + if (isRangeMode() && v?.start) { + const start = v.start; + if (!v.end && h) { + inRange = (dStr > start && dStr <= h) || (dStr < start && dStr >= h); + } else if (v.end) { + inRange = dStr > start && dStr < v.end; + } + } + + const base = "btn btn-xs p-0 aspect-square min-h-0 h-auto font-normal relative"; + const state = isStart || isEnd ? "btn-primary z-10" : inRange ? "bg-primary/20 border-none rounded-none" : "btn-ghost"; + const today = dStr === todayStr ? "ring-1 ring-primary ring-inset font-black text-primary" : ""; + + return `${base} ${state} ${today}`; + }, + onmouseenter: () => { if (isRangeMode()) hoverDate(dStr); }, + onclick: () => selectDate(date), + }, + [i.toString()], + ), + ); + } + return nodes; + }, + ]), + + hour ? sigpro.$html("div", { class: "mt-3 pt-2 border-t border-base-300" }, [ + isRangeMode() + ? sigpro.$html("div", { class: "flex gap-4" }, [ + HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal?.start) value({ ...currentVal, startHour: newHour }); + }, + }), + HourSlider({ + value: endHour, + onChange: (newHour) => { + endHour(newHour); + const currentVal = val(value); + if (currentVal?.end) value({ ...currentVal, endHour: newHour }); + }, + }), + ]) + : HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) { + value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00"); + } + }, + }), + ]) : null, + ], + ), + ), + + sigpro.$if(isOpen, () => sigpro.$html("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })), + ]); +}; + +var DatepickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Datepicker: Datepicker +}); + +/** DRAWER */ +const Drawer = (props) => + sigpro.$html("div", { class: joinClass("drawer", props.class) }, [ + sigpro.$html("input", { + id: props.id, + type: "checkbox", + class: "drawer-toggle", + checked: props.open, + }), + sigpro.$html("div", { class: "drawer-content" }, props.content), + sigpro.$html("div", { class: "drawer-side" }, [ + sigpro.$html("label", { for: props.id, class: "drawer-overlay", onclick: () => props.open?.(false) }), + sigpro.$html("div", { class: "min-h-full bg-base-200 w-80" }, props.side), + ]), + ]); + +var DrawerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Drawer: Drawer +}); + +/** DROPDOWN */ +const Dropdown = (props, children) => { + const { label, icon, ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `dropdown ${val(props.class) || props.class || ""}`, + }, + [ + sigpro.$html( + "div", + { + tabindex: 0, + role: "button", + class: "btn m-1 flex items-center gap-2", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + label ? (typeof label === "function" ? label() : label) : null + ], + ), + sigpro.$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", + }, + [typeof children === "function" ? children() : children], + ), + ], + ); +}; + +var DropdownModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Dropdown: Dropdown +}); + +/** FAB (Floating Action Button) */ +const Fab = (props) => { + const { icon, label, actions = [], position = "bottom-6 right-6", ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `fab fixed ${val(position)} flex flex-col-reverse items-end gap-3 z-[100] ${ + props.class || "" + }`, + }, + [ + // Botón principal + sigpro.$html( + "div", + { + tabindex: 0, + role: "button", + class: "btn btn-lg btn-circle btn-primary shadow-2xl", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + !icon && label ? label : null + ], + ), + + // Acciones secundarias (se despliegan hacia arriba) + ...val(actions).map((act) => + sigpro.$html("div", { class: "flex items-center gap-3 transition-all duration-300" }, [ + act.label ? sigpro.$html("span", { class: "badge badge-ghost shadow-sm whitespace-nowrap" }, act.label) : null, + sigpro.$html( + "button", + { + type: "button", + class: `btn btn-circle shadow-lg ${act.class || ""}`, + onclick: (e) => { + e.stopPropagation(); + act.onclick?.(e); + }, + }, + [act.icon ? (typeof act.icon === "function" ? act.icon() : act.icon) : act.text || ""], + ), + ]), + ), + ], + ); +}; + +var FabModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fab: Fab +}); + +/** FIELDSET */ +const Fieldset = (props, children) => + sigpro.$html( + "fieldset", + { + ...props, + class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.class), + }, + [ + () => { + const legendText = val(props.legend); + return legendText ? sigpro.$html("legend", { class: "fieldset-legend font-bold" }, [legendText]) : null; + }, + children, + ], + ); + +var FieldsetModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fieldset: Fieldset +}); + +/** FILEINPUT */ +const Fileinput = (props) => { + const { tooltip, max = 2, accept = "*", onSelect } = props; + + const selectedFiles = sigpro.$([]); + const isDragging = sigpro.$(false); + const error = sigpro.$(null); + const MAX_BYTES = max * 1024 * 1024; + + const handleFiles = (files) => { + const fileList = Array.from(files); + error(null); + const oversized = fileList.find((f) => f.size > MAX_BYTES); + + if (oversized) { + error(`Máx ${max}MB`); + return; + } + + selectedFiles([...selectedFiles(), ...fileList]); + onSelect?.(selectedFiles()); + }; + + const removeFile = (index) => { + const updated = selectedFiles().filter((_, i) => i !== index); + selectedFiles(updated); + onSelect?.(updated); + }; + + return sigpro.$html("fieldset", { class: "fieldset w-full p-0" }, [ + sigpro.$html( + "div", + { + class: () => `w-full ${tooltip ? "tooltip tooltip-top before:z-50 after:z-50" : ""}`, + "data-tip": tooltip, + }, + [ + sigpro.$html( + "label", + { + class: () => ` + relative flex items-center justify-between w-full h-12 px-4 + border-2 border-dashed rounded-lg cursor-pointer + transition-all duration-200 + ${isDragging() ? "border-primary bg-primary/10" : "border-base-content/20 bg-base-100 hover:bg-base-200"} + `, + ondragover: (e) => { + e.preventDefault(); + isDragging(true); + }, + ondragleave: () => isDragging(false), + ondrop: (e) => { + e.preventDefault(); + isDragging(false); + handleFiles(e.dataTransfer.files); + }, + }, + [ + sigpro.$html("div", { class: "flex items-center gap-3 w-full" }, [ + sigpro.$html("img", { src: iconUpload, class: "w-5 h-5 opacity-50 shrink-0" }), + sigpro.$html("span", { class: "text-sm opacity-70 truncate grow text-left" }, "Arrastra o selecciona archivos..."), + sigpro.$html("span", { class: "text-[10px] opacity-40 shrink-0" }, `Máx ${max}MB`), + ]), + sigpro.$html("input", { + type: "file", + multiple: true, + accept: accept, + class: "hidden", + onchange: (e) => handleFiles(e.target.files), + }), + ], + ), + ], + ), + + () => (error() ? sigpro.$html("span", { class: "text-[10px] text-error mt-1 px-1 font-medium" }, error()) : null), + + sigpro.$if( + () => selectedFiles().length > 0, + () => + sigpro.$html("ul", { class: "mt-2 space-y-1" }, [ + sigpro.$for( + selectedFiles, + (file, index) => + sigpro.$html("li", { class: "flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300" }, [ + sigpro.$html("div", { class: "flex items-center gap-2 truncate" }, [ + sigpro.$html("span", { class: "opacity-50" }, "📄"), + sigpro.$html("span", { class: "truncate font-medium max-w-[200px]" }, file.name), + sigpro.$html("span", { class: "text-[9px] opacity-40" }, `(${(file.size / 1024).toFixed(0)} KB)`), + ]), + sigpro.$html( + "button", + { + type: "button", + class: "btn btn-ghost btn-xs btn-circle", + onclick: (e) => { + e.preventDefault(); + e.stopPropagation(); + removeFile(index); + }, + }, + [sigpro.$html("img", { src: iconClose, class: "w-3 h-3 opacity-70" })], + ), + ]), + (file) => file.name + file.lastModified, + ), + ]), + ), + ]); +}; + +var FileinputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fileinput: Fileinput +}); + +/** INDICATOR */ +const Indicator = (props, children) => + sigpro.$html("div", { class: joinClass("indicator", props.class) }, [ + children, + sigpro.$html("span", { class: joinClass("indicator-item badge", props.badgeClass) }, props.badge), + ]); + +var IndicatorModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Indicator: Indicator +}); + +/** LIST */ +const List = (props) => { + const { items, header, render, keyFn, class: className } = props; + + return sigpro.$html( + "ul", + { + class: joinClass("list bg-base-100 rounded-box shadow-md", className), + }, + [ + sigpro.$if(header, () => sigpro.$html("li", { class: "p-4 pb-2 text-xs opacity-60 tracking-wide" }, [val(header)])), + sigpro.$for(items, (item, index) => sigpro.$html("li", { class: "list-row" }, [render(item, index)]), keyFn), + ], + ); +}; + +var ListModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + List: List +}); + +/** LOADING (Overlay Component) */ +const Loading = (props) => { + // Se espera un signal props.$show para controlar la visibilidad + return sigpro.$if(props.$show, () => + sigpro.$html("div", { + class: "fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30" + }, [ + sigpro.$html("span", { class: "loading loading-spinner loading-lg text-primary" }), + ]), + ); +}; + +var LoadingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Loading: Loading +}); + +/** MENU */ +const Menu = (props) => { + const renderItems = (items) => + sigpro.$for( + () => items || [], + (it) => + sigpro.$html("li", {}, [ + it.children + ? sigpro.$html("details", { open: it.open }, [ + sigpro.$html("summary", {}, [it.icon && sigpro.$html("span", { class: "mr-2" }, it.icon), it.label]), + sigpro.$html("ul", {}, renderItems(it.children)), + ]) + : sigpro.$html("a", { class: () => (val(it.active) ? "active" : ""), onclick: it.onclick }, [ + it.icon && sigpro.$html("span", { class: "mr-2" }, it.icon), + it.label, + ]), + ]), + (it, i) => it.label || i, + ); + + return sigpro.$html("ul", { ...props, class: joinClass("menu bg-base-200 rounded-box", props.class) }, renderItems(props.items)); +}; + +var MenuModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Menu: Menu +}); + +/** MODAL */ +const Modal = (props, children) => { + const { title, buttons, open, ...rest } = props; + const close = () => open(false); + + return sigpro.$if(open, () => + sigpro.$html("dialog", { ...rest, class: "modal modal-open" }, [ + sigpro.$html("div", { class: "modal-box" }, [ + title ? sigpro.$html("h3", { class: "text-lg font-bold mb-4" }, title) : null, + typeof children === "function" ? children() : children, + sigpro.$html("div", { class: "modal-action flex gap-2" }, [ + ...(Array.isArray(buttons) ? buttons : [buttons]).filter(Boolean), + Button({ onclick: close }, tt("close")()), + ]), + ]), + sigpro.$html( + "form", + { + method: "dialog", + class: "modal-backdrop", + onclick: (e) => (e.preventDefault(), close()), + }, + [sigpro.$html("button", {}, "close")], + ), + ]), + ); +}; + +var ModalModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Modal: Modal +}); + +/** NAVBAR */ +const Navbar = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.class) }, children); + +var NavbarModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Navbar: Navbar +}); + +/** RADIO */ +const Radio = (props) => { + const { label, tooltip, value, ...rest } = props; + + const radioEl = sigpro.$html("input", { + ...rest, + type: "radio", + class: joinClass("radio", props.class), + checked: () => val(value) === props.value, + disabled: () => val(props.disabled), + onclick: () => typeof value === "function" && value(props.value), + }); + + if (!label && !tooltip) return radioEl; + + const layout = sigpro.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + radioEl, + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var RadioModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Radio: Radio +}); + +/** RANGE */ +const Range = (props) => { + const { label, tooltip, value, ...rest } = props; + + const rangeEl = sigpro.$html("input", { + ...rest, + type: "range", + class: joinClass("range", props.class), + value: value, + disabled: () => val(props.disabled) + }); + + if (!label && !tooltip) return rangeEl; + + const layout = sigpro.$html("div", { class: "flex flex-col gap-2" }, [ + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + rangeEl + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var RangeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Range: Range +}); + +/** RATING */ +const Rating = (props) => { + const { value, count = 5, mask = "mask-star", readonly = false, ...rest } = props; + + // Generamos un ID único para el grupo de radio buttons + const ratingGroup = `rating-${Math.random().toString(36).slice(2, 7)}`; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}`, + }, + Array.from({ length: val(count) }, (_, i) => { + const starValue = i + 1; + + return sigpro.$html("input", { + type: "radio", + name: ratingGroup, + class: `mask ${mask}`, + "aria-label": `${starValue} star`, + checked: () => Math.round(val(value)) === starValue, + onchange: () => { + if (!val(readonly) && typeof value === "function") { + value(starValue); + } + }, + }); + }) + ); +}; + +var RatingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Rating: Rating +}); + +/** SELECT */ +const Select = (props) => { + const { label, options, value, ...rest } = props; + + const selectEl = sigpro.$html( + "select", + { + ...rest, + class: joinClass("select select-bordered w-full", props.class), + value: value + }, + sigpro.$for( + () => val(options) || [], + (opt) => + sigpro.$html( + "option", + { + value: opt.value, + $selected: () => String(val(value)) === String(opt.value), + }, + opt.label, + ), + (opt) => opt.value, + ), + ); + + if (!label) return selectEl; + + return sigpro.$html("label", { class: "fieldset-label flex flex-col gap-1" }, [ + sigpro.$html("span", {}, label), + selectEl + ]); +}; + +var SelectModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Select: Select +}); + +/** STACK */ +const Stack = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("stack", props.class) }, children); + +var StackModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stack: Stack +}); + +/** STAT */ +const Stat = (props) => + sigpro.$html("div", { ...props, class: joinClass("stat", props.class) }, [ + props.icon && sigpro.$html("div", { class: "stat-figure text-secondary" }, props.icon), + props.label && sigpro.$html("div", { class: "stat-title" }, props.label), + sigpro.$html("div", { class: "stat-value" }, () => val(props.value) ?? props.value), + props.desc && sigpro.$html("div", { class: "stat-desc" }, props.desc), + ]); + +var StatModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stat: Stat +}); + +/** SWAP */ +const Swap = (props) => + sigpro.$html("label", { class: joinClass("swap", props.class) }, [ + sigpro.$html("input", { + type: "checkbox", + checked: props.value + }), + sigpro.$html("div", { class: "swap-on" }, props.on), + sigpro.$html("div", { class: "swap-off" }, props.off), + ]); + +var SwapModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Swap: Swap +}); + +/** TABLE */ +const Table = (props) => { + const { + items = [], + columns = [], + keyFn, + zebra = false, + pinRows = false, + empty = tt("nodata")(), + ...rest + } = props; + + const tableClass = () => joinClass( + "table", + `${val(zebra) ? "table-zebra" : ""} ${val(pinRows) ? "table-pin-rows" : ""} ${props.class || ""}` + ); + + return sigpro.$html("div", { class: "overflow-x-auto w-full bg-base-100 rounded-box border border-base-300" }, [ + sigpro.$html("table", { ...rest, class: tableClass }, [ + sigpro.$html("thead", {}, [ + sigpro.$html("tr", {}, + columns.map(col => sigpro.$html("th", { class: col.class || "" }, col.label)) + ) + ]), + sigpro.$html("tbody", {}, [ + sigpro.$for(items, (item, index) => { + return sigpro.$html("tr", { class: "hover" }, + columns.map(col => { + const cellContent = () => { + if (col.render) return col.render(item, index); + const value = item[col.key]; + return val(value); + }; + return sigpro.$html("td", { class: col.class || "" }, [cellContent]); + }) + ); + }, keyFn || ((item, idx) => item.id || idx)), + + sigpro.$if(() => val(items).length === 0, () => + sigpro.$html("tr", {}, [ + sigpro.$html("td", { colspan: columns.length, class: "text-center p-10 opacity-50" }, [ + val(empty) + ]) + ]) + ) + ]), + sigpro.$if(() => columns.some(c => c.footer), () => + sigpro.$html("tfoot", {}, [ + sigpro.$html("tr", {}, + columns.map(col => sigpro.$html("th", {}, col.footer || "")) + ) + ]) + ) + ]) + ]); +}; + +var TableModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Table: Table +}); + +/** TABS */ +const Tabs = (props) => { + const { items, ...rest } = props; + const itemsSignal = typeof items === "function" ? items : () => items || []; + + return sigpro.$html("div", { ...rest, class: "flex flex-col gap-4 w-full" }, [ + sigpro.$html( + "div", + { + role: "tablist", + class: joinClass("tabs tabs-box", props.class), + }, + sigpro.$for( + itemsSignal, + (it) => + sigpro.$html( + "a", + { + role: "tab", + class: () => joinClass( + "tab", + val(it.active) && "tab-active", + val(it.disabled) && "tab-disabled", + it.tip && "tooltip" + ), + "data-tip": it.tip, + onclick: (e) => !val(it.disabled) && it.onclick?.(e), + }, + it.label, + ), + (t) => t.label, + ), + ), + () => { + const active = itemsSignal().find((it) => val(it.active)); + if (!active) return null; + const content = val(active.content); + return sigpro.$html("div", { class: "p-4" }, [ + typeof content === "function" ? content() : content + ]); + }, + ]); +}; + +var TabsModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tabs: Tabs +}); + +/** TIMELINE */ +const Timeline = (props) => { + const { items = [], vertical = true, compact = false, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + return sigpro.$html( + "ul", + { + ...rest, + class: () => + `timeline ${val(vertical) ? "timeline-vertical" : "timeline-horizontal"} ${ + val(compact) ? "timeline-compact" : "" + } ${props.class || ""}`, + }, + [ + sigpro.$for( + items, + (item, i) => { + const isFirst = i === 0; + const isLast = i === val(items).length - 1; + const itemType = item.type || "success"; + const renderSlot = (content) => (typeof content === "function" ? content() : content); + + return sigpro.$html("li", { class: "flex-1" }, [ + !isFirst ? sigpro.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + sigpro.$html("div", { class: "timeline-start" }, [renderSlot(item.title)]), + sigpro.$html("div", { class: "timeline-middle" }, [ + sigpro.$html("img", { + src: icons[itemType] || item.icon || icons.success, + class: "w-4 h-4 object-contain mx-1", + alt: itemType, + }), + ]), + sigpro.$html("div", { class: "timeline-end timeline-box shadow-sm" }, [renderSlot(item.detail)]), + !isLast ? sigpro.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + ]); + }, + (item, i) => item.id || i, + ), + ], + ); +}; + +var TimelineModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Timeline: Timeline +}); + +/** TOAST (Imperative Function) */ +const Toast = (message, type = "alert-success", duration = 3500) => { + let container = document.getElementById("sigpro-toast-container"); + + // Crear el contenedor global si no existe + if (!container) { + container = sigpro.$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(container); + } + + const toastHost = sigpro.$html("div", { style: "display: contents" }); + container.appendChild(toastHost); + + let timeoutId; + + const close = () => { + clearTimeout(timeoutId); + const el = toastHost.firstElementChild; + if (el && !el.classList.contains("opacity-0")) { + el.classList.add("translate-x-full", "opacity-0"); + setTimeout(() => { + instance.destroy(); + toastHost.remove(); + // Limpiar el contenedor si ya no hay más toasts + if (!container.hasChildNodes()) container.remove(); + }, 300); + } else { + instance.destroy(); + toastHost.remove(); + } + }; + + const ToastComponent = () => { + const el = sigpro.$html( + "div", + { + class: `alert alert-soft ${type} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`, + }, + [ + sigpro.$html("span", {}, [typeof message === "function" ? message() : message]), + Button({ class: "btn-xs btn-circle btn-ghost", onclick: close }, "✕") + ], + ); + + // Animación de entrada + requestAnimationFrame(() => el.classList.remove("translate-x-10", "opacity-0")); + return el; + }; + + const instance = sigpro.$mount(ToastComponent, toastHost); + + if (duration > 0) { + timeoutId = setTimeout(close, duration); + } + + return close; +}; + +var ToastModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Toast: Toast +}); + +/** TOOLTIP */ +const Tooltip = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("tooltip", props.class), "data-tip": props.tip }, children); + +var TooltipModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tooltip: Tooltip +}); + +const Components = { + ...AccordionModule, + ...AlertModule, + ...AutocompleteModule, + ...BadgeModule, + ...ButtonModule, + ...CheckboxModule, + ...ColorpickerModule, + ...DatepickerModule, + ...DrawerModule, + ...DropdownModule, + ...FabModule, + ...FieldsetModule, + ...FileinputModule, + ...IndicatorModule, + ...InputModule, + ...ListModule, + ...LoadingModule, + ...MenuModule, + ...ModalModule, + ...NavbarModule, + ...RadioModule, + ...RangeModule, + ...RatingModule, + ...SelectModule, + ...StackModule, + ...StatModule, + ...SwapModule, + ...TableModule, + ...TabsModule, + ...TimelineModule, + ...ToastModule, + ...TooltipModule +}; + +var index = { + ...Components, + install: (target = window) => { + Object.entries(Components).forEach(([name, component]) => { + target[name] = component; + }); + console.log("🚀 SigproUI"); + } +}; + +var Components$1 = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion, + Alert: Alert, + Autocomplete: Autocomplete, + Badge: Badge, + Button: Button, + Checkbox: Checkbox, + Colorpicker: Colorpicker, + Datepicker: Datepicker, + Drawer: Drawer, + Dropdown: Dropdown, + Fab: Fab, + Fieldset: Fieldset, + Fileinput: Fileinput, + Indicator: Indicator, + Input: Input, + List: List, + Loading: Loading, + Menu: Menu, + Modal: Modal, + Navbar: Navbar, + Radio: Radio, + Range: Range, + Rating: Rating, + Select: Select, + Stack: Stack, + Stat: Stat, + Swap: Swap, + Table: Table, + Tabs: Tabs, + Timeline: Timeline, + Toast: Toast, + Tooltip: Tooltip, + default: index +}); + +/** + * SigproUI - Entry Point + */ + + +const SigproUI = { + ...Components$1, + Icons, + Utils, + tt, + + install: (target = (typeof window !== 'undefined' ? window : {})) => { + Object.entries(Components$1).forEach(([name, component]) => { + target[name] = component; + }); + + target.Icons = Icons; + target.Utils = Utils; + target.tt = tt; + + console.log("🌟 SigproUI"); + } +}; + +exports.Accordion = Accordion; +exports.Alert = Alert; +exports.Autocomplete = Autocomplete; +exports.Badge = Badge; +exports.Button = Button; +exports.Checkbox = Checkbox; +exports.Colorpicker = Colorpicker; +exports.Datepicker = Datepicker; +exports.Drawer = Drawer; +exports.Dropdown = Dropdown; +exports.Fab = Fab; +exports.Fieldset = Fieldset; +exports.Fileinput = Fileinput; +exports.Indicator = Indicator; +exports.Input = Input; +exports.List = List; +exports.Loading = Loading; +exports.Menu = Menu; +exports.Modal = Modal; +exports.Navbar = Navbar; +exports.Radio = Radio; +exports.Range = Range; +exports.Rating = Rating; +exports.Select = Select; +exports.Stack = Stack; +exports.Stat = Stat; +exports.Swap = Swap; +exports.Table = Table; +exports.Tabs = Tabs; +exports.Timeline = Timeline; +exports.Toast = Toast; +exports.Tooltip = Tooltip; +exports.default = SigproUI; +exports.icon123 = icon123; +exports.iconAbc = iconAbc; +exports.iconCalendar = iconCalendar; +exports.iconClose = iconClose; +exports.iconError = iconError; +exports.iconHide = iconHide; +exports.iconInfo = iconInfo; +exports.iconLLeft = iconLLeft; +exports.iconLeft = iconLeft; +exports.iconLock = iconLock; +exports.iconMail = iconMail; +exports.iconRRight = iconRRight; +exports.iconRight = iconRight; +exports.iconShow = iconShow; +exports.iconSuccess = iconSuccess; +exports.iconUpload = iconUpload; +exports.iconWarning = iconWarning; +exports.joinClass = joinClass; +exports.tt = tt; +exports.val = val; diff --git a/dist/sigpro-ui.esm.js b/dist/sigpro-ui.esm.js new file mode 100644 index 0000000..da9fc33 --- /dev/null +++ b/dist/sigpro-ui.esm.js @@ -0,0 +1,1617 @@ +import { $html, $, $for, $if, $mount } from 'sigpro'; + +const val = t => typeof t === "function" ? t() : t; + +const joinClass = (t, l) => typeof l === "function" + ? () => `${t} ${l() || ""}`.trim() + : `${t} ${l || ""}`.trim(); + +var Utils = /*#__PURE__*/Object.freeze({ + __proto__: null, + joinClass: joinClass, + val: val +}); + +/** ACCORDION */ +const Accordion = (props, children) => { + const { title, name, open, ...rest } = props; + + return $html( + "div", + { + ...rest, + class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class), + }, + [ + $html("input", { + type: name ? "radio" : "checkbox", + name: name, + checked: open + }), + $html("div", { class: "collapse-title text-xl font-medium" }, title), + $html("div", { class: "collapse-content" }, children), + ], + ); +}; + +var AccordionModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion +}); + +const iconShow = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg=="; +const iconHide = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"; +const iconClose = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg=="; +const iconCalendar = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC"; +const iconLock = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII="; +const iconAbc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg=="; +const icon123 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg=="; +const iconMail = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"; +const iconInfo = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC"; +const iconSuccess = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg=="; +const iconError = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC"; +const iconWarning = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII="; +const iconLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg=="; +const iconRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg=="; +const iconLLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg=="; +const iconRRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII="; +const iconUpload = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC"; + +var Icons = /*#__PURE__*/Object.freeze({ + __proto__: null, + icon123: icon123, + iconAbc: iconAbc, + iconCalendar: iconCalendar, + iconClose: iconClose, + iconError: iconError, + iconHide: iconHide, + iconInfo: iconInfo, + iconLLeft: iconLLeft, + iconLeft: iconLeft, + iconLock: iconLock, + iconMail: iconMail, + iconRRight: iconRRight, + iconRight: iconRight, + iconShow: iconShow, + iconSuccess: iconSuccess, + iconUpload: iconUpload, + iconWarning: iconWarning +}); + +/** ALERT */ +const Alert = (props, children) => { + const { type = "info", soft = true, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + const typeClass = () => { + const t = val(type); + const map = { + info: "alert-info", + success: "alert-success", + warning: "alert-warning", + error: "alert-error", + }; + return map[t] || t; + }; + + const content = children || props.message; + + return $html( + "div", + { + ...rest, + role: "alert", + class: () => `alert ${typeClass()} ${val(soft) ? "alert-soft" : ""} ${props.class || ""}`, + }, + [ + $html("img", { + src: icons[val(type)] || icons.info, + class: "w-4 h-4 object-contain", + alt: val(type), + }), + $html("div", { class: "flex-1" }, [ + $html("span", {}, [typeof content === "function" ? content() : content]) + ]), + props.actions ? $html("div", { class: "flex-none" }, [ + typeof props.actions === "function" ? props.actions() : props.actions + ]) : null, + ], + ); +}; + +var AlertModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Alert: Alert +}); + +const i18n = { + es: { + close: "Cerrar", + confirm: "Confirmar", + cancel: "Cancelar", + search: "Buscar...", + loading: "Cargando...", + nodata: "Sin datos" + }, + en: { + close: "Close", + confirm: "Confirm", + cancel: "Cancel", + search: "Search...", + loading: "Loading...", + nodata: "No data" + } +}; + +const currentLocale = $("es"); + +const tt = t => () => i18n[currentLocale()][t] || t; + +/** INPUT */ +const Input = (props) => { + const { label, tip, value, error, isSearch, icon, type = "text", ...rest } = props; + const isPassword = type === "password"; + const visible = $(false); + + const iconsByType = { + text: iconAbc, + password: iconLock, + date: iconCalendar, + number: icon123, + email: iconMail, + }; + + const inputEl = $html("input", { + ...rest, + type: () => (isPassword ? (visible() ? "text" : "password") : type), + placeholder: props.placeholder || label || (isSearch ? tt("search")() : " "), + 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: "opacity-50", alt: type }) : null; + + return $html( + "label", + { + 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, + label ? $html("span", { class: "text-base-content/60 order-0" }, label) : null, + 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()); + }, + }, + () => + $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" }, "?"), + ) + : null, + () => (val(error) ? $html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val(error)) : null), + ], + ); +}; + +var InputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Input: Input +}); + +/** AUTOCOMPLETE */ +const Autocomplete = (props) => { + const { options = [], value, onSelect, label, placeholder, ...rest } = props; + + const query = $(val(value) || ""); + const isOpen = $(false); + const cursor = $(-1); + + const list = $(() => { + const q = query().toLowerCase(); + const data = val(options) || []; + return q + ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) + : data; + }); + + const pick = (opt) => { + const valStr = typeof opt === "string" ? opt : opt.value; + const labelStr = typeof opt === "string" ? opt : opt.label; + + query(labelStr); + if (typeof value === "function") value(valStr); + onSelect?.(opt); + + isOpen(false); + cursor(-1); + }; + + const nav = (e) => { + const items = list(); + if (e.key === "ArrowDown") { + e.preventDefault(); + isOpen(true); + cursor(Math.min(cursor() + 1, items.length - 1)); + } else if (e.key === "ArrowUp") { + e.preventDefault(); + cursor(Math.max(cursor() - 1, 0)); + } else if (e.key === "Enter" && cursor() >= 0) { + e.preventDefault(); + pick(items[cursor()]); + } else if (e.key === "Escape") { + isOpen(false); + } + }; + + return $html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || tt("search")(), + 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); + isOpen(true); + cursor(-1); + }, + ...rest, + }), + $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: () => (isOpen() && list().length ? "display:block" : "display:none"), + }, + [ + $for( + list, + (opt, i) => + $html("li", {}, [ + $html( + "a", + { + class: () => `block w-full ${cursor() === i ? "active bg-primary text-primary-content" : ""}`, + onclick: () => pick(opt), + onmouseenter: () => cursor(i), + }, + typeof opt === "string" ? opt : opt.label, + ), + ]), + (opt, i) => (typeof opt === "string" ? opt : opt.value) + i, + ), + () => (list().length ? null : $html("li", { class: "p-2 text-center opacity-50" }, "No results")), + ], + ), + ]); +}; + +var AutocompleteModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Autocomplete: Autocomplete +}); + +/** BADGE */ +const Badge = (props, children) => + $html("span", { ...props, class: joinClass("badge", props.class) }, children); + +var BadgeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Badge: Badge +}); + +/** BUTTON */ +const Button = (props, children) => { + const { badge, badgeClass, tooltip, icon, loading, ...rest } = props; + + const btn = $html( + "button", + { + ...rest, + // Usamos props.class directamente + class: joinClass("btn", props.class), + disabled: () => val(loading) || val(props.disabled), + }, + [ + () => (val(loading) ? $html("span", { class: "loading loading-spinner" }) : null), + icon ? $html("span", { class: "mr-1" }, icon) : null, + children, + ] + ); + + let out = btn; + + if (badge) { + out = $html("div", { class: "indicator" }, [ + $html( + "span", + { class: joinClass("indicator-item badge", badgeClass || "badge-secondary") }, + badge + ), + out, + ]); + } + + return tooltip + ? $html("div", { class: "tooltip", "data-tip": tooltip }, out) + : out; +}; + +var ButtonModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Button: Button +}); + +/** CHECKBOX */ +const Checkbox = (props) => { + const { value, tooltip, toggle, label, ...rest } = props; + + const checkEl = $html("input", { + ...rest, + type: "checkbox", + class: () => (val(toggle) ? "toggle" : "checkbox"), + checked: value + }); + + const layout = $html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + checkEl, + label ? $html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? $html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var CheckboxModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Checkbox: Checkbox +}); + +/** COLORPICKER */ +const Colorpicker = (props) => { + const { value, label, ...rest } = props; + const isOpen = $(false); + + const palette = [ + ...["#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"], + ]; + + const getColor = () => val(value) || "#000000"; + + return $html("div", { class: "relative w-fit" }, [ + $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: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }, + [ + $html("div", { + class: "size-5 rounded-sm shadow-inner border border-black/10 shrink-0", + style: () => `background-color: ${getColor()}`, + }), + label ? $html("span", { class: "opacity-80" }, label) : null, + ], + ), + + $if(isOpen, () => + $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: (e) => e.stopPropagation(), + }, + [ + $html( + "div", + { class: "grid grid-cols-8 gap-1" }, + palette.map((c) => + $html("button", { + type: "button", + style: `background-color: ${c}`, + class: () => { + const active = getColor().toLowerCase() === c.toLowerCase(); + return `size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 + ${active ? "ring-2 ring-offset-1 ring-primary z-10 scale-110" : ""}`; + }, + onclick: () => { + if (typeof value === "function") value(c); + isOpen(false); + }, + }), + ), + ), + ], + ), + ), + + $if(isOpen, () => + $html("div", { + class: "fixed inset-0 z-[100]", + onclick: () => isOpen(false), + }), + ), + ]); +}; + +var ColorpickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Colorpicker: Colorpicker +}); + +/** DATEPICKER */ +const Datepicker = (props) => { + const { value, range, label, placeholder, hour = false, ...rest } = props; + + const isOpen = $(false); + const internalDate = $(new Date()); + const hoverDate = $(null); + const startHour = $(0); + const endHour = $(0); + const isRangeMode = () => val(range) === true; + + const now = new Date(); + const todayStr = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")}`; + + const formatDate = (d) => { + const year = d.getFullYear(); + const month = String(d.getMonth() + 1).padStart(2, "0"); + const day = String(d.getDate()).padStart(2, "0"); + return `${year}-${month}-${day}`; + }; + + const selectDate = (date) => { + const dateStr = formatDate(date); + const current = val(value); + + if (isRangeMode()) { + if (!current?.start || (current.start && current.end)) { + if (typeof value === "function") { + value({ + start: dateStr, + end: null, + ...(hour && { startHour: startHour() }), + }); + } + } else { + const start = current.start; + if (typeof value === "function") { + const newValue = dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }; + if (hour) { + newValue.startHour = current.startHour || startHour(); + newValue.endHour = current.endHour || endHour(); + } + value(newValue); + } + isOpen(false); + } + } else { + if (typeof value === "function") { + value(hour ? `${dateStr}T${String(startHour()).padStart(2, "0")}:00:00` : dateStr); + } + isOpen(false); + } + }; + + const displayValue = $(() => { + const v = val(value); + if (!v) return ""; + if (typeof v === "string") { + if (hour && v.includes("T")) return v.replace("T", " "); + return v; + } + if (v.start && v.end) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end; + return `${startStr} - ${endStr}`; + } + if (v.start) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + return `${startStr}...`; + } + return ""; + }); + + const move = (m) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear(), d.getMonth() + m, 1)); + }; + + const moveYear = (y) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear() + y, d.getMonth(), 1)); + }; + + const HourSlider = ({ value: hVal, onChange }) => { + return $html("div", { class: "flex-1" }, [ + $html("div", { class: "flex gap-2 items-center" }, [ + $html("input", { + type: "range", + min: 0, + max: 23, + value: hVal, + class: "range range-xs flex-1", + oninput: (e) => { + const newHour = parseInt(e.target.value); + onChange(newHour); + }, + }), + $html("span", { class: "text-sm font-mono min-w-[48px] text-center" }, + () => String(val(hVal)).padStart(2, "0") + ":00" + ), + ]), + ]); + }; + + return $html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."), + value: displayValue, + readonly: true, + icon: $html("img", { src: iconCalendar, class: "opacity-40" }), + onclick: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }), + + $if(isOpen, () => + $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: (e) => e.stopPropagation(), + }, + [ + $html("div", { class: "flex justify-between items-center mb-4 gap-1" }, [ + $html("div", { class: "flex gap-0.5" }, [ + $html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(-1) }, + $html("img", { src: iconLLeft, class: "opacity-40" }) + ), + $html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(-1) }, + $html("img", { src: iconLeft, class: "opacity-40" }) + ), + ]), + $html("span", { class: "font-bold uppercase flex-1 text-center" }, [ + () => internalDate().toLocaleString("es-ES", { month: "short", year: "numeric" }), + ]), + $html("div", { class: "flex gap-0.5" }, [ + $html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(1) }, + $html("img", { src: iconRight, class: "opacity-40" }) + ), + $html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(1) }, + $html("img", { src: iconRRight, class: "opacity-40" }) + ), + ]), + ]), + + $html("div", { class: "grid grid-cols-7 gap-1", onmouseleave: () => hoverDate(null) }, [ + ...["L", "M", "X", "J", "V", "S", "D"].map((d) => $html("div", { class: "text-[10px] opacity-40 font-bold text-center" }, d)), + () => { + const d = internalDate(); + const year = d.getFullYear(); + const month = d.getMonth(); + const firstDay = new Date(year, month, 1).getDay(); + const offset = firstDay === 0 ? 6 : firstDay - 1; + const daysInMonth = new Date(year, month + 1, 0).getDate(); + + const nodes = []; + for (let i = 0; i < offset; i++) nodes.push($html("div")); + + for (let i = 1; i <= daysInMonth; i++) { + const date = new Date(year, month, i); + const dStr = formatDate(date); + + nodes.push( + $html( + "button", + { + type: "button", + class: () => { + const v = val(value); + const h = hoverDate(); + const isStart = typeof v === "string" ? v.split("T")[0] === dStr : v?.start === dStr; + const isEnd = v?.end === dStr; + let inRange = false; + + if (isRangeMode() && v?.start) { + const start = v.start; + if (!v.end && h) { + inRange = (dStr > start && dStr <= h) || (dStr < start && dStr >= h); + } else if (v.end) { + inRange = dStr > start && dStr < v.end; + } + } + + const base = "btn btn-xs p-0 aspect-square min-h-0 h-auto font-normal relative"; + const state = isStart || isEnd ? "btn-primary z-10" : inRange ? "bg-primary/20 border-none rounded-none" : "btn-ghost"; + const today = dStr === todayStr ? "ring-1 ring-primary ring-inset font-black text-primary" : ""; + + return `${base} ${state} ${today}`; + }, + onmouseenter: () => { if (isRangeMode()) hoverDate(dStr); }, + onclick: () => selectDate(date), + }, + [i.toString()], + ), + ); + } + return nodes; + }, + ]), + + hour ? $html("div", { class: "mt-3 pt-2 border-t border-base-300" }, [ + isRangeMode() + ? $html("div", { class: "flex gap-4" }, [ + HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal?.start) value({ ...currentVal, startHour: newHour }); + }, + }), + HourSlider({ + value: endHour, + onChange: (newHour) => { + endHour(newHour); + const currentVal = val(value); + if (currentVal?.end) value({ ...currentVal, endHour: newHour }); + }, + }), + ]) + : HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) { + value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00"); + } + }, + }), + ]) : null, + ], + ), + ), + + $if(isOpen, () => $html("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })), + ]); +}; + +var DatepickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Datepicker: Datepicker +}); + +/** DRAWER */ +const Drawer = (props) => + $html("div", { class: joinClass("drawer", props.class) }, [ + $html("input", { + id: props.id, + type: "checkbox", + class: "drawer-toggle", + 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("div", { class: "min-h-full bg-base-200 w-80" }, props.side), + ]), + ]); + +var DrawerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Drawer: Drawer +}); + +/** DROPDOWN */ +const Dropdown = (props, children) => { + const { label, icon, ...rest } = props; + + return $html( + "div", + { + ...rest, + class: () => `dropdown ${val(props.class) || props.class || ""}`, + }, + [ + $html( + "div", + { + tabindex: 0, + role: "button", + class: "btn m-1 flex items-center gap-2", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + label ? (typeof label === "function" ? label() : label) : null + ], + ), + $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", + }, + [typeof children === "function" ? children() : children], + ), + ], + ); +}; + +var DropdownModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Dropdown: Dropdown +}); + +/** FAB (Floating Action Button) */ +const Fab = (props) => { + const { icon, label, actions = [], position = "bottom-6 right-6", ...rest } = props; + + return $html( + "div", + { + ...rest, + class: () => `fab fixed ${val(position)} flex flex-col-reverse items-end gap-3 z-[100] ${ + props.class || "" + }`, + }, + [ + // Botón principal + $html( + "div", + { + tabindex: 0, + role: "button", + class: "btn btn-lg btn-circle btn-primary shadow-2xl", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + !icon && label ? label : null + ], + ), + + // Acciones secundarias (se despliegan hacia arriba) + ...val(actions).map((act) => + $html("div", { class: "flex items-center gap-3 transition-all duration-300" }, [ + act.label ? $html("span", { class: "badge badge-ghost shadow-sm whitespace-nowrap" }, act.label) : null, + $html( + "button", + { + type: "button", + class: `btn btn-circle shadow-lg ${act.class || ""}`, + onclick: (e) => { + e.stopPropagation(); + act.onclick?.(e); + }, + }, + [act.icon ? (typeof act.icon === "function" ? act.icon() : act.icon) : act.text || ""], + ), + ]), + ), + ], + ); +}; + +var FabModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fab: Fab +}); + +/** FIELDSET */ +const Fieldset = (props, children) => + $html( + "fieldset", + { + ...props, + class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.class), + }, + [ + () => { + const legendText = val(props.legend); + return legendText ? $html("legend", { class: "fieldset-legend font-bold" }, [legendText]) : null; + }, + children, + ], + ); + +var FieldsetModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fieldset: Fieldset +}); + +/** FILEINPUT */ +const Fileinput = (props) => { + const { tooltip, max = 2, accept = "*", onSelect } = props; + + const selectedFiles = $([]); + const isDragging = $(false); + const error = $(null); + const MAX_BYTES = max * 1024 * 1024; + + const handleFiles = (files) => { + const fileList = Array.from(files); + error(null); + const oversized = fileList.find((f) => f.size > MAX_BYTES); + + if (oversized) { + error(`Máx ${max}MB`); + return; + } + + selectedFiles([...selectedFiles(), ...fileList]); + onSelect?.(selectedFiles()); + }; + + const removeFile = (index) => { + const updated = selectedFiles().filter((_, i) => i !== index); + selectedFiles(updated); + onSelect?.(updated); + }; + + return $html("fieldset", { class: "fieldset w-full p-0" }, [ + $html( + "div", + { + class: () => `w-full ${tooltip ? "tooltip tooltip-top before:z-50 after:z-50" : ""}`, + "data-tip": tooltip, + }, + [ + $html( + "label", + { + class: () => ` + relative flex items-center justify-between w-full h-12 px-4 + border-2 border-dashed rounded-lg cursor-pointer + transition-all duration-200 + ${isDragging() ? "border-primary bg-primary/10" : "border-base-content/20 bg-base-100 hover:bg-base-200"} + `, + ondragover: (e) => { + e.preventDefault(); + isDragging(true); + }, + ondragleave: () => isDragging(false), + ondrop: (e) => { + e.preventDefault(); + isDragging(false); + handleFiles(e.dataTransfer.files); + }, + }, + [ + $html("div", { class: "flex items-center gap-3 w-full" }, [ + $html("img", { src: iconUpload, class: "w-5 h-5 opacity-50 shrink-0" }), + $html("span", { class: "text-sm opacity-70 truncate grow text-left" }, "Arrastra o selecciona archivos..."), + $html("span", { class: "text-[10px] opacity-40 shrink-0" }, `Máx ${max}MB`), + ]), + $html("input", { + type: "file", + multiple: true, + accept: accept, + class: "hidden", + onchange: (e) => handleFiles(e.target.files), + }), + ], + ), + ], + ), + + () => (error() ? $html("span", { class: "text-[10px] text-error mt-1 px-1 font-medium" }, error()) : null), + + $if( + () => selectedFiles().length > 0, + () => + $html("ul", { class: "mt-2 space-y-1" }, [ + $for( + selectedFiles, + (file, index) => + $html("li", { class: "flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300" }, [ + $html("div", { class: "flex items-center gap-2 truncate" }, [ + $html("span", { class: "opacity-50" }, "📄"), + $html("span", { class: "truncate font-medium max-w-[200px]" }, file.name), + $html("span", { class: "text-[9px] opacity-40" }, `(${(file.size / 1024).toFixed(0)} KB)`), + ]), + $html( + "button", + { + type: "button", + class: "btn btn-ghost btn-xs btn-circle", + onclick: (e) => { + e.preventDefault(); + e.stopPropagation(); + removeFile(index); + }, + }, + [$html("img", { src: iconClose, class: "w-3 h-3 opacity-70" })], + ), + ]), + (file) => file.name + file.lastModified, + ), + ]), + ), + ]); +}; + +var FileinputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fileinput: Fileinput +}); + +/** INDICATOR */ +const Indicator = (props, children) => + $html("div", { class: joinClass("indicator", props.class) }, [ + children, + $html("span", { class: joinClass("indicator-item badge", props.badgeClass) }, props.badge), + ]); + +var IndicatorModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Indicator: Indicator +}); + +/** LIST */ +const List = (props) => { + const { items, header, render, keyFn, class: className } = props; + + return $html( + "ul", + { + class: joinClass("list bg-base-100 rounded-box shadow-md", className), + }, + [ + $if(header, () => $html("li", { class: "p-4 pb-2 text-xs opacity-60 tracking-wide" }, [val(header)])), + $for(items, (item, index) => $html("li", { class: "list-row" }, [render(item, index)]), keyFn), + ], + ); +}; + +var ListModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + List: List +}); + +/** LOADING (Overlay Component) */ +const Loading = (props) => { + // Se espera un signal props.$show para controlar la visibilidad + return $if(props.$show, () => + $html("div", { + class: "fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30" + }, [ + $html("span", { class: "loading loading-spinner loading-lg text-primary" }), + ]), + ); +}; + +var LoadingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Loading: Loading +}); + +/** MENU */ +const Menu = (props) => { + const renderItems = (items) => + $for( + () => items || [], + (it) => + $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("a", { class: () => (val(it.active) ? "active" : ""), onclick: it.onclick }, [ + 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) }, renderItems(props.items)); +}; + +var MenuModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Menu: Menu +}); + +/** MODAL */ +const Modal = (props, children) => { + const { title, buttons, open, ...rest } = props; + const close = () => open(false); + + 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, + typeof children === "function" ? children() : children, + $html("div", { class: "modal-action flex gap-2" }, [ + ...(Array.isArray(buttons) ? buttons : [buttons]).filter(Boolean), + Button({ onclick: close }, tt("close")()), + ]), + ]), + $html( + "form", + { + method: "dialog", + class: "modal-backdrop", + onclick: (e) => (e.preventDefault(), close()), + }, + [$html("button", {}, "close")], + ), + ]), + ); +}; + +var ModalModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Modal: Modal +}); + +/** NAVBAR */ +const Navbar = (props, children) => + $html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.class) }, children); + +var NavbarModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Navbar: Navbar +}); + +/** RADIO */ +const Radio = (props) => { + const { label, tooltip, value, ...rest } = props; + + const radioEl = $html("input", { + ...rest, + type: "radio", + class: joinClass("radio", props.class), + checked: () => val(value) === props.value, + disabled: () => val(props.disabled), + onclick: () => typeof value === "function" && value(props.value), + }); + + if (!label && !tooltip) return radioEl; + + const layout = $html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + radioEl, + label ? $html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? $html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var RadioModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Radio: Radio +}); + +/** RANGE */ +const Range = (props) => { + const { label, tooltip, value, ...rest } = props; + + const rangeEl = $html("input", { + ...rest, + type: "range", + 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 + ]); + + return tooltip ? $html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; +}; + +var RangeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Range: Range +}); + +/** RATING */ +const Rating = (props) => { + const { value, count = 5, mask = "mask-star", readonly = false, ...rest } = props; + + // Generamos un ID único para el grupo de radio buttons + const ratingGroup = `rating-${Math.random().toString(36).slice(2, 7)}`; + + return $html( + "div", + { + ...rest, + class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}`, + }, + Array.from({ length: val(count) }, (_, i) => { + const starValue = i + 1; + + return $html("input", { + type: "radio", + name: ratingGroup, + class: `mask ${mask}`, + "aria-label": `${starValue} star`, + checked: () => Math.round(val(value)) === starValue, + onchange: () => { + if (!val(readonly) && typeof value === "function") { + value(starValue); + } + }, + }); + }) + ); +}; + +var RatingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Rating: Rating +}); + +/** SELECT */ +const Select = (props) => { + const { label, options, value, ...rest } = props; + + const selectEl = $html( + "select", + { + ...rest, + class: joinClass("select select-bordered w-full", props.class), + value: value + }, + $for( + () => val(options) || [], + (opt) => + $html( + "option", + { + value: opt.value, + $selected: () => String(val(value)) === String(opt.value), + }, + opt.label, + ), + (opt) => opt.value, + ), + ); + + if (!label) return selectEl; + + return $html("label", { class: "fieldset-label flex flex-col gap-1" }, [ + $html("span", {}, label), + selectEl + ]); +}; + +var SelectModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Select: Select +}); + +/** STACK */ +const Stack = (props, children) => + $html("div", { ...props, class: joinClass("stack", props.class) }, children); + +var StackModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stack: Stack +}); + +/** STAT */ +const Stat = (props) => + $html("div", { ...props, class: joinClass("stat", 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), + props.desc && $html("div", { class: "stat-desc" }, props.desc), + ]); + +var StatModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stat: Stat +}); + +/** SWAP */ +const Swap = (props) => + $html("label", { class: joinClass("swap", props.class) }, [ + $html("input", { + type: "checkbox", + checked: props.value + }), + $html("div", { class: "swap-on" }, props.on), + $html("div", { class: "swap-off" }, props.off), + ]); + +var SwapModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Swap: Swap +}); + +/** TABLE */ +const Table = (props) => { + const { + items = [], + columns = [], + keyFn, + zebra = false, + pinRows = false, + empty = tt("nodata")(), + ...rest + } = props; + + const tableClass = () => joinClass( + "table", + `${val(zebra) ? "table-zebra" : ""} ${val(pinRows) ? "table-pin-rows" : ""} ${props.class || ""}` + ); + + return $html("div", { class: "overflow-x-auto w-full bg-base-100 rounded-box border border-base-300" }, [ + $html("table", { ...rest, class: tableClass }, [ + $html("thead", {}, [ + $html("tr", {}, + columns.map(col => $html("th", { class: col.class || "" }, col.label)) + ) + ]), + $html("tbody", {}, [ + $for(items, (item, index) => { + return $html("tr", { class: "hover" }, + columns.map(col => { + const cellContent = () => { + if (col.render) return col.render(item, index); + const value = item[col.key]; + return val(value); + }; + return $html("td", { class: col.class || "" }, [cellContent]); + }) + ); + }, keyFn || ((item, idx) => item.id || idx)), + + $if(() => val(items).length === 0, () => + $html("tr", {}, [ + $html("td", { colspan: columns.length, class: "text-center p-10 opacity-50" }, [ + val(empty) + ]) + ]) + ) + ]), + $if(() => columns.some(c => c.footer), () => + $html("tfoot", {}, [ + $html("tr", {}, + columns.map(col => $html("th", {}, col.footer || "")) + ) + ]) + ) + ]) + ]); +}; + +var TableModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Table: Table +}); + +/** TABS */ +const Tabs = (props) => { + const { items, ...rest } = props; + const itemsSignal = typeof items === "function" ? items : () => items || []; + + return $html("div", { ...rest, class: "flex flex-col gap-4 w-full" }, [ + $html( + "div", + { + role: "tablist", + class: joinClass("tabs tabs-box", props.class), + }, + $for( + itemsSignal, + (it) => + $html( + "a", + { + role: "tab", + class: () => joinClass( + "tab", + val(it.active) && "tab-active", + val(it.disabled) && "tab-disabled", + it.tip && "tooltip" + ), + "data-tip": it.tip, + onclick: (e) => !val(it.disabled) && it.onclick?.(e), + }, + it.label, + ), + (t) => t.label, + ), + ), + () => { + const active = itemsSignal().find((it) => val(it.active)); + if (!active) return null; + const content = val(active.content); + return $html("div", { class: "p-4" }, [ + typeof content === "function" ? content() : content + ]); + }, + ]); +}; + +var TabsModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tabs: Tabs +}); + +/** TIMELINE */ +const Timeline = (props) => { + const { items = [], vertical = true, compact = false, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + return $html( + "ul", + { + ...rest, + class: () => + `timeline ${val(vertical) ? "timeline-vertical" : "timeline-horizontal"} ${ + val(compact) ? "timeline-compact" : "" + } ${props.class || ""}`, + }, + [ + $for( + items, + (item, i) => { + const isFirst = i === 0; + const isLast = i === val(items).length - 1; + const itemType = item.type || "success"; + const renderSlot = (content) => (typeof content === "function" ? content() : content); + + return $html("li", { class: "flex-1" }, [ + !isFirst ? $html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + $html("div", { class: "timeline-start" }, [renderSlot(item.title)]), + $html("div", { class: "timeline-middle" }, [ + $html("img", { + src: icons[itemType] || item.icon || icons.success, + class: "w-4 h-4 object-contain mx-1", + alt: itemType, + }), + ]), + $html("div", { class: "timeline-end timeline-box shadow-sm" }, [renderSlot(item.detail)]), + !isLast ? $html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + ]); + }, + (item, i) => item.id || i, + ), + ], + ); +}; + +var TimelineModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Timeline: Timeline +}); + +/** TOAST (Imperative Function) */ +const Toast = (message, type = "alert-success", duration = 3500) => { + let container = document.getElementById("sigpro-toast-container"); + + // Crear el contenedor global si no existe + if (!container) { + container = $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(container); + } + + const toastHost = $html("div", { style: "display: contents" }); + container.appendChild(toastHost); + + let timeoutId; + + const close = () => { + clearTimeout(timeoutId); + const el = toastHost.firstElementChild; + if (el && !el.classList.contains("opacity-0")) { + el.classList.add("translate-x-full", "opacity-0"); + setTimeout(() => { + instance.destroy(); + toastHost.remove(); + // Limpiar el contenedor si ya no hay más toasts + if (!container.hasChildNodes()) container.remove(); + }, 300); + } else { + instance.destroy(); + toastHost.remove(); + } + }; + + const ToastComponent = () => { + const el = $html( + "div", + { + class: `alert alert-soft ${type} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`, + }, + [ + $html("span", {}, [typeof message === "function" ? message() : message]), + Button({ class: "btn-xs btn-circle btn-ghost", onclick: close }, "✕") + ], + ); + + // Animación de entrada + requestAnimationFrame(() => el.classList.remove("translate-x-10", "opacity-0")); + return el; + }; + + const instance = $mount(ToastComponent, toastHost); + + if (duration > 0) { + timeoutId = setTimeout(close, duration); + } + + return close; +}; + +var ToastModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Toast: Toast +}); + +/** TOOLTIP */ +const Tooltip = (props, children) => + $html("div", { ...props, class: joinClass("tooltip", props.class), "data-tip": props.tip }, children); + +var TooltipModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tooltip: Tooltip +}); + +const Components = { + ...AccordionModule, + ...AlertModule, + ...AutocompleteModule, + ...BadgeModule, + ...ButtonModule, + ...CheckboxModule, + ...ColorpickerModule, + ...DatepickerModule, + ...DrawerModule, + ...DropdownModule, + ...FabModule, + ...FieldsetModule, + ...FileinputModule, + ...IndicatorModule, + ...InputModule, + ...ListModule, + ...LoadingModule, + ...MenuModule, + ...ModalModule, + ...NavbarModule, + ...RadioModule, + ...RangeModule, + ...RatingModule, + ...SelectModule, + ...StackModule, + ...StatModule, + ...SwapModule, + ...TableModule, + ...TabsModule, + ...TimelineModule, + ...ToastModule, + ...TooltipModule +}; + +var index = { + ...Components, + install: (target = window) => { + Object.entries(Components).forEach(([name, component]) => { + target[name] = component; + }); + console.log("🚀 SigproUI"); + } +}; + +var Components$1 = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion, + Alert: Alert, + Autocomplete: Autocomplete, + Badge: Badge, + Button: Button, + Checkbox: Checkbox, + Colorpicker: Colorpicker, + Datepicker: Datepicker, + Drawer: Drawer, + Dropdown: Dropdown, + Fab: Fab, + Fieldset: Fieldset, + Fileinput: Fileinput, + Indicator: Indicator, + Input: Input, + List: List, + Loading: Loading, + Menu: Menu, + Modal: Modal, + Navbar: Navbar, + Radio: Radio, + Range: Range, + Rating: Rating, + Select: Select, + Stack: Stack, + Stat: Stat, + Swap: Swap, + Table: Table, + Tabs: Tabs, + Timeline: Timeline, + Toast: Toast, + Tooltip: Tooltip, + default: index +}); + +/** + * SigproUI - Entry Point + */ + + +const SigproUI = { + ...Components$1, + Icons, + Utils, + tt, + + install: (target = (typeof window !== 'undefined' ? window : {})) => { + Object.entries(Components$1).forEach(([name, component]) => { + target[name] = component; + }); + + target.Icons = Icons; + target.Utils = Utils; + target.tt = tt; + + console.log("🌟 SigproUI"); + } +}; + +export { Accordion, Alert, Autocomplete, Badge, Button, Checkbox, Colorpicker, Datepicker, Drawer, Dropdown, Fab, Fieldset, Fileinput, Indicator, Input, List, Loading, Menu, Modal, Navbar, Radio, Range, Rating, Select, Stack, Stat, Swap, Table, Tabs, Timeline, Toast, Tooltip, SigproUI as default, icon123, iconAbc, iconCalendar, iconClose, iconError, iconHide, iconInfo, iconLLeft, iconLeft, iconLock, iconMail, iconRRight, iconRight, iconShow, iconSuccess, iconUpload, iconWarning, joinClass, tt, val }; diff --git a/dist/sigpro-ui.js b/dist/sigpro-ui.js deleted file mode 100644 index 895c7cd..0000000 --- a/dist/sigpro-ui.js +++ /dev/null @@ -1,1385 +0,0 @@ -(() => { - var __defProp = Object.defineProperty; - var __getOwnPropNames = Object.getOwnPropertyNames; - var __getOwnPropDesc = Object.getOwnPropertyDescriptor; - var __hasOwnProp = Object.prototype.hasOwnProperty; - var __moduleCache = /* @__PURE__ */ new WeakMap; - var __toCommonJS = (from) => { - var entry = __moduleCache.get(from), desc; - if (entry) - return entry; - entry = __defProp({}, "__esModule", { value: true }); - if (from && typeof from === "object" || typeof from === "function") - __getOwnPropNames(from).map((key) => !__hasOwnProp.call(entry, key) && __defProp(entry, key, { - get: () => from[key], - enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable - })); - __moduleCache.set(from, entry); - return entry; - }; - var __export = (target, all) => { - for (var name in all) - __defProp(target, name, { - get: all[name], - enumerable: true, - configurable: true, - set: (newValue) => all[name] = () => newValue - }); - }; - var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { - get: (a, b) => (typeof require !== "undefined" ? require : a)[b] - }) : x)(function(x) { - if (typeof require !== "undefined") - return require.apply(this, arguments); - throw Error('Dynamic require of "' + x + '" is not supported'); - }); - - // index.js - var exports_sigpro_ui = {}; - __export(exports_sigpro_ui, { - val: () => val, - tt: () => tt, - joinClass: () => joinClass, - iconWarning: () => iconWarning, - iconUpload: () => iconUpload, - iconSuccess: () => iconSuccess, - iconShow: () => iconShow, - iconRight: () => iconRight, - iconRRight: () => iconRRight, - iconMail: () => iconMail, - iconLock: () => iconLock, - iconLeft: () => iconLeft, - iconLLeft: () => iconLLeft, - iconInfo: () => iconInfo, - iconHide: () => iconHide, - iconError: () => iconError, - iconClose: () => iconClose, - iconCalendar: () => iconCalendar, - iconAbc: () => iconAbc, - icon123: () => icon123, - default: () => sigpro_ui_default, - Tooltip: () => Tooltip, - Toast: () => Toast, - Timeline: () => Timeline, - Tabs: () => Tabs, - Table: () => Table, - Swap: () => Swap, - Stat: () => Stat, - Stack: () => Stack, - Select: () => Select, - Rating: () => Rating, - Range: () => Range, - Radio: () => Radio, - Navbar: () => Navbar, - Modal: () => Modal, - Menu: () => Menu, - Loading: () => Loading, - List: () => List, - Input: () => Input, - Indicator: () => Indicator, - Fileinput: () => Fileinput, - Fieldset: () => Fieldset, - Fab: () => Fab, - Dropdown: () => Dropdown, - Drawer: () => Drawer, - Datepicker: () => Datepicker, - Colorpicker: () => Colorpicker, - Checkbox: () => Checkbox, - Button: () => Button, - Badge: () => Badge, - Autocomplete: () => Autocomplete, - Alert: () => Alert, - Accordion: () => Accordion - }); - - // src/components/index.js - var exports_components = {}; - __export(exports_components, { - default: () => components_default, - Tooltip: () => Tooltip, - Toast: () => Toast, - Timeline: () => Timeline, - Tabs: () => Tabs, - Table: () => Table, - Swap: () => Swap, - Stat: () => Stat, - Stack: () => Stack, - Select: () => Select, - Rating: () => Rating, - Range: () => Range, - Radio: () => Radio, - Navbar: () => Navbar, - Modal: () => Modal, - Menu: () => Menu, - Loading: () => Loading, - List: () => List, - Input: () => Input, - Indicator: () => Indicator, - Fileinput: () => Fileinput, - Fieldset: () => Fieldset, - Fab: () => Fab, - Dropdown: () => Dropdown, - Drawer: () => Drawer, - Datepicker: () => Datepicker, - Colorpicker: () => Colorpicker, - Checkbox: () => Checkbox, - Button: () => Button, - Badge: () => Badge, - Autocomplete: () => Autocomplete, - Alert: () => Alert, - Accordion: () => Accordion - }); - - // src/components/Accordion.js - var exports_Accordion = {}; - __export(exports_Accordion, { - Accordion: () => Accordion - }); - var import_sigpro = __require("sigpro"); - - // src/core/utils.js - var exports_utils = {}; - __export(exports_utils, { - val: () => val, - joinClass: () => joinClass - }); - var val = (t) => typeof t === "function" ? t() : t; - var joinClass = (t, l) => typeof l === "function" ? () => `${t} ${l() || ""}`.trim() : `${t} ${l || ""}`.trim(); - - // src/components/Accordion.js - var Accordion = (props, children) => { - const { title, name, open, ...rest } = props; - return import_sigpro.$html("div", { - ...rest, - class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class) - }, [ - import_sigpro.$html("input", { - type: name ? "radio" : "checkbox", - name, - checked: open - }), - import_sigpro.$html("div", { class: "collapse-title text-xl font-medium" }, title), - import_sigpro.$html("div", { class: "collapse-content" }, children) - ]); - }; - - // src/components/Alert.js - var exports_Alert = {}; - __export(exports_Alert, { - Alert: () => Alert - }); - var import_sigpro2 = __require("sigpro"); - - // src/core/icons.js - var exports_icons = {}; - __export(exports_icons, { - iconWarning: () => iconWarning, - iconUpload: () => iconUpload, - iconSuccess: () => iconSuccess, - iconShow: () => iconShow, - iconRight: () => iconRight, - iconRRight: () => iconRRight, - iconMail: () => iconMail, - iconLock: () => iconLock, - iconLeft: () => iconLeft, - iconLLeft: () => iconLLeft, - iconInfo: () => iconInfo, - iconHide: () => iconHide, - iconError: () => iconError, - iconClose: () => iconClose, - iconCalendar: () => iconCalendar, - iconAbc: () => iconAbc, - icon123: () => icon123 - }); - var iconShow = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg=="; - var iconHide = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"; - var iconClose = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg=="; - var iconCalendar = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC"; - var iconLock = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII="; - var iconAbc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg=="; - var icon123 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg=="; - var iconMail = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"; - var iconInfo = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC"; - var iconSuccess = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg=="; - var iconError = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC"; - var iconWarning = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII="; - var iconLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg=="; - var iconRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg=="; - var iconLLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg=="; - var iconRRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII="; - var iconUpload = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC"; - - // src/components/Alert.js - var Alert = (props, children) => { - const { type = "info", soft = true, ...rest } = props; - const icons = { - info: iconInfo, - success: iconSuccess, - warning: iconWarning, - error: iconError - }; - const typeClass = () => { - const t = val(type); - const map = { - info: "alert-info", - success: "alert-success", - warning: "alert-warning", - error: "alert-error" - }; - return map[t] || t; - }; - const content = children || props.message; - return import_sigpro2.$html("div", { - ...rest, - role: "alert", - class: () => `alert ${typeClass()} ${val(soft) ? "alert-soft" : ""} ${props.class || ""}` - }, [ - import_sigpro2.$html("img", { - src: icons[val(type)] || icons.info, - class: "w-4 h-4 object-contain", - alt: val(type) - }), - import_sigpro2.$html("div", { class: "flex-1" }, [ - import_sigpro2.$html("span", {}, [typeof content === "function" ? content() : content]) - ]), - props.actions ? import_sigpro2.$html("div", { class: "flex-none" }, [ - typeof props.actions === "function" ? props.actions() : props.actions - ]) : null - ]); - }; - - // src/components/Autocomplete.js - var exports_Autocomplete = {}; - __export(exports_Autocomplete, { - Autocomplete: () => Autocomplete - }); - var import_sigpro5 = __require("sigpro"); - - // src/core/i18n.js - var import_sigpro3 = __require("sigpro"); - var i18n = { - es: { - close: "Cerrar", - confirm: "Confirmar", - cancel: "Cancelar", - search: "Buscar...", - loading: "Cargando...", - nodata: "Sin datos" - }, - en: { - close: "Close", - confirm: "Confirm", - cancel: "Cancel", - search: "Search...", - loading: "Loading...", - nodata: "No data" - } - }; - var currentLocale = import_sigpro3.$("es"); - var tt = (t) => () => i18n[currentLocale()][t] || t; - - // src/components/Input.js - var exports_Input = {}; - __export(exports_Input, { - Input: () => Input - }); - var import_sigpro4 = __require("sigpro"); - var Input = (props) => { - const { label, tip, value, error, isSearch, icon, type = "text", ...rest } = props; - const isPassword = type === "password"; - const visible = import_sigpro4.$(false); - const iconsByType = { - text: iconAbc, - password: iconLock, - date: iconCalendar, - number: icon123, - email: iconMail - }; - const inputEl = import_sigpro4.$html("input", { - ...rest, - type: () => isPassword ? visible() ? "text" : "password" : type, - placeholder: props.placeholder || label || (isSearch ? tt("search")() : " "), - class: joinClass("grow order-2 focus:outline-none", props.class), - value, - oninput: (e) => props.oninput?.(e), - disabled: () => val(props.disabled) - }); - const leftIcon = icon ? icon : iconsByType[type] ? import_sigpro4.$html("img", { src: iconsByType[type], class: "opacity-50", alt: type }) : null; - return import_sigpro4.$html("label", { - class: () => joinClass("input input-bordered floating-label flex items-center gap-2 w-full relative", val(error) ? "input-error" : "") - }, [ - leftIcon ? import_sigpro4.$html("div", { class: "order-1 shrink-0" }, leftIcon) : null, - label ? import_sigpro4.$html("span", { class: "text-base-content/60 order-0" }, label) : null, - inputEl, - isPassword ? import_sigpro4.$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()); - } - }, () => import_sigpro4.$html("img", { - class: "w-5 h-5", - src: visible() ? iconShow : iconHide - })) : null, - tip ? import_sigpro4.$html("div", { class: "tooltip tooltip-left order-4", "data-tip": tip }, import_sigpro4.$html("span", { class: "badge badge-ghost badge-xs cursor-help" }, "?")) : null, - () => val(error) ? import_sigpro4.$html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val(error)) : null - ]); - }; - - // src/components/Autocomplete.js - var Autocomplete = (props) => { - const { options = [], value, onSelect, label, placeholder, ...rest } = props; - const query = import_sigpro5.$(val(value) || ""); - const isOpen = import_sigpro5.$(false); - const cursor = import_sigpro5.$(-1); - const list = import_sigpro5.$(() => { - const q = query().toLowerCase(); - const data = val(options) || []; - return q ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) : data; - }); - const pick = (opt) => { - const valStr = typeof opt === "string" ? opt : opt.value; - const labelStr = typeof opt === "string" ? opt : opt.label; - query(labelStr); - if (typeof value === "function") - value(valStr); - onSelect?.(opt); - isOpen(false); - cursor(-1); - }; - const nav = (e) => { - const items = list(); - if (e.key === "ArrowDown") { - e.preventDefault(); - isOpen(true); - cursor(Math.min(cursor() + 1, items.length - 1)); - } else if (e.key === "ArrowUp") { - e.preventDefault(); - cursor(Math.max(cursor() - 1, 0)); - } else if (e.key === "Enter" && cursor() >= 0) { - e.preventDefault(); - pick(items[cursor()]); - } else if (e.key === "Escape") { - isOpen(false); - } - }; - return import_sigpro5.$html("div", { class: "relative w-full" }, [ - Input({ - label, - placeholder: placeholder || tt("search")(), - 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); - isOpen(true); - cursor(-1); - }, - ...rest - }), - import_sigpro5.$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: () => isOpen() && list().length ? "display:block" : "display:none" - }, [ - import_sigpro5.$for(list, (opt, i) => import_sigpro5.$html("li", {}, [ - import_sigpro5.$html("a", { - class: () => `block w-full ${cursor() === i ? "active bg-primary text-primary-content" : ""}`, - onclick: () => pick(opt), - onmouseenter: () => cursor(i) - }, typeof opt === "string" ? opt : opt.label) - ]), (opt, i) => (typeof opt === "string" ? opt : opt.value) + i), - () => list().length ? null : import_sigpro5.$html("li", { class: "p-2 text-center opacity-50" }, "No results") - ]) - ]); - }; - - // src/components/Badge.js - var exports_Badge = {}; - __export(exports_Badge, { - Badge: () => Badge - }); - var import_sigpro6 = __require("sigpro"); - var Badge = (props, children) => import_sigpro6.$html("span", { ...props, class: joinClass("badge", props.class) }, children); - - // src/components/Button.js - var exports_Button = {}; - __export(exports_Button, { - Button: () => Button - }); - var import_sigpro7 = __require("sigpro"); - var Button = (props, children) => { - const { badge, badgeClass, tooltip, icon, loading, ...rest } = props; - const btn = import_sigpro7.$html("button", { - ...rest, - class: joinClass("btn", props.class), - disabled: () => val(loading) || val(props.disabled) - }, [ - () => val(loading) ? import_sigpro7.$html("span", { class: "loading loading-spinner" }) : null, - icon ? import_sigpro7.$html("span", { class: "mr-1" }, icon) : null, - children - ]); - let out = btn; - if (badge) { - out = import_sigpro7.$html("div", { class: "indicator" }, [ - import_sigpro7.$html("span", { class: joinClass("indicator-item badge", badgeClass || "badge-secondary") }, badge), - out - ]); - } - return tooltip ? import_sigpro7.$html("div", { class: "tooltip", "data-tip": tooltip }, out) : out; - }; - - // src/components/Checkbox.js - var exports_Checkbox = {}; - __export(exports_Checkbox, { - Checkbox: () => Checkbox - }); - var import_sigpro8 = __require("sigpro"); - var Checkbox = (props) => { - const { value, tooltip, toggle, label, ...rest } = props; - const checkEl = import_sigpro8.$html("input", { - ...rest, - type: "checkbox", - class: () => val(toggle) ? "toggle" : "checkbox", - checked: value - }); - const layout = import_sigpro8.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ - checkEl, - label ? import_sigpro8.$html("span", { class: "label-text" }, label) : null - ]); - return tooltip ? import_sigpro8.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; - }; - - // src/components/Colorpicker.js - var exports_Colorpicker = {}; - __export(exports_Colorpicker, { - Colorpicker: () => Colorpicker - }); - var import_sigpro9 = __require("sigpro"); - var Colorpicker = (props) => { - const { value, label, ...rest } = props; - const isOpen = import_sigpro9.$(false); - const palette = [ - ...["#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"] - ]; - const getColor = () => val(value) || "#000000"; - return import_sigpro9.$html("div", { class: "relative w-fit" }, [ - import_sigpro9.$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: (e) => { - e.stopPropagation(); - isOpen(!isOpen()); - }, - ...rest - }, [ - import_sigpro9.$html("div", { - class: "size-5 rounded-sm shadow-inner border border-black/10 shrink-0", - style: () => `background-color: ${getColor()}` - }), - label ? import_sigpro9.$html("span", { class: "opacity-80" }, label) : null - ]), - import_sigpro9.$if(isOpen, () => import_sigpro9.$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: (e) => e.stopPropagation() - }, [ - import_sigpro9.$html("div", { class: "grid grid-cols-8 gap-1" }, palette.map((c) => import_sigpro9.$html("button", { - type: "button", - style: `background-color: ${c}`, - class: () => { - const active = getColor().toLowerCase() === c.toLowerCase(); - return `size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 - ${active ? "ring-2 ring-offset-1 ring-primary z-10 scale-110" : ""}`; - }, - onclick: () => { - if (typeof value === "function") - value(c); - isOpen(false); - } - }))) - ])), - import_sigpro9.$if(isOpen, () => import_sigpro9.$html("div", { - class: "fixed inset-0 z-[100]", - onclick: () => isOpen(false) - })) - ]); - }; - - // src/components/Datepicker.js - var exports_Datepicker = {}; - __export(exports_Datepicker, { - Datepicker: () => Datepicker - }); - var import_sigpro10 = __require("sigpro"); - var Datepicker = (props) => { - const { value, range, label, placeholder, hour = false, ...rest } = props; - const isOpen = import_sigpro10.$(false); - const internalDate = import_sigpro10.$(new Date); - const hoverDate = import_sigpro10.$(null); - const startHour = import_sigpro10.$(0); - const endHour = import_sigpro10.$(0); - const isRangeMode = () => val(range) === true; - const now = new Date; - const todayStr = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")}`; - const formatDate = (d) => { - const year = d.getFullYear(); - const month = String(d.getMonth() + 1).padStart(2, "0"); - const day = String(d.getDate()).padStart(2, "0"); - return `${year}-${month}-${day}`; - }; - const selectDate = (date) => { - const dateStr = formatDate(date); - const current = val(value); - if (isRangeMode()) { - if (!current?.start || current.start && current.end) { - if (typeof value === "function") { - value({ - start: dateStr, - end: null, - ...hour && { startHour: startHour() } - }); - } - } else { - const start = current.start; - if (typeof value === "function") { - const newValue = dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }; - if (hour) { - newValue.startHour = current.startHour || startHour(); - newValue.endHour = current.endHour || endHour(); - } - value(newValue); - } - isOpen(false); - } - } else { - if (typeof value === "function") { - value(hour ? `${dateStr}T${String(startHour()).padStart(2, "0")}:00:00` : dateStr); - } - isOpen(false); - } - }; - const displayValue = import_sigpro10.$(() => { - const v = val(value); - if (!v) - return ""; - if (typeof v === "string") { - if (hour && v.includes("T")) - return v.replace("T", " "); - return v; - } - if (v.start && v.end) { - const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; - const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end; - return `${startStr} - ${endStr}`; - } - if (v.start) { - const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; - return `${startStr}...`; - } - return ""; - }); - const move = (m) => { - const d = internalDate(); - internalDate(new Date(d.getFullYear(), d.getMonth() + m, 1)); - }; - const moveYear = (y) => { - const d = internalDate(); - internalDate(new Date(d.getFullYear() + y, d.getMonth(), 1)); - }; - const HourSlider = ({ value: hVal, onChange }) => { - return import_sigpro10.$html("div", { class: "flex-1" }, [ - import_sigpro10.$html("div", { class: "flex gap-2 items-center" }, [ - import_sigpro10.$html("input", { - type: "range", - min: 0, - max: 23, - value: hVal, - class: "range range-xs flex-1", - oninput: (e) => { - const newHour = parseInt(e.target.value); - onChange(newHour); - } - }), - import_sigpro10.$html("span", { class: "text-sm font-mono min-w-[48px] text-center" }, () => String(val(hVal)).padStart(2, "0") + ":00") - ]) - ]); - }; - return import_sigpro10.$html("div", { class: "relative w-full" }, [ - Input({ - label, - placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."), - value: displayValue, - readonly: true, - icon: import_sigpro10.$html("img", { src: iconCalendar, class: "opacity-40" }), - onclick: (e) => { - e.stopPropagation(); - isOpen(!isOpen()); - }, - ...rest - }), - import_sigpro10.$if(isOpen, () => import_sigpro10.$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: (e) => e.stopPropagation() - }, [ - import_sigpro10.$html("div", { class: "flex justify-between items-center mb-4 gap-1" }, [ - import_sigpro10.$html("div", { class: "flex gap-0.5" }, [ - import_sigpro10.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(-1) }, import_sigpro10.$html("img", { src: iconLLeft, class: "opacity-40" })), - import_sigpro10.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(-1) }, import_sigpro10.$html("img", { src: iconLeft, class: "opacity-40" })) - ]), - import_sigpro10.$html("span", { class: "font-bold uppercase flex-1 text-center" }, [ - () => internalDate().toLocaleString("es-ES", { month: "short", year: "numeric" }) - ]), - import_sigpro10.$html("div", { class: "flex gap-0.5" }, [ - import_sigpro10.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(1) }, import_sigpro10.$html("img", { src: iconRight, class: "opacity-40" })), - import_sigpro10.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(1) }, import_sigpro10.$html("img", { src: iconRRight, class: "opacity-40" })) - ]) - ]), - import_sigpro10.$html("div", { class: "grid grid-cols-7 gap-1", onmouseleave: () => hoverDate(null) }, [ - ...["L", "M", "X", "J", "V", "S", "D"].map((d) => import_sigpro10.$html("div", { class: "text-[10px] opacity-40 font-bold text-center" }, d)), - () => { - const d = internalDate(); - const year = d.getFullYear(); - const month = d.getMonth(); - const firstDay = new Date(year, month, 1).getDay(); - const offset = firstDay === 0 ? 6 : firstDay - 1; - const daysInMonth = new Date(year, month + 1, 0).getDate(); - const nodes = []; - for (let i = 0;i < offset; i++) - nodes.push(import_sigpro10.$html("div")); - for (let i = 1;i <= daysInMonth; i++) { - const date = new Date(year, month, i); - const dStr = formatDate(date); - nodes.push(import_sigpro10.$html("button", { - type: "button", - class: () => { - const v = val(value); - const h = hoverDate(); - const isStart = typeof v === "string" ? v.split("T")[0] === dStr : v?.start === dStr; - const isEnd = v?.end === dStr; - let inRange = false; - if (isRangeMode() && v?.start) { - const start = v.start; - if (!v.end && h) { - inRange = dStr > start && dStr <= h || dStr < start && dStr >= h; - } else if (v.end) { - inRange = dStr > start && dStr < v.end; - } - } - const base = "btn btn-xs p-0 aspect-square min-h-0 h-auto font-normal relative"; - const state = isStart || isEnd ? "btn-primary z-10" : inRange ? "bg-primary/20 border-none rounded-none" : "btn-ghost"; - const today = dStr === todayStr ? "ring-1 ring-primary ring-inset font-black text-primary" : ""; - return `${base} ${state} ${today}`; - }, - onmouseenter: () => { - if (isRangeMode()) - hoverDate(dStr); - }, - onclick: () => selectDate(date) - }, [i.toString()])); - } - return nodes; - } - ]), - hour ? import_sigpro10.$html("div", { class: "mt-3 pt-2 border-t border-base-300" }, [ - isRangeMode() ? import_sigpro10.$html("div", { class: "flex gap-4" }, [ - HourSlider({ - value: startHour, - onChange: (newHour) => { - startHour(newHour); - const currentVal = val(value); - if (currentVal?.start) - value({ ...currentVal, startHour: newHour }); - } - }), - HourSlider({ - value: endHour, - onChange: (newHour) => { - endHour(newHour); - const currentVal = val(value); - if (currentVal?.end) - value({ ...currentVal, endHour: newHour }); - } - }) - ]) : HourSlider({ - value: startHour, - onChange: (newHour) => { - startHour(newHour); - const currentVal = val(value); - if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) { - value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00"); - } - } - }) - ]) : null - ])), - import_sigpro10.$if(isOpen, () => import_sigpro10.$html("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })) - ]); - }; - - // src/components/Drawer.js - var exports_Drawer = {}; - __export(exports_Drawer, { - Drawer: () => Drawer - }); - var import_sigpro11 = __require("sigpro"); - var Drawer = (props) => import_sigpro11.$html("div", { class: joinClass("drawer", props.class) }, [ - import_sigpro11.$html("input", { - id: props.id, - type: "checkbox", - class: "drawer-toggle", - checked: props.open - }), - import_sigpro11.$html("div", { class: "drawer-content" }, props.content), - import_sigpro11.$html("div", { class: "drawer-side" }, [ - import_sigpro11.$html("label", { for: props.id, class: "drawer-overlay", onclick: () => props.open?.(false) }), - import_sigpro11.$html("div", { class: "min-h-full bg-base-200 w-80" }, props.side) - ]) - ]); - - // src/components/Dropdown.js - var exports_Dropdown = {}; - __export(exports_Dropdown, { - Dropdown: () => Dropdown - }); - var import_sigpro12 = __require("sigpro"); - var Dropdown = (props, children) => { - const { label, icon, ...rest } = props; - return import_sigpro12.$html("div", { - ...rest, - class: () => `dropdown ${val(props.class) || props.class || ""}` - }, [ - import_sigpro12.$html("div", { - tabindex: 0, - role: "button", - class: "btn m-1 flex items-center gap-2" - }, [ - icon ? typeof icon === "function" ? icon() : icon : null, - label ? typeof label === "function" ? label() : label : null - ]), - import_sigpro12.$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" - }, [typeof children === "function" ? children() : children]) - ]); - }; - - // src/components/Fab.js - var exports_Fab = {}; - __export(exports_Fab, { - Fab: () => Fab - }); - var import_sigpro13 = __require("sigpro"); - var Fab = (props) => { - const { icon, label, actions = [], position = "bottom-6 right-6", ...rest } = props; - return import_sigpro13.$html("div", { - ...rest, - class: () => `fab fixed ${val(position)} flex flex-col-reverse items-end gap-3 z-[100] ${props.class || ""}` - }, [ - import_sigpro13.$html("div", { - tabindex: 0, - role: "button", - class: "btn btn-lg btn-circle btn-primary shadow-2xl" - }, [ - icon ? typeof icon === "function" ? icon() : icon : null, - !icon && label ? label : null - ]), - ...val(actions).map((act) => import_sigpro13.$html("div", { class: "flex items-center gap-3 transition-all duration-300" }, [ - act.label ? import_sigpro13.$html("span", { class: "badge badge-ghost shadow-sm whitespace-nowrap" }, act.label) : null, - import_sigpro13.$html("button", { - type: "button", - class: `btn btn-circle shadow-lg ${act.class || ""}`, - onclick: (e) => { - e.stopPropagation(); - act.onclick?.(e); - } - }, [act.icon ? typeof act.icon === "function" ? act.icon() : act.icon : act.text || ""]) - ])) - ]); - }; - - // src/components/Fieldset.js - var exports_Fieldset = {}; - __export(exports_Fieldset, { - Fieldset: () => Fieldset - }); - var import_sigpro14 = __require("sigpro"); - var Fieldset = (props, children) => import_sigpro14.$html("fieldset", { - ...props, - class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.class) - }, [ - () => { - const legendText = val(props.legend); - return legendText ? import_sigpro14.$html("legend", { class: "fieldset-legend font-bold" }, [legendText]) : null; - }, - children - ]); - - // src/components/Fileinput.js - var exports_Fileinput = {}; - __export(exports_Fileinput, { - Fileinput: () => Fileinput - }); - var import_sigpro15 = __require("sigpro"); - var Fileinput = (props) => { - const { tooltip, max = 2, accept = "*", onSelect } = props; - const selectedFiles = import_sigpro15.$([]); - const isDragging = import_sigpro15.$(false); - const error = import_sigpro15.$(null); - const MAX_BYTES = max * 1024 * 1024; - const handleFiles = (files) => { - const fileList = Array.from(files); - error(null); - const oversized = fileList.find((f) => f.size > MAX_BYTES); - if (oversized) { - error(`Máx ${max}MB`); - return; - } - selectedFiles([...selectedFiles(), ...fileList]); - onSelect?.(selectedFiles()); - }; - const removeFile = (index) => { - const updated = selectedFiles().filter((_, i) => i !== index); - selectedFiles(updated); - onSelect?.(updated); - }; - return import_sigpro15.$html("fieldset", { class: "fieldset w-full p-0" }, [ - import_sigpro15.$html("div", { - class: () => `w-full ${tooltip ? "tooltip tooltip-top before:z-50 after:z-50" : ""}`, - "data-tip": tooltip - }, [ - import_sigpro15.$html("label", { - class: () => ` - relative flex items-center justify-between w-full h-12 px-4 - border-2 border-dashed rounded-lg cursor-pointer - transition-all duration-200 - ${isDragging() ? "border-primary bg-primary/10" : "border-base-content/20 bg-base-100 hover:bg-base-200"} - `, - ondragover: (e) => { - e.preventDefault(); - isDragging(true); - }, - ondragleave: () => isDragging(false), - ondrop: (e) => { - e.preventDefault(); - isDragging(false); - handleFiles(e.dataTransfer.files); - } - }, [ - import_sigpro15.$html("div", { class: "flex items-center gap-3 w-full" }, [ - import_sigpro15.$html("img", { src: iconUpload, class: "w-5 h-5 opacity-50 shrink-0" }), - import_sigpro15.$html("span", { class: "text-sm opacity-70 truncate grow text-left" }, "Arrastra o selecciona archivos..."), - import_sigpro15.$html("span", { class: "text-[10px] opacity-40 shrink-0" }, `Máx ${max}MB`) - ]), - import_sigpro15.$html("input", { - type: "file", - multiple: true, - accept, - class: "hidden", - onchange: (e) => handleFiles(e.target.files) - }) - ]) - ]), - () => error() ? import_sigpro15.$html("span", { class: "text-[10px] text-error mt-1 px-1 font-medium" }, error()) : null, - import_sigpro15.$if(() => selectedFiles().length > 0, () => import_sigpro15.$html("ul", { class: "mt-2 space-y-1" }, [ - import_sigpro15.$for(selectedFiles, (file, index) => import_sigpro15.$html("li", { class: "flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300" }, [ - import_sigpro15.$html("div", { class: "flex items-center gap-2 truncate" }, [ - import_sigpro15.$html("span", { class: "opacity-50" }, "\uD83D\uDCC4"), - import_sigpro15.$html("span", { class: "truncate font-medium max-w-[200px]" }, file.name), - import_sigpro15.$html("span", { class: "text-[9px] opacity-40" }, `(${(file.size / 1024).toFixed(0)} KB)`) - ]), - import_sigpro15.$html("button", { - type: "button", - class: "btn btn-ghost btn-xs btn-circle", - onclick: (e) => { - e.preventDefault(); - e.stopPropagation(); - removeFile(index); - } - }, [import_sigpro15.$html("img", { src: iconClose, class: "w-3 h-3 opacity-70" })]) - ]), (file) => file.name + file.lastModified) - ])) - ]); - }; - - // src/components/Indicator.js - var exports_Indicator = {}; - __export(exports_Indicator, { - Indicator: () => Indicator - }); - var import_sigpro16 = __require("sigpro"); - var Indicator = (props, children) => import_sigpro16.$html("div", { class: joinClass("indicator", props.class) }, [ - children, - import_sigpro16.$html("span", { class: joinClass("indicator-item badge", props.badgeClass) }, props.badge) - ]); - - // src/components/List.js - var exports_List = {}; - __export(exports_List, { - List: () => List - }); - var import_sigpro17 = __require("sigpro"); - var List = (props) => { - const { items, header, render, keyFn, class: className } = props; - return import_sigpro17.$html("ul", { - class: joinClass("list bg-base-100 rounded-box shadow-md", className) - }, [ - import_sigpro17.$if(header, () => import_sigpro17.$html("li", { class: "p-4 pb-2 text-xs opacity-60 tracking-wide" }, [val(header)])), - import_sigpro17.$for(items, (item, index) => import_sigpro17.$html("li", { class: "list-row" }, [render(item, index)]), keyFn) - ]); - }; - - // src/components/Loading.js - var exports_Loading = {}; - __export(exports_Loading, { - Loading: () => Loading - }); - var import_sigpro18 = __require("sigpro"); - var Loading = (props) => { - return import_sigpro18.$if(props.$show, () => import_sigpro18.$html("div", { - class: "fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30" - }, [ - import_sigpro18.$html("span", { class: "loading loading-spinner loading-lg text-primary" }) - ])); - }; - - // src/components/Menu.js - var exports_Menu = {}; - __export(exports_Menu, { - Menu: () => Menu - }); - var import_sigpro19 = __require("sigpro"); - var Menu = (props) => { - const renderItems = (items) => import_sigpro19.$for(() => items || [], (it) => import_sigpro19.$html("li", {}, [ - it.children ? import_sigpro19.$html("details", { open: it.open }, [ - import_sigpro19.$html("summary", {}, [it.icon && import_sigpro19.$html("span", { class: "mr-2" }, it.icon), it.label]), - import_sigpro19.$html("ul", {}, renderItems(it.children)) - ]) : import_sigpro19.$html("a", { class: () => val(it.active) ? "active" : "", onclick: it.onclick }, [ - it.icon && import_sigpro19.$html("span", { class: "mr-2" }, it.icon), - it.label - ]) - ]), (it, i) => it.label || i); - return import_sigpro19.$html("ul", { ...props, class: joinClass("menu bg-base-200 rounded-box", props.class) }, renderItems(props.items)); - }; - - // src/components/Modal.js - var exports_Modal = {}; - __export(exports_Modal, { - Modal: () => Modal - }); - var import_sigpro20 = __require("sigpro"); - var Modal = (props, children) => { - const { title, buttons, open, ...rest } = props; - const close = () => open(false); - return import_sigpro20.$if(open, () => import_sigpro20.$html("dialog", { ...rest, class: "modal modal-open" }, [ - import_sigpro20.$html("div", { class: "modal-box" }, [ - title ? import_sigpro20.$html("h3", { class: "text-lg font-bold mb-4" }, title) : null, - typeof children === "function" ? children() : children, - import_sigpro20.$html("div", { class: "modal-action flex gap-2" }, [ - ...(Array.isArray(buttons) ? buttons : [buttons]).filter(Boolean), - Button({ onclick: close }, tt("close")()) - ]) - ]), - import_sigpro20.$html("form", { - method: "dialog", - class: "modal-backdrop", - onclick: (e) => (e.preventDefault(), close()) - }, [import_sigpro20.$html("button", {}, "close")]) - ])); - }; - - // src/components/Navbar.js - var exports_Navbar = {}; - __export(exports_Navbar, { - Navbar: () => Navbar - }); - var import_sigpro21 = __require("sigpro"); - var Navbar = (props, children) => import_sigpro21.$html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.class) }, children); - - // src/components/Radio.js - var exports_Radio = {}; - __export(exports_Radio, { - Radio: () => Radio - }); - var import_sigpro22 = __require("sigpro"); - var Radio = (props) => { - const { label, tooltip, value, ...rest } = props; - const radioEl = import_sigpro22.$html("input", { - ...rest, - type: "radio", - class: joinClass("radio", props.class), - checked: () => val(value) === props.value, - disabled: () => val(props.disabled), - onclick: () => typeof value === "function" && value(props.value) - }); - if (!label && !tooltip) - return radioEl; - const layout = import_sigpro22.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ - radioEl, - label ? import_sigpro22.$html("span", { class: "label-text" }, label) : null - ]); - return tooltip ? import_sigpro22.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; - }; - - // src/components/Range.js - var exports_Range = {}; - __export(exports_Range, { - Range: () => Range - }); - var import_sigpro23 = __require("sigpro"); - var Range = (props) => { - const { label, tooltip, value, ...rest } = props; - const rangeEl = import_sigpro23.$html("input", { - ...rest, - type: "range", - class: joinClass("range", props.class), - value, - disabled: () => val(props.disabled) - }); - if (!label && !tooltip) - return rangeEl; - const layout = import_sigpro23.$html("div", { class: "flex flex-col gap-2" }, [ - label ? import_sigpro23.$html("span", { class: "label-text" }, label) : null, - rangeEl - ]); - return tooltip ? import_sigpro23.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; - }; - - // src/components/Rating.js - var exports_Rating = {}; - __export(exports_Rating, { - Rating: () => Rating - }); - var import_sigpro24 = __require("sigpro"); - var Rating = (props) => { - const { value, count = 5, mask = "mask-star", readonly = false, ...rest } = props; - const ratingGroup = `rating-${Math.random().toString(36).slice(2, 7)}`; - return import_sigpro24.$html("div", { - ...rest, - class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}` - }, Array.from({ length: val(count) }, (_, i) => { - const starValue = i + 1; - return import_sigpro24.$html("input", { - type: "radio", - name: ratingGroup, - class: `mask ${mask}`, - "aria-label": `${starValue} star`, - checked: () => Math.round(val(value)) === starValue, - onchange: () => { - if (!val(readonly) && typeof value === "function") { - value(starValue); - } - } - }); - })); - }; - - // src/components/Select.js - var exports_Select = {}; - __export(exports_Select, { - Select: () => Select - }); - var import_sigpro25 = __require("sigpro"); - var Select = (props) => { - const { label, options, value, ...rest } = props; - const selectEl = import_sigpro25.$html("select", { - ...rest, - class: joinClass("select select-bordered w-full", props.class), - value - }, import_sigpro25.$for(() => val(options) || [], (opt) => import_sigpro25.$html("option", { - value: opt.value, - $selected: () => String(val(value)) === String(opt.value) - }, opt.label), (opt) => opt.value)); - if (!label) - return selectEl; - return import_sigpro25.$html("label", { class: "fieldset-label flex flex-col gap-1" }, [ - import_sigpro25.$html("span", {}, label), - selectEl - ]); - }; - - // src/components/Stack.js - var exports_Stack = {}; - __export(exports_Stack, { - Stack: () => Stack - }); - var import_sigpro26 = __require("sigpro"); - var Stack = (props, children) => import_sigpro26.$html("div", { ...props, class: joinClass("stack", props.class) }, children); - - // src/components/Stat.js - var exports_Stat = {}; - __export(exports_Stat, { - Stat: () => Stat - }); - var import_sigpro27 = __require("sigpro"); - var Stat = (props) => import_sigpro27.$html("div", { ...props, class: joinClass("stat", props.class) }, [ - props.icon && import_sigpro27.$html("div", { class: "stat-figure text-secondary" }, props.icon), - props.label && import_sigpro27.$html("div", { class: "stat-title" }, props.label), - import_sigpro27.$html("div", { class: "stat-value" }, () => val(props.value) ?? props.value), - props.desc && import_sigpro27.$html("div", { class: "stat-desc" }, props.desc) - ]); - - // src/components/Swap.js - var exports_Swap = {}; - __export(exports_Swap, { - Swap: () => Swap - }); - var import_sigpro28 = __require("sigpro"); - var Swap = (props) => import_sigpro28.$html("label", { class: joinClass("swap", props.class) }, [ - import_sigpro28.$html("input", { - type: "checkbox", - checked: props.value - }), - import_sigpro28.$html("div", { class: "swap-on" }, props.on), - import_sigpro28.$html("div", { class: "swap-off" }, props.off) - ]); - - // src/components/Table.js - var exports_Table = {}; - __export(exports_Table, { - Table: () => Table - }); - var import_sigpro29 = __require("sigpro"); - var Table = (props) => { - const { - items = [], - columns = [], - keyFn, - zebra = false, - pinRows = false, - empty = tt("nodata")(), - ...rest - } = props; - const tableClass = () => joinClass("table", `${val(zebra) ? "table-zebra" : ""} ${val(pinRows) ? "table-pin-rows" : ""} ${props.class || ""}`); - return import_sigpro29.$html("div", { class: "overflow-x-auto w-full bg-base-100 rounded-box border border-base-300" }, [ - import_sigpro29.$html("table", { ...rest, class: tableClass }, [ - import_sigpro29.$html("thead", {}, [ - import_sigpro29.$html("tr", {}, columns.map((col) => import_sigpro29.$html("th", { class: col.class || "" }, col.label))) - ]), - import_sigpro29.$html("tbody", {}, [ - import_sigpro29.$for(items, (item, index) => { - return import_sigpro29.$html("tr", { class: "hover" }, columns.map((col) => { - const cellContent = () => { - if (col.render) - return col.render(item, index); - const value = item[col.key]; - return val(value); - }; - return import_sigpro29.$html("td", { class: col.class || "" }, [cellContent]); - })); - }, keyFn || ((item, idx) => item.id || idx)), - import_sigpro29.$if(() => val(items).length === 0, () => import_sigpro29.$html("tr", {}, [ - import_sigpro29.$html("td", { colspan: columns.length, class: "text-center p-10 opacity-50" }, [ - val(empty) - ]) - ])) - ]), - import_sigpro29.$if(() => columns.some((c) => c.footer), () => import_sigpro29.$html("tfoot", {}, [ - import_sigpro29.$html("tr", {}, columns.map((col) => import_sigpro29.$html("th", {}, col.footer || ""))) - ])) - ]) - ]); - }; - - // src/components/Tabs.js - var exports_Tabs = {}; - __export(exports_Tabs, { - Tabs: () => Tabs - }); - var import_sigpro30 = __require("sigpro"); - var Tabs = (props) => { - const { items, ...rest } = props; - const itemsSignal = typeof items === "function" ? items : () => items || []; - return import_sigpro30.$html("div", { ...rest, class: "flex flex-col gap-4 w-full" }, [ - import_sigpro30.$html("div", { - role: "tablist", - class: joinClass("tabs tabs-box", props.class) - }, import_sigpro30.$for(itemsSignal, (it) => import_sigpro30.$html("a", { - role: "tab", - class: () => joinClass("tab", val(it.active) && "tab-active", val(it.disabled) && "tab-disabled", it.tip && "tooltip"), - "data-tip": it.tip, - onclick: (e) => !val(it.disabled) && it.onclick?.(e) - }, it.label), (t) => t.label)), - () => { - const active = itemsSignal().find((it) => val(it.active)); - if (!active) - return null; - const content = val(active.content); - return import_sigpro30.$html("div", { class: "p-4" }, [ - typeof content === "function" ? content() : content - ]); - } - ]); - }; - - // src/components/Timeline.js - var exports_Timeline = {}; - __export(exports_Timeline, { - Timeline: () => Timeline - }); - var import_sigpro31 = __require("sigpro"); - var Timeline = (props) => { - const { items = [], vertical = true, compact = false, ...rest } = props; - const icons = { - info: iconInfo, - success: iconSuccess, - warning: iconWarning, - error: iconError - }; - return import_sigpro31.$html("ul", { - ...rest, - class: () => `timeline ${val(vertical) ? "timeline-vertical" : "timeline-horizontal"} ${val(compact) ? "timeline-compact" : ""} ${props.class || ""}` - }, [ - import_sigpro31.$for(items, (item, i) => { - const isFirst = i === 0; - const isLast = i === val(items).length - 1; - const itemType = item.type || "success"; - const renderSlot = (content) => typeof content === "function" ? content() : content; - return import_sigpro31.$html("li", { class: "flex-1" }, [ - !isFirst ? import_sigpro31.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null, - import_sigpro31.$html("div", { class: "timeline-start" }, [renderSlot(item.title)]), - import_sigpro31.$html("div", { class: "timeline-middle" }, [ - import_sigpro31.$html("img", { - src: icons[itemType] || item.icon || icons.success, - class: "w-4 h-4 object-contain mx-1", - alt: itemType - }) - ]), - import_sigpro31.$html("div", { class: "timeline-end timeline-box shadow-sm" }, [renderSlot(item.detail)]), - !isLast ? import_sigpro31.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null - ]); - }, (item, i) => item.id || i) - ]); - }; - - // src/components/Toast.js - var exports_Toast = {}; - __export(exports_Toast, { - Toast: () => Toast - }); - var import_sigpro32 = __require("sigpro"); - var Toast = (message, type = "alert-success", duration = 3500) => { - let container = document.getElementById("sigpro-toast-container"); - if (!container) { - container = import_sigpro32.$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(container); - } - const toastHost = import_sigpro32.$html("div", { style: "display: contents" }); - container.appendChild(toastHost); - let timeoutId; - const close = () => { - clearTimeout(timeoutId); - const el = toastHost.firstElementChild; - if (el && !el.classList.contains("opacity-0")) { - el.classList.add("translate-x-full", "opacity-0"); - setTimeout(() => { - instance.destroy(); - toastHost.remove(); - if (!container.hasChildNodes()) - container.remove(); - }, 300); - } else { - instance.destroy(); - toastHost.remove(); - } - }; - const ToastComponent = () => { - const el = import_sigpro32.$html("div", { - class: `alert alert-soft ${type} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto` - }, [ - import_sigpro32.$html("span", {}, [typeof message === "function" ? message() : message]), - Button({ class: "btn-xs btn-circle btn-ghost", onclick: close }, "✕") - ]); - requestAnimationFrame(() => el.classList.remove("translate-x-10", "opacity-0")); - return el; - }; - const instance = import_sigpro32.$mount(ToastComponent, toastHost); - if (duration > 0) { - timeoutId = setTimeout(close, duration); - } - return close; - }; - - // src/components/Tooltip.js - var exports_Tooltip = {}; - __export(exports_Tooltip, { - Tooltip: () => Tooltip - }); - var import_sigpro33 = __require("sigpro"); - var Tooltip = (props, children) => import_sigpro33.$html("div", { ...props, class: joinClass("tooltip", props.class), "data-tip": props.tip }, children); - - // src/components/index.js - var Components = { - ...exports_Accordion, - ...exports_Alert, - ...exports_Autocomplete, - ...exports_Badge, - ...exports_Button, - ...exports_Checkbox, - ...exports_Colorpicker, - ...exports_Datepicker, - ...exports_Drawer, - ...exports_Dropdown, - ...exports_Fab, - ...exports_Fieldset, - ...exports_Fileinput, - ...exports_Indicator, - ...exports_Input, - ...exports_List, - ...exports_Loading, - ...exports_Menu, - ...exports_Modal, - ...exports_Navbar, - ...exports_Radio, - ...exports_Range, - ...exports_Rating, - ...exports_Select, - ...exports_Stack, - ...exports_Stat, - ...exports_Swap, - ...exports_Table, - ...exports_Tabs, - ...exports_Timeline, - ...exports_Toast, - ...exports_Tooltip - }; - var components_default = { - ...Components, - install: (target = window) => { - Object.entries(Components).forEach(([name, component]) => { - target[name] = component; - }); - console.log("\uD83D\uDE80 SigproUI"); - } - }; - // index.js - var SigproUI = { - ...exports_components, - Icons: exports_icons, - Utils: exports_utils, - tt, - install: (target = typeof window !== "undefined" ? window : {}) => { - Object.entries(exports_components).forEach(([name, component]) => { - target[name] = component; - }); - target.Icons = exports_icons; - target.Utils = exports_utils; - target.tt = tt; - console.log("\uD83C\uDF1F SigproUI"); - } - }; - var sigpro_ui_default = SigproUI; -})(); diff --git a/dist/sigpro-ui.min.js b/dist/sigpro-ui.min.js deleted file mode 100644 index 10da19b..0000000 --- a/dist/sigpro-ui.min.js +++ /dev/null @@ -1,7 +0,0 @@ -(()=>{var{defineProperty:Rt,getOwnPropertyNames:oe,getOwnPropertyDescriptor:ee}=Object,ae=Object.prototype.hasOwnProperty;var zo=new WeakMap,Ae=(t)=>{var o=zo.get(t),e;if(o)return o;if(o=Rt({},"__esModule",{value:!0}),t&&typeof t==="object"||typeof t==="function")oe(t).map((a)=>!ae.call(o,a)&&Rt(o,a,{get:()=>t[a],enumerable:!(e=ee(t,a))||e.enumerable}));return zo.set(t,o),o};var g=(t,o)=>{for(var e in o)Rt(t,e,{get:o[e],enumerable:!0,configurable:!0,set:(a)=>o[e]=()=>a})};var p=((t)=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(t,{get:(o,e)=>(typeof require<"u"?require:o)[e]}):t)(function(t){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+t+'" is not supported')});var ce={};g(ce,{val:()=>A,tt:()=>D,joinClass:()=>d,iconWarning:()=>O,iconUpload:()=>xt,iconSuccess:()=>P,iconShow:()=>nt,iconRight:()=>ut,iconRRight:()=>pt,iconMail:()=>ft,iconLock:()=>it,iconLeft:()=>gt,iconLLeft:()=>bt,iconInfo:()=>X,iconHide:()=>lt,iconError:()=>Z,iconClose:()=>ct,iconCalendar:()=>K,iconAbc:()=>dt,icon123:()=>mt,default:()=>ie,Tooltip:()=>No,Toast:()=>Fo,Timeline:()=>Mo,Tabs:()=>Vo,Table:()=>Eo,Swap:()=>Do,Stat:()=>Uo,Stack:()=>Co,Select:()=>wo,Rating:()=>Bo,Range:()=>po,Radio:()=>uo,Navbar:()=>fo,Modal:()=>io,Menu:()=>lo,Loading:()=>ro,List:()=>Ao,Input:()=>N,Indicator:()=>eo,Fileinput:()=>_t,Fieldset:()=>$t,Fab:()=>Zt,Dropdown:()=>Xt,Drawer:()=>Jt,Datepicker:()=>Gt,Colorpicker:()=>Lt,Checkbox:()=>Nt,Button:()=>L,Badge:()=>Ht,Autocomplete:()=>It,Alert:()=>Et,Accordion:()=>Dt});var vt={};g(vt,{default:()=>ne,Tooltip:()=>No,Toast:()=>Fo,Timeline:()=>Mo,Tabs:()=>Vo,Table:()=>Eo,Swap:()=>Do,Stat:()=>Uo,Stack:()=>Co,Select:()=>wo,Rating:()=>Bo,Range:()=>po,Radio:()=>uo,Navbar:()=>fo,Modal:()=>io,Menu:()=>lo,Loading:()=>ro,List:()=>Ao,Input:()=>N,Indicator:()=>eo,Fileinput:()=>_t,Fieldset:()=>$t,Fab:()=>Zt,Dropdown:()=>Xt,Drawer:()=>Jt,Datepicker:()=>Gt,Colorpicker:()=>Lt,Checkbox:()=>Nt,Button:()=>L,Badge:()=>Ht,Autocomplete:()=>It,Alert:()=>Et,Accordion:()=>Dt});var kt={};g(kt,{Accordion:()=>Dt});var tt=p("sigpro");var rt={};g(rt,{val:()=>A,joinClass:()=>d});var A=(t)=>typeof t==="function"?t():t,d=(t,o)=>typeof o==="function"?()=>`${t} ${o()||""}`.trim():`${t} ${o||""}`.trim();var Dt=(t,o)=>{let{title:e,name:a,open:s,...n}=t;return tt.$html("div",{...n,class:d("collapse collapse-arrow bg-base-200 mb-2",t.class)},[tt.$html("input",{type:a?"radio":"checkbox",name:a,checked:s}),tt.$html("div",{class:"collapse-title text-xl font-medium"},e),tt.$html("div",{class:"collapse-content"},o)])};var Yt={};g(Yt,{Alert:()=>Et});var W=p("sigpro");var ht={};g(ht,{iconWarning:()=>O,iconUpload:()=>xt,iconSuccess:()=>P,iconShow:()=>nt,iconRight:()=>ut,iconRRight:()=>pt,iconMail:()=>ft,iconLock:()=>it,iconLeft:()=>gt,iconLLeft:()=>bt,iconInfo:()=>X,iconHide:()=>lt,iconError:()=>Z,iconClose:()=>ct,iconCalendar:()=>K,iconAbc:()=>dt,icon123:()=>mt});var nt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg==",lt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC",ct="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg==",K="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC",it="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII=",dt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg==",mt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg==",ft="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC",X="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC",P="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg==",Z="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC",O="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII=",gt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg==",ut="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg==",bt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg==",pt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII=",xt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC";var Et=(t,o)=>{let{type:e="info",soft:a=!0,...s}=t,n={info:X,success:P,warning:O,error:Z},r=()=>{let x=A(e);return{info:"alert-info",success:"alert-success",warning:"alert-warning",error:"alert-error"}[x]||x},l=o||t.message;return W.$html("div",{...s,role:"alert",class:()=>`alert ${r()} ${A(a)?"alert-soft":""} ${t.class||""}`},[W.$html("img",{src:n[A(e)]||n.info,class:"w-4 h-4 object-contain",alt:A(e)}),W.$html("div",{class:"flex-1"},[W.$html("span",{},[typeof l==="function"?l():l])]),t.actions?W.$html("div",{class:"flex-none"},[typeof t.actions==="function"?t.actions():t.actions]):null])};var Mt={};g(Mt,{Autocomplete:()=>It});var R=p("sigpro");var Jo=p("sigpro"),se={es:{close:"Cerrar",confirm:"Confirmar",cancel:"Cancelar",search:"Buscar...",loading:"Cargando...",nodata:"Sin datos"},en:{close:"Close",confirm:"Confirm",cancel:"Cancel",search:"Search...",loading:"Loading...",nodata:"No data"}},re=Jo.$("es");var D=(t)=>()=>se[re()][t]||t;var Vt={};g(Vt,{Input:()=>N});var U=p("sigpro");var N=(t)=>{let{label:o,tip:e,value:a,error:s,isSearch:n,icon:r,type:l="text",...x}=t,c=l==="password",h=U.$(!1),u={text:dt,password:it,date:K,number:mt,email:ft},w=U.$html("input",{...x,type:()=>c?h()?"text":"password":l,placeholder:t.placeholder||o||(n?D("search")():" "),class:d("grow order-2 focus:outline-none",t.class),value:a,oninput:(v)=>t.oninput?.(v),disabled:()=>A(t.disabled)}),m=r?r:u[l]?U.$html("img",{src:u[l],class:"opacity-50",alt:l}):null;return U.$html("label",{class:()=>d("input input-bordered floating-label flex items-center gap-2 w-full relative",A(s)?"input-error":"")},[m?U.$html("div",{class:"order-1 shrink-0"},m):null,o?U.$html("span",{class:"text-base-content/60 order-0"},o):null,w,c?U.$html("button",{type:"button",class:"order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100",onclick:(v)=>{v.preventDefault(),h(!h())}},()=>U.$html("img",{class:"w-5 h-5",src:h()?nt:lt})):null,e?U.$html("div",{class:"tooltip tooltip-left order-4","data-tip":e},U.$html("span",{class:"badge badge-ghost badge-xs cursor-help"},"?")):null,()=>A(s)?U.$html("span",{class:"text-error text-[10px] absolute -bottom-5 left-2"},A(s)):null])};var It=(t)=>{let{options:o=[],value:e,onSelect:a,label:s,placeholder:n,...r}=t,l=R.$(A(e)||""),x=R.$(!1),c=R.$(-1),h=R.$(()=>{let m=l().toLowerCase(),v=A(o)||[];return m?v.filter((H)=>(typeof H==="string"?H:H.label).toLowerCase().includes(m)):v}),u=(m)=>{let v=typeof m==="string"?m:m.value,H=typeof m==="string"?m:m.label;if(l(H),typeof e==="function")e(v);a?.(m),x(!1),c(-1)},w=(m)=>{let v=h();if(m.key==="ArrowDown")m.preventDefault(),x(!0),c(Math.min(c()+1,v.length-1));else if(m.key==="ArrowUp")m.preventDefault(),c(Math.max(c()-1,0));else if(m.key==="Enter"&&c()>=0)m.preventDefault(),u(v[c()]);else if(m.key==="Escape")x(!1)};return R.$html("div",{class:"relative w-full"},[N({label:s,placeholder:n||D("search")(),value:l,onfocus:()=>x(!0),onblur:()=>setTimeout(()=>x(!1),150),onkeydown:w,oninput:(m)=>{let v=m.target.value;if(l(v),typeof e==="function")e(v);x(!0),c(-1)},...r}),R.$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:()=>x()&&h().length?"display:block":"display:none"},[R.$for(h,(m,v)=>R.$html("li",{},[R.$html("a",{class:()=>`block w-full ${c()===v?"active bg-primary text-primary-content":""}`,onclick:()=>u(m),onmouseenter:()=>c(v)},typeof m==="string"?m:m.label)]),(m,v)=>(typeof m==="string"?m:m.value)+v),()=>h().length?null:R.$html("li",{class:"p-2 text-center opacity-50"},"No results")])])};var Ft={};g(Ft,{Badge:()=>Ht});var Ko=p("sigpro");var Ht=(t,o)=>Ko.$html("span",{...t,class:d("badge",t.class)},o);var Qt={};g(Qt,{Button:()=>L});var j=p("sigpro");var L=(t,o)=>{let{badge:e,badgeClass:a,tooltip:s,icon:n,loading:r,...l}=t,c=j.$html("button",{...l,class:d("btn",t.class),disabled:()=>A(r)||A(t.disabled)},[()=>A(r)?j.$html("span",{class:"loading loading-spinner"}):null,n?j.$html("span",{class:"mr-1"},n):null,o]);if(e)c=j.$html("div",{class:"indicator"},[j.$html("span",{class:d("indicator-item badge",a||"badge-secondary")},e),c]);return s?j.$html("div",{class:"tooltip","data-tip":s},c):c};var jt={};g(jt,{Checkbox:()=>Nt});var ot=p("sigpro");var Nt=(t)=>{let{value:o,tooltip:e,toggle:a,label:s,...n}=t,r=ot.$html("input",{...n,type:"checkbox",class:()=>A(a)?"toggle":"checkbox",checked:o}),l=ot.$html("label",{class:"label cursor-pointer justify-start gap-3"},[r,s?ot.$html("span",{class:"label-text"},s):null]);return e?ot.$html("div",{class:"tooltip","data-tip":e},l):l};var Tt={};g(Tt,{Colorpicker:()=>Lt});var y=p("sigpro");var Lt=(t)=>{let{value:o,label:e,...a}=t,s=y.$(!1),n=["#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"],r=()=>A(o)||"#000000";return y.$html("div",{class:"relative w-fit"},[y.$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:(l)=>{l.stopPropagation(),s(!s())},...a},[y.$html("div",{class:"size-5 rounded-sm shadow-inner border border-black/10 shrink-0",style:()=>`background-color: ${r()}`}),e?y.$html("span",{class:"opacity-80"},e):null]),y.$if(s,()=>y.$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:(l)=>l.stopPropagation()},[y.$html("div",{class:"grid grid-cols-8 gap-1"},n.map((l)=>y.$html("button",{type:"button",style:`background-color: ${l}`,class:()=>{return`size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 - ${r().toLowerCase()===l.toLowerCase()?"ring-2 ring-offset-1 ring-primary z-10 scale-110":""}`},onclick:()=>{if(typeof o==="function")o(l);s(!1)}})))])),y.$if(s,()=>y.$html("div",{class:"fixed inset-0 z-[100]",onclick:()=>s(!1)}))])};var zt={};g(zt,{Datepicker:()=>Gt});var f=p("sigpro");var Gt=(t)=>{let{value:o,range:e,label:a,placeholder:s,hour:n=!1,...r}=t,l=f.$(!1),x=f.$(new Date),c=f.$(null),h=f.$(0),u=f.$(0),w=()=>A(e)===!0,m=new Date,v=`${m.getFullYear()}-${String(m.getMonth()+1).padStart(2,"0")}-${String(m.getDate()).padStart(2,"0")}`,H=(i)=>{let b=i.getFullYear(),C=String(i.getMonth()+1).padStart(2,"0"),V=String(i.getDate()).padStart(2,"0");return`${b}-${C}-${V}`},Wo=(i)=>{let b=H(i),C=A(o);if(w())if(!C?.start||C.start&&C.end){if(typeof o==="function")o({start:b,end:null,...n&&{startHour:h()}})}else{let V=C.start;if(typeof o==="function"){let _=b{let i=A(o);if(!i)return"";if(typeof i==="string"){if(n&&i.includes("T"))return i.replace("T"," ");return i}if(i.start&&i.end){let b=n&&i.startHour?`${i.start} ${String(i.startHour).padStart(2,"0")}:00`:i.start,C=n&&i.endHour?`${i.end} ${String(i.endHour).padStart(2,"0")}:00`:i.end;return`${b} - ${C}`}if(i.start)return`${n&&i.startHour?`${i.start} ${String(i.startHour).padStart(2,"0")}:00`:i.start}...`;return""}),Lo=(i)=>{let b=x();x(new Date(b.getFullYear(),b.getMonth()+i,1))},To=(i)=>{let b=x();x(new Date(b.getFullYear()+i,b.getMonth(),1))},wt=({value:i,onChange:b})=>{return f.$html("div",{class:"flex-1"},[f.$html("div",{class:"flex gap-2 items-center"},[f.$html("input",{type:"range",min:0,max:23,value:i,class:"range range-xs flex-1",oninput:(C)=>{let V=parseInt(C.target.value);b(V)}}),f.$html("span",{class:"text-sm font-mono min-w-[48px] text-center"},()=>String(A(i)).padStart(2,"0")+":00")])])};return f.$html("div",{class:"relative w-full"},[N({label:a,placeholder:s||(w()?"Seleccionar rango...":"Seleccionar fecha..."),value:$o,readonly:!0,icon:f.$html("img",{src:K,class:"opacity-40"}),onclick:(i)=>{i.stopPropagation(),l(!l())},...r}),f.$if(l,()=>f.$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:(i)=>i.stopPropagation()},[f.$html("div",{class:"flex justify-between items-center mb-4 gap-1"},[f.$html("div",{class:"flex gap-0.5"},[f.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>To(-1)},f.$html("img",{src:bt,class:"opacity-40"})),f.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>Lo(-1)},f.$html("img",{src:gt,class:"opacity-40"}))]),f.$html("span",{class:"font-bold uppercase flex-1 text-center"},[()=>x().toLocaleString("es-ES",{month:"short",year:"numeric"})]),f.$html("div",{class:"flex gap-0.5"},[f.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>Lo(1)},f.$html("img",{src:ut,class:"opacity-40"})),f.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>To(1)},f.$html("img",{src:pt,class:"opacity-40"}))])]),f.$html("div",{class:"grid grid-cols-7 gap-1",onmouseleave:()=>c(null)},[...["L","M","X","J","V","S","D"].map((i)=>f.$html("div",{class:"text-[10px] opacity-40 font-bold text-center"},i)),()=>{let i=x(),b=i.getFullYear(),C=i.getMonth(),V=new Date(b,C,1).getDay(),_=V===0?6:V-1,qo=new Date(b,C+1,0).getDate(),St=[];for(let Q=0;Q<_;Q++)St.push(f.$html("div"));for(let Q=1;Q<=qo;Q++){let Go=new Date(b,C,Q),k=H(Go);St.push(f.$html("button",{type:"button",class:()=>{let I=A(o),Ct=c(),_o=typeof I==="string"?I.split("T")[0]===k:I?.start===k,te=I?.end===k,yt=!1;if(w()&&I?.start){let Ut=I.start;if(!I.end&&Ct)yt=k>Ut&&k<=Ct||k=Ct;else if(I.end)yt=k>Ut&&k{if(w())c(k)},onclick:()=>Wo(Go)},[Q.toString()]))}return St}]),n?f.$html("div",{class:"mt-3 pt-2 border-t border-base-300"},[w()?f.$html("div",{class:"flex gap-4"},[wt({value:h,onChange:(i)=>{h(i);let b=A(o);if(b?.start)o({...b,startHour:i})}}),wt({value:u,onChange:(i)=>{u(i);let b=A(o);if(b?.end)o({...b,endHour:i})}})]):wt({value:h,onChange:(i)=>{h(i);let b=A(o);if(b&&typeof b==="string"&&b.includes("-"))o(b.split("T")[0]+"T"+String(i).padStart(2,"0")+":00:00")}})]):null])),f.$if(l,()=>f.$html("div",{class:"fixed inset-0 z-[90]",onclick:()=>l(!1)}))])};var Kt={};g(Kt,{Drawer:()=>Jt});var T=p("sigpro");var Jt=(t)=>T.$html("div",{class:d("drawer",t.class)},[T.$html("input",{id:t.id,type:"checkbox",class:"drawer-toggle",checked:t.open}),T.$html("div",{class:"drawer-content"},t.content),T.$html("div",{class:"drawer-side"},[T.$html("label",{for:t.id,class:"drawer-overlay",onclick:()=>t.open?.(!1)}),T.$html("div",{class:"min-h-full bg-base-200 w-80"},t.side)])]);var Pt={};g(Pt,{Dropdown:()=>Xt});var Bt=p("sigpro");var Xt=(t,o)=>{let{label:e,icon:a,...s}=t;return Bt.$html("div",{...s,class:()=>`dropdown ${A(t.class)||t.class||""}`},[Bt.$html("div",{tabindex:0,role:"button",class:"btn m-1 flex items-center gap-2"},[a?typeof a==="function"?a():a:null,e?typeof e==="function"?e():e:null]),Bt.$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"},[typeof o==="function"?o():o])])};var Ot={};g(Ot,{Fab:()=>Zt});var $=p("sigpro");var Zt=(t)=>{let{icon:o,label:e,actions:a=[],position:s="bottom-6 right-6",...n}=t;return $.$html("div",{...n,class:()=>`fab fixed ${A(s)} flex flex-col-reverse items-end gap-3 z-[100] ${t.class||""}`},[$.$html("div",{tabindex:0,role:"button",class:"btn btn-lg btn-circle btn-primary shadow-2xl"},[o?typeof o==="function"?o():o:null,!o&&e?e:null]),...A(a).map((r)=>$.$html("div",{class:"flex items-center gap-3 transition-all duration-300"},[r.label?$.$html("span",{class:"badge badge-ghost shadow-sm whitespace-nowrap"},r.label):null,$.$html("button",{type:"button",class:`btn btn-circle shadow-lg ${r.class||""}`,onclick:(l)=>{l.stopPropagation(),r.onclick?.(l)}},[r.icon?typeof r.icon==="function"?r.icon():r.icon:r.text||""])]))])};var qt={};g(qt,{Fieldset:()=>$t});var Wt=p("sigpro");var $t=(t,o)=>Wt.$html("fieldset",{...t,class:d("fieldset bg-base-200 border border-base-300 p-4 rounded-lg",t.class)},[()=>{let e=A(t.legend);return e?Wt.$html("legend",{class:"fieldset-legend font-bold"},[e]):null},o]);var to={};g(to,{Fileinput:()=>_t});var B=p("sigpro");var _t=(t)=>{let{tooltip:o,max:e=2,accept:a="*",onSelect:s}=t,n=B.$([]),r=B.$(!1),l=B.$(null),x=e*1024*1024,c=(u)=>{let w=Array.from(u);if(l(null),w.find((v)=>v.size>x)){l(`Máx ${e}MB`);return}n([...n(),...w]),s?.(n())},h=(u)=>{let w=n().filter((m,v)=>v!==u);n(w),s?.(w)};return B.$html("fieldset",{class:"fieldset w-full p-0"},[B.$html("div",{class:()=>`w-full ${o?"tooltip tooltip-top before:z-50 after:z-50":""}`,"data-tip":o},[B.$html("label",{class:()=>` - relative flex items-center justify-between w-full h-12 px-4 - border-2 border-dashed rounded-lg cursor-pointer - transition-all duration-200 - ${r()?"border-primary bg-primary/10":"border-base-content/20 bg-base-100 hover:bg-base-200"} - `,ondragover:(u)=>{u.preventDefault(),r(!0)},ondragleave:()=>r(!1),ondrop:(u)=>{u.preventDefault(),r(!1),c(u.dataTransfer.files)}},[B.$html("div",{class:"flex items-center gap-3 w-full"},[B.$html("img",{src:xt,class:"w-5 h-5 opacity-50 shrink-0"}),B.$html("span",{class:"text-sm opacity-70 truncate grow text-left"},"Arrastra o selecciona archivos..."),B.$html("span",{class:"text-[10px] opacity-40 shrink-0"},`Máx ${e}MB`)]),B.$html("input",{type:"file",multiple:!0,accept:a,class:"hidden",onchange:(u)=>c(u.target.files)})])]),()=>l()?B.$html("span",{class:"text-[10px] text-error mt-1 px-1 font-medium"},l()):null,B.$if(()=>n().length>0,()=>B.$html("ul",{class:"mt-2 space-y-1"},[B.$for(n,(u,w)=>B.$html("li",{class:"flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300"},[B.$html("div",{class:"flex items-center gap-2 truncate"},[B.$html("span",{class:"opacity-50"},"\uD83D\uDCC4"),B.$html("span",{class:"truncate font-medium max-w-[200px]"},u.name),B.$html("span",{class:"text-[9px] opacity-40"},`(${(u.size/1024).toFixed(0)} KB)`)]),B.$html("button",{type:"button",class:"btn btn-ghost btn-xs btn-circle",onclick:(m)=>{m.preventDefault(),m.stopPropagation(),h(w)}},[B.$html("img",{src:ct,class:"w-3 h-3 opacity-70"})])]),(u)=>u.name+u.lastModified)]))])};var ao={};g(ao,{Indicator:()=>eo});var oo=p("sigpro");var eo=(t,o)=>oo.$html("div",{class:d("indicator",t.class)},[o,oo.$html("span",{class:d("indicator-item badge",t.badgeClass)},t.badge)]);var so={};g(so,{List:()=>Ao});var F=p("sigpro");var Ao=(t)=>{let{items:o,header:e,render:a,keyFn:s,class:n}=t;return F.$html("ul",{class:d("list bg-base-100 rounded-box shadow-md",n)},[F.$if(e,()=>F.$html("li",{class:"p-4 pb-2 text-xs opacity-60 tracking-wide"},[A(e)])),F.$for(o,(r,l)=>F.$html("li",{class:"list-row"},[a(r,l)]),s)])};var no={};g(no,{Loading:()=>ro});var et=p("sigpro"),ro=(t)=>{return et.$if(t.$show,()=>et.$html("div",{class:"fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30"},[et.$html("span",{class:"loading loading-spinner loading-lg text-primary"})]))};var co={};g(co,{Menu:()=>lo});var E=p("sigpro");var lo=(t)=>{let o=(e)=>E.$for(()=>e||[],(a)=>E.$html("li",{},[a.children?E.$html("details",{open:a.open},[E.$html("summary",{},[a.icon&&E.$html("span",{class:"mr-2"},a.icon),a.label]),E.$html("ul",{},o(a.children))]):E.$html("a",{class:()=>A(a.active)?"active":"",onclick:a.onclick},[a.icon&&E.$html("span",{class:"mr-2"},a.icon),a.label])]),(a,s)=>a.label||s);return E.$html("ul",{...t,class:d("menu bg-base-200 rounded-box",t.class)},o(t.items))};var mo={};g(mo,{Modal:()=>io});var M=p("sigpro");var io=(t,o)=>{let{title:e,buttons:a,open:s,...n}=t,r=()=>s(!1);return M.$if(s,()=>M.$html("dialog",{...n,class:"modal modal-open"},[M.$html("div",{class:"modal-box"},[e?M.$html("h3",{class:"text-lg font-bold mb-4"},e):null,typeof o==="function"?o():o,M.$html("div",{class:"modal-action flex gap-2"},[...(Array.isArray(a)?a:[a]).filter(Boolean),L({onclick:r},D("close")())])]),M.$html("form",{method:"dialog",class:"modal-backdrop",onclick:(l)=>(l.preventDefault(),r())},[M.$html("button",{},"close")])]))};var go={};g(go,{Navbar:()=>fo});var Xo=p("sigpro");var fo=(t,o)=>Xo.$html("div",{...t,class:d("navbar bg-base-100 shadow-sm px-4",t.class)},o);var bo={};g(bo,{Radio:()=>uo});var at=p("sigpro");var uo=(t)=>{let{label:o,tooltip:e,value:a,...s}=t,n=at.$html("input",{...s,type:"radio",class:d("radio",t.class),checked:()=>A(a)===t.value,disabled:()=>A(t.disabled),onclick:()=>typeof a==="function"&&a(t.value)});if(!o&&!e)return n;let r=at.$html("label",{class:"label cursor-pointer justify-start gap-3"},[n,o?at.$html("span",{class:"label-text"},o):null]);return e?at.$html("div",{class:"tooltip","data-tip":e},r):r};var xo={};g(xo,{Range:()=>po});var At=p("sigpro");var po=(t)=>{let{label:o,tooltip:e,value:a,...s}=t,n=At.$html("input",{...s,type:"range",class:d("range",t.class),value:a,disabled:()=>A(t.disabled)});if(!o&&!e)return n;let r=At.$html("div",{class:"flex flex-col gap-2"},[o?At.$html("span",{class:"label-text"},o):null,n]);return e?At.$html("div",{class:"tooltip","data-tip":e},r):r};var vo={};g(vo,{Rating:()=>Bo});var ho=p("sigpro");var Bo=(t)=>{let{value:o,count:e=5,mask:a="mask-star",readonly:s=!1,...n}=t,r=`rating-${Math.random().toString(36).slice(2,7)}`;return ho.$html("div",{...n,class:()=>`rating ${A(s)?"pointer-events-none":""} ${t.class||""}`},Array.from({length:A(e)},(l,x)=>{let c=x+1;return ho.$html("input",{type:"radio",name:r,class:`mask ${a}`,"aria-label":`${c} star`,checked:()=>Math.round(A(o))===c,onchange:()=>{if(!A(s)&&typeof o==="function")o(c)}})}))};var So={};g(So,{Select:()=>wo});var G=p("sigpro");var wo=(t)=>{let{label:o,options:e,value:a,...s}=t,n=G.$html("select",{...s,class:d("select select-bordered w-full",t.class),value:a},G.$for(()=>A(e)||[],(r)=>G.$html("option",{value:r.value,$selected:()=>String(A(a))===String(r.value)},r.label),(r)=>r.value));if(!o)return n;return G.$html("label",{class:"fieldset-label flex flex-col gap-1"},[G.$html("span",{},o),n])};var yo={};g(yo,{Stack:()=>Co});var Po=p("sigpro");var Co=(t,o)=>Po.$html("div",{...t,class:d("stack",t.class)},o);var Ro={};g(Ro,{Stat:()=>Uo});var q=p("sigpro");var Uo=(t)=>q.$html("div",{...t,class:d("stat",t.class)},[t.icon&&q.$html("div",{class:"stat-figure text-secondary"},t.icon),t.label&&q.$html("div",{class:"stat-title"},t.label),q.$html("div",{class:"stat-value"},()=>A(t.value)??t.value),t.desc&&q.$html("div",{class:"stat-desc"},t.desc)]);var ko={};g(ko,{Swap:()=>Do});var st=p("sigpro");var Do=(t)=>st.$html("label",{class:d("swap",t.class)},[st.$html("input",{type:"checkbox",checked:t.value}),st.$html("div",{class:"swap-on"},t.on),st.$html("div",{class:"swap-off"},t.off)]);var Yo={};g(Yo,{Table:()=>Eo});var S=p("sigpro");var Eo=(t)=>{let{items:o=[],columns:e=[],keyFn:a,zebra:s=!1,pinRows:n=!1,empty:r=D("nodata")(),...l}=t;return S.$html("div",{class:"overflow-x-auto w-full bg-base-100 rounded-box border border-base-300"},[S.$html("table",{...l,class:()=>d("table",`${A(s)?"table-zebra":""} ${A(n)?"table-pin-rows":""} ${t.class||""}`)},[S.$html("thead",{},[S.$html("tr",{},e.map((c)=>S.$html("th",{class:c.class||""},c.label)))]),S.$html("tbody",{},[S.$for(o,(c,h)=>{return S.$html("tr",{class:"hover"},e.map((u)=>{let w=()=>{if(u.render)return u.render(c,h);let m=c[u.key];return A(m)};return S.$html("td",{class:u.class||""},[w])}))},a||((c,h)=>c.id||h)),S.$if(()=>A(o).length===0,()=>S.$html("tr",{},[S.$html("td",{colspan:e.length,class:"text-center p-10 opacity-50"},[A(r)])]))]),S.$if(()=>e.some((c)=>c.footer),()=>S.$html("tfoot",{},[S.$html("tr",{},e.map((c)=>S.$html("th",{},c.footer||"")))]))])])};var Io={};g(Io,{Tabs:()=>Vo});var z=p("sigpro");var Vo=(t)=>{let{items:o,...e}=t,a=typeof o==="function"?o:()=>o||[];return z.$html("div",{...e,class:"flex flex-col gap-4 w-full"},[z.$html("div",{role:"tablist",class:d("tabs tabs-box",t.class)},z.$for(a,(s)=>z.$html("a",{role:"tab",class:()=>d("tab",A(s.active)&&"tab-active",A(s.disabled)&&"tab-disabled",s.tip&&"tooltip"),"data-tip":s.tip,onclick:(n)=>!A(s.disabled)&&s.onclick?.(n)},s.label),(s)=>s.label)),()=>{let s=a().find((r)=>A(r.active));if(!s)return null;let n=A(s.content);return z.$html("div",{class:"p-4"},[typeof n==="function"?n():n])}])};var Ho={};g(Ho,{Timeline:()=>Mo});var Y=p("sigpro");var Mo=(t)=>{let{items:o=[],vertical:e=!0,compact:a=!1,...s}=t,n={info:X,success:P,warning:O,error:Z};return Y.$html("ul",{...s,class:()=>`timeline ${A(e)?"timeline-vertical":"timeline-horizontal"} ${A(a)?"timeline-compact":""} ${t.class||""}`},[Y.$for(o,(r,l)=>{let x=l===0,c=l===A(o).length-1,h=r.type||"success",u=(w)=>typeof w==="function"?w():w;return Y.$html("li",{class:"flex-1"},[!x?Y.$html("hr",{class:r.completed?"bg-primary":""}):null,Y.$html("div",{class:"timeline-start"},[u(r.title)]),Y.$html("div",{class:"timeline-middle"},[Y.$html("img",{src:n[h]||r.icon||n.success,class:"w-4 h-4 object-contain mx-1",alt:h})]),Y.$html("div",{class:"timeline-end timeline-box shadow-sm"},[u(r.detail)]),!c?Y.$html("hr",{class:r.completed?"bg-primary":""}):null])},(r,l)=>r.id||l)])};var Qo={};g(Qo,{Toast:()=>Fo});var J=p("sigpro");var Fo=(t,o="alert-success",e=3500)=>{let a=document.getElementById("sigpro-toast-container");if(!a)a=J.$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);let s=J.$html("div",{style:"display: contents"});a.appendChild(s);let n,r=()=>{clearTimeout(n);let c=s.firstElementChild;if(c&&!c.classList.contains("opacity-0"))c.classList.add("translate-x-full","opacity-0"),setTimeout(()=>{if(x.destroy(),s.remove(),!a.hasChildNodes())a.remove()},300);else x.destroy(),s.remove()},x=J.$mount(()=>{let c=J.$html("div",{class:`alert alert-soft ${o} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`},[J.$html("span",{},[typeof t==="function"?t():t]),L({class:"btn-xs btn-circle btn-ghost",onclick:r},"✕")]);return requestAnimationFrame(()=>c.classList.remove("translate-x-10","opacity-0")),c},s);if(e>0)n=setTimeout(r,e);return r};var jo={};g(jo,{Tooltip:()=>No});var Zo=p("sigpro");var No=(t,o)=>Zo.$html("div",{...t,class:d("tooltip",t.class),"data-tip":t.tip},o);var Oo={...kt,...Yt,...Mt,...Ft,...Qt,...jt,...Tt,...zt,...Kt,...Pt,...Ot,...qt,...to,...ao,...Vt,...so,...no,...co,...mo,...go,...bo,...xo,...vo,...So,...yo,...Ro,...ko,...Yo,...Io,...Ho,...Qo,...jo},ne={...Oo,install:(t=window)=>{Object.entries(Oo).forEach(([o,e])=>{t[o]=e}),console.log("\uD83D\uDE80 SigproUI")}};var le={...vt,Icons:ht,Utils:rt,tt:D,install:(t=typeof window<"u"?window:{})=>{Object.entries(vt).forEach(([o,e])=>{t[o]=e}),t.Icons=ht,t.Utils=rt,t.tt=D,console.log("\uD83C\uDF1F SigproUI")}},ie=le;})(); diff --git a/dist/sigpro-ui.umd.js b/dist/sigpro-ui.umd.js new file mode 100644 index 0000000..541f18b --- /dev/null +++ b/dist/sigpro-ui.umd.js @@ -0,0 +1,1676 @@ +var SigProUI = (function (exports, sigpro) { + 'use strict'; + + const val = t => typeof t === "function" ? t() : t; + + const joinClass = (t, l) => typeof l === "function" + ? () => `${t} ${l() || ""}`.trim() + : `${t} ${l || ""}`.trim(); + + var Utils = /*#__PURE__*/Object.freeze({ + __proto__: null, + joinClass: joinClass, + val: val + }); + + /** ACCORDION */ + const Accordion = (props, children) => { + const { title, name, open, ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: joinClass("collapse collapse-arrow bg-base-200 mb-2", props.class), + }, + [ + sigpro.$html("input", { + type: name ? "radio" : "checkbox", + name: name, + checked: open + }), + sigpro.$html("div", { class: "collapse-title text-xl font-medium" }, title), + sigpro.$html("div", { class: "collapse-content" }, children), + ], + ); + }; + + var AccordionModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion + }); + + const iconShow = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg=="; + const iconHide = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC"; + const iconClose = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg=="; + const iconCalendar = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC"; + const iconLock = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII="; + const iconAbc = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg=="; + const icon123 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg=="; + const iconMail = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC"; + const iconInfo = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC"; + const iconSuccess = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg=="; + const iconError = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC"; + const iconWarning = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII="; + const iconLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg=="; + const iconRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg=="; + const iconLLeft = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg=="; + const iconRRight = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII="; + const iconUpload = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC"; + + var Icons = /*#__PURE__*/Object.freeze({ + __proto__: null, + icon123: icon123, + iconAbc: iconAbc, + iconCalendar: iconCalendar, + iconClose: iconClose, + iconError: iconError, + iconHide: iconHide, + iconInfo: iconInfo, + iconLLeft: iconLLeft, + iconLeft: iconLeft, + iconLock: iconLock, + iconMail: iconMail, + iconRRight: iconRRight, + iconRight: iconRight, + iconShow: iconShow, + iconSuccess: iconSuccess, + iconUpload: iconUpload, + iconWarning: iconWarning + }); + + /** ALERT */ + const Alert = (props, children) => { + const { type = "info", soft = true, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + const typeClass = () => { + const t = val(type); + const map = { + info: "alert-info", + success: "alert-success", + warning: "alert-warning", + error: "alert-error", + }; + return map[t] || t; + }; + + const content = children || props.message; + + return sigpro.$html( + "div", + { + ...rest, + role: "alert", + class: () => `alert ${typeClass()} ${val(soft) ? "alert-soft" : ""} ${props.class || ""}`, + }, + [ + sigpro.$html("img", { + src: icons[val(type)] || icons.info, + class: "w-4 h-4 object-contain", + alt: val(type), + }), + sigpro.$html("div", { class: "flex-1" }, [ + sigpro.$html("span", {}, [typeof content === "function" ? content() : content]) + ]), + props.actions ? sigpro.$html("div", { class: "flex-none" }, [ + typeof props.actions === "function" ? props.actions() : props.actions + ]) : null, + ], + ); + }; + + var AlertModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Alert: Alert + }); + + const i18n = { + es: { + close: "Cerrar", + confirm: "Confirmar", + cancel: "Cancelar", + search: "Buscar...", + loading: "Cargando...", + nodata: "Sin datos" + }, + en: { + close: "Close", + confirm: "Confirm", + cancel: "Cancel", + search: "Search...", + loading: "Loading...", + nodata: "No data" + } + }; + + const currentLocale = sigpro.$("es"); + + const tt = t => () => i18n[currentLocale()][t] || t; + + /** INPUT */ + const Input = (props) => { + const { label, tip, value, error, isSearch, icon, type = "text", ...rest } = props; + const isPassword = type === "password"; + const visible = sigpro.$(false); + + const iconsByType = { + text: iconAbc, + password: iconLock, + date: iconCalendar, + number: icon123, + email: iconMail, + }; + + const inputEl = sigpro.$html("input", { + ...rest, + type: () => (isPassword ? (visible() ? "text" : "password") : type), + placeholder: props.placeholder || label || (isSearch ? tt("search")() : " "), + 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] ? sigpro.$html("img", { src: iconsByType[type], class: "opacity-50", alt: type }) : null; + + return sigpro.$html( + "label", + { + class: () => joinClass("input input-bordered floating-label flex items-center gap-2 w-full relative", val(error) ? "input-error" : ""), + }, + [ + leftIcon ? sigpro.$html("div", { class: "order-1 shrink-0" }, leftIcon) : null, + label ? sigpro.$html("span", { class: "text-base-content/60 order-0" }, label) : null, + inputEl, + isPassword + ? sigpro.$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()); + }, + }, + () => + sigpro.$html("img", { + class: "w-5 h-5", + src: visible() ? iconShow : iconHide, + }), + ) + : null, + tip + ? sigpro.$html( + "div", + { class: "tooltip tooltip-left order-4", "data-tip": tip }, + sigpro.$html("span", { class: "badge badge-ghost badge-xs cursor-help" }, "?"), + ) + : null, + () => (val(error) ? sigpro.$html("span", { class: "text-error text-[10px] absolute -bottom-5 left-2" }, val(error)) : null), + ], + ); + }; + + var InputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Input: Input + }); + + /** AUTOCOMPLETE */ + const Autocomplete = (props) => { + const { options = [], value, onSelect, label, placeholder, ...rest } = props; + + const query = sigpro.$(val(value) || ""); + const isOpen = sigpro.$(false); + const cursor = sigpro.$(-1); + + const list = sigpro.$(() => { + const q = query().toLowerCase(); + const data = val(options) || []; + return q + ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) + : data; + }); + + const pick = (opt) => { + const valStr = typeof opt === "string" ? opt : opt.value; + const labelStr = typeof opt === "string" ? opt : opt.label; + + query(labelStr); + if (typeof value === "function") value(valStr); + onSelect?.(opt); + + isOpen(false); + cursor(-1); + }; + + const nav = (e) => { + const items = list(); + if (e.key === "ArrowDown") { + e.preventDefault(); + isOpen(true); + cursor(Math.min(cursor() + 1, items.length - 1)); + } else if (e.key === "ArrowUp") { + e.preventDefault(); + cursor(Math.max(cursor() - 1, 0)); + } else if (e.key === "Enter" && cursor() >= 0) { + e.preventDefault(); + pick(items[cursor()]); + } else if (e.key === "Escape") { + isOpen(false); + } + }; + + return sigpro.$html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || tt("search")(), + 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); + isOpen(true); + cursor(-1); + }, + ...rest, + }), + sigpro.$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: () => (isOpen() && list().length ? "display:block" : "display:none"), + }, + [ + sigpro.$for( + list, + (opt, i) => + sigpro.$html("li", {}, [ + sigpro.$html( + "a", + { + class: () => `block w-full ${cursor() === i ? "active bg-primary text-primary-content" : ""}`, + onclick: () => pick(opt), + onmouseenter: () => cursor(i), + }, + typeof opt === "string" ? opt : opt.label, + ), + ]), + (opt, i) => (typeof opt === "string" ? opt : opt.value) + i, + ), + () => (list().length ? null : sigpro.$html("li", { class: "p-2 text-center opacity-50" }, "No results")), + ], + ), + ]); + }; + + var AutocompleteModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Autocomplete: Autocomplete + }); + + /** BADGE */ + const Badge = (props, children) => + sigpro.$html("span", { ...props, class: joinClass("badge", props.class) }, children); + + var BadgeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Badge: Badge + }); + + /** BUTTON */ + const Button = (props, children) => { + const { badge, badgeClass, tooltip, icon, loading, ...rest } = props; + + const btn = sigpro.$html( + "button", + { + ...rest, + // Usamos props.class directamente + class: joinClass("btn", props.class), + disabled: () => val(loading) || val(props.disabled), + }, + [ + () => (val(loading) ? sigpro.$html("span", { class: "loading loading-spinner" }) : null), + icon ? sigpro.$html("span", { class: "mr-1" }, icon) : null, + children, + ] + ); + + let out = btn; + + if (badge) { + out = sigpro.$html("div", { class: "indicator" }, [ + sigpro.$html( + "span", + { class: joinClass("indicator-item badge", badgeClass || "badge-secondary") }, + badge + ), + out, + ]); + } + + return tooltip + ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, out) + : out; + }; + + var ButtonModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Button: Button + }); + + /** CHECKBOX */ + const Checkbox = (props) => { + const { value, tooltip, toggle, label, ...rest } = props; + + const checkEl = sigpro.$html("input", { + ...rest, + type: "checkbox", + class: () => (val(toggle) ? "toggle" : "checkbox"), + checked: value + }); + + const layout = sigpro.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + checkEl, + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; + }; + + var CheckboxModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Checkbox: Checkbox + }); + + /** COLORPICKER */ + const Colorpicker = (props) => { + const { value, label, ...rest } = props; + const isOpen = sigpro.$(false); + + const palette = [ + ...["#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"], + ]; + + const getColor = () => val(value) || "#000000"; + + return sigpro.$html("div", { class: "relative w-fit" }, [ + sigpro.$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: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }, + [ + sigpro.$html("div", { + class: "size-5 rounded-sm shadow-inner border border-black/10 shrink-0", + style: () => `background-color: ${getColor()}`, + }), + label ? sigpro.$html("span", { class: "opacity-80" }, label) : null, + ], + ), + + sigpro.$if(isOpen, () => + sigpro.$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: (e) => e.stopPropagation(), + }, + [ + sigpro.$html( + "div", + { class: "grid grid-cols-8 gap-1" }, + palette.map((c) => + sigpro.$html("button", { + type: "button", + style: `background-color: ${c}`, + class: () => { + const active = getColor().toLowerCase() === c.toLowerCase(); + return `size-6 rounded-sm cursor-pointer transition-all hover:scale-125 hover:z-10 active:scale-95 outline-none border border-black/5 + ${active ? "ring-2 ring-offset-1 ring-primary z-10 scale-110" : ""}`; + }, + onclick: () => { + if (typeof value === "function") value(c); + isOpen(false); + }, + }), + ), + ), + ], + ), + ), + + sigpro.$if(isOpen, () => + sigpro.$html("div", { + class: "fixed inset-0 z-[100]", + onclick: () => isOpen(false), + }), + ), + ]); + }; + + var ColorpickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Colorpicker: Colorpicker + }); + + /** DATEPICKER */ + const Datepicker = (props) => { + const { value, range, label, placeholder, hour = false, ...rest } = props; + + const isOpen = sigpro.$(false); + const internalDate = sigpro.$(new Date()); + const hoverDate = sigpro.$(null); + const startHour = sigpro.$(0); + const endHour = sigpro.$(0); + const isRangeMode = () => val(range) === true; + + const now = new Date(); + const todayStr = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")}`; + + const formatDate = (d) => { + const year = d.getFullYear(); + const month = String(d.getMonth() + 1).padStart(2, "0"); + const day = String(d.getDate()).padStart(2, "0"); + return `${year}-${month}-${day}`; + }; + + const selectDate = (date) => { + const dateStr = formatDate(date); + const current = val(value); + + if (isRangeMode()) { + if (!current?.start || (current.start && current.end)) { + if (typeof value === "function") { + value({ + start: dateStr, + end: null, + ...(hour && { startHour: startHour() }), + }); + } + } else { + const start = current.start; + if (typeof value === "function") { + const newValue = dateStr < start ? { start: dateStr, end: start } : { start, end: dateStr }; + if (hour) { + newValue.startHour = current.startHour || startHour(); + newValue.endHour = current.endHour || endHour(); + } + value(newValue); + } + isOpen(false); + } + } else { + if (typeof value === "function") { + value(hour ? `${dateStr}T${String(startHour()).padStart(2, "0")}:00:00` : dateStr); + } + isOpen(false); + } + }; + + const displayValue = sigpro.$(() => { + const v = val(value); + if (!v) return ""; + if (typeof v === "string") { + if (hour && v.includes("T")) return v.replace("T", " "); + return v; + } + if (v.start && v.end) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end; + return `${startStr} - ${endStr}`; + } + if (v.start) { + const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start; + return `${startStr}...`; + } + return ""; + }); + + const move = (m) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear(), d.getMonth() + m, 1)); + }; + + const moveYear = (y) => { + const d = internalDate(); + internalDate(new Date(d.getFullYear() + y, d.getMonth(), 1)); + }; + + const HourSlider = ({ value: hVal, onChange }) => { + return sigpro.$html("div", { class: "flex-1" }, [ + sigpro.$html("div", { class: "flex gap-2 items-center" }, [ + sigpro.$html("input", { + type: "range", + min: 0, + max: 23, + value: hVal, + class: "range range-xs flex-1", + oninput: (e) => { + const newHour = parseInt(e.target.value); + onChange(newHour); + }, + }), + sigpro.$html("span", { class: "text-sm font-mono min-w-[48px] text-center" }, + () => String(val(hVal)).padStart(2, "0") + ":00" + ), + ]), + ]); + }; + + return sigpro.$html("div", { class: "relative w-full" }, [ + Input({ + label, + placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."), + value: displayValue, + readonly: true, + icon: sigpro.$html("img", { src: iconCalendar, class: "opacity-40" }), + onclick: (e) => { + e.stopPropagation(); + isOpen(!isOpen()); + }, + ...rest, + }), + + sigpro.$if(isOpen, () => + sigpro.$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: (e) => e.stopPropagation(), + }, + [ + sigpro.$html("div", { class: "flex justify-between items-center mb-4 gap-1" }, [ + sigpro.$html("div", { class: "flex gap-0.5" }, [ + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(-1) }, + sigpro.$html("img", { src: iconLLeft, class: "opacity-40" }) + ), + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(-1) }, + sigpro.$html("img", { src: iconLeft, class: "opacity-40" }) + ), + ]), + sigpro.$html("span", { class: "font-bold uppercase flex-1 text-center" }, [ + () => internalDate().toLocaleString("es-ES", { month: "short", year: "numeric" }), + ]), + sigpro.$html("div", { class: "flex gap-0.5" }, [ + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => move(1) }, + sigpro.$html("img", { src: iconRight, class: "opacity-40" }) + ), + sigpro.$html("button", { type: "button", class: "btn btn-ghost btn-xs px-1", onclick: () => moveYear(1) }, + sigpro.$html("img", { src: iconRRight, class: "opacity-40" }) + ), + ]), + ]), + + sigpro.$html("div", { class: "grid grid-cols-7 gap-1", onmouseleave: () => hoverDate(null) }, [ + ...["L", "M", "X", "J", "V", "S", "D"].map((d) => sigpro.$html("div", { class: "text-[10px] opacity-40 font-bold text-center" }, d)), + () => { + const d = internalDate(); + const year = d.getFullYear(); + const month = d.getMonth(); + const firstDay = new Date(year, month, 1).getDay(); + const offset = firstDay === 0 ? 6 : firstDay - 1; + const daysInMonth = new Date(year, month + 1, 0).getDate(); + + const nodes = []; + for (let i = 0; i < offset; i++) nodes.push(sigpro.$html("div")); + + for (let i = 1; i <= daysInMonth; i++) { + const date = new Date(year, month, i); + const dStr = formatDate(date); + + nodes.push( + sigpro.$html( + "button", + { + type: "button", + class: () => { + const v = val(value); + const h = hoverDate(); + const isStart = typeof v === "string" ? v.split("T")[0] === dStr : v?.start === dStr; + const isEnd = v?.end === dStr; + let inRange = false; + + if (isRangeMode() && v?.start) { + const start = v.start; + if (!v.end && h) { + inRange = (dStr > start && dStr <= h) || (dStr < start && dStr >= h); + } else if (v.end) { + inRange = dStr > start && dStr < v.end; + } + } + + const base = "btn btn-xs p-0 aspect-square min-h-0 h-auto font-normal relative"; + const state = isStart || isEnd ? "btn-primary z-10" : inRange ? "bg-primary/20 border-none rounded-none" : "btn-ghost"; + const today = dStr === todayStr ? "ring-1 ring-primary ring-inset font-black text-primary" : ""; + + return `${base} ${state} ${today}`; + }, + onmouseenter: () => { if (isRangeMode()) hoverDate(dStr); }, + onclick: () => selectDate(date), + }, + [i.toString()], + ), + ); + } + return nodes; + }, + ]), + + hour ? sigpro.$html("div", { class: "mt-3 pt-2 border-t border-base-300" }, [ + isRangeMode() + ? sigpro.$html("div", { class: "flex gap-4" }, [ + HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal?.start) value({ ...currentVal, startHour: newHour }); + }, + }), + HourSlider({ + value: endHour, + onChange: (newHour) => { + endHour(newHour); + const currentVal = val(value); + if (currentVal?.end) value({ ...currentVal, endHour: newHour }); + }, + }), + ]) + : HourSlider({ + value: startHour, + onChange: (newHour) => { + startHour(newHour); + const currentVal = val(value); + if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) { + value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00"); + } + }, + }), + ]) : null, + ], + ), + ), + + sigpro.$if(isOpen, () => sigpro.$html("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })), + ]); + }; + + var DatepickerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Datepicker: Datepicker + }); + + /** DRAWER */ + const Drawer = (props) => + sigpro.$html("div", { class: joinClass("drawer", props.class) }, [ + sigpro.$html("input", { + id: props.id, + type: "checkbox", + class: "drawer-toggle", + checked: props.open, + }), + sigpro.$html("div", { class: "drawer-content" }, props.content), + sigpro.$html("div", { class: "drawer-side" }, [ + sigpro.$html("label", { for: props.id, class: "drawer-overlay", onclick: () => props.open?.(false) }), + sigpro.$html("div", { class: "min-h-full bg-base-200 w-80" }, props.side), + ]), + ]); + + var DrawerModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Drawer: Drawer + }); + + /** DROPDOWN */ + const Dropdown = (props, children) => { + const { label, icon, ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `dropdown ${val(props.class) || props.class || ""}`, + }, + [ + sigpro.$html( + "div", + { + tabindex: 0, + role: "button", + class: "btn m-1 flex items-center gap-2", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + label ? (typeof label === "function" ? label() : label) : null + ], + ), + sigpro.$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", + }, + [typeof children === "function" ? children() : children], + ), + ], + ); + }; + + var DropdownModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Dropdown: Dropdown + }); + + /** FAB (Floating Action Button) */ + const Fab = (props) => { + const { icon, label, actions = [], position = "bottom-6 right-6", ...rest } = props; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `fab fixed ${val(position)} flex flex-col-reverse items-end gap-3 z-[100] ${ + props.class || "" + }`, + }, + [ + // Botón principal + sigpro.$html( + "div", + { + tabindex: 0, + role: "button", + class: "btn btn-lg btn-circle btn-primary shadow-2xl", + }, + [ + icon ? (typeof icon === "function" ? icon() : icon) : null, + !icon && label ? label : null + ], + ), + + // Acciones secundarias (se despliegan hacia arriba) + ...val(actions).map((act) => + sigpro.$html("div", { class: "flex items-center gap-3 transition-all duration-300" }, [ + act.label ? sigpro.$html("span", { class: "badge badge-ghost shadow-sm whitespace-nowrap" }, act.label) : null, + sigpro.$html( + "button", + { + type: "button", + class: `btn btn-circle shadow-lg ${act.class || ""}`, + onclick: (e) => { + e.stopPropagation(); + act.onclick?.(e); + }, + }, + [act.icon ? (typeof act.icon === "function" ? act.icon() : act.icon) : act.text || ""], + ), + ]), + ), + ], + ); + }; + + var FabModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fab: Fab + }); + + /** FIELDSET */ + const Fieldset = (props, children) => + sigpro.$html( + "fieldset", + { + ...props, + class: joinClass("fieldset bg-base-200 border border-base-300 p-4 rounded-lg", props.class), + }, + [ + () => { + const legendText = val(props.legend); + return legendText ? sigpro.$html("legend", { class: "fieldset-legend font-bold" }, [legendText]) : null; + }, + children, + ], + ); + + var FieldsetModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fieldset: Fieldset + }); + + /** FILEINPUT */ + const Fileinput = (props) => { + const { tooltip, max = 2, accept = "*", onSelect } = props; + + const selectedFiles = sigpro.$([]); + const isDragging = sigpro.$(false); + const error = sigpro.$(null); + const MAX_BYTES = max * 1024 * 1024; + + const handleFiles = (files) => { + const fileList = Array.from(files); + error(null); + const oversized = fileList.find((f) => f.size > MAX_BYTES); + + if (oversized) { + error(`Máx ${max}MB`); + return; + } + + selectedFiles([...selectedFiles(), ...fileList]); + onSelect?.(selectedFiles()); + }; + + const removeFile = (index) => { + const updated = selectedFiles().filter((_, i) => i !== index); + selectedFiles(updated); + onSelect?.(updated); + }; + + return sigpro.$html("fieldset", { class: "fieldset w-full p-0" }, [ + sigpro.$html( + "div", + { + class: () => `w-full ${tooltip ? "tooltip tooltip-top before:z-50 after:z-50" : ""}`, + "data-tip": tooltip, + }, + [ + sigpro.$html( + "label", + { + class: () => ` + relative flex items-center justify-between w-full h-12 px-4 + border-2 border-dashed rounded-lg cursor-pointer + transition-all duration-200 + ${isDragging() ? "border-primary bg-primary/10" : "border-base-content/20 bg-base-100 hover:bg-base-200"} + `, + ondragover: (e) => { + e.preventDefault(); + isDragging(true); + }, + ondragleave: () => isDragging(false), + ondrop: (e) => { + e.preventDefault(); + isDragging(false); + handleFiles(e.dataTransfer.files); + }, + }, + [ + sigpro.$html("div", { class: "flex items-center gap-3 w-full" }, [ + sigpro.$html("img", { src: iconUpload, class: "w-5 h-5 opacity-50 shrink-0" }), + sigpro.$html("span", { class: "text-sm opacity-70 truncate grow text-left" }, "Arrastra o selecciona archivos..."), + sigpro.$html("span", { class: "text-[10px] opacity-40 shrink-0" }, `Máx ${max}MB`), + ]), + sigpro.$html("input", { + type: "file", + multiple: true, + accept: accept, + class: "hidden", + onchange: (e) => handleFiles(e.target.files), + }), + ], + ), + ], + ), + + () => (error() ? sigpro.$html("span", { class: "text-[10px] text-error mt-1 px-1 font-medium" }, error()) : null), + + sigpro.$if( + () => selectedFiles().length > 0, + () => + sigpro.$html("ul", { class: "mt-2 space-y-1" }, [ + sigpro.$for( + selectedFiles, + (file, index) => + sigpro.$html("li", { class: "flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300" }, [ + sigpro.$html("div", { class: "flex items-center gap-2 truncate" }, [ + sigpro.$html("span", { class: "opacity-50" }, "📄"), + sigpro.$html("span", { class: "truncate font-medium max-w-[200px]" }, file.name), + sigpro.$html("span", { class: "text-[9px] opacity-40" }, `(${(file.size / 1024).toFixed(0)} KB)`), + ]), + sigpro.$html( + "button", + { + type: "button", + class: "btn btn-ghost btn-xs btn-circle", + onclick: (e) => { + e.preventDefault(); + e.stopPropagation(); + removeFile(index); + }, + }, + [sigpro.$html("img", { src: iconClose, class: "w-3 h-3 opacity-70" })], + ), + ]), + (file) => file.name + file.lastModified, + ), + ]), + ), + ]); + }; + + var FileinputModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Fileinput: Fileinput + }); + + /** INDICATOR */ + const Indicator = (props, children) => + sigpro.$html("div", { class: joinClass("indicator", props.class) }, [ + children, + sigpro.$html("span", { class: joinClass("indicator-item badge", props.badgeClass) }, props.badge), + ]); + + var IndicatorModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Indicator: Indicator + }); + + /** LIST */ + const List = (props) => { + const { items, header, render, keyFn, class: className } = props; + + return sigpro.$html( + "ul", + { + class: joinClass("list bg-base-100 rounded-box shadow-md", className), + }, + [ + sigpro.$if(header, () => sigpro.$html("li", { class: "p-4 pb-2 text-xs opacity-60 tracking-wide" }, [val(header)])), + sigpro.$for(items, (item, index) => sigpro.$html("li", { class: "list-row" }, [render(item, index)]), keyFn), + ], + ); + }; + + var ListModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + List: List + }); + + /** LOADING (Overlay Component) */ + const Loading = (props) => { + // Se espera un signal props.$show para controlar la visibilidad + return sigpro.$if(props.$show, () => + sigpro.$html("div", { + class: "fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30" + }, [ + sigpro.$html("span", { class: "loading loading-spinner loading-lg text-primary" }), + ]), + ); + }; + + var LoadingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Loading: Loading + }); + + /** MENU */ + const Menu = (props) => { + const renderItems = (items) => + sigpro.$for( + () => items || [], + (it) => + sigpro.$html("li", {}, [ + it.children + ? sigpro.$html("details", { open: it.open }, [ + sigpro.$html("summary", {}, [it.icon && sigpro.$html("span", { class: "mr-2" }, it.icon), it.label]), + sigpro.$html("ul", {}, renderItems(it.children)), + ]) + : sigpro.$html("a", { class: () => (val(it.active) ? "active" : ""), onclick: it.onclick }, [ + it.icon && sigpro.$html("span", { class: "mr-2" }, it.icon), + it.label, + ]), + ]), + (it, i) => it.label || i, + ); + + return sigpro.$html("ul", { ...props, class: joinClass("menu bg-base-200 rounded-box", props.class) }, renderItems(props.items)); + }; + + var MenuModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Menu: Menu + }); + + /** MODAL */ + const Modal = (props, children) => { + const { title, buttons, open, ...rest } = props; + const close = () => open(false); + + return sigpro.$if(open, () => + sigpro.$html("dialog", { ...rest, class: "modal modal-open" }, [ + sigpro.$html("div", { class: "modal-box" }, [ + title ? sigpro.$html("h3", { class: "text-lg font-bold mb-4" }, title) : null, + typeof children === "function" ? children() : children, + sigpro.$html("div", { class: "modal-action flex gap-2" }, [ + ...(Array.isArray(buttons) ? buttons : [buttons]).filter(Boolean), + Button({ onclick: close }, tt("close")()), + ]), + ]), + sigpro.$html( + "form", + { + method: "dialog", + class: "modal-backdrop", + onclick: (e) => (e.preventDefault(), close()), + }, + [sigpro.$html("button", {}, "close")], + ), + ]), + ); + }; + + var ModalModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Modal: Modal + }); + + /** NAVBAR */ + const Navbar = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("navbar bg-base-100 shadow-sm px-4", props.class) }, children); + + var NavbarModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Navbar: Navbar + }); + + /** RADIO */ + const Radio = (props) => { + const { label, tooltip, value, ...rest } = props; + + const radioEl = sigpro.$html("input", { + ...rest, + type: "radio", + class: joinClass("radio", props.class), + checked: () => val(value) === props.value, + disabled: () => val(props.disabled), + onclick: () => typeof value === "function" && value(props.value), + }); + + if (!label && !tooltip) return radioEl; + + const layout = sigpro.$html("label", { class: "label cursor-pointer justify-start gap-3" }, [ + radioEl, + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; + }; + + var RadioModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Radio: Radio + }); + + /** RANGE */ + const Range = (props) => { + const { label, tooltip, value, ...rest } = props; + + const rangeEl = sigpro.$html("input", { + ...rest, + type: "range", + class: joinClass("range", props.class), + value: value, + disabled: () => val(props.disabled) + }); + + if (!label && !tooltip) return rangeEl; + + const layout = sigpro.$html("div", { class: "flex flex-col gap-2" }, [ + label ? sigpro.$html("span", { class: "label-text" }, label) : null, + rangeEl + ]); + + return tooltip ? sigpro.$html("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout; + }; + + var RangeModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Range: Range + }); + + /** RATING */ + const Rating = (props) => { + const { value, count = 5, mask = "mask-star", readonly = false, ...rest } = props; + + // Generamos un ID único para el grupo de radio buttons + const ratingGroup = `rating-${Math.random().toString(36).slice(2, 7)}`; + + return sigpro.$html( + "div", + { + ...rest, + class: () => `rating ${val(readonly) ? "pointer-events-none" : ""} ${props.class || ""}`, + }, + Array.from({ length: val(count) }, (_, i) => { + const starValue = i + 1; + + return sigpro.$html("input", { + type: "radio", + name: ratingGroup, + class: `mask ${mask}`, + "aria-label": `${starValue} star`, + checked: () => Math.round(val(value)) === starValue, + onchange: () => { + if (!val(readonly) && typeof value === "function") { + value(starValue); + } + }, + }); + }) + ); + }; + + var RatingModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Rating: Rating + }); + + /** SELECT */ + const Select = (props) => { + const { label, options, value, ...rest } = props; + + const selectEl = sigpro.$html( + "select", + { + ...rest, + class: joinClass("select select-bordered w-full", props.class), + value: value + }, + sigpro.$for( + () => val(options) || [], + (opt) => + sigpro.$html( + "option", + { + value: opt.value, + $selected: () => String(val(value)) === String(opt.value), + }, + opt.label, + ), + (opt) => opt.value, + ), + ); + + if (!label) return selectEl; + + return sigpro.$html("label", { class: "fieldset-label flex flex-col gap-1" }, [ + sigpro.$html("span", {}, label), + selectEl + ]); + }; + + var SelectModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Select: Select + }); + + /** STACK */ + const Stack = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("stack", props.class) }, children); + + var StackModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stack: Stack + }); + + /** STAT */ + const Stat = (props) => + sigpro.$html("div", { ...props, class: joinClass("stat", props.class) }, [ + props.icon && sigpro.$html("div", { class: "stat-figure text-secondary" }, props.icon), + props.label && sigpro.$html("div", { class: "stat-title" }, props.label), + sigpro.$html("div", { class: "stat-value" }, () => val(props.value) ?? props.value), + props.desc && sigpro.$html("div", { class: "stat-desc" }, props.desc), + ]); + + var StatModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Stat: Stat + }); + + /** SWAP */ + const Swap = (props) => + sigpro.$html("label", { class: joinClass("swap", props.class) }, [ + sigpro.$html("input", { + type: "checkbox", + checked: props.value + }), + sigpro.$html("div", { class: "swap-on" }, props.on), + sigpro.$html("div", { class: "swap-off" }, props.off), + ]); + + var SwapModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Swap: Swap + }); + + /** TABLE */ + const Table = (props) => { + const { + items = [], + columns = [], + keyFn, + zebra = false, + pinRows = false, + empty = tt("nodata")(), + ...rest + } = props; + + const tableClass = () => joinClass( + "table", + `${val(zebra) ? "table-zebra" : ""} ${val(pinRows) ? "table-pin-rows" : ""} ${props.class || ""}` + ); + + return sigpro.$html("div", { class: "overflow-x-auto w-full bg-base-100 rounded-box border border-base-300" }, [ + sigpro.$html("table", { ...rest, class: tableClass }, [ + sigpro.$html("thead", {}, [ + sigpro.$html("tr", {}, + columns.map(col => sigpro.$html("th", { class: col.class || "" }, col.label)) + ) + ]), + sigpro.$html("tbody", {}, [ + sigpro.$for(items, (item, index) => { + return sigpro.$html("tr", { class: "hover" }, + columns.map(col => { + const cellContent = () => { + if (col.render) return col.render(item, index); + const value = item[col.key]; + return val(value); + }; + return sigpro.$html("td", { class: col.class || "" }, [cellContent]); + }) + ); + }, keyFn || ((item, idx) => item.id || idx)), + + sigpro.$if(() => val(items).length === 0, () => + sigpro.$html("tr", {}, [ + sigpro.$html("td", { colspan: columns.length, class: "text-center p-10 opacity-50" }, [ + val(empty) + ]) + ]) + ) + ]), + sigpro.$if(() => columns.some(c => c.footer), () => + sigpro.$html("tfoot", {}, [ + sigpro.$html("tr", {}, + columns.map(col => sigpro.$html("th", {}, col.footer || "")) + ) + ]) + ) + ]) + ]); + }; + + var TableModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Table: Table + }); + + /** TABS */ + const Tabs = (props) => { + const { items, ...rest } = props; + const itemsSignal = typeof items === "function" ? items : () => items || []; + + return sigpro.$html("div", { ...rest, class: "flex flex-col gap-4 w-full" }, [ + sigpro.$html( + "div", + { + role: "tablist", + class: joinClass("tabs tabs-box", props.class), + }, + sigpro.$for( + itemsSignal, + (it) => + sigpro.$html( + "a", + { + role: "tab", + class: () => joinClass( + "tab", + val(it.active) && "tab-active", + val(it.disabled) && "tab-disabled", + it.tip && "tooltip" + ), + "data-tip": it.tip, + onclick: (e) => !val(it.disabled) && it.onclick?.(e), + }, + it.label, + ), + (t) => t.label, + ), + ), + () => { + const active = itemsSignal().find((it) => val(it.active)); + if (!active) return null; + const content = val(active.content); + return sigpro.$html("div", { class: "p-4" }, [ + typeof content === "function" ? content() : content + ]); + }, + ]); + }; + + var TabsModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tabs: Tabs + }); + + /** TIMELINE */ + const Timeline = (props) => { + const { items = [], vertical = true, compact = false, ...rest } = props; + + const icons = { + info: iconInfo, + success: iconSuccess, + warning: iconWarning, + error: iconError, + }; + + return sigpro.$html( + "ul", + { + ...rest, + class: () => + `timeline ${val(vertical) ? "timeline-vertical" : "timeline-horizontal"} ${ + val(compact) ? "timeline-compact" : "" + } ${props.class || ""}`, + }, + [ + sigpro.$for( + items, + (item, i) => { + const isFirst = i === 0; + const isLast = i === val(items).length - 1; + const itemType = item.type || "success"; + const renderSlot = (content) => (typeof content === "function" ? content() : content); + + return sigpro.$html("li", { class: "flex-1" }, [ + !isFirst ? sigpro.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + sigpro.$html("div", { class: "timeline-start" }, [renderSlot(item.title)]), + sigpro.$html("div", { class: "timeline-middle" }, [ + sigpro.$html("img", { + src: icons[itemType] || item.icon || icons.success, + class: "w-4 h-4 object-contain mx-1", + alt: itemType, + }), + ]), + sigpro.$html("div", { class: "timeline-end timeline-box shadow-sm" }, [renderSlot(item.detail)]), + !isLast ? sigpro.$html("hr", { class: item.completed ? "bg-primary" : "" }) : null, + ]); + }, + (item, i) => item.id || i, + ), + ], + ); + }; + + var TimelineModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Timeline: Timeline + }); + + /** TOAST (Imperative Function) */ + const Toast = (message, type = "alert-success", duration = 3500) => { + let container = document.getElementById("sigpro-toast-container"); + + // Crear el contenedor global si no existe + if (!container) { + container = sigpro.$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(container); + } + + const toastHost = sigpro.$html("div", { style: "display: contents" }); + container.appendChild(toastHost); + + let timeoutId; + + const close = () => { + clearTimeout(timeoutId); + const el = toastHost.firstElementChild; + if (el && !el.classList.contains("opacity-0")) { + el.classList.add("translate-x-full", "opacity-0"); + setTimeout(() => { + instance.destroy(); + toastHost.remove(); + // Limpiar el contenedor si ya no hay más toasts + if (!container.hasChildNodes()) container.remove(); + }, 300); + } else { + instance.destroy(); + toastHost.remove(); + } + }; + + const ToastComponent = () => { + const el = sigpro.$html( + "div", + { + class: `alert alert-soft ${type} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`, + }, + [ + sigpro.$html("span", {}, [typeof message === "function" ? message() : message]), + Button({ class: "btn-xs btn-circle btn-ghost", onclick: close }, "✕") + ], + ); + + // Animación de entrada + requestAnimationFrame(() => el.classList.remove("translate-x-10", "opacity-0")); + return el; + }; + + const instance = sigpro.$mount(ToastComponent, toastHost); + + if (duration > 0) { + timeoutId = setTimeout(close, duration); + } + + return close; + }; + + var ToastModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Toast: Toast + }); + + /** TOOLTIP */ + const Tooltip = (props, children) => + sigpro.$html("div", { ...props, class: joinClass("tooltip", props.class), "data-tip": props.tip }, children); + + var TooltipModule = /*#__PURE__*/Object.freeze({ + __proto__: null, + Tooltip: Tooltip + }); + + const Components = { + ...AccordionModule, + ...AlertModule, + ...AutocompleteModule, + ...BadgeModule, + ...ButtonModule, + ...CheckboxModule, + ...ColorpickerModule, + ...DatepickerModule, + ...DrawerModule, + ...DropdownModule, + ...FabModule, + ...FieldsetModule, + ...FileinputModule, + ...IndicatorModule, + ...InputModule, + ...ListModule, + ...LoadingModule, + ...MenuModule, + ...ModalModule, + ...NavbarModule, + ...RadioModule, + ...RangeModule, + ...RatingModule, + ...SelectModule, + ...StackModule, + ...StatModule, + ...SwapModule, + ...TableModule, + ...TabsModule, + ...TimelineModule, + ...ToastModule, + ...TooltipModule + }; + + var index = { + ...Components, + install: (target = window) => { + Object.entries(Components).forEach(([name, component]) => { + target[name] = component; + }); + console.log("🚀 SigproUI"); + } + }; + + var Components$1 = /*#__PURE__*/Object.freeze({ + __proto__: null, + Accordion: Accordion, + Alert: Alert, + Autocomplete: Autocomplete, + Badge: Badge, + Button: Button, + Checkbox: Checkbox, + Colorpicker: Colorpicker, + Datepicker: Datepicker, + Drawer: Drawer, + Dropdown: Dropdown, + Fab: Fab, + Fieldset: Fieldset, + Fileinput: Fileinput, + Indicator: Indicator, + Input: Input, + List: List, + Loading: Loading, + Menu: Menu, + Modal: Modal, + Navbar: Navbar, + Radio: Radio, + Range: Range, + Rating: Rating, + Select: Select, + Stack: Stack, + Stat: Stat, + Swap: Swap, + Table: Table, + Tabs: Tabs, + Timeline: Timeline, + Toast: Toast, + Tooltip: Tooltip, + default: index + }); + + /** + * SigproUI - Entry Point + */ + + + const SigproUI = { + ...Components$1, + Icons, + Utils, + tt, + + install: (target = (typeof window !== 'undefined' ? window : {})) => { + Object.entries(Components$1).forEach(([name, component]) => { + target[name] = component; + }); + + target.Icons = Icons; + target.Utils = Utils; + target.tt = tt; + + console.log("🌟 SigproUI"); + } + }; + + exports.Accordion = Accordion; + exports.Alert = Alert; + exports.Autocomplete = Autocomplete; + exports.Badge = Badge; + exports.Button = Button; + exports.Checkbox = Checkbox; + exports.Colorpicker = Colorpicker; + exports.Datepicker = Datepicker; + exports.Drawer = Drawer; + exports.Dropdown = Dropdown; + exports.Fab = Fab; + exports.Fieldset = Fieldset; + exports.Fileinput = Fileinput; + exports.Indicator = Indicator; + exports.Input = Input; + exports.List = List; + exports.Loading = Loading; + exports.Menu = Menu; + exports.Modal = Modal; + exports.Navbar = Navbar; + exports.Radio = Radio; + exports.Range = Range; + exports.Rating = Rating; + exports.Select = Select; + exports.Stack = Stack; + exports.Stat = Stat; + exports.Swap = Swap; + exports.Table = Table; + exports.Tabs = Tabs; + exports.Timeline = Timeline; + exports.Toast = Toast; + exports.Tooltip = Tooltip; + exports.default = SigproUI; + exports.icon123 = icon123; + exports.iconAbc = iconAbc; + exports.iconCalendar = iconCalendar; + exports.iconClose = iconClose; + exports.iconError = iconError; + exports.iconHide = iconHide; + exports.iconInfo = iconInfo; + exports.iconLLeft = iconLLeft; + exports.iconLeft = iconLeft; + exports.iconLock = iconLock; + exports.iconMail = iconMail; + exports.iconRRight = iconRRight; + exports.iconRight = iconRight; + exports.iconShow = iconShow; + exports.iconSuccess = iconSuccess; + exports.iconUpload = iconUpload; + exports.iconWarning = iconWarning; + exports.joinClass = joinClass; + exports.tt = tt; + exports.val = val; + + Object.defineProperty(exports, '__esModule', { value: true }); + + return exports; + +})({}, SigProCore); diff --git a/dist/sigpro-ui.umd.min.js b/dist/sigpro-ui.umd.min.js new file mode 100644 index 0000000..c0d7b3c --- /dev/null +++ b/dist/sigpro-ui.umd.min.js @@ -0,0 +1 @@ +var SigProUI=function(t,e){"use strict";const l=t=>"function"==typeof t?t():t,a=(t,e)=>"function"==typeof e?()=>`${t} ${e()||""}`.trim():`${t} ${e||""}`.trim();var o=Object.freeze({__proto__:null,joinClass:a,val:l});const n=(t,l)=>{const{title:o,name:n,open:s,...A}=t;return e.$html("div",{...A,class:a("collapse collapse-arrow bg-base-200 mb-2",t.class)},[e.$html("input",{type:n?"radio":"checkbox",name:n,checked:s}),e.$html("div",{class:"collapse-title text-xl font-medium"},o),e.$html("div",{class:"collapse-content"},l)])};var s=Object.freeze({__proto__:null,Accordion:n});const A="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADjSURBVDiN3dJNSgNBEAXgz4DZeAAVJ9tko2St3kaIFxAVt4KZeAD1GKKi7vQSydI/yHgALxAXU02GxniAFBR0v1ev+3V1sZSxjxtM8BM5wTX2/hNu4gFvOMI21iJ3cIwP3GMjF/dQ4RyraOMS34GPAmvjIrBeEnfwjoPGgSM8ooh8QtngB6Ep4BWnmaMqkY1LqqzmDC8tzNDK3/RHzLL9SloUYWfQIMuw3Yl8xrDBH6qbvZWALqbqBqVmlWF7GuKEDwPr5hbXcYdPnKBv/o39wL5wG7ULY1c9NGPzQRrjKrhli1/02zEjWyWMBwAAAABJRU5ErkJggg==",c="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEDSURBVDiN1dK/K8VhFAbwD+VLGSxKcu9guSQ/Zils/gNkuaX4BxRZDTdklYU/QAaDlEVGGwu2Kz/uVbKJzWDwfuv1+jHz1Km3c85znuf0Hv4jxnD2W8MItnCJ5xAX2MQcHsOQL+jEAapYQD9aQwxiDy+B3JKSe1DHCpqQYQ0PeMJOpDyAmyAAirjGbDRwFYcoYCZSzjGP+8B1gqXEUT2QxyPlqaRnGceNeENzUswwil1MBocbSU9DCAXUUI6K25HtIo5QSVaooitP9OEO65iIbE+HXSvBVRbeNZQSR9pxGil3o83HNw5hEbfYR0dKFki5ci+u8OrzIQ1/R8xx7ocL+9t4B0HPOVXjoptxAAAAAElFTkSuQmCC",r="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABcSURBVDiN3dIxDoAwCIXhL563g3bSm+hlq4O6GFNbO+k/EV54QIDfsSBk9IA5ZxCQEG+0eGi5BqDHivEhV2xSXXwy2EdOR3xLV+ta0/26wvSm+KTYpPmMzY/0QTZeZR2f+FxhRQAAAABJRU5ErkJggg==",i="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACLSURBVDiN7dO9CQJBFEXhb38K0FwQrMNEVpuwB0NjrcYabECsQk0sQ1mTF4zIjrgmBh54MMx998AEwzOrmC5e8gJjbDHCJO7PHYI0v2JT4Ig9DljGwq5DkOZTLOCOMoIhBpknpHmFWx3ldaaUo6oTc2/ab7rl+508f8GvCC5oenTn4tM1cWg/nBNmD4fBH/Kfvt2TAAAAAElFTkSuQmCC",d="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAWQAAAFkBqp2phgAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAACQSURBVDiN7dKxDcJQDATQJ0YgXQQ1bAgDEIZBETPQwjakIjRQ8CMSyR8SiZKTrvHZd/r+JsYSNZrEI1ZR4ywzfElcJ55xwiITOECNTVDf4jDGoEEZ1Etcxxg8pmjRDiahb7BH20uKKPVUkVmL+YjQArdI+PT2bO9Pd/A34O71Rd9QeN/LAFUSckfUscWuG3oCgP8nrDH6T5AAAAAASUVORK5CYII=",m="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADFSURBVDiN7dCxSoIBFAXgr1BbgmgSB5ubxKAHaAkcgnBpySVaDET3WhzcpQfoHZojawgX0ZZcfAWDSDdBoeUKP/8ojZ7tnnPv4dzDFv+KZzwl5jf84B354C4wwjdeUV4vl7DCEsXgxmhigDpOMcMVjoKr7cTyI/ZxiE90wmCB4zi+RRatZOxd7OEavxHtBmvjIV5wH2a59N8ZXIZQisMCzkL/wgGq6EYffXzgHHNo4y5h+oBGlLjEBJVUiVP0cJJOtMUG+APtfyYzbH7eVgAAAABJRU5ErkJggg==",u="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAB2AAAAdgFOeyYIAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAMxJREFUOI3t0bFKwlEUBvBfmmBEr1APIDZJ9AJJQyAIvkGP0C4uQruza+DUmuIc9AC9gBG4Nmpkw/8IB3Vw1w8u95zvnvPde77LEeUUV9HAF67QRA2nmMf5A+o4x3cWOsMYy8j7WMX6jaYbLBL/mAWe8RcHm1ihs8G94gVKQQzwlAouMcQo8p/Y28HdYpYFZmsi0MVdxD1MdrxsC500wijdvgtbI1AYtDbxMwkuFAZmE1uYwkkSqOIaHyHcxEU0vUXNPSqKr37fZ6xDwD9DPS0OyHjQHQAAAABJRU5ErkJggg==",h="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC4SURBVDiNxdIxagJRFIXhLzLFBNJYaJslSEylWOhq3IorMGQ16SyjYCFiZWU5pTaDFvOUyTAZ8RHID69555577oXLf/OEGaY4R3g/4IhORHg3eOXYYvSAeRQ8OWQYYoNPvDQYnxUr7zBB1grCAv3QbIlxjXmAb7Txhq+rkFUKq9NUU8vcJiizwDtOWGEdmvTKqT+61H0GXsP7jSxpEGF/R1e3wkO0FBeVRnhTSBTneBB3yvOI4D/mAnvrIwKM5s4AAAAAAElFTkSuQmCC",p="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAASVJREFUOI190r0uhFEQBuBnVxaF2PUTCkFchV0SV6BQi0rEbShFlCqNktJP0Iqf3i3YVSlXVEQozojP8e2+ySSTed+ZMzNnKnpjCFPhv+C9j/YPlnCBV3TCujhHq19iFftoYxOjBa4esTb2QvsP+7jFWJ9HxnEXRf5gGU9Z8gKucBl+sUgHTahE8AJnOCoIT/AcmhmsF7gtrGINBqWFFWcmLXMUhzjIuEbk1GA+2i/DNh4wUsK1MVfFV2GUHJO4xlsPHr8j1Eu44bAcDek2agP4lDZaxWMm3MEKbrL4hjT/8U+gJc00nglnw4qYkL5xMW9rTzqSvEiefI/dMrIaRTrSPzcKXCNinUguPeUfNKWj6kqH9Bz+aVnbvb6PtKTp8F/wUSb6Bu5YN5n7ff0kAAAAAElFTkSuQmCC",g="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAQtJREFUOI2F0jFOAlEQBuAPImoFqyTa6TEEbfUihruYDYfwCAg3UDsTY20na0VjgqUWWuxgHsuy/skk82bmn/fPm9eyHXs4Cn+Br4baNZxjhk8UYUtMMWwitjHGHNfoJrlexObIo3YDY9zjoOGSQzxEkzVc4O0fctqkwCANzkJiE9LmI9ytDrvKB+tWGQnylIAsOB04VcrfdluO55CeYo6THfygVUne4jX8S1zho1LTDu7fCL2KxCe8oF8zUqb8G51VYGrzEffD6jDCJA0MY6bqnHXoK9d4Vk3kyk/S1KSPR9zUJdvRpAiJWZLLIlYEufYrrzBQ7nyJ97ClcuYN2dX1pejgOPwFvuuKfgHXiDR+HL1j1AAAAABJRU5ErkJggg==",b="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARZJREFUOI2V0j1KQ1EQBeDPp4lWRiMoKVyAK9AoiLgJGytxD9oJNhKyDyvBnw2IugC3YGKVRk1KRbR48yC5vjzwwIHL3DPnzp2ZGdMxj9U4D/BZoZ3ANu4wQj84xC3aVYkZuujhCItjd42I9dAJ7R908YDlikeaeAyTCezgpST5IJia9LFVlA0nOMd7It4IjuMttKeFQR17uKooPcUV9lHL0ArX0T8MPqLa1hx+MDNFWDX7LHLV4/VGiWghmGJJvhu1WXzLO5rhORGeYRf3SfwQNVwWgbZ8SZqJcD04jhX5GDfTsjryJUlN0uQnXJRdZmHSx7H8nwWWItaP5NJVLrCFG3mTXoNDXJeVPW185E1ai/MAX2WiX9S3NSPYbj+uAAAAAElFTkSuQmCC",f="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAnXAAAJ1wGxbhe3AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAARJJREFUOI2l0r8uRFEQBvAfu9glwUYiUaxHUEl0VDpKeq+wpZBINAqFRHgTKg0tCSqVhmKDEM1u/Esodm725rq7iC+ZzMnM982ZmXP4JwpdchWsYBrXeMkj9XQQV3GEi+BMYR63v+mqiDPUUrEaTiP3I1ZxEOcySnE+jFxXVPEQPimWiCYzOdCbKbCFPe1Z+8PgBvvBycVMCIdSsY2wBEPBmcnrYBtraKRib2EJGljHjswLLuI8Z6SS9hLTl15iIR08wZLv2AzLYjk0YATP8n9lVWbrgUJohosYxCdG8Zghdvp5ldCUi6hrPd0VjvGEVzTxEYLkogGMYQ67uEtvcgKzGA8y9IV/D9/Evdb89Q7d/Q1fB8U0mpUmzV0AAAAASUVORK5CYII=",$="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABfSURBVDiNY2AY8oCZSHWxDAwMEgwMDHfJsaSAgYHhH9QQsjT/Z2BgKKe75gQGiLMLCSlkwiHOSI6t6ADmhYoBN6SIARIeidgkiUlIxxkYGB4xMDB8YmBguE6JSwYpAACvLRHTKwPjZgAAAABJRU5ErkJggg==",v="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABNSURBVDiN3dAxCoAwFATRh3fU2oAHiDbi5Y1F2jT+gKLbzyy7/DYjUo8g4cTWI8koOF6XrOqc5ifDDVGJthfsj8OLujtHYJgwR+GP5QKMxA9/SolDQgAAAABJRU5ErkJggg==",B="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABlSURBVDiN3ZLBDUBAEEUfmtCchA5woUMlOO1FCQrAwbqwf8eFhHd7mfzJn2Tg82TGvABywAmPUgOLD4XcDK9AJ/y5cOlrNsIvpCdPDL/FUbkX/t6Slv3+SjgQf6QBmIAZGAP+FzZJViOd89x8pAAAAABJRU5ErkJggg==",x="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABmSURBVDiN3dGxCoAgEMbxfz1dL1BTREJzmUv08trgDYcg6VCD3/YD7zvkoLmMgFEegLmmwAAecOJVvNeUWCAAt7IHjt9LThkyiRf9qC8oCom70u0BuDL+bngj/tNm/JqJePucW8wDvGYdzT0nMUkAAAAASUVORK5CYII=",w="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAdgAAAHYBTnsmCAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAADNSURBVDiNndOxTgJRFIThz41ZDMFKqH0DLSRSq4lQ0RifUcMzUJlYQKjtLcHVSimBggPRNSzs/sk0kzPnTHEvxZyHKnGJD3yhXSWcYRnKwvvH0Y7wEG/4wQI1XOEek6LLF3FtiDoGoXp4WcxsSXILHjFCH/Nf/jy8ER6KGuTZNNhJvkFpEpygUyHbRi1BFy8VFryilyANlSVFerxn6N36IRVyG0PNEtdbkbmBU8zwdOCSJp4xRWNj3sWS5YGaRvM/f6GBa5ztafCJMb5hBQQ/MMwXLnnZAAAAAElFTkSuQmCC";var y=Object.freeze({__proto__:null,icon123:u,iconAbc:m,iconCalendar:i,iconClose:r,iconError:b,iconHide:c,iconInfo:p,iconLLeft:B,iconLeft:$,iconLock:d,iconMail:h,iconRRight:x,iconRight:v,iconShow:A,iconSuccess:g,iconUpload:w,iconWarning:f});const S=(t,a)=>{const{type:o="info",soft:n=!0,...s}=t,A={info:p,success:g,warning:f,error:b},c=a||t.message;return e.$html("div",{...s,role:"alert",class:()=>`alert ${(()=>{const t=l(o);return{info:"alert-info",success:"alert-success",warning:"alert-warning",error:"alert-error"}[t]||t})()} ${l(n)?"alert-soft":""} ${t.class||""}`},[e.$html("img",{src:A[l(o)]||A.info,class:"w-4 h-4 object-contain",alt:l(o)}),e.$html("div",{class:"flex-1"},[e.$html("span",{},["function"==typeof c?c():c])]),t.actions?e.$html("div",{class:"flex-none"},["function"==typeof t.actions?t.actions():t.actions]):null])};var C=Object.freeze({__proto__:null,Alert:S});const U={es:{close:"Cerrar",confirm:"Confirmar",cancel:"Cancelar",search:"Buscar...",loading:"Cargando...",nodata:"Sin datos"},en:{close:"Close",confirm:"Confirm",cancel:"Cancel",search:"Search...",loading:"Loading...",nodata:"No data"}},k=e.$("es"),R=t=>()=>U[k()][t]||t,D=t=>{const{label:o,tip:n,value:s,error:r,isSearch:p,icon:g,type:b="text",...f}=t,$="password"===b,v=e.$(!1),B={text:m,password:d,date:i,number:u,email:h},x=e.$html("input",{...f,type:()=>$?v()?"text":"password":b,placeholder:t.placeholder||o||(p?R("search")():" "),class:a("grow order-2 focus:outline-none",t.class),value:s,oninput:e=>t.oninput?.(e),disabled:()=>l(t.disabled)}),w=g||(B[b]?e.$html("img",{src:B[b],class:"opacity-50",alt:b}):null);return e.$html("label",{class:()=>a("input input-bordered floating-label flex items-center gap-2 w-full relative",l(r)?"input-error":"")},[w?e.$html("div",{class:"order-1 shrink-0"},w):null,o?e.$html("span",{class:"text-base-content/60 order-0"},o):null,x,$?e.$html("button",{type:"button",class:"order-3 btn btn-ghost btn-xs btn-circle opacity-50 hover:opacity-100",onclick:t=>{t.preventDefault(),v(!v())}},()=>e.$html("img",{class:"w-5 h-5",src:v()?A:c})):null,n?e.$html("div",{class:"tooltip tooltip-left order-4","data-tip":n},e.$html("span",{class:"badge badge-ghost badge-xs cursor-help"},"?")):null,()=>l(r)?e.$html("span",{class:"text-error text-[10px] absolute -bottom-5 left-2"},l(r)):null])};var j=Object.freeze({__proto__:null,Input:D});const _=t=>{const{options:a=[],value:o,onSelect:n,label:s,placeholder:A,...c}=t,r=e.$(l(o)||""),i=e.$(!1),d=e.$(-1),m=e.$(()=>{const t=r().toLowerCase(),e=l(a)||[];return t?e.filter(e=>("string"==typeof e?e:e.label).toLowerCase().includes(t)):e}),u=t=>{const e="string"==typeof t?t:t.value,l="string"==typeof t?t:t.label;r(l),"function"==typeof o&&o(e),n?.(t),i(!1),d(-1)};return e.$html("div",{class:"relative w-full"},[D({label:s,placeholder:A||R("search")(),value:r,onfocus:()=>i(!0),onblur:()=>setTimeout(()=>i(!1),150),onkeydown:t=>{const e=m();"ArrowDown"===t.key?(t.preventDefault(),i(!0),d(Math.min(d()+1,e.length-1))):"ArrowUp"===t.key?(t.preventDefault(),d(Math.max(d()-1,0))):"Enter"===t.key&&d()>=0?(t.preventDefault(),u(e[d()])):"Escape"===t.key&&i(!1)},oninput:t=>{const e=t.target.value;r(e),"function"==typeof o&&o(e),i(!0),d(-1)},...c}),e.$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:()=>i()&&m().length?"display:block":"display:none"},[e.$for(m,(t,l)=>e.$html("li",{},[e.$html("a",{class:()=>"block w-full "+(d()===l?"active bg-primary text-primary-content":""),onclick:()=>u(t),onmouseenter:()=>d(l)},"string"==typeof t?t:t.label)]),(t,e)=>("string"==typeof t?t:t.value)+e),()=>m().length?null:e.$html("li",{class:"p-2 text-center opacity-50"},"No results")])])};const z=(t,l)=>e.$html("span",{...t,class:a("badge",t.class)},l);const E=(t,o)=>{const{badge:n,badgeClass:s,tooltip:A,icon:c,loading:r,...i}=t;let d=e.$html("button",{...i,class:a("btn",t.class),disabled:()=>l(r)||l(t.disabled)},[()=>l(r)?e.$html("span",{class:"loading loading-spinner"}):null,c?e.$html("span",{class:"mr-1"},c):null,o]);return n&&(d=e.$html("div",{class:"indicator"},[e.$html("span",{class:a("indicator-item badge",s||"badge-secondary")},n),d])),A?e.$html("div",{class:"tooltip","data-tip":A},d):d};const I=t=>{const{value:a,tooltip:o,toggle:n,label:s,...A}=t,c=e.$html("input",{...A,type:"checkbox",class:()=>l(n)?"toggle":"checkbox",checked:a}),r=e.$html("label",{class:"label cursor-pointer justify-start gap-3"},[c,s?e.$html("span",{class:"label-text"},s):null]);return o?e.$html("div",{class:"tooltip","data-tip":o},r):r};const Y=t=>{const{value:a,label:o,...n}=t,s=e.$(!1),A=["#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=()=>l(a)||"#000000";return e.$html("div",{class:"relative w-fit"},[e.$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(),s(!s())},...n},[e.$html("div",{class:"size-5 rounded-sm shadow-inner border border-black/10 shrink-0",style:()=>`background-color: ${c()}`}),o?e.$html("span",{class:"opacity-80"},o):null]),e.$if(s,()=>e.$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()},[e.$html("div",{class:"grid grid-cols-8 gap-1"},A.map(t=>e.$html("button",{type:"button",style:`background-color: ${t}`,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()===t.toLowerCase()?"ring-2 ring-offset-1 ring-primary z-10 scale-110":""),onclick:()=>{"function"==typeof a&&a(t),s(!1)}})))])),e.$if(s,()=>e.$html("div",{class:"fixed inset-0 z-[100]",onclick:()=>s(!1)}))])};const V=t=>{const{value:a,range:o,label:n,placeholder:s,hour:A=!1,...c}=t,r=e.$(!1),d=e.$(new Date),m=e.$(null),u=e.$(0),h=e.$(0),p=()=>!0===l(o),g=new Date,b=`${g.getFullYear()}-${String(g.getMonth()+1).padStart(2,"0")}-${String(g.getDate()).padStart(2,"0")}`,f=t=>`${t.getFullYear()}-${String(t.getMonth()+1).padStart(2,"0")}-${String(t.getDate()).padStart(2,"0")}`,w=t=>{const e=f(t),o=l(a);if(p())if(!o?.start||o.start&&o.end)"function"==typeof a&&a({start:e,end:null,...A&&{startHour:u()}});else{const t=o.start;if("function"==typeof a){const l=e{const t=l(a);if(!t)return"";if("string"==typeof t)return A&&t.includes("T")?t.replace("T"," "):t;if(t.start&&t.end){return`${A&&t.startHour?`${t.start} ${String(t.startHour).padStart(2,"0")}:00`:t.start} - ${A&&t.endHour?`${t.end} ${String(t.endHour).padStart(2,"0")}:00`:t.end}`}if(t.start){return`${A&&t.startHour?`${t.start} ${String(t.startHour).padStart(2,"0")}:00`:t.start}...`}return""}),S=t=>{const e=d();d(new Date(e.getFullYear(),e.getMonth()+t,1))},C=t=>{const e=d();d(new Date(e.getFullYear()+t,e.getMonth(),1))},U=({value:t,onChange:a})=>e.$html("div",{class:"flex-1"},[e.$html("div",{class:"flex gap-2 items-center"},[e.$html("input",{type:"range",min:0,max:23,value:t,class:"range range-xs flex-1",oninput:t=>{const e=parseInt(t.target.value);a(e)}}),e.$html("span",{class:"text-sm font-mono min-w-[48px] text-center"},()=>String(l(t)).padStart(2,"0")+":00")])]);return e.$html("div",{class:"relative w-full"},[D({label:n,placeholder:s||(p()?"Seleccionar rango...":"Seleccionar fecha..."),value:y,readonly:!0,icon:e.$html("img",{src:i,class:"opacity-40"}),onclick:t=>{t.stopPropagation(),r(!r())},...c}),e.$if(r,()=>e.$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()},[e.$html("div",{class:"flex justify-between items-center mb-4 gap-1"},[e.$html("div",{class:"flex gap-0.5"},[e.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>C(-1)},e.$html("img",{src:B,class:"opacity-40"})),e.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>S(-1)},e.$html("img",{src:$,class:"opacity-40"}))]),e.$html("span",{class:"font-bold uppercase flex-1 text-center"},[()=>d().toLocaleString("es-ES",{month:"short",year:"numeric"})]),e.$html("div",{class:"flex gap-0.5"},[e.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>S(1)},e.$html("img",{src:v,class:"opacity-40"})),e.$html("button",{type:"button",class:"btn btn-ghost btn-xs px-1",onclick:()=>C(1)},e.$html("img",{src:x,class:"opacity-40"}))])]),e.$html("div",{class:"grid grid-cols-7 gap-1",onmouseleave:()=>m(null)},[...["L","M","X","J","V","S","D"].map(t=>e.$html("div",{class:"text-[10px] opacity-40 font-bold text-center"},t)),()=>{const t=d(),o=t.getFullYear(),n=t.getMonth(),s=new Date(o,n,1).getDay(),A=0===s?6:s-1,c=new Date(o,n+1,0).getDate(),r=[];for(let t=0;t{const t=l(a),e=m(),o="string"==typeof t?t.split("T")[0]===A:t?.start===A,n=t?.end===A;let s=!1;if(p()&&t?.start){const l=t.start;!t.end&&e?s=A>l&&A<=e||A=e:t.end&&(s=A>l&&A{p()&&m(A)},onclick:()=>w(s)},[t.toString()]))}return r}]),A?e.$html("div",{class:"mt-3 pt-2 border-t border-base-300"},[p()?e.$html("div",{class:"flex gap-4"},[U({value:u,onChange:t=>{u(t);const e=l(a);e?.start&&a({...e,startHour:t})}}),U({value:h,onChange:t=>{h(t);const e=l(a);e?.end&&a({...e,endHour:t})}})]):U({value:u,onChange:t=>{u(t);const e=l(a);e&&"string"==typeof e&&e.includes("-")&&a(e.split("T")[0]+"T"+String(t).padStart(2,"0")+":00:00")}})]):null])),e.$if(r,()=>e.$html("div",{class:"fixed inset-0 z-[90]",onclick:()=>r(!1)}))])};const H=t=>e.$html("div",{class:a("drawer",t.class)},[e.$html("input",{id:t.id,type:"checkbox",class:"drawer-toggle",checked:t.open}),e.$html("div",{class:"drawer-content"},t.content),e.$html("div",{class:"drawer-side"},[e.$html("label",{for:t.id,class:"drawer-overlay",onclick:()=>t.open?.(!1)}),e.$html("div",{class:"min-h-full bg-base-200 w-80"},t.side)])]);const O=(t,a)=>{const{label:o,icon:n,...s}=t;return e.$html("div",{...s,class:()=>`dropdown ${l(t.class)||t.class||""}`},[e.$html("div",{tabindex:0,role:"button",class:"btn m-1 flex items-center gap-2"},[n?"function"==typeof n?n():n:null,o?"function"==typeof o?o():o:null]),e.$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 a?a():a])])};const F=t=>{const{icon:a,label:o,actions:n=[],position:s="bottom-6 right-6",...A}=t;return e.$html("div",{...A,class:()=>`fab fixed ${l(s)} flex flex-col-reverse items-end gap-3 z-[100] ${t.class||""}`},[e.$html("div",{tabindex:0,role:"button",class:"btn btn-lg btn-circle btn-primary shadow-2xl"},[a?"function"==typeof a?a():a:null,!a&&o?o:null]),...l(n).map(t=>e.$html("div",{class:"flex items-center gap-3 transition-all duration-300"},[t.label?e.$html("span",{class:"badge badge-ghost shadow-sm whitespace-nowrap"},t.label):null,e.$html("button",{type:"button",class:`btn btn-circle shadow-lg ${t.class||""}`,onclick:e=>{e.stopPropagation(),t.onclick?.(e)}},[t.icon?"function"==typeof t.icon?t.icon():t.icon:t.text||""])]))])};const Q=(t,o)=>e.$html("fieldset",{...t,class:a("fieldset bg-base-200 border border-base-300 p-4 rounded-lg",t.class)},[()=>{const a=l(t.legend);return a?e.$html("legend",{class:"fieldset-legend font-bold"},[a]):null},o]);const N=t=>{const{tooltip:l,max:a=2,accept:o="*",onSelect:n}=t,s=e.$([]),A=e.$(!1),c=e.$(null),i=1024*a*1024,d=t=>{const e=Array.from(t);c(null);e.find(t=>t.size>i)?c(`Máx ${a}MB`):(s([...s(),...e]),n?.(s()))};return e.$html("fieldset",{class:"fieldset w-full p-0"},[e.$html("div",{class:()=>"w-full "+(l?"tooltip tooltip-top before:z-50 after:z-50":""),"data-tip":l},[e.$html("label",{class:()=>`\n relative flex items-center justify-between w-full h-12 px-4\n border-2 border-dashed rounded-lg cursor-pointer\n transition-all duration-200\n ${A()?"border-primary bg-primary/10":"border-base-content/20 bg-base-100 hover:bg-base-200"}\n `,ondragover:t=>{t.preventDefault(),A(!0)},ondragleave:()=>A(!1),ondrop:t=>{t.preventDefault(),A(!1),d(t.dataTransfer.files)}},[e.$html("div",{class:"flex items-center gap-3 w-full"},[e.$html("img",{src:w,class:"w-5 h-5 opacity-50 shrink-0"}),e.$html("span",{class:"text-sm opacity-70 truncate grow text-left"},"Arrastra o selecciona archivos..."),e.$html("span",{class:"text-[10px] opacity-40 shrink-0"},`Máx ${a}MB`)]),e.$html("input",{type:"file",multiple:!0,accept:o,class:"hidden",onchange:t=>d(t.target.files)})])]),()=>c()?e.$html("span",{class:"text-[10px] text-error mt-1 px-1 font-medium"},c()):null,e.$if(()=>s().length>0,()=>e.$html("ul",{class:"mt-2 space-y-1"},[e.$for(s,(t,l)=>e.$html("li",{class:"flex items-center justify-between p-1.5 pl-3 text-xs bg-base-200/50 rounded-md border border-base-300"},[e.$html("div",{class:"flex items-center gap-2 truncate"},[e.$html("span",{class:"opacity-50"},"📄"),e.$html("span",{class:"truncate font-medium max-w-[200px]"},t.name),e.$html("span",{class:"text-[9px] opacity-40"},`(${(t.size/1024).toFixed(0)} KB)`)]),e.$html("button",{type:"button",class:"btn btn-ghost btn-xs btn-circle",onclick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{const e=s().filter((e,l)=>l!==t);s(e),n?.(e)})(l)}},[e.$html("img",{src:r,class:"w-3 h-3 opacity-70"})])]),t=>t.name+t.lastModified)]))])};const L=(t,l)=>e.$html("div",{class:a("indicator",t.class)},[l,e.$html("span",{class:a("indicator-item badge",t.badgeClass)},t.badge)]);const T=t=>{const{items:o,header:n,render:s,keyFn:A,class:c}=t;return e.$html("ul",{class:a("list bg-base-100 rounded-box shadow-md",c)},[e.$if(n,()=>e.$html("li",{class:"p-4 pb-2 text-xs opacity-60 tracking-wide"},[l(n)])),e.$for(o,(t,l)=>e.$html("li",{class:"list-row"},[s(t,l)]),A)])};const G=t=>e.$if(t.$show,()=>e.$html("div",{class:"fixed inset-0 z-[100] flex items-center justify-center backdrop-blur-sm bg-base-100/30"},[e.$html("span",{class:"loading loading-spinner loading-lg text-primary"})]));const M=t=>{const o=t=>e.$for(()=>t||[],t=>e.$html("li",{},[t.children?e.$html("details",{open:t.open},[e.$html("summary",{},[t.icon&&e.$html("span",{class:"mr-2"},t.icon),t.label]),e.$html("ul",{},o(t.children))]):e.$html("a",{class:()=>l(t.active)?"active":"",onclick:t.onclick},[t.icon&&e.$html("span",{class:"mr-2"},t.icon),t.label])]),(t,e)=>t.label||e);return e.$html("ul",{...t,class:a("menu bg-base-200 rounded-box",t.class)},o(t.items))};const J=(t,l)=>{const{title:a,buttons:o,open:n,...s}=t,A=()=>n(!1);return e.$if(n,()=>e.$html("dialog",{...s,class:"modal modal-open"},[e.$html("div",{class:"modal-box"},[a?e.$html("h3",{class:"text-lg font-bold mb-4"},a):null,"function"==typeof l?l():l,e.$html("div",{class:"modal-action flex gap-2"},[...(Array.isArray(o)?o:[o]).filter(Boolean),E({onclick:A},R("close")())])]),e.$html("form",{method:"dialog",class:"modal-backdrop",onclick:t=>(t.preventDefault(),A())},[e.$html("button",{},"close")])]))};const K=(t,l)=>e.$html("div",{...t,class:a("navbar bg-base-100 shadow-sm px-4",t.class)},l);const P=t=>{const{label:o,tooltip:n,value:s,...A}=t,c=e.$html("input",{...A,type:"radio",class:a("radio",t.class),checked:()=>l(s)===t.value,disabled:()=>l(t.disabled),onclick:()=>"function"==typeof s&&s(t.value)});if(!o&&!n)return c;const r=e.$html("label",{class:"label cursor-pointer justify-start gap-3"},[c,o?e.$html("span",{class:"label-text"},o):null]);return n?e.$html("div",{class:"tooltip","data-tip":n},r):r};const X=t=>{const{label:o,tooltip:n,value:s,...A}=t,c=e.$html("input",{...A,type:"range",class:a("range",t.class),value:s,disabled:()=>l(t.disabled)});if(!o&&!n)return c;const r=e.$html("div",{class:"flex flex-col gap-2"},[o?e.$html("span",{class:"label-text"},o):null,c]);return n?e.$html("div",{class:"tooltip","data-tip":n},r):r};const Z=t=>{const{value:a,count:o=5,mask:n="mask-star",readonly:s=!1,...A}=t,c=`rating-${Math.random().toString(36).slice(2,7)}`;return e.$html("div",{...A,class:()=>`rating ${l(s)?"pointer-events-none":""} ${t.class||""}`},Array.from({length:l(o)},(t,o)=>{const A=o+1;return e.$html("input",{type:"radio",name:c,class:`mask ${n}`,"aria-label":`${A} star`,checked:()=>Math.round(l(a))===A,onchange:()=>{l(s)||"function"!=typeof a||a(A)}})}))};const W=t=>{const{label:o,options:n,value:s,...A}=t,c=e.$html("select",{...A,class:a("select select-bordered w-full",t.class),value:s},e.$for(()=>l(n)||[],t=>e.$html("option",{value:t.value,$selected:()=>String(l(s))===String(t.value)},t.label),t=>t.value));return o?e.$html("label",{class:"fieldset-label flex flex-col gap-1"},[e.$html("span",{},o),c]):c};const q=(t,l)=>e.$html("div",{...t,class:a("stack",t.class)},l);const tt=t=>e.$html("div",{...t,class:a("stat",t.class)},[t.icon&&e.$html("div",{class:"stat-figure text-secondary"},t.icon),t.label&&e.$html("div",{class:"stat-title"},t.label),e.$html("div",{class:"stat-value"},()=>l(t.value)??t.value),t.desc&&e.$html("div",{class:"stat-desc"},t.desc)]);const et=t=>e.$html("label",{class:a("swap",t.class)},[e.$html("input",{type:"checkbox",checked:t.value}),e.$html("div",{class:"swap-on"},t.on),e.$html("div",{class:"swap-off"},t.off)]);const lt=t=>{const{items:o=[],columns:n=[],keyFn:s,zebra:A=!1,pinRows:c=!1,empty:r=R("nodata")(),...i}=t;return e.$html("div",{class:"overflow-x-auto w-full bg-base-100 rounded-box border border-base-300"},[e.$html("table",{...i,class:()=>a("table",`${l(A)?"table-zebra":""} ${l(c)?"table-pin-rows":""} ${t.class||""}`)},[e.$html("thead",{},[e.$html("tr",{},n.map(t=>e.$html("th",{class:t.class||""},t.label)))]),e.$html("tbody",{},[e.$for(o,(t,a)=>e.$html("tr",{class:"hover"},n.map(o=>e.$html("td",{class:o.class||""},[()=>{if(o.render)return o.render(t,a);const e=t[o.key];return l(e)}]))),s||((t,e)=>t.id||e)),e.$if(()=>0===l(o).length,()=>e.$html("tr",{},[e.$html("td",{colspan:n.length,class:"text-center p-10 opacity-50"},[l(r)])]))]),e.$if(()=>n.some(t=>t.footer),()=>e.$html("tfoot",{},[e.$html("tr",{},n.map(t=>e.$html("th",{},t.footer||"")))]))])])};const at=t=>{const{items:o,...n}=t,s="function"==typeof o?o:()=>o||[];return e.$html("div",{...n,class:"flex flex-col gap-4 w-full"},[e.$html("div",{role:"tablist",class:a("tabs tabs-box",t.class)},e.$for(s,t=>e.$html("a",{role:"tab",class:()=>a("tab",l(t.active)&&"tab-active",l(t.disabled),t.tip),"data-tip":t.tip,onclick:e=>!l(t.disabled)&&t.onclick?.(e)},t.label),t=>t.label)),()=>{const t=s().find(t=>l(t.active));if(!t)return null;const a=l(t.content);return e.$html("div",{class:"p-4"},["function"==typeof a?a():a])}])};const ot=t=>{const{items:a=[],vertical:o=!0,compact:n=!1,...s}=t,A={info:p,success:g,warning:f,error:b};return e.$html("ul",{...s,class:()=>`timeline ${l(o)?"timeline-vertical":"timeline-horizontal"} ${l(n)?"timeline-compact":""} ${t.class||""}`},[e.$for(a,(t,o)=>{const n=0===o,s=o===l(a).length-1,c=t.type||"success",r=t=>"function"==typeof t?t():t;return e.$html("li",{class:"flex-1"},[n?null:e.$html("hr",{class:t.completed?"bg-primary":""}),e.$html("div",{class:"timeline-start"},[r(t.title)]),e.$html("div",{class:"timeline-middle"},[e.$html("img",{src:A[c]||t.icon||A.success,class:"w-4 h-4 object-contain mx-1",alt:c})]),e.$html("div",{class:"timeline-end timeline-box shadow-sm"},[r(t.detail)]),s?null:e.$html("hr",{class:t.completed?"bg-primary":""})])},(t,e)=>t.id||e)])};const nt=(t,l="alert-success",a=3500)=>{let o=document.getElementById("sigpro-toast-container");o||(o=e.$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(o));const n=e.$html("div",{style:"display: contents"});let s;o.appendChild(n);const A=()=>{clearTimeout(s);const t=n.firstElementChild;t&&!t.classList.contains("opacity-0")?(t.classList.add("translate-x-full","opacity-0"),setTimeout(()=>{c.destroy(),n.remove(),o.hasChildNodes()||o.remove()},300)):(c.destroy(),n.remove())},c=e.$mount(()=>{const a=e.$html("div",{class:`alert alert-soft ${l} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`},[e.$html("span",{},["function"==typeof t?t():t]),E({class:"btn-xs btn-circle btn-ghost",onclick:A},"✕")]);return requestAnimationFrame(()=>a.classList.remove("translate-x-10","opacity-0")),a},n);return a>0&&(s=setTimeout(A,a)),A};const st=(t,l)=>e.$html("div",{...t,class:a("tooltip",t.class),"data-tip":t.tip},l);const At={...s,...C,...Object.freeze({__proto__:null,Autocomplete:_}),...Object.freeze({__proto__:null,Badge:z}),...Object.freeze({__proto__:null,Button:E}),...Object.freeze({__proto__:null,Checkbox:I}),...Object.freeze({__proto__:null,Colorpicker:Y}),...Object.freeze({__proto__:null,Datepicker:V}),...Object.freeze({__proto__:null,Drawer:H}),...Object.freeze({__proto__:null,Dropdown:O}),...Object.freeze({__proto__:null,Fab:F}),...Object.freeze({__proto__:null,Fieldset:Q}),...Object.freeze({__proto__:null,Fileinput:N}),...Object.freeze({__proto__:null,Indicator:L}),...j,...Object.freeze({__proto__:null,List:T}),...Object.freeze({__proto__:null,Loading:G}),...Object.freeze({__proto__:null,Menu:M}),...Object.freeze({__proto__:null,Modal:J}),...Object.freeze({__proto__:null,Navbar:K}),...Object.freeze({__proto__:null,Radio:P}),...Object.freeze({__proto__:null,Range:X}),...Object.freeze({__proto__:null,Rating:Z}),...Object.freeze({__proto__:null,Select:W}),...Object.freeze({__proto__:null,Stack:q}),...Object.freeze({__proto__:null,Stat:tt}),...Object.freeze({__proto__:null,Swap:et}),...Object.freeze({__proto__:null,Table:lt}),...Object.freeze({__proto__:null,Tabs:at}),...Object.freeze({__proto__:null,Timeline:ot}),...Object.freeze({__proto__:null,Toast:nt}),...Object.freeze({__proto__:null,Tooltip:st})};var ct={...At,install:(t=window)=>{Object.entries(At).forEach(([e,l])=>{t[e]=l}),console.log("🚀 SigproUI")}},rt=Object.freeze({__proto__:null,Accordion:n,Alert:S,Autocomplete:_,Badge:z,Button:E,Checkbox:I,Colorpicker:Y,Datepicker:V,Drawer:H,Dropdown:O,Fab:F,Fieldset:Q,Fileinput:N,Indicator:L,Input:D,List:T,Loading:G,Menu:M,Modal:J,Navbar:K,Radio:P,Range:X,Rating:Z,Select:W,Stack:q,Stat:tt,Swap:et,Table:lt,Tabs:at,Timeline:ot,Toast:nt,Tooltip:st,default:ct});const it={...rt,Icons:y,Utils:o,tt:R,install:(t=("undefined"!=typeof window?window:{}))=>{Object.entries(rt).forEach(([e,l])=>{t[e]=l}),t.Icons=y,t.Utils=o,t.tt=R,console.log("🌟 SigproUI")}};return t.Accordion=n,t.Alert=S,t.Autocomplete=_,t.Badge=z,t.Button=E,t.Checkbox=I,t.Colorpicker=Y,t.Datepicker=V,t.Drawer=H,t.Dropdown=O,t.Fab=F,t.Fieldset=Q,t.Fileinput=N,t.Indicator=L,t.Input=D,t.List=T,t.Loading=G,t.Menu=M,t.Modal=J,t.Navbar=K,t.Radio=P,t.Range=X,t.Rating=Z,t.Select=W,t.Stack=q,t.Stat=tt,t.Swap=et,t.Table=lt,t.Tabs=at,t.Timeline=ot,t.Toast=nt,t.Tooltip=st,t.default=it,t.icon123=u,t.iconAbc=m,t.iconCalendar=i,t.iconClose=r,t.iconError=b,t.iconHide=c,t.iconInfo=p,t.iconLLeft=B,t.iconLeft=$,t.iconLock=d,t.iconMail=h,t.iconRRight=x,t.iconRight=v,t.iconShow=A,t.iconSuccess=g,t.iconUpload=w,t.iconWarning=f,t.joinClass=a,t.tt=R,t.val=l,Object.defineProperty(t,"__esModule",{value:!0}),t}({},SigProCore); diff --git a/package.json b/package.json index 4f3136e..8838fea 100644 --- a/package.json +++ b/package.json @@ -1,14 +1,22 @@ { "name": "sigpro-ui", "version": "1.0.4", - "type": "module", - "license": "MIT", - "main": "./dist/sigpro-ui.js", - "module": "./index.js", - "unpkg": "./dist/sigpro-ui.min.js", - "jsdelivr": "./dist/sigpro-ui.min.js", + "repository": { + "type": "git", + "url": "https://github.com/natxocc/sigpro-ui.git" + }, + "main": "./dist/sigpro-ui.cjs", + "module": "./dist/sigpro-ui.esm.js", + "unpkg": "./dist/sigpro-ui.umd.min.js", + "jsdelivr": "./dist/sigpro-ui.umd.min.js", "exports": { - ".": "./index.js" + ".": { + "import": "./dist/sigpro-ui.esm.js", + "require": "./dist/sigpro-ui.cjs" + } + }, + "bugs": { + "url": "https://github.com/natxocc/sigpro-ui/issues" }, "files": [ "index.js", @@ -18,21 +26,6 @@ "LICENSE" ], "homepage": "https://natxocc.github.io/sigpro-ui/", - "repository": { - "type": "git", - "url": "https://github.com/natxocc/sigpro-ui.git" - }, - "bugs": { - "url": "https://github.com/natxocc/sigpro-ui/issues" - }, - "scripts": { - "docs": "bun x serve docs", - "build": "bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.js --format=iife --global-name=SigProUI --global-name=sigpro=SigProCore && bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.min.js --format=iife --global-name=SigProUI --global-name=sigpro=SigProCore --minify", - "prepublishOnly": "npm run build" - }, - "peerDependencies": { - "sigpro": ">=1.1.16" - }, "keywords": [ "signals", "reactive", @@ -41,5 +34,19 @@ "UI", "vanilla-js", "reactive-programming" - ] -} + ], + "license": "MIT", + "scripts": { + "docs": "bun x serve docs", + "build": "rollup -c", + "prepublishOnly": "npm run build" + }, + "peerDependencies": { + "sigpro": ">=1.1.16" + }, + "type": "module", + "devDependencies": { + "@rollup/plugin-terser": "^0.4.4", + "rollup": "^4.34.8" + } +} \ No newline at end of file diff --git a/rollup.config.js b/rollup.config.js new file mode 100644 index 0000000..b1ea270 --- /dev/null +++ b/rollup.config.js @@ -0,0 +1,49 @@ +import terser from '@rollup/plugin-terser'; + +export default [ + // ESM + { + input: './index.js', + external: ['sigpro'], + output: { + file: './dist/sigpro-ui.esm.js', + format: 'esm' + } + }, + // CommonJS + { + input: './index.js', + external: ['sigpro'], + output: { + file: './dist/sigpro-ui.cjs', + format: 'cjs' + } + }, + // UMD (IIFE para navegador) + { + input: './index.js', + external: ['sigpro'], + output: { + file: './dist/sigpro-ui.umd.js', + format: 'iife', + name: 'SigProUI', + globals: { + sigpro: 'SigProCore' + } + } + }, + // UMD minificado + { + input: './index.js', + external: ['sigpro'], + output: { + file: './dist/sigpro-ui.umd.min.js', + format: 'iife', + name: 'SigProUI', + globals: { + sigpro: 'SigProCore' + }, + plugins: [terser()] + } + } +]; \ No newline at end of file