@sneat/contactus-shared 0.2.0

package/esm2022/lib/components/contact-forms/new-contact/new-person-form.component.js

@@ -0,0 +1,282 @@
+import { Component, computed, effect, EventEmitter, inject, Input, input, Output, signal, } from '@angular/core';
+import { IonButton, IonItemDivider, IonLabel } from '@ionic/angular/standalone';
+import { isRelatedPersonNotReady, } from '@sneat/contactus-core';
+import { ContactGroupService, ContactRoleService, ContactService, } from '@sneat/contactus-services';
+import { PersonWizardComponent } from '../pesson-wizard';
+import { ContactRoleFormComponent } from '../role-form';
+import { AssetService, AssetusServicesModule, } from '@sneat/ext-assetus-components';
+import { first, Observable, Subject, takeUntil } from 'rxjs';
+import { NewContactFormBaseComponent } from './new-contact-form-base.component';
+import { ClassName } from '@sneat/ui';
+import * as i0 from "@angular/core";
+export class NewPersonFormComponent extends NewContactFormBaseComponent {
+    constructor() {
+        super();
+        this.isInModal = false;
+        // If set user can't change this.
+        this.$fixedGroupID = input(...(ngDevMode ? [undefined, { debugName: "$fixedGroupID" }] : []));
+        // If set user can't change role.
+        this.$fixedRoleID = input(...(ngDevMode ? [undefined, { debugName: "$fixedRoleID" }] : []));
+        this.$assetID = input(...(ngDevMode ? [undefined, { debugName: "$assetID" }] : []));
+        this.assetID$ = new Subject();
+        this.$asset = signal(undefined, ...(ngDevMode ? [{ debugName: "$asset" }] : []));
+        this.$selectedContactGroup = signal(undefined, ...(ngDevMode ? [{ debugName: "$selectedContactGroup" }] : []));
+        this.$selectedContactGroupID = computed(() => this.$selectedContactGroup()?.id, ...(ngDevMode ? [{ debugName: "$selectedContactGroupID" }] : []));
+        this.$selectedContactRole = signal(undefined, ...(ngDevMode ? [{ debugName: "$selectedContactRole" }] : []));
+        this.$selectedContactRoleID = computed(() => this.$selectedContactRole()?.id, ...(ngDevMode ? [{ debugName: "$selectedContactRoleID" }] : []));
+        this.$parentContactID = input(...(ngDevMode ? [undefined, { debugName: "$parentContactID" }] : []));
+        this.parentContactID$ = new Subject();
+        this.$parentContact = signal(undefined, ...(ngDevMode ? [{ debugName: "$parentContact" }] : []));
+        this.personRequires = {
+            ageGroup: { hide: true },
+            relatedAs: { hide: true },
+            roles: { hide: true },
+        };
+        this.contactRoleChange = new EventEmitter();
+        this.contactGroupChange = new EventEmitter();
+        this.$personFormIsReadyToSubmit = signal(false, ...(ngDevMode ? [{ debugName: "$personFormIsReadyToSubmit" }] : []));
+        this.$creating = signal(false, ...(ngDevMode ? [{ debugName: "$creating" }] : []));
+        this.assetService = inject(AssetService);
+        this.contactGroupService = inject(ContactGroupService);
+        this.contactService = inject(ContactService);
+        this.contactRoleService = inject(ContactRoleService);
+        this.onSelectGroupAndRole = (args) => {
+            if (args?.group?.id && args.group.id !== this.$fixedGroupID()) {
+                this.$selectedContactGroup.set({ id: args.group.id });
+            }
+            if (args?.role?.id) {
+                this.$selectedContactRole.set({ id: args?.role?.id });
+            }
+        };
+        this.onCommand = (command) => {
+            switch (command) {
+                case 'create': {
+                    this.submit();
+                    break;
+                }
+                case 'reset': {
+                    this.$selectedContactRole.set(undefined);
+                    this.$selectedContactGroup.set(undefined);
+                    break;
+                }
+                default:
+                    this.errorLogger.logError('NewContactPageComponent received unknown command: ' + command);
+                    break;
+            }
+        };
+        // selectRel(rel: ITitledRecord): void {
+        // 	this.relation = rel.id as ContactToMemberRelation;
+        // 	setTimeout(
+        // 		() => {
+        // 			this.nameInput?.setFocus()
+        // 				.catch(this.logErrorHandler('failed to set focus to name input'));
+        // 		},
+        // 		100);
+        // }
+        this.$isContactNotReady = computed(() => isRelatedPersonNotReady(this.$contact().dbo, {}), ...(ngDevMode ? [{ debugName: "$isContactNotReady" }] : []));
+        this.setupEffects();
+    }
+    ngOnInit() {
+        this.command?.pipe(this.takeUntilDestroyed()).subscribe(this.onCommand);
+        this.selectGroupAndRole$
+            ?.pipe(this.takeUntilDestroyed())
+            .subscribe(this.onSelectGroupAndRole);
+    }
+    setupEffects() {
+        effect(() => {
+            this.creatingChange.emit(this.$creating());
+        });
+        effect(() => {
+            const contactGroupID = this.$selectedContactGroupID();
+            if (!contactGroupID) {
+                return;
+            }
+            const spaceRef = this.$contact().space;
+            this.contactGroupService
+                .getContactGroupByID(contactGroupID, spaceRef)
+                .pipe(first(), this.takeUntilDestroyed())
+                .subscribe({
+                next: (contactGroup) => {
+                    // 'effect for $selectedContactGroupID loaded contactGroup:',
+                    // contactGroup,
+                    this.$selectedContactGroup.set(contactGroup);
+                },
+                error: this.logErrorHandler('Failed to get contact group by ID'),
+            });
+        });
+        effect(() => {
+            const fixedGroupID = this.$fixedGroupID();
+            if (fixedGroupID && this.$selectedContactGroupID() !== fixedGroupID) {
+                this.$selectedContactGroup.set({ id: fixedGroupID });
+            }
+        });
+        effect(() => {
+            const contactRoleID = this.$fixedRoleID();
+            if (!contactRoleID) {
+                return;
+            }
+            this.$selectedContactRole.set({ id: contactRoleID });
+            this.contactRoleService
+                .getContactRoleByID(contactRoleID)
+                .pipe(first(), this.takeUntilDestroyed())
+                .subscribe({
+                next: (contactRole) => {
+                    this.$selectedContactRole.set({
+                        id: contactRole.id,
+                        brief: contactRole.brief,
+                    });
+                },
+                error: this.logErrorHandler('Failed to get contact role by ID'),
+            });
+        });
+        effect(() => {
+            const id = this.$assetID();
+            this.assetID$.next(id);
+            if (!id) {
+                return;
+            }
+            const space = this.$contact().space;
+            if (this.$asset()?.id !== id) {
+                this.$asset.set({ id, space });
+            }
+            this.assetService
+                .watchAssetByID(space, id)
+                .pipe(this.takeUntilDestroyed(), takeUntil(this.assetID$))
+                .subscribe({
+                next: (asset) => {
+                    this.$asset.set(asset);
+                },
+                error: this.logErrorHandler('failed to get asset by ID'),
+            });
+        });
+        effect(() => {
+            const id = this.$parentContactID();
+            this.parentContactID$.next(id);
+            if (!id) {
+                return;
+            }
+            const space = this.$contact().space;
+            this.contactService
+                .watchContactById(space, id)
+                .pipe(this.takeUntilDestroyed(), takeUntil(this.parentContactID$))
+                .subscribe((parentContact) => {
+                this.$parentContact.set(parentContact);
+            });
+        });
+    }
+    onContactGroupChanged(contactGroup) {
+        this.$selectedContactGroup.set(contactGroup);
+    }
+    onContactRoleIDChanged(contactRoleID) {
+        const contactRole = this.$selectedContactGroup()?.dbo?.roles?.find((r) => r.id === contactRoleID);
+        this.$selectedContactRole.set(contactRole);
+        // 'onContactRoleIDChanged()',
+        // contactRoleID,
+        // this.$selectedContactRole,
+    }
+    onContactChanged(contact) {
+        this.contactChange.emit(contact);
+    }
+    onPersonFormIsReadyToSubmit() {
+        this.$personFormIsReadyToSubmit.set(true);
+    }
+    submit() {
+        this.console.log('NewContactFormComponent.submit()');
+        const space = this.$contact().space;
+        if (!space) {
+            throw new Error('Space is not defined');
+        }
+        this.$creating.set(true);
+        const contactDbo = this.$contact().dbo;
+        let request = {
+            status: 'active',
+            type: 'person',
+            spaceID: space.id,
+            person: {
+                ...contactDbo,
+                status: 'active',
+                type: 'person',
+                ageGroup: contactDbo.ageGroup || 'unknown',
+            },
+        };
+        const asset = this.$asset();
+        if (asset) {
+            if (!asset.id) {
+                throw new Error('!assetDto.id');
+            }
+            if (!asset.brief?.title) {
+                throw new Error('!asset.brief.title');
+            }
+            if (!this.assetRelation) {
+                throw new Error('!this.assetRelation');
+            }
+            const contact2Asset = {
+                id: asset.id,
+                title: asset.brief.title,
+                relation: this.assetRelation,
+            };
+            request = {
+                ...request,
+                relatedToAssets: [contact2Asset],
+            };
+        }
+        const roleID = this.$selectedContactRoleID();
+        if (roleID) {
+            if (request.person && !request.person.roles) {
+                request = {
+                    ...request,
+                    person: { ...request.person, roles: [roleID] },
+                };
+            }
+            else if (request.person &&
+                request.person.roles?.some((r) => r === roleID)) {
+                request = {
+                    ...request,
+                    person: {
+                        ...request.person,
+                        roles: [...request.person.roles, roleID],
+                    },
+                };
+            }
+        }
+        this.contactService.createContact(space, request).subscribe({
+            next: (contact) => {
+                const space = this.$contact().space;
+                this.spaceNavService
+                    .navigateForwardToSpacePage(space, `contact/${contact.id}`, {
+                    replaceUrl: true,
+                    state: { contact },
+                })
+                    .catch(this.errorLogger.logErrorHandler('failed to navigate to contact page'));
+            },
+            error: (err) => {
+                this.$creating.set(false);
+                this.errorLogger.logError(err, 'Failed to create new contact');
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NewPersonFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: NewPersonFormComponent, isStandalone: true, selector: "sneat-new-person-form", inputs: { isInModal: { classPropertyName: "isInModal", publicName: "isInModal", isSignal: false, isRequired: false, transformFunction: null }, command: { classPropertyName: "command", publicName: "command", isSignal: false, isRequired: false, transformFunction: null }, selectGroupAndRole$: { classPropertyName: "selectGroupAndRole$", publicName: "selectGroupAndRole$", isSignal: false, isRequired: false, transformFunction: null }, $fixedGroupID: { classPropertyName: "$fixedGroupID", publicName: "$fixedGroupID", isSignal: true, isRequired: false, transformFunction: null }, $fixedRoleID: { classPropertyName: "$fixedRoleID", publicName: "$fixedRoleID", isSignal: true, isRequired: false, transformFunction: null }, $assetID: { classPropertyName: "$assetID", publicName: "$assetID", isSignal: true, isRequired: false, transformFunction: null }, $parentContactID: { classPropertyName: "$parentContactID", publicName: "$parentContactID", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contactRoleChange: "contactRoleChange", contactGroupChange: "contactGroupChange" }, providers: [{ provide: ClassName, useValue: 'NewContactFormComponent' }], usesInheritance: true, ngImport: i0, template: "@if ($asset()?.id) {\n  <!-- Replace with related items -->\n  <ion-item-divider color=\"light\">\n    @let asset = $asset();\n    <ion-label color=\"medium\"\n      >{{ asset?.brief?.title || asset?.id }}\n    </ion-label>\n  </ion-item-divider>\n}\n\n<sneat-contact-role-form\n  [$contactGroupID]=\"$selectedContactGroupID()\"\n  (contactGroupChange)=\"onContactGroupChanged($event)\"\n  [$contactRoleID]=\"$selectedContactRoleID()\"\n  (contactRoleIDChange)=\"onContactRoleIDChanged($event)\"\n/>\n\n@if ($selectedContactRole()) {\n  <sneat-person-wizard\n    [$space]=\"$space()\"\n    [$contact]=\"$contact()\"\n    (contactChange)=\"onContactChanged($event)\"\n    [hideRelationship]=\"true\"\n    [hidePetOption]=\"true\"\n    [$fields]=\"{ contactType: { hide: true }, relatedAs: { hide: true } }\"\n    [displayAgeGroupValue]=\"true\"\n    [requires]=\"personRequires\"\n    (isReadyToSubmitChange)=\"onPersonFormIsReadyToSubmit()\"\n  />\n}\n\n<!--\t<ng-container *ngIf=\"member && !relation\">-->\n<!--\t\t<p *ngIf=\"!member\">Please select relation to member</p>-->\n<!--\t\t<p *ngIf=\"member\">Please select relation to <b>{{member?.brief?.title || member?.id}}</b></p>-->\n<!--\t\t<ion-list mode=\"ios\">-->\n<!--\t\t\t<ion-item mode=\"ios\" button *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t(click)=\"selectRel(rel)\">{{rel.title}}</ion-item>-->\n<!--\t\t</ion-list>-->\n<!--\t</ng-container>-->\n\n<!--\t<ion-list *ngIf=\"relation\">-->\n<!--\t\t<ion-item>-->\n<!--\t\t\t<ion-label>Relation</ion-label>-->\n<!--\t\t\t<ion-select [(ngModel)]=\"relation\" [disabled]=\"creating\" interface=\"action-sheet\">-->\n<!--\t\t\t\t<ion-select-option *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t\t\t\t\t\t [value]=\"rel.id\">{{rel.title}}</ion-select-option>-->\n<!--\t\t\t</ion-select>-->\n<!--\t\t</ion-item>-->\n<!--\t</ion-list>-->\n\n<!--\t<div class=\"ion-padding\" *ngIf=\"!isContactNotReady\">-->\n\n@if (!isInModal) {\n  <div class=\"ion-padding\">\n    <ion-button\n      expand=\"full\"\n      [disabled]=\"$creating() || $isContactNotReady()\"\n      (click)=\"submit()\"\n    >\n      <ion-label>Create contact</ion-label>\n    </ion-button>\n  </div>\n}\n", dependencies: [{ kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: ContactRoleFormComponent, selector: "sneat-contact-role-form", inputs: ["$contactGroupID", "$contactRoleID"], outputs: ["contactGroupIDChange", "contactGroupChange", "contactRoleIDChange", "contactRoleChange"] }, { kind: "component", type: PersonWizardComponent, selector: "sneat-person-wizard", inputs: ["requires", "disabled", "hideRelationship", "hidePetOption", "displayAgeGroupValue", "nameFields", "$fields"], outputs: ["isReadyToSubmitChange"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "ngmodule", type: AssetusServicesModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NewPersonFormComponent, decorators: [{
+            type: Component,
+            args: [{ imports: [
+                        IonItemDivider,
+                        IonLabel,
+                        ContactRoleFormComponent,
+                        PersonWizardComponent,
+                        IonButton,
+                        AssetusServicesModule,
+                    ], providers: [{ provide: ClassName, useValue: 'NewContactFormComponent' }], selector: 'sneat-new-person-form', template: "@if ($asset()?.id) {\n  <!-- Replace with related items -->\n  <ion-item-divider color=\"light\">\n    @let asset = $asset();\n    <ion-label color=\"medium\"\n      >{{ asset?.brief?.title || asset?.id }}\n    </ion-label>\n  </ion-item-divider>\n}\n\n<sneat-contact-role-form\n  [$contactGroupID]=\"$selectedContactGroupID()\"\n  (contactGroupChange)=\"onContactGroupChanged($event)\"\n  [$contactRoleID]=\"$selectedContactRoleID()\"\n  (contactRoleIDChange)=\"onContactRoleIDChanged($event)\"\n/>\n\n@if ($selectedContactRole()) {\n  <sneat-person-wizard\n    [$space]=\"$space()\"\n    [$contact]=\"$contact()\"\n    (contactChange)=\"onContactChanged($event)\"\n    [hideRelationship]=\"true\"\n    [hidePetOption]=\"true\"\n    [$fields]=\"{ contactType: { hide: true }, relatedAs: { hide: true } }\"\n    [displayAgeGroupValue]=\"true\"\n    [requires]=\"personRequires\"\n    (isReadyToSubmitChange)=\"onPersonFormIsReadyToSubmit()\"\n  />\n}\n\n<!--\t<ng-container *ngIf=\"member && !relation\">-->\n<!--\t\t<p *ngIf=\"!member\">Please select relation to member</p>-->\n<!--\t\t<p *ngIf=\"member\">Please select relation to <b>{{member?.brief?.title || member?.id}}</b></p>-->\n<!--\t\t<ion-list mode=\"ios\">-->\n<!--\t\t\t<ion-item mode=\"ios\" button *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t(click)=\"selectRel(rel)\">{{rel.title}}</ion-item>-->\n<!--\t\t</ion-list>-->\n<!--\t</ng-container>-->\n\n<!--\t<ion-list *ngIf=\"relation\">-->\n<!--\t\t<ion-item>-->\n<!--\t\t\t<ion-label>Relation</ion-label>-->\n<!--\t\t\t<ion-select [(ngModel)]=\"relation\" [disabled]=\"creating\" interface=\"action-sheet\">-->\n<!--\t\t\t\t<ion-select-option *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t\t\t\t\t\t [value]=\"rel.id\">{{rel.title}}</ion-select-option>-->\n<!--\t\t\t</ion-select>-->\n<!--\t\t</ion-item>-->\n<!--\t</ion-list>-->\n\n<!--\t<div class=\"ion-padding\" *ngIf=\"!isContactNotReady\">-->\n\n@if (!isInModal) {\n  <div class=\"ion-padding\">\n    <ion-button\n      expand=\"full\"\n      [disabled]=\"$creating() || $isContactNotReady()\"\n      (click)=\"submit()\"\n    >\n      <ion-label>Create contact</ion-label>\n    </ion-button>\n  </div>\n}\n" }]
+        }], ctorParameters: () => [], propDecorators: { isInModal: [{
+                type: Input
+            }], command: [{
+                type: Input
+            }], selectGroupAndRole$: [{
+                type: Input
+            }], $fixedGroupID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$fixedGroupID", required: false }] }], $fixedRoleID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$fixedRoleID", required: false }] }], $assetID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$assetID", required: false }] }], $parentContactID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$parentContactID", required: false }] }], contactRoleChange: [{
+                type: Output
+            }], contactGroupChange: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=new-person-form.component.js.map

package/esm2022/lib/components/contact-forms/new-contact/new-person-form.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"new-person-form.component.js","sourceRoot":"","sources":["../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/new-contact/new-person-form.component.ts","../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/new-contact/new-person-form.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  computed,\n  effect,\n  EventEmitter,\n  inject,\n  Input,\n  input,\n  OnInit,\n  Output,\n  signal,\n} from '@angular/core';\nimport { IonButton, IonItemDivider, IonLabel } from '@ionic/angular/standalone';\nimport {\n  IContactRoleWithIdAndBrief,\n  ContactToAssetRelation,\n  IContact2Asset,\n  IContactContext,\n  IContactGroupDbo,\n  IPersonRequirements,\n  isRelatedPersonNotReady,\n  ContactRole,\n  IContactRoleWithIdAndOptionalBrief,\n  NewContactBaseDboAndSpaceRef,\n  ICreateContactPersonRequest,\n} from '@sneat/contactus-core';\nimport {\n  ContactGroupService,\n  ContactRoleService,\n  ContactService,\n} from '@sneat/contactus-services';\nimport { PersonWizardComponent } from '../pesson-wizard';\nimport { IContactAddEventArgs } from '../../contact-events';\nimport { ContactRoleFormComponent } from '../role-form';\nimport { IIdAndDbo, IIdAndOptionalDbo } from '@sneat/core';\nimport {\n  AssetService,\n  AssetusServicesModule,\n} from '@sneat/ext-assetus-components';\nimport { IAssetContext } from '@sneat/mod-assetus-core';\nimport { first, Observable, Subject, takeUntil } from 'rxjs';\nimport { NewContactFormBaseComponent } from './new-contact-form-base.component';\nimport { ClassName } from '@sneat/ui';\n\nexport type OptionalContactRoleIdAndBrief =\n  | IContactRoleWithIdAndBrief\n  | undefined;\n\nexport type OptionalContactGroupIdAndBrief =\n  | IIdAndOptionalDbo<IContactGroupDbo>\n  | undefined;\n\nexport type NewContactFormCommand = 'create' | 'reset';\n\n@Component({\n  imports: [\n    IonItemDivider,\n    IonLabel,\n    ContactRoleFormComponent,\n    PersonWizardComponent,\n    IonButton,\n    AssetusServicesModule,\n  ],\n  providers: [{ provide: ClassName, useValue: 'NewContactFormComponent' }],\n  selector: 'sneat-new-person-form',\n  templateUrl: './new-person-form.component.html',\n})\nexport class NewPersonFormComponent\n  extends NewContactFormBaseComponent\n  implements OnInit\n{\n  @Input() public isInModal = false;\n\n  @Input() command?: Observable<NewContactFormCommand>;\n  @Input() selectGroupAndRole$?: Observable<IContactAddEventArgs | undefined>;\n\n  // If set user can't change this.\n  public readonly $fixedGroupID = input<string>();\n\n  // If set user can't change role.\n  public readonly $fixedRoleID = input<ContactRole>();\n\n  public readonly $assetID = input<string>();\n\n  private readonly assetID$ = new Subject<string | undefined>();\n\n  public readonly $asset = signal<IAssetContext | undefined>(undefined);\n\n  protected readonly $selectedContactGroup = signal<\n    OptionalContactGroupIdAndBrief | undefined\n  >(undefined);\n\n  protected readonly $selectedContactGroupID = computed(\n    () => this.$selectedContactGroup()?.id,\n  );\n\n  protected readonly $selectedContactRole = signal<\n    IContactRoleWithIdAndOptionalBrief | undefined\n  >(undefined);\n\n  protected readonly $selectedContactRoleID = computed(\n    () => this.$selectedContactRole()?.id,\n  );\n\n  public readonly $parentContactID = input<string>();\n  private readonly parentContactID$ = new Subject<string | undefined>();\n  private readonly $parentContact = signal<IContactContext | undefined>(\n    undefined,\n  );\n\n  protected readonly personRequires: IPersonRequirements = {\n    ageGroup: { hide: true },\n    relatedAs: { hide: true },\n    roles: { hide: true },\n  };\n\n  @Output() readonly contactRoleChange =\n    new EventEmitter<OptionalContactRoleIdAndBrief>();\n\n  @Output() readonly contactGroupChange =\n    new EventEmitter<OptionalContactGroupIdAndBrief>();\n\n  protected assetRelation?: ContactToAssetRelation;\n  protected readonly $personFormIsReadyToSubmit = signal(false);\n  protected readonly $creating = signal(false);\n\n  private readonly assetService = inject(AssetService);\n  private readonly contactGroupService = inject(ContactGroupService);\n  private readonly contactService = inject(ContactService);\n  private readonly contactRoleService = inject(ContactRoleService);\n\n  public constructor() {\n    super();\n    this.setupEffects();\n  }\n\n  public ngOnInit(): void {\n    this.command?.pipe(this.takeUntilDestroyed()).subscribe(this.onCommand);\n    this.selectGroupAndRole$\n      ?.pipe(this.takeUntilDestroyed())\n      .subscribe(this.onSelectGroupAndRole);\n  }\n\n  private readonly onSelectGroupAndRole = (\n    args: IContactAddEventArgs | undefined,\n  ) => {\n    if (args?.group?.id && args.group.id !== this.$fixedGroupID()) {\n      this.$selectedContactGroup.set({ id: args.group.id });\n    }\n    if (args?.role?.id) {\n      this.$selectedContactRole.set({ id: args?.role?.id });\n    }\n  };\n\n  private readonly onCommand = (command: NewContactFormCommand): void => {\n    switch (command) {\n      case 'create': {\n        this.submit();\n        break;\n      }\n      case 'reset': {\n        this.$selectedContactRole.set(undefined);\n        this.$selectedContactGroup.set(undefined);\n        break;\n      }\n      default:\n        this.errorLogger.logError(\n          'NewContactPageComponent received unknown command: ' + command,\n        );\n        break;\n    }\n  };\n\n  private setupEffects(): void {\n    effect(() => {\n      this.creatingChange.emit(this.$creating());\n    });\n    effect(() => {\n      const contactGroupID = this.$selectedContactGroupID();\n      if (!contactGroupID) {\n        return;\n      }\n      const spaceRef = this.$contact().space;\n      this.contactGroupService\n        .getContactGroupByID(contactGroupID, spaceRef)\n        .pipe(first(), this.takeUntilDestroyed())\n        .subscribe({\n          next: (contactGroup) => {\n            // 'effect for $selectedContactGroupID loaded contactGroup:',\n            // contactGroup,\n            this.$selectedContactGroup.set(contactGroup);\n          },\n          error: this.logErrorHandler('Failed to get contact group by ID'),\n        });\n    });\n    effect(() => {\n      const fixedGroupID = this.$fixedGroupID();\n      if (fixedGroupID && this.$selectedContactGroupID() !== fixedGroupID) {\n        this.$selectedContactGroup.set({ id: fixedGroupID });\n      }\n    });\n    effect(() => {\n      const contactRoleID = this.$fixedRoleID();\n      if (!contactRoleID) {\n        return;\n      }\n      this.$selectedContactRole.set({ id: contactRoleID });\n      this.contactRoleService\n        .getContactRoleByID(contactRoleID)\n        .pipe(first(), this.takeUntilDestroyed())\n        .subscribe({\n          next: (contactRole) => {\n            this.$selectedContactRole.set({\n              id: contactRole.id as ContactRole,\n              brief: contactRole.brief,\n            });\n          },\n          error: this.logErrorHandler('Failed to get contact role by ID'),\n        });\n    });\n    effect(() => {\n      const id = this.$assetID();\n      this.assetID$.next(id);\n      if (!id) {\n        return;\n      }\n      const space = this.$contact().space;\n      if (this.$asset()?.id !== id) {\n        this.$asset.set({ id, space });\n      }\n      this.assetService\n        .watchAssetByID(space, id)\n        .pipe(this.takeUntilDestroyed(), takeUntil(this.assetID$))\n        .subscribe({\n          next: (asset) => {\n            this.$asset.set(asset);\n          },\n          error: this.logErrorHandler('failed to get asset by ID'),\n        });\n    });\n    effect(() => {\n      const id = this.$parentContactID();\n      this.parentContactID$.next(id);\n      if (!id) {\n        return;\n      }\n      const space = this.$contact().space;\n      this.contactService\n        .watchContactById(space, id)\n        .pipe(this.takeUntilDestroyed(), takeUntil(this.parentContactID$))\n        .subscribe((parentContact) => {\n          this.$parentContact.set(parentContact);\n        });\n    });\n  }\n\n  protected onContactGroupChanged(\n    contactGroup?: IIdAndDbo<IContactGroupDbo>,\n  ): void {\n    this.$selectedContactGroup.set(contactGroup);\n  }\n\n  protected onContactRoleIDChanged(contactRoleID?: string): void {\n    const contactRole = this.$selectedContactGroup()?.dbo?.roles?.find(\n      (r) => r.id === contactRoleID,\n    );\n    this.$selectedContactRole.set(contactRole);\n    // 'onContactRoleIDChanged()',\n    // contactRoleID,\n    // this.$selectedContactRole,\n  }\n\n  public onContactChanged(contact: NewContactBaseDboAndSpaceRef): void {\n    this.contactChange.emit(contact);\n  }\n\n  public onPersonFormIsReadyToSubmit(): void {\n    this.$personFormIsReadyToSubmit.set(true);\n  }\n\n  protected submit(): void {\n    this.console.log('NewContactFormComponent.submit()');\n    const space = this.$contact().space;\n    if (!space) {\n      throw new Error('Space is not defined');\n    }\n    this.$creating.set(true);\n    const contactDbo = this.$contact().dbo;\n    let request: ICreateContactPersonRequest = {\n      status: 'active',\n      type: 'person',\n      spaceID: space.id,\n      person: {\n        ...contactDbo,\n        status: 'active',\n        type: 'person',\n        ageGroup: contactDbo.ageGroup || 'unknown',\n      },\n    };\n\n    const asset = this.$asset();\n    if (asset) {\n      if (!asset.id) {\n        throw new Error('!assetDto.id');\n      }\n      if (!asset.brief?.title) {\n        throw new Error('!asset.brief.title');\n      }\n\n      if (!this.assetRelation) {\n        throw new Error('!this.assetRelation');\n      }\n      const contact2Asset: IContact2Asset = {\n        id: asset.id,\n        title: asset.brief.title,\n        relation: this.assetRelation,\n      };\n      request = {\n        ...request,\n        relatedToAssets: [contact2Asset],\n      };\n    }\n    const roleID = this.$selectedContactRoleID();\n    if (roleID) {\n      if (request.person && !request.person.roles) {\n        request = {\n          ...request,\n          person: { ...request.person, roles: [roleID] },\n        };\n      } else if (\n        request.person &&\n        request.person.roles?.some((r) => r === roleID)\n      ) {\n        request = {\n          ...request,\n          person: {\n            ...request.person,\n            roles: [...request.person.roles, roleID],\n          },\n        };\n      }\n    }\n    this.contactService.createContact(space, request).subscribe({\n      next: (contact) => {\n        const space = this.$contact().space;\n        this.spaceNavService\n          .navigateForwardToSpacePage(space, `contact/${contact.id}`, {\n            replaceUrl: true,\n            state: { contact },\n          })\n          .catch(\n            this.errorLogger.logErrorHandler(\n              'failed to navigate to contact page',\n            ),\n          );\n      },\n      error: (err: unknown) => {\n        this.$creating.set(false);\n        this.errorLogger.logError(err, 'Failed to create new contact');\n      },\n    });\n  }\n\n  // selectRel(rel: ITitledRecord): void {\n  // \tthis.relation = rel.id as ContactToMemberRelation;\n  // \tsetTimeout(\n  // \t\t() => {\n  // \t\t\tthis.nameInput?.setFocus()\n  // \t\t\t\t.catch(this.logErrorHandler('failed to set focus to name input'));\n  // \t\t},\n  // \t\t100);\n  // }\n\n  protected readonly $isContactNotReady = computed(() =>\n    isRelatedPersonNotReady(this.$contact().dbo, {}),\n  );\n}\n","@if ($asset()?.id) {\n  <!-- Replace with related items -->\n  <ion-item-divider color=\"light\">\n    @let asset = $asset();\n    <ion-label color=\"medium\"\n      >{{ asset?.brief?.title || asset?.id }}\n    </ion-label>\n  </ion-item-divider>\n}\n\n<sneat-contact-role-form\n  [$contactGroupID]=\"$selectedContactGroupID()\"\n  (contactGroupChange)=\"onContactGroupChanged($event)\"\n  [$contactRoleID]=\"$selectedContactRoleID()\"\n  (contactRoleIDChange)=\"onContactRoleIDChanged($event)\"\n/>\n\n@if ($selectedContactRole()) {\n  <sneat-person-wizard\n    [$space]=\"$space()\"\n    [$contact]=\"$contact()\"\n    (contactChange)=\"onContactChanged($event)\"\n    [hideRelationship]=\"true\"\n    [hidePetOption]=\"true\"\n    [$fields]=\"{ contactType: { hide: true }, relatedAs: { hide: true } }\"\n    [displayAgeGroupValue]=\"true\"\n    [requires]=\"personRequires\"\n    (isReadyToSubmitChange)=\"onPersonFormIsReadyToSubmit()\"\n  />\n}\n\n<!--\t<ng-container *ngIf=\"member && !relation\">-->\n<!--\t\t<p *ngIf=\"!member\">Please select relation to member</p>-->\n<!--\t\t<p *ngIf=\"member\">Please select relation to <b>{{member?.brief?.title || member?.id}}</b></p>-->\n<!--\t\t<ion-list mode=\"ios\">-->\n<!--\t\t\t<ion-item mode=\"ios\" button *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t(click)=\"selectRel(rel)\">{{rel.title}}</ion-item>-->\n<!--\t\t</ion-list>-->\n<!--\t</ng-container>-->\n\n<!--\t<ion-list *ngIf=\"relation\">-->\n<!--\t\t<ion-item>-->\n<!--\t\t\t<ion-label>Relation</ion-label>-->\n<!--\t\t\t<ion-select [(ngModel)]=\"relation\" [disabled]=\"creating\" interface=\"action-sheet\">-->\n<!--\t\t\t\t<ion-select-option *ngFor=\"let rel of relations; trackBy: id\"-->\n<!--\t\t\t\t\t\t\t\t\t\t\t\t\t [value]=\"rel.id\">{{rel.title}}</ion-select-option>-->\n<!--\t\t\t</ion-select>-->\n<!--\t\t</ion-item>-->\n<!--\t</ion-list>-->\n\n<!--\t<div class=\"ion-padding\" *ngIf=\"!isContactNotReady\">-->\n\n@if (!isInModal) {\n  <div class=\"ion-padding\">\n    <ion-button\n      expand=\"full\"\n      [disabled]=\"$creating() || $isContactNotReady()\"\n      (click)=\"submit()\"\n    >\n      <ion-label>Create contact</ion-label>\n    </ion-button>\n  </div>\n}\n"]}

package/esm2022/lib/components/contact-forms/new-contact/new-pet-form.component.js

@@ -0,0 +1,25 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { IonButton, IonCard, IonInput, IonItem, IonLabel, } from '@ionic/angular/standalone';
+import { ClassName } from '@sneat/ui';
+import { PetKindAndBreedFormComponent } from '../pet-kind-and-breed-form/pet-kind-and-breed-form.component';
+import { NewContactFormBaseComponent } from './new-contact-form-base.component';
+import * as i0 from "@angular/core";
+export class NewPetFormComponent extends NewContactFormBaseComponent {
+    onContactChanged(contact) {
+        this.contactChange.emit(contact);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NewPetFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: NewPetFormComponent, isStandalone: true, selector: "sneat-new-pet-form", providers: [{ provide: ClassName, useValue: 'NewPetFormComponent' }], usesInheritance: true, ngImport: i0, template: "<sneat-pet-kind-and-breed-form\n  [$space]=\"$space()\"\n  [$contact]=\"$contact()\"\n  (contactChange)=\"onContactChanged($event)\"\n/>\n\n@if ($contact().dbo.petBreed) {\n  <ion-card>\n    <ion-item>\n      <ion-input label=\"Nickname\" />\n    </ion-item>\n\n    <ion-item>\n      <ion-input label=\"Full name\" />\n    </ion-item>\n  </ion-card>\n  <ion-button>\n    <ion-label>Create</ion-label>\n  </ion-button>\n}\n", dependencies: [{ kind: "component", type: IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "size", "spellcheck", "step", "type", "value"] }, { kind: "component", type: IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: PetKindAndBreedFormComponent, selector: "sneat-pet-kind-and-breed-form", outputs: ["petKindChange"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NewPetFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sneat-new-pet-form', imports: [
+                        IonItem,
+                        IonInput,
+                        IonCard,
+                        PetKindAndBreedFormComponent,
+                        IonButton,
+                        IonLabel,
+                    ], providers: [{ provide: ClassName, useValue: 'NewPetFormComponent' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<sneat-pet-kind-and-breed-form\n  [$space]=\"$space()\"\n  [$contact]=\"$contact()\"\n  (contactChange)=\"onContactChanged($event)\"\n/>\n\n@if ($contact().dbo.petBreed) {\n  <ion-card>\n    <ion-item>\n      <ion-input label=\"Nickname\" />\n    </ion-item>\n\n    <ion-item>\n      <ion-input label=\"Full name\" />\n    </ion-item>\n  </ion-card>\n  <ion-button>\n    <ion-label>Create</ion-label>\n  </ion-button>\n}\n" }]
+        }] });
+//# sourceMappingURL=new-pet-form.component.js.map

