@erplora/outfitkit 0.1.1

package/dist/components/ok-detail-list/ok-detail-list.d.ts

@@ -0,0 +1,30 @@
+import { LitElement } from 'lit';
+/** Un par etiqueta/valor del detail-list (description list). */
+export interface OkDetailItem {
+    /** Etiqueta del par (muted). */
+    label: string;
+    /** Valor del par. String plano o, si `html` es true, marcado HTML enriquecido. */
+    value?: string;
+    /** Si true, `value` se interpreta como HTML enriquecido (sanitiza tú la fuente). */
+    html?: boolean;
+    /** Si true, este par ocupa el ancho completo aunque haya 2 columnas. */
+    full?: boolean;
+}
+export declare class OkDetailList extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Pares label/value a renderizar. */
+    items: OkDetailItem[];
+    /** Número de columnas en desktop (1 ó 2). Reflejado a atributo para el CSS. */
+    columns: 1 | 2;
+    /** Modo compacto (menos separación). Reflejado a atributo. */
+    dense: boolean;
+    /** Placeholder para valores vacíos. */
+    placeholder: string;
+    private renderValue;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-detail-list': OkDetailList;
+    }
+}

package/dist/components/ok-diff/ok-diff.d.ts

@@ -0,0 +1,38 @@
+import { LitElement } from 'lit';
+/** Tipo de línea de un diff unificado. */
+export type OkDiffLineType = 'add' | 'del' | 'ctx' | 'hunk';
+/** Una línea del visor de diff. */
+export interface OkDiffLine {
+    /** add = añadida, del = eliminada, ctx = contexto, hunk = cabecera @@…@@. */
+    type: OkDiffLineType;
+    /** Texto de la línea (sin el glifo +/−; el glifo lo pinta el componente). */
+    content: string;
+    /** Número de línea en el fichero original (old). */
+    oldNo?: number;
+    /** Número de línea en el fichero nuevo (new). */
+    newNo?: number;
+}
+export declare class OkDiff extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Series de líneas declarativas (tiene prioridad sobre `raw`). */
+    lines: OkDiffLine[];
+    /** Diff unificado en crudo; se parsea a líneas si no se aportó `.lines`. */
+    raw: string;
+    /** Devuelve las líneas a renderizar: `.lines` si existe, si no parsea `raw`. */
+    private resolveLines;
+    /**
+     * Parsea un diff unificado (texto) a OkDiffLine[]. CSP-safe (sin eval):
+     * solo recorre líneas y lleva la cuenta de oldNo/newNo según las cabeceras
+     * de hunk `@@ -a,b +c,d @@`. Ignora cabeceras de fichero (---, +++).
+     */
+    static parseUnified(raw: string): OkDiffLine[];
+    /** Texto de la columna numérica (vacío si no hay número). */
+    private static numText;
+    private renderLine;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-diff': OkDiff;
+    }
+}

package/dist/components/ok-donut/ok-donut.d.ts

@@ -0,0 +1,38 @@
+import { LitElement } from 'lit';
+/** Un segmento del donut. */
+export interface OkDonutSlice {
+    /** Nombre del segmento (se muestra en la leyenda). */
+    label: string;
+    /** Valor numérico; el porcentaje se calcula sobre el total. */
+    value: number;
+    /** Color del segmento; si falta, cae a la paleta por defecto por índice. */
+    color?: string;
+}
+export declare class OkDonut extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Segmentos a representar. Se aporta asignando la propiedad desde JS. */
+    slices: OkDonutSlice[];
+    /** Diámetro del SVG en px. */
+    size: number;
+    /** Grosor del anillo en px; 0 ⇒ pie macizo. */
+    thickness: number;
+    /** Texto en mayúsculas bajo el valor central. */
+    centerLabel: string;
+    /** Valor grande central; si está vacío no se pinta texto central. */
+    centerValue: string;
+    /** Muestra la leyenda. */
+    legend: boolean;
+    /** Posición de la leyenda. */
+    legendSide: 'side' | 'bottom';
+    private get total();
+    private colorAt;
+    private pct;
+    private renderChart;
+    private renderLegend;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-donut': OkDonut;
+    }
+}

