diff --git a/dist/sigpro.utils.js b/dist/sigpro.utils.js index 161e757..2d948dc 100644 --- a/dist/sigpro.utils.js +++ b/dist/sigpro.utils.js @@ -1 +1 @@ -var{$:d,h:m,watch:x,render:g,isF:b}=window.SigPro,l=(t)=>{let e=()=>window.location.hash.slice(1)||"/",o=d(e()),n=()=>o(e());window.addEventListener("hashchange",n);let s=m("div",{class:"router-hook"}),h=null;return x([o],()=>{let w=o(),a=t.find((r)=>{let c=r.path.split("/").filter(Boolean),p=w.split("/").filter(Boolean);return c.length===p.length&&c.every((f,y)=>f[0]===":"||f===p[y])})||t.find((r)=>r.path==="*");if(a){h?.destroy();let r={};a.path.split("/").filter(Boolean).forEach((c,p)=>{if(c[0]===":")r[c.slice(1)]=w.split("/").filter(Boolean)[p]}),l.params(r),h=g(()=>b(a.component)?a.component(r):a.component),s.replaceChildren(h.container)}}),s.destroy=()=>{window.removeEventListener("hashchange",n),h?.destroy()},s};l.params=d({});l.to=(t)=>window.location.hash=t.replace(/^#?\/?/,"#/");l.back=()=>window.history.back();l.path=()=>window.location.hash.replace(/^#/,"")||"/";var k=async(t,e={},o=null)=>{if(o)o(!0);try{let n=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e),credentials:"include"});if(!n.ok){let s=await n.text();throw Error(`Error ${n.status}: ${s}`)}return await n.json()}finally{if(o)o(!1)}},u=d("en"),i={},v=(t)=>{for(let e of Object.keys(t)){if(!i[e])i[e]={};Object.assign(i[e],t[e])}},E=(t)=>{if(t&&i[t])u(t)},L=(t)=>{return()=>i[u()]?.[t]??t};export{L as t,E as setLocale,l as router,k as db,v as addLang}; +var{$:d,h:m,watch:g,render:x,isF:b}=window.SigPro,l=(t)=>{let e=()=>window.location.hash.slice(1)||"/",o=d(e()),n=()=>o(e());window.addEventListener("hashchange",n);let s=m("div",{class:"router-hook"}),h=null;return g([o],()=>{let f=o(),a=t.find((r)=>{let c=r.path.split("/").filter(Boolean),p=f.split("/").filter(Boolean);return c.length===p.length&&c.every((w,y)=>w[0]===":"||w===p[y])})||t.find((r)=>r.path==="*");if(a){h?.destroy();let r={};a.path.split("/").filter(Boolean).forEach((c,p)=>{if(c[0]===":")r[c.slice(1)]=f.split("/").filter(Boolean)[p]}),l.params(r),h=x(()=>b(a.component)?a.component(r):a.component),s.replaceChildren(h.container)}}),s.destroy=()=>{window.removeEventListener("hashchange",n),h?.destroy()},s};l.params=d({});l.to=(t)=>window.location.hash=t.replace(/^#?\/?/,"#/");l.back=()=>window.history.back();l.path=()=>window.location.hash.replace(/^#/,"")||"/";var k=async(t,e={},o=null)=>{if(o)o(!0);try{let n=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e),credentials:"include"});if(!n.ok){let s=await n.text();throw Error(`Error ${n.status}: ${s}`)}return await n.json()}finally{if(o)o(!1)}},u=d("en"),i={},v=(t)=>{for(let e of Object.keys(t)){if(!i[e])i[e]={};Object.assign(i[e],t[e])}},E=(t)=>{if(t&&i[t])u(t)},L=(t)=>{return()=>i[u()]?.[t]??t};export{L as t,E as setLocale,l as router,k as db,v as addLang}; diff --git a/docs/sigpro.utils.js b/docs/sigpro.utils.js index 161e757..2d948dc 100644 --- a/docs/sigpro.utils.js +++ b/docs/sigpro.utils.js @@ -1 +1 @@ -var{$:d,h:m,watch:x,render:g,isF:b}=window.SigPro,l=(t)=>{let e=()=>window.location.hash.slice(1)||"/",o=d(e()),n=()=>o(e());window.addEventListener("hashchange",n);let s=m("div",{class:"router-hook"}),h=null;return x([o],()=>{let w=o(),a=t.find((r)=>{let c=r.path.split("/").filter(Boolean),p=w.split("/").filter(Boolean);return c.length===p.length&&c.every((f,y)=>f[0]===":"||f===p[y])})||t.find((r)=>r.path==="*");if(a){h?.destroy();let r={};a.path.split("/").filter(Boolean).forEach((c,p)=>{if(c[0]===":")r[c.slice(1)]=w.split("/").filter(Boolean)[p]}),l.params(r),h=g(()=>b(a.component)?a.component(r):a.component),s.replaceChildren(h.container)}}),s.destroy=()=>{window.removeEventListener("hashchange",n),h?.destroy()},s};l.params=d({});l.to=(t)=>window.location.hash=t.replace(/^#?\/?/,"#/");l.back=()=>window.history.back();l.path=()=>window.location.hash.replace(/^#/,"")||"/";var k=async(t,e={},o=null)=>{if(o)o(!0);try{let n=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e),credentials:"include"});if(!n.ok){let s=await n.text();throw Error(`Error ${n.status}: ${s}`)}return await n.json()}finally{if(o)o(!1)}},u=d("en"),i={},v=(t)=>{for(let e of Object.keys(t)){if(!i[e])i[e]={};Object.assign(i[e],t[e])}},E=(t)=>{if(t&&i[t])u(t)},L=(t)=>{return()=>i[u()]?.[t]??t};export{L as t,E as setLocale,l as router,k as db,v as addLang}; +var{$:d,h:m,watch:g,render:x,isF:b}=window.SigPro,l=(t)=>{let e=()=>window.location.hash.slice(1)||"/",o=d(e()),n=()=>o(e());window.addEventListener("hashchange",n);let s=m("div",{class:"router-hook"}),h=null;return g([o],()=>{let f=o(),a=t.find((r)=>{let c=r.path.split("/").filter(Boolean),p=f.split("/").filter(Boolean);return c.length===p.length&&c.every((w,y)=>w[0]===":"||w===p[y])})||t.find((r)=>r.path==="*");if(a){h?.destroy();let r={};a.path.split("/").filter(Boolean).forEach((c,p)=>{if(c[0]===":")r[c.slice(1)]=f.split("/").filter(Boolean)[p]}),l.params(r),h=x(()=>b(a.component)?a.component(r):a.component),s.replaceChildren(h.container)}}),s.destroy=()=>{window.removeEventListener("hashchange",n),h?.destroy()},s};l.params=d({});l.to=(t)=>window.location.hash=t.replace(/^#?\/?/,"#/");l.back=()=>window.history.back();l.path=()=>window.location.hash.replace(/^#/,"")||"/";var k=async(t,e={},o=null)=>{if(o)o(!0);try{let n=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e),credentials:"include"});if(!n.ok){let s=await n.text();throw Error(`Error ${n.status}: ${s}`)}return await n.json()}finally{if(o)o(!1)}},u=d("en"),i={},v=(t)=>{for(let e of Object.keys(t)){if(!i[e])i[e]={};Object.assign(i[e],t[e])}},E=(t)=>{if(t&&i[t])u(t)},L=(t)=>{return()=>i[u()]?.[t]??t};export{L as t,E as setLocale,l as router,k as db,v as addLang}; diff --git a/package.json b/package.json index 8aa7a19..301767f 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,11 @@ "./grid": "./dist/sigpro.grid.js", "./editor": "./dist/sigpro.editor.js", "./vite": "./dist/sigpro.vite.js", - "./ui": "./dist/sigpro.ui.js" + "./ui": { + "types": "./sigpro.ui.d.ts", + "import": "./dist/sigpro.ui.js", + "default": "./dist/sigpro.ui.js" + } }, "files": [ "dist/", diff --git a/sigpro.ui.d.ts b/sigpro.ui.d.ts new file mode 100644 index 0000000..f1b3776 --- /dev/null +++ b/sigpro.ui.d.ts @@ -0,0 +1,308 @@ +// sigpro.ui.d.ts + +declare module "sigpro.ui" { + import type { Signal } from "./sigpro"; + + // Utilidades + function hide(): void; + + // Toast + function toast( + message: string | (() => any) | any, + type?: "alert-success" | "alert-error" | "alert-warning" | "alert-info", + duration?: number + ): () => void; + + // Calendar + interface CalendarProps { + class?: string; + value?: Signal | any; + range?: boolean | (() => boolean); + hour?: boolean; + onChange?: (value: any) => void; + } + function calendar(p: CalendarProps): HTMLElement; + + // Pallete + interface PalleteProps { + class?: string; + value?: Signal | ((v: string) => void); + onchange?: (color: string) => void; + } + function pallete(p: PalleteProps): HTMLElement; + + // UI Components + namespace ui { + // Accordion + function accordion(p: { class?: string; name?: string; checked?: boolean }, ...c: any[]): HTMLElement; + function accordion_title(p: { class?: string }, ...c: any[]): HTMLElement; + function accordion_content(p: { class?: string }, ...c: any[]): HTMLElement; + + // Alert + function alert(p: { class?: string }, ...c: any[]): HTMLElement; + + // Autocomplete + interface AutocompleteProps { + label?: string; + items: string[] | { label: string; value: any }[] | Signal; + value?: Signal | ((v: any) => void); + placeholder?: string; + class?: string; + icon?: string; + onChange?: (v: any) => void; + } + function autocomplete(p: AutocompleteProps): HTMLElement; + + // Avatar + function avatar(p: { class?: string; innerClass?: string }, ...c: any[]): HTMLElement; + function avatar_group(p: { class?: string }, ...c: any[]): HTMLElement; + + // Badge + function badge(p: { class?: string }, ...c: any[]): HTMLElement; + + // Breadcrumbs + function breadcrumbs(p: { class?: string }, ...c: any[]): HTMLElement; + + // Button + function button(p: { class?: string; onclick?: (e: Event) => void; disabled?: boolean | Signal }, ...c: any[]): HTMLElement; + + // Card + function card(p: { class?: string }, ...c: any[]): HTMLElement; + function card_title(p: { class?: string }, ...c: any[]): HTMLElement; + function card_body(p: { class?: string }, ...c: any[]): HTMLElement; + function card_actions(p: { class?: string }, ...c: any[]): HTMLElement; + + // Carousel + function carousel(p: { class?: string }, ...c: any[]): HTMLElement; + function carousel_item(p: { class?: string }, ...c: any[]): HTMLElement; + + // Chat + function chat(p: { class?: string }, ...c: any[]): HTMLElement; + function chat_image(p: { class?: string }, ...c: any[]): HTMLElement; + function chat_header(p: { class?: string }, ...c: any[]): HTMLElement; + function chat_bubble(p: { class?: string }, ...c: any[]): HTMLElement; + function chat_footer(p: { class?: string }, ...c: any[]): HTMLElement; + + // Checkbox + function checkbox(p: { class?: string; checked?: boolean | Signal; [key: string]: any }): HTMLElement; + + // Colorpicker + function colorpicker(p: AutocompleteProps): HTMLElement; + + // Combo + interface ComboProps { + label?: string; + value?: Signal | string | ((v: string) => void); + placeholder?: string; + class?: string; + icon?: string; + custom?: any; + disabled?: boolean | (() => boolean); + readonly?: string; + } + function combo(p: ComboProps, c?: Function): HTMLElement; + + // Datepicker + interface DatepickerProps { + label?: string; + value?: Signal; + range?: boolean | (() => boolean); + placeholder?: string; + class?: string; + fromPlaceholder?: string; + toPlaceholder?: string; + onChange?: (v: any) => void; + } + function datepicker(p: DatepickerProps): HTMLElement; + + // Divider + function divider(p: { class?: string }): HTMLElement; + + // Drawer + function drawer(p: { class?: string }, ...c: any[]): HTMLElement; + function drawer_toggle(p: { class?: string }): HTMLElement; + function drawer_content(p: { class?: string }, ...c: any[]): HTMLElement; + function drawer_side(p: { class?: string }, ...c: any[]): HTMLElement; + function drawer_overlay(p: { class?: string }): HTMLElement; + + // Dropdown + function dropdown(p: { class?: string }, ...c: any[]): HTMLElement; + function dropdown_button(p: { class?: string; tabindex?: string; role?: string }, ...c: any[]): HTMLElement; + function dropdown_content(p: { class?: string; tabindex?: string }, ...c: any[]): HTMLElement; + + // FAB + function fab(p: { class?: string }, ...c: any[]): HTMLElement; + function fab_button(p: { class?: string; tabindex?: string; role?: string }, ...c: any[]): HTMLElement; + + // Fieldset + function fieldset(p: { class?: string; label?: string }, ...c: any[]): HTMLElement; + + // File + function file(p: { class?: string; multiple?: boolean; accept?: string; onchange?: (e: Event) => void }): HTMLElement; + interface FileDragProps { + class?: string; + drag?: boolean | Signal; + ondrag?: (v: boolean) => void; + ondrop?: (files: FileList) => void; + } + function file_drag(p: FileDragProps, ...c: any[]): HTMLElement; + interface FilePreviewProps { + class?: string; + files?: File[] | Signal; + onremove?: (index: number) => void; + } + function file_preview(p: FilePreviewProps): HTMLElement; + function file_error(p: { class?: string; message?: string }): HTMLElement; + + // Float + function float(p: { label?: string }, ...c: any[]): HTMLElement; + + // Indicator + function indicator(p: { class?: string; value?: any; badgeClass?: string }, ...c: any[]): HTMLElement; + + // Input + function input(p: { + label?: string; + class?: string; + icon?: string; + right?: any; + type?: string | (() => string); + placeholder?: string; + value?: Signal | string; + [key: string]: any + }): HTMLElement; + + // Kbd + function kbd(p: { class?: string }, ...c: any[]): HTMLElement; + + // Label + function label(p: { class?: string }, ...c: any[]): HTMLElement; + + // Loading + function loading(p: { class?: string }): HTMLElement; + + // Menu + function menu(p: { class?: string }, ...c: any[]): HTMLElement; + interface MenuItem { + label?: string; + href?: string; + items?: MenuItem[]; + open?: boolean; + submenuClass?: string; + } + function menu_items(p: { items?: MenuItem[] }): HTMLElement[]; + + // Modal + function modal(p: { class?: string }, ...c: any[]): HTMLElement; + function modal_box(p: { class?: string }, ...c: any[]): HTMLElement; + function modal_action(p: { class?: string }, ...c: any[]): HTMLElement; + + // Navbar + function navbar(p: { class?: string }, ...c: any[]): HTMLElement; + + // Option + function option(p: { [key: string]: any }, ...c: any[]): HTMLElement; + + // Password + function password(p: { label?: string; class?: string; value?: Signal }): HTMLElement; + + // Progress + function progress(p: { class?: string; value?: number | Signal; max?: number | string }): HTMLElement; + + // Radial + function radial(p: { class?: string; value?: number | Signal; role?: string }): HTMLElement; + + // Radio + function radio(p: { class?: string; name?: string; checked?: boolean | Signal; [key: string]: any }): HTMLElement; + + // Range + function range(p: { class?: string; min?: number; max?: number; value?: number | Signal; oninput?: (e: Event) => void }): HTMLElement; + + // Rating + interface RatingProps { + class?: string; + count?: number; + mask?: string; + itemClass?: string; + name?: string; + value?: Signal | number; + offset?: number; + onChange?: (i: number) => void; + } + function rating(p: RatingProps): HTMLElement; + + // Search + function search(p: { label?: string; class?: string; icon?: string; value?: Signal; placeholder?: string }): HTMLElement; + + // Select + function select(p: { class?: string; [key: string]: any }, ...c: any[]): HTMLElement; + + // Stack + function stack(p: { class?: string }, ...c: any[]): HTMLElement; + + // Stat + function stat(p: { class?: string }, ...c: any[]): HTMLElement; + function stat_figure(p: { class?: string }, ...c: any[]): HTMLElement; + function stat_title(p: { class?: string }, ...c: any[]): HTMLElement; + function stat_value(p: { class?: string }, ...c: any[]): HTMLElement; + function stat_desc(p: { class?: string }, ...c: any[]): HTMLElement; + + // Steps + function steps(p: { class?: string }, ...c: any[]): HTMLElement; + function step(p: { class?: string; dataContent?: string }, ...c: any[]): HTMLElement; + + // Swap + function swap(p: { class?: string; value?: Signal | boolean }, ...c: any[]): HTMLElement; + function swap_on(p: { class?: string }, ...c: any[]): HTMLElement; + function swap_off(p: { class?: string }, ...c: any[]): HTMLElement; + + // Table + function table(p: { class?: string }, ...c: any[]): HTMLElement; + function table_head(p: { class?: string }, ...c: any[]): HTMLElement; + function table_body(p: { class?: string }, ...c: any[]): HTMLElement; + function table_foot(p: { class?: string }, ...c: any[]): HTMLElement; + function table_row(p: { class?: string }, ...c: any[]): HTMLElement; + function table_th(p: { class?: string }, ...c: any[]): HTMLElement; + function table_td(p: { class?: string }, ...c: any[]): HTMLElement; + + // Tabs + function tabs(p: { class?: string }, ...c: any[]): HTMLElement; + interface TabProps { + class?: string; + classContent?: string; + name?: string; + label?: string; + content?: any; + checked?: boolean | (() => boolean); + tabs?: Signal | ((v: any[]) => void); + index?: number; + closable?: boolean; + onclick?: () => void; + } + function tab(p: TabProps): any[]; + + // Textarea + function textarea(p: { class?: string; [key: string]: any }): HTMLElement; + + // Textrotate + function textrotate(p: { class?: string }, ...c: any[]): HTMLElement; + + // Theme + function theme(p?: { value?: string; class?: string }): HTMLElement; + + // Timeline + function timeline(p: { class?: string }, ...c: any[]): HTMLElement; + function timeline_start(p: { class?: string }, ...c: any[]): HTMLElement; + function timeline_middle(p: { class?: string }, ...c: any[]): HTMLElement; + function timeline_end(p: { class?: string }, ...c: any[]): HTMLElement; + + // Toggle + function toggle(p: { class?: string; value?: string | Signal; checked?: boolean | Signal; [key: string]: any }): HTMLElement; + + // Tooltip + function tooltip(p: { class?: string; tip?: string }, ...c: any[]): HTMLElement; + + // Validator + function validator(p: { class?: string }, ...c: any[]): HTMLElement; + } +} \ No newline at end of file diff --git a/src/sigpro.convert.js b/src/sigpro.convert.js index 54fe961..30a04cf 100644 --- a/src/sigpro.convert.js +++ b/src/sigpro.convert.js @@ -1,4 +1,5 @@ -// src/sigpro.convert.js - Conversor HTML a SigPro con preview +/// + var { $ } = window.SigPro; function html2sigpro(h, mode = "tags") { diff --git a/src/sigpro.editor.js b/src/sigpro.editor.js index 4c1407e..d637bdd 100644 --- a/src/sigpro.editor.js +++ b/src/sigpro.editor.js @@ -1,3 +1,5 @@ +/// + const { $, isF } = window.SigPro export const Editor = p => { diff --git a/src/sigpro.grid.js b/src/sigpro.grid.js index a9105f4..08129fd 100644 --- a/src/sigpro.grid.js +++ b/src/sigpro.grid.js @@ -1,3 +1,5 @@ +/// + const { h, watch, onUnmount } = window.SigPro import { diff --git a/src/sigpro.ui.js b/src/sigpro.ui.js index 7347f80..b0d6355 100644 --- a/src/sigpro.ui.js +++ b/src/sigpro.ui.js @@ -1,3 +1,5 @@ +/// + const { $, h, mount, val, isF, isO } = window.SigPro; export const hide = () => document.activeElement?.blur(); diff --git a/src/sigpro.utils.js b/src/sigpro.utils.js index 6aaf22c..615e649 100644 --- a/src/sigpro.utils.js +++ b/src/sigpro.utils.js @@ -1,3 +1,5 @@ +/// + const { $, h, watch, render, isF } = window.SigPro; // router