@sebgroup/green-angular 1.0.0-alpha.1 → 1.0.0-beta.4

package/README.md

@@ -0,0 +1,27 @@
+# GreenAngular
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.2.0.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

package/esm2020/index.mjs

@@ -0,0 +1,6 @@
+export * from './lib/green-angular.module';
+export * from './lib/dropdown/dropdown.module';
+export * from './lib/dropdown/dropdown.component';
+export * from './lib/segmented-control/segmented-control.module';
+export * from './lib/segmented-control/segmented-control.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXIvc3JjL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUE7QUFDMUMsY0FBYyxnQ0FBZ0MsQ0FBQTtBQUM5QyxjQUFjLG1DQUFtQyxDQUFBO0FBQ2pELGNBQWMsa0RBQWtELENBQUE7QUFDaEUsY0FBYyxxREFBcUQsQ0FBQSIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL2dyZWVuLWFuZ3VsYXIubW9kdWxlJ1xuZXhwb3J0ICogZnJvbSAnLi9saWIvZHJvcGRvd24vZHJvcGRvd24ubW9kdWxlJ1xuZXhwb3J0ICogZnJvbSAnLi9saWIvZHJvcGRvd24vZHJvcGRvd24uY29tcG9uZW50J1xuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wubW9kdWxlJ1xuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50J1xuIl19

package/esm2020/lib/dropdown/dropdown.component.mjs