package/dist/components/ok-drawer/ok-drawer.d.ts

@@ -0,0 +1,56 @@
+import { LitElement, type PropertyValues } from 'lit';
+/** Lado del drawer ('end' = derecha en LTR). */
+export type OkDrawerSide = 'end' | 'start';
+/** Textos humanos de ok-drawer (i18n; default inglés, override vía prop `labels`). */
+export interface OkDrawerLabels {
+    /** aria-label / tooltip del botón de cerrar (X). */
+    close: string;
+}
+export declare class OkDrawer extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Abierto/cerrado (reflejado). El padre puede controlarlo (señal/ref). */
+    open: boolean;
+    /** Lado del panel: 'end' (def, derecha en LTR) | 'start' (reflejado para CSS). */
+    side: OkDrawerSide;
+    /** Ancho del panel (def 420px; en móvil siempre 100%). */
+    width: string;
+    /** Título de la cabecera. */
+    heading?: string;
+    /** Nombre de un ionicon junto al título. */
+    icon?: string;
+    /** Fondo oscurecido clicable (def true). Para quitarlo: `.scrim=${false}`. */
+    scrim: boolean;
+    /** Si true (def), cierra con ESC / click en scrim / botón X. Si false, oculta la X. */
+    dismissible: boolean;
+    /** Overrides de textos humanos (i18n). Se fusionan sobre los defaults en inglés. */
+    labels: Partial<OkDrawerLabels>;
+    /** Textos efectivos (defaults inglés + overrides). */
+    private get t();
+    private panel?;
+    private previousFocus;
+    private hasFooter;
+    private readonly onDocKeydown;
+    disconnectedCallback(): void;
+    protected updated(changed: PropertyValues): void;
+    private afterOpen;
+    private afterClose;
+    /**
+     * Gesto de cierre (scrim/esc/botón): emite `ok-close` CANCELABLE con la razón. Si nadie hace
+     * `preventDefault()` se auto-cierra (fallback no-controlado); un padre controlado puede vetar.
+     */
+    requestClose(reason: 'scrim' | 'esc' | 'button'): void;
+    /** Abre el drawer (azúcar imperativo; equivale a `open = true`). */
+    show(): void;
+    /** Cierra el drawer sin pasar por el gesto cancelable (azúcar imperativo). */
+    hide(): void;
+    private focusables;
+    private trapFocus;
+    private onScrimClick;
+    private onFooterSlotChange;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-drawer': OkDrawer;
+    }
+}

package/dist/components/ok-dropzone/ok-dropzone.d.ts

@@ -0,0 +1,48 @@
+import { LitElement } from 'lit';
+export interface OkDropzoneLabels {
+    /** Texto principal de la zona. Usa {browse} como ancla del enlace "selecciónalos". */
+    title: string;
+    /** Texto del enlace (la palabra resaltada dentro de `title`). */
+    browse: string;
+    /** Error de tipo no admitido. Variable: {name}. */
+    errorType: string;
+    /** Error de tamaño excedido. Variables: {name}, {size}. */
+    errorSize: string;
+    /** aria-label del botón de quitar un archivo. Variable: {name}. */
+    removeLabel: string;
+}
+export declare class OkDropzone extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Filtro de tipos aceptados (igual que el atributo `accept` nativo). Vacío = cualquiera. */
+    accept: string;
+    /** Permite seleccionar/soltar varios archivos. */
+    multiple: boolean;
+    /** Tamaño máximo por archivo en bytes (opcional). */
+    maxSize?: number;
+    /** Texto de ayuda mostrado bajo el icono. */
+    hint?: string;
+    /** Textos i18n (default inglés); pasa solo las claves que quieras sobreescribir. */
+    labels: Partial<OkDropzoneLabels>;
+    private get t();
+    private files;
+    private dragging;
+    private error;
+    private input;
+    private formatSize;
+    private matchesAccept;
+    private reportError;
+    private emitChange;
+    private ingest;
+    private removeAt;
+    private openPicker;
+    private onInputChange;
+    private onDragOver;
+    private onDragLeave;
+    private onDrop;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-dropzone': OkDropzone;
+    }
+}

