/**
* TyCalendarNavigation Web Component
* PORTED FROM: cljs/ty/components/calendar_navigation.cljs
*
* A pure presentation component for calendar month/year navigation.
* Stateless - all state comes from properties, changes emitted via events.
*
* Features:
* - Year/Month navigation (prev/next month, prev/next year)
* - Localized month name display
* - Custom event emission on navigation
* - Property-driven API (no internal state)
* - Inline SVG icons
* - Shadow DOM encapsulation
*
* @example
* ```html
*
*
*
*
*
*
* ```
*/
import { TyComponent } from '../base/ty-component.js';
import type { PropertyChange } from '../utils/property-manager.js';
/**
* Navigation change event detail
*/
export interface NavigationChangeDetail {
month: number;
year: number;
}
/**
* Internal navigation state (minimal - just for current display)
*/
interface NavigationState {
displayMonth: number;
displayYear: number;
}
/**
* TyCalendarNavigation Web Component
*/
export declare class TyCalendarNavigation extends TyComponent {
protected static properties: {
'display-month': {
type: "number";
visual: boolean;
default: () => number;
validate: (v: any) => boolean;
coerce: (v: any) => number;
};
'display-year': {
type: "number";
visual: boolean;
default: () => number;
validate: (v: any) => boolean;
coerce: (v: any) => number;
};
locale: {
type: "string";
visual: boolean;
default: string;
};
size: {
type: "string";
visual: boolean;
default: string;
validate: (v: any) => boolean;
coerce: (v: any) => any;
};
width: {
type: "string";
visual: boolean;
default: string;
};
min: {
type: "string";
visual: boolean;
default: string;
};
max: {
type: "string";
visual: boolean;
default: string;
};
};
private _state;
private _localeObserver?;
constructor();
/**
* Called when component connects to DOM
*/
protected onConnect(): void;
/**
* Called when component disconnects from DOM
*/
protected onDisconnect(): void;
/**
* Called when properties change
* Update internal state BEFORE render
*/
protected onPropertiesChanged(changes: PropertyChange[]): void;
get displayMonth(): number;
set displayMonth(value: number);
get displayYear(): number;
set displayYear(value: number);
get locale(): string;
set locale(value: string);
get size(): 'sm' | 'md' | 'lg';
set size(value: 'sm' | 'md' | 'lg');
get width(): string;
set width(value: string);
get min(): string;
set min(value: string);
get max(): string;
set max(value: string);
/**
* Emit change event with new month/year
*/
private emitChangeEvent;
/**
* Month index (year * 12 + month - 1) — flat, comparable month math.
*/
private static monthIndex;
/**
* min/max as month indices (null when unset/invalid)
*/
private boundIndices;
/**
* Clamp a target month index to [min, max]
*/
private clampIndex;
/**
* Navigate by month/year delta, clamped to bounds.
* Year jumps near a bound land ON the bound month instead of overshooting.
*/
private navigateBy;
/**
* True when navigating by deltaMonths can't move the display (bound reached)
*/
private isNavDisabled;
/**
* Create navigation button
*/
private createButton;
/**
* Main render function
*/
protected render(): void;
}
export {};
//# sourceMappingURL=calendar-navigation.d.ts.map