@@ -0,0 +1,196 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, ViewChild, } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { createDropdown, } from '@sebgroup/extract';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class NggDropdownComponent {
+    constructor(cd) {
+        this.cd = cd;
+        this.options = [];
+        this.value = undefined;
+        this.trackByKey = (index, option) => {
+            return option.key;
+        };
+    }
+    ngAfterViewInit() {
+        if (this.togglerRef?.nativeElement && this.listboxRef?.nativeElement) {
+            this.handler = createDropdown(this.props, this.togglerRef.nativeElement, this.listboxRef.nativeElement, (dropdown) => {
+                this.dropdown = dropdown;
+                this.toggler = dropdown.elements.toggler;
+                this.listbox = dropdown.elements.listbox;
+                this.cd.detectChanges();
+            });
+            this.selectFromValue(this.value);
+        }
+    }
+    ngOnDestroy() {
+        this.handler?.destroy();
+    }
+    ngOnChanges() {
+        if (this.handler && this.dropdown) {
+            this.handler.update(this.props);
+        }
+    }
+    writeValue(obj) {
+        this.value = obj;
+        this.selectFromValue(this.value);
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    select(option) {
+        this.handler?.select(option);
+        this.onChangeFn && this.onChangeFn(option.value);
+        this.onTouchedFn && this.onTouchedFn();
+    }
+    get props() {
+        return {
+            id: this.id,
+            text: this.text,
+            options: this.options,
+            loop: this.loop,
+        };
+    }
+    selectFromValue(value) {
+        if (this.handler && value !== undefined) {
+            const option = this.handler.dropdown.options.find((option) => option.value === value);
+            if (option)
+                this.handler?.select(option);
+        }
+    }
+}
+NggDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NggDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggDropdownComponent, selector: "ngg-dropdown", inputs: { id: "id", text: "text", loop: "loop", options: "options" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: NggDropdownComponent,
+            multi: true,
+        },
+    ], viewQueries: [{ propertyName: "togglerRef", first: true, predicate: ["togglerRef"], descendants: true }, { propertyName: "listboxRef", first: true, predicate: ["listboxRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-dropdown',
+                    template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: NggDropdownComponent,
+                            multi: true,
+                        },
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], loop: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], togglerRef: [{
+                type: ViewChild,
+                args: ['togglerRef']
+            }], listboxRef: [{
+                type: ViewChild,
+                args: ['listboxRef']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy9saWIvZHJvcGRvd24vZHJvcGRvd24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFFTCx1QkFBdUIsRUFDdkIsaUJBQWlCLEVBQ2pCLFNBQVMsRUFFVCxLQUFLLEVBR0wsU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFBO0FBQ3RCLE9BQU8sRUFBd0IsaUJBQWlCLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQTtBQUN4RSxPQUFPLEVBQ0wsY0FBYyxHQU9mLE1BQU0sbUJBQW1CLENBQUE7OztBQTZEMUIsTUFBTSxPQUFPLG9CQUFvQjtJQXlCL0IsWUFBb0IsRUFBcUI7UUFBckIsT0FBRSxHQUFGLEVBQUUsQ0FBbUI7UUFuQmhDLFlBQU8sR0FBcUIsRUFBRSxDQUFBO1FBVXZDLFVBQUssR0FBUSxTQUFTLENBQUE7UUEwRHRCLGVBQVUsR0FBRyxDQUFDLEtBQWEsRUFBRSxNQUE4QixFQUFVLEVBQUU7WUFDckUsT0FBTyxNQUFNLENBQUMsR0FBRyxDQUFBO1FBQ25CLENBQUMsQ0FBQTtJQW5EMkMsQ0FBQztJQUU3QyxlQUFlO1FBQ2IsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFLGFBQWEsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFLGFBQWEsRUFBRTtZQUNwRSxJQUFJLENBQUMsT0FBTyxHQUFHLGNBQWMsQ0FDM0IsSUFBSSxDQUFDLEtBQUssRUFDVixJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFDN0IsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQzdCLENBQUMsUUFBUSxFQUFFLEVBQUU7Z0JBQ1gsSUFBSSxDQUFDLFFBQVEsR0FBRyxRQUFRLENBQUE7Z0JBQ3hCLElBQUksQ0FBQyxPQUFPLEdBQUcsUUFBUSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUE7Z0JBQ3hDLElBQUks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QkFBZixLQUFLO2dCQUUwQixVQUFVO3NCQUF6QyxTQUFTO3VCQUFDLFlBQVk7Z0JBSVMsVUFBVTtzQkFBekMsU0FBUzt1QkFBQyxZQUFZIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIElucHV0LFxuICBPbkNoYW5nZXMsXG4gIE9uRGVzdHJveSxcbiAgVmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJ1xuaW1wb3J0IHsgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnXG5pbXBvcnQge1xuICBjcmVhdGVEcm9wZG93bixcbiAgQWJzdHJhY3REcm9wZG93bixcbiAgRHJvcGRvd25IYW5kbGVyLFxuICBEcm9wZG93bk9wdGlvbixcbiAgRXh0ZW5kZWREcm9wZG93bk9wdGlvbixcbiAgRWxlbWVudFByb3BzLFxuICBEcm9wZG93bkFyZ3MsXG59IGZyb20gJ0BzZWJncm91cC9leHRyYWN0J1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduZ2ctZHJvcGRvd24nLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXY+XG4gICAgICA8YnV0dG9uXG4gICAgICAgICN0b2dnbGVyUmVmXG4gICAgICAgIFtpZF09XCJ0b2dnbGVyPy5hdHRyaWJ1dGVzPy5pZFwiXG4gICAgICAgIFthdHRyLmFyaWEtaGFzcG9wdXBdPVwidG9nZ2xlcj8uYXR0cmlidXRlcz8uWydhcmlhLWhhc3BvcHVwJ11cIlxuICAgICAgICBbYXR0ci5hcmlhLWV4cGFuZGVkXT1cInRvZ2dsZXI/LmF0dHJpYnV0ZXM/LlsnYXJpYS1leHBhbmRlZCddXCJcbiAgICAgICAgW2F0dHIuYXJpYS1vd25zXT1cInRvZ2dsZXI/LmF0dHJpYnV0ZXM/LlsnYXJpYS1vd25zJ11cIlxuICAgICAgICBbdGFiaW5kZXhdPVwidG9nZ2xlcj8uYXR0cmlidXRlcz8udGFiSW5kZXhcIlxuICAgICAgICBbc3R5bGVdPVwidG9nZ2xlcj8uYXR0cmlidXRlcz8uc3R5bGVcIlxuICAgICAgICBbY2xhc3NdPVwidG9nZ2xlcj8uY2xhc3Nlc1wiXG4gICAgICAgIChjbGljayk9XCJoYW5kbGVyPy50b2dnbGUoKVwiXG4gICAgICA+XG4gICAgICAgIHt7IGRyb3Bkb3duPy50ZXh0IH19XG4gICAgICA8L2J1dHRvbj5cbiAgICAgIDxkaXZcbiAgICAgICAgI2xpc3Rib3hSZWZcbiAgICAgICAgW2lkXT1cImxpc3Rib3g/LmF0dHJpYnV0ZXM/LmlkXCJcbiAgICAgICAgW2F0dHIucm9sZV09XCJsaXN0Ym94Py5hdHRyaWJ1dGVzPy5yb2xlXCJcbiAgICAgICAgW2F0dHIuYXJpYS1hY3RpdmVkZXNjZW5kYW50XT1cIlxuICAgICAgICAgIGxpc3Rib3g/LmF0dHJpYnV0ZXM/LlsnYXJpYS1hY3RpdmVkZXNjZW5kYW50J11cbiAgICAgICAgXCJcbiAgICAgICAgW3RhYmluZGV4XT1cImxpc3Rib3g/LmF0dHJpYnV0ZXM/LnRhYkluZGV4XCJcbiAgICAgICAgW3N0eWxlXT1cImxpc3Rib3g/LmF0dHJpYnV0ZXM/LnN0eWxlXCJcbiAgICAgICAgW2NsYXNzXT1cImxpc3Rib3g/LmNsYXNzZXNcIlxuICAgICAgPlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgY2xhc3M9XCJjbG9zZSBtLTQgbS1zbS0yIGQtYmxvY2sgZC1zbS1ub25lXCJcbiAgICAgICAgICAoY2xpY2spPVwiaGFuZGxlcj8uY2xvc2UoKVwiXG4gICAgICAgID5cbiAgICAgICAgICA8c3BhbiBjbGFzcz1cInNyLW9ubHlcIj5DbG9zZTwvc3Bhbj5cbiAgICAgICAgPC9idXR0b24+XG4gICAgICAgIDx1bCByb2xlPVwibGlzdGJveFwiPlxuICAgICAgICAgIDxsaVxuICAgICAgICAgICAgKm5nRm9yPVwibGV0IG9wdGlvbiBvZiBkcm9wZG93bj8ub3B0aW9uczsgdHJhY2tCeTogdHJhY2tCeUtleVwiXG4gICAgICAgICAgICBbaWRdPVwib3B0aW9uLmF0dHJpYnV0ZXMuaWRcIlxuICAgICAgICAgICAgW2F0dHIucm9sZV09XCJvcHRpb24uYXR0cmlidXRlcy5yb2xlXCJcbiAgICAgICAgICAgIFthdHRyLmFyaWEtc2VsZWN0ZWRdPVwib3B0aW9uLmF0dHJpYnV0ZXNbJ2FyaWEtc2VsZWN0ZWQnXVwiXG4gICAgICAgICAgICBbc3R5bGVdPVwib3B0aW9uLmF0dHJpYnV0ZXMuc3R5bGVcIlxuICAgICAgICAgICAgW2NsYXNzXT1cIm9wdGlvbi5jbGFzc2VzXCJcbiAgICAgICAgICAgIChjbGljayk9XCJzZWxlY3Qob3B0aW9uKVwiXG4gICAgICAgICAgPlxuICAgICAgICAgICAge3sgb3B0aW9uLmtleSB9fVxuICAgICAgICAgIDwvbGk+XG4gICAgICAgIDwvdWw+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICB1c2VFeGlzdGluZzogTmdnRHJvcGRvd25Db21wb25lbnQsXG4gICAgICBtdWx0aTogdHJ1ZSxcbiAgICB9LFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTmdnRHJvcGRvd25Db21wb25lbnRcbiAgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciwgQWZ0ZXJWaWV3SW5pdCwgT25EZXN0cm95LCBPbkNoYW5nZXNcbntcbiAgQElucHV0KCkgaWQ/OiBzdHJpbmdcbiAgQElucHV0KCkgdGV4dD86IHN0cmluZ1xuICBASW5wdXQoKSBsb29wPzogYm9vbGVhblxuICBASW5wdXQoKSBvcHRpb25zOiBEcm9wZG93bk9wdGlvbltdID0gW11cblxuICBAVmlld0NoaWxkKCd0b2dnbGVyUmVmJykgcHVibGljIHRvZ2dsZXJSZWY6XG4gICAgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PlxuICAgIHwgdW5kZWZpbmVkXG5cbiAgQFZpZXdDaGlsZCgnbGlzdGJveFJlZicpIHB1YmxpYyBsaXN0Ym94UmVmOlxuICAgIHwgRWxlbWVudFJlZjxIVE1MRWxlbWVudD5cbiAgICB8IHVuZGVmaW5lZFxuXG4gIHZhbHVlOiBhbnkgPSB1bmRlZmluZWRcbiAgb25DaGFuZ2VGbj86IGFueVxuICBvblRvdWNoZWRGbj86IGFueVxuXG4gIGRyb3Bkb3duPzogQWJzdHJhY3REcm9wZG93blxuICBoYW5kbGVyPzogRHJvcGRvd25IYW5kbGVyXG4gIHRvZ2dsZXI/OiBQYXJ0aWFsPEVsZW1lbnRQcm9wcz5cbiAgbGlzdGJveD86IFBhcnRpYWw8RWxlbWVudFByb3BzPlxuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgY2Q6IENoYW5nZURldGVjdG9yUmVmKSB7fVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy50b2dnbGVyUmVmPy5uYXRpdmVFbGVtZW50ICYmIHRoaXMubGlzdGJveFJlZj8ubmF0aXZlRWxlbWVudCkge1xuICAgICAgdGhpcy5oYW5kbGVyID0gY3JlYXRlRHJvcGRvd24oXG4gICAgICAgIHRoaXMucHJvcHMsXG4gICAgICAgIHRoaXMudG9nZ2xlclJlZi5uYXRpdmVFbGVtZW50LFxuICAgICAgICB0aGlzLmxpc3Rib3hSZWYubmF0aXZlRWxlbWVudCxcbiAgICAgICAgKGRyb3Bkb3duKSA9PiB7XG4gICAgICAgICAgdGhpcy5kcm9wZG93biA9IGRyb3Bkb3duXG4gICAgICAgICAgdGhpcy50b2dnbGVyID0gZHJvcGRvd24uZWxlbWVudHMudG9nZ2xlclxuICAgICAgICAgIHRoaXMubGlzdGJveCA9IGRyb3Bkb3duLmVsZW1lbnRzLmxpc3Rib3hcbiAgICAgICAgICB0aGlzLmNkLmRldGVjdENoYW5nZXMoKVxuICAgICAgICB9XG4gICAgICApXG5cbiAgICAgIHRoaXMuc2VsZWN0RnJvbVZhbHVlKHRoaXMudmFsdWUpXG4gICAgfVxuICB9XG5cbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgdGhpcy5oYW5kbGVyPy5kZXN0cm95KClcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmhhbmRsZXIgJiYgdGhpcy5kcm9wZG93bikge1xuICAgICAgdGhpcy5oYW5kbGVyLnVwZGF0ZSh0aGlzLnByb3BzKVxuICAgIH1cbiAgfVxuXG4gIHdyaXRlVmFsdWUob2JqOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLnZhbHVlID0gb2JqXG4gICAgdGhpcy5zZWxlY3RGcm9tVmFsdWUodGhpcy52YWx1ZSlcbiAgfVxuXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46IGFueSk6IHZvaWQge1xuICAgIHRoaXMub25DaGFuZ2VGbiA9IGZuXG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XG4gICAgdGhpcy5vblRvdWNoZWRGbiA9IGZuXG4gIH1cblxuICBzZWxlY3Qob3B0aW9uOiBFeHRlbmRlZERyb3Bkb3duT3B0aW9uKSB7XG4gICAgdGhpcy5oYW5kbGVyPy5zZWxlY3Qob3B0aW9uKVxuICAgIHRoaXMub25DaGFuZ2VGbiAmJiB0aGlzLm9uQ2hhbmdlRm4ob3B0aW9uLnZhbHVlKVxuICAgIHRoaXMub25Ub3VjaGVkRm4gJiYgdGhpcy5vblRvdWNoZWRGbigpXG4gIH1cblxuICB0cmFja0J5S2V5ID0gKGluZGV4OiBudW1iZXIsIG9wdGlvbjogRXh0ZW5kZWREcm9wZG93bk9wdGlvbik6IHN0cmluZyA9PiB7XG4gICAgcmV0dXJuIG9wdGlvbi5rZXlcbiAgfVxuXG4gIHByaXZhdGUgZ2V0IHByb3BzKCk6IERyb3Bkb3duQXJncyB7XG4gICAgcmV0dXJuIHtcbiAgICAgIGlkOiB0aGlzLmlkLFxuICAgICAgdGV4dDogdGhpcy50ZXh0LFxuICAgICAgb3B0aW9uczogdGhpcy5vcHRpb25zLFxuICAgICAgbG9vcDogdGhpcy5sb29wLFxuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgc2VsZWN0RnJvbVZhbHVlKHZhbHVlOiBhbnkpIHtcbiAgICBpZiAodGhpcy5oYW5kbGVyICYmIHZhbHVlICE9PSB1bmRlZmluZWQpIHtcbiAgICAgIGNvbnN0IG9wdGlvbiA9IHRoaXMuaGFuZGxlci5kcm9wZG93bi5vcHRpb25zLmZpbmQoXG4gICAgICAgIChvcHRpb24pID0+IG9wdGlvbi52YWx1ZSA9PT0gdmFsdWVcbiAgICAgIClcbiAgICAgIGlmIChvcHRpb24pIHRoaXMuaGFuZGxlcj8uc2VsZWN0KG9wdGlvbilcbiAgICB9XG4gIH1cbn1cbiJdfQ==

package/esm2020/lib/dropdown/dropdown.module.mjs

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NggDropdownComponent } from './dropdown.component';
+import * as i0 from "@angular/core";
+export class NggDropdownModule {
+}
+NggDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, declarations: [NggDropdownComponent], imports: [CommonModule], exports: [NggDropdownComponent] });
+NggDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggDropdownComponent],
+                    imports: [CommonModule],
+                    exports: [NggDropdownComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy9saWIvZHJvcGRvd24vZHJvcGRvd24ubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUE7QUFDeEMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFBO0FBQzlDLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHNCQUFzQixDQUFBOztBQU8zRCxNQUFNLE9BQU8saUJBQWlCOzs4R0FBakIsaUJBQWlCOytHQUFqQixpQkFBaUIsaUJBSmIsb0JBQW9CLGFBQ3pCLFlBQVksYUFDWixvQkFBb0I7K0dBRW5CLGlCQUFpQixZQUhuQixDQUFDLFlBQVksQ0FBQzsyRkFHWixpQkFBaUI7a0JBTDdCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsb0JBQW9CLENBQUM7b0JBQ3BDLE9BQU8sRUFBRSxDQUFDLFlBQVksQ0FBQztvQkFDdkIsT0FBTyxFQUFFLENBQUMsb0JBQW9CLENBQUM7aUJBQ2hDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJ1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJ1xuaW1wb3J0IHsgTmdnRHJvcGRvd25Db21wb25lbnQgfSBmcm9tICcuL2Ryb3Bkb3duLmNvbXBvbmVudCdcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbTmdnRHJvcGRvd25Db21wb25lbnRdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlXSxcbiAgZXhwb3J0czogW05nZ0Ryb3Bkb3duQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgTmdnRHJvcGRvd25Nb2R1bGUge31cbiJdfQ==

package/esm2020/lib/green-angular.module.mjs

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NggSegmentedControlModule } from './segmented-control/segmented-control.module';
+import { NggDropdownModule } from './dropdown/dropdown.module';
+import * as i0 from "@angular/core";
+export class NggModule {
+}
+NggModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [CommonModule], exports: [NggSegmentedControlModule, NggDropdownModule] });
+NggModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [[CommonModule], NggSegmentedControlModule, NggDropdownModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [CommonModule],
+                    exports: [NggSegmentedControlModule, NggDropdownModule],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JlZW4tYW5ndWxhci5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXIvc3JjL2xpYi9ncmVlbi1hbmd1bGFyLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFBO0FBQ3hDLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUM5QyxPQUFPLEVBQUUseUJBQXlCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQTtBQUN4RixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQTs7QUFPOUQsTUFBTSxPQUFPLFNBQVM7O3NHQUFULFNBQVM7dUdBQVQsU0FBUyxZQUhWLFlBQVksYUFDWix5QkFBeUIsRUFBRSxpQkFBaUI7dUdBRTNDLFNBQVMsWUFIWCxDQUFDLFlBQVksQ0FBQyxFQUNiLHlCQUF5QixFQUFFLGlCQUFpQjsyRkFFM0MsU0FBUztrQkFMckIsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsRUFBRTtvQkFDaEIsT0FBTyxFQUFFLENBQUMsWUFBWSxDQUFDO29CQUN2QixPQUFPLEVBQUUsQ0FBQyx5QkFBeUIsRUFBRSxpQkFBaUIsQ0FBQztpQkFDeEQiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nXG5pbXBvcnQgeyBOZ2dTZWdtZW50ZWRDb250cm9sTW9kdWxlIH0gZnJvbSAnLi9zZWdtZW50ZWQtY29udHJvbC9zZWdtZW50ZWQtY29udHJvbC5tb2R1bGUnXG5pbXBvcnQgeyBOZ2dEcm9wZG93bk1vZHVsZSB9IGZyb20gJy4vZHJvcGRvd24vZHJvcGRvd24ubW9kdWxlJ1xuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlXSxcbiAgZXhwb3J0czogW05nZ1NlZ21lbnRlZENvbnRyb2xNb2R1bGUsIE5nZ0Ryb3Bkb3duTW9kdWxlXSxcbn0pXG5leHBvcnQgY2xhc3MgTmdnTW9kdWxlIHt9XG4iXX0=

package/esm2020/lib/segmented-control/segmented-control.component.mjs

@@ -0,0 +1,40 @@
+import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/router";
+export class NggSegmentedControlComponent {
+}
+NggSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NggSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggSegmentedControlComponent, selector: "ngg-segmented-control", inputs: { $controls: "$controls" }, ngImport: i0, template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-segmented-control',
+                    template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `,
+                    styles: [],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { $controls: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsdUJBQXVCLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFBOzs7O0FBc0J6RSxNQUFNLE9BQU8sNEJBQTRCOzt5SEFBNUIsNEJBQTRCOzZHQUE1Qiw0QkFBNEIsaUdBZDdCOzs7Ozs7Ozs7O0dBVVQ7MkZBSVUsNEJBQTRCO2tCQWhCeEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsdUJBQXVCO29CQUNqQyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7R0FVVDtvQkFDRCxNQUFNLEVBQUUsRUFBRTtvQkFDVixlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtpQkFDaEQ7OEJBRVUsU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcbmltcG9ydCB7IE9ic2VydmFibGUgfSBmcm9tICdyeGpzJ1xuZXhwb3J0IGludGVyZmFjZSBTZWdtZW50ZWRDb250cm9sIHtcbiAgdXJsOiBzdHJpbmdcbiAgdGV4dDogT2JzZXJ2YWJsZTxzdHJpbmc+IHwgc3RyaW5nXG59XG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduZ2ctc2VnbWVudGVkLWNvbnRyb2wnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgY2xhc3M9XCJncm91cFwiPlxuICAgICAgPGFcbiAgICAgICAgKm5nRm9yPVwibGV0IGNvbnRyb2wgb2YgJGNvbnRyb2xzIHwgYXN5bmNcIlxuICAgICAgICBbcm91dGVyTGlua109XCJjb250cm9sLnVybFwiXG4gICAgICAgIHJvdXRlckxpbmtBY3RpdmU9XCJhY3RpdmVcIlxuICAgICAgICBjbGFzcz1cImJ1dHRvblwiXG4gICAgICAgID57eyBjb250cm9sLnRleHQgfX08L2FcbiAgICAgID5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVzOiBbXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIE5nZ1NlZ21lbnRlZENvbnRyb2xDb21wb25lbnQge1xuICBASW5wdXQoKSAkY29udHJvbHM6IE9ic2VydmFibGU8QXJyYXk8U2VnbWVudGVkQ29udHJvbD4+IHwgdW5kZWZpbmVkXG59XG4iXX0=

package/esm2020/lib/segmented-control/segmented-control.module.mjs

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NggSegmentedControlComponent } from './segmented-control.component';
+import { RouterModule } from '@angular/router';
+import * as i0 from "@angular/core";
+export class NggSegmentedControlModule {
+}
+NggSegmentedControlModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggSegmentedControlModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, declarations: [NggSegmentedControlComponent], imports: [RouterModule, CommonModule], exports: [NggSegmentedControlComponent] });
+NggSegmentedControlModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, imports: [[RouterModule, CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggSegmentedControlComponent],
+                    imports: [RouterModule, CommonModule],
+                    exports: [NggSegmentedControlComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUE7QUFDeEMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFBO0FBQzlDLE9BQU8sRUFBRSw0QkFBNEIsRUFBRSxNQUFNLCtCQUErQixDQUFBO0FBQzVFLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTs7QUFPOUMsTUFBTSxPQUFPLHlCQUF5Qjs7c0hBQXpCLHlCQUF5Qjt1SEFBekIseUJBQXlCLGlCQUpyQiw0QkFBNEIsYUFDakMsWUFBWSxFQUFFLFlBQVksYUFDMUIsNEJBQTRCO3VIQUUzQix5QkFBeUIsWUFIM0IsQ0FBQyxZQUFZLEVBQUUsWUFBWSxDQUFDOzJGQUcxQix5QkFBeUI7a0JBTHJDLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsNEJBQTRCLENBQUM7b0JBQzVDLE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxZQUFZLENBQUM7b0JBQ3JDLE9BQU8sRUFBRSxDQUFDLDRCQUE0QixDQUFDO2lCQUN4QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbidcbmltcG9ydCB7IE5nZ1NlZ21lbnRlZENvbnRyb2xDb21wb25lbnQgfSBmcm9tICcuL3NlZ21lbnRlZC1jb250cm9sLmNvbXBvbmVudCdcbmltcG9ydCB7IFJvdXRlck1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcidcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbTmdnU2VnbWVudGVkQ29udHJvbENvbXBvbmVudF0sXG4gIGltcG9ydHM6IFtSb3V0ZXJNb2R1bGUsIENvbW1vbk1vZHVsZV0sXG4gIGV4cG9ydHM6IFtOZ2dTZWdtZW50ZWRDb250cm9sQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgTmdnU2VnbWVudGVkQ29udHJvbE1vZHVsZSB7fVxuIl19

package/esm2020/sebgroup-green-angular.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2ViZ3JvdXAtZ3JlZW4tYW5ndWxhci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvYW5ndWxhci9zcmMvc2ViZ3JvdXAtZ3JlZW4tYW5ndWxhci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2luZGV4JztcbiJdfQ==

package/fesm2015/sebgroup-green-angular.mjs

@@ -0,0 +1,288 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, NgModule, ViewChild } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { createDropdown } from '@sebgroup/extract';
+
+class NggSegmentedControlComponent {
+}
+NggSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NggSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggSegmentedControlComponent, selector: "ngg-segmented-control", inputs: { $controls: "$controls" }, ngImport: i0, template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-segmented-control',
+                    template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `,
+                    styles: [],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { $controls: [{
+                type: Input
+            }] } });
+
+class NggSegmentedControlModule {
+}
+NggSegmentedControlModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggSegmentedControlModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, declarations: [NggSegmentedControlComponent], imports: [RouterModule, CommonModule], exports: [NggSegmentedControlComponent] });
+NggSegmentedControlModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, imports: [[RouterModule, CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggSegmentedControlComponent],
+                    imports: [RouterModule, CommonModule],
+                    exports: [NggSegmentedControlComponent],
+                }]
+        }] });
+
+class NggDropdownComponent {
+    constructor(cd) {
+        this.cd = cd;
+        this.options = [];
+        this.value = undefined;
+        this.trackByKey = (index, option) => {
+            return option.key;
+        };
+    }
+    ngAfterViewInit() {
+        var _a, _b;
+        if (((_a = this.togglerRef) === null || _a === void 0 ? void 0 : _a.nativeElement) && ((_b = this.listboxRef) === null || _b === void 0 ? void 0 : _b.nativeElement)) {
+            this.handler = createDropdown(this.props, this.togglerRef.nativeElement, this.listboxRef.nativeElement, (dropdown) => {
+                this.dropdown = dropdown;
+                this.toggler = dropdown.elements.toggler;
+                this.listbox = dropdown.elements.listbox;
+                this.cd.detectChanges();
+            });
+            this.selectFromValue(this.value);
+        }
+    }
+    ngOnDestroy() {
+        var _a;
+        (_a = this.handler) === null || _a === void 0 ? void 0 : _a.destroy();
+    }
+    ngOnChanges() {
+        if (this.handler && this.dropdown) {
+            this.handler.update(this.props);
+        }
+    }
+    writeValue(obj) {
+        this.value = obj;
+        this.selectFromValue(this.value);
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    select(option) {
+        var _a;
+        (_a = this.handler) === null || _a === void 0 ? void 0 : _a.select(option);
+        this.onChangeFn && this.onChangeFn(option.value);
+        this.onTouchedFn && this.onTouchedFn();
+    }
+    get props() {
+        return {
+            id: this.id,
+            text: this.text,
+            options: this.options,
+            loop: this.loop,
+        };
+    }
+    selectFromValue(value) {
+        var _a;
+        if (this.handler && value !== undefined) {
+            const option = this.handler.dropdown.options.find((option) => option.value === value);
+            if (option)
+                (_a = this.handler) === null || _a === void 0 ? void 0 : _a.select(option);
+        }
+    }
+}
+NggDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NggDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggDropdownComponent, selector: "ngg-dropdown", inputs: { id: "id", text: "text", loop: "loop", options: "options" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: NggDropdownComponent,
+            multi: true,
+        },
+    ], viewQueries: [{ propertyName: "togglerRef", first: true, predicate: ["togglerRef"], descendants: true }, { propertyName: "listboxRef", first: true, predicate: ["listboxRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-dropdown',
+                    template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: NggDropdownComponent,
+                            multi: true,
+                        },
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], loop: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], togglerRef: [{
+                type: ViewChild,
+                args: ['togglerRef']
+            }], listboxRef: [{
+                type: ViewChild,
+                args: ['listboxRef']
+            }] } });
+
+class NggDropdownModule {
+}
+NggDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, declarations: [NggDropdownComponent], imports: [CommonModule], exports: [NggDropdownComponent] });
+NggDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggDropdownComponent],
+                    imports: [CommonModule],
+                    exports: [NggDropdownComponent],
+                }]
+        }] });
+
+class NggModule {
+}
+NggModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [CommonModule], exports: [NggSegmentedControlModule, NggDropdownModule] });
+NggModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [[CommonModule], NggSegmentedControlModule, NggDropdownModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [CommonModule],
+                    exports: [NggSegmentedControlModule, NggDropdownModule],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NggDropdownComponent, NggDropdownModule, NggModule, NggSegmentedControlComponent, NggSegmentedControlModule };
+//# sourceMappingURL=sebgroup-green-angular.mjs.map