package/dist/components/ok-empty-state/ok-empty-state.d.ts

@@ -0,0 +1,16 @@
+import { LitElement } from 'lit';
+export declare class OkEmptyState extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Nombre de un ion-icon (def 'file-tray-outline'). */
+    icon: string;
+    /** Título principal del estado vacío. */
+    heading?: string;
+    /** Mensaje secundario (muted). */
+    message?: string;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-empty-state': OkEmptyState;
+    }
+}

package/dist/components/ok-error-page/ok-error-page.d.ts

@@ -0,0 +1,77 @@
+import { LitElement } from 'lit';
+/** Variante de acento/color de la página. */
+export type OkErrorPageVariant = 'info' | 'warn' | 'danger';
+/** Modo de presentación: error HTTP normal o pantalla de arranque (health-check). */
+export type OkErrorPageMode = 'http' | 'bootstrap';
+/** Estado de una verificación de arranque. */
+export type OkErrorCheckStatus = 'ok' | 'fail' | 'pending';
+/** Tile de atajo (card-link) que aparece bajo el mensaje. */
+export interface OkErrorShortcut {
+    /** Texto principal del tile. */
+    title: string;
+    /** Descripción secundaria opcional. */
+    desc?: string;
+    /** Destino del enlace (si se omite, se renderiza como botón sin href). */
+    href?: string;
+    /** Nombre de icono Ionic opcional (ion-icon name). */
+    icon?: string;
+}
+/** Una verificación de salud en modo bootstrap. */
+export interface OkErrorCheck {
+    /** Nombre de la dependencia/comprobación. */
+    name: string;
+    /** Mensaje/detalle opcional. */
+    message?: string;
+    /** Estado de la comprobación. */
+    status?: OkErrorCheckStatus;
+    /** Tiempo/duración opcional (ej. "142 ms", "timeout"). */
+    time?: string;
+}
+export declare class OkErrorPage extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Código del error (ej. "404", "500", "403"). En bootstrap suele omitirse. */
+    code?: string;
+    /** Título destacado. (No opcional para no chocar con HTMLElement.title.) */
+    title: string;
+    /** Mensaje explicativo. */
+    message?: string;
+    /** Variante de acento. */
+    variant: OkErrorPageVariant;
+    /** Modo: error HTTP normal o pantalla de arranque (bootstrap). */
+    mode: OkErrorPageMode;
+    /** Tiles de atajo (home, soporte, estado…). */
+    shortcuts: OkErrorShortcut[];
+    /** Verificaciones de salud (solo modo bootstrap). */
+    checks: OkErrorCheck[];
+    /** Traza técnica opcional dentro del <details> colapsable. */
+    trace?: string;
+    /** Texto del summary del <details>. */
+    detailsLabel: string;
+    /** Línea de meta (trace id · timestamp) bajo todo. */
+    meta?: string;
+    /** Etiqueta antes de la cuenta atrás del reintento. */
+    retryLabel: string;
+    /** Segundos de la cuenta atrás de reintento. Si > 0 muestra el chip + barra. */
+    retrySeconds: number;
+    /** Segundos restantes (estado interno del temporizador). */
+    private remaining;
+    private timer?;
+    private initialSeconds;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private clearTimer;
+    private startCountdown;
+    private checkSvg;
+    private renderShortcuts;
+    private emitShortcut;
+    private renderChecks;
+    private renderRetry;
+    private renderIllu;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-error-page': OkErrorPage;
+    }
+}

package/dist/components/ok-event-card/ok-event-card.d.ts