package/esm2022/lib/components/contact-forms/new-contact/new-pet-form.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"new-pet-form.component.js","sourceRoot":"","sources":["../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/new-contact/new-pet-form.component.ts","../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/new-contact/new-pet-form.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,SAAS,EACT,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,4BAA4B,EAAE,MAAM,8DAA8D,CAAC;AAC5G,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;;AAgBhF,MAAM,OAAO,mBAAoB,SAAQ,2BAA2B;IACxD,gBAAgB,CAAC,OAAqC;QAC9D,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,CAAC;8GAHU,mBAAmB;kGAAnB,mBAAmB,iEAHnB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,qBAAqB,EAAE,CAAC,iDCxBtE,waAoBA,4CDHI,OAAO,0NACP,QAAQ,8eACR,OAAO,yLACP,4BAA4B,sGAC5B,SAAS,oPACT,QAAQ;;2FAKC,mBAAmB;kBAd/B,SAAS;+BACE,oBAAoB,WAErB;wBACP,OAAO;wBACP,QAAQ;wBACR,OAAO;wBACP,4BAA4B;wBAC5B,SAAS;wBACT,QAAQ;qBACT,aACU,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,qBAAqB,EAAE,CAAC,mBACnD,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\nimport {\n  IonButton,\n  IonCard,\n  IonInput,\n  IonItem,\n  IonLabel,\n} from '@ionic/angular/standalone';\nimport { NewContactBaseDboAndSpaceRef } from '@sneat/contactus-core';\nimport { ClassName } from '@sneat/ui';\nimport { PetKindAndBreedFormComponent } from '../pet-kind-and-breed-form/pet-kind-and-breed-form.component';\nimport { NewContactFormBaseComponent } from './new-contact-form-base.component';\n\n@Component({\n  selector: 'sneat-new-pet-form',\n  templateUrl: './new-pet-form.component.html',\n  imports: [\n    IonItem,\n    IonInput,\n    IonCard,\n    PetKindAndBreedFormComponent,\n    IonButton,\n    IonLabel,\n  ],\n  providers: [{ provide: ClassName, useValue: 'NewPetFormComponent' }],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NewPetFormComponent extends NewContactFormBaseComponent {\n  protected onContactChanged(contact: NewContactBaseDboAndSpaceRef): void {\n    this.contactChange.emit(contact);\n  }\n}\n","<sneat-pet-kind-and-breed-form\n  [$space]=\"$space()\"\n  [$contact]=\"$contact()\"\n  (contactChange)=\"onContactChanged($event)\"\n/>\n\n@if ($contact().dbo.petBreed) {\n  <ion-card>\n    <ion-item>\n      <ion-input label=\"Nickname\" />\n    </ion-item>\n\n    <ion-item>\n      <ion-input label=\"Full name\" />\n    </ion-item>\n  </ion-card>\n  <ion-button>\n    <ion-label>Create</ion-label>\n  </ion-button>\n}\n"]}