package/fesm2015/sebgroup-green-angular.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sebgroup-green-angular.mjs","sources":["../../../../libs/angular/src/lib/segmented-control/segmented-control.component.ts","../../../../libs/angular/src/lib/segmented-control/segmented-control.module.ts","../../../../libs/angular/src/lib/dropdown/dropdown.component.ts","../../../../libs/angular/src/lib/dropdown/dropdown.module.ts","../../../../libs/angular/src/lib/green-angular.module.ts","../../../../libs/angular/src/sebgroup-green-angular.ts"],"sourcesContent":["import { Component, ChangeDetectionStrategy, Input } from '@angular/core'\nimport { Observable } from 'rxjs'\nexport interface SegmentedControl {\n  url: string\n  text: Observable<string> | string\n}\n@Component({\n  selector: 'ngg-segmented-control',\n  template: `\n    <div class=\"group\">\n      <a\n        *ngFor=\"let control of $controls | async\"\n        [routerLink]=\"control.url\"\n        routerLinkActive=\"active\"\n        class=\"button\"\n        >{{ control.text }}</a\n      >\n    </div>\n  `,\n  styles: [],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NggSegmentedControlComponent {\n  @Input() $controls: Observable<Array<SegmentedControl>> | undefined\n}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggSegmentedControlComponent } from './segmented-control.component'\nimport { RouterModule } from '@angular/router'\n\n@NgModule({\n  declarations: [NggSegmentedControlComponent],\n  imports: [RouterModule, CommonModule],\n  exports: [NggSegmentedControlComponent],\n})\nexport class NggSegmentedControlModule {}\n","import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  Input,\n  OnChanges,\n  OnDestroy,\n  ViewChild,\n} from '@angular/core'\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'\nimport {\n  createDropdown,\n  AbstractDropdown,\n  DropdownHandler,\n  DropdownOption,\n  ExtendedDropdownOption,\n  ElementProps,\n  DropdownArgs,\n} from '@sebgroup/extract'\n\n@Component({\n  selector: 'ngg-dropdown',\n  template: `\n    <div>\n      <button\n        #togglerRef\n        [id]=\"toggler?.attributes?.id\"\n        [attr.aria-haspopup]=\"toggler?.attributes?.['aria-haspopup']\"\n        [attr.aria-expanded]=\"toggler?.attributes?.['aria-expanded']\"\n        [attr.aria-owns]=\"toggler?.attributes?.['aria-owns']\"\n        [tabindex]=\"toggler?.attributes?.tabIndex\"\n        [style]=\"toggler?.attributes?.style\"\n        [class]=\"toggler?.classes\"\n        (click)=\"handler?.toggle()\"\n      >\n        {{ dropdown?.text }}\n      </button>\n      <div\n        #listboxRef\n        [id]=\"listbox?.attributes?.id\"\n        [attr.role]=\"listbox?.attributes?.role\"\n        [attr.aria-activedescendant]=\"\n          listbox?.attributes?.['aria-activedescendant']\n        \"\n        [tabindex]=\"listbox?.attributes?.tabIndex\"\n        [style]=\"listbox?.attributes?.style\"\n        [class]=\"listbox?.classes\"\n      >\n        <button\n          class=\"close m-4 m-sm-2 d-block d-sm-none\"\n          (click)=\"handler?.close()\"\n        >\n          <span class=\"sr-only\">Close</span>\n        </button>\n        <ul role=\"listbox\">\n          <li\n            *ngFor=\"let option of dropdown?.options; trackBy: trackByKey\"\n            [id]=\"option.attributes.id\"\n            [attr.role]=\"option.attributes.role\"\n            [attr.aria-selected]=\"option.attributes['aria-selected']\"\n            [style]=\"option.attributes.style\"\n            [class]=\"option.classes\"\n            (click)=\"select(option)\"\n          >\n            {{ option.key }}\n          </li>\n        </ul>\n      </div>\n    </div>\n  `,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: NggDropdownComponent,\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NggDropdownComponent\n  implements ControlValueAccessor, AfterViewInit, OnDestroy, OnChanges\n{\n  @Input() id?: string\n  @Input() text?: string\n  @Input() loop?: boolean\n  @Input() options: DropdownOption[] = []\n\n  @ViewChild('togglerRef') public togglerRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  @ViewChild('listboxRef') public listboxRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  value: any = undefined\n  onChangeFn?: any\n  onTouchedFn?: any\n\n  dropdown?: AbstractDropdown\n  handler?: DropdownHandler\n  toggler?: Partial<ElementProps>\n  listbox?: Partial<ElementProps>\n\n  constructor(private cd: ChangeDetectorRef) {}\n\n  ngAfterViewInit(): void {\n    if (this.togglerRef?.nativeElement && this.listboxRef?.nativeElement) {\n      this.handler = createDropdown(\n        this.props,\n        this.togglerRef.nativeElement,\n        this.listboxRef.nativeElement,\n        (dropdown) => {\n          this.dropdown = dropdown\n          this.toggler = dropdown.elements.toggler\n          this.listbox = dropdown.elements.listbox\n          this.cd.detectChanges()\n        }\n      )\n\n      this.selectFromValue(this.value)\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.handler?.destroy()\n  }\n\n  ngOnChanges(): void {\n    if (this.handler && this.dropdown) {\n      this.handler.update(this.props)\n    }\n  }\n\n  writeValue(obj: any): void {\n    this.value = obj\n    this.selectFromValue(this.value)\n  }\n\n  registerOnChange(fn: any): void {\n    this.onChangeFn = fn\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouchedFn = fn\n  }\n\n  select(option: ExtendedDropdownOption) {\n    this.handler?.select(option)\n    this.onChangeFn && this.onChangeFn(option.value)\n    this.onTouchedFn && this.onTouchedFn()\n  }\n\n  trackByKey = (index: number, option: ExtendedDropdownOption): string => {\n    return option.key\n  }\n\n  private get props(): DropdownArgs {\n    return {\n      id: this.id,\n      text: this.text,\n      options: this.options,\n      loop: this.loop,\n    }\n  }\n\n  private selectFromValue(value: any) {\n    if (this.handler && value !== undefined) {\n      const option = this.handler.dropdown.options.find(\n        (option) => option.value === value\n      )\n      if (option) this.handler?.select(option)\n    }\n  }\n}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggDropdownComponent } from './dropdown.component'\n\n@NgModule({\n  declarations: [NggDropdownComponent],\n  imports: [CommonModule],\n  exports: [NggDropdownComponent],\n})\nexport class NggDropdownModule {}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggSegmentedControlModule } from './segmented-control/segmented-control.module'\nimport { NggDropdownModule } from './dropdown/dropdown.module'\n\n@NgModule({\n  declarations: [],\n  imports: [CommonModule],\n  exports: [NggSegmentedControlModule, NggDropdownModule],\n})\nexport class NggModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2020/sebgroup-green-angular.mjs

