hopesf-angular-dev-utils 1.0.0

package/fesm2022/hopesf-angular-dev-utils.mjs

@@ -0,0 +1,765 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Output, Input, Component, forwardRef, ContentChild, createComponent, Injectable } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { Subject } from 'rxjs';
+
+class ButtonComponent {
+    constructor() {
+        this.variant = 'primary';
+        this.size = 'md';
+        this.type = 'button';
+        this.disabled = false;
+        this.loading = false;
+        this.fullWidth = false;
+        this.clicked = new EventEmitter();
+    }
+    get buttonClasses() {
+        const classes = ['adu-button', `adu-button-${this.variant}`, `adu-button-${this.size}`];
+        if (this.fullWidth) {
+            classes.push('w-full');
+        }
+        return classes.join(' ');
+    }
+    handleClick(event) {
+        if (!this.disabled && !this.loading) {
+            this.clicked.emit(event);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ButtonComponent, isStandalone: true, selector: "adu-button", inputs: { variant: "variant", size: "size", type: "type", disabled: "disabled", loading: "loading", fullWidth: "fullWidth" }, outputs: { clicked: "clicked" }, ngImport: i0, template: `
+    <button
+      [type]="type"
+      [disabled]="disabled || loading"
+      [class]="buttonClasses"
+      (click)="handleClick($event)"
+    >
+      <span *ngIf="loading" class="adu-button-spinner"></span>
+      <ng-content></ng-content>
+    </button>
+  `, isInline: true, styles: [".adu-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;font-weight:500;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-button:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-offset-width: 2px }.adu-button:disabled{cursor:not-allowed;opacity:.5}.adu-button-primary{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-primary:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity, 1))}.adu-button-primary:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1)) }.adu-button-secondary{--tw-bg-opacity: 1;background-color:rgb(75 85 99 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-secondary:hover{--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}.adu-button-secondary:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity, 1)) }.adu-button-success{--tw-bg-opacity: 1;background-color:rgb(22 163 74 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-success:hover{--tw-bg-opacity: 1;background-color:rgb(21 128 61 / var(--tw-bg-opacity, 1))}.adu-button-success:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity, 1)) }.adu-button-danger{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-danger:hover{--tw-bg-opacity: 1;background-color:rgb(185 28 28 / var(--tw-bg-opacity, 1))}.adu-button-danger:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1)) }.adu-button-warning{--tw-bg-opacity: 1;background-color:rgb(234 179 8 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-warning:hover{--tw-bg-opacity: 1;background-color:rgb(202 138 4 / var(--tw-bg-opacity, 1))}.adu-button-warning:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(234 179 8 / var(--tw-ring-opacity, 1)) }.adu-button-ghost{border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:transparent;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-button-ghost:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-button-ghost:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity, 1)) }.adu-button-sm{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}.adu-button-md{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}.adu-button-lg{padding:.75rem 1.5rem;font-size:1.125rem;line-height:1.75rem}.adu-button-spinner{display:inline-block;height:1rem;width:1rem}@keyframes spin{to{transform:rotate(360deg)}}.adu-button-spinner{animation:spin 1s linear infinite;border-radius:9999px;border-width:2px;border-color:currentColor;border-top-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-button', standalone: true, imports: [CommonModule], template: `
+    <button
+      [type]="type"
+      [disabled]="disabled || loading"
+      [class]="buttonClasses"
+      (click)="handleClick($event)"
+    >
+      <span *ngIf="loading" class="adu-button-spinner"></span>
+      <ng-content></ng-content>
+    </button>
+  `, styles: [".adu-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;font-weight:500;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-button:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-offset-width: 2px }.adu-button:disabled{cursor:not-allowed;opacity:.5}.adu-button-primary{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-primary:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity, 1))}.adu-button-primary:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1)) }.adu-button-secondary{--tw-bg-opacity: 1;background-color:rgb(75 85 99 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-secondary:hover{--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}.adu-button-secondary:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity, 1)) }.adu-button-success{--tw-bg-opacity: 1;background-color:rgb(22 163 74 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-success:hover{--tw-bg-opacity: 1;background-color:rgb(21 128 61 / var(--tw-bg-opacity, 1))}.adu-button-success:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity, 1)) }.adu-button-danger{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-danger:hover{--tw-bg-opacity: 1;background-color:rgb(185 28 28 / var(--tw-bg-opacity, 1))}.adu-button-danger:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1)) }.adu-button-warning{--tw-bg-opacity: 1;background-color:rgb(234 179 8 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.adu-button-warning:hover{--tw-bg-opacity: 1;background-color:rgb(202 138 4 / var(--tw-bg-opacity, 1))}.adu-button-warning:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(234 179 8 / var(--tw-ring-opacity, 1)) }.adu-button-ghost{border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:transparent;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-button-ghost:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-button-ghost:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity, 1)) }.adu-button-sm{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}.adu-button-md{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}.adu-button-lg{padding:.75rem 1.5rem;font-size:1.125rem;line-height:1.75rem}.adu-button-spinner{display:inline-block;height:1rem;width:1rem}@keyframes spin{to{transform:rotate(360deg)}}.adu-button-spinner{animation:spin 1s linear infinite;border-radius:9999px;border-width:2px;border-color:currentColor;border-top-color:transparent}\n"] }]
+        }], propDecorators: { variant: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], loading: [{
+                type: Input
+            }], fullWidth: [{
+                type: Input
+            }], clicked: [{
+                type: Output
+            }] } });
+
+class InputComponent {
+    constructor() {
+        this.id = `adu-input-${Math.random().toString(36).substr(2, 9)}`;
+        this.label = '';
+        this.type = 'text';
+        this.placeholder = '';
+        this.size = 'md';
+        this.disabled = false;
+        this.readonly = false;
+        this.required = false;
+        this.error = '';
+        this.hint = '';
+        this.icon = '';
+        this.value = '';
+        this.onChange = () => { };
+        this.onTouched = () => { };
+    }
+    get inputClasses() {
+        const classes = ['adu-input', `adu-input-${this.size}`];
+        if (this.error) {
+            classes.push('adu-input-error-state');
+        }
+        if (this.icon) {
+            classes.push('pr-10');
+        }
+        return classes.join(' ');
+    }
+    onInputChange(event) {
+        const input = event.target;
+        this.value = input.value;
+        this.onChange(this.value);
+    }
+    writeValue(value) {
+        this.value = value || '';
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputComponent, isStandalone: true, selector: "adu-input", inputs: { id: "id", label: "label", type: "type", placeholder: "placeholder", size: "size", disabled: "disabled", readonly: "readonly", required: "required", error: "error", hint: "hint", icon: "icon" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InputComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: `
+    <div class="adu-input-wrapper">
+      <label *ngIf="label" [for]="id" class="adu-input-label">
+        {{ label }}
+        <span *ngIf="required" class="text-red-500">*</span>
+      </label>
+      
+      <div class="relative">
+        <input
+          [id]="id"
+          [type]="type"
+          [placeholder]="placeholder"
+          [disabled]="disabled"
+          [readonly]="readonly"
+          [value]="value"
+          [class]="inputClasses"
+          (input)="onInputChange($event)"
+          (blur)="onTouched()"
+        />
+        <span *ngIf="icon" class="adu-input-icon">{{ icon }}</span>
+      </div>
+
+      <p *ngIf="error" class="adu-input-error">{{ error }}</p>
+      <p *ngIf="hint && !error" class="adu-input-hint">{{ hint }}</p>
+    </div>
+  `, isInline: true, styles: [".adu-input-wrapper{width:100%}.adu-input-label{margin-bottom:.25rem;display:block;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-input{width:100%;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-input:focus{border-color:transparent;outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1)) }.adu-input:disabled{cursor:not-allowed;--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-input::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.adu-input-sm{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}.adu-input-md{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}.adu-input-lg{padding:.75rem 1.25rem;font-size:1.125rem;line-height:1.75rem}.adu-input-error-state{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}.adu-input-error-state:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1)) }.adu-input-icon{pointer-events:none;position:absolute;right:.75rem;top:50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.adu-input-error{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}.adu-input-hint{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-input', standalone: true, imports: [CommonModule], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InputComponent),
+                            multi: true
+                        }
+                    ], template: `
+    <div class="adu-input-wrapper">
+      <label *ngIf="label" [for]="id" class="adu-input-label">
+        {{ label }}
+        <span *ngIf="required" class="text-red-500">*</span>
+      </label>
+      
+      <div class="relative">
+        <input
+          [id]="id"
+          [type]="type"
+          [placeholder]="placeholder"
+          [disabled]="disabled"
+          [readonly]="readonly"
+          [value]="value"
+          [class]="inputClasses"
+          (input)="onInputChange($event)"
+          (blur)="onTouched()"
+        />
+        <span *ngIf="icon" class="adu-input-icon">{{ icon }}</span>
+      </div>
+
+      <p *ngIf="error" class="adu-input-error">{{ error }}</p>
+      <p *ngIf="hint && !error" class="adu-input-hint">{{ hint }}</p>
+    </div>
+  `, styles: [".adu-input-wrapper{width:100%}.adu-input-label{margin-bottom:.25rem;display:block;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-input{width:100%;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-input:focus{border-color:transparent;outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1)) }.adu-input:disabled{cursor:not-allowed;--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-input::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.adu-input-sm{padding:.375rem .75rem;font-size:.875rem;line-height:1.25rem}.adu-input-md{padding:.5rem 1rem;font-size:1rem;line-height:1.5rem}.adu-input-lg{padding:.75rem 1.25rem;font-size:1.125rem;line-height:1.75rem}.adu-input-error-state{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}.adu-input-error-state:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1)) }.adu-input-icon{pointer-events:none;position:absolute;right:.75rem;top:50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.adu-input-error{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}.adu-input-hint{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}\n"] }]
+        }], propDecorators: { id: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], error: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }] } });
+
+class CardComponent {
+    constructor() {
+        this.shadow = 'sm';
+        this.hoverable = false;
+        this.padding = 'normal';
+        this.hasHeader = false;
+        this.hasFooter = false;
+    }
+    get cardClasses() {
+        const classes = ['adu-card'];
+        if (this.shadow !== 'none') {
+            classes.push(`adu-card-shadow-${this.shadow}`);
+        }
+        if (this.hoverable) {
+            classes.push('adu-card-hoverable');
+        }
+        return classes.join(' ');
+    }
+    get bodyClasses() {
+        const classes = ['adu-card-body'];
+        if (this.padding === 'compact') {
+            classes.push('adu-card-body-compact');
+        }
+        else if (this.padding === 'spacious') {
+            classes.push('adu-card-body-spacious');
+        }
+        return classes.join(' ');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardComponent, isStandalone: true, selector: "adu-card", inputs: { shadow: "shadow", hoverable: "hoverable", padding: "padding", hasHeader: "hasHeader", hasFooter: "hasFooter" }, ngImport: i0, template: `
+    <div [class]="cardClasses">
+      <div *ngIf="hasHeader" class="adu-card-header">
+        <ng-content select="[card-header]"></ng-content>
+      </div>
+      
+      <div class="adu-card-body">
+        <ng-content></ng-content>
+      </div>
+      
+      <div *ngIf="hasFooter" class="adu-card-footer">
+        <ng-content select="[card-footer]"></ng-content>
+      </div>
+    </div>
+  `, isInline: true, styles: [".adu-card{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-card-hoverable:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}.adu-card-body{padding:1rem 1.5rem}.adu-card-body-compact{padding:.75rem 1rem}.adu-card-body-spacious{padding:1.5rem 2rem}.adu-card-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-card', standalone: true, imports: [CommonModule], template: `
+    <div [class]="cardClasses">
+      <div *ngIf="hasHeader" class="adu-card-header">
+        <ng-content select="[card-header]"></ng-content>
+      </div>
+      
+      <div class="adu-card-body">
+        <ng-content></ng-content>
+      </div>
+      
+      <div *ngIf="hasFooter" class="adu-card-footer">
+        <ng-content select="[card-footer]"></ng-content>
+      </div>
+    </div>
+  `, styles: [".adu-card{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.adu-card-hoverable:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.adu-card-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}.adu-card-body{padding:1rem 1.5rem}.adu-card-body-compact{padding:.75rem 1rem}.adu-card-body-spacious{padding:1.5rem 2rem}.adu-card-footer{border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}\n"] }]
+        }], propDecorators: { shadow: [{
+                type: Input
+            }], hoverable: [{
+                type: Input
+            }], padding: [{
+                type: Input
+            }], hasHeader: [{
+                type: Input
+            }], hasFooter: [{
+                type: Input
+            }] } });
+
+class ModalComponent {
+    constructor() {
+        this.isOpen = false;
+        this.title = '';
+        this.size = 'md';
+        this.closeOnBackdrop = true;
+        this.showCloseButton = true;
+        this.hasFooter = false;
+        this.isOpenChange = new EventEmitter();
+        this.closed = new EventEmitter();
+    }
+    get modalClasses() {
+        return ['adu-modal-content', `adu-modal-${this.size}`].join(' ');
+    }
+    close() {
+        this.isOpen = false;
+        this.isOpenChange.emit(false);
+        this.closed.emit();
+    }
+    onBackdropClick() {
+        if (this.closeOnBackdrop) {
+            this.close();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ModalComponent, isStandalone: true, selector: "adu-modal", inputs: { isOpen: "isOpen", title: "title", size: "size", closeOnBackdrop: "closeOnBackdrop", showCloseButton: "showCloseButton", hasFooter: "hasFooter" }, outputs: { isOpenChange: "isOpenChange", closed: "closed" }, ngImport: i0, template: `
+    <div class="adu-modal-wrapper" *ngIf="isOpen" (click)="onBackdropClick()">
+      <div [class]="modalClasses" (click)="$event.stopPropagation()">
+        <button 
+          *ngIf="showCloseButton"
+          class="adu-modal-close" 
+          (click)="close()"
+          aria-label="Close modal"
+        >
+          ×
+        </button>
+
+        <div *ngIf="title" class="adu-modal-title">
+          {{ title }}
+        </div>
+
+        <div class="adu-modal-body">
+          <ng-content></ng-content>
+        </div>
+
+        <div *ngIf="hasFooter" class="adu-modal-footer">
+          <ng-content select="[modal-footer]"></ng-content>
+        </div>
+      </div>
+    </div>
+  `, isInline: true, styles: [".adu-modal-wrapper{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1));--tw-bg-opacity: .5;padding:1rem;animation:fadeIn .2s ease-out}.adu-modal-content{position:relative;max-height:90vh;overflow-y:auto;border-radius:.5rem;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);animation:slideUp .3s ease-out}.adu-modal-sm{width:100%;max-width:24rem}.adu-modal-md{width:100%;max-width:28rem}.adu-modal-lg{width:100%;max-width:42rem}.adu-modal-xl{width:100%;max-width:56rem}.adu-modal-full{height:100%;width:100%;max-width:none;border-radius:0}.adu-modal-close{position:absolute;top:1rem;right:1rem;font-size:1.875rem;line-height:2.25rem;font-weight:300;line-height:1;--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-modal-close:hover{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.adu-modal-close{display:flex;height:2rem;width:2rem;align-items:center;justify-content:center}.adu-modal-title{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding:1rem 1.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.adu-modal-body{padding:1rem 1.5rem}.adu-modal-footer{display:flex;justify-content:flex-end;gap:.5rem;border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fadeIn{animation:fadeIn .2s ease-out}.animate-slideUp{animation:slideUp .3s ease-out}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-modal', standalone: true, imports: [CommonModule], template: `
+    <div class="adu-modal-wrapper" *ngIf="isOpen" (click)="onBackdropClick()">
+      <div [class]="modalClasses" (click)="$event.stopPropagation()">
+        <button 
+          *ngIf="showCloseButton"
+          class="adu-modal-close" 
+          (click)="close()"
+          aria-label="Close modal"
+        >
+          ×
+        </button>
+
+        <div *ngIf="title" class="adu-modal-title">
+          {{ title }}
+        </div>
+
+        <div class="adu-modal-body">
+          <ng-content></ng-content>
+        </div>
+
+        <div *ngIf="hasFooter" class="adu-modal-footer">
+          <ng-content select="[modal-footer]"></ng-content>
+        </div>
+      </div>
+    </div>
+  `, styles: [".adu-modal-wrapper{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1));--tw-bg-opacity: .5;padding:1rem;animation:fadeIn .2s ease-out}.adu-modal-content{position:relative;max-height:90vh;overflow-y:auto;border-radius:.5rem;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);animation:slideUp .3s ease-out}.adu-modal-sm{width:100%;max-width:24rem}.adu-modal-md{width:100%;max-width:28rem}.adu-modal-lg{width:100%;max-width:42rem}.adu-modal-xl{width:100%;max-width:56rem}.adu-modal-full{height:100%;width:100%;max-width:none;border-radius:0}.adu-modal-close{position:absolute;top:1rem;right:1rem;font-size:1.875rem;line-height:2.25rem;font-weight:300;line-height:1;--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-modal-close:hover{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.adu-modal-close{display:flex;height:2rem;width:2rem;align-items:center;justify-content:center}.adu-modal-title{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));padding:1rem 1.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.adu-modal-body{padding:1rem 1.5rem}.adu-modal-footer{display:flex;justify-content:flex-end;gap:.5rem;border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:1rem 1.5rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fadeIn{animation:fadeIn .2s ease-out}.animate-slideUp{animation:slideUp .3s ease-out}\n"] }]
+        }], propDecorators: { isOpen: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], closeOnBackdrop: [{
+                type: Input
+            }], showCloseButton: [{
+                type: Input
+            }], hasFooter: [{
+                type: Input
+            }], isOpenChange: [{
+                type: Output
+            }], closed: [{
+                type: Output
+            }] } });
+
+class TableComponent {
+    constructor() {
+        this.data = [];
+        this.columns = [];
+        this.config = {
+            sortable: true,
+            pageable: true,
+            pageSize: 10,
+            striped: true,
+            hoverable: true
+        };
+        this.rowClicked = new EventEmitter();
+        this.sortChanged = new EventEmitter();
+        this.sortColumn = '';
+        this.sortDirection = 'asc';
+        this.currentPage = 1;
+        this.hasEmptyState = false;
+    }
+    ngOnInit() {
+        this.config = { ...this.getDefaultConfig(), ...this.config };
+    }
+    get sortedData() {
+        if (!this.config.sortable || !this.sortColumn) {
+            return this.data;
+        }
+        return [...this.data].sort((a, b) => {
+            const aVal = this.getNestedValue(a, this.sortColumn);
+            const bVal = this.getNestedValue(b, this.sortColumn);
+            if (aVal < bVal)
+                return this.sortDirection === 'asc' ? -1 : 1;
+            if (aVal > bVal)
+                return this.sortDirection === 'asc' ? 1 : -1;
+            return 0;
+        });
+    }
+    get paginatedData() {
+        if (!this.config.pageable) {
+            return this.sortedData;
+        }
+        const start = (this.currentPage - 1) * (this.config.pageSize || 10);
+        const end = start + (this.config.pageSize || 10);
+        return this.sortedData.slice(start, end);
+    }
+    get totalPages() {
+        return Math.ceil(this.data.length / (this.config.pageSize || 10));
+    }
+    onSort(column) {
+        if (!column.sortable || !this.config.sortable)
+            return;
+        if (this.sortColumn === column.key) {
+            this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
+        }
+        else {
+            this.sortColumn = column.key;
+            this.sortDirection = 'asc';
+        }
+        this.sortChanged.emit({ column: column.key, direction: this.sortDirection });
+    }
+    goToPage(page) {
+        if (page >= 1 && page <= this.totalPages) {
+            this.currentPage = page;
+        }
+    }
+    getCellValue(row, column) {
+        if (column.cellTemplate) {
+            return column.cellTemplate(row);
+        }
+        return this.getNestedValue(row, column.key);
+    }
+    getNestedValue(obj, path) {
+        return path.split('.').reduce((current, prop) => current?.[prop], obj);
+    }
+    getDefaultConfig() {
+        return {
+            sortable: true,
+            pageable: true,
+            pageSize: 10,
+            striped: true,
+            hoverable: true
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableComponent, isStandalone: true, selector: "adu-table", inputs: { data: "data", columns: "columns", config: "config" }, outputs: { rowClicked: "rowClicked", sortChanged: "sortChanged" }, queries: [{ propertyName: "cellTemplate", first: true, predicate: ["cellTemplate"], descendants: true }], ngImport: i0, template: `
+    <div class="adu-table-container">
+      <table class="adu-table" [class.adu-table-striped]="config.striped" [class.adu-table-hoverable]="config.hoverable">
+        <thead class="adu-table-header">
+          <tr>
+            <th 
+              *ngFor="let column of columns"
+              [style.width]="column.width"
+              [class.adu-table-sortable]="column.sortable && config.sortable"
+              (click)="onSort(column)"
+              class="adu-table-th"
+            >
+              <div class="flex items-center justify-between">
+                <span>{{ column.label }}</span>
+                <span *ngIf="column.sortable && config.sortable" class="adu-table-sort-icon">
+                  <span *ngIf="sortColumn === column.key">
+                    {{ sortDirection === 'asc' ? '↑' : '↓' }}
+                  </span>
+                  <span *ngIf="sortColumn !== column.key" class="text-gray-300">↕</span>
+                </span>
+              </div>
+            </th>
+          </tr>
+        </thead>
+        <tbody class="adu-table-body">
+          <tr *ngFor="let row of paginatedData; let i = index" class="adu-table-row">
+            <td *ngFor="let column of columns" class="adu-table-td">
+              <ng-container *ngIf="cellTemplate; else defaultCell">
+                <ng-container *ngTemplateOutlet="cellTemplate; context: { $implicit: row, column: column }"></ng-container>
+              </ng-container>
+              <ng-template #defaultCell>
+                {{ getCellValue(row, column) }}
+              </ng-template>
+            </td>
+          </tr>
+          <tr *ngIf="paginatedData.length === 0" class="adu-table-empty">
+            <td [attr.colspan]="columns.length" class="text-center py-8 text-gray-500">
+              <ng-content select="[empty-state]"></ng-content>
+              <span *ngIf="!hasEmptyState">No data available</span>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+
+      <!-- Pagination -->
+      <div *ngIf="config.pageable && totalPages > 1" class="adu-table-pagination">
+        <button 
+          class="adu-pagination-btn" 
+          [disabled]="currentPage === 1"
+          (click)="goToPage(currentPage - 1)"
+        >
+          Previous
+        </button>
+
+        <div class="adu-pagination-info">
+          Page {{ currentPage }} of {{ totalPages }}
+        </div>
+
+        <button 
+          class="adu-pagination-btn"
+          [disabled]="currentPage === totalPages"
+          (click)="goToPage(currentPage + 1)"
+        >
+          Next
+        </button>
+      </div>
+    </div>
+  `, isInline: true, styles: [".adu-table-container{width:100%;overflow-x:auto;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.adu-table{width:100%;border-collapse:collapse}.adu-table-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-th{padding:.75rem 1.5rem;text-align:left;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-table-sortable{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-table-sortable:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-table-sort-icon{margin-left:.5rem;display:inline-block}.adu-table-body>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse));--tw-divide-opacity: 1;border-color:rgb(229 231 235 / var(--tw-divide-opacity, 1))}.adu-table-row{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-table-striped .adu-table-row:nth-child(2n){--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-hoverable .adu-table-row:hover{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}.adu-table-td{padding:1rem 1.5rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.adu-table-empty{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-pagination{display:flex;align-items:center;justify-content:space-between;border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:.75rem 1.5rem}.adu-pagination-btn{border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-pagination-btn:hover{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-pagination-btn:disabled{cursor:not-allowed;opacity:.5}.adu-pagination-info{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-table', standalone: true, imports: [CommonModule], template: `
+    <div class="adu-table-container">
+      <table class="adu-table" [class.adu-table-striped]="config.striped" [class.adu-table-hoverable]="config.hoverable">
+        <thead class="adu-table-header">
+          <tr>
+            <th 
+              *ngFor="let column of columns"
+              [style.width]="column.width"
+              [class.adu-table-sortable]="column.sortable && config.sortable"
+              (click)="onSort(column)"
+              class="adu-table-th"
+            >
+              <div class="flex items-center justify-between">
+                <span>{{ column.label }}</span>
+                <span *ngIf="column.sortable && config.sortable" class="adu-table-sort-icon">
+                  <span *ngIf="sortColumn === column.key">
+                    {{ sortDirection === 'asc' ? '↑' : '↓' }}
+                  </span>
+                  <span *ngIf="sortColumn !== column.key" class="text-gray-300">↕</span>
+                </span>
+              </div>
+            </th>
+          </tr>
+        </thead>
+        <tbody class="adu-table-body">
+          <tr *ngFor="let row of paginatedData; let i = index" class="adu-table-row">
+            <td *ngFor="let column of columns" class="adu-table-td">
+              <ng-container *ngIf="cellTemplate; else defaultCell">
+                <ng-container *ngTemplateOutlet="cellTemplate; context: { $implicit: row, column: column }"></ng-container>
+              </ng-container>
+              <ng-template #defaultCell>
+                {{ getCellValue(row, column) }}
+              </ng-template>
+            </td>
+          </tr>
+          <tr *ngIf="paginatedData.length === 0" class="adu-table-empty">
+            <td [attr.colspan]="columns.length" class="text-center py-8 text-gray-500">
+              <ng-content select="[empty-state]"></ng-content>
+              <span *ngIf="!hasEmptyState">No data available</span>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+
+      <!-- Pagination -->
+      <div *ngIf="config.pageable && totalPages > 1" class="adu-table-pagination">
+        <button 
+          class="adu-pagination-btn" 
+          [disabled]="currentPage === 1"
+          (click)="goToPage(currentPage - 1)"
+        >
+          Previous
+        </button>
+
+        <div class="adu-pagination-info">
+          Page {{ currentPage }} of {{ totalPages }}
+        </div>
+
+        <button 
+          class="adu-pagination-btn"
+          [disabled]="currentPage === totalPages"
+          (click)="goToPage(currentPage + 1)"
+        >
+          Next
+        </button>
+      </div>
+    </div>
+  `, styles: [".adu-table-container{width:100%;overflow-x:auto;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.adu-table{width:100%;border-collapse:collapse}.adu-table-header{border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-th{padding:.75rem 1.5rem;text-align:left;font-size:.75rem;line-height:1rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.adu-table-sortable{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-table-sortable:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.adu-table-sort-icon{margin-left:.5rem;display:inline-block}.adu-table-body>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse));--tw-divide-opacity: 1;border-color:rgb(229 231 235 / var(--tw-divide-opacity, 1))}.adu-table-row{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-table-striped .adu-table-row:nth-child(2n){--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-hoverable .adu-table-row:hover{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}.adu-table-td{padding:1rem 1.5rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.adu-table-empty{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-table-pagination{display:flex;align-items:center;justify-content:space-between;border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:.75rem 1.5rem}.adu-pagination-btn{border-radius:.375rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.adu-pagination-btn:hover{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.adu-pagination-btn:disabled{cursor:not-allowed;opacity:.5}.adu-pagination-info{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}\n"] }]
+        }], propDecorators: { data: [{
+                type: Input
+            }], columns: [{
+                type: Input
+            }], config: [{
+                type: Input
+            }], cellTemplate: [{
+                type: ContentChild,
+                args: ['cellTemplate']
+            }], rowClicked: [{
+                type: Output
+            }], sortChanged: [{
+                type: Output
+            }] } });
+
+class SpinnerComponent {
+    constructor() {
+        this.size = 'md';
+        this.color = 'primary';
+        this.overlay = false;
+        this.message = '';
+    }
+    get spinnerClasses() {
+        return ['adu-spinner', `adu-spinner-${this.size}`, `adu-spinner-${this.color}`].join(' ');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SpinnerComponent, isStandalone: true, selector: "adu-spinner", inputs: { size: "size", color: "color", overlay: "overlay", message: "message" }, ngImport: i0, template: `
+    <div *ngIf="overlay" class="adu-spinner-overlay">
+      <div [class]="spinnerClasses"></div>
+      <p *ngIf="message" class="adu-spinner-message">{{ message }}</p>
+    </div>
+
+    <div *ngIf="!overlay" [class]="spinnerClasses"></div>
+  `, isInline: true, styles: [".adu-spinner{display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.adu-spinner{animation:spin 1s linear infinite;border-radius:9999px;border-width:4px;border-top-color:transparent}.adu-spinner-sm{height:1rem;width:1rem;border-width:2px}.adu-spinner-md{height:2rem;width:2rem;border-width:4px}.adu-spinner-lg{height:3rem;width:3rem;border-width:4px}.adu-spinner-primary{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-secondary{--tw-border-opacity: 1;border-color:rgb(75 85 99 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-overlay{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1));--tw-bg-opacity: .5 }.adu-spinner-message{margin-top:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:500;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'adu-spinner', standalone: true, imports: [CommonModule], template: `
+    <div *ngIf="overlay" class="adu-spinner-overlay">
+      <div [class]="spinnerClasses"></div>
+      <p *ngIf="message" class="adu-spinner-message">{{ message }}</p>
+    </div>
+
+    <div *ngIf="!overlay" [class]="spinnerClasses"></div>
+  `, styles: [".adu-spinner{display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.adu-spinner{animation:spin 1s linear infinite;border-radius:9999px;border-width:4px;border-top-color:transparent}.adu-spinner-sm{height:1rem;width:1rem;border-width:2px}.adu-spinner-md{height:2rem;width:2rem;border-width:4px}.adu-spinner-lg{height:3rem;width:3rem;border-width:4px}.adu-spinner-primary{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-secondary{--tw-border-opacity: 1;border-color:rgb(75 85 99 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));border-top-color:transparent}.adu-spinner-overlay{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1));--tw-bg-opacity: .5 }.adu-spinner-message{margin-top:1rem;font-size:1.125rem;line-height:1.75rem;font-weight:500;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}\n"] }]
+        }], propDecorators: { size: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], overlay: [{
+                type: Input
+            }], message: [{
+                type: Input
+            }] } });
+
+class ModalService {
+    constructor(appRef, injector) {
+        this.appRef = appRef;
+        this.injector = injector;
+        this.modalComponentRef = null;
+        this.closeSubject = new Subject();
+    }
+    open(component, config = {}) {
+        // Close existing modal if any
+        if (this.modalComponentRef) {
+            this.close();
+        }
+        // Create modal wrapper
+        const modalWrapper = document.createElement('div');
+        modalWrapper.className = this.getModalWrapperClasses(config);
+        // Create backdrop
+        const backdrop = document.createElement('div');
+        backdrop.className = 'adu-modal-backdrop';
+        if (config.closeOnBackdrop !== false) {
+            backdrop.onclick = () => this.close();
+        }
+        // Create modal content
+        const modalContent = document.createElement('div');
+        modalContent.className = this.getModalContentClasses(config);
+        modalContent.onclick = (e) => e.stopPropagation();
+        // Create close button if needed
+        if (config.showCloseButton !== false) {
+            const closeBtn = document.createElement('button');
+            closeBtn.className = 'adu-modal-close';
+            closeBtn.innerHTML = '×';
+            closeBtn.onclick = () => this.close();
+            modalContent.appendChild(closeBtn);
+        }
+        // Add title if provided
+        if (config.title) {
+            const titleEl = document.createElement('div');
+            titleEl.className = 'adu-modal-title';
+            titleEl.textContent = config.title;
+            modalContent.appendChild(titleEl);
+        }
+        // Create component container
+        const componentContainer = document.createElement('div');
+        componentContainer.className = 'adu-modal-body';
+        modalContent.appendChild(componentContainer);
+        // Assemble modal
+        modalWrapper.appendChild(backdrop);
+        modalWrapper.appendChild(modalContent);
+        document.body.appendChild(modalWrapper);
+        // Create and attach component
+        this.modalComponentRef = createComponent(component, {
+            environmentInjector: this.injector,
+            hostElement: componentContainer
+        });
+        this.appRef.attachView(this.modalComponentRef.hostView);
+        // Handle ESC key
+        if (config.closeOnEscape !== false) {
+            const escHandler = (e) => {
+                if (e.key === 'Escape') {
+                    this.close();
+                    document.removeEventListener('keydown', escHandler);
+                }
+            };
+            document.addEventListener('keydown', escHandler);
+        }
+        return {
+            close: (result) => this.close(result),
+            afterClosed: () => this.closeSubject
+        };
+    }
+    close(result) {
+        if (this.modalComponentRef) {
+            this.appRef.detachView(this.modalComponentRef.hostView);
+            this.modalComponentRef.destroy();
+            this.modalComponentRef = null;
+            // Remove modal from DOM
+            const modals = document.querySelectorAll('.adu-modal-wrapper');
+            modals.forEach(modal => modal.remove());
+            this.closeSubject.next(result);
+            this.closeSubject.complete();
+            this.closeSubject = new Subject();
+        }
+    }
+    getModalWrapperClasses(config) {
+        return 'adu-modal-wrapper';
+    }
+    getModalContentClasses(config) {
+        const size = config.size || 'md';
+        return `adu-modal-content adu-modal-${size}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, deps: [{ token: i0.ApplicationRef }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i0.ApplicationRef }, { type: i0.EnvironmentInjector }] });
+
+/*
+ * Public API Surface of angular-dev-utils
+ */
+// Components
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ButtonComponent, CardComponent, InputComponent, ModalComponent, ModalService, SpinnerComponent, TableComponent };
+//# sourceMappingURL=hopesf-angular-dev-utils.mjs.map