@@ -0,0 +1,56 @@
+import { LitElement } from 'lit';
+/** Color de acento de la tarjeta de evento. */
+export type OkEventCardColor = 'brand' | 'leaf' | 'warn' | 'danger' | 'info';
+/** Tamaño de la tarjeta de evento. */
+export type OkEventCardSize = 'sm' | 'md' | 'lg';
+/** Asistente para la pila de avatares solapados. */
+export interface OkEventAttendee {
+    /** Nombre completo (se usa para iniciales y title). */
+    name?: string;
+    /** URL de imagen; si falta se muestran iniciales. */
+    avatar?: string;
+    /** Iniciales explícitas (si no, se derivan del nombre). */
+    initials?: string;
+}
+export declare class OkEventCard extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Título del evento. */
+    title: string;
+    /**
+     * Fecha del evento. Acepta un string ISO (YYYY-MM-DD…) o cualquier valor
+     * parseable por Date; de ahí se derivan el día y el mes del bloque de fecha.
+     * Si no se parsea, se usan `day`/`month` explícitos.
+     */
+    date?: string;
+    /** Día explícito (sobrescribe el derivado de `date`). */
+    day?: string;
+    /** Mes explícito en texto corto (sobrescribe el derivado de `date`). */
+    month?: string;
+    /** Hora o rango horario (texto libre, p.ej. "09:30 – 10:15"). */
+    time?: string;
+    /** Ubicación (texto libre). */
+    location?: string;
+    /** Color de acento. */
+    color: OkEventCardColor;
+    /** Tamaño de la tarjeta. */
+    size: OkEventCardSize;
+    /** Marca el evento como "en curso" (pulso animado). */
+    now: boolean;
+    /** Locale para formatear el mes derivado de `date` (por defecto el del navegador). */
+    locale?: string;
+    /** Máximo de avatares visibles antes de colapsar en "+N". */
+    maxAvatars: number;
+    /** Asistentes para la pila de avatares solapados. */
+    attendees: OkEventAttendee[];
+    /** Devuelve {day, month} a mostrar, derivando de `date` si hace falta. */
+    private resolveDate;
+    /** Iniciales (máx. 2) a partir del nombre. */
+    private initialsOf;
+    private renderAvatars;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-event-card': OkEventCard;
+    }
+}

package/dist/components/ok-feature-card/ok-feature-card.d.ts

@@ -0,0 +1,23 @@
+import { LitElement } from 'lit';
+export declare class OkFeatureCard extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Icono (nombre iconify, p.ej. "lucide:box"). Para img/otro usa slot="icon". */
+    icon?: string;
+    /** Eyebrow opcional (numeración, categoría…). */
+    eyebrow?: string;
+    /** Título de la característica. */
+    heading?: string;
+    /** Si se pasa, la tarjeta entera es un enlace. */
+    href?: string;
+    /** Cristal esmerilado. */
+    glass: boolean;
+    /** "lucide:box" → "https://api.iconify.design/lucide/box.svg" (prefijo:nombre → prefijo/nombre). */
+    private iconUrl;
+    private inner;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-feature-card': OkFeatureCard;
+    }
+}

package/dist/components/ok-file-item/ok-file-item.d.ts

@@ -0,0 +1,31 @@
+import { LitElement } from 'lit';
+/** Estado de la fila de archivo. */
+export type OkFileItemState = 'done' | 'uploading' | 'error';
+export declare class OkFileItem extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Nombre del archivo (se elipsa si no cabe). */
+    name: string;
+    /** Tamaño legible ya formateado (p.ej. "2,4 MB"). */
+    size?: string;
+    /** Extensión/tipo: pdf, xls, img, zip… → badge tintado. */
+    ext: string;
+    /** Progreso 0–100, mostrado mientras sube. */
+    progress: number;
+    /** Estado de la fila. */
+    state: OkFileItemState;
+    /** Texto de error opcional (sustituye a la meta cuando state="error"). */
+    error?: string;
+    /** Muestra el botón de quitar/cancelar. */
+    removable: boolean;
+    /** Normaliza la extensión a una de las variantes tintadas conocidas. */
+    private variant;
+    /** Etiqueta corta para el badge (máx 4 chars). */
+    private badgeLabel;
+    private onRemove;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-file-item': OkFileItem;
+    }
+}