@@ -0,0 +1,284 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, NgModule, ViewChild } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { createDropdown } from '@sebgroup/extract';
+
+class NggSegmentedControlComponent {
+}
+NggSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NggSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggSegmentedControlComponent, selector: "ngg-segmented-control", inputs: { $controls: "$controls" }, ngImport: i0, template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-segmented-control',
+                    template: `
+    <div class="group">
+      <a
+        *ngFor="let control of $controls | async"
+        [routerLink]="control.url"
+        routerLinkActive="active"
+        class="button"
+        >{{ control.text }}</a
+      >
+    </div>
+  `,
+                    styles: [],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { $controls: [{
+                type: Input
+            }] } });
+
+class NggSegmentedControlModule {
+}
+NggSegmentedControlModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggSegmentedControlModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, declarations: [NggSegmentedControlComponent], imports: [RouterModule, CommonModule], exports: [NggSegmentedControlComponent] });
+NggSegmentedControlModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, imports: [[RouterModule, CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggSegmentedControlModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggSegmentedControlComponent],
+                    imports: [RouterModule, CommonModule],
+                    exports: [NggSegmentedControlComponent],
+                }]
+        }] });
+
+class NggDropdownComponent {
+    constructor(cd) {
+        this.cd = cd;
+        this.options = [];
+        this.value = undefined;
+        this.trackByKey = (index, option) => {
+            return option.key;
+        };
+    }
+    ngAfterViewInit() {
+        if (this.togglerRef?.nativeElement && this.listboxRef?.nativeElement) {
+            this.handler = createDropdown(this.props, this.togglerRef.nativeElement, this.listboxRef.nativeElement, (dropdown) => {
+                this.dropdown = dropdown;
+                this.toggler = dropdown.elements.toggler;
+                this.listbox = dropdown.elements.listbox;
+                this.cd.detectChanges();
+            });
+            this.selectFromValue(this.value);
+        }
+    }
+    ngOnDestroy() {
+        this.handler?.destroy();
+    }
+    ngOnChanges() {
+        if (this.handler && this.dropdown) {
+            this.handler.update(this.props);
+        }
+    }
+    writeValue(obj) {
+        this.value = obj;
+        this.selectFromValue(this.value);
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    select(option) {
+        this.handler?.select(option);
+        this.onChangeFn && this.onChangeFn(option.value);
+        this.onTouchedFn && this.onTouchedFn();
+    }
+    get props() {
+        return {
+            id: this.id,
+            text: this.text,
+            options: this.options,
+            loop: this.loop,
+        };
+    }
+    selectFromValue(value) {
+        if (this.handler && value !== undefined) {
+            const option = this.handler.dropdown.options.find((option) => option.value === value);
+            if (option)
+                this.handler?.select(option);
+        }
+    }
+}
+NggDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NggDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NggDropdownComponent, selector: "ngg-dropdown", inputs: { id: "id", text: "text", loop: "loop", options: "options" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: NggDropdownComponent,
+            multi: true,
+        },
+    ], viewQueries: [{ propertyName: "togglerRef", first: true, predicate: ["togglerRef"], descendants: true }, { propertyName: "listboxRef", first: true, predicate: ["listboxRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngg-dropdown',
+                    template: `
+    <div>
+      <button
+        #togglerRef
+        [id]="toggler?.attributes?.id"
+        [attr.aria-haspopup]="toggler?.attributes?.['aria-haspopup']"
+        [attr.aria-expanded]="toggler?.attributes?.['aria-expanded']"
+        [attr.aria-owns]="toggler?.attributes?.['aria-owns']"
+        [tabindex]="toggler?.attributes?.tabIndex"
+        [style]="toggler?.attributes?.style"
+        [class]="toggler?.classes"
+        (click)="handler?.toggle()"
+      >
+        {{ dropdown?.text }}
+      </button>
+      <div
+        #listboxRef
+        [id]="listbox?.attributes?.id"
+        [attr.role]="listbox?.attributes?.role"
+        [attr.aria-activedescendant]="
+          listbox?.attributes?.['aria-activedescendant']
+        "
+        [tabindex]="listbox?.attributes?.tabIndex"
+        [style]="listbox?.attributes?.style"
+        [class]="listbox?.classes"
+      >
+        <button
+          class="close m-4 m-sm-2 d-block d-sm-none"
+          (click)="handler?.close()"
+        >
+          <span class="sr-only">Close</span>
+        </button>
+        <ul role="listbox">
+          <li
+            *ngFor="let option of dropdown?.options; trackBy: trackByKey"
+            [id]="option.attributes.id"
+            [attr.role]="option.attributes.role"
+            [attr.aria-selected]="option.attributes['aria-selected']"
+            [style]="option.attributes.style"
+            [class]="option.classes"
+            (click)="select(option)"
+          >
+            {{ option.key }}
+          </li>
+        </ul>
+      </div>
+    </div>
+  `,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: NggDropdownComponent,
+                            multi: true,
+                        },
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], loop: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], togglerRef: [{
+                type: ViewChild,
+                args: ['togglerRef']
+            }], listboxRef: [{
+                type: ViewChild,
+                args: ['listboxRef']
+            }] } });
+
+class NggDropdownModule {
+}
+NggDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, declarations: [NggDropdownComponent], imports: [CommonModule], exports: [NggDropdownComponent] });
+NggDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggDropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NggDropdownComponent],
+                    imports: [CommonModule],
+                    exports: [NggDropdownComponent],
+                }]
+        }] });
+
+class NggModule {
+}
+NggModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NggModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [CommonModule], exports: [NggSegmentedControlModule, NggDropdownModule] });
+NggModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, imports: [[CommonModule], NggSegmentedControlModule, NggDropdownModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NggModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [CommonModule],
+                    exports: [NggSegmentedControlModule, NggDropdownModule],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NggDropdownComponent, NggDropdownModule, NggModule, NggSegmentedControlComponent, NggSegmentedControlModule };
+//# sourceMappingURL=sebgroup-green-angular.mjs.map

