@ngstarter-ui/components 21.0.35 → 21.0.37
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# COMMERCIAL LICENSE AGREEMENT (EULA)
|
|
2
2
|
|
|
3
|
-
**Last updated:**
|
|
3
|
+
**Last updated:** June 11, 2026
|
|
4
4
|
|
|
5
5
|
This End User License Agreement ("Agreement") is a legal agreement between you ("Licensee", "you") and **ElementarLabs** ("Licensor", "we", "us") for the use of the software product: **NgStarter** (the "Software").
|
|
6
6
|
|
|
@@ -18,7 +18,7 @@ The license is granted according to the limits included in the purchased plan.
|
|
|
18
18
|
|
|
19
19
|
### 2.1 Standard License
|
|
20
20
|
|
|
21
|
-
A Standard License allows use of the Software by **
|
|
21
|
+
A Standard License allows use of the Software by **unlimited developers**, including solo developers and teams, for **one (1) project** and **one (1) domain**, including subdomains.
|
|
22
22
|
|
|
23
23
|
A developer is defined as any individual who directly or indirectly works with the Software’s source code.
|
|
24
24
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"generatedBy": "scripts/generate-ai-metadata.mjs",
|
|
4
4
|
"package": "@ngstarter-ui/components",
|
|
5
5
|
"description": "AI-readable registry for NgStarter UI Angular secondary entry points.",
|
|
6
|
-
"componentCount":
|
|
6
|
+
"componentCount": 126,
|
|
7
7
|
"conventions": {
|
|
8
8
|
"importPattern": "@ngstarter-ui/components/<component>",
|
|
9
9
|
"selectorPrefix": "ngs",
|
|
@@ -3847,6 +3847,128 @@
|
|
|
3847
3847
|
],
|
|
3848
3848
|
"example": null
|
|
3849
3849
|
},
|
|
3850
|
+
{
|
|
3851
|
+
"name": "events",
|
|
3852
|
+
"title": "Events",
|
|
3853
|
+
"overviewName": "Events",
|
|
3854
|
+
"category": "components",
|
|
3855
|
+
"package": "@ngstarter-ui/components",
|
|
3856
|
+
"importPath": "@ngstarter-ui/components/events",
|
|
3857
|
+
"publicApi": "projects/components/events/public-api.ts",
|
|
3858
|
+
"sourceRoot": "projects/components/events/src",
|
|
3859
|
+
"docsPath": "/components/events",
|
|
3860
|
+
"docsOverviewSource": "projects/docs/src/app/components/events/overview/overview.html",
|
|
3861
|
+
"purpose": "The NgStarter Angular Events components let you build grouped schedule lists with day markers, event cards, inline statuses, time ranges, status tones, and attendee actions.",
|
|
3862
|
+
"useWhen": "Choose Events when the workflow matches examples such as Basic Events, Weekly Grouping, Weekly events.",
|
|
3863
|
+
"exampleTopics": [
|
|
3864
|
+
"Basic Events",
|
|
3865
|
+
"Weekly Grouping",
|
|
3866
|
+
"Weekly events"
|
|
3867
|
+
],
|
|
3868
|
+
"minimalExample": "<ngs-events-list>\n <ngs-events-section label=\"This week\">\n <ngs-event>\n <ngs-event-date weekday=\"Thu\" day=\"19\"/>\n <ngs-event-title>Octolane Check-in</ngs-event-title>\n <ngs-event-status tone=\"success\">Confirmed</ngs-event-status>\n <ngs-event-time>9:00 - 9:30 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/75.jpg\" label=\"DK\" class=\"size-9\"/>\n </ngs-avatar-group>\n </ngs-event>\n <ngs-event>\n <ngs-event-date weekday=\"Fri\" day=\"20\"/>\n <ngs-event-title>POC Progress</ngs-event-title>\n <ngs-event-status tone=\"neutral\">Draft</ngs-event-status>\n <ngs-event-time>9:00 - 9:15 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar label=\"PO\" class=\"size-9 bg-neutral-950 text-white\"/>\n </ngs-avatar-group>\n </ngs-event>\n <ngs-event>\n <ngs-event-date weekday=\"Sat\" day=\"21\"/>\n <ngs-event-title>Octolane Weekly Review</ngs-event-title>\n <ngs-event-time>9:00 - 10:00 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/46.jpg\" label=\"MR\" class=\"size-9\"/>\n </ngs-avatar-group>\n </ngs-event>\n </ngs-events-section>\n</ngs-events-li\n...",
|
|
3869
|
+
"exampleFiles": [
|
|
3870
|
+
{
|
|
3871
|
+
"name": "basic-events-example",
|
|
3872
|
+
"title": "Basic events",
|
|
3873
|
+
"file": "projects/docs/src/app/components/events/_examples/basic-events-example/basic-events-example.html",
|
|
3874
|
+
"source": "<ngs-events-list>\n <ngs-events-section label=\"This week\">\n <ngs-event>\n <ngs-event-date weekday=\"Thu\" day=\"19\"/>\n <ngs-event-title>Octolane Check-in</ngs-event-title>\n <ngs-event-status tone=\"success\">Confirmed</ngs-event-status>\n <ngs-event-time>9:00 - 9:30 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/75.jpg\" label=\"DK\" class=\"size-9\"/>\n </ngs-avatar-group>\n </ngs-event>\n <ngs-event>\n <ngs-event-date weekday=\"Fri\" day=\"20\"/>\n <ngs-event-title>POC Progress</ngs-event-title>\n <ngs-event-status tone=\"neutral\">Draft</ngs-event-status>\n <ngs-event-time>9:00 - 9:15 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar label=\"PO\" class=\"size-9 bg-neutral-950 text-white\"/>\n </ngs-avatar-group>\n </ngs-event>\n <ngs-event>\n <ngs-event-date weekday=\"Sat\" day=\"21\"/>\n <ngs-event-title>Octolane Weekly Review</ngs-event-title>\n <ngs-event-time>9:00 - 10:00 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/46.jpg\" label=\"MR\" class=\"size-9\"/>\n </ngs-avatar-group>\n </ngs-event>\n </ngs-events-section>\n</ngs-events-li\n..."
|
|
3875
|
+
},
|
|
3876
|
+
{
|
|
3877
|
+
"name": "weekly-events-example",
|
|
3878
|
+
"title": "Weekly events",
|
|
3879
|
+
"file": "projects/docs/src/app/components/events/_examples/weekly-events-example/weekly-events-example.html",
|
|
3880
|
+
"source": "<ngs-events-list groupBy=\"week\">\n <ngs-events-section label=\"This week\">\n <ngs-event>\n <ngs-event-date weekday=\"Sat\" day=\"21\"/>\n <ngs-event-title>Octolane Weekly Review</ngs-event-title>\n <ngs-event-status tone=\"success\">Confirmed</ngs-event-status>\n <ngs-event-time>9:00 - 10:00 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/46.jpg\" label=\"MR\" class=\"size-9\"/>\n </ngs-avatar-group>\n </ngs-event>\n </ngs-events-section>\n <ngs-events-section label=\"Next week\">\n <ngs-event>\n <ngs-event-date weekday=\"Mon\" day=\"23\"/>\n <ngs-event-title>POC Progress</ngs-event-title>\n <ngs-event-status tone=\"neutral\">Draft</ngs-event-status>\n <ngs-event-time>9:00 - 9:15 AM</ngs-event-time>\n <ngs-avatar-group ngsEventActions>\n <ngs-avatar image=\"https://randomuser.me/api/portraits/men/32.jpg\" label=\"AM\" class=\"size-9\"/>\n <ngs-avatar label=\"PO\" class=\"size-9 bg-neutral-950 text-white\"/>\n </ngs-avatar-group>\n </ngs-event>\n </ngs-events-section>\n</ngs-events-list>"
|
|
3881
|
+
}
|
|
3882
|
+
],
|
|
3883
|
+
"previewAsset": "projects/components/events/preview.svg",
|
|
3884
|
+
"selectors": [
|
|
3885
|
+
"[ngs-event-date]",
|
|
3886
|
+
"[ngs-event-description]",
|
|
3887
|
+
"[ngs-event-status]",
|
|
3888
|
+
"[ngs-event-time]",
|
|
3889
|
+
"[ngs-event-title]",
|
|
3890
|
+
"[ngsEventActions]",
|
|
3891
|
+
"ngs-event",
|
|
3892
|
+
"ngs-event-date",
|
|
3893
|
+
"ngs-event-description",
|
|
3894
|
+
"ngs-event-status",
|
|
3895
|
+
"ngs-event-time",
|
|
3896
|
+
"ngs-event-title",
|
|
3897
|
+
"ngs-events-list",
|
|
3898
|
+
"ngs-events-section"
|
|
3899
|
+
],
|
|
3900
|
+
"exportedSymbols": [
|
|
3901
|
+
"Event",
|
|
3902
|
+
"EventActionsDirective",
|
|
3903
|
+
"EventDate",
|
|
3904
|
+
"EventDescription",
|
|
3905
|
+
"EventsList",
|
|
3906
|
+
"EventsListGroupBy",
|
|
3907
|
+
"EventsSection",
|
|
3908
|
+
"EventStatus",
|
|
3909
|
+
"EventTime",
|
|
3910
|
+
"EventTitle",
|
|
3911
|
+
"EventTone"
|
|
3912
|
+
],
|
|
3913
|
+
"inputs": [
|
|
3914
|
+
"day",
|
|
3915
|
+
"groupBy",
|
|
3916
|
+
"label",
|
|
3917
|
+
"tone",
|
|
3918
|
+
"weekday"
|
|
3919
|
+
],
|
|
3920
|
+
"outputs": [],
|
|
3921
|
+
"cssTokens": [
|
|
3922
|
+
"--ngs-color-border",
|
|
3923
|
+
"--ngs-color-danger",
|
|
3924
|
+
"--ngs-color-on-surface",
|
|
3925
|
+
"--ngs-color-on-surface-variant",
|
|
3926
|
+
"--ngs-color-primary",
|
|
3927
|
+
"--ngs-color-success",
|
|
3928
|
+
"--ngs-color-warning",
|
|
3929
|
+
"--ngs-event-bg",
|
|
3930
|
+
"--ngs-event-border-color",
|
|
3931
|
+
"--ngs-event-date-border-color",
|
|
3932
|
+
"--ngs-event-date-day-color",
|
|
3933
|
+
"--ngs-event-date-day-font-size",
|
|
3934
|
+
"--ngs-event-date-day-font-weight",
|
|
3935
|
+
"--ngs-event-date-divider-height",
|
|
3936
|
+
"--ngs-event-date-height",
|
|
3937
|
+
"--ngs-event-date-weekday-color",
|
|
3938
|
+
"--ngs-event-date-weekday-font-size",
|
|
3939
|
+
"--ngs-event-date-weekday-font-weight",
|
|
3940
|
+
"--ngs-event-date-width",
|
|
3941
|
+
"--ngs-event-description-color",
|
|
3942
|
+
"--ngs-event-description-font-size",
|
|
3943
|
+
"--ngs-event-description-font-weight",
|
|
3944
|
+
"--ngs-event-gap",
|
|
3945
|
+
"--ngs-event-meta-gap",
|
|
3946
|
+
"--ngs-event-min-height",
|
|
3947
|
+
"--ngs-event-padding",
|
|
3948
|
+
"--ngs-event-radius",
|
|
3949
|
+
"--ngs-event-shadow",
|
|
3950
|
+
"--ngs-event-status-color",
|
|
3951
|
+
"--ngs-event-status-dot-color",
|
|
3952
|
+
"--ngs-event-status-dot-size",
|
|
3953
|
+
"--ngs-event-status-font-size",
|
|
3954
|
+
"--ngs-event-status-font-weight",
|
|
3955
|
+
"--ngs-event-status-gap",
|
|
3956
|
+
"--ngs-event-time-color",
|
|
3957
|
+
"--ngs-event-time-font-size",
|
|
3958
|
+
"--ngs-event-time-font-weight",
|
|
3959
|
+
"--ngs-event-title-color",
|
|
3960
|
+
"--ngs-event-title-font-size",
|
|
3961
|
+
"--ngs-event-title-font-weight",
|
|
3962
|
+
"--ngs-events-list-gap",
|
|
3963
|
+
"--ngs-events-section-gap",
|
|
3964
|
+
"--ngs-events-section-item-gap",
|
|
3965
|
+
"--ngs-events-section-label-color",
|
|
3966
|
+
"--ngs-events-section-label-font-size",
|
|
3967
|
+
"--ngs-events-section-label-font-weight",
|
|
3968
|
+
"--ngs-shadow-xs"
|
|
3969
|
+
],
|
|
3970
|
+
"example": null
|
|
3971
|
+
},
|
|
3850
3972
|
{
|
|
3851
3973
|
"name": "expand",
|
|
3852
3974
|
"title": "Expand",
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, ChangeDetectionStrategy, Component, Directive } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
class EventsList {
|
|
5
|
+
groupBy = input('day', ...(ngDevMode ? [{ debugName: "groupBy" }] : /* istanbul ignore next */ []));
|
|
6
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventsList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: EventsList, isStandalone: true, selector: "ngs-events-list", inputs: { groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ngs-events-list-grouped-by-day": "groupBy() === \"day\"", "class.ngs-events-list-grouped-by-week": "groupBy() === \"week\"" }, classAttribute: "ngs-events-list" }, exportAs: ["ngsEventsList"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-events-list-gap: calc(var(--spacing, .25rem) * 7);display:flex;flex-direction:column;gap:var(--ngs-events-list-gap);width:100%}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8
|
+
}
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventsList, decorators: [{
|
|
10
|
+
type: Component,
|
|
11
|
+
args: [{ selector: 'ngs-events-list', exportAs: 'ngsEventsList', host: {
|
|
12
|
+
'class': 'ngs-events-list',
|
|
13
|
+
'[class.ngs-events-list-grouped-by-day]': 'groupBy() === "day"',
|
|
14
|
+
'[class.ngs-events-list-grouped-by-week]': 'groupBy() === "week"',
|
|
15
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{--ngs-events-list-gap: calc(var(--spacing, .25rem) * 7);display:flex;flex-direction:column;gap:var(--ngs-events-list-gap);width:100%}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
16
|
+
}], propDecorators: { groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }] } });
|
|
17
|
+
|
|
18
|
+
class EventsSection {
|
|
19
|
+
label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
20
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventsSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: EventsSection, isStandalone: true, selector: "ngs-events-section", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-events-section" }, exportAs: ["ngsEventsSection"], ngImport: i0, template: "@if (label()) {\n <h3 class=\"label\">{{ label() }}</h3>\n}\n<div class=\"items\">\n <ng-content />\n</div>\n", styles: [":host{--ngs-events-section-gap: calc(var(--spacing, .25rem) * 4);--ngs-events-section-item-gap: calc(var(--spacing, .25rem) * 3);--ngs-events-section-label-color: var(--ngs-color-on-surface-variant);--ngs-events-section-label-font-size: .875rem;--ngs-events-section-label-font-weight: 400;display:flex;flex-direction:column;gap:var(--ngs-events-section-gap)}:host .label{color:var(--ngs-events-section-label-color);font-size:var(--ngs-events-section-label-font-size);font-weight:var(--ngs-events-section-label-font-weight);line-height:1.35;margin:0}:host .items{display:flex;flex-direction:column;gap:var(--ngs-events-section-item-gap)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
22
|
+
}
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventsSection, decorators: [{
|
|
24
|
+
type: Component,
|
|
25
|
+
args: [{ selector: 'ngs-events-section', exportAs: 'ngsEventsSection', host: {
|
|
26
|
+
'class': 'ngs-events-section',
|
|
27
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (label()) {\n <h3 class=\"label\">{{ label() }}</h3>\n}\n<div class=\"items\">\n <ng-content />\n</div>\n", styles: [":host{--ngs-events-section-gap: calc(var(--spacing, .25rem) * 4);--ngs-events-section-item-gap: calc(var(--spacing, .25rem) * 3);--ngs-events-section-label-color: var(--ngs-color-on-surface-variant);--ngs-events-section-label-font-size: .875rem;--ngs-events-section-label-font-weight: 400;display:flex;flex-direction:column;gap:var(--ngs-events-section-gap)}:host .label{color:var(--ngs-events-section-label-color);font-size:var(--ngs-events-section-label-font-size);font-weight:var(--ngs-events-section-label-font-weight);line-height:1.35;margin:0}:host .items{display:flex;flex-direction:column;gap:var(--ngs-events-section-item-gap)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
28
|
+
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
|
|
29
|
+
|
|
30
|
+
class Event {
|
|
31
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Event, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: Event, isStandalone: true, selector: "ngs-event", host: { classAttribute: "ngs-event" }, exportAs: ["ngsEvent"], ngImport: i0, template: "<ng-content select=\"ngs-event-date,[ngs-event-date]\" />\n<div class=\"content\">\n <div class=\"details\">\n <ng-content select=\"ngs-event-title,[ngs-event-title]\" />\n <div class=\"meta\">\n <ng-content select=\"ngs-event-status,[ngs-event-status]\" />\n <ng-content select=\"ngs-event-time,[ngs-event-time]\" />\n </div>\n <ng-content select=\"ngs-event-description,[ngs-event-description]\" />\n <ng-content />\n </div>\n <div class=\"actions\">\n <ng-content select=\"[ngsEventActions]\" />\n </div>\n</div>\n", styles: [":host{--ngs-event-bg: transparent;--ngs-event-border-color: var(--ngs-color-border);--ngs-event-radius: 1rem;--ngs-event-padding: calc(var(--spacing, .25rem) * 2);--ngs-event-gap: calc(var(--spacing, .25rem) * 4.5);--ngs-event-min-height: calc(var(--spacing, .25rem) * 20);--ngs-event-shadow: var(--ngs-shadow-xs);--ngs-event-meta-gap: calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;gap:var(--ngs-event-gap);min-height:var(--ngs-event-min-height);padding:var(--ngs-event-padding);padding-inline-start:0;padding-inline-end:calc(var(--spacing, .25rem) * 4);background:var(--ngs-event-bg);border:1px solid;border-color:var(--ngs-event-border-color);border-radius:var(--ngs-event-radius);box-shadow:var(--ngs-event-shadow)}:host .content{display:flex;align-items:center;justify-content:space-between;gap:var(--ngs-event-gap);min-width:0;flex:1}:host .details{display:flex;flex-direction:column;justify-content:center;min-width:0;gap:calc(var(--spacing, .25rem) * 1)}:host .meta{display:flex;align-items:center;gap:var(--ngs-event-meta-gap);min-width:0}:host .meta:empty{display:none}:host .actions{display:flex;align-items:center;justify-content:flex-end;flex:none}:host .actions:empty{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
33
|
+
}
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Event, decorators: [{
|
|
35
|
+
type: Component,
|
|
36
|
+
args: [{ selector: 'ngs-event', exportAs: 'ngsEvent', host: {
|
|
37
|
+
'class': 'ngs-event',
|
|
38
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"ngs-event-date,[ngs-event-date]\" />\n<div class=\"content\">\n <div class=\"details\">\n <ng-content select=\"ngs-event-title,[ngs-event-title]\" />\n <div class=\"meta\">\n <ng-content select=\"ngs-event-status,[ngs-event-status]\" />\n <ng-content select=\"ngs-event-time,[ngs-event-time]\" />\n </div>\n <ng-content select=\"ngs-event-description,[ngs-event-description]\" />\n <ng-content />\n </div>\n <div class=\"actions\">\n <ng-content select=\"[ngsEventActions]\" />\n </div>\n</div>\n", styles: [":host{--ngs-event-bg: transparent;--ngs-event-border-color: var(--ngs-color-border);--ngs-event-radius: 1rem;--ngs-event-padding: calc(var(--spacing, .25rem) * 2);--ngs-event-gap: calc(var(--spacing, .25rem) * 4.5);--ngs-event-min-height: calc(var(--spacing, .25rem) * 20);--ngs-event-shadow: var(--ngs-shadow-xs);--ngs-event-meta-gap: calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;gap:var(--ngs-event-gap);min-height:var(--ngs-event-min-height);padding:var(--ngs-event-padding);padding-inline-start:0;padding-inline-end:calc(var(--spacing, .25rem) * 4);background:var(--ngs-event-bg);border:1px solid;border-color:var(--ngs-event-border-color);border-radius:var(--ngs-event-radius);box-shadow:var(--ngs-event-shadow)}:host .content{display:flex;align-items:center;justify-content:space-between;gap:var(--ngs-event-gap);min-width:0;flex:1}:host .details{display:flex;flex-direction:column;justify-content:center;min-width:0;gap:calc(var(--spacing, .25rem) * 1)}:host .meta{display:flex;align-items:center;gap:var(--ngs-event-meta-gap);min-width:0}:host .meta:empty{display:none}:host .actions{display:flex;align-items:center;justify-content:flex-end;flex:none}:host .actions:empty{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
39
|
+
}] });
|
|
40
|
+
|
|
41
|
+
class EventDate {
|
|
42
|
+
weekday = input('', ...(ngDevMode ? [{ debugName: "weekday" }] : /* istanbul ignore next */ []));
|
|
43
|
+
day = input('', ...(ngDevMode ? [{ debugName: "day" }] : /* istanbul ignore next */ []));
|
|
44
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventDate, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
45
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: EventDate, isStandalone: true, selector: "ngs-event-date,[ngs-event-date]", inputs: { weekday: { classPropertyName: "weekday", publicName: "weekday", isSignal: true, isRequired: false, transformFunction: null }, day: { classPropertyName: "day", publicName: "day", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-event-date" }, exportAs: ["ngsEventDate"], ngImport: i0, template: "<span class=\"day\">{{ day() }}</span>\n<span class=\"weekday\">{{ weekday() }}</span>\n", styles: [":host{--ngs-event-date-width: calc(var(--spacing, .25rem) * 16);--ngs-event-date-height: calc(var(--spacing, .25rem) * 12);--ngs-event-date-border-color: var(--ngs-color-border);--ngs-event-date-weekday-color: var(--ngs-color-on-surface-variant);--ngs-event-date-weekday-font-size: .75rem;--ngs-event-date-weekday-font-weight: 500;--ngs-event-date-day-color: var(--ngs-color-on-surface);--ngs-event-date-day-font-size: 1.25rem;--ngs-event-date-day-font-weight: 500;--ngs-event-date-divider-height: calc(var(--spacing, .25rem) * 11);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);width:var(--ngs-event-date-width);height:var(--ngs-event-date-height);flex:none;position:relative;text-align:center}:host:after{content:\"\";position:absolute;top:50%;inset-inline-end:0;width:1px;height:var(--ngs-event-date-divider-height);background:var(--ngs-event-date-border-color);transform:translateY(-50%)}:host .weekday{display:block;color:var(--ngs-event-date-weekday-color);font-size:var(--ngs-event-date-weekday-font-size);font-weight:var(--ngs-event-date-weekday-font-weight);line-height:1.1;text-transform:uppercase}:host .day{display:block;color:var(--ngs-event-date-day-color);font-size:var(--ngs-event-date-day-font-size);font-weight:var(--ngs-event-date-day-font-weight);line-height:1}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
46
|
+
}
|
|
47
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventDate, decorators: [{
|
|
48
|
+
type: Component,
|
|
49
|
+
args: [{ selector: 'ngs-event-date,[ngs-event-date]', exportAs: 'ngsEventDate', host: {
|
|
50
|
+
'class': 'ngs-event-date',
|
|
51
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"day\">{{ day() }}</span>\n<span class=\"weekday\">{{ weekday() }}</span>\n", styles: [":host{--ngs-event-date-width: calc(var(--spacing, .25rem) * 16);--ngs-event-date-height: calc(var(--spacing, .25rem) * 12);--ngs-event-date-border-color: var(--ngs-color-border);--ngs-event-date-weekday-color: var(--ngs-color-on-surface-variant);--ngs-event-date-weekday-font-size: .75rem;--ngs-event-date-weekday-font-weight: 500;--ngs-event-date-day-color: var(--ngs-color-on-surface);--ngs-event-date-day-font-size: 1.25rem;--ngs-event-date-day-font-weight: 500;--ngs-event-date-divider-height: calc(var(--spacing, .25rem) * 11);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);width:var(--ngs-event-date-width);height:var(--ngs-event-date-height);flex:none;position:relative;text-align:center}:host:after{content:\"\";position:absolute;top:50%;inset-inline-end:0;width:1px;height:var(--ngs-event-date-divider-height);background:var(--ngs-event-date-border-color);transform:translateY(-50%)}:host .weekday{display:block;color:var(--ngs-event-date-weekday-color);font-size:var(--ngs-event-date-weekday-font-size);font-weight:var(--ngs-event-date-weekday-font-weight);line-height:1.1;text-transform:uppercase}:host .day{display:block;color:var(--ngs-event-date-day-color);font-size:var(--ngs-event-date-day-font-size);font-weight:var(--ngs-event-date-day-font-weight);line-height:1}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
52
|
+
}], propDecorators: { weekday: [{ type: i0.Input, args: [{ isSignal: true, alias: "weekday", required: false }] }], day: [{ type: i0.Input, args: [{ isSignal: true, alias: "day", required: false }] }] } });
|
|
53
|
+
|
|
54
|
+
class EventTitle {
|
|
55
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventTitle, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: EventTitle, isStandalone: true, selector: "ngs-event-title,[ngs-event-title]", host: { classAttribute: "ngs-event-title" }, exportAs: ["ngsEventTitle"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-event-title-color: var(--ngs-color-on-surface);--ngs-event-title-font-size: 1rem;--ngs-event-title-font-weight: 600;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-title-color);font-size:var(--ngs-event-title-font-size);font-weight:var(--ngs-event-title-font-weight);line-height:1.25;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
57
|
+
}
|
|
58
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventTitle, decorators: [{
|
|
59
|
+
type: Component,
|
|
60
|
+
args: [{ selector: 'ngs-event-title,[ngs-event-title]', exportAs: 'ngsEventTitle', host: {
|
|
61
|
+
'class': 'ngs-event-title',
|
|
62
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{--ngs-event-title-color: var(--ngs-color-on-surface);--ngs-event-title-font-size: 1rem;--ngs-event-title-font-weight: 600;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-title-color);font-size:var(--ngs-event-title-font-size);font-weight:var(--ngs-event-title-font-weight);line-height:1.25;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
63
|
+
}] });
|
|
64
|
+
|
|
65
|
+
class EventStatus {
|
|
66
|
+
tone = input('default', ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
67
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventStatus, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: EventStatus, isStandalone: true, selector: "ngs-event-status,[ngs-event-status]", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tone-primary": "tone() === \"primary\"", "class.tone-success": "tone() === \"success\"", "class.tone-warning": "tone() === \"warning\"", "class.tone-danger": "tone() === \"danger\"", "class.tone-neutral": "tone() === \"neutral\"" }, classAttribute: "ngs-event-status" }, exportAs: ["ngsEventStatus"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-event-status-color: var(--ngs-color-on-surface-variant);--ngs-event-status-font-size: .875rem;--ngs-event-status-font-weight: 500;--ngs-event-status-gap: calc(var(--spacing, .25rem) * 1.5);--ngs-event-status-dot-size: calc(var(--spacing, .25rem) * 1.5);--ngs-event-status-dot-color: currentColor;display:inline-flex;align-items:center;gap:var(--ngs-event-status-gap);color:var(--ngs-event-status-color);font-size:var(--ngs-event-status-font-size);font-weight:var(--ngs-event-status-font-weight);line-height:1.25;white-space:nowrap}:host:before{content:\"\";width:var(--ngs-event-status-dot-size);height:var(--ngs-event-status-dot-size);flex:none;border-radius:calc(infinity * 1px);background:var(--ngs-event-status-dot-color)}:host.tone-primary{--ngs-event-status-color: var(--ngs-color-primary)}:host.tone-success{--ngs-event-status-color: var(--ngs-color-success)}:host.tone-warning{--ngs-event-status-color: var(--ngs-color-warning)}:host.tone-danger{--ngs-event-status-color: var(--ngs-color-danger)}:host.tone-neutral{--ngs-event-status-color: var(--ngs-color-on-surface-variant)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
69
|
+
}
|
|
70
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventStatus, decorators: [{
|
|
71
|
+
type: Component,
|
|
72
|
+
args: [{ selector: 'ngs-event-status,[ngs-event-status]', exportAs: 'ngsEventStatus', host: {
|
|
73
|
+
'class': 'ngs-event-status',
|
|
74
|
+
'[class.tone-primary]': 'tone() === "primary"',
|
|
75
|
+
'[class.tone-success]': 'tone() === "success"',
|
|
76
|
+
'[class.tone-warning]': 'tone() === "warning"',
|
|
77
|
+
'[class.tone-danger]': 'tone() === "danger"',
|
|
78
|
+
'[class.tone-neutral]': 'tone() === "neutral"',
|
|
79
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{--ngs-event-status-color: var(--ngs-color-on-surface-variant);--ngs-event-status-font-size: .875rem;--ngs-event-status-font-weight: 500;--ngs-event-status-gap: calc(var(--spacing, .25rem) * 1.5);--ngs-event-status-dot-size: calc(var(--spacing, .25rem) * 1.5);--ngs-event-status-dot-color: currentColor;display:inline-flex;align-items:center;gap:var(--ngs-event-status-gap);color:var(--ngs-event-status-color);font-size:var(--ngs-event-status-font-size);font-weight:var(--ngs-event-status-font-weight);line-height:1.25;white-space:nowrap}:host:before{content:\"\";width:var(--ngs-event-status-dot-size);height:var(--ngs-event-status-dot-size);flex:none;border-radius:calc(infinity * 1px);background:var(--ngs-event-status-dot-color)}:host.tone-primary{--ngs-event-status-color: var(--ngs-color-primary)}:host.tone-success{--ngs-event-status-color: var(--ngs-color-success)}:host.tone-warning{--ngs-event-status-color: var(--ngs-color-warning)}:host.tone-danger{--ngs-event-status-color: var(--ngs-color-danger)}:host.tone-neutral{--ngs-event-status-color: var(--ngs-color-on-surface-variant)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
80
|
+
}], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }] } });
|
|
81
|
+
|
|
82
|
+
class EventTime {
|
|
83
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventTime, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
84
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: EventTime, isStandalone: true, selector: "ngs-event-time,[ngs-event-time]", host: { classAttribute: "ngs-event-time" }, exportAs: ["ngsEventTime"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-event-time-color: var(--ngs-color-on-surface-variant);--ngs-event-time-font-size: .875rem;--ngs-event-time-font-weight: 400;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-time-color);font-size:var(--ngs-event-time-font-size);font-weight:var(--ngs-event-time-font-weight);line-height:1.4;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
85
|
+
}
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventTime, decorators: [{
|
|
87
|
+
type: Component,
|
|
88
|
+
args: [{ selector: 'ngs-event-time,[ngs-event-time]', exportAs: 'ngsEventTime', host: {
|
|
89
|
+
'class': 'ngs-event-time',
|
|
90
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{--ngs-event-time-color: var(--ngs-color-on-surface-variant);--ngs-event-time-font-size: .875rem;--ngs-event-time-font-weight: 400;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-time-color);font-size:var(--ngs-event-time-font-size);font-weight:var(--ngs-event-time-font-weight);line-height:1.4;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
91
|
+
}] });
|
|
92
|
+
|
|
93
|
+
class EventDescription {
|
|
94
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventDescription, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
95
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: EventDescription, isStandalone: true, selector: "ngs-event-description,[ngs-event-description]", host: { classAttribute: "ngs-event-description" }, exportAs: ["ngsEventDescription"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-event-description-color: var(--ngs-color-on-surface-variant);--ngs-event-description-font-size: 1rem;--ngs-event-description-font-weight: 400;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-description-color);font-size:var(--ngs-event-description-font-size);font-weight:var(--ngs-event-description-font-weight);line-height:1.4;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
96
|
+
}
|
|
97
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventDescription, decorators: [{
|
|
98
|
+
type: Component,
|
|
99
|
+
args: [{ selector: 'ngs-event-description,[ngs-event-description]', exportAs: 'ngsEventDescription', host: {
|
|
100
|
+
'class': 'ngs-event-description',
|
|
101
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{--ngs-event-description-color: var(--ngs-color-on-surface-variant);--ngs-event-description-font-size: 1rem;--ngs-event-description-font-weight: 400;display:block;min-width:0;overflow:hidden;color:var(--ngs-event-description-color);font-size:var(--ngs-event-description-font-size);font-weight:var(--ngs-event-description-font-weight);line-height:1.4;text-overflow:ellipsis;white-space:nowrap}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
102
|
+
}] });
|
|
103
|
+
|
|
104
|
+
class EventActionsDirective {
|
|
105
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
106
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: EventActionsDirective, isStandalone: true, selector: "[ngsEventActions]", exportAs: ["ngsEventActions"], ngImport: i0 });
|
|
107
|
+
}
|
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: EventActionsDirective, decorators: [{
|
|
109
|
+
type: Directive,
|
|
110
|
+
args: [{
|
|
111
|
+
selector: '[ngsEventActions]',
|
|
112
|
+
exportAs: 'ngsEventActions',
|
|
113
|
+
standalone: true,
|
|
114
|
+
}]
|
|
115
|
+
}] });
|
|
116
|
+
|
|
117
|
+
/**
|
|
118
|
+
* Generated bundle index. Do not edit.
|
|
119
|
+
*/
|
|
120
|
+
|
|
121
|
+
export { Event, EventActionsDirective, EventDate, EventDescription, EventStatus, EventTime, EventTitle, EventsList, EventsSection };
|
|
122
|
+
//# sourceMappingURL=ngstarter-ui-components-events.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ngstarter-ui-components-events.mjs","sources":["../../../projects/components/events/src/events-list/events-list.ts","../../../projects/components/events/src/events-list/events-list.html","../../../projects/components/events/src/events-section/events-section.ts","../../../projects/components/events/src/events-section/events-section.html","../../../projects/components/events/src/event/event.ts","../../../projects/components/events/src/event/event.html","../../../projects/components/events/src/event-date/event-date.ts","../../../projects/components/events/src/event-date/event-date.html","../../../projects/components/events/src/event-title/event-title.ts","../../../projects/components/events/src/event-title/event-title.html","../../../projects/components/events/src/event-status/event-status.ts","../../../projects/components/events/src/event-status/event-status.html","../../../projects/components/events/src/event-time/event-time.ts","../../../projects/components/events/src/event-time/event-time.html","../../../projects/components/events/src/event-description/event-description.ts","../../../projects/components/events/src/event-description/event-description.html","../../../projects/components/events/src/event-actions.directive.ts","../../../projects/components/events/ngstarter-ui-components-events.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { EventsListGroupBy } from '../types';\n\n@Component({\n selector: 'ngs-events-list',\n exportAs: 'ngsEventsList',\n templateUrl: './events-list.html',\n styleUrl: './events-list.scss',\n host: {\n 'class': 'ngs-events-list',\n '[class.ngs-events-list-grouped-by-day]': 'groupBy() === \"day\"',\n '[class.ngs-events-list-grouped-by-week]': 'groupBy() === \"week\"',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventsList {\n groupBy = input<EventsListGroupBy>('day');\n}\n","<ng-content />\n","import { ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-events-section',\n exportAs: 'ngsEventsSection',\n templateUrl: './events-section.html',\n styleUrl: './events-section.scss',\n host: {\n 'class': 'ngs-events-section',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventsSection {\n label = input('');\n}\n","@if (label()) {\n <h3 class=\"label\">{{ label() }}</h3>\n}\n<div class=\"items\">\n <ng-content />\n</div>\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-event',\n exportAs: 'ngsEvent',\n templateUrl: './event.html',\n styleUrl: './event.scss',\n host: {\n 'class': 'ngs-event',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class Event {}\n","<ng-content select=\"ngs-event-date,[ngs-event-date]\" />\n<div class=\"content\">\n <div class=\"details\">\n <ng-content select=\"ngs-event-title,[ngs-event-title]\" />\n <div class=\"meta\">\n <ng-content select=\"ngs-event-status,[ngs-event-status]\" />\n <ng-content select=\"ngs-event-time,[ngs-event-time]\" />\n </div>\n <ng-content select=\"ngs-event-description,[ngs-event-description]\" />\n <ng-content />\n </div>\n <div class=\"actions\">\n <ng-content select=\"[ngsEventActions]\" />\n </div>\n</div>\n","import { ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-event-date,[ngs-event-date]',\n exportAs: 'ngsEventDate',\n templateUrl: './event-date.html',\n styleUrl: './event-date.scss',\n host: {\n 'class': 'ngs-event-date',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventDate {\n weekday = input('');\n day = input<string | number>('');\n}\n","<span class=\"day\">{{ day() }}</span>\n<span class=\"weekday\">{{ weekday() }}</span>\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-event-title,[ngs-event-title]',\n exportAs: 'ngsEventTitle',\n templateUrl: './event-title.html',\n styleUrl: './event-title.scss',\n host: {\n 'class': 'ngs-event-title',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventTitle {}\n","<ng-content />\n","import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { EventTone } from '../types';\n\n@Component({\n selector: 'ngs-event-status,[ngs-event-status]',\n exportAs: 'ngsEventStatus',\n templateUrl: './event-status.html',\n styleUrl: './event-status.scss',\n host: {\n 'class': 'ngs-event-status',\n '[class.tone-primary]': 'tone() === \"primary\"',\n '[class.tone-success]': 'tone() === \"success\"',\n '[class.tone-warning]': 'tone() === \"warning\"',\n '[class.tone-danger]': 'tone() === \"danger\"',\n '[class.tone-neutral]': 'tone() === \"neutral\"',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventStatus {\n tone = input<EventTone>('default');\n}\n","<ng-content />\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-event-time,[ngs-event-time]',\n exportAs: 'ngsEventTime',\n templateUrl: './event-time.html',\n styleUrl: './event-time.scss',\n host: {\n 'class': 'ngs-event-time',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventTime {}\n","<ng-content />\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-event-description,[ngs-event-description]',\n exportAs: 'ngsEventDescription',\n templateUrl: './event-description.html',\n styleUrl: './event-description.scss',\n host: {\n 'class': 'ngs-event-description',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EventDescription {}\n","<ng-content />\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngsEventActions]',\n exportAs: 'ngsEventActions',\n standalone: true,\n})\nexport class EventActionsDirective {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ngstarter-ui/components",
|
|
3
3
|
"description": "NgStarter - AI-friendly Enterprise Angular UI Components and Admin Panel",
|
|
4
|
-
"version": "21.0.
|
|
4
|
+
"version": "21.0.37",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
7
7
|
"url": "https://github.com/elementarlabsdev/ngstarter.git"
|
|
@@ -269,6 +269,10 @@
|
|
|
269
269
|
"types": "./types/ngstarter-ui-components-empty-state.d.ts",
|
|
270
270
|
"default": "./fesm2022/ngstarter-ui-components-empty-state.mjs"
|
|
271
271
|
},
|
|
272
|
+
"./events": {
|
|
273
|
+
"types": "./types/ngstarter-ui-components-events.d.ts",
|
|
274
|
+
"default": "./fesm2022/ngstarter-ui-components-events.mjs"
|
|
275
|
+
},
|
|
272
276
|
"./expand": {
|
|
273
277
|
"types": "./types/ngstarter-ui-components-expand.d.ts",
|
|
274
278
|
"default": "./fesm2022/ngstarter-ui-components-expand.mjs"
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
|
|
3
|
+
type EventTone = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'neutral';
|
|
4
|
+
type EventsListGroupBy = 'none' | 'day' | 'week';
|
|
5
|
+
|
|
6
|
+
declare class EventsList {
|
|
7
|
+
groupBy: i0.InputSignal<EventsListGroupBy>;
|
|
8
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventsList, never>;
|
|
9
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventsList, "ngs-events-list", ["ngsEventsList"], { "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
declare class EventsSection {
|
|
13
|
+
label: i0.InputSignal<string>;
|
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventsSection, never>;
|
|
15
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventsSection, "ngs-events-section", ["ngsEventsSection"], { "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
declare class Event {
|
|
19
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<Event, never>;
|
|
20
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<Event, "ngs-event", ["ngsEvent"], {}, {}, never, ["ngs-event-date,[ngs-event-date]", "ngs-event-title,[ngs-event-title]", "ngs-event-status,[ngs-event-status]", "ngs-event-time,[ngs-event-time]", "ngs-event-description,[ngs-event-description]", "*", "[ngsEventActions]"], true, never>;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
declare class EventDate {
|
|
24
|
+
weekday: i0.InputSignal<string>;
|
|
25
|
+
day: i0.InputSignal<string | number>;
|
|
26
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventDate, never>;
|
|
27
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventDate, "ngs-event-date,[ngs-event-date]", ["ngsEventDate"], { "weekday": { "alias": "weekday"; "required": false; "isSignal": true; }; "day": { "alias": "day"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
declare class EventTitle {
|
|
31
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventTitle, never>;
|
|
32
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventTitle, "ngs-event-title,[ngs-event-title]", ["ngsEventTitle"], {}, {}, never, ["*"], true, never>;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
declare class EventStatus {
|
|
36
|
+
tone: i0.InputSignal<EventTone>;
|
|
37
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventStatus, never>;
|
|
38
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventStatus, "ngs-event-status,[ngs-event-status]", ["ngsEventStatus"], { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
declare class EventTime {
|
|
42
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventTime, never>;
|
|
43
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventTime, "ngs-event-time,[ngs-event-time]", ["ngsEventTime"], {}, {}, never, ["*"], true, never>;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
declare class EventDescription {
|
|
47
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventDescription, never>;
|
|
48
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<EventDescription, "ngs-event-description,[ngs-event-description]", ["ngsEventDescription"], {}, {}, never, ["*"], true, never>;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
declare class EventActionsDirective {
|
|
52
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EventActionsDirective, never>;
|
|
53
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<EventActionsDirective, "[ngsEventActions]", ["ngsEventActions"], {}, {}, never, never, true, never>;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
export { Event, EventActionsDirective, EventDate, EventDescription, EventStatus, EventTime, EventTitle, EventsList, EventsSection };
|
|
57
|
+
export type { EventTone, EventsListGroupBy };
|