@zengrid/core 1.0.7 → 1.1.0

package/dist/src/rendering/renderers/chip/chip-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip-renderer.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/chip/chip-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAExE;;GAEG;AACH,MAAM,WAAW,IAAI;IACnB,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,GAAG,CAAC;CACZ;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC;;;OAGG;IACH,KAAK,CAAC,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,EAAE,CAAC,CAAC;IACpD;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IACtD;;;;OAIG;IACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IACrD;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,QAAQ,CAAC;IAC9C;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,qBAAa,YAAa,YAAW,YAAY;IAC/C,OAAO,CAAC,OAAO,CAWO;IACtB,OAAO,CAAC,aAAa,CAGnB;IAEF;;;;OAIG;gBACS,OAAO,GAAE,mBAAwB;IAc7C;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAkBxD;;;OAGG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IA2ExD;;OAEG;IACH,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IASnC;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;IAkBtD;;OAEG;IACH,OAAO,CAAC,QAAQ;IAahB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IA8GzB;;OAEG;IACH,OAAO,CAAC,qBAAqB;IAwB7B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAU1B;;OAEG;IACH,OAAO,CAAC,cAAc;IAYtB;;OAEG;IACH,OAAO,CAAC,eAAe;CAWxB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,mBAAwB,GAAG,YAAY,CAElF"}

package/dist/src/rendering/renderers/chip/index.d.ts

@@ -0,0 +1,3 @@
+export { ChipRenderer, createChipRenderer } from './chip-renderer';
+export type { ChipRendererOptions, Chip } from './chip-renderer';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/rendering/renderers/chip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/src/rendering/renderers/date/date-renderer.d.ts

