limbo-component 2.5.0 → 2.5.2

package/dist/limbo.es.js

@@ -62,9 +62,9 @@ return s(c,{children:[
 return s("div",{className:"limbo-image-card lb:animate-pulse",role:"status","aria-label":"Cargando imágen...",children:[
 /* @__PURE__ */o("div",{className:"lb:w-full lb:aspect-square lb:bg-neutral-gray-200 lb:rounded-md lb:flex lb:items-center lb:justify-center",children:/* @__PURE__ */o("span",{className:"icon icon-spinner"})}),
 /* @__PURE__ */o("div",{className:"limbo-image-card-name lb:opacity-100 lb:position-relative lb:bottom-0 lb:p-2",children:/* @__PURE__ */o("div",{className:"lb:h-4 lb:bg-neutral-gray-200 lb:rounded lb:w-3/4"})}),
-/* @__PURE__ */o("span",{className:"lb:sr-only",children:"Cargando imágen..."})]})}function ee({onSelect:e,onCrop:r,onDelete:a,deletingId:i,images:c,loading:u,error:d,filters:b={name:"",dateFrom:"",dateTo:"",uploadedBy:""},debouncedFilters:m=null,onFiltersChange:h,filterConfig:p={showNameFilter:!0,showUploadedByFilter:!1,showDateFilter:!0},loadingConfig:f={showPlaceholders:!0,placeholderCount:10,showSpinner:!0},allowedActions:g={select:!0,download:!0,copy:!0,delete:!0,crop:!0,variants:!0}}){const{isSearching:y,searchPending:v}=function(e,r,a){const[i,o]=t(!1),s=l(null);return n(()=>(Object.keys(e).some(t=>e[t]!==r[t])?s.current=setTimeout(()=>{o(!0)},150):(s.current&&clearTimeout(s.current),o(!1)),()=>{s.current&&clearTimeout(s.current)}),[e,r]),{isSearching:i||a,searchPending:i}}(b,m||b,u),w=!1!==p.showNameFilter,x=!0===p.showUploadedByFilter,k=!1!==p.showDateFilter,C=l(null),S=window.limboCore?.accessibilityManager;n(()=>{if(C.current&&window.limboCore?.keyboardManager){const e="gallery-grid";C.current.setAttribute("data-grid-id",e),window.limboCore.keyboardManager.setupGridNavigation(C.current,{itemSelector:".limbo-image-card",gridId:e,columns:"auto"})}},[c]),n(()=>{if(!u&&c.length>0){const e=c.slice(0,12).map(e=>e.url||e.path).filter(Boolean);e.length>0&&M(e,4)}},[u,c]),n(()=>{u?S?.announceLoading(!0,"galería"):u||d?d&&S?.announceError(d,"galería"):(S?.announceLoading(!1,"galería"),c.length>0&&S?.announce(`Se encontraron ${c.length} imágenes en la galería`))},[u,d,c.length,S]),n(()=>{v&&S?.announce("Buscando...","polite")},[v,S]);const N=e=>{const{name:t,value:n}=e.target;h&&h({...b,[t]:n})},E=y&&c.length>0&&!u;/* @__PURE__ */
+/* @__PURE__ */o("span",{className:"lb:sr-only",children:"Cargando imágen..."})]})}function ee({onSelect:e,onCrop:r,onDelete:a,deletingId:i,images:c,loading:u,error:d,filters:b={name:"",dateFrom:"",dateTo:"",uploadedBy:""},debouncedFilters:m=null,onFiltersChange:h,filterConfig:p={showNameFilter:!0,showUploadedByFilter:!1,showDateFilter:!0},loadingConfig:f={showPlaceholders:!0,placeholderCount:10,showSpinner:!0},allowedActions:g={select:!0,download:!0,copy:!0,delete:!0,crop:!0,variants:!0}}){const{isSearching:y,searchPending:v}=function(e,r,a){const[i,o]=t(!1),s=l(null);return n(()=>(Object.keys(e).some(t=>e[t]!==r[t])?s.current=setTimeout(()=>{o(!0)},150):(s.current&&clearTimeout(s.current),o(!1)),()=>{s.current&&clearTimeout(s.current)}),[e,r]),{isSearching:i||a,searchPending:i}}(b,m||b,u),w=!1!==p.showNameFilter,x=!0===p.showUploadedByFilter,k=!1!==p.showDateFilter,C=l(null),S=window.limboCore?.accessibilityManager;n(()=>{if(C.current&&window.limboCore?.keyboardManager){const e="gallery-grid";C.current.setAttribute("data-grid-id",e),window.limboCore.keyboardManager.setupGridNavigation(C.current,{itemSelector:".limbo-image-card",gridId:e,columns:"auto"})}},[c]),n(()=>{if(!u&&c.length>0){const e=c.slice(0,12).map(e=>e.url||e.path).filter(Boolean);e.length>0&&M(e,4)}},[u,c]),n(()=>{u?S?.announceLoading(!0,"galería"):u||d?d&&S?.announceError(d,"galería"):(S?.announceLoading(!1,"galería"),c.length>0&&S?.announce(`Se encontraron ${c.length} imágenes en la galería`))},[u,d,c.length,S]),n(()=>{v&&S?.announce("Buscando...","polite")},[v,S]);const N=e=>{const{name:t,value:n}=e.target;h&&h({...b,[t]:n})},E=b.name||b.dateFrom||b.dateTo||b.uploadedBy,$=y&&c.length>0&&!u;/* @__PURE__ */
 return s("div",{className:"lb:w-full lb:py-2",children:[
-/* @__PURE__ */o("div",{className:"lb:px-2 lb:mb-3 lb:mx-2 lb:w-max lb:max-w-full",children:/* @__PURE__ */s("form",{className:"limbo-filters",onSubmit:e=>e.preventDefault(),role:"search","aria-label":"Filtrar imágenes",children:[w&&/* @__PURE__ */s("div",{className:"limbo-filter-group limbo-filter-group--name",children:[
+/* @__PURE__ */o("div",{className:"lb:px-2 lb:mb-3 lb:mx-2 lb:w-max lb:max-w-full",children:/* @__PURE__ */s("form",{className:"limbo-filters lb:flex lb:items-stretch lb:content-stretch lb:flex-row",onSubmit:e=>e.preventDefault(),role:"search","aria-label":"Filtrar imágenes",children:[w&&/* @__PURE__ */s("div",{className:"limbo-filter-group limbo-filter-group--name",children:[
 /* @__PURE__ */s("label",{htmlFor:"name",className:"limbo-filter-label",children:["Nombre",v&&/* @__PURE__ */o("span",{className:"limbo-filter-searching","aria-hidden":"true",children:/* @__PURE__ */o("span",{className:"icon icon-spinner lb:animate-spin lb:w-3 lb:h-3"})})]}),
 /* @__PURE__ */o("input",{type:"text",name:"name",id:"name",placeholder:"Buscar...",value:b.name,onChange:N,className:"limbo-filter-input",autoComplete:"off"})]}),k&&/* @__PURE__ */s("div",{className:"limbo-filter-dates",children:[
 /* @__PURE__ */s("div",{className:"limbo-filter-group limbo-filter-group--date",children:[
@@ -74,13 +74,17 @@ return s("div",{className:"lb:w-full lb:py-2",children:[
 /* @__PURE__ */o("label",{htmlFor:"dateTo",className:"limbo-filter-label",children:"Hasta"}),
 /* @__PURE__ */o("input",{type:"date",name:"dateTo",id:"dateTo",value:b.dateTo,onChange:N,className:"limbo-filter-input"})]})]}),x&&/* @__PURE__ */s("div",{className:"limbo-filter-group",children:[
 /* @__PURE__ */o("label",{htmlFor:"uploadedBy",className:"limbo-filter-label",children:"Subido por"}),
-/* @__PURE__ */o("input",{type:"text",name:"uploadedBy",id:"uploadedBy",placeholder:"Usuario...",value:b.uploadedBy,onChange:N,className:"limbo-filter-input",style:{minWidth:"100px",maxWidth:"140px"}})]})]})}),u?/* @__PURE__ */s("div",{className:"lb:relative",children:[
+/* @__PURE__ */o("input",{type:"text",name:"uploadedBy",id:"uploadedBy",placeholder:"Usuario...",value:b.uploadedBy,onChange:N,className:"limbo-filter-input",style:{minWidth:"100px",maxWidth:"140px"}})]}),
+/* @__PURE__ */s("div",{children:[
+/* @__PURE__ */o("span",{}),
+/* @__PURE__ */s("button",{type:"button",onClick:()=>{h&&h({name:"",uploadedBy:"",dateFrom:"",dateTo:""})},disabled:!E,className:"limbo-filter-clear-btn","aria-label":"Limpiar todos los filtros",title:"Limpiar filtros",children:[
+/* @__PURE__ */o("span",{className:"icon icon-close-small"}),"Limpiar"]})]})]})}),u?/* @__PURE__ */s("div",{className:"lb:relative",children:[
 /* @__PURE__ */o("div",{className:"lb:absolute lb:inset-0 lb:flex lb:items-center lb:justify-center lb:bg-white/80 lb:z-10 lb:min-h-75",children:/* @__PURE__ */s("div",{className:"lb:flex lb:flex-col lb:items-center lb:gap-3",children:[
 /* @__PURE__ */o("span",{className:"icon icon-spinner lb:p-4 lb:animate-spin"}),
-/* @__PURE__ */o("span",{className:"lb:text-sm lb:text-gray-600 lb:font-medium",children:"Cargando imágenes..."})]})}),f.showPlaceholders&&/* @__PURE__ */o("div",{ref:C,className:"limbo-gallery lb:opacity-30","data-limbo-responsive":!0,role:"grid","aria-label":"Cargando imágenes de la galería","aria-busy":"true",children:Array.from({length:f.placeholderCount}).map((e,t)=>/* @__PURE__ */o("div",{role:"gridcell","aria-posinset":t+1,"aria-setsize":f.placeholderCount,children:/* @__PURE__ */o(Z,{})},`skeleton-${t}`))})]}):d?/* @__PURE__ */o("div",{className:"alert alert-danger lb:text-center",children:d}):/* @__PURE__ */s("div",{className:"lb:relative",children:[E&&/* @__PURE__ */o("div",{className:"limbo-search-overlay",role:"status","aria-live":"polite","aria-label":"Buscando imágenes",children:/* @__PURE__ */s("div",{className:"limbo-search-overlay__content",children:[
+/* @__PURE__ */o("span",{className:"lb:text-sm lb:text-gray-600 lb:font-medium",children:"Cargando imágenes..."})]})}),f.showPlaceholders&&/* @__PURE__ */o("div",{ref:C,className:"limbo-gallery lb:opacity-30","data-limbo-responsive":!0,role:"grid","aria-label":"Cargando imágenes de la galería","aria-busy":"true",children:Array.from({length:f.placeholderCount}).map((e,t)=>/* @__PURE__ */o("div",{role:"gridcell","aria-posinset":t+1,"aria-setsize":f.placeholderCount,children:/* @__PURE__ */o(Z,{})},`skeleton-${t}`))})]}):d?/* @__PURE__ */o("div",{className:"alert alert-danger lb:text-center",children:d}):/* @__PURE__ */s("div",{className:"lb:relative",children:[$&&/* @__PURE__ */o("div",{className:"limbo-search-overlay",role:"status","aria-live":"polite","aria-label":"Buscando imágenes",children:/* @__PURE__ */s("div",{className:"limbo-search-overlay__content",children:[
 /* @__PURE__ */o("span",{className:"icon icon-spinner lb:animate-spin"}),
 /* @__PURE__ */o("span",{children:"Buscando..."})]})}),
-/* @__PURE__ */o("div",{ref:C,className:"limbo-gallery lb:px-3 "+(E?"lb:opacity-50 lb:pointer-events-none":""),"data-limbo-responsive":!0,"data-grid-id":"gallery-grid",role:"grid","aria-label":"Galería de imágenes. Use las flechas para navegar entre imágenes","aria-busy":E,children:c.length>0?c.map((t,n)=>/* @__PURE__ */o("div",{role:"gridcell","aria-posinset":n+1,"aria-setsize":c.length,children:/* @__PURE__ */o(J,{image:t,onSelect:e,onCrop:r,onDelete:g.delete&&a?()=>a(t.id):null,thumbnailSize:32,isDeleting:i===t.id,allowedActions:g})},t.id)):/* @__PURE__ */o("div",{className:"lb:col-span-full lb:text-center lb:text-gray-500 lb:py-8",role:"status","aria-live":"polite",children:/* @__PURE__ */o("p",{children:"No se han encontrado imágenes"})})})]})]})}function te({image:e,onDiscard:r,onRetry:l,onDownload:a,onSelect:i,showRetry:c=!1,disabled:u=!1}){const[d,b]=t(null),[m,h]=t({name:"",size:"",type:""}),[p,f]=t(!1),[g,y]=t(!1),[v,w]=t("");n(()=>{if(!e)return void b(null);const t=URL.createObjectURL(e);b(t);const n=e.name||"imagen.webp",r=(e=>{const t=e?.split(".")[0]?.toLowerCase()||"";return["ai-image","ai_image","generated","imagen-ia","imagen_ia"].some(e=>t.startsWith(e))})(n);return h({name:n,size:x(e.size||0),type:e.type||"image/webp"}),r?(w(""),y(!1)):w(n.split(".")[0]),()=>{URL.revokeObjectURL(t)}},[e]);const x=e=>{if(0===e)return"0 Bytes";const t=Math.floor(Math.log(e)/Math.log(1024));return Math.round(e/Math.pow(1024,t)*100)/100+" "+["Bytes","KB","MB","GB"][t]};return e&&d?/* @__PURE__ */s("div",{className:"lb:w-fit lb:md:w-full lb:bg-white lb:border lb:border-gray-200 lb:rounded-lg lb:px-1 lb:sm:px-3 lb:py-2 lb:m-0 lb:shadow-sm",children:[
+/* @__PURE__ */o("div",{ref:C,className:"limbo-gallery lb:px-3 "+($?"lb:opacity-50 lb:pointer-events-none":""),"data-limbo-responsive":!0,"data-grid-id":"gallery-grid",role:"grid","aria-label":"Galería de imágenes. Use las flechas para navegar entre imágenes","aria-busy":$,children:c.length>0?c.map((t,n)=>/* @__PURE__ */o("div",{role:"gridcell","aria-posinset":n+1,"aria-setsize":c.length,children:/* @__PURE__ */o(J,{image:t,onSelect:e,onCrop:r,onDelete:g.delete&&a?()=>a(t.id):null,thumbnailSize:32,isDeleting:i===t.id,allowedActions:g})},t.id)):/* @__PURE__ */o("div",{className:"lb:col-span-full lb:text-center lb:text-gray-500 lb:py-8",role:"status","aria-live":"polite",children:/* @__PURE__ */o("p",{children:"No se han encontrado imágenes"})})})]})]})}function te({image:e,onDiscard:r,onRetry:l,onDownload:a,onSelect:i,showRetry:c=!1,disabled:u=!1}){const[d,b]=t(null),[m,h]=t({name:"",size:"",type:""}),[p,f]=t(!1),[g,y]=t(!1),[v,w]=t("");n(()=>{if(!e)return void b(null);const t=URL.createObjectURL(e);b(t);const n=e.name||"imagen.webp",r=(e=>{const t=e?.split(".")[0]?.toLowerCase()||"";return["ai-image","ai_image","generated","imagen-ia","imagen_ia"].some(e=>t.startsWith(e))})(n);return h({name:n,size:x(e.size||0),type:e.type||"image/webp"}),r?(w(""),y(!1)):w(n.split(".")[0]),()=>{URL.revokeObjectURL(t)}},[e]);const x=e=>{if(0===e)return"0 Bytes";const t=Math.floor(Math.log(e)/Math.log(1024));return Math.round(e/Math.pow(1024,t)*100)/100+" "+["Bytes","KB","MB","GB"][t]};return e&&d?/* @__PURE__ */s("div",{className:"lb:w-fit lb:md:w-full lb:bg-white lb:border lb:border-gray-200 lb:rounded-lg lb:px-1 lb:sm:px-3 lb:py-2 lb:m-0 lb:shadow-sm",children:[
 /* @__PURE__ */s("div",{className:"lb:flex lb:items-center lb:justify-between lb:mb-4 lb:px-1",children:[
 /* @__PURE__ */o("h3",{className:"lb:text-sm lb:font-medium lb:text-gray-700",children:"Vista previa de imagen"}),
 /* @__PURE__ */o("button",{type:"button",onClick:r,disabled:u,className:"lb:p-1.5 lb:text-gray-400 lb:cursor-pointer lb:hover:text-gray-600 lb:hover:bg-red-300 lb:rounded lb:transition-colors lb:disabled:opacity-50 lb:disabled:cursor-not-allowed","aria-label":"Descartar imagen",title:"Descartar imagen",children:/* @__PURE__ */o("span",{className:"icon icon-close-small icon--md"})})]}),
@@ -126,7 +130,7 @@ return s("div",{className:"lb:flex lb:flex-col lb:items-center lb:gap-6","aria-l
 /* @__PURE__ */s("div",{className:"lb:flex lb:flex-wrap lb:items-center lb:gap-3 lb:mb-2",children:[
 /* @__PURE__ */o("h3",{className:"lb:text-2xl lb:font-semibold lb:text-brand-blue-1000",children:a.services.find(e=>e.slug===b)?.label||"Generación IA"}),a.services.find(e=>e.slug===b)?.costInfo&&/* @__PURE__ */s("div",{title:"Coste estimado por imagen que le cuesta a la empresa, este coste depende de la calidad de la imagen generada y puede variar según el proveedor IA, ten en cuenta este coste para hacer un uso más responsable del servicio IA",className:"lb:flex lb:items-center lb:gap-1","aria-description":"Coste estimado por imagen que le cuesta a la empresa, este coste depende de la calidad de la imagen generada y puede variar según el proveedor IA, ten en cuenta este coste para hacer un uso más responsable del servicio IA",children:[
 /* @__PURE__ */s("span",{className:"lb:inline-flex lb:items-center lb:gap-1 lb:px-2 lb:py-0.5 lb:text-xs lb:font-medium lb:text-warning-1000 lb:bg-yellow-200/60 lb:rounded-full lb:border lb:border-warning-1000 lb:select-none",children:[
-/* @__PURE__ */o("span",{className:"icon icon-euro-blue icon--2sm icon--warning",style:{filter:"var(--icon-warning-dark)"}}),"Coste:"," ",a.services.find(e=>e.slug===b)?.costInfo]}),
+/* @__PURE__ */o("span",{className:"icon icon-euro-blue icon--2sm icon--warning",style:{filter:"var(--limbo-icon-warning-dark)"}}),"Coste:"," ",a.services.find(e=>e.slug===b)?.costInfo]}),
 /* @__PURE__ */o("span",{className:"icon icon-info lb:cursor-help"})]})]}),i.loading&&/* @__PURE__ */o("div",{children:"Cargando parámetros..."}),i.error&&/* @__PURE__ */o("div",{className:"alert alert-danger",children:i.error}),b&&(()=>{const e=i.params?.[b]?.parameters;if(!e)return null;const t=Object.entries(e).filter(([e,t])=>!t.hidden),n=t.filter(([e])=>e.toLowerCase().includes("prompt")||e.toLowerCase().includes("query")),l=t.filter(([e])=>!e.toLowerCase().includes("prompt")&&!e.toLowerCase().includes("query")),c=(e,t)=>{let n=t.placeholder||"";n||(n="integer"===t.type?t.minValue&&t.maxValue?`Entre ${t.minValue} y ${t.maxValue}`:t.minValue?`Mínimo ${t.minValue}`:t.maxValue?`Máximo ${t.maxValue}`:"Introduce un número":e.toLowerCase().includes("prompt")?"Describe la imagen que deseas generar...":e.toLowerCase().includes("negative")?"Elementos a evitar en la imagen...":`Introduce ${(t.label||e).toLowerCase()}`);const l=e.toLowerCase().includes("prompt")||e.toLowerCase().includes("query");/* @__PURE__ */
 return s("div",{className:"lb:flex lb:flex-col lb:gap-1",children:[
 /* @__PURE__ */s("label",{htmlFor:`ai-${e}`,className:"lb:text-xs lb:font-medium lb:text-brand-blue-1000",children:[t.label||e,t.required&&/* @__PURE__ */o("span",{className:"lb:text-red-1000 lb:ml-1",children:"*"})]}),t.options?/* @__PURE__ */o("select",{id:`ai-${e}`,name:e,value:h[e]??"",onChange:_,className:"limbo-input",disabled:r,title:t.label||e,children:t.options.map(e=>/* @__PURE__ */o("option",{value:e,children:e},e))}):l?/* @__PURE__ */o("textarea",{id:`ai-${e}`,name:e,value:h[e]??"",onChange:_,className:"limbo-input lb:resize-none lb:overflow-y-auto",disabled:r,required:t.required,placeholder:n,title:t.label||e,rows:3,style:{maxHeight:"9rem",minHeight:"3rem"},onInput:e=>{e.target.style.height="auto";const t=Math.min(e.target.scrollHeight,144);e.target.style.height=`${t}px`}}):/* @__PURE__ */o("input",{id:`ai-${e}`,type:"integer"===t.type?"number":"text",name:e,value:h[e]??"",onChange:_,className:"limbo-input",disabled:r,required:t.required,min:t.minValue,max:t.maxValue,placeholder:n,title:t.label||e})]},e)};/* @__PURE__ */
@@ -245,7 +249,7 @@ return o("button",{type:"button","data-upload-tab-id":e.id,className:y(t),"aria-
 /* @__PURE__ */s("div",{className:"lb:bg-white lb:border-b lb:border-gray-200 lb:py-2 lb:mx-2 lb:shrink-0 lb:sticky lb:top-0 lb:z-10 lb:mb-1",children:[
 /* @__PURE__ */s("div",{className:"lb:flex lb:items-center lb:justify-between lb:mb-2",children:[
 /* @__PURE__ */s("h3",{className:"lb:text-sm lb:font-semibold lb:text-gray-700",children:["Recortes ",Z.length>1&&`(${Z.length})`]}),J.allowCustomCrops&&/* @__PURE__ */s("button",{onClick:Qe,disabled:pe,className:"lb:text-xs lb:cursor-pointer lb:px-2 lb:py-1 lb:bg-brand-blue-50 lb:hover:bg-brand-blue-200 lb:text-brand-blue-1000 lb:rounded lb:border lb:border-brand-blue-200 lb:transition-colors lb:flex lb:items-center lb:gap-1",title:"Añadir recorte personalizado",children:[
-/* @__PURE__ */o("span",{className:"icon icon-add icon--sm",style:{filter:"var(--icon-blue)"}}),"Añadir recorte"]})]}),
+/* @__PURE__ */o("span",{className:"icon icon-add icon--sm",style:{filter:"var(--limbo-icon-blue)"}}),"Añadir recorte"]})]}),
 /* @__PURE__ */o("div",{className:"lb:grid lb:grid-cols-2 lb:md:grid-cols-3 lb:lg:grid-cols-4 lb:xl:grid-cols-5 lb:gap-1.5 lb:max-h-48 lb:overflow-y-auto",children:Z.map((e,t)=>{const n=e.savedState||t===te;/* @__PURE__ */
 return s("label",{className:"lb:h-fit lb:flex lb:flex-col lb:p-1.5 lb:rounded lb:border lb:cursor-pointer lb:transition-colors lb:min-h-17.5 lb:w-full "+(te===t?"lb:bg-blue-50 lb:border-blue-300":n?"lb:bg-gray-50 lb:border-gray-200 lb:hover:bg-gray-100":"lb:bg-orange-50 lb:border-orange-300 lb:hover:bg-orange-100"),children:[
 /* @__PURE__ */o("input",{type:"radio",name:"active-crop",checked:te===t,onChange:()=>Ge(t),disabled:pe,className:"lb:hidden"}),