package/esm2022/lib/components/contact-forms/person-forms/age-group/age-group-form.component.js

@@ -0,0 +1,64 @@
+import { Component, computed, EventEmitter, input, Input, Output, } from '@angular/core';
+import { IonCard, IonItemDivider } from '@ionic/angular/standalone';
+import { formNexInAnimation } from '@sneat/core';
+import { SelectFromListComponent } from '@sneat/ui';
+import * as i0 from "@angular/core";
+export class AgeGroupFormComponent {
+    constructor() {
+        this.$ageGroup = input.required(...(ngDevMode ? [{ debugName: "$ageGroup" }] : []));
+        this.ageGroupChange = new EventEmitter();
+        this.disabled = false;
+        this.hidePetOption = input(...(ngDevMode ? [undefined, { debugName: "hidePetOption" }] : []));
+        this.hideUndisclosedOption = input(...(ngDevMode ? [undefined, { debugName: "hideUndisclosedOption" }] : []));
+        this.$ageGroupLabel = computed(() => {
+            const hidePetOptions = this.hidePetOption();
+            if (hidePetOptions) {
+                return 'Adult or child?';
+            }
+            return 'Adult/child or pet?';
+        }, ...(ngDevMode ? [{ debugName: "$ageGroupLabel" }] : []));
+        this.$ageGroupOptions = computed(() => {
+            const hidePetOptions = this.hidePetOption();
+            const items = [
+                {
+                    id: 'adult',
+                    title: 'Adult',
+                },
+                {
+                    id: 'child',
+                    title: 'Child',
+                },
+            ];
+            if (!hidePetOptions) {
+                items.push({
+                    id: 'pet',
+                    title: 'Pet',
+                });
+            }
+            if (!this.hideUndisclosedOption) {
+                items.push({
+                    id: 'undisclosed',
+                    title: 'Undisclosed',
+                });
+            }
+            return items;
+        }, ...(ngDevMode ? [{ debugName: "$ageGroupOptions" }] : []));
+    }
+    onAgeGroupChanged(ageGroup) {
+        this.ageGroupChange.emit(ageGroup);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AgeGroupFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AgeGroupFormComponent, isStandalone: true, selector: "sneat-age-group-form", inputs: { spaceType: { classPropertyName: "spaceType", publicName: "spaceType", isSignal: false, isRequired: true, transformFunction: null }, $ageGroup: { classPropertyName: "$ageGroup", publicName: "$ageGroup", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, hidePetOption: { classPropertyName: "hidePetOption", publicName: "hidePetOption", isSignal: true, isRequired: false, transformFunction: null }, hideUndisclosedOption: { classPropertyName: "hideUndisclosedOption", publicName: "hideUndisclosedOption", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ageGroupChange: "ageGroupChange" }, ngImport: i0, template: "<ion-card @formNextIn>\n  @if (!$ageGroup()) {\n    <ion-item-divider color=\"primary\">\n      {{ $ageGroupLabel() }}\n    </ion-item-divider>\n  }\n  <sneat-select-from-list\n    label=\"Age group\"\n    labelPlacement=\"end\"\n    [value]=\"$ageGroup() || ''\"\n    (valueChange)=\"onAgeGroupChanged($event)\"\n    [items]=\"$ageGroupOptions()\"\n  />\n</ion-card>\n", dependencies: [{ kind: "component", type: SelectFromListComponent, selector: "sneat-select-from-list", inputs: ["value", "filterLabel", "label", "listLabel", "listLabelColor", "isFilterable", "isLoading", "items", "items$", "lastItemLines", "labelPlacement", "justify", "other", "canAdd", "filterItem", "selectMode", "isReadonly", "$isProcessing", "sortBy"], outputs: ["valueChange", "filterChanged"] }, { kind: "component", type: IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }], animations: [formNexInAnimation] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AgeGroupFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sneat-age-group-form', animations: [formNexInAnimation], imports: [SelectFromListComponent, IonCard, IonItemDivider], template: "<ion-card @formNextIn>\n  @if (!$ageGroup()) {\n    <ion-item-divider color=\"primary\">\n      {{ $ageGroupLabel() }}\n    </ion-item-divider>\n  }\n  <sneat-select-from-list\n    label=\"Age group\"\n    labelPlacement=\"end\"\n    [value]=\"$ageGroup() || ''\"\n    (valueChange)=\"onAgeGroupChanged($event)\"\n    [items]=\"$ageGroupOptions()\"\n  />\n</ion-card>\n" }]
+        }], propDecorators: { spaceType: [{
+                type: Input,
+                args: [{ required: true }]
+            }], $ageGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "$ageGroup", required: true }] }], ageGroupChange: [{
+                type: Output
+            }], disabled: [{
+                type: Input
+            }], hidePetOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "hidePetOption", required: false }] }], hideUndisclosedOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideUndisclosedOption", required: false }] }] } });
+//# sourceMappingURL=age-group-form.component.js.map