@@ -0,0 +1,156 @@
+import type { CellRenderer, RenderParams } from '../renderer.interface';
+/**
+ * Supported date format patterns
+ */
+export type DateFormat = 'MM/DD/YYYY' | 'DD/MM/YYYY' | 'YYYY-MM-DD' | 'DD-MM-YYYY' | 'MM-DD-YYYY' | 'YYYY/MM/DD' | 'locale';
+/**
+ * Configuration options for DateRenderer
+ */
+export interface DateRendererOptions {
+    /** Date format pattern (default: 'MM/DD/YYYY') */
+    format?: DateFormat;
+    /** Locale string for date formatting (e.g., 'en-US', 'de-DE') */
+    locale?: string;
+    /** Minimum allowed date */
+    minDate?: Date;
+    /** Maximum allowed date */
+    maxDate?: Date;
+    /** Show calendar icon */
+    showCalendar?: boolean;
+    /** Custom CSS class for the date element */
+    className?: string;
+    /** Display format for invalid dates */
+    invalidDateText?: string;
+    /** Display format for null/undefined values */
+    emptyDateText?: string;
+    /** Time zone for date formatting */
+    timeZone?: string;
+    /** Callback when date is clicked */
+    onClick?: (date: Date | null, params: RenderParams) => void;
+}
+/**
+ * DateRenderer - Renders formatted dates with locale support
+ *
+ * Features:
+ * - Multiple date format patterns (MM/DD/YYYY, DD/MM/YYYY, etc.)
+ * - Locale-aware formatting using Intl.DateTimeFormat
+ * - Min/max date validation with visual indicators
+ * - LRU cache for formatters and formatted strings (performance optimization)
+ * - Time zone support
+ * - Calendar icon (optional)
+ * - ARIA attributes for accessibility
+ * - Invalid date handling
+ * - Out-of-range date highlighting
+ *
+ * Performance: Uses dual LRU cache system to avoid re-formatting the same dates
+ * - formatterCache: Caches Intl.DateTimeFormat instances (50 items)
+ * - dateStringCache: Caches formatted date strings (500 items)
+ *
+ * @example
+ * ```typescript
+ * // Basic usage
+ * const renderer = new DateRenderer({
+ *   format: 'MM/DD/YYYY',
+ *   locale: 'en-US'
+ * });
+ *
+ * // With date range validation
+ * const renderer = new DateRenderer({
+ *   format: 'DD/MM/YYYY',
+ *   locale: 'en-GB',
+ *   minDate: new Date('2020-01-01'),
+ *   maxDate: new Date('2030-12-31')
+ * });
+ *
+ * // With locale formatting and timezone
+ * const renderer = new DateRenderer({
+ *   format: 'locale',
+ *   locale: 'de-DE',
+ *   timeZone: 'Europe/Berlin',
+ *   showCalendar: true
+ * });
+ * ```
+ */
+export declare class DateRenderer implements CellRenderer {
+    private options;
+    private formatterCache;
+    private dateStringCache;
+    private eventHandlers;
+    /**
+     * Creates a new DateRenderer instance
+     *
+     * Uses LRUCache for caching Intl.DateTimeFormat instances and formatted strings
+     * This significantly improves performance when rendering many dates
+     */
+    constructor(options?: DateRendererOptions);
+    /**
+     * Initial render - creates date display structure
+     */
+    render(element: HTMLElement, params: RenderParams): void;
+    /**
+     * Update existing date - called on value/state changes
+     * Optimized for performance during scrolling
+     */
+    update(element: HTMLElement, params: RenderParams): void;
+    /**
+     * Cleanup before element returns to pool
+     */
+    destroy(element: HTMLElement): void;
+    /**
+     * Optional: Return CSS class based on date validity
+     */
+    getCellClass(params: RenderParams): string | undefined;
+    /**
+     * Parse value into a Date object
+     */
+    private parseDate;
+    /**
+     * Format date according to the configured format and locale
+     *
+     * Uses LRU cache to avoid re-formatting the same dates
+     */
+    private formatDate;
+    /**
+     * Format date using Intl.DateTimeFormat (locale-aware)
+     */
+    private formatWithLocale;
+    /**
+     * Format date using a specific pattern
+     */
+    private formatWithPattern;
+    /**
+     * Check if date is within the configured min/max range
+     */
+    private isDateInRange;
+    /**
+     * Create calendar icon element
+     */
+    private createCalendarIcon;
+    /**
+     * Set ARIA attributes for accessibility
+     */
+    private setAriaAttributes;
+}
+/**
+ * Factory function to create DateRenderer
+ *
+ * @example
+ * ```typescript
+ * // In column definition
+ * const column = {
+ *   field: 'createdAt',
+ *   header: 'Created Date',
+ *   renderer: 'date', // Registered name
+ * };
+ *
+ * // Or create directly
+ * const renderer = createDateRenderer({
+ *   format: 'DD/MM/YYYY',
+ *   locale: 'en-GB',
+ *   minDate: new Date('2020-01-01'),
+ *   maxDate: new Date('2030-12-31')
+ * });
+ * ```
+ */
+export declare function createDateRenderer(options?: DateRendererOptions): DateRenderer;
+//# sourceMappingURL=date-renderer.d.ts.map

package/dist/src/rendering/renderers/date/date-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-renderer.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/date/date-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAGxE;;GAEG;AACH,MAAM,MAAM,UAAU,GAClB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,QAAQ,CAAC;AAEb;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,kDAAkD;IAClD,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,2BAA2B;IAC3B,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,yBAAyB;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,+CAA+C;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;CAC7D;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBAAa,YAAa,YAAW,YAAY;IAC/C,OAAO,CAAC,OAAO,CAGb;IACF,OAAO,CAAC,cAAc,CAA8C;IACpE,OAAO,CAAC,eAAe,CAAiC;IACxD,OAAO,CAAC,aAAa,CAAuC;IAE5D;;;;;OAKG;gBACS,OAAO,GAAE,mBAAwB;IAwB7C;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAoCxD;;;OAGG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAuCxD;;OAEG;IACH,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAgBnC;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;IActD;;OAEG;IACH,OAAO,CAAC,SAAS;IAmBjB;;;;OAIG;IACH,OAAO,CAAC,UAAU;IA2BlB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAiBxB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAuBzB;;OAEG;IACH,OAAO,CAAC,aAAa;IAQrB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAQ1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;CAkB1B;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,mBAAwB,GAAG,YAAY,CAElF"}

package/dist/src/rendering/renderers/date/index.d.ts