package/dist/components/ok-file-manager/ok-file-manager.d.ts

@@ -0,0 +1,145 @@
+import { LitElement } from 'lit';
+/** Carpeta del árbol lateral (recursiva). La aporta el host vía `.folders`. */
+export interface OkFmFolder {
+    /** Identificador único de la carpeta (clave de navegación/selección). */
+    id: string;
+    /** Texto visible de la carpeta. */
+    label: string;
+    /** Nombre de un ionicon opcional, mostrado antes del label. */
+    icon?: string;
+    /** Recuento de elementos, alineado a la derecha en la fila. */
+    count?: number;
+    /** Sub-carpetas; si las hay, se dibuja el caret expandible. */
+    children?: OkFmFolder[];
+}
+/** Archivo del contenido de la carpeta actual. Lo aporta el host vía `.files`. */
+export interface OkFmFile {
+    /** Identificador único del archivo. */
+    id: string;
+    /** Nombre del archivo (se elipsa si no cabe). */
+    name: string;
+    /** Extensión/tipo (pdf, xls, png…) → badge tintado. Si falta, se deriva del nombre. */
+    ext?: string;
+    /** Etiqueta de categoría opcional (no usada para el color; informativa). */
+    kind?: string;
+    /** Tamaño ya formateado y legible (p.ej. "218 KB"). */
+    sizeLabel?: string;
+    /** Fecha de modificación ya formateada (p.ej. "2026-05-08 09:14"). */
+    modified?: string;
+    /** URL de descarga/abrir opcional (se pasa en `ok-download`). */
+    url?: string;
+    /** URL de miniatura opcional (imágenes); si está, se muestra en lugar del icono. */
+    thumb?: string;
+}
+/** Migaja del breadcrumb (de raíz a carpeta actual). */
+export interface OkFmCrumb {
+    /** Id de la carpeta a la que navega al hacer click. */
+    id: string;
+    /** Texto visible de la migaja. */
+    label: string;
+}
+/** Medidor de espacio de almacenamiento (bajo el árbol). */
+export interface OkFmQuota {
+    /** Etiqueta del espacio usado (p.ej. "1,8 GB usados"). */
+    usedLabel: string;
+    /** Etiqueta del espacio total (p.ej. "5 GB"). Opcional: ausente ⇒ modo "sin límite". */
+    totalLabel?: string;
+    /** Fracción ocupada 0–1 (ancho de la barra). Ignorada en modo "sin límite". */
+    fraction?: number;
+    /** Sin cuota dura (p.ej. bucket S3 por hub): muestra solo lo usado, sin barra. */
+    unlimited?: boolean;
+}
+/** Modo de visualización del área de archivos. */
+export type OkFmView = 'grid' | 'list';
+/** Textos i18n del componente (defaults en español). */
+export interface OkFmLabels {
+    /** Botón primario de subida. */
+    upload: string;
+    /** Botón de importar. */
+    import: string;
+    /** Placeholder del buscador. */
+    search: string;
+    /** Eyebrow del árbol de carpetas. */
+    folders: string;
+    /** Eyebrow del medidor de espacio. */
+    space: string;
+    /** Estado vacío (sin archivos). */
+    empty: string;
+    /** Acción de fila: descargar. */
+    download: string;
+    /** Acción de fila: eliminar. */
+    delete: string;
+    /** Acción de fila: abrir. */
+    open: string;
+    /** Botón de nueva carpeta. */
+    newFolder: string;
+    /** Caption del medidor cuando no hay cuota dura. */
+    noLimit: string;
+}
+export declare class OkFileManager extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Árbol de carpetas (recursivo vía `children`). */
+    folders: OkFmFolder[];
+    /** Contenido de la carpeta actual. */
+    files: OkFmFile[];
+    /** Breadcrumb de raíz a carpeta actual. */
+    path: OkFmCrumb[];
+    /** Id de la carpeta activa/seleccionada. */
+    selected: string;
+    /** Modo de visualización del área de archivos. */
+    view: OkFmView;
+    /** Medidor de espacio opcional bajo el árbol. */
+    quota?: OkFmQuota;
+    /** Título opcional sobre la toolbar (informativo). Vacío = sin título. */
+    title: string;
+    /** Muestra el buscador en la toolbar. */
+    searchable: boolean;
+    /** Muestra el botón primario de subida y habilita drag&drop. */
+    uploadable: boolean;
+    /** Muestra esqueletos de carga en lugar del contenido. */
+    loading: boolean;
+    /** Textos i18n (merge sobre los defaults en español). */
+    labels: Partial<OkFmLabels>;
+    private get t();
+    private expandedIds;
+    private dragging;
+    private seeded;
+    private fileInput;
+    private searchTimer?;
+    private seedExpanded;
+    private emit;
+    private navigate;
+    private open;
+    private download;
+    private deleteFile;
+    private createFolder;
+    private changeView;
+    private onSearch;
+    private openPicker;
+    private onPicked;
+    private toggle;
+    private onDragOver;
+    private onDragLeave;
+    private onDrop;
+    private extOf;
+    private variant;
+    private badgeLabel;
+    private renderBadge;
+    private renderFolder;
+    private flatFolders;
+    private renderQuota;
+    private renderToolbar;
+    private get iconOpen();
+    private get iconDownload();
+    private get iconDelete();
+    private fileActions;
+    private renderContent;
+    private renderGrid;
+    private renderList;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-file-manager': OkFileManager;
+    }
+}

