@reservi/preact 2.0.0-beta.0 → 2.0.0-beta.2

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import { CalendarApi } from '@reservi/core';
 import { CalendarOptions } from '@reservi/core';
+import { CalendarViewAdapter } from '@reservi/core';
 import { ComponentChildren } from 'preact';
 import { DayGridModel } from '@reservi/core';
 import { dayGridPlugin } from '@reservi/core';
@@ -8,6 +9,7 @@ import { defineTheme } from '@reservi/core';
 import { EventDef } from '@reservi/core';
 import { EventInput } from '@reservi/core';
 import { eventsToICS } from '@reservi/core';
+import { KeyboardAction } from '@reservi/core';
 import { ListModel } from '@reservi/core';
 import { listPlugin } from '@reservi/core';
 import { MultiMonthModel } from '@reservi/core';
@@ -39,15 +41,25 @@ declare interface CalendarProps {
     options: ReserviCalendarOptions;
 }
 
+export { CalendarViewAdapter }
+
+export declare function callDidMount<Arg extends {
+    el: HTMLElement;
+}>(el: Element | null, hook: ((arg: Arg) => void) | undefined, buildArg: () => Omit<Arg, "el">): void;
+
 /** Une clases base con las del usuario (filtra vacíos). */
 export declare function cx(...classes: (string | undefined | false)[]): string;
 
+/** Formateador de fecha para cabeceras; `false` significa "sin texto". */
+export declare function dateFormatter(locale: string, options: Intl.DateTimeFormatOptions | false | undefined, fallback: Intl.DateTimeFormatOptions): ((date: Date) => string) | null;
+
 /** Argumento del slot de celda de día. */
 export declare interface DayCellContentArg {
     date: Date;
     dayNumber: number;
     isToday: boolean;
     isOther: boolean;
+    view: ViewArg;
 }
 
 export { dayGridPlugin }