@@ -0,0 +1,3 @@
+export { DateRenderer, createDateRenderer } from './date-renderer';
+export type { DateRendererOptions, DateFormat } from './date-renderer';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/rendering/renderers/date/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/date/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/src/rendering/renderers/date-range/date-range-renderer.d.ts

@@ -0,0 +1,128 @@
+import type { CellRenderer, RenderParams } from '../renderer.interface';
+/**
+ * Date range value type
+ */
+export interface DateRange {
+    start: Date | null;
+    end: Date | null;
+}
+/**
+ * Supported date format patterns
+ */
+export type DateFormat = 'MM/DD/YYYY' | 'DD/MM/YYYY' | 'YYYY-MM-DD' | 'DD-MM-YYYY' | 'MM-DD-YYYY' | 'YYYY/MM/DD' | 'locale';
+/**
+ * Configuration options for DateRangeRenderer
+ */
+export interface DateRangeRendererOptions {
+    /** Date format pattern (default: 'MM/DD/YYYY') */
+    format?: DateFormat;
+    /** Locale string for date formatting (e.g., 'en-US', 'de-DE') */
+    locale?: string;
+    /** Separator between start and end dates (default: ' - ') */
+    separator?: string;
+    /** Show calendar icon */
+    showCalendar?: boolean;
+    /** Show duration in days */
+    showDuration?: boolean;
+    /** Custom CSS class for the date range element */
+    className?: string;
+    /** Display format for invalid dates */
+    invalidDateText?: string;
+    /** Display format for null/undefined values */
+    emptyDateText?: string;
+    /** Time zone for date formatting */
+    timeZone?: string;
+    /** Callback when date range is clicked */
+    onClick?: (range: DateRange | null, params: RenderParams) => void;
+    /** Color for start date */
+    startColor?: string;
+    /** Color for end date */
+    endColor?: string;
+    /** Show as chips/badges */
+    chipStyle?: boolean;
+}
+/**
+ * DateRangeRenderer - Renders formatted date ranges with visual styling
+ *
+ * Features:
+ * - Multiple date format patterns
+ * - Locale-aware formatting
+ * - Visual separation between start and end dates
+ * - Duration calculation and display
+ * - LRU cache for performance
+ * - Chip/badge styling option
+ * - ARIA attributes for accessibility
+ *
+ * @example
+ * ```typescript
+ * const renderer = new DateRangeRenderer({
+ *   format: 'DD/MM/YYYY',
+ *   showDuration: true,
+ *   chipStyle: true
+ * });
+ * ```
+ */
+export declare class DateRangeRenderer implements CellRenderer {
+    private options;
+    private formatterCache;
+    private dateStringCache;
+    private eventHandlers;
+    constructor(options?: DateRangeRendererOptions);
+    /**
+     * Initial render - creates date range display structure
+     */
+    render(element: HTMLElement, params: RenderParams): void;
+    /**
+     * Update existing date range - called on value/state changes
+     */
+    update(element: HTMLElement, params: RenderParams): void;
+    /**
+     * Cleanup before element returns to pool
+     */
+    destroy(element: HTMLElement): void;
+    /**
+     * Optional: Return CSS class based on date range validity
+     */
+    getCellClass(params: RenderParams): string | undefined;
+    /**
+     * Parse value into a DateRange object
+     */
+    private parseRange;
+    /**
+     * Parse value into a Date object
+     */
+    private parseDate;
+    /**
+     * Format date according to the configured format and locale
+     */
+    private formatDate;
+    /**
+     * Format date using Intl.DateTimeFormat (locale-aware)
+     */
+    private formatWithLocale;
+    /**
+     * Format date using a specific pattern
+     */
+    private formatWithPattern;
+    /**
+     * Calculate duration in days between two dates
+     */
+    private calculateDuration;
+    /**
+     * Apply chip/badge styles to date elements
+     */
+    private applyChipStyles;
+    /**
+     * Create calendar icon element
+     */
+    private createCalendarIcon;
+    /**
+     * Set ARIA attributes for accessibility
+     */
+    private setAriaAttributes;
+}
+/**
+ * Factory function to create DateRangeRenderer
+ */
+export declare function createDateRangeRenderer(options?: DateRangeRendererOptions): DateRangeRenderer;
+//# sourceMappingURL=date-range-renderer.d.ts.map

