add calendarview event creation

admin/projects/rschneider/ng-daisyui/src/lib/components/card/card-with-centered-content-and-paddings/card-with-centered-content-and-paddings.html

@@ -0,0 +1,26 @@
+<div class="card bg-base-100 w-96 shadow-sm" [class]="cardClass()">
+  @if (imageSrc()) {
+  <figure class="px-10 pt-10">
+    <img
+      [src]="imageSrc()"
+      [alt]="imageAlt()"
+      class="rounded-xl"
+      [class]="imageClass()"
+    />
+  </figure>
+  }
+  <div class="card-body items-center text-center">
+    @if (cardTitle()) {
+      <h2 class="card-title">{{ cardTitle() }}</h2>
+    }
+    @if (cardText()) {
+      <p>A card component has a figure, a body part, and inside body there are title and actions parts</p>
+    }
+    <ng-content></ng-content>
+    @if (cardActionText()) {
+      <div class="card-actions">
+        <button class="btn btn-primary">{{ cardActionText() }}</button>
+      </div>
+    }
+  </div>
+</div>

admin/projects/rschneider/ng-daisyui/src/lib/components/card/card-with-centered-content-and-paddings/card-with-centered-content-and-paddings.ts

@@ -0,0 +1,19 @@
+import { Component, input, output, signal } from '@angular/core';
+
+@Component({
+  selector: 'rs-daisy-card-with-centered-content-and-paddings',
+  imports: [],
+  templateUrl: './card-with-centered-content-and-paddings.html',
+  styleUrl: './card-with-centered-content-and-paddings.css',
+})
+export class CardWithCenteredContentAndPaddings {
+  imageSrc = input<string | null>(null);
+  imageAlt = input<string | null>(null);
+  imageClass = input<string | null>(null);
+  cardTitle = input<string | null>(null);
+  cardText = input<string | null>(null);
+  cardActionText = input<string | null>(null);
+  cardActionClick = output<void>();
+  cardClass = signal<string | null>(null);
+
+}

admin/projects/rschneider/ng-daisyui/src/lib/components/modal/modal.html

@@ -0,0 +1,15 @@
+{{ isOpen() }}
+<dialog #modal class="modal" [class]="dialogStyleClass()">
+  <div class="modal-box" [class]="modalBoxStyleClass()">
+    <button (click)="closeClicked()" class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
+    @if (headerText()) {
+      <h3 class="text-lg font-bold">{{ headerText() }}</h3>
+    }
+    <ng-content></ng-content>
+  </div>
+  @if (backdrop()) {
+    <form (click)="closeClicked()" class="modal-backdrop">
+      <button>close</button>
+    </form>
+  }
+</dialog>

admin/projects/rschneider/ng-daisyui/src/lib/components/modal/modal.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { Modal } from './modal';
+
+describe('Modal', () => {
+  let component: Modal;
+  let fixture: ComponentFixture<Modal>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [Modal]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(Modal);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

admin/projects/rschneider/ng-daisyui/src/lib/components/modal/modal.ts

@@ -0,0 +1,95 @@
+import {
+  AfterViewInit,
+  Component,
+  effect,
+  ElementRef,
+  input,
+  model, OnDestroy,
+  OnInit,
+  output,
+  signal,
+  ViewChild,
+} from '@angular/core';
+
+@Component({
+  selector: 'rs-daisy-modal',
+  imports: [],
+  templateUrl: './modal.html',
+  styleUrl: './modal.css',
+})
+export class Modal implements OnInit , AfterViewInit, OnDestroy{
+  dialogStyleClass = input<string>();
+  backdrop = input<boolean>(false);
+  modalBoxStyleClass = input<string>();
+  closeButton = input<boolean>(true);
+  headerText = input<string>();
+  isOpen = model<boolean>(false);
+
+  onClose = output<boolean>();
+  closeClick = output<boolean>();
+
+  @ViewChild('modal') modalRef!: ElementRef<HTMLDialogElement>;
+
+  private initialized = signal<boolean>(false);
+
+  constructor() {
+    effect(() => {
+      if  ( this.isOpen()){
+        this.doOpen();
+      }else{
+        this.doClose();
+      }
+    });
+  }
+
+
+  ngOnInit() {
+   /* if (open()){
+
+    }*/
+  }
+
+  ngAfterViewInit() {
+    // console.info("dialog",this.dialog)
+    const modal = this.modalRef.nativeElement;
+    modal.addEventListener('close', () => this.onClose.emit(true) );
+    this.initialized.set(true);
+  }
+
+  emitClose(){
+    console.info("emit close", this.onClose);
+    this.onClose?.emit(true)
+  }
+
+  doOpen() {
+    if ( !this.initialized()){
+      return;
+    }
+    const modal = this.modalRef.nativeElement;
+    if ( !modal.open ){
+      modal.showModal();
+    }
+  }
+
+  doClose() {
+    if ( !this.initialized()){
+      return;
+    }
+    const modal = this.modalRef.nativeElement;
+    if ( modal.open ){
+      modal.close();
+    }
+  }
+  ngOnDestroy() {
+    console.info("destroy");
+     // const modal =  this.modalRef?.nativeElement;
+     // if ( modal ){
+     //   modal.removeEventListener('close', this.emitClose);
+     // }
+  }
+
+  closeClicked() {
+    console.info("close clicked");
+    this.closeClick.emit(true);
+  }
+}

admin/projects/rschneider/ng-daisyui/src/public-api.ts

@@ -6,5 +6,7 @@ export * from './lib/ng-daisyui';
 export * from './lib/components/button/button';
 export * from './lib/components/footer/footer';
 export * from './lib/components/breadcrumbs/breadcrumbs';
+export * from './lib/components/modal/modal';
+export * from './lib/components/card/card-with-centered-content-and-paddings/card-with-centered-content-and-paddings';
 export * from './lib/daisy.types';
 export * from './lib/layout/';