package/fesm2020/sebgroup-green-angular.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sebgroup-green-angular.mjs","sources":["../../../../libs/angular/src/lib/segmented-control/segmented-control.component.ts","../../../../libs/angular/src/lib/segmented-control/segmented-control.module.ts","../../../../libs/angular/src/lib/dropdown/dropdown.component.ts","../../../../libs/angular/src/lib/dropdown/dropdown.module.ts","../../../../libs/angular/src/lib/green-angular.module.ts","../../../../libs/angular/src/sebgroup-green-angular.ts"],"sourcesContent":["import { Component, ChangeDetectionStrategy, Input } from '@angular/core'\nimport { Observable } from 'rxjs'\nexport interface SegmentedControl {\n  url: string\n  text: Observable<string> | string\n}\n@Component({\n  selector: 'ngg-segmented-control',\n  template: `\n    <div class=\"group\">\n      <a\n        *ngFor=\"let control of $controls | async\"\n        [routerLink]=\"control.url\"\n        routerLinkActive=\"active\"\n        class=\"button\"\n        >{{ control.text }}</a\n      >\n    </div>\n  `,\n  styles: [],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NggSegmentedControlComponent {\n  @Input() $controls: Observable<Array<SegmentedControl>> | undefined\n}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggSegmentedControlComponent } from './segmented-control.component'\nimport { RouterModule } from '@angular/router'\n\n@NgModule({\n  declarations: [NggSegmentedControlComponent],\n  imports: [RouterModule, CommonModule],\n  exports: [NggSegmentedControlComponent],\n})\nexport class NggSegmentedControlModule {}\n","import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  Input,\n  OnChanges,\n  OnDestroy,\n  ViewChild,\n} from '@angular/core'\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'\nimport {\n  createDropdown,\n  AbstractDropdown,\n  DropdownHandler,\n  DropdownOption,\n  ExtendedDropdownOption,\n  ElementProps,\n  DropdownArgs,\n} from '@sebgroup/extract'\n\n@Component({\n  selector: 'ngg-dropdown',\n  template: `\n    <div>\n      <button\n        #togglerRef\n        [id]=\"toggler?.attributes?.id\"\n        [attr.aria-haspopup]=\"toggler?.attributes?.['aria-haspopup']\"\n        [attr.aria-expanded]=\"toggler?.attributes?.['aria-expanded']\"\n        [attr.aria-owns]=\"toggler?.attributes?.['aria-owns']\"\n        [tabindex]=\"toggler?.attributes?.tabIndex\"\n        [style]=\"toggler?.attributes?.style\"\n        [class]=\"toggler?.classes\"\n        (click)=\"handler?.toggle()\"\n      >\n        {{ dropdown?.text }}\n      </button>\n      <div\n        #listboxRef\n        [id]=\"listbox?.attributes?.id\"\n        [attr.role]=\"listbox?.attributes?.role\"\n        [attr.aria-activedescendant]=\"\n          listbox?.attributes?.['aria-activedescendant']\n        \"\n        [tabindex]=\"listbox?.attributes?.tabIndex\"\n        [style]=\"listbox?.attributes?.style\"\n        [class]=\"listbox?.classes\"\n      >\n        <button\n          class=\"close m-4 m-sm-2 d-block d-sm-none\"\n          (click)=\"handler?.close()\"\n        >\n          <span class=\"sr-only\">Close</span>\n        </button>\n        <ul role=\"listbox\">\n          <li\n            *ngFor=\"let option of dropdown?.options; trackBy: trackByKey\"\n            [id]=\"option.attributes.id\"\n            [attr.role]=\"option.attributes.role\"\n            [attr.aria-selected]=\"option.attributes['aria-selected']\"\n            [style]=\"option.attributes.style\"\n            [class]=\"option.classes\"\n            (click)=\"select(option)\"\n          >\n            {{ option.key }}\n          </li>\n        </ul>\n      </div>\n    </div>\n  `,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: NggDropdownComponent,\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NggDropdownComponent\n  implements ControlValueAccessor, AfterViewInit, OnDestroy, OnChanges\n{\n  @Input() id?: string\n  @Input() text?: string\n  @Input() loop?: boolean\n  @Input() options: DropdownOption[] = []\n\n  @ViewChild('togglerRef') public togglerRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  @ViewChild('listboxRef') public listboxRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  value: any = undefined\n  onChangeFn?: any\n  onTouchedFn?: any\n\n  dropdown?: AbstractDropdown\n  handler?: DropdownHandler\n  toggler?: Partial<ElementProps>\n  listbox?: Partial<ElementProps>\n\n  constructor(private cd: ChangeDetectorRef) {}\n\n  ngAfterViewInit(): void {\n    if (this.togglerRef?.nativeElement && this.listboxRef?.nativeElement) {\n      this.handler = createDropdown(\n        this.props,\n        this.togglerRef.nativeElement,\n        this.listboxRef.nativeElement,\n        (dropdown) => {\n          this.dropdown = dropdown\n          this.toggler = dropdown.elements.toggler\n          this.listbox = dropdown.elements.listbox\n          this.cd.detectChanges()\n        }\n      )\n\n      this.selectFromValue(this.value)\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.handler?.destroy()\n  }\n\n  ngOnChanges(): void {\n    if (this.handler && this.dropdown) {\n      this.handler.update(this.props)\n    }\n  }\n\n  writeValue(obj: any): void {\n    this.value = obj\n    this.selectFromValue(this.value)\n  }\n\n  registerOnChange(fn: any): void {\n    this.onChangeFn = fn\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouchedFn = fn\n  }\n\n  select(option: ExtendedDropdownOption) {\n    this.handler?.select(option)\n    this.onChangeFn && this.onChangeFn(option.value)\n    this.onTouchedFn && this.onTouchedFn()\n  }\n\n  trackByKey = (index: number, option: ExtendedDropdownOption): string => {\n    return option.key\n  }\n\n  private get props(): DropdownArgs {\n    return {\n      id: this.id,\n      text: this.text,\n      options: this.options,\n      loop: this.loop,\n    }\n  }\n\n  private selectFromValue(value: any) {\n    if (this.handler && value !== undefined) {\n      const option = this.handler.dropdown.options.find(\n        (option) => option.value === value\n      )\n      if (option) this.handler?.select(option)\n    }\n  }\n}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggDropdownComponent } from './dropdown.component'\n\n@NgModule({\n  declarations: [NggDropdownComponent],\n  imports: [CommonModule],\n  exports: [NggDropdownComponent],\n})\nexport class NggDropdownModule {}\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggSegmentedControlModule } from './segmented-control/segmented-control.module'\nimport { NggDropdownModule } from './dropdown/dropdown.module'\n\n@NgModule({\n  declarations: [],\n  imports: [CommonModule],\n  exports: [NggSegmentedControlModule, NggDropdownModule],\n})\nexport class NggModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1,5 @@
+export * from './lib/green-angular.module';
+export * from './lib/dropdown/dropdown.module';
+export * from './lib/dropdown/dropdown.component';
+export * from './lib/segmented-control/segmented-control.module';
+export * from './lib/segmented-control/segmented-control.component';