package/dist/components/ok-footer/ok-footer.d.ts

@@ -0,0 +1,10 @@
+import { LitElement } from 'lit';
+export declare class OkFooter extends LitElement {
+    static styles: import("lit").CSSResult;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-footer': OkFooter;
+    }
+}

package/dist/components/ok-funnel/ok-funnel.d.ts

@@ -0,0 +1,31 @@
+import { LitElement } from 'lit';
+/** Variante de color de una barra del embudo. */
+export type OkFunnelColor = 'brand' | 'leaf' | 'warn' | 'mute';
+/** Un paso/etapa del embudo de conversión. */
+export interface OkFunnelStep {
+    /** Etiqueta visible dentro de la barra. */
+    label: string;
+    /** Valor absoluto de la etapa (usado para anchura y meta). */
+    value: number;
+    /** Variante de color opcional. */
+    color?: OkFunnelColor;
+}
+export declare class OkFunnel extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Pasos del embudo (de mayor a menor por convención). */
+    steps: OkFunnelStep[];
+    /** Locale para formatear números (default: del navegador). */
+    locale?: string;
+    /** Anchura mínima de barra en % para que la etiqueta siga siendo legible. */
+    minWidth: number;
+    /** Formatea un número absoluto con separadores de miles. */
+    private fmtCount;
+    /** Formatea un porcentaje con un decimal. */
+    private fmtPct;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-funnel': OkFunnel;
+    }
+}

package/dist/components/ok-gallery/ok-gallery.d.ts

@@ -0,0 +1,34 @@
+import { LitElement } from 'lit';
+export interface OkGalleryImage {
+    /** URL de la imagen. Si se omite, se pinta el placeholder de rayas diagonales. */
+    src?: string;
+    /** Texto alternativo (accesibilidad). */
+    alt?: string;
+    /** Etiqueta opcional: caption inferior al hover y texto del placeholder. */
+    label?: string;
+    /** Id estable opcional. Si falta, se usa el índice como clave de selección. */
+    id?: string | number;
+}
+export declare class OkGallery extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Imágenes del grid (declarativas). */
+    images: OkGalleryImage[];
+    /** Activa el modo selección (badge + toggle por click). */
+    selectable: boolean;
+    /** Ids (o índices) actualmente seleccionados. */
+    selected: Array<string | number>;
+    /** Ancho mínimo del item para el auto-fill (px). */
+    minSize: number;
+    /** Fuerza un número fijo de columnas (0 = auto-fill por min-size). */
+    columns: number;
+    private keyOf;
+    private isSelected;
+    private toggle;
+    private open;
+    render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ok-gallery': OkGallery;
+    }
+}