@fylib/adapter-angular 0.2.5 → 0.2.8

package/dist/components/input.component.js

@@ -1,12 +1,3 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
 import { Component, Input, Output, EventEmitter, ViewEncapsulation, HostBinding, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { InputDefinition } from '@fylib/catalog';
@@ -14,7 +5,8 @@ import { FyIconComponent } from './icon.component';
 import { resolveAnimationsActive } from '../base/interaction.utils';
 import { BaseFyComponent } from '../base/base-component';
 import { logger } from '@fylib/logger';
-let FyInputComponent = class FyInputComponent extends BaseFyComponent {
+import * as i0 from "@angular/core";
+export class FyInputComponent extends BaseFyComponent {
     get animationsDisabled() {
         return !this.isAnimationsActive(this.activeAnimations);
     }
@@ -127,143 +119,9 @@ let FyInputComponent = class FyInputComponent extends BaseFyComponent {
         }
         return out;
     }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "value", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "placeholder", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "type", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], FyInputComponent.prototype, "disabled", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], FyInputComponent.prototype, "readonly", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "mask", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], FyInputComponent.prototype, "showPasswordToggle", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "iconLeft", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "iconRight", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "iconLeftName", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "iconRightName", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "size", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "status", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "activeAnimations", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "activeEffects", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "customStyles", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "focusAnimation", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "successAnimation", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "errorAnimation", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "focusEffect", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "successEffect", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], FyInputComponent.prototype, "errorEffect", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], FyInputComponent.prototype, "onInput", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], FyInputComponent.prototype, "onChange", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], FyInputComponent.prototype, "onFocus", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], FyInputComponent.prototype, "onBlur", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "fyInput", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "fyChange", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "fyFocus", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], FyInputComponent.prototype, "fyBlur", void 0);