package/esm2022/lib/components/contact-forms/person-forms/age-group/age-group-form.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"age-group-form.component.js","sourceRoot":"","sources":["../../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/person-forms/age-group/age-group-form.component.ts","../../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/person-forms/age-group/age-group-form.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,KAAK,EACL,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAc,kBAAkB,EAAa,MAAM,aAAa,CAAC;AACxE,OAAO,EAAe,uBAAuB,EAAE,MAAM,WAAW,CAAC;;AAQjE,MAAM,OAAO,qBAAqB;IANlC;QASkB,cAAS,GAAG,KAAK,CAAC,QAAQ,oDAA0B,CAAC;QAElD,mBAAc,GAAG,IAAI,YAAY,EAEjD,CAAC;QACK,aAAQ,GAAG,KAAK,CAAC;QAEV,kBAAa,GAAG,KAAK,mEAAW,CAAC;QACjC,0BAAqB,GAAG,KAAK,2EAAW,CAAC;QAE/C,mBAAc,GAAG,QAAQ,CAAC,GAAG,EAAE;YACvC,MAAM,cAAc,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YAE5C,IAAI,cAAc,EAAE,CAAC;gBACnB,OAAO,iBAAiB,CAAC;YAC3B,CAAC;YACD,OAAO,qBAAqB,CAAC;QAC/B,CAAC,0DAAC,CAAC;QAEgB,qBAAgB,GAAG,QAAQ,CAAyB,GAAG,EAAE;YAC1E,MAAM,cAAc,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YAE5C,MAAM,KAAK,GAAkB;gBAC3B;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;iBACf;gBACD;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;iBACf;aACF,CAAC;YACF,IAAI,CAAC,cAAc,EAAE,CAAC;gBACpB,KAAK,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,KAAK;iBACb,CAAC,CAAC;YACL,CAAC;YACD,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;gBAChC,KAAK,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,aAAa;oBACjB,KAAK,EAAE,aAAa;iBACrB,CAAC,CAAC;YACL,CAAC;YACD,OAAO,KAAK,CAAC;QACf,CAAC,4DAAC,CAAC;KAKJ;IAHW,iBAAiB,CAAC,QAAgB;QAC1C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAsB,CAAC,CAAC;IACnD,CAAC;8GApDU,qBAAqB;kGAArB,qBAAqB,40BClBlC,mXAcA,4CDEY,uBAAuB,8WAAE,OAAO,yLAAE,cAAc,oFAD9C,CAAC,kBAAkB,CAAC;;2FAGrB,qBAAqB;kBANjC,SAAS;+BACE,sBAAsB,cAEpB,CAAC,kBAAkB,CAAC,WACvB,CAAC,uBAAuB,EAAE,OAAO,EAAE,cAAc,CAAC;;sBAG1D,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;;sBAIxB,MAAM;;sBAGN,KAAK","sourcesContent":["import {\n  Component,\n  computed,\n  EventEmitter,\n  input,\n  Input,\n  Output,\n} from '@angular/core';\nimport { IonCard, IonItemDivider } from '@ionic/angular/standalone';\nimport { AgeGroupID, formNexInAnimation, SpaceType } from '@sneat/core';\nimport { ISelectItem, SelectFromListComponent } from '@sneat/ui';\n\n@Component({\n  selector: 'sneat-age-group-form',\n  templateUrl: 'age-group-form.component.html',\n  animations: [formNexInAnimation],\n  imports: [SelectFromListComponent, IonCard, IonItemDivider],\n})\nexport class AgeGroupFormComponent {\n  @Input({ required: true }) spaceType?: SpaceType;\n\n  public readonly $ageGroup = input.required<AgeGroupID | undefined>();\n\n  @Output() readonly ageGroupChange = new EventEmitter<\n    AgeGroupID | undefined\n  >();\n  @Input() disabled = false;\n\n  public readonly hidePetOption = input<boolean>();\n  public readonly hideUndisclosedOption = input<boolean>();\n\n  protected $ageGroupLabel = computed(() => {\n    const hidePetOptions = this.hidePetOption();\n\n    if (hidePetOptions) {\n      return 'Adult or child?';\n    }\n    return 'Adult/child or pet?';\n  });\n\n  protected readonly $ageGroupOptions = computed<readonly ISelectItem[]>(() => {\n    const hidePetOptions = this.hidePetOption();\n\n    const items: ISelectItem[] = [\n      {\n        id: 'adult',\n        title: 'Adult',\n      },\n      {\n        id: 'child',\n        title: 'Child',\n      },\n    ];\n    if (!hidePetOptions) {\n      items.push({\n        id: 'pet',\n        title: 'Pet',\n      });\n    }\n    if (!this.hideUndisclosedOption) {\n      items.push({\n        id: 'undisclosed',\n        title: 'Undisclosed',\n      });\n    }\n    return items;\n  });\n\n  protected onAgeGroupChanged(ageGroup: string): void {\n    this.ageGroupChange.emit(ageGroup as AgeGroupID);\n  }\n}\n","<ion-card @formNextIn>\n  @if (!$ageGroup()) {\n    <ion-item-divider color=\"primary\">\n      {{ $ageGroupLabel() }}\n    </ion-item-divider>\n  }\n  <sneat-select-from-list\n    label=\"Age group\"\n    labelPlacement=\"end\"\n    [value]=\"$ageGroup() || ''\"\n    (valueChange)=\"onAgeGroupChanged($event)\"\n    [items]=\"$ageGroupOptions()\"\n  />\n</ion-card>\n"]}

