@avine/ng-timeline
Advanced tools
Comparing version
@@ -8,12 +8,27 @@ import { BooleanInput, NumberInput } from '@angular/cdk/coercion'; | ||
protected _items: TimelineItem[]; | ||
/** The list of items to display. */ | ||
set items(items: string[]); | ||
protected _pendingFromIndex?: number; | ||
/** Display the items as pending from the specified index. */ | ||
set pendingFromIndex(value: NumberInput); | ||
protected _bulletPoints: boolean; | ||
/** Display bullet points instead of bullet content. */ | ||
set bulletPoints(value: BooleanInput); | ||
/** Reverse the bullet and content positions. */ | ||
reverse: BooleanInput; | ||
/** Display timeline in horizontal or vertical direction. */ | ||
vertical: BooleanInput; | ||
protected _verticalContentSize?: string; | ||
/** Limit the size (width) of the content when the timeline is vertical. */ | ||
set verticalContentSize(value: NumberInput); | ||
/** | ||
* Determines the size of the line between bullets. | ||
* | ||
* @example | ||
* { horizontal: 10 } | ||
* { vertical: 2 } | ||
* { horizontal: 10, vertical: 2 } | ||
*/ | ||
lineSize: TimelineLineSize; | ||
/** Indicates the background color of the timeline. */ | ||
bgColor?: string; | ||
@@ -39,7 +54,10 @@ hasCss: boolean; | ||
/** | ||
* Enables responsive timeline. | ||
* On mobile, the timeline automatically switches to "vertical" mode. | ||
* Switch between vertical and horizontal timeline based on a breakpoint. | ||
* | ||
* @example | ||
* true // use the default breakpoint `TIMELINE_BREAKPOINT_DEFAULT` | ||
* // Use provided breakpoint (`TIMELINE_BREAKPOINT` injection token) | ||
* // or default breakpoint (`TIMELINE_BREAKPOINT_DEFAULT` which is `1024px`). | ||
* true | ||
* | ||
* // Use specified breakpoint. | ||
* '768px' | ||
@@ -46,0 +64,0 @@ */ |
{ | ||
"name": "@avine/ng-timeline", | ||
"description": "Angular component that displays a list of events in chronological order.", | ||
"version": "0.5.5", | ||
"version": "0.5.6", | ||
"private": false, | ||
@@ -6,0 +6,0 @@ "repository": { |
@@ -61,4 +61,5 @@ # Timeline | ||
| pendingFromIndex | NumberInput | undefined | Display the items as pending from the specified index. | | ||
| bgColor | string \| undefined | undefined | Indicates the background color of the timeline. | | ||
| lineSize | TimelineLineSize | {} | Determines the size of the line between bullets. | | ||
| bulletPoints | BooleanInput | false | Display bullet points instead of bullet content. | | ||
| lineSize | TimelineLineSize | {} | Determines the size of the line between bullets. | | ||
| reverse | BooleanInput | false | Reverse the bullet and content positions. | | ||
@@ -92,3 +93,3 @@ | vertical | BooleanInput | false | Display timeline in horizontal or vertical direction. | | ||
@Component({ | ||
providers: [provideTimelineBreakpoint('1440px')], | ||
providers: [provideTimelineBreakpoint('1280px')], | ||
}) | ||
@@ -104,3 +105,3 @@ export class TimelineDemoComponent {} | ||
@Component({ | ||
providers: [{ provide: TIMELINE_BREAKPOINT, useValue: '1440px' }], | ||
providers: [{ provide: TIMELINE_BREAKPOINT, useValue: '1280px' }], | ||
}) | ||
@@ -107,0 +108,0 @@ export class TimelineDemoComponent {} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
116043
4.92%832
9.04%146
0.69%