import * as i0 from '@angular/core';
import { Component, inject, TemplateRef, Directive, contentChild } from '@angular/core';
import { NgTemplateOutlet } from '@angular/common';

class Timeline {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Timeline, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: Timeline, isStandalone: true, selector: "ngs-timeline", host: { classAttribute: "ngs-timeline" }, exportAs: ["ngsTimeline"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-timeline-header-font-size: var(--ngs-font-size-sm);--ngs-timeline-header-padding: 0 0 calc(var(--spacing, .25rem) * 4) 0;--ngs-timeline-header-height: calc(var(--spacing, .25rem) * 8);--ngs-timeline-header-bg: transparent;--ngs-timeline-header-color: var(--ngs-color-neutral-500);--ngs-timeline-header-text-transform: uppercase;--ngs-timeline-header-font-weight: 500;--ngs-timeline-item-gap: calc(var(--spacing, .25rem) * 2.5);--ngs-timeline-item-no-timestamp-offset-start: -.5rem;--ngs-timeline-timestamp-font-size: var(--ngs-font-size-xs);--ngs-timeline-timestamp-width: calc(var(--spacing, .25rem) * 12);--ngs-timeline-timestamp-color: var(--ngs-color-neutral-500);--ngs-timeline-timestamp-padding: 1px 0 0 0;--ngs-timeline-item-content-padding: 0 0 calc(var(--spacing, .25rem) * 6) 0;--ngs-timeline-title-font-size: var(--ngs-font-size-sm);--ngs-timeline-title-color: var(--ngs-color-neutral-800);--ngs-timeline-title-font-weight: 500;--ngs-timeline-item-attributes-padding: calc(var(--spacing, .25rem) * 1) 0 0 0;--ngs-timeline-item-description-font-size: var(--ngs-font-size-sm);--ngs-timeline-item-description-color: var(--ngs-color-neutral-500);--ngs-timeline-item-subtitle-font-size: var(--ngs-font-size-sm);--ngs-timeline-item-subtitle-color: var(--ngs-color-neutral-500);--ngs-timeline-item-line-bg: var(--ngs-color-muted);--ngs-timeline-item-content-gap: calc(var(--spacing, .25rem) * 1);--ngs-timeline-indicator-shape-size: calc(var(--spacing, .25rem) * 3);--ngs-timeline-indicator-bg: transparent;--ngs-timeline-indicator-border: 2px solid var(--ngs-color-muted);--ngs-timeline-indicator-offset: 6px;--ngs-timeline-indicator-line-offset: 16px;display:grid;grid-template-columns:auto 1fr;column-gap:16px}:host:has(.ngs-timeline-timestamp){grid-template-columns:auto auto 1fr}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Timeline, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline', exportAs: 'ngsTimeline', host: {
                        'class': 'ngs-timeline'
                    }, template: "<ng-content/>\n", styles: [":host{--ngs-timeline-header-font-size: var(--ngs-font-size-sm);--ngs-timeline-header-padding: 0 0 calc(var(--spacing, .25rem) * 4) 0;--ngs-timeline-header-height: calc(var(--spacing, .25rem) * 8);--ngs-timeline-header-bg: transparent;--ngs-timeline-header-color: var(--ngs-color-neutral-500);--ngs-timeline-header-text-transform: uppercase;--ngs-timeline-header-font-weight: 500;--ngs-timeline-item-gap: calc(var(--spacing, .25rem) * 2.5);--ngs-timeline-item-no-timestamp-offset-start: -.5rem;--ngs-timeline-timestamp-font-size: var(--ngs-font-size-xs);--ngs-timeline-timestamp-width: calc(var(--spacing, .25rem) * 12);--ngs-timeline-timestamp-color: var(--ngs-color-neutral-500);--ngs-timeline-timestamp-padding: 1px 0 0 0;--ngs-timeline-item-content-padding: 0 0 calc(var(--spacing, .25rem) * 6) 0;--ngs-timeline-title-font-size: var(--ngs-font-size-sm);--ngs-timeline-title-color: var(--ngs-color-neutral-800);--ngs-timeline-title-font-weight: 500;--ngs-timeline-item-attributes-padding: calc(var(--spacing, .25rem) * 1) 0 0 0;--ngs-timeline-item-description-font-size: var(--ngs-font-size-sm);--ngs-timeline-item-description-color: var(--ngs-color-neutral-500);--ngs-timeline-item-subtitle-font-size: var(--ngs-font-size-sm);--ngs-timeline-item-subtitle-color: var(--ngs-color-neutral-500);--ngs-timeline-item-line-bg: var(--ngs-color-muted);--ngs-timeline-item-content-gap: calc(var(--spacing, .25rem) * 1);--ngs-timeline-indicator-shape-size: calc(var(--spacing, .25rem) * 3);--ngs-timeline-indicator-bg: transparent;--ngs-timeline-indicator-border: 2px solid var(--ngs-color-muted);--ngs-timeline-indicator-offset: 6px;--ngs-timeline-indicator-line-offset: 16px;display:grid;grid-template-columns:auto 1fr;column-gap:16px}:host:has(.ngs-timeline-timestamp){grid-template-columns:auto auto 1fr}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineHeader {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineHeader, isStandalone: true, selector: "ngs-timeline-header", host: { classAttribute: "ngs-timeline-header" }, exportAs: ["ngsTimelineHeader"], ngImport: i0, template: "<ng-content />\n", styles: [":host{text-transform:var(--ngs-timeline-header-text-transform);font-size:var(--ngs-timeline-header-font-size);background:var(--ngs-timeline-header-bg);color:var(--ngs-timeline-header-color);padding:var(--ngs-timeline-header-padding);font-weight:var(--ngs-timeline-header-font-weight);align-items:center;display:flex;flex:none;white-space:nowrap;grid-column:1/-1}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineHeader, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-header', exportAs: 'ngsTimelineHeader', host: {
                        'class': 'ngs-timeline-header'
                    }, template: "<ng-content />\n", styles: [":host{text-transform:var(--ngs-timeline-header-text-transform);font-size:var(--ngs-timeline-header-font-size);background:var(--ngs-timeline-header-bg);color:var(--ngs-timeline-header-color);padding:var(--ngs-timeline-header-padding);font-weight:var(--ngs-timeline-header-font-weight);align-items:center;display:flex;flex:none;white-space:nowrap;grid-column:1/-1}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineItemIndicatorDirective {
    templateRef = inject(TemplateRef);
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineItemIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: TimelineItemIndicatorDirective, isStandalone: true, selector: "[ngsTimelineItemIndicator]", exportAs: ["ngsTimelineItemIndicator"], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineItemIndicatorDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ngsTimelineItemIndicator]',
                    exportAs: 'ngsTimelineItemIndicator'
                }]
        }] });