package/esm2022/lib/components/contact-forms/person-forms/age-group/index.js

@@ -0,0 +1,2 @@
+export * from './age-group-form.component';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/contact-forms/person-forms/age-group/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../../libs/contactus/shared/src/lib/components/contact-forms/person-forms/age-group/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './age-group-form.component';\n"]}

package/esm2022/lib/components/contact-forms/person-forms/gender-form/gender-form.component.js

@@ -0,0 +1,118 @@
+import { animate, style, transition, trigger } from '@angular/animations';
+import { ChangeDetectionStrategy, Component, EventEmitter, inject, input, Input, Output, signal, } from '@angular/core';
+import { IonButton, IonButtons, IonIcon, IonItem, IonItemDivider, IonLabel, IonSpinner, } from '@ionic/angular/standalone';
+import { genderColor } from '@sneat/components';
+import { ContactService } from '@sneat/contactus-services';
+import { GenderFemale, GenderMale, GenderOther, GenderUndisclosed, } from '@sneat/core';
+import { ClassName, SelectFromListComponent, SneatBaseComponent, } from '@sneat/ui';
+import * as i0 from "@angular/core";
+const animationTimings = '150ms';
+const genders = [
+    { id: GenderMale, title: 'Male', iconName: 'man-outline', emoji: '👨' },
+    { id: GenderFemale, title: 'Female', iconName: 'woman-outline', emoji: '👩' },
+    { id: GenderOther, title: 'Other', iconName: 'person-outline' },
+    // { id: GenderUnknown, title: 'Unknown', iconName: 'person-circle-outline' },
+    { id: GenderUndisclosed, title: 'Undisclosed', iconName: 'person' },
+];
+export class GenderFormComponent extends SneatBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.genderOptions = genders.map((g) => ({
+            id: g.id,
+            title: g.title,
+            iconName: g.iconName,
+            iconColor: genderColor(g.id),
+            emoji: g.emoji,
+        }));
+        this.hideSkipButton = false;
+        this.disabled = false;
+        this.$spaceID = input.required(...(ngDevMode ? [{ debugName: "$spaceID" }] : []));
+        this.$contactID = input.required(...(ngDevMode ? [{ debugName: "$contactID" }] : []));
+        this.$genderID = input.required(...(ngDevMode ? [{ debugName: "$genderID" }] : []));
+        this.$updatingToGender = signal(undefined, ...(ngDevMode ? [{ debugName: "$updatingToGender" }] : []));
+        this.genderChange = new EventEmitter();
+        this.contactService = inject(ContactService);
+        this.$isChanging = signal(false, ...(ngDevMode ? [{ debugName: "$isChanging" }] : []));
+    }
+    // @ViewChild(IonRadioGroup, { static: true }) radioGroup?: IonRadioGroup;
+    skip() {
+        this.onGenderChanged('undisclosed');
+    }
+    onGenderChanged(gender) {
+        const contactID = this.$contactID();
+        if (!gender) {
+            gender = 'unknown';
+        }
+        if (gender == this.$genderID()) {
+            return;
+        }
+        if (!contactID) {
+            this.genderChange.emit(gender);
+            return;
+        }
+        this.$updatingToGender.set(gender);
+        this.contactService
+            .updateContact({
+            gender: gender,
+            spaceID: this.$spaceID(),
+            contactID: contactID,
+        })
+            .subscribe({
+            next: () => {
+                this.genderChange.emit(gender);
+                this.$updatingToGender.set(undefined);
+            },
+            error: (err) => {
+                this.errorLogger.logError(err, 'Failed to change gender of a contact');
+                this.$updatingToGender.set(undefined);
+            },
+        });
+    }
+    onGenderIDChanged(genderID) {
+        this.onGenderChanged(genderID);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: GenderFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: GenderFormComponent, isStandalone: true, selector: "sneat-gender-form", inputs: { lastItemLines: { classPropertyName: "lastItemLines", publicName: "lastItemLines", isSignal: false, isRequired: false, transformFunction: null }, hideSkipButton: { classPropertyName: "hideSkipButton", publicName: "hideSkipButton", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, $spaceID: { classPropertyName: "$spaceID", publicName: "$spaceID", isSignal: true, isRequired: true, transformFunction: null }, $contactID: { classPropertyName: "$contactID", publicName: "$contactID", isSignal: true, isRequired: true, transformFunction: null }, $genderID: { classPropertyName: "$genderID", publicName: "$genderID", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { genderChange: "genderChange" }, providers: [{ provide: ClassName, useValue: 'GenderFormComponent' }], usesInheritance: true, ngImport: i0, template: "@let genderID = $genderID();\n\n<!--contactID={{ $contactID() }};-->\n<!--genderID={{ genderID }};-->\n<!--$updatingToGender={{ $updatingToGender() }}-->\n\n@if (genderID) {\n  @if (genderID === \"unknown\" && !$updatingToGender()) {\n    <ion-item-divider [color]=\"!genderID ? 'primary' : 'light'\">\n      <ion-label><b>Gender</b></ion-label>\n      @if (!hideSkipButton) {\n        <ion-buttons slot=\"end\">\n          <ion-button color=\"light\" (click)=\"skip()\">\n            <ion-label>Skip</ion-label>\n            <ion-icon name=\"close-circle-outline\" slot=\"end\" />\n          </ion-button>\n        </ion-buttons>\n      }\n    </ion-item-divider>\n  }\n  <sneat-select-from-list\n    label=\"Gender\"\n    labelPlacement=\"end\"\n    [lastItemLines]=\"lastItemLines\"\n    [$isProcessing]=\"!!$updatingToGender()\"\n    [value]=\"$updatingToGender() || (genderID === 'unknown' ? '' : genderID)\"\n    (valueChange)=\"onGenderIDChanged($event)\"\n    [items]=\"genderOptions\"\n  />\n} @else {\n  <ion-item>\n    <ion-label>Gender</ion-label>\n    <ion-spinner name=\"lines-small\" color=\"medium\" slot=\"end\" />\n  </ion-item>\n}\n", dependencies: [{ kind: "component", type: SelectFromListComponent, selector: "sneat-select-from-list", inputs: ["value", "filterLabel", "label", "listLabel", "listLabelColor", "isFilterable", "isLoading", "items", "items$", "lastItemLines", "labelPlacement", "justify", "other", "canAdd", "filterItem", "selectMode", "isReadonly", "$isProcessing", "sortBy"], outputs: ["valueChange", "filterChanged"] }, { kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }], animations: [
+            trigger('radioOut', [
+                transition(':leave', [animate(animationTimings, style({ height: 0 }))]),
+            ]),
+            trigger('selectIn', [
+                transition(':enter', [
+                    // style({ display: 'none' }), // initial styles
+                    animate(animationTimings),
+                ]),
+            ]),
+        ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: GenderFormComponent, decorators: [{
+            type: Component,
+            args: [{ imports: [
+                        SelectFromListComponent,
+                        IonItemDivider,
+                        IonLabel,
+                        IonButtons,
+                        IonButton,
+                        IonIcon,
+                        IonSpinner,
+                        IonItem,
+                    ], animations: [
+                        trigger('radioOut', [
+                            transition(':leave', [animate(animationTimings, style({ height: 0 }))]),
+                        ]),
+                        trigger('selectIn', [
+                            transition(':enter', [
+                                // style({ display: 'none' }), // initial styles
+                                animate(animationTimings),
+                            ]),
+                        ]),
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, selector: 'sneat-gender-form', providers: [{ provide: ClassName, useValue: 'GenderFormComponent' }], template: "@let genderID = $genderID();\n\n<!--contactID={{ $contactID() }};-->\n<!--genderID={{ genderID }};-->\n<!--$updatingToGender={{ $updatingToGender() }}-->\n\n@if (genderID) {\n  @if (genderID === \"unknown\" && !$updatingToGender()) {\n    <ion-item-divider [color]=\"!genderID ? 'primary' : 'light'\">\n      <ion-label><b>Gender</b></ion-label>\n      @if (!hideSkipButton) {\n        <ion-buttons slot=\"end\">\n          <ion-button color=\"light\" (click)=\"skip()\">\n            <ion-label>Skip</ion-label>\n            <ion-icon name=\"close-circle-outline\" slot=\"end\" />\n          </ion-button>\n        </ion-buttons>\n      }\n    </ion-item-divider>\n  }\n  <sneat-select-from-list\n    label=\"Gender\"\n    labelPlacement=\"end\"\n    [lastItemLines]=\"lastItemLines\"\n    [$isProcessing]=\"!!$updatingToGender()\"\n    [value]=\"$updatingToGender() || (genderID === 'unknown' ? '' : genderID)\"\n    (valueChange)=\"onGenderIDChanged($event)\"\n    [items]=\"genderOptions\"\n  />\n} @else {\n  <ion-item>\n    <ion-label>Gender</ion-label>\n    <ion-spinner name=\"lines-small\" color=\"medium\" slot=\"end\" />\n  </ion-item>\n}\n" }]
+        }], propDecorators: { lastItemLines: [{
+                type: Input
+            }], hideSkipButton: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], $spaceID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$spaceID", required: true }] }], $contactID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$contactID", required: true }] }], $genderID: [{ type: i0.Input, args: [{ isSignal: true, alias: "$genderID", required: true }] }], genderChange: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=gender-form.component.js.map