package/dist/src/rendering/renderers/date-range/date-range-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-renderer.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/date-range/date-range-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAGxE;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,MAAM,UAAU,GAClB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,QAAQ,CAAC;AAEb;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC,kDAAkD;IAClD,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yBAAyB;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4BAA4B;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,+CAA+C;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAClE,2BAA2B;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,qBAAa,iBAAkB,YAAW,YAAY;IACpD,OAAO,CAAC,OAAO,CAOb;IACF,OAAO,CAAC,cAAc,CAA8C;IACpE,OAAO,CAAC,eAAe,CAAiC;IACxD,OAAO,CAAC,aAAa,CAAuC;gBAEhD,OAAO,GAAE,wBAA6B;IAsBlD;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAwExD;;OAEG;IACH,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAgFxD;;OAEG;IACH,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAcnC;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;IAkBtD;;OAEG;IACH,OAAO,CAAC,UAAU;IAelB;;OAEG;IACH,OAAO,CAAC,SAAS;IAiBjB;;OAEG;IACH,OAAO,CAAC,UAAU;IA2BlB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAiBxB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAuBzB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAKzB;;OAEG;IACH,OAAO,CAAC,eAAe;IA2BvB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAS1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;CA2C1B;AAED;;GAEG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,GAAE,wBAA6B,GAAG,iBAAiB,CAEjG"}

package/dist/src/rendering/renderers/date-range/index.d.ts

@@ -0,0 +1,3 @@
+export { DateRangeRenderer, createDateRangeRenderer } from './date-range-renderer';
+export type { DateRangeRendererOptions, DateRange, DateFormat } from './date-range-renderer';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/rendering/renderers/date-range/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/date-range/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AACnF,YAAY,EAAE,wBAAwB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/src/rendering/renderers/datetime/date-picker/date-picker-renderer.d.ts

@@ -0,0 +1,55 @@
+/**
+ * DatePickerRenderer - Interactive date picker with calendar popup
+ *
+ * Uses the new datetime-core infrastructure for:
+ * - Reliable click-outside detection (fixes popup not closing)
+ * - Unified scroll handling (fixes scroll UI bugs)
+ * - CSS variable theming (easy customization)
+ * - Keyboard navigation
+ */
+import type { CellRenderer, RenderParams } from '../../renderer.interface';
+import type { DatePickerRendererOptions } from './types';
+/**
+ * DatePickerRenderer - Renders an interactive date picker with calendar popup
+ *
+ * Key improvements over previous version:
+ * - Reliable click-outside detection (handles body-appended calendars)
+ * - Proper scroll handling (all ancestors + window)
+ * - GPU-accelerated popup positioning with transform
+ * - CSS variable theming
+ * - Clean separation of concerns
+ *
+ * @example
+ * ```typescript
+ * const renderer = new DatePickerRenderer({
+ *   format: 'DD/MM/YYYY',
+ *   placeholder: 'Select date...',
+ *   theme: 'dark',
+ *   onChange: (value, params) => {
+ *     console.log('Date changed to:', value);
+ *   }
+ * });
+ * ```
+ */
+export declare class DatePickerRenderer implements CellRenderer {
+    private options;
+    private instances;
+    private popupManager;
+    constructor(options?: DatePickerRendererOptions);
+    private resolveOptions;
+    render(element: HTMLElement, params: RenderParams): void;
+    private setupEventHandlers;
+    private openPopup;
+    private closePopup;
+    private initializeCalendar;
+    private updateCalendarSelection;
+    private handleDateSelect;
+    update(element: HTMLElement, params: RenderParams): void;
+    destroy(element: HTMLElement): void;
+    getCellClass(params: RenderParams): string | undefined;
+}
+/**
+ * Factory function to create DatePickerRenderer
+ */
+export declare function createDatePickerRenderer(options?: DatePickerRendererOptions): DatePickerRenderer;
+//# sourceMappingURL=date-picker-renderer.d.ts.map