package/lib/dropdown/dropdown.component.d.ts

@@ -0,0 +1,33 @@
+import { AfterViewInit, ChangeDetectorRef, ElementRef, OnChanges, OnDestroy } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { AbstractDropdown, DropdownHandler, DropdownOption, ExtendedDropdownOption, ElementProps } from '@sebgroup/extract';
+import * as i0 from "@angular/core";
+export declare class NggDropdownComponent implements ControlValueAccessor, AfterViewInit, OnDestroy, OnChanges {
+    private cd;
+    id?: string;
+    text?: string;
+    loop?: boolean;
+    options: DropdownOption[];
+    togglerRef: ElementRef<HTMLElement> | undefined;
+    listboxRef: ElementRef<HTMLElement> | undefined;
+    value: any;
+    onChangeFn?: any;
+    onTouchedFn?: any;
+    dropdown?: AbstractDropdown;
+    handler?: DropdownHandler;
+    toggler?: Partial<ElementProps>;
+    listbox?: Partial<ElementProps>;
+    constructor(cd: ChangeDetectorRef);
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    ngOnChanges(): void;
+    writeValue(obj: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    select(option: ExtendedDropdownOption): void;
+    trackByKey: (index: number, option: ExtendedDropdownOption) => string;
+    private get props();
+    private selectFromValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggDropdownComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NggDropdownComponent, "ngg-dropdown", never, { "id": "id"; "text": "text"; "loop": "loop"; "options": "options"; }, {}, never, never>;
+}

package/lib/dropdown/dropdown.module.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./dropdown.component";
+import * as i2 from "@angular/common";
+export declare class NggDropdownModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggDropdownModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NggDropdownModule, [typeof i1.NggDropdownComponent], [typeof i2.CommonModule], [typeof i1.NggDropdownComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<NggDropdownModule>;
+}

package/lib/green-angular.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "./segmented-control/segmented-control.module";
+import * as i3 from "./dropdown/dropdown.module";
+export declare class NggModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NggModule, never, [typeof i1.CommonModule], [typeof i2.NggSegmentedControlModule, typeof i3.NggDropdownModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<NggModule>;
+}

package/lib/segmented-control/segmented-control.component.d.ts

@@ -0,0 +1,11 @@
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+export interface SegmentedControl {
+    url: string;
+    text: Observable<string> | string;
+}
+export declare class NggSegmentedControlComponent {
+    $controls: Observable<Array<SegmentedControl>> | undefined;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggSegmentedControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NggSegmentedControlComponent, "ngg-segmented-control", never, { "$controls": "$controls"; }, {}, never, never>;
+}

package/lib/segmented-control/segmented-control.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./segmented-control.component";
+import * as i2 from "@angular/router";
+import * as i3 from "@angular/common";
+export declare class NggSegmentedControlModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggSegmentedControlModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NggSegmentedControlModule, [typeof i1.NggSegmentedControlComponent], [typeof i2.RouterModule, typeof i3.CommonModule], [typeof i1.NggSegmentedControlComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<NggSegmentedControlModule>;
+}

package/package.json

@@ -1,13 +1,18 @@
 {
   "name": "@sebgroup/green-angular",
-  "version": "1.0.0-alpha.1",
+  "version": "1.0.0-beta.4",
   "peerDependencies": {
-    "@angular/common": "^12.1.0",
-    "@angular/core": "^12.1.0"
+    "@angular/common": "^13.0.0",
+    "@angular/core": "^13.0.0",
+    "rxjs": "^6.6.7",
+    "@angular/forms": "^13.0.0",
+    "@angular/platform-browser": "^13.0.0",
+    "@angular/router": "^13.0.0"
   },
   "dependencies": {
-    "tslib": "^2.2.0",
-    "@sebgroup/chlorophyll": "*"
+    "@sebgroup/chlorophyll": "^1.0.0-beta.4",
+    "@sebgroup/extract": "^1.0.0-beta.4",
+    "tslib": "^2.3.1"
   },
   "description": "Angular components built on top of @sebgroup/chlorophyll.",
   "repository": {
@@ -24,5 +29,25 @@
   "bugs": {
     "url": "https://github.com/sebgroup/green/labels/angular"
   },
-  "homepage": "https://sebgroup.github.io/green/latest/angular/"
+  "homepage": "https://sebgroup.github.io/green/latest/angular/",
+  "module": "fesm2015/sebgroup-green-angular.mjs",
+  "es2020": "fesm2020/sebgroup-green-angular.mjs",
+  "esm2020": "esm2020/sebgroup-green-angular.mjs",
+  "fesm2020": "fesm2020/sebgroup-green-angular.mjs",
+  "fesm2015": "fesm2015/sebgroup-green-angular.mjs",
+  "typings": "sebgroup-green-angular.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./sebgroup-green-angular.d.ts",
+      "esm2020": "./esm2020/sebgroup-green-angular.mjs",
+      "es2020": "./fesm2020/sebgroup-green-angular.mjs",
+      "es2015": "./fesm2015/sebgroup-green-angular.mjs",
+      "node": "./fesm2015/sebgroup-green-angular.mjs",
+      "default": "./fesm2020/sebgroup-green-angular.mjs"
+    }
+  },
+  "sideEffects": false
 }

package/sebgroup-green-angular.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@sebgroup/green-angular" />
+export * from './index';