@fylib/adapter-angular 0.1.0 → 0.2.0

package/dist/components/modal.component.js

@@ -273,129 +273,129 @@ FyModalComponent = __decorate([
         selector: 'fy-modal',
         standalone: true,
         imports: [CommonModule, FyButtonComponent],
-        template: `
-    @if (visible) {
-      <div class="fy-modal-overlay" (click)="onBackdropClick()"></div>
-      <div class="fy-modal" [ngClass]="['fy-modal--' + size, 'fy-modal--status-' + status, modalAnimClass]">
-        @if (showHeader) {
-          <header class="fy-modal__header">
-            @if (title) { <h3 class="fy-modal__title">{{ title }}</h3> }
-            @if (subtitle) { <p class="fy-modal__subtitle">{{ subtitle }}</p> }
-            @if (closable) {
-              <button type="button" class="fy-modal__close" (click)="handleCancel()">&times;</button>
-            }
-          </header>
-        }
-
-        <section class="fy-modal__body">
-          <ng-content></ng-content>
-          @if (content) { <div class="fy-modal__content">{{ content }}</div> }
-        </section>
-
-        @if (showFooter) {
-          <footer class="fy-modal__footer">
-            @if (showCancelButton) {
-              <fy-button
-                variant="ghost"
-                size="md"
-                [label]="cancelText || 'Cancelar'"
-                (fyClick)="handleCancel()"
-              ></fy-button>
-            }
-            @if (showConfirmButton) {
-              <fy-button
-                size="md"
-                [label]="confirmText || 'Confirmar'"
-                (fyClick)="handleConfirm()"
-              ></fy-button>
-            }
-          </footer>
-        }
-      </div>
-    }
+        template: `
+    @if (visible) {
+      <div class="fy-modal-overlay" (click)="onBackdropClick()"></div>
+      <div class="fy-modal" [ngClass]="['fy-modal--' + size, 'fy-modal--status-' + status, modalAnimClass]">
+        @if (showHeader) {
+          <header class="fy-modal__header">
+            @if (title) { <h3 class="fy-modal__title">{{ title }}</h3> }
+            @if (subtitle) { <p class="fy-modal__subtitle">{{ subtitle }}</p> }
+            @if (closable) {
+              <button type="button" class="fy-modal__close" (click)="handleCancel()">&times;</button>
+            }
+          </header>
+        }
+
+        <section class="fy-modal__body">
+          <ng-content></ng-content>
+          @if (content) { <div class="fy-modal__content">{{ content }}</div> }
+        </section>
+
+        @if (showFooter) {
+          <footer class="fy-modal__footer">
+            @if (showCancelButton) {
+              <fy-button
+                variant="ghost"
+                size="md"
+                [label]="cancelText || 'Cancelar'"
+                (fyClick)="handleCancel()"
+              ></fy-button>
+            }
+            @if (showConfirmButton) {
+              <fy-button
+                size="md"
+                [label]="confirmText || 'Confirmar'"
+                (fyClick)="handleConfirm()"
+              ></fy-button>
+            }
+          </footer>
+        }
+      </div>
+    }
   `,
-        styles: [`
-    .fy-modal-overlay {
-      position: fixed;
-      inset: 0;
-      background: var(--fy-effects-modal-overlayColor, rgba(0,0,0,0.45));
-      z-index: 2000;
-    }
-    .fy-modal {
-      position: fixed;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      background: var(--fy-effects-modal-background, var(--fy-colors-surface, #fff));
-      border: var(--fy-effects-modal-borderWidth, 1px) solid var(--fy-effects-modal-borderColor, rgba(0,0,0,0.12));
-      border-radius: var(--fy-effects-modal-borderRadius, var(--fy-borderRadius-md));
-      box-shadow: var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
-      color: var(--fy-colors-text);
-      width: 90vw;
-      max-width: 640px;
-      max-height: 85vh;
-      display: flex;
-      flex-direction: column;
-      overflow: hidden;
-      z-index: 2001;
-    } 
-    .fy-modal--sm { max-width: 400px; }
-    .fy-modal--md { max-width: 640px; }
-    .fy-modal--lg { max-width: 840px; }
-    .fy-modal--xl { max-width: 1040px; }
-    .fy-modal--full { width: 96vw; height: 90vh; max-width: none; }
-
-    .fy-modal__header {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      gap: 12px;
-      padding: 12px 16px;
-      border-bottom: 1px solid var(--fy-effects-modal-dividerColor, rgba(0,0,0,0.08));
-    }
-    .fy-modal__title {
-      margin: 0;
-      font-size: var(--fy-typography-fontSize-lg, 18px);
-      font-weight: var(--fy-typography-fontWeight-bold, 700);
-    }
-    .fy-modal__subtitle {
-      margin: 0;
-      opacity: .8;
-      font-size: var(--fy-typography-fontSize-sm, 12px);
-    }
-    .fy-modal__close {
-      border: 0;
-      background: transparent;
-      cursor: pointer;
-      font-size: 20px;
-      line-height: 1;
-    }
-    .fy-modal__body {
-      padding: 16px;
-      flex: 1; 
-      overflow: auto;
-    }
-    .fy-modal__footer {
-      display: flex;
-      justify-content: flex-end;
-      gap: 8px;
-      padding: 12px 16px;
-      border-top: 1px solid var(--fy-effects-modal-dividerColor, rgba(0,0,0,0.08));
-    }
-
-    .fy-modal--status-success {
-      border-color: var(--fy-colors-success, #22c55e);
-      box-shadow: 0 0 0 3px rgba(34,197,94,0.15), var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
-    }
-    .fy-modal--status-error {
-      border-color: var(--fy-colors-danger, #ef4444);
-      box-shadow: 0 0 0 3px rgba(239,68,68,0.15), var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
-    }
-
-    .fy-animations-disabled, .fy-animations-disabled * {
-      transition: none !important;
-      animation: none !important;
-    }
+        styles: [`
+    .fy-modal-overlay {
+      position: fixed;
+      inset: 0;
+      background: var(--fy-effects-modal-overlayColor, rgba(0,0,0,0.45));
+      z-index: 2000;
+    }
+    .fy-modal {
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      background: var(--fy-effects-modal-background, var(--fy-colors-surface, #fff));
+      border: var(--fy-effects-modal-borderWidth, 1px) solid var(--fy-effects-modal-borderColor, rgba(0,0,0,0.12));
+      border-radius: var(--fy-effects-modal-borderRadius, var(--fy-borderRadius-md));
+      box-shadow: var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
+      color: var(--fy-colors-text);
+      width: 90vw;
+      max-width: 640px;
+      max-height: 85vh;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      z-index: 2001;
+    } 
+    .fy-modal--sm { max-width: 400px; }
+    .fy-modal--md { max-width: 640px; }
+    .fy-modal--lg { max-width: 840px; }
+    .fy-modal--xl { max-width: 1040px; }
+    .fy-modal--full { width: 96vw; height: 90vh; max-width: none; }
+
+    .fy-modal__header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      padding: 12px 16px;
+      border-bottom: 1px solid var(--fy-effects-modal-dividerColor, rgba(0,0,0,0.08));
+    }
+    .fy-modal__title {
+      margin: 0;
+      font-size: var(--fy-typography-fontSize-lg, 18px);
+      font-weight: var(--fy-typography-fontWeight-bold, 700);
+    }
+    .fy-modal__subtitle {
+      margin: 0;
+      opacity: .8;
+      font-size: var(--fy-typography-fontSize-sm, 12px);
+    }
+    .fy-modal__close {
+      border: 0;
+      background: transparent;
+      cursor: pointer;
+      font-size: 20px;
+      line-height: 1;
+    }
+    .fy-modal__body {
+      padding: 16px;
+      flex: 1; 
+      overflow: auto;
+    }
+    .fy-modal__footer {
+      display: flex;
+      justify-content: flex-end;
+      gap: 8px;
+      padding: 12px 16px;
+      border-top: 1px solid var(--fy-effects-modal-dividerColor, rgba(0,0,0,0.08));
+    }
+
+    .fy-modal--status-success {
+      border-color: var(--fy-colors-success, #22c55e);
+      box-shadow: 0 0 0 3px rgba(34,197,94,0.15), var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
+    }
+    .fy-modal--status-error {
+      border-color: var(--fy-colors-danger, #ef4444);
+      box-shadow: 0 0 0 3px rgba(239,68,68,0.15), var(--fy-effects-modal-shadow, 0 20px 60px rgba(0,0,0,0.2));
+    }
+
+    .fy-animations-disabled, .fy-animations-disabled * {
+      transition: none !important;
+      animation: none !important;
+    }
   `],
         encapsulation: ViewEncapsulation.None
     }),

package/dist/components/nav-link.component.js

@@ -57,63 +57,63 @@ FyNavLinkComponent = __decorate([
         selector: 'fy-nav-link',
         standalone: true,
         imports: [CommonModule, FyIconComponent],
-        template: `
-    <a
-      [attr.href]="href || to || null"
-      [attr.target]="target || null"
-      rel="noopener noreferrer"
-      class="fy-nav-link"
-      [class.active]="active"
-      [class.fy-nav-link--hover-disabled]="!hoverEnabled"
-      
-    >
-      @if (iconName) {
-        <fy-icon [name]="iconName" [set]="iconSet" class="fy-nav-link__icon"></fy-icon>
-      }
-      <ng-content></ng-content>
-      @if (!hasProjectedContent) {
-        <span>{{ label }}</span>
-      }
-    </a>
+        template: `
+    <a
+      [attr.href]="href || to || null"
+      [attr.target]="target || null"
+      rel="noopener noreferrer"
+      class="fy-nav-link"
+      [class.active]="active"
+      [class.fy-nav-link--hover-disabled]="!hoverEnabled"
+      
+    >
+      @if (iconName) {
+        <fy-icon [name]="iconName" [set]="iconSet" class="fy-nav-link__icon"></fy-icon>
+      }
+      <ng-content></ng-content>
+      @if (!hasProjectedContent) {
+        <span>{{ label }}</span>
+      }
+    </a>
   `,
-        styles: [`
-    .fy-nav-link {
-      display: inline-flex;
-      align-items: center;
-      gap: var(--fy-spacing-sm, 8px);
-      padding: var(--fy-spacing-sm) var(--fy-spacing-md);
-      border-radius: var(--fy-borderRadius-sm);
-      color: var(--fy-colors-text);
-      text-decoration: none;
-      transition: background-color 0.15s ease, color 0.15s ease;
-    }
-    .fy-nav-link__icon {
-      flex: 0 0 auto;
-      opacity: .95;
-    }
-    .fy-nav-link:hover:not(.fy-nav-link--hover-disabled) {
-      background-color: rgba(var(--fy-colors-primary-rgb, 59,130,246), 0.08);
-      color: var(--fy-colors-primary);
-    }
-    .fy-nav-link.active {
-      background-color: rgba(var(--fy-colors-primary-rgb, 59,130,246), 0.12);
-      color: var(--fy-colors-primary);
-      font-weight: var(--fy-typography-fontWeight-bold);
-    }
-
-    /* Dentro do header, os links devem se comportar como itens de navegação horizontal */
-    .fy-slot--header .fy-nav-link {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    @media (max-width: 768px) {
-      .fy-slot--header .fy-nav-link {
-        display: inline-flex;
-        justify-content: flex-start;
-      }
-    }
+        styles: [`
+    .fy-nav-link {
+      display: inline-flex;
+      align-items: center;
+      gap: var(--fy-spacing-sm, 8px);
+      padding: var(--fy-spacing-sm) var(--fy-spacing-md);
+      border-radius: var(--fy-borderRadius-sm);
+      color: var(--fy-colors-text);
+      text-decoration: none;
+      transition: background-color 0.15s ease, color 0.15s ease;
+    }
+    .fy-nav-link__icon {
+      flex: 0 0 auto;
+      opacity: .95;
+    }
+    .fy-nav-link:hover:not(.fy-nav-link--hover-disabled) {
+      background-color: rgba(var(--fy-colors-primary-rgb, 59,130,246), 0.08);
+      color: var(--fy-colors-primary);
+    }
+    .fy-nav-link.active {
+      background-color: rgba(var(--fy-colors-primary-rgb, 59,130,246), 0.12);
+      color: var(--fy-colors-primary);
+      font-weight: var(--fy-typography-fontWeight-bold);
+    }
+
+    /* Dentro do header, os links devem se comportar como itens de navegação horizontal */
+    .fy-slot--header .fy-nav-link {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    @media (max-width: 768px) {
+      .fy-slot--header .fy-nav-link {
+        display: inline-flex;
+        justify-content: flex-start;
+      }
+    }
   `],
         encapsulation: ViewEncapsulation.None
     })