@mintplayer/ng-bootstrap 21.22.0 → 21.23.1

package/types/mintplayer-ng-bootstrap-web-components-scheduler.d.ts

@@ -0,0 +1,354 @@
+import * as lit from 'lit';
+import { LitElement, TemplateResult } from 'lit';
+import { ViewType, SchedulerEvent, Resource, ResourceGroup, SchedulerOptions, TimeSlot, DragState, PreviewEvent } from '@mintplayer/ng-bootstrap/web-components/scheduler-core';
+export { DisplayMode, DragState, PreviewEvent, Resource, ResourceGroup, SchedulerEvent, SchedulerEventPart, SchedulerOptions, TimeSlot, ViewType } from '@mintplayer/ng-bootstrap/web-components/scheduler-core';
+
+/**
+ * MpScheduler Web Component
+ *
+ * A fully-featured scheduler/calendar component.
+ * Refactored for clarity with separated concerns:
+ * - DragManager: Handles all drag operations
+ * - InputHandler: Normalizes mouse/touch input
+ * - SchedulerEventEmitter: Dispatches custom events
+ */
+declare class MpScheduler extends LitElement {
+    static styles: lit.CSSResult[];
+    static get observedAttributes(): string[];
+    private stateManager;
+    private currentView;
+    private currentViewType;
+    private contentContainer;
+    private dragManager;
+    private inputHandler;
+    private eventEmitter;
+    private previousView;
+    private previousDate;
+    private previousSelectedEventId;
+    private pendingDragUpdate;
+    private latestDragState;
+    private boundHandleKeyDown;
+    private nowIndicatorTimer;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    get view(): ViewType;
+    set view(value: ViewType);
+    get date(): Date;
+    set date(value: Date);
+    get events(): SchedulerEvent[];
+    set events(value: SchedulerEvent[]);
+    get resources(): (Resource | ResourceGroup)[];
+    set resources(value: (Resource | ResourceGroup)[]);
+    get options(): SchedulerOptions;
+    set options(value: Partial<SchedulerOptions>);
+    get selectedEvent(): SchedulerEvent | null;
+    set selectedEvent(value: SchedulerEvent | null);
+    get selectedRange(): {
+        start: Date;
+        end: Date;
+    } | null;
+    next(): void;
+    prev(): void;
+    today(): void;
+    gotoDate(date: Date): void;
+    changeView(view: ViewType): void;
+    addEvent(event: SchedulerEvent): void;
+    updateEvent(event: SchedulerEvent): void;
+    removeEvent(eventId: string): void;
+    getEventById(eventId: string): SchedulerEvent | null;
+    refetchEvents(): void;
+    render(): TemplateResult;
+    protected firstUpdated(): void;
+    private populateHeader;
+    private updateTitle;
+    private renderView;
+    private onStateChange;
+    private detectAndEmitChanges;
+    private updateUI;
+    private scheduleDragUpdate;
+    private handlePointerDown;
+    private handlePointerMove;
+    private handlePointerUp;
+    private handleDragComplete;
+    private handleClick;
+    private handleDoubleClick;
+    private handleKeyDown;
+    private startNowIndicatorTimer;
+    private stopNowIndicatorTimer;
+    private getSlotAtPosition;
+    private getSlotFromElement;
+}
+
+/**
+ * Internal state for the scheduler web component
+ */
+interface SchedulerState {
+    /** Current view type */
+    view: ViewType;
+    /** Current date (the date shown in the view) */
+    date: Date;
+    /** All events */
+    events: SchedulerEvent[];
+    /** Resources and resource groups */
+    resources: (Resource | ResourceGroup)[];
+    /** Configuration options */
+    options: SchedulerOptions;
+    /** Currently selected event */
+    selectedEvent: SchedulerEvent | null;
+    /** Currently hovered event */
+    hoveredEvent: SchedulerEvent | null;
+    /** Currently hovered time slot */
+    hoveredSlot: TimeSlot | null;
+    /** Current drag operation state */
+    dragState: DragState | null;
+    /** Preview event during drag operations */
+    previewEvent: PreviewEvent | null;
+    /** Collapsed resource group IDs */
+    collapsedGroups: Set<string>;
+    /** Whether mouse button is pressed */
+    isMouseDown: boolean;
+    /** Loading state */
+    isLoading: boolean;
+}
+/**
+ * Create initial scheduler state
+ */
+declare function createInitialState(options?: Partial<SchedulerOptions>): SchedulerState;
+/**
+ * State update function type
+ */
+type StateUpdater = (state: SchedulerState) => Partial<SchedulerState>;
+/**
+ * State manager for the scheduler
+ */
+declare class SchedulerStateManager {
+    private state;
+    private listeners;
+    constructor(initialOptions?: Partial<SchedulerOptions>);
+    /**
+     * Get current state
+     */
+    getState(): SchedulerState;
+    /**
+     * Update state with partial update or updater function
+     */
+    setState(update: Partial<SchedulerState> | StateUpdater): void;
+    /**
+     * Subscribe to state changes
+     */
+    subscribe(listener: (state: SchedulerState) => void): () => void;
+    /**
+     * Notify all listeners of state change
+     */
+    private notifyListeners;
+    /**
+     * Set the current view
+     */
+    setView(view: ViewType): void;
+    /**
+     * Set the current date
+     */
+    setDate(date: Date): void;
+    /**
+     * Set events
+     */
+    setEvents(events: SchedulerEvent[]): void;
+    /**
+     * Add an event
+     */
+    addEvent(event: SchedulerEvent): void;
+    /**
+     * Update an event
+     */
+    updateEvent(event: SchedulerEvent): void;
+    /**
+     * Remove an event
+     */
+    removeEvent(eventId: string): void;
+    /**
+     * Set resources
+     */
+    setResources(resources: (Resource | ResourceGroup)[]): void;
+    /**
+     * Toggle resource group collapse
+     */
+    toggleGroupCollapse(groupId: string): void;
+    /**
+     * Set selected event
+     */
+    setSelectedEvent(event: SchedulerEvent | null): void;
+    /**
+     * Set hovered event
+     */
+    setHoveredEvent(event: SchedulerEvent | null): void;
+    /**
+     * Set hovered slot
+     */
+    setHoveredSlot(slot: TimeSlot | null): void;
+    /**
+     * Start a drag operation
+     */
+    startDrag(dragState: DragState): void;
+    /**
+     * Update drag operation
+     */
+    updateDrag(currentSlot: TimeSlot, preview: PreviewEvent): void;
+    /**
+     * End drag operation
+     */
+    endDrag(): void;
+    /**
+     * Set mouse down state
+     */
+    setMouseDown(isMouseDown: boolean): void;
+    /**
+     * Set loading state
+     */
+    setLoading(isLoading: boolean): void;
+    /**
+     * Update options
+     */
+    setOptions(options: Partial<SchedulerOptions>): void;
+    /**
+     * Navigate to next period
+     */
+    next(): void;
+    /**
+     * Navigate to previous period
+     */
+    prev(): void;
+    /**
+     * Navigate to today
+     */
+    today(): void;
+    /**
+     * Navigate to a specific date
+     */
+    gotoDate(date: Date): void;
+}
+
+/**
+ * Base class for scheduler views
+ */
+declare abstract class BaseView {
+    protected container: HTMLElement;
+    protected state: SchedulerState;
+    constructor(container: HTMLElement, state: SchedulerState);
+    /**
+     * Update the view with new state
+     */
+    abstract update(state: SchedulerState): void;
+    /**
+     * Render the view
+     */
+    abstract render(): void;
+    /**
+     * Clean up the view
+     */
+    abstract destroy(): void;
+    /**
+     * Update the now indicator position (called every minute)
+     * Default implementation does nothing - override in views that have a now indicator
+     */
+    updateNowIndicator(): void;
+    /**
+     * Get the view's root element
+     */
+    getElement(): HTMLElement;
+    /**
+     * Helper to create an element with classes
+     */
+    protected createElement<K extends keyof HTMLElementTagNameMap>(tag: K, ...classes: string[]): HTMLElementTagNameMap[K];
+    /**
+     * Helper to set data attributes
+     */
+    protected setData(element: HTMLElement, data: Record<string, string | number>): void;
+    /**
+     * Helper to clear container
+     */
+    protected clearContainer(): void;
+}
+
+/**
+ * Year view renderer
+ */
+declare class YearView extends BaseView {
+    render(): void;
+    private createMonthCard;
+    update(state: SchedulerState): void;
+    destroy(): void;
+}
+
+/**
+ * Month view renderer
+ */
+declare class MonthView extends BaseView {
+    private dayCells;
+    render(): void;
+    private createDayCell;
+    private renderEvents;
+    update(state: SchedulerState): void;
+    private optionsRequireRerender;
+    destroy(): void;
+}
+
+/**
+ * Week view renderer
+ */
+declare class WeekView extends BaseView {
+    private dayColumns;
+    private eventElements;
+    private slotElements;
+    render(): void;
+    update(state: SchedulerState): void;
+    private optionsRequireRerender;
+    private renderEvents;
+    private createEventElement;
+    private renderPreviewEvent;
+    private updateGreyedSlots;
+    private renderNowIndicator;
+    updateNowIndicator(): void;
+    destroy(): void;
+}
+
+/**
+ * Day view renderer
+ */
+declare class DayView extends BaseView {
+    private eventsContainer;
+    private slotElements;
+    private dayColumn;
+    render(): void;
+    private renderEvents;
+    private createEventElement;
+    private renderNowIndicator;
+    updateNowIndicator(): void;
+    update(state: SchedulerState): void;
+    private optionsRequireRerender;
+    private updateGreyedSlots;
+    private renderPreviewEvent;
+    destroy(): void;
+}
+
+/**
+ * Timeline view renderer
+ */
+declare class TimelineView extends BaseView {
+    private rowElements;
+    private slotWidth;
+    render(): void;
+    private createResourceRow;
+    private renderEvents;
+    private createEventElement;
+    update(state: SchedulerState): void;
+    private optionsRequireRerender;
+    private updateGreyedSlots;
+    destroy(): void;
+}
+
+declare const schedulerStyles: lit.CSSResult;
+
+export { BaseView, DayView, MonthView, MpScheduler, SchedulerStateManager, TimelineView, WeekView, YearView, createInitialState, schedulerStyles };
+export type { SchedulerState };