class TimelineItem {
    indicatorRef = contentChild(TimelineItemIndicatorDirective, ...(ngDevMode ? [{ debugName: "indicatorRef" }] : /* istanbul ignore next */ []));
    get indicatorTemplateRef() {
        return this.indicatorRef()?.templateRef;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: TimelineItem, isStandalone: true, selector: "ngs-timeline-item", host: { classAttribute: "ngs-timeline-item" }, queries: [{ propertyName: "indicatorRef", first: true, predicate: TimelineItemIndicatorDirective, descendants: true, isSignal: true }], exportAs: ["ngsTimelineItem"], ngImport: i0, template: "<ng-content select=\"ngs-timeline-timestamp\"/>\n\n@if (indicatorRef()) {\n  <div class=\"line\">\n    <div class=\"custom-indicator\">\n      <ng-container [ngTemplateOutlet]=\"indicatorTemplateRef\"/>\n    </div>\n  </div>\n} @else {\n  <div class=\"line\">\n    <div class=\"indicator\">\n      <div class=\"indicator-shape\"></div>\n    </div>\n  </div>\n}\n\n<div class=\"content\">\n  <div class=\"content-inner\">\n    <div class=\"content-header\">\n      <ng-content select=\"ngs-timeline-title\"/>\n      <ng-content select=\"ngs-timeline-subtitle\"/>\n      <ng-content select=\"ngs-timeline-description\"/>\n    </div>\n    <div class=\"content-body\">\n      <ng-content select=\"ngs-timeline-attributes\"/>\n      <ng-content select=\"ngs-timeline-content\"/>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:contents}:host:has(.ngs-timeline-timestamp){margin-left:0}:host .indicator{z-index:1;top:var(--ngs-timeline-indicator-offset);position:relative;display:flex;justify-content:center;align-items:center}:host .line{padding:0;position:relative;display:flex;align-items:start;justify-content:center}:host .line:after{content:\"\";position:absolute;background:var(--ngs-timeline-item-line-bg);top:var(--ngs-timeline-indicator-line-offset);left:50%;transform:translate(-50%);bottom:calc(var(--ngs-timeline-indicator-offset) * -1);width:1px}:host .indicator-shape{flex:none;border-radius:99999px;width:var(--ngs-timeline-indicator-shape-size);height:var(--ngs-timeline-indicator-shape-size);background:var(--ngs-timeline-indicator-bg);border:var(--ngs-timeline-indicator-border)}:host:last-child .line:after{display:none}:host .custom-indicator{position:relative;width:max-content;z-index:1;line-height:0;top:3px}:host .content{padding:var(--ngs-timeline-item-content-padding)}:host .content-inner{display:flex;flex-direction:column;gap:var(--ngs-timeline-item-content-gap)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineItem, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-item', exportAs: 'ngsTimelineItem', host: {
                        'class': 'ngs-timeline-item'
                    }, imports: [NgTemplateOutlet], template: "<ng-content select=\"ngs-timeline-timestamp\"/>\n\n@if (indicatorRef()) {\n  <div class=\"line\">\n    <div class=\"custom-indicator\">\n      <ng-container [ngTemplateOutlet]=\"indicatorTemplateRef\"/>\n    </div>\n  </div>\n} @else {\n  <div class=\"line\">\n    <div class=\"indicator\">\n      <div class=\"indicator-shape\"></div>\n    </div>\n  </div>\n}\n\n<div class=\"content\">\n  <div class=\"content-inner\">\n    <div class=\"content-header\">\n      <ng-content select=\"ngs-timeline-title\"/>\n      <ng-content select=\"ngs-timeline-subtitle\"/>\n      <ng-content select=\"ngs-timeline-description\"/>\n    </div>\n    <div class=\"content-body\">\n      <ng-content select=\"ngs-timeline-attributes\"/>\n      <ng-content select=\"ngs-timeline-content\"/>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:contents}:host:has(.ngs-timeline-timestamp){margin-left:0}:host .indicator{z-index:1;top:var(--ngs-timeline-indicator-offset);position:relative;display:flex;justify-content:center;align-items:center}:host .line{padding:0;position:relative;display:flex;align-items:start;justify-content:center}:host .line:after{content:\"\";position:absolute;background:var(--ngs-timeline-item-line-bg);top:var(--ngs-timeline-indicator-line-offset);left:50%;transform:translate(-50%);bottom:calc(var(--ngs-timeline-indicator-offset) * -1);width:1px}:host .indicator-shape{flex:none;border-radius:99999px;width:var(--ngs-timeline-indicator-shape-size);height:var(--ngs-timeline-indicator-shape-size);background:var(--ngs-timeline-indicator-bg);border:var(--ngs-timeline-indicator-border)}:host:last-child .line:after{display:none}:host .custom-indicator{position:relative;width:max-content;z-index:1;line-height:0;top:3px}:host .content{padding:var(--ngs-timeline-item-content-padding)}:host .content-inner{display:flex;flex-direction:column;gap:var(--ngs-timeline-item-content-gap)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { indicatorRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TimelineItemIndicatorDirective), { isSignal: true }] }] } });

class TimelineAttributes {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineAttributes, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineAttributes, isStandalone: true, selector: "ngs-timeline-attributes", host: { classAttribute: "ngs-timeline-attributes" }, exportAs: ["ngsTimelineAttributes"], ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block;padding:var(--ngs-timeline-item-attributes-padding)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineAttributes, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-attributes', exportAs: 'ngsTimelineAttributes', host: {
                        'class': 'ngs-timeline-attributes'
                    }, template: "<ng-content />\n", styles: [":host{display:block;padding:var(--ngs-timeline-item-attributes-padding)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineDescription {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineDescription, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineDescription, isStandalone: true, selector: "ngs-timeline-description", host: { classAttribute: "ngs-timeline-description" }, exportAs: ["ngsTimelineDescription"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;font-size:var(--ngs-timeline-item-description-font-size);color:var(--ngs-timeline-item-description-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineDescription, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-description', exportAs: 'ngsTimelineDescription', host: {
                        'class': 'ngs-timeline-description'
                    }, template: "<ng-content/>\n", styles: [":host{display:block;font-size:var(--ngs-timeline-item-description-font-size);color:var(--ngs-timeline-item-description-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineTimestamp {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineTimestamp, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineTimestamp, isStandalone: true, selector: "ngs-timeline-timestamp", host: { classAttribute: "ngs-timeline-timestamp" }, exportAs: ["ngsTimelineTimestamp"], ngImport: i0, template: "<ng-content />\n", styles: [":host{font-size:var(--ngs-timeline-timestamp-font-size);color:var(--ngs-timeline-timestamp-color);padding:var(--ngs-timeline-timestamp-padding);overflow:hidden;text-overflow:ellipsis;min-width:0;white-space:nowrap;vertical-align:top}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineTimestamp, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-timestamp', exportAs: 'ngsTimelineTimestamp', host: {
                        'class': 'ngs-timeline-timestamp'
                    }, template: "<ng-content />\n", styles: [":host{font-size:var(--ngs-timeline-timestamp-font-size);color:var(--ngs-timeline-timestamp-color);padding:var(--ngs-timeline-timestamp-padding);overflow:hidden;text-overflow:ellipsis;min-width:0;white-space:nowrap;vertical-align:top}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineTitle {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineTitle, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineTitle, isStandalone: true, selector: "ngs-timeline-title", host: { classAttribute: "ngs-timeline-title" }, exportAs: ["ngsTimelineTitle"], ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block;font-size:var(--ngs-timeline-title-font-size);font-weight:var(--ngs-timeline-title-font-weight)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineTitle, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-title', exportAs: 'ngsTimelineTitle', host: {
                        'class': 'ngs-timeline-title'
                    }, template: "<ng-content />\n", styles: [":host{display:block;font-size:var(--ngs-timeline-title-font-size);font-weight:var(--ngs-timeline-title-font-weight)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineSubtitle {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineSubtitle, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineSubtitle, isStandalone: true, selector: "ngs-timeline-subtitle", ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;font-size:var(--ngs-timeline-item-subtitle-font-size);color:var(--ngs-timeline-item-subtitle-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineSubtitle, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-subtitle', imports: [], template: "<ng-content/>\n", styles: [":host{display:block;font-size:var(--ngs-timeline-item-subtitle-font-size);color:var(--ngs-timeline-item-subtitle-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class TimelineContent {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: TimelineContent, isStandalone: true, selector: "ngs-timeline-content", ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: TimelineContent, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-timeline-content', imports: [], template: "<ng-content/>\n", styles: [":host{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { Timeline, TimelineAttributes, TimelineContent, TimelineDescription, TimelineHeader, TimelineItem, TimelineItemIndicatorDirective, TimelineSubtitle, TimelineTimestamp, TimelineTitle };
//# sourceMappingURL=ngstarter-ui-components-timeline.mjs.map
