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

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/datepicker/datepicker.component.ts","../../../../libs/angular/src/lib/datepicker/datepicker.component.html","../../../../libs/angular/src/lib/datepicker/datepicker.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  Output,\n  ViewChild,\n  EventEmitter,\n  SimpleChanges,\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  dropdownValues,\n} from '@sebgroup/extract'\n\n@Component({\n  selector: 'ngg-dropdown',\n  template: `\n    <div>\n      <span\n        class=\"label\"\n        *ngIf=\"label\"\n        [id]=\"toggler?.attributes?.id + '_label'\"\n        >{{ label }}</span\n      >\n      <button\n        [attr.aria-labelledby]=\"\n          label ? toggler?.attributes?.id + '_label' : null\n        \"\n        [attr.aria-describedby]=\"\n          formInfo?.innerText && formInfo.innerText.length > 0\n            ? toggler?.attributes?.id + '_info'\n            : null\n        \"\n        type=\"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        [class.is-valid]=\"valid\"\n        [class.is-invalid]=\"invalid\"\n      >\n        <span>{{ dropdown?.text }}</span>\n      </button>\n      <span\n        class=\"form-info\"\n        #formInfo\n        [attr.id]=\"toggler?.attributes?.id + '_info'\"\n        ><ng-content select=\"[data-form-info]\"></ng-content\n      ></span>\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          type=\"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)=\"handler?.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 = false\n  @Input() label?: string\n  @Input() options: DropdownOption[] = []\n  @Input() valid?: boolean\n  @Input() invalid?: boolean\n\n  @Input()\n  get value(): any {\n    return this._value\n  }\n  set value(newValue: any) {\n    this.setSelectionByValue(newValue)\n  }\n  private _value: any\n\n  @Output() readonly valueChange: EventEmitter<any> = new EventEmitter<any>()\n\n  @ViewChild('togglerRef') public togglerRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  @ViewChild('listboxRef') public listboxRef:\n    | ElementRef<HTMLElement>\n    | undefined\n\n  onChangeFn?: (value: any) => void\n  onTouchedFn?: any\n\n  dropdown?: AbstractDropdown\n  handler?: DropdownHandler\n  toggler?: Partial<ElementProps> = dropdownValues.elements?.toggler\n  listbox?: Partial<ElementProps> = dropdownValues.elements?.listbox\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\n          const selected = this.dropdown.options?.find(\n            (option) => option.selected\n          )\n          if (selected && this._value !== selected?.value) {\n            setTimeout(() => {\n              this._value = selected.value\n              this.valueChange.emit(selected.value)\n              this.onChangeFn && this.onChangeFn(selected.value)\n              this.onTouchedFn && this.onTouchedFn()\n            }, 0)\n          }\n          this.cd.detectChanges()\n        }\n      )\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.handler?.destroy()\n  }\n\n  ngOnChanges(changes: SimpleChanges): void {\n    if (\n      this.handler &&\n      (changes.id || changes.text || changes.loop || changes.options)\n    ) {\n      this.handler.update(this.props)\n    }\n  }\n\n  writeValue(value: any): void {\n    this.value = 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._value = option.value\n    this.valueChange.emit(option.value)\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 || this.dropdown?.id,\n      text: this.text,\n      options: this.options,\n      loop: this.loop,\n      value: this.value,\n    }\n  }\n\n  private setSelectionByValue(value: any) {\n    if (this._value !== value) {\n      this._value = value\n\n      const selected = this.handler?.dropdown?.options.find(\n        (option) => option.value === value\n      )\n      if (selected) this.handler?.select(selected)\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 {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  Input,\n  Output,\n  ViewChild,\n  EventEmitter,\n  ChangeDetectorRef,\n} from '@angular/core'\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'\nimport {\n  AbstractDropdown,\n  DropdownHandler,\n  ExtendedDropdownOption,\n  ElementProps,\n  DatepickerData,\n  Datepicker,\n  createDatepicker,\n  DatepickerState,\n  DropdownOption,\n  months,\n  years,\n  randomId,\n  DatepickerOptions,\n} from '@sebgroup/extract'\n\n@Component({\n  selector: 'ngg-datepicker',\n  templateUrl: 'datepicker.component.html',\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: NggDatepickerComponent,\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NggDatepickerComponent\n  implements ControlValueAccessor, AfterViewInit\n{\n  get months(): Array<DropdownOption> {\n    return this._months\n  }\n\n  set months(value: Array<DropdownOption>) {\n    this._months = value\n  }\n  @Input()\n  get options(): DatepickerOptions {\n    return <DatepickerOptions>this._options\n  }\n  set options(value: DatepickerOptions) {\n    this._options = value\n    if (value.locale) {\n      this.months = months({ locale: this.options?.locale })\n    }\n  }\n  @Input()\n  get value(): string | Date | undefined {\n    return this._value\n  }\n  set value(newValue: string | Date | undefined) {\n    if (newValue !== this._value) {\n      this._value = newValue\n    }\n  }\n  @Input() id?: string = randomId()\n  @Input() label?: string\n  @Input() valid?: boolean\n  @Input() invalid?: boolean\n  @Output() readonly valueChange: EventEmitter<any> = new EventEmitter<any>()\n  @ViewChild('datepickerDialogElRef')\n  public datepickerDialogElRef?: ElementRef<HTMLElement>\n  @ViewChild('dateInputElRef')\n  public dateInputElRef?: ElementRef<HTMLInputElement>\n  @ViewChild('datepickerElRef') public datepickerElRef?: ElementRef<HTMLElement>\n  @ViewChild('datepickerTriggerElRef')\n  public datepickerTriggerElRef?: ElementRef<HTMLButtonElement>\n\n  onChangeFn?: (value: any) => void\n  onTouchedFn?: any\n\n  dropdown?: AbstractDropdown\n  handler?: DropdownHandler\n  toggler?: Partial<ElementProps>\n  listbox?: Partial<ElementProps>\n  _value: string | Date | undefined\n  private _months: Array<DropdownOption> = months({})\n  years: Array<DropdownOption> = years({})\n  private _options?: DatepickerOptions\n\n  dp: Datepicker | undefined\n  private _data: DatepickerData | undefined\n\n  constructor(private _cdr: ChangeDetectorRef) {}\n\n  writeValue(value: any): void {\n    this.value = value\n\n    // When binding using ngModel we need to set initial select date\n    // once we get initial value as it's not available when component is created\n    if (value && this.dp && !this.data?.selectedDate) {\n      this.dp.select(value)\n    }\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  trackByKey = (index: number, option: ExtendedDropdownOption): string => {\n    return option.key\n  }\n\n  get data(): DatepickerData | undefined {\n    return this._data\n  }\n\n  set data(value: DatepickerData | undefined) {\n    this._data = value\n  }\n\n  listener = (\n    data: DatepickerData | undefined,\n    state: DatepickerState | undefined\n  ) => {\n    if (this.dp && state) {\n      this.dp.state = { ...state }\n    }\n\n    this.onTouchedFn && this.onTouchedFn()\n\n    if (data) {\n      this.valueChange.emit(data.selectedDate)\n      this.onChangeFn && this.onChangeFn(data.selectedDate)\n      this.data = data\n    }\n\n    if (data || state) {\n      this._cdr.markForCheck()\n    }\n  }\n  trackWeek(index: any, week: any) {\n    return week\n  }\n\n  ngAfterViewInit(): void {\n    // initialize datepicker\n    if (\n      this.datepickerElRef &&\n      this.datepickerDialogElRef &&\n      this.dateInputElRef &&\n      this.datepickerTriggerElRef &&\n      !this.dp\n    ) {\n      this.dp = createDatepicker(\n        this.listener,\n        {\n          ...this.options,\n          selectedDate: this.value,\n        },\n        this.datepickerElRef.nativeElement,\n        this.datepickerDialogElRef.nativeElement,\n        this.dateInputElRef.nativeElement,\n        this.datepickerTriggerElRef.nativeElement\n      )\n      this._cdr.detectChanges()\n    } else {\n      throw 'Missing one or more elements...'\n    }\n  }\n}\n","<div class=\"form-group\">\n  <label *ngIf=\"label\" [for]=\"id\">{{ label }}</label>\n  <div\n    class=\"group\"\n    #datepickerElRef\n    [class.is-valid]=\"valid\"\n    [class.is-invalid]=\"invalid\"\n  >\n    <input\n      [attr.id]=\"id\"\n      [attr.aria-describedby]=\"\n        formInfo?.innerText && formInfo.innerText.length > 0\n          ? id + '_info'\n          : null\n      \"\n      type=\"text\"\n      placeholder=\"yyyy-mm-dd\"\n      #dateInputElRef\n      [value]=\"data?.formattedSelectedDate || ''\"\n      (change)=\"dp?.select(dateInputElRef.value)\"\n    />\n    <button\n      #datepickerTriggerElRef\n      (click)=\"dp?.toggle()\"\n      type=\"button\"\n      class=\"primary\"\n    >\n      <i class=\"sg-icon sg-icon-calendar\">Select date</i>\n    </button>\n  </div>\n  <span class=\"form-info\" #formInfo [attr.id]=\"id + '_info'\"\n    ><ng-content select=\"[data-form-info]\"></ng-content\n  ></span>\n</div>\n<!-- TODO: get or set attributes from within datepicker instance (dp) -->\n<div\n  #datepickerDialogElRef\n  class=\"popover popover-datepicker\"\n  [class.active]=\"dp?.state?.isActive\"\n  role=\"dialog\"\n  aria-modal=\"true\"\n  aria-label=\"Choose Date\"\n>\n  <button type=\"button\" class=\"close\" (click)=\"dp?.close()\">Close</button>\n  <div class=\"sg-date\">\n    <header>\n      <button type=\"button\" class=\"link\" (click)=\"dp?.sub(1, 'months')\">\n        <i class=\"sg-icon sg-icon-previous\">Previous month</i>\n      </button>\n      <ngg-dropdown\n        [options]=\"months\"\n        text=\"Select\"\n        [value]=\"data?.month\"\n        (valueChange)=\"dp?.setMonth($event)\"\n      ></ngg-dropdown>\n      <ngg-dropdown\n        [options]=\"years\"\n        text=\"Select\"\n        [value]=\"data?.year\"\n        (valueChange)=\"dp?.setYear($event)\"\n      ></ngg-dropdown>\n      <button type=\"button\" class=\"link\" (click)=\"dp?.add(1, 'months')\">\n        <i class=\"sg-icon sg-icon-next\">Next month</i>\n      </button>\n    </header>\n    <main>\n      <table role=\"grid\">\n        <thead>\n          <tr>\n            <th\n              scope=\"col\"\n              *ngFor=\"let header of data?.calendar?.headers\"\n              [abbr]=\"header.abbr\"\n              [class.sg-week-header]=\"header.type === 'week'\"\n              [class.sg-day-header]=\"header.type === 'day'\"\n            >\n              {{ header.displayText }}\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr\n            *ngFor=\"\n              let week of data?.calendar?.calendarGrid;\n              trackBy: trackWeek;\n              let i = index\n            \"\n          >\n            <th\n              *ngIf=\"data?.calendar?.weekNumbers as weekNumbers\"\n              class=\"sg-week-number\"\n            >\n              {{ weekNumbers[i] }}\n            </th>\n            <td\n              *ngFor=\"let day of week\"\n              [attr.data-date]=\"day.formattedDate\"\n              [attr.role]=\"day.selected ? 'gridcell' : null\"\n              [attr.aria-selected]=\"\n                day.selected && !data?.highlightedDate ? true : null\n              \"\n              [class.disabled]=\"!day.currentMonth\"\n              [class.sg-date-today]=\"day.today\"\n              [title]=\"day.today ? 'Today' : ''\"\n              [tabIndex]=\"\n                day.highlighted ||\n                (day.selected && !data?.highlightedDate) ||\n                (day.today && !data?.highlightedDate && !data?.selectedDate)\n                  ? 0\n                  : -1\n              \"\n              (click)=\"day.currentMonth && dp?.select(day.date)\"\n            >\n              {{ day.day }}\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </main>\n  </div>\n</div>\n","import { NgModule } from '@angular/core'\nimport { CommonModule } from '@angular/common'\nimport { NggDatepickerComponent } from './datepicker.component'\nimport { NggDropdownModule } from '../dropdown/dropdown.module'\n\n@NgModule({\n  declarations: [NggDatepickerComponent],\n  imports: [CommonModule, NggDropdownModule],\n  exports: [NggDatepickerComponent],\n})\nexport class NggDatepickerModule {}\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'\nimport { NggDatepickerModule } from './datepicker/datepicker.module'\n\n@NgModule({\n  declarations: [],\n  imports: [CommonModule],\n  exports: [NggSegmentedControlModule, NggDropdownModule, NggDatepickerModule],\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,7 @@
+export * from './lib/green-angular.module';
+export * from './lib/dropdown/dropdown.module';
+export * from './lib/dropdown/dropdown.component';
+export * from './lib/datepicker/datepicker.module';
+export * from './lib/datepicker/datepicker.component';
+export * from './lib/segmented-control/segmented-control.module';
+export * from './lib/segmented-control/segmented-control.component';

package/lib/datepicker/datepicker.component.d.ts

@@ -0,0 +1,46 @@
+import { AfterViewInit, ElementRef, EventEmitter, ChangeDetectorRef } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { AbstractDropdown, DropdownHandler, ExtendedDropdownOption, ElementProps, DatepickerData, Datepicker, DatepickerState, DropdownOption, DatepickerOptions } from '@sebgroup/extract';
+import * as i0 from "@angular/core";
+export declare class NggDatepickerComponent implements ControlValueAccessor, AfterViewInit {
+    private _cdr;
+    get months(): Array<DropdownOption>;
+    set months(value: Array<DropdownOption>);
+    get options(): DatepickerOptions;
+    set options(value: DatepickerOptions);
+    get value(): string | Date | undefined;
+    set value(newValue: string | Date | undefined);
+    id?: string;
+    label?: string;
+    valid?: boolean;
+    invalid?: boolean;
+    readonly valueChange: EventEmitter<any>;
+    datepickerDialogElRef?: ElementRef<HTMLElement>;
+    dateInputElRef?: ElementRef<HTMLInputElement>;
+    datepickerElRef?: ElementRef<HTMLElement>;
+    datepickerTriggerElRef?: ElementRef<HTMLButtonElement>;
+    onChangeFn?: (value: any) => void;
+    onTouchedFn?: any;
+    dropdown?: AbstractDropdown;
+    handler?: DropdownHandler;
+    toggler?: Partial<ElementProps>;
+    listbox?: Partial<ElementProps>;
+    _value: string | Date | undefined;
+    private _months;
+    years: Array<DropdownOption>;
+    private _options?;
+    dp: Datepicker | undefined;
+    private _data;
+    constructor(_cdr: ChangeDetectorRef);
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    trackByKey: (index: number, option: ExtendedDropdownOption) => string;
+    get data(): DatepickerData | undefined;
+    set data(value: DatepickerData | undefined);
+    listener: (data: DatepickerData | undefined, state: DatepickerState | undefined) => void;
+    trackWeek(index: any, week: any): any;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggDatepickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NggDatepickerComponent, "ngg-datepicker", never, { "options": "options"; "value": "value"; "id": "id"; "label": "label"; "valid": "valid"; "invalid": "invalid"; }, { "valueChange": "valueChange"; }, never, ["[data-form-info]"]>;
+}

package/lib/datepicker/datepicker.module.d.ts

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

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

@@ -0,0 +1,39 @@
+import { AfterViewInit, ChangeDetectorRef, ElementRef, OnChanges, OnDestroy, EventEmitter, SimpleChanges } 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;
+    label?: string;
+    options: DropdownOption[];
+    valid?: boolean;
+    invalid?: boolean;
+    get value(): any;
+    set value(newValue: any);
+    private _value;
+    readonly valueChange: EventEmitter<any>;
+    togglerRef: ElementRef<HTMLElement> | undefined;
+    listboxRef: ElementRef<HTMLElement> | undefined;
+    onChangeFn?: (value: any) => void;
+    onTouchedFn?: any;
+    dropdown?: AbstractDropdown;
+    handler?: DropdownHandler;
+    toggler?: Partial<ElementProps>;
+    listbox?: Partial<ElementProps>;
+    constructor(cd: ChangeDetectorRef);
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    select(option: ExtendedDropdownOption): void;
+    trackByKey: (index: number, option: ExtendedDropdownOption) => string;
+    private get props();
+    private setSelectionByValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NggDropdownComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NggDropdownComponent, "ngg-dropdown", never, { "id": "id"; "text": "text"; "loop": "loop"; "label": "label"; "options": "options"; "valid": "valid"; "invalid": "invalid"; "value": "value"; }, { "valueChange": "valueChange"; }, never, ["[data-form-info]"]>;
+}

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,10 @@
+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";
+import * as i4 from "./datepicker/datepicker.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, typeof i4.NggDatepickerModule]>;
+    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.11",
   "peerDependencies": {
-    "@angular/common": "^12.1.0",
-    "@angular/core": "^12.1.0"
+    "@angular/common": "^12.0.0 || ^13.0.0",
+    "@angular/core": "^12.0.0 || ^13.0.0",
+    "@angular/forms": "^12.0.0 || ^13.0.0",
+    "@angular/platform-browser": "^12.0.0 || ^13.0.0",
+    "@angular/router": "^12.0.0 || ^13.0.0",
+    "rxjs": "^6.5.3 || ^7.4.0"
   },
   "dependencies": {
-    "tslib": "^2.2.0",
-    "@sebgroup/chlorophyll": "*"
+    "@sebgroup/chlorophyll": "^1.0.0-beta.11",
+    "@sebgroup/extract": "^1.0.0-beta.11",
+    "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';