@@ -65,6 +77,12 @@ declare interface DayGridViewProps {
 export declare interface DayHeaderContentArg {
     date: Date;
     text: string;
+    /** Día de la semana, 0 = domingo … 6 = sábado. */
+    dayOfWeek: number;
+    /** Día del mes (1–31). */
+    dayNumber: number;
+    isToday: boolean;
+    view: ViewArg;
 }
 
 export { definePlugin }
@@ -85,6 +103,13 @@ declare interface DragOptions {
     snap?: string | undefined;
     /** Si se indica, redimensiona por ese borde; si no, mueve el evento. */
     edge?: ResizeEdge | undefined;
+    /**
+     * Se llama en cada movimiento con el rango destino (minutos absolutos del
+     * dia), y con `null` al soltar. Sirve para pintar el fantasma que indica
+     * donde va a caer el evento; sin esto la tarjeta se queda quieta y salta a su
+     * nueva posicion solo al soltar.
+     */
+    onPreview?: ((range: RangePreview | null) => void) | undefined;
 }
 
 /** Argumento del slot de contenido de evento. */
@@ -93,6 +118,7 @@ export declare interface EventContentArg {
     isAllDay: boolean;
     /** Texto de hora ya formateado (vacío si allDay). */
     timeText: string;
+    view: ViewArg;
 }
 
 export { EventDef }
@@ -105,11 +131,43 @@ export declare type GridKind = "dayGrid" | "timeGrid";
 
 export declare function handleEventKeydown(e: KeyboardEvent, opts: KeydownOptions): void;
 
+/**
+ * Puente para pintar contenido del framework anfitrión dentro del árbol de
+ * Preact. Lo implementan los wrappers (p. ej. `@reservi/react` con portales).
+ */
+export declare interface HostBridge {
+    /** Un hueco ha entrado en el DOM: pinta `node` dentro de `el`. */
+    mount(id: string, el: HTMLElement, node: unknown): void;
+    /** El contenido del hueco `id` ha cambiado. */
+    update(id: string, node: unknown): void;
+    /** El hueco `id` ha salido del DOM: libera lo que se pintó en él. */
+    unmount(id: string): void;
+}
+
+/** Crea el marcador de contenido delegado al framework anfitrión. */
+export declare function hostSlot(node: unknown): HostSlotResult;
+
+/**
+ * Marcador que puede devolver un slot cuando el contenido lo pinta el
+ * framework anfitrión (React, Vue…). La capa Preact NO interpreta `node`:
+ * solo reserva un hueco en el DOM y delega en el `hostBridge`.
+ */
+export declare interface HostSlotResult {
+    readonly __rsvHost: true;
+    /** Nodo del framework anfitrión (opaco para esta capa). */
+    readonly node: unknown;
+}
+
+/** ¿El resultado de un slot delega el render en el anfitrión? */
+export declare function isHostSlot(value: unknown): value is HostSlotResult;
+
 declare interface KeydownOptions {
     api: CalendarApi;
     event: EventDef;
     kind: GridKind;
     snap?: string | undefined;
+    /** Override de atajos (se mergea sobre `DEFAULT_SHORTCUTS` por acción). */
+    shortcuts?: Partial<Record<KeyboardAction, string[]>> | undefined;
 }
 
 export { listPlugin }
@@ -123,6 +181,21 @@ declare interface ListViewProps {
     options: ReserviCalendarOptions;
 }
 
+/** "HH:mm" a partir de minutos desde medianoche. */
+export declare function minutesToLabel(minutes: number): string;
+
+/** "HH:mm:ss" a partir de minutos desde medianoche (sin envolver a 24h). */
+export declare function minutesToTimeString(minutes: number): string;
+
+/** Argumento del slot del botón "+N more" (popover de eventos ocultos). */
+export declare interface MoreLinkContentArg {
+    date: Date;
+    moreCount: number;
+    allEvents: EventDef[];
+    hiddenEvents: EventDef[];
+    view: ViewArg;
+}
+
 /**
  * Monta un calendario Reservi en un elemento del DOM. API agnóstica usada
  * directamente (vanilla/Preact) y por los wrappers de framework.
@@ -154,12 +227,22 @@ declare interface Props_2 {
     options: ReserviCalendarOptions;
 }
 
+/** Rango en curso (minutos absolutos del dia) para dibujar el `selectMirror`. */
+export declare interface RangePreview {
+    startMin: number;
+    endMin: number;
+}
+
 /**
  * Resuelve un slot de contenido: si el usuario aportó una función, usa su
  * resultado; si no, usa el contenido por defecto. Unifica el contrato de los
  * render hooks para todos los frameworks (en wrappers se adapta a su idioma).
+ *
+ * Si el slot devuelve `hostSlot(node)`, se reserva un hueco en el DOM y el
+ * `bridge` del framework anfitrión pinta el contenido dentro (React usa
+ * portales). Sin bridge se cae al contenido por defecto.
  */
-export declare function renderSlot<Arg>(slot: ((arg: Arg) => SlotResult) | undefined, arg: Arg, fallback: ComponentChildren): ComponentChildren;
+export declare function renderSlot<Arg>(slot: ((arg: Arg) => SlotResult) | undefined, arg: Arg, fallback: ComponentChildren, bridge?: HostBridge | undefined): ComponentChildren;
 
 export declare interface ReserviCalendarHandle {
     /** API del calendario (navegación, eventos, callbacks). */
@@ -171,7 +254,13 @@ export declare interface ReserviCalendarHandle {
 /** Opciones de la capa Preact = opciones de núcleo + presentación. */
 export declare interface ReserviCalendarOptions extends CalendarOptions {
     slots?: ReserviSlots;
+    hooks?: ReserviHooks;
     classNames?: ReserviClassNames;
+    /**
+     * Puente de render del framework anfitrión. Lo inyecta el wrapper; no es
+     * necesario configurarlo a mano en uso vanilla/Preact.
+     */
+    hostBridge?: HostBridge;
     /**
      * Vistas a mostrar como pestañas en la segunda fila de la toolbar
      * (p. ej. ["dayGridMonth", "timeGridWeek", "listWeek"]). Si se omite, se
@@ -185,19 +274,52 @@ export declare interface ReserviCalendarOptions extends CalendarOptions {
     onAddClick?: () => void;
     /** Texto del botón "Añadir" (def. "+" sin etiqueta). */
     addButtonText?: string;
+    /**
+     * Cambia de vista automáticamente al redimensionar el contenedor (p. ej.
+     * mes → lista en mobile). Se evalúa el `breakpoint` más alto que sea
+     * `<= ancho actual` (estilo media query `min-width`).
+     */
+    responsiveViews?: {
+        breakpoint: number;
+        view: string;
+    }[];
 }
 
 /** Clases por slot, fusionadas con las base. */
 export declare interface ReserviClassNames {
     root?: string;
     toolbar?: string;
+    /** Celda de día (dayGrid/multiMonth). */
     day?: string;
     event?: string;
+    /** Cabecera de día (nombre del día / columna). */
+    dayHeader?: string;
+    /** Etiqueta del eje horario (timeGrid). */
+    slotLabel?: string;
+}
+
+/**
+ * Hooks de ciclo de vida sobre el DOM ya montado (equivalentes a los
+ * `*DidMount` de FullCalendar). Se invocan UNA vez por elemento del DOM.
+ */
+export declare interface ReserviHooks {
+    eventDidMount?: (arg: EventContentArg & {
+        el: HTMLElement;
+    }) => void;
+    dayCellDidMount?: (arg: DayCellContentArg & {
+        el: HTMLElement;
+    }) => void;
+    dayHeaderDidMount?: (arg: DayHeaderContentArg & {
+        el: HTMLElement;
+    }) => void;
+    slotLabelDidMount?: (arg: SlotLabelContentArg & {
+        el: HTMLElement;
+    }) => void;
 }
 
 /**
- * Slots de render (patrón de "content" de FullCalendar). En fases posteriores
- * se añaden los hooks *DidMount/*WillUnmount y el resto de elementos (PARITY §11).
+ * Slots de render (patrón de "content" de FullCalendar). Cada slot devuelve
+ * contenido Preact, una cadena, o `hostSlot(...)` para delegar en el anfitrión.
  */
 export declare interface ReserviSlots {
     eventContent?: (arg: EventContentArg) => SlotResult;
@@ -205,6 +327,12 @@ export declare interface ReserviSlots {
     dayHeaderContent?: (arg: DayHeaderContentArg) => SlotResult;
     /** Personaliza la etiqueta del eje horario (timeGrid). */
     slotLabelContent?: (arg: SlotLabelContentArg) => SlotResult;
+    /**
+     * Personaliza el contenido del botón "+N more" (dayGrid/multiMonth). El
+     * `<button>` que abre el popover se conserva; el slot solo reemplaza su
+     * contenido interno (mismo patrón que `dayCellContent`).
+     */
+    moreLinkContent?: (arg: MoreLinkContentArg) => SlotResult;
     /**
      * Contenido libre al inicio de la toolbar (zona "Filtrar/Personal" del diseño).
      * El usuario decide qué botones poner y qué hacen; si no se define, no se
@@ -247,14 +375,21 @@ export declare interface SlotLabelContentArg {
     minutes: number;
     /** Si es una marca mayor (etiquetada). */
     isMajor: boolean;
+    view: ViewArg;
 }
 
-export declare type SlotResult = ComponentChildren | string;
+export declare type SlotResult = ComponentChildren | string | HostSlotResult;
 
 export declare function startEventDrag(ev: PointerEvent, options: DragOptions): void;
 
 export { themeToStyle }
 
+/**
+ * Formateador de hora: usa `Intl` si hay opciones, y si no el 24h por defecto
+ * que ya produce el núcleo. Devuelve null si no hay que sobreescribir nada.
+ */
+export declare function timeFormatter(locale: string, options: Intl.DateTimeFormatOptions | undefined): ((date: Date) => string) | null;
+
 export { timeGridPlugin }
 
 /** Vista con eje temporal vertical (semana/día). */
@@ -296,4 +431,9 @@ declare interface ToolbarProps {
     options: ReserviCalendarOptions;
 }
 
+/** Vista activa tal como la reciben los slots y los hooks `*DidMount`. */
+export declare interface ViewArg {
+    readonly type: string;
+}
+
 export { }