package/types/mintplayer-ng-bootstrap-web-components-splitter.d.ts

@@ -0,0 +1,165 @@
+import * as lit from 'lit';
+import { LitElement, TemplateResult } from 'lit';
+
+type Direction = 'horizontal' | 'vertical';
+
+interface Point {
+    x: number;
+    y: number;
+}
+
+declare enum ResizeState {
+    Idle = "idle",
+    Resizing = "resizing"
+}
+interface ResizeOperation {
+    state: ResizeState;
+    startPosition: Point;
+    sizes: number[];
+    indexBefore: number;
+    indexAfter: number;
+    dividerElement: HTMLElement | null;
+}
+
+interface PanelInfo {
+    element: HTMLElement;
+    minSize?: number;
+    maxSize?: number;
+    initialSize?: number;
+}
+
+interface SplitterResizeEventDetail {
+    sizes: number[];
+    orientation: Direction;
+}
+declare class MpSplitter extends LitElement {
+    static styles: lit.CSSResult[];
+    static get observedAttributes(): string[];
+    private stateManager;
+    private inputHandler;
+    private resizeManager;
+    private container;
+    private panelWrappers;
+    private dividers;
+    private slotElement;
+    private mutationObserver;
+    private containerResizeObserver;
+    private unsubscribeState;
+    constructor();
+    render(): TemplateResult;
+    protected firstUpdated(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    get orientation(): Direction;
+    set orientation(value: Direction);
+    get minPanelSize(): number;
+    set minPanelSize(value: number);
+    get touchMode(): boolean;
+    set touchMode(value: boolean);
+    getPanelSizes(): number[];
+    setPanelSizes(sizes: number[]): void;
+    private setupMutationObserver;
+    private subscribeToState;
+    private updatePanelsFromSlot;
+    /**
+     * Read each panel-wrapper's measured pixel size and persist it as the
+     * authoritative panel size. After this runs, every wrapper carries an
+     * inline `width` (or `height`) — content intrinsic size cannot leak into
+     * the parent flex container, so a nested splitter's drag does not shift
+     * the parent's layout.
+     */
+    private pinSizesFromCurrentLayout;
+    private setupContainerResizeObserver;
+    /**
+     * When the splitter's container resizes (window resize, parent splitter
+     * pinning its sizes, etc.), scale every panel-wrapper proportionally so
+     * the existing ratios are preserved. Without this we'd be stuck with the
+     * original pixel sizes when the surrounding viewport changes — what
+     * `flex-basis: 0` gave master "for free".
+     */
+    private handleContainerResize;
+    private updateContainerOrientation;
+    private handleResizeStart;
+    private handleResizeMove;
+    private handleResizeEnd;
+    private applyPanelSizes;
+}
+
+interface SplitterState {
+    orientation: Direction;
+    panelSizes: number[];
+    previewSizes: number[] | null;
+    resizeOperation: ResizeOperation | null;
+}
+type SplitterStateListener = (state: SplitterState) => void;
+declare class SplitterStateManager {
+    private state;
+    private listeners;
+    constructor(initialState?: Partial<SplitterState>);
+    getState(): SplitterState;
+    subscribe(listener: SplitterStateListener): () => void;
+    private notifyListeners;
+    setOrientation(orientation: Direction): void;
+    setPanelSizes(sizes: number[]): void;
+    setPreviewSizes(sizes: number[] | null): void;
+    startResize(operation: ResizeOperation): void;
+    updateResize(previewSizes: number[]): void;
+    endResize(finalSizes: number[]): void;
+    cancelResize(): void;
+    isResizing(): boolean;
+}
+
+interface ResizeManagerOptions {
+    minPanelSize?: number;
+}
+declare class ResizeManager {
+    private options;
+    constructor(options?: ResizeManagerOptions);
+    computePanelSizes(panels: HTMLElement[], orientation: Direction): number[];
+    createResizeOperation(startPoint: Point, currentSizes: number[], dividerIndex: number, dividerElement: HTMLElement): ResizeOperation;
+    calculatePreviewSizes(operation: ResizeOperation, currentPoint: Point, orientation: Direction): number[];
+    setMinPanelSize(size: number): void;
+    getMinPanelSize(): number;
+}
+
+interface NormalizedPointerEvent {
+    clientX: number;
+    clientY: number;
+    point: Point;
+    originalEvent: MouseEvent | TouchEvent;
+    isTouch: boolean;
+}
+declare function normalizePointerEvent(event: MouseEvent | TouchEvent): NormalizedPointerEvent;
+
+interface InputHandlerCallbacks {
+    onResizeStart: (event: NormalizedPointerEvent, dividerIndex: number, dividerElement: HTMLElement) => void;
+    onResizeMove: (event: NormalizedPointerEvent) => void;
+    onResizeEnd: (event: NormalizedPointerEvent) => void;
+}
+declare class InputHandler {
+    private isActive;
+    private currentDividerIndex;
+    private currentDividerElement;
+    private callbacks;
+    private boundMouseMove;
+    private boundMouseUp;
+    private boundTouchMove;
+    private boundTouchEnd;
+    constructor(callbacks: InputHandlerCallbacks);
+    attachDividerListeners(divider: HTMLElement, index: number): void;
+    private handleMouseDown;
+    private handleMouseMove;
+    private handleMouseUp;
+    private handleTouchStart;
+    private handleTouchMove;
+    private handleTouchEnd;
+    private startResize;
+    private endResize;
+    dispose(): void;
+    getIsActive(): boolean;
+}
+
+declare const splitterStyles: lit.CSSResult;
+
+export { InputHandler, MpSplitter, ResizeManager, ResizeState, SplitterStateManager, normalizePointerEvent, splitterStyles };
+export type { Direction, InputHandlerCallbacks, NormalizedPointerEvent, PanelInfo, Point, ResizeManagerOptions, ResizeOperation, SplitterResizeEventDetail, SplitterState, SplitterStateListener };

package/types/mintplayer-ng-bootstrap-web-components-tab-control.d.ts

@@ -0,0 +1,95 @@
+import * as lit from 'lit';
+import { LitElement, TemplateResult } from 'lit';
+
+interface TabActivateEventDetail {
+    /** The `tab-id` of the tab the user activated. */
+    tabId: string;
+    /** The original DOM event (click or keydown) that triggered the activation. */
+    originalEvent: Event;
+}
+/**
+ * <mp-tab-control>
+ *
+ * Bootstrap-styled tab strip. Pages live in named `${id}-content` slots and
+ * headers in `${id}-header` slots. The shadow DOM dynamically projects only
+ * the currently-active page via `<slot name="${activeId}-content">`, so
+ * inactive panels never enter the rendered tree.
+ *
+ * Authoring (vanilla):
+ *
+ *     <mp-tab-control active-tab="overview">
+ *       <span slot="overview-header">Overview</span>
+ *       <div slot="overview-content">Hello</div>
+ *       <span slot="details-header">Details</span>
+ *       <div slot="details-content">Details body</div>
+ *     </mp-tab-control>
+ *
+ * To mark a tab disabled, set `data-disabled` on the `*-content` element.
+ *
+ * Active state is **controlled by the host** — the host sets `active-tab` and
+ * listens for `tab-activate` events. The Angular wrapper (`bs-tab-control`)
+ * drives this via signals.
+ */
+declare class MpTabControl extends LitElement {
+    static styles: lit.CSSResult[];
+    static get observedAttributes(): string[];
+    private tabs;
+    private mutationObserver;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    protected firstUpdated(): void;
+    private get tabsPosition();
+    private get border();
+    private get selectFirstTab();
+    private get activeTabId();
+    private refreshTabs;
+    private resolvedActiveTabId;
+    render(): TemplateResult;
+    private renderTabHeader;
+    private activate;
+    private handleKeydown;
+    private moveFocusAndActivate;
+}
+
+/**
+ * <mp-tab-page>
+ *
+ * Optional convenience wrapper for vanilla consumers. Sets `slot="${tabId}-content"`
+ * on itself based on its `tab-id` attribute, so the parent `<mp-tab-control>`
+ * picks it up via named-slot projection.
+ *
+ * Also mirrors `disabled` to `data-disabled` so the tab-control can read the
+ * disabled state without inspecting child types.
+ *
+ * Use directly:
+ *
+ *     <mp-tab-control>
+ *       <span slot="t1-header">Tab 1</span>
+ *       <mp-tab-page tab-id="t1">Content 1</mp-tab-page>
+ *     </mp-tab-control>
+ *
+ * Or skip this element entirely and put the slot/data-disabled attributes
+ * directly on whatever element holds your tab content:
+ *
+ *     <mp-tab-control>
+ *       <span slot="t1-header">Tab 1</span>
+ *       <div slot="t1-content">Content 1</div>
+ *     </mp-tab-control>
+ */
+declare class MpTabPage extends LitElement {
+    static styles: lit.CSSResult;
+    static get observedAttributes(): string[];
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    private syncSlot;
+    private syncDisabled;
+    render(): TemplateResult;
+}
+
+type TabsPosition = 'top' | 'bottom';
+
+declare const tabControlStyles: lit.CSSResult;
+
+export { MpTabControl, MpTabPage, tabControlStyles };
+export type { TabActivateEventDetail, TabsPosition };