package/dist/src/rendering/renderers/datetime/date-picker/date-picker-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-renderer.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/date-picker/date-picker-renderer.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC3E,OAAO,KAAK,EACV,yBAAyB,EAG1B,MAAM,SAAS,CAAC;AAoBjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBAAa,kBAAmB,YAAW,YAAY;IACrD,OAAO,CAAC,OAAO,CAA4B;IAC3C,OAAO,CAAC,SAAS,CAA2C;IAC5D,OAAO,CAAC,YAAY,CAAe;gBAEvB,OAAO,GAAE,yBAA8B;IAWnD,OAAO,CAAC,cAAc;IAiBtB,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IA8CxD,OAAO,CAAC,kBAAkB;YAuCZ,SAAS;IAsCvB,OAAO,CAAC,UAAU;YAIJ,kBAAkB;IAmDhC,OAAO,CAAC,uBAAuB;IAiB/B,OAAO,CAAC,gBAAgB;IAkCxB,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAiCxD,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAwCnC,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;CAIvD;AAED;;GAEG;AACH,wBAAgB,wBAAwB,CACtC,OAAO,GAAE,yBAA8B,GACtC,kBAAkB,CAEpB"}

package/dist/src/rendering/renderers/datetime/date-picker/dom.d.ts

@@ -0,0 +1,41 @@
+/**
+ * DOM utilities for DatePickerRenderer
+ */
+import type { RenderParams } from '../../renderer.interface';
+/**
+ * Create the date picker container
+ */
+export declare function createContainer(className: string): HTMLElement;
+/**
+ * Create the trigger button
+ */
+export declare function createTrigger(displayText: string, isPlaceholder: boolean, disabled: boolean): HTMLElement;
+/**
+ * Create the popup container
+ */
+export declare function createPopup(zIndex: number): HTMLElement;
+/**
+ * Create the calendar wrapper
+ */
+export declare function createCalendarWrapper(): HTMLElement;
+/**
+ * Update trigger display text
+ */
+export declare function updateTriggerDisplay(trigger: HTMLElement, value: Date | null, format: string, placeholder: string): void;
+/**
+ * Get display text for a date value
+ */
+export declare function getDisplayText(value: Date | null, format: string, placeholder: string): string;
+/**
+ * Set ARIA attributes for accessibility
+ */
+export declare function setAriaAttributes(trigger: HTMLElement, popup: HTMLElement, params: RenderParams): void;
+/**
+ * Update ARIA expanded state
+ */
+export declare function setAriaExpanded(trigger: HTMLElement, expanded: boolean): void;
+/**
+ * Set data attributes on container
+ */
+export declare function setDataAttributes(container: HTMLElement, params: RenderParams): void;
+//# sourceMappingURL=dom.d.ts.map

package/dist/src/rendering/renderers/datetime/date-picker/dom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/date-picker/dom.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAa7D;;GAEG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAI9D;AAED;;GAEG;AACH,wBAAgB,aAAa,CAC3B,WAAW,EAAE,MAAM,EACnB,aAAa,EAAE,OAAO,EACtB,QAAQ,EAAE,OAAO,GAChB,WAAW,CAwBb;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,WAAW,CAMvD;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,WAAW,CAInD;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,IAAI,GAAG,IAAI,EAClB,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,GAClB,IAAI,CAWN;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,MAAM,CAE9F;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,YAAY,GACnB,IAAI,CAmBN;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,CAE7E;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI,CAMpF"}

