@masterteam/timeline 0.0.9 → 0.0.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@masterteam/timeline",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "publishConfig": {
     "directory": "../../../dist/masterteam/timeline",
     "linkDirectory": false,
@@ -17,8 +17,8 @@
     "rxjs": "^7.8.2",
     "tailwindcss": "^4.1.17",
     "tailwindcss-primeui": "^0.6.1",
-    "@masterteam/components": "^0.0.124",
-    "@masterteam/icons": "^0.0.14"
+    "@masterteam/icons": "^0.0.14",
+    "@masterteam/components": "^0.0.134"
   },
   "sideEffects": false,
   "exports": {

package/types/masterteam-timeline.d.ts

@@ -2,10 +2,13 @@ import * as _angular_core from '@angular/core';
 import { TemplateRef, ElementRef } from '@angular/core';
 import { Popover } from 'primeng/popover';
 
-type TimelineScaleMode = 'monthly' | 'quarterly' | 'biannually' | 'annually';
+type TimelinePresetScaleMode = 'monthly' | 'quarterly' | 'biannually' | 'annually';
+type TimelineScaleMode = TimelinePresetScaleMode | 'zoom-to-fit';
 interface TimelineScaleOption {
     label: string;
     value: TimelineScaleMode;
+    icon?: string;
+    color?: string;
 }
 type TimelineAccessor<TItem = unknown, TValue = unknown> = string | ((item: TItem) => TValue);
 interface TimelineProgressValue {
@@ -166,6 +169,7 @@ declare class Timeline {
     private readonly transloco;
     private readonly destroyRef;
     private readonly activeLang;
+    private readonly timelineViewportWidthPx;
     readonly title: _angular_core.InputSignal<string>;
     readonly emptyMessage: _angular_core.InputSignal<string>;
     readonly isLoading: _angular_core.InputSignal<boolean>;
@@ -182,6 +186,9 @@ declare class Timeline {
     readonly defaultVisibleColumns: _angular_core.InputSignal<number | null>;
     readonly columnsPaneMinWidthPx: _angular_core.InputSignal<number>;
     readonly columnsPaneMaxWidthPx: _angular_core.InputSignal<number | null>;
+    readonly enableVirtualScroll: _angular_core.InputSignal<boolean>;
+    readonly virtualScrollThreshold: _angular_core.InputSignal<number>;
+    readonly virtualScrollBodyHeightPx: _angular_core.InputSignal<number>;
     readonly ganttTitleColumnLabel: _angular_core.InputSignal<string>;
     readonly ganttStatusColumnLabel: _angular_core.InputSignal<string>;
     readonly ganttInitiativeColumnWidthPx: _angular_core.InputSignal<number>;
@@ -198,11 +205,17 @@ declare class Timeline {
     readonly selectedGanttItem: _angular_core.WritableSignal<TimelineResolvedItem | null>;
     readonly columnTemplatesByKey: _angular_core.Signal<Map<string, TimelineColumnTemplateDirective<unknown, TimelineResolvedItem>>>;
     readonly mappedGanttNodes: _angular_core.Signal<TimelineMappedNode[]>;
+    readonly selectedTimelineView: _angular_core.Signal<TimelineScaleMode>;
+    readonly resolvedTimelineRange: _angular_core.Signal<{
+        startAt: number;
+        endAt: number;
+    } | null>;
+    readonly resolvedRenderTimelineMode: _angular_core.Signal<TimelinePresetScaleMode>;
     readonly orderedGanttSegments: _angular_core.Signal<TimelineResolvedSegment[]>;
-    readonly canZoomToFit: _angular_core.Signal<boolean>;
+    readonly isZoomToFitActive: _angular_core.Signal<boolean>;
     constructor();
     onTimelineModeChange(mode: TimelineScaleMode): void;
-    onZoomToFitToggle(): void;
+    onTimelineViewportWidthChange(widthPx: number): void;
     onGanttProgressClick(item: TimelineResolvedItem, event: MouseEvent): void;
     onDetailsPopoverHide(): void;
     hideDetailsPopover(): void;
@@ -211,6 +224,7 @@ declare class Timeline {
     private mapNode;
     private resolveDateRange;
     private buildSegments;
+    private resolveZoomToFitMode;
     private genSegments;
     private resolveAccessor;
     private resolveString;
@@ -221,8 +235,8 @@ declare class Timeline {
     private clampProgress;
     private positionPopoverClickAnchor;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Timeline, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Timeline, "mt-timeline", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "showZoomToFitControl": { "alias": "showZoomToFitControl"; "required": false; "isSignal": true; }; "timelineMode": { "alias": "timelineMode"; "required": false; "isSignal": true; }; "timelineModeOptions": { "alias": "timelineModeOptions"; "required": false; "isSignal": true; }; "zoomToFit": { "alias": "zoomToFit"; "required": false; "isSignal": true; }; "ganttData": { "alias": "ganttData"; "required": false; "isSignal": true; }; "ganttMapping": { "alias": "ganttMapping"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "ganttSegmentWidthPx": { "alias": "ganttSegmentWidthPx"; "required": false; "isSignal": true; }; "defaultVisibleColumns": { "alias": "defaultVisibleColumns"; "required": false; "isSignal": true; }; "columnsPaneMinWidthPx": { "alias": "columnsPaneMinWidthPx"; "required": false; "isSignal": true; }; "columnsPaneMaxWidthPx": { "alias": "columnsPaneMaxWidthPx"; "required": false; "isSignal": true; }; "ganttTitleColumnLabel": { "alias": "ganttTitleColumnLabel"; "required": false; "isSignal": true; }; "ganttStatusColumnLabel": { "alias": "ganttStatusColumnLabel"; "required": false; "isSignal": true; }; "ganttInitiativeColumnWidthPx": { "alias": "ganttInitiativeColumnWidthPx"; "required": false; "isSignal": true; }; "ganttStatusColumnWidthPx": { "alias": "ganttStatusColumnWidthPx"; "required": false; "isSignal": true; }; "showGanttStatusColumn": { "alias": "showGanttStatusColumn"; "required": false; "isSignal": true; }; "showGanttDetailsPopup": { "alias": "showGanttDetailsPopup"; "required": false; "isSignal": true; }; }, { "timelineMode": "timelineModeChange"; "zoomToFit": "zoomToFitChange"; "timelineModeChangeEvent": "timelineModeChangeEvent"; "ganttItemClick": "ganttItemClick"; }, ["ganttTemplate", "columnTemplates", "popoverTemplate", "progressTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Timeline, "mt-timeline", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "showZoomToFitControl": { "alias": "showZoomToFitControl"; "required": false; "isSignal": true; }; "timelineMode": { "alias": "timelineMode"; "required": false; "isSignal": true; }; "timelineModeOptions": { "alias": "timelineModeOptions"; "required": false; "isSignal": true; }; "zoomToFit": { "alias": "zoomToFit"; "required": false; "isSignal": true; }; "ganttData": { "alias": "ganttData"; "required": false; "isSignal": true; }; "ganttMapping": { "alias": "ganttMapping"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "ganttSegmentWidthPx": { "alias": "ganttSegmentWidthPx"; "required": false; "isSignal": true; }; "defaultVisibleColumns": { "alias": "defaultVisibleColumns"; "required": false; "isSignal": true; }; "columnsPaneMinWidthPx": { "alias": "columnsPaneMinWidthPx"; "required": false; "isSignal": true; }; "columnsPaneMaxWidthPx": { "alias": "columnsPaneMaxWidthPx"; "required": false; "isSignal": true; }; "enableVirtualScroll": { "alias": "enableVirtualScroll"; "required": false; "isSignal": true; }; "virtualScrollThreshold": { "alias": "virtualScrollThreshold"; "required": false; "isSignal": true; }; "virtualScrollBodyHeightPx": { "alias": "virtualScrollBodyHeightPx"; "required": false; "isSignal": true; }; "ganttTitleColumnLabel": { "alias": "ganttTitleColumnLabel"; "required": false; "isSignal": true; }; "ganttStatusColumnLabel": { "alias": "ganttStatusColumnLabel"; "required": false; "isSignal": true; }; "ganttInitiativeColumnWidthPx": { "alias": "ganttInitiativeColumnWidthPx"; "required": false; "isSignal": true; }; "ganttStatusColumnWidthPx": { "alias": "ganttStatusColumnWidthPx"; "required": false; "isSignal": true; }; "showGanttStatusColumn": { "alias": "showGanttStatusColumn"; "required": false; "isSignal": true; }; "showGanttDetailsPopup": { "alias": "showGanttDetailsPopup"; "required": false; "isSignal": true; }; }, { "timelineMode": "timelineModeChange"; "zoomToFit": "zoomToFitChange"; "timelineModeChangeEvent": "timelineModeChangeEvent"; "ganttItemClick": "ganttItemClick"; }, ["ganttTemplate", "columnTemplates", "popoverTemplate", "progressTemplate"], never, true, never>;
 }
 
 export { Timeline, TimelineColumnTemplateDirective, TimelineGanttTemplateDirective, TimelinePopoverTemplateDirective, TimelineProgressTemplateDirective };
-export type { TimelineAccessor, TimelineColumnConfig, TimelineColumnPosition, TimelineColumnTemplateContext, TimelineColumnValueAccessor, TimelineGanttMapping, TimelinePopoverTemplateContext, TimelineProgressAccessorValue, TimelineProgressTemplateContext, TimelineProgressValue, TimelineScaleMode, TimelineScaleOption };
+export type { TimelineAccessor, TimelineColumnConfig, TimelineColumnPosition, TimelineColumnTemplateContext, TimelineColumnValueAccessor, TimelineGanttMapping, TimelinePopoverTemplateContext, TimelinePresetScaleMode, TimelineProgressAccessorValue, TimelineProgressTemplateContext, TimelineProgressValue, TimelineScaleMode, TimelineScaleOption };