-__decorate([
-    HostBinding('class.fy-animations-disabled'),
-    __metadata("design:type", Boolean),
-    __metadata("design:paramtypes", [])
-], FyInputComponent.prototype, "animationsDisabled", null);
-__decorate([
-    HostBinding('style'),
-    __metadata("design:type", String),
-    __metadata("design:paramtypes", [])
-], FyInputComponent.prototype, "hostStyles", null);
-FyInputComponent = __decorate([
-    Component({
-        selector: 'fy-input',
-        standalone: true,
-        imports: [CommonModule, FyIconComponent],
-        template: `
+}
+FyInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FyInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+FyInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.7", type: FyInputComponent, isStandalone: true, selector: "fy-input", inputs: { value: "value", placeholder: "placeholder", type: "type", disabled: "disabled", readonly: "readonly", mask: "mask", showPasswordToggle: "showPasswordToggle", iconLeft: "iconLeft", iconRight: "iconRight", iconLeftName: "iconLeftName", iconRightName: "iconRightName", size: "size", status: "status", activeAnimations: "activeAnimations", activeEffects: "activeEffects", customStyles: "customStyles", focusAnimation: "focusAnimation", successAnimation: "successAnimation", errorAnimation: "errorAnimation", focusEffect: "focusEffect", successEffect: "successEffect", errorEffect: "errorEffect", onInput: "onInput", onChange: "onChange", onFocus: "onFocus", onBlur: "onBlur" }, outputs: { fyInput: "fyInput", fyChange: "fyChange", fyFocus: "fyFocus", fyBlur: "fyBlur" }, host: { properties: { "class.fy-animations-disabled": "this.animationsDisabled", "style": "this.hostStyles" } }, usesInheritance: true, ngImport: i0, template: `
     <div
       class="fy-input"
       [class.fy-input--with-left]="iconLeft || iconLeftName"
@@ -307,77 +165,118 @@ FyInputComponent = __decorate([
         <span class="fy-input__icon fy-input__icon--right" [class]="iconRight"></span>
       }
     </div>
-  `,
-        styles: [`
-    .fy-input {
-      position: relative;
-      display: inline-flex;
-      align-items: center;
-      width: 100%;
-      max-width: 100%;
-      border: var(--fy-effects-input-borderWidth, 1px) solid var(--fy-effects-input-borderColor, rgba(0,0,0,0.15));
-      background: var(--fy-effects-input-background, #fff);
-      border-radius: var(--fy-effects-input-borderRadius, var(--fy-borderRadius-md));
-      box-shadow: var(--fy-effects-input-shadow, none);
-      transition: box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
-      color: var(--fy-colors-textOverlay, var(--fy-colors-text));
-      min-height: 36px;
-      padding: 0 10px;
-      gap: 6px;
-    }
-
-    .fy-animations-disabled, .fy-animations-disabled * {
-      transition: none !important;
-      animation: none !important;
-    }
-
-    .fy-input--sm { min-height: 30px; border-radius: var(--fy-borderRadius-sm); }
-    .fy-input--lg { min-height: 42px; border-radius: var(--fy-borderRadius-lg); }
-
-    .fy-input--status-success {
-      border-color: var(--fy-colors-success, #22c55e);
-      background: rgba(34, 197, 94, 0.04);
-    }
-
-    .fy-input--status-error {
-      border-color: var(--fy-colors-danger, #ef4444);
-      background: rgba(239, 68, 68, 0.04);
-    }
-
-    .fy-input__field {
-      flex: 1 1 auto;
-      border: 0;
-      outline: 0;
-      background: transparent;
-      font: inherit;
-      color: inherit;
-      min-width: 0;
-      height: 100%;
-    }
-    .fy-input__field::placeholder {
-      color: var(--fy-effects-input-placeholderColor, #6b7280);
-      opacity: .8;
-    }
-
-    .fy-input__icon {
-      width: 16px;
-      height: 16px;
-      opacity: .9;
-      flex: 0 0 auto;
-      color: var(--fy-effects-input-icons-color, currentColor);
-    }
-
-    .fy-input__toggle {
-      width: 20px;
-      height: 20px;
-      border: 0;
-      background: transparent;
-      cursor: pointer;
-      flex: 0 0 auto;
-    }
-  `],
-        encapsulation: ViewEncapsulation.None
-    }),
-    __metadata("design:paramtypes", [])
-], FyInputComponent);
-export { FyInputComponent };
+  `, isInline: true, styles: ["\n    .fy-input {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      width: 100%;\n      max-width: 100%;\n      border: var(--fy-effects-input-borderWidth, 1px) solid var(--fy-effects-input-borderColor, rgba(0,0,0,0.15));\n      background: var(--fy-effects-input-background, #fff);\n      border-radius: var(--fy-effects-input-borderRadius, var(--fy-borderRadius-md));\n      box-shadow: var(--fy-effects-input-shadow, none);\n      transition: box-shadow .2s ease, border-color .2s ease, background-color .2s ease;\n      color: var(--fy-colors-textOverlay, var(--fy-colors-text));\n      min-height: 36px;\n      padding: 0 10px;\n      gap: 6px;\n    }\n\n    .fy-animations-disabled, .fy-animations-disabled * {\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .fy-input--sm { min-height: 30px; border-radius: var(--fy-borderRadius-sm); }\n    .fy-input--lg { min-height: 42px; border-radius: var(--fy-borderRadius-lg); }\n\n    .fy-input--status-success {\n      border-color: var(--fy-colors-success, #22c55e);\n      background: rgba(34, 197, 94, 0.04);\n    }\n\n    .fy-input--status-error {\n      border-color: var(--fy-colors-danger, #ef4444);\n      background: rgba(239, 68, 68, 0.04);\n    }\n\n    .fy-input__field {\n      flex: 1 1 auto;\n      border: 0;\n      outline: 0;\n      background: transparent;\n      font: inherit;\n      color: inherit;\n      min-width: 0;\n      height: 100%;\n    }\n    .fy-input__field::placeholder {\n      color: var(--fy-effects-input-placeholderColor, #6b7280);\n      opacity: .8;\n    }\n\n    .fy-input__icon {\n      width: 16px;\n      height: 16px;\n      opacity: .9;\n      flex: 0 0 auto;\n      color: var(--fy-effects-input-icons-color, currentColor);\n    }\n\n    .fy-input__toggle {\n      width: 20px;\n      height: 20px;\n      border: 0;\n      background: transparent;\n      cursor: pointer;\n      flex: 0 0 auto;\n    }\n  "], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FyIconComponent, selector: "fy-icon", inputs: ["name", "size", "color", "strokeWidth", "variant", "set"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FyInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fy-input', standalone: true, imports: [CommonModule, FyIconComponent], template: `
+    <div
+      class="fy-input"
+      [class.fy-input--with-left]="iconLeft || iconLeftName"
+      [class.fy-input--with-right]="iconRight || iconRightName"
+      [class.fy-input--sm]="size === 'sm'"
+      [class.fy-input--lg]="size === 'lg'"
+      [class.fy-input--status-success]="status === 'success'"
+      [class.fy-input--status-error]="status === 'error'"
+      [class]="animationClassSuffix"
+    >
+      @if (iconLeftName) {
+        <fy-icon class="fy-input__icon fy-input__icon--left" [name]="iconLeftName"></fy-icon>
+      } @else if (iconLeft) {
+        <span class="fy-input__icon fy-input__icon--left" [class]="iconLeft"></span>
+      }
+      <input
+        class="fy-input__field"
+        [attr.type]="visibleType"
+        [attr.placeholder]="placeholder || null"
+        [disabled]="disabled"
+        [readOnly]="readonly"
+        [value]="value ?? ''"
+        [attr.aria-invalid]="status === 'error'"
+        [attr.aria-label]="placeholder"
+        (input)="onInputHandler($event)"
+        (change)="onChangeHandler($event)"
+        (focus)="onFocusHandler()"
+        (blur)="onBlurHandler()"
+      />
+      @if (type === 'password' && showPasswordToggle) {
+        <button 
+          type="button" 
+          class="fy-input__toggle" 
+          (click)="togglePassword()"
+          [attr.aria-label]="visibleType === 'password' ? 'Mostrar senha' : 'Ocultar senha'"
+        ></button>
+      }
+      @if (iconRightName) {
+        <fy-icon class="fy-input__icon fy-input__icon--right" [name]="iconRightName"></fy-icon>
+      } @else if (iconRight) {
+        <span class="fy-input__icon fy-input__icon--right" [class]="iconRight"></span>
+      }
+    </div>
+  `, encapsulation: ViewEncapsulation.None, styles: ["\n    .fy-input {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      width: 100%;\n      max-width: 100%;\n      border: var(--fy-effects-input-borderWidth, 1px) solid var(--fy-effects-input-borderColor, rgba(0,0,0,0.15));\n      background: var(--fy-effects-input-background, #fff);\n      border-radius: var(--fy-effects-input-borderRadius, var(--fy-borderRadius-md));\n      box-shadow: var(--fy-effects-input-shadow, none);\n      transition: box-shadow .2s ease, border-color .2s ease, background-color .2s ease;\n      color: var(--fy-colors-textOverlay, var(--fy-colors-text));\n      min-height: 36px;\n      padding: 0 10px;\n      gap: 6px;\n    }\n\n    .fy-animations-disabled, .fy-animations-disabled * {\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .fy-input--sm { min-height: 30px; border-radius: var(--fy-borderRadius-sm); }\n    .fy-input--lg { min-height: 42px; border-radius: var(--fy-borderRadius-lg); }\n\n    .fy-input--status-success {\n      border-color: var(--fy-colors-success, #22c55e);\n      background: rgba(34, 197, 94, 0.04);\n    }\n\n    .fy-input--status-error {\n      border-color: var(--fy-colors-danger, #ef4444);\n      background: rgba(239, 68, 68, 0.04);\n    }\n\n    .fy-input__field {\n      flex: 1 1 auto;\n      border: 0;\n      outline: 0;\n      background: transparent;\n      font: inherit;\n      color: inherit;\n      min-width: 0;\n      height: 100%;\n    }\n    .fy-input__field::placeholder {\n      color: var(--fy-effects-input-placeholderColor, #6b7280);\n      opacity: .8;\n    }\n\n    .fy-input__icon {\n      width: 16px;\n      height: 16px;\n      opacity: .9;\n      flex: 0 0 auto;\n      color: var(--fy-effects-input-icons-color, currentColor);\n    }\n\n    .fy-input__toggle {\n      width: 20px;\n      height: 20px;\n      border: 0;\n      background: transparent;\n      cursor: pointer;\n      flex: 0 0 auto;\n    }\n  "] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], mask: [{
+                type: Input
+            }], showPasswordToggle: [{
+                type: Input
+            }], iconLeft: [{
+                type: Input
+            }], iconRight: [{
+                type: Input
+            }], iconLeftName: [{
+                type: Input
+            }], iconRightName: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], status: [{
+                type: Input
+            }], activeAnimations: [{
+                type: Input
+            }], activeEffects: [{
+                type: Input
+            }], customStyles: [{
+                type: Input
+            }], focusAnimation: [{
+                type: Input
+            }], successAnimation: [{
+                type: Input
+            }], errorAnimation: [{
+                type: Input
+            }], focusEffect: [{
+                type: Input
+            }], successEffect: [{
+                type: Input
+            }], errorEffect: [{
+                type: Input
+            }], onInput: [{
+                type: Input
+            }], onChange: [{
+                type: Input
+            }], onFocus: [{
+                type: Input
+            }], onBlur: [{
+                type: Input
+            }], fyInput: [{
+                type: Output
+            }], fyChange: [{
+                type: Output
+            }], fyFocus: [{
+                type: Output
+            }], fyBlur: [{
+                type: Output
+            }], animationsDisabled: [{
+                type: HostBinding,
+                args: ['class.fy-animations-disabled']
+            }], hostStyles: [{
+                type: HostBinding,
+                args: ['style']
+            }] } });

package/dist/components/modal.component.d.ts

@@ -1,6 +1,7 @@
 import { EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
 import { ModalProps } from '@fylib/catalog';
 import { BaseFyComponent, FyComponentBaseInputs } from '../base/base-component';
+import * as i0 from "@angular/core";
 export declare class FyModalComponent extends BaseFyComponent<'fy-modal'> implements ModalProps, FyComponentBaseInputs, OnChanges {
     visible: boolean;
     title?: string;
@@ -43,4 +44,6 @@ export declare class FyModalComponent extends BaseFyComponent<'fy-modal'> implem
     handleCancel(): void;
     onBackdropClick(): void;
     onKeydown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FyModalComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FyModalComponent, "fy-modal", never, { "visible": { "alias": "visible"; "required": false; }; "title": { "alias": "title"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "content": { "alias": "content"; "required": false; }; "size": { "alias": "size"; "required": false; }; "position": { "alias": "position"; "required": false; }; "status": { "alias": "status"; "required": false; }; "closable": { "alias": "closable"; "required": false; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; }; "closeOnBackdrop": { "alias": "closeOnBackdrop"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "showFooter": { "alias": "showFooter"; "required": false; }; "showConfirmButton": { "alias": "showConfirmButton"; "required": false; }; "showCancelButton": { "alias": "showCancelButton"; "required": false; }; "confirmText": { "alias": "confirmText"; "required": false; }; "cancelText": { "alias": "cancelText"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "centered": { "alias": "centered"; "required": false; }; "blockScroll": { "alias": "blockScroll"; "required": false; }; "draggable": { "alias": "draggable"; "required": false; }; "resizable": { "alias": "resizable"; "required": false; }; "activeAnimations": { "alias": "activeAnimations"; "required": false; }; "activeEffects": { "alias": "activeEffects"; "required": false; }; "customStyles": { "alias": "customStyles"; "required": false; }; "onOpen": { "alias": "onOpen"; "required": false; }; "onClose": { "alias": "onClose"; "required": false; }; "onConfirm": { "alias": "onConfirm"; "required": false; }; "onCancel": { "alias": "onCancel"; "required": false; }; }, { "fyOpen": "fyOpen"; "fyClose": "fyClose"; "fyConfirm": "fyConfirm"; "fyCancel": "fyCancel"; }, never, ["*"], true, never>;
 }