package/dist/src/rendering/renderers/datetime/date-picker/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * DatePickerRenderer - Interactive date picker with calendar popup
+ */
+export { DatePickerRenderer, createDatePickerRenderer } from './date-picker-renderer';
+export type { DatePickerRendererOptions, ResolvedDatePickerOptions, DatePickerInstance, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/rendering/renderers/datetime/date-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/date-picker/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AACtF,YAAY,EACV,yBAAyB,EACzB,yBAAyB,EACzB,kBAAkB,GACnB,MAAM,SAAS,CAAC"}

package/dist/src/rendering/renderers/datetime/date-picker/types.d.ts

@@ -0,0 +1,66 @@
+/**
+ * DatePickerRenderer Types
+ */
+import type { RenderParams } from '../../renderer.interface';
+import type { DatetimeTheme } from '../../../../datetime-core';
+/**
+ * Configuration options for DatePickerRenderer
+ */
+export interface DatePickerRendererOptions {
+    /** Date format for display (default: 'DD/MM/YYYY') */
+    format?: string;
+    /** Minimum selectable date */
+    minDate?: Date | string;
+    /** Maximum selectable date */
+    maxDate?: Date | string;
+    /** Placeholder text when no date is selected */
+    placeholder?: string;
+    /** Custom CSS class for the date picker */
+    className?: string;
+    /** Theme (default: 'light') */
+    theme?: DatetimeTheme;
+    /** Callback when date changes */
+    onChange?: (value: Date | null, params: RenderParams) => void;
+    /** Custom validator function */
+    validator?: (value: Date | null) => boolean | string;
+    /** Whether the picker is disabled */
+    disabled?: boolean;
+    /** Close popup when scrolling (default: true) */
+    closeOnScroll?: boolean;
+    /** Close popup when clicking outside (default: true) */
+    closeOnClickOutside?: boolean;
+    /** Popup z-index (default: 9999) */
+    zIndex?: number;
+}
+/**
+ * Resolved options with all defaults applied
+ */
+export interface ResolvedDatePickerOptions {
+    format: string;
+    minDate: Date | null;
+    maxDate: Date | null;
+    placeholder: string;
+    className: string;
+    theme: DatetimeTheme;
+    disabled: boolean;
+    closeOnScroll: boolean;
+    closeOnClickOutside: boolean;
+    zIndex: number;
+    onChange?: (value: Date | null, params: RenderParams) => void;
+    validator?: (value: Date | null) => boolean | string;
+}
+/**
+ * Internal state for a date picker instance
+ */
+export interface DatePickerInstance {
+    container: HTMLElement;
+    trigger: HTMLElement;
+    popup: HTMLElement;
+    calendarWrapper: HTMLElement;
+    calendar: any | null;
+    currentValue: Date | null;
+    params: RenderParams;
+    isDestroyed: boolean;
+    cleanup: (() => void) | null;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/src/rendering/renderers/datetime/date-picker/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/date-picker/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC,sDAAsD;IACtD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,8BAA8B;IAC9B,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB,8BAA8B;IAC9B,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+BAA+B;IAC/B,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9D,gCAAgC;IAChC,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,KAAK,OAAO,GAAG,MAAM,CAAC;IACrD,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,wDAAwD;IACxD,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,IAAI,GAAG,IAAI,CAAC;IACrB,OAAO,EAAE,IAAI,GAAG,IAAI,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,OAAO,CAAC;IACvB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9D,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,KAAK,OAAO,GAAG,MAAM,CAAC;CACtD;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,WAAW,CAAC;IACvB,OAAO,EAAE,WAAW,CAAC;IACrB,KAAK,EAAE,WAAW,CAAC;IACnB,eAAe,EAAE,WAAW,CAAC;IAC7B,QAAQ,EAAE,GAAG,GAAG,IAAI,CAAC;IACrB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,MAAM,EAAE,YAAY,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC;CAC9B"}

package/dist/src/rendering/renderers/datetime/date-renderer.d.ts

@@ -0,0 +1,32 @@
+/**
+ * DateRenderer - Simple date display renderer (read-only)
+ *
+ * Displays formatted date values without interactive picker.
+ */
+import type { CellRenderer, RenderParams } from '../renderer.interface';
+export interface DateRendererOptions {
+    /** Date format (default: 'DD/MM/YYYY') */
+    format?: string;
+    /** Text for empty/null values (default: '') */
+    emptyText?: string;
+    /** Use relative labels like "Today", "Yesterday" (default: false) */
+    useRelativeLabels?: boolean;
+    /** Custom CSS class */
+    className?: string;
+}
+/**
+ * DateRenderer - Displays formatted date values
+ */
+export declare class DateRenderer implements CellRenderer {
+    private options;
+    constructor(options?: DateRendererOptions);
+    render(element: HTMLElement, params: RenderParams): void;
+    update(element: HTMLElement, params: RenderParams): void;
+    destroy(element: HTMLElement): void;
+    getCellClass(params: RenderParams): string | undefined;
+}
+/**
+ * Factory function
+ */
+export declare function createDateRenderer(options?: DateRendererOptions): DateRenderer;
+//# sourceMappingURL=date-renderer.d.ts.map

package/dist/src/rendering/renderers/datetime/date-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-renderer.d.ts","sourceRoot":"","sources":["../../../../../src/rendering/renderers/datetime/date-renderer.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAGxE,MAAM,WAAW,mBAAmB;IAClC,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,YAAa,YAAW,YAAY;IAC/C,OAAO,CAAC,OAAO,CAAgC;gBAEnC,OAAO,GAAE,mBAAwB;IAS7C,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAmBxD,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAgBxD,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAKnC,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;CAIvD;AAED;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,mBAAwB,GAAG,YAAY,CAElF"}

package/dist/src/rendering/renderers/datetime/datetime-picker/datetime-picker-renderer.d.ts

@@ -0,0 +1,37 @@
+/**
+ * DateTimePickerRenderer - Combines date and time selection
+ *
+ * Features:
+ * - Calendar for date selection
+ * - Time inputs for time selection
+ * - 12h/24h format support
+ * - Optional seconds
+ */
+import type { CellRenderer, RenderParams } from '../../renderer.interface';
+import type { DateTimePickerRendererOptions } from './types';
+/**
+ * DateTimePickerRenderer - Renders an interactive datetime picker
+ */
+export declare class DateTimePickerRenderer implements CellRenderer {
+    private options;
+    private instances;
+    private popupManager;
+    constructor(options?: DateTimePickerRendererOptions);
+    render(element: HTMLElement, params: RenderParams): void;
+    private createTimeSection;
+    private initializeCalendar;
+    private handleDateSelect;
+    private updateTriggerDisplay;
+    private updateTimeInputs;
+    private setupEventHandlers;
+    private updateValueFromTimeInputs;
+    private closeAndSave;
+    update(element: HTMLElement, params: RenderParams): void;
+    destroy(element: HTMLElement): void;
+    getCellClass(params: RenderParams): string | undefined;
+}
+/**
+ * Factory function
+ */
+export declare function createDateTimePickerRenderer(options?: DateTimePickerRendererOptions): DateTimePickerRenderer;
+//# sourceMappingURL=datetime-picker-renderer.d.ts.map

package/dist/src/rendering/renderers/datetime/datetime-picker/datetime-picker-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-picker-renderer.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/datetime-picker/datetime-picker-renderer.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC3E,OAAO,KAAK,EAAE,6BAA6B,EAAiC,MAAM,SAAS,CAAC;AAmC5F;;GAEG;AACH,qBAAa,sBAAuB,YAAW,YAAY;IACzD,OAAO,CAAC,OAAO,CAAgC;IAC/C,OAAO,CAAC,SAAS,CAaf;IACF,OAAO,CAAC,YAAY,CAAe;gBAEvB,OAAO,GAAE,6BAAkC;IAsBvD,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IA8ExD,OAAO,CAAC,iBAAiB;YAwFX,kBAAkB;IA6ChC,OAAO,CAAC,gBAAgB;IAiBxB,OAAO,CAAC,oBAAoB;IAW5B,OAAO,CAAC,gBAAgB;IAyBxB,OAAO,CAAC,kBAAkB;IAkD1B,OAAO,CAAC,yBAAyB;IAuBjC,OAAO,CAAC,YAAY;IAQpB,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,IAAI;IAkBxD,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IA4BnC,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;CAIvD;AAED;;GAEG;AACH,wBAAgB,4BAA4B,CAC1C,OAAO,GAAE,6BAAkC,GAC1C,sBAAsB,CAExB"}

package/dist/src/rendering/renderers/datetime/datetime-picker/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * DateTimePickerRenderer - Combined date and time selection
+ */
+export { DateTimePickerRenderer, createDateTimePickerRenderer } from './datetime-picker-renderer';
+export type { DateTimePickerRendererOptions, TimeFormat } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/rendering/renderers/datetime/datetime-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/rendering/renderers/datetime/datetime-picker/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,sBAAsB,EAAE,4BAA4B,EAAE,MAAM,4BAA4B,CAAC;AAClG,YAAY,EAAE,6BAA6B,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}