@fylib/adapter-angular 0.1.0 → 0.2.0

package/dist/components/text.component.js

@@ -48,8 +48,8 @@ FyTextComponent = __decorate([
     Component({
         selector: 'fy-text',
         standalone: true,
-        template: `
-    <span>{{ value() }}</span>
+        template: `
+    <span>{{ value() }}</span>
   `,
         encapsulation: ViewEncapsulation.None
     }),

package/dist/components/toast.component.js

@@ -136,122 +136,122 @@ FyToastComponent = __decorate([
         selector: 'fy-toast',
         standalone: true,
         imports: [CommonModule, FyIconComponent],
-        template: `
-    <div
-      class="fy-toast"
-      [class]="'fy-toast--' + type"
-      [class]="composeAnimClasses(animationClassSuffix)"
-      [style]="getHostStyles(customStyles)"
-    >
-      @if (showIcon) {
-        <div class="fy-toast__icon">
-          <fy-icon [name]="resolvedIcon" [color]="resolvedIconColor"></fy-icon>
-        </div>
-      }
-      
-      <div class="fy-toast__content">
-        @if (title) { <div class="fy-toast__title">{{ title }}</div> }
-        <div class="fy-toast__message">{{ message }}</div>
-      </div>
-
-      @if (closable) {
-        <button class="fy-toast__close" (click)="close()">
-          <fy-icon [name]="resolvedCloseIcon"></fy-icon>
-        </button>
-      }
-    </div>
+        template: `
+    <div
+      class="fy-toast"
+      [class]="'fy-toast--' + type"
+      [class]="composeAnimClasses(animationClassSuffix)"
+      [style]="getHostStyles(customStyles)"
+    >
+      @if (showIcon) {
+        <div class="fy-toast__icon">
+          <fy-icon [name]="resolvedIcon" [color]="resolvedIconColor"></fy-icon>
+        </div>
+      }
+      
+      <div class="fy-toast__content">
+        @if (title) { <div class="fy-toast__title">{{ title }}</div> }
+        <div class="fy-toast__message">{{ message }}</div>
+      </div>
+
+      @if (closable) {
+        <button class="fy-toast__close" (click)="close()">
+          <fy-icon [name]="resolvedCloseIcon"></fy-icon>
+        </button>
+      }
+    </div>
   `,
-        styles: [`
-    .fy-toast {
-      display: flex;
-      align-items: flex-start;
-      gap: var(--fy-effects-toast-gap, var(--fy-spacing-sm, 8px));
-      padding: var(--fy-effects-toast-padding, var(--fy-spacing-md, 12px));
-      min-width: var(--fy-effects-toast-minWidth, 280px);
-      max-width: var(--fy-effects-toast-maxWidth, 420px);
-      background: var(--fy-effects-toast-background, #ffffff);
-      border: 1px solid var(--fy-effects-toast-borderColor, rgba(0,0,0,0.1));
-      border-radius: var(--fy-effects-toast-borderRadius, 8px);
-      box-shadow: var(--fy-effects-toast-shadow, 0 4px 12px rgba(0,0,0,0.1));
-      color: var(--fy-effects-toast-textColor, inherit);
-      pointer-events: auto;
-      margin-bottom: 8px;
-      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-      position: relative;
-    }
-
-    /* Animações base */
-    .fy-anim-toast-in {
-      animation: toast-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
-    }
-
-    .fy-anim-toast-out {
-      animation: toast-out 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
-    }
-
-    @keyframes toast-in {
-      from { transform: translateX(100%); opacity: 0; }
-      to { transform: translateX(0); opacity: 1; }
-    }
-
-    @keyframes toast-out {
-      from { transform: scale(1); opacity: 1; }
-      to { transform: scale(0.8); opacity: 0; }
-    }
-
-    .fy-toast__icon {
-      flex-shrink: 0;
-      font-size: var(--fy-effects-toast-iconSize, 20px);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    .fy-toast--info .fy-toast__icon { color: var(--fy-effects-toast-iconColor-info, var(--fy-colors-info, #007aff)); }
-    .fy-toast--success .fy-toast__icon { color: var(--fy-effects-toast-iconColor-success, var(--fy-colors-success, #28cd41)); }
-    .fy-toast--warning .fy-toast__icon { color: var(--fy-effects-toast-iconColor-warning, var(--fy-colors-warning, #ffcc00)); }
-    .fy-toast--error .fy-toast__icon { color: var(--fy-effects-toast-iconColor-error, var(--fy-colors-danger, #ff3b30)); }
-
-    .fy-toast__content {
-      flex: 1;
-      overflow: hidden;
-    }
-
-    .fy-toast__title {
-      font-weight: var(--fy-effects-toast-titleFontWeight, var(--fy-typography-fontWeight-bold, 600));
-      font-size: var(--fy-effects-toast-titleFontSize, var(--fy-typography-fontSize-md, 14px));
-      margin-bottom: 2px;
-    }
-
-    .fy-toast__message {
-      font-size: var(--fy-effects-toast-messageFontSize, var(--fy-typography-fontSize-sm, 13px));
-      line-height: var(--fy-effects-toast-messageLineHeight, 1.4);
-      opacity: 0.9;
-    }
-
-    .fy-toast__close {
-      position: absolute;
-      top: 4px;
-      right: 4px;
-      flex-shrink: 0;
-      background: var(--fy-effects-toast-closeButtonBackground, transparent);
-      border: var(--fy-effects-toast-closeButtonBorder, none);
-      border-radius: var(--fy-effects-toast-closeButtonBorderRadius, 0);
-      padding: 2px;
-      cursor: pointer;
-      opacity: var(--fy-effects-toast-closeButtonOpacity, 0.5);
-      transition: opacity 0.2s;
-      color: currentColor;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: var(--fy-effects-toast-closeButtonSize, 18px);
-      height: var(--fy-effects-toast-closeButtonSize, 18px);
-    }
-
-    .fy-toast__close:hover {
-      opacity: var(--fy-effects-toast-closeButtonHoverOpacity, 1);
-    }
+        styles: [`
+    .fy-toast {
+      display: flex;
+      align-items: flex-start;
+      gap: var(--fy-effects-toast-gap, var(--fy-spacing-sm, 8px));
+      padding: var(--fy-effects-toast-padding, var(--fy-spacing-md, 12px));
+      min-width: var(--fy-effects-toast-minWidth, 280px);
+      max-width: var(--fy-effects-toast-maxWidth, 420px);
+      background: var(--fy-effects-toast-background, #ffffff);
+      border: 1px solid var(--fy-effects-toast-borderColor, rgba(0,0,0,0.1));
+      border-radius: var(--fy-effects-toast-borderRadius, 8px);
+      box-shadow: var(--fy-effects-toast-shadow, 0 4px 12px rgba(0,0,0,0.1));
+      color: var(--fy-effects-toast-textColor, inherit);
+      pointer-events: auto;
+      margin-bottom: 8px;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+      position: relative;
+    }
+
+    /* Animações base */
+    .fy-anim-toast-in {
+      animation: toast-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
+    }
+
+    .fy-anim-toast-out {
+      animation: toast-out 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
+    }
+
+    @keyframes toast-in {
+      from { transform: translateX(100%); opacity: 0; }
+      to { transform: translateX(0); opacity: 1; }
+    }
+
+    @keyframes toast-out {
+      from { transform: scale(1); opacity: 1; }
+      to { transform: scale(0.8); opacity: 0; }
+    }
+
+    .fy-toast__icon {
+      flex-shrink: 0;
+      font-size: var(--fy-effects-toast-iconSize, 20px);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .fy-toast--info .fy-toast__icon { color: var(--fy-effects-toast-iconColor-info, var(--fy-colors-info, #007aff)); }
+    .fy-toast--success .fy-toast__icon { color: var(--fy-effects-toast-iconColor-success, var(--fy-colors-success, #28cd41)); }
+    .fy-toast--warning .fy-toast__icon { color: var(--fy-effects-toast-iconColor-warning, var(--fy-colors-warning, #ffcc00)); }
+    .fy-toast--error .fy-toast__icon { color: var(--fy-effects-toast-iconColor-error, var(--fy-colors-danger, #ff3b30)); }
+
+    .fy-toast__content {
+      flex: 1;
+      overflow: hidden;
+    }
+
+    .fy-toast__title {
+      font-weight: var(--fy-effects-toast-titleFontWeight, var(--fy-typography-fontWeight-bold, 600));
+      font-size: var(--fy-effects-toast-titleFontSize, var(--fy-typography-fontSize-md, 14px));
+      margin-bottom: 2px;
+    }
+
+    .fy-toast__message {
+      font-size: var(--fy-effects-toast-messageFontSize, var(--fy-typography-fontSize-sm, 13px));
+      line-height: var(--fy-effects-toast-messageLineHeight, 1.4);
+      opacity: 0.9;
+    }
+
+    .fy-toast__close {
+      position: absolute;
+      top: 4px;
+      right: 4px;
+      flex-shrink: 0;
+      background: var(--fy-effects-toast-closeButtonBackground, transparent);
+      border: var(--fy-effects-toast-closeButtonBorder, none);
+      border-radius: var(--fy-effects-toast-closeButtonBorderRadius, 0);
+      padding: 2px;
+      cursor: pointer;
+      opacity: var(--fy-effects-toast-closeButtonOpacity, 0.5);
+      transition: opacity 0.2s;
+      color: currentColor;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: var(--fy-effects-toast-closeButtonSize, 18px);
+      height: var(--fy-effects-toast-closeButtonSize, 18px);
+    }
+
+    .fy-toast__close:hover {
+      opacity: var(--fy-effects-toast-closeButtonHoverOpacity, 1);
+    }
   `],
         encapsulation: ViewEncapsulation.None
     }),

package/dist/directives/theme-vars.directive.js

@@ -25,16 +25,16 @@ let FyThemeVarsDirective = class FyThemeVarsDirective {
         if (!doc.getElementById('fy-reset-style')) {
             const style = doc.createElement('style');
             style.id = 'fy-reset-style';
-            style.textContent = `
-        *,*::before,*::after{box-sizing:border-box}
-        html,body{height:100%}
-        body{margin:0;padding:0;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
-        h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}
-        ul,ol{margin:0;padding:0;list-style:none}
-        img,picture,video,canvas,svg{display:block;max-width:100%}
-        input,button,textarea,select{font:inherit;color:inherit}
-        a{text-decoration:none;color:inherit}
-        table{border-collapse:collapse;border-spacing:0}
+            style.textContent = `
+        *,*::before,*::after{box-sizing:border-box}
+        html,body{height:100%}
+        body{margin:0;padding:0;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
+        h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}
+        ul,ol{margin:0;padding:0;list-style:none}
+        img,picture,video,canvas,svg{display:block;max-width:100%}
+        input,button,textarea,select{font:inherit;color:inherit}
+        a{text-decoration:none;color:inherit}
+        table{border-collapse:collapse;border-spacing:0}
       `;
             doc.head.appendChild(style);
         }

package/dist/directives/wallpaper.directive.js

@@ -158,11 +158,11 @@ let FyWallpaperDirective = class FyWallpaperDirective {
             return;
         const style = this.document.createElement('style');
         style.id = 'fy-wallpaper-styles';
-        style.innerHTML = `
-      @keyframes fy-wallpaper-diagonal {
-        from { background-position: 0 0; }
-        to { background-position: 200px 200px; }
-      }
+        style.innerHTML = `
+      @keyframes fy-wallpaper-diagonal {
+        from { background-position: 0 0; }
+        to { background-position: 200px 200px; }
+      }
     `;
         this.document.head.appendChild(style);
     }

package/dist/layouts/layout.component.js

@@ -177,76 +177,76 @@ FyLayoutComponent = __decorate([
         selector: 'fy-layout',
         standalone: true,
         imports: [CommonModule],
-        template: `
-    <div [class]="'fy-layout fy-layout--' + name" [ngStyle]="customStyles || null">
-      <ng-content></ng-content>
-    </div>
+        template: `
+    <div [class]="'fy-layout fy-layout--' + name" [ngStyle]="customStyles || null">
+      <ng-content></ng-content>
+    </div>
   `,
-        styles: [`
-    .fy-layout {
-      display: flex;
-      flex-direction: column;
-      min-height: 100vh;
-      width: 100%;
-      overflow-x: hidden;
-      background-color: var(--fy-colors-background);
-      color: var(--fy-colors-text);
-      font-family: var(--fy-typography-fontFamily-base, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
-      transition: background-color 0.3s ease, color 0.3s ease;
-    }
-
-    /* App Layout specific styles */
-    .fy-layout--app-layout {
-      display: grid;
-      grid-template-areas:
-        "header"
-        "content"
-        "footer";
-      grid-template-columns: 1fr;
-      grid-template-rows: auto 1fr auto;
-      gap: var(--fy-layout-gap, 0);
-    }
-
-    /* When sidebar slot is present, switch to two columns */
-    .fy-layout--app-layout:has(.fy-slot--sidebar) {
-      grid-template-areas:
-        "header header"
-        "sidebar content"
-        "footer footer";
-      grid-template-columns: var(--fy-layout-sidebar-width, 260px) 1fr;
-    }
-
-    /* Fixed Sidebar mode: Lock height to viewport and disable global scroll */
-    .fy-layout--app-layout:has(.fy-slot--sidebar-fixed) {
-      height: 100vh;
-      min-height: 100vh;
-      max-height: 100vh;
-      overflow: hidden;
-    }
-
-    /* Ensure content area takes full height and scrolls internally in fixed mode */
-    .fy-layout--app-layout:has(.fy-slot--sidebar-fixed) .fy-slot--content {
-      height: 100%;
-      overflow-y: auto;
-    }
-
-    @media (max-width: 768px) {
-      .fy-layout--app-layout {
-        grid-template-areas: 
-          "header"
-          "content"
-          "footer";
-        grid-template-columns: 1fr;
-      }
-
-      .fy-layout--app-layout:has(.fy-slot--sidebar) {
-        grid-template-areas: 
-          "header"
-          "content"
-          "footer";
-        grid-template-columns: 1fr;
-      }
-    }
+        styles: [`
+    .fy-layout {
+      display: flex;
+      flex-direction: column;
+      min-height: 100vh;
+      width: 100%;
+      overflow-x: hidden;
+      background-color: var(--fy-colors-background);
+      color: var(--fy-colors-text);
+      font-family: var(--fy-typography-fontFamily-base, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
+      transition: background-color 0.3s ease, color 0.3s ease;
+    }
+
+    /* App Layout specific styles */
+    .fy-layout--app-layout {
+      display: grid;
+      grid-template-areas:
+        "header"
+        "content"
+        "footer";
+      grid-template-columns: 1fr;
+      grid-template-rows: auto 1fr auto;
+      gap: var(--fy-layout-gap, 0);
+    }
+
+    /* When sidebar slot is present, switch to two columns */
+    .fy-layout--app-layout:has(.fy-slot--sidebar) {
+      grid-template-areas:
+        "header header"
+        "sidebar content"
+        "footer footer";
+      grid-template-columns: var(--fy-layout-sidebar-width, 260px) 1fr;
+    }
+
+    /* Fixed Sidebar mode: Lock height to viewport and disable global scroll */
+    .fy-layout--app-layout:has(.fy-slot--sidebar-fixed) {
+      height: 100vh;
+      min-height: 100vh;
+      max-height: 100vh;
+      overflow: hidden;
+    }
+
+    /* Ensure content area takes full height and scrolls internally in fixed mode */
+    .fy-layout--app-layout:has(.fy-slot--sidebar-fixed) .fy-slot--content {
+      height: 100%;
+      overflow-y: auto;
+    }
+
+    @media (max-width: 768px) {
+      .fy-layout--app-layout {
+        grid-template-areas: 
+          "header"
+          "content"
+          "footer";
+        grid-template-columns: 1fr;
+      }
+
+      .fy-layout--app-layout:has(.fy-slot--sidebar) {
+        grid-template-areas: 
+          "header"
+          "content"
+          "footer";
+        grid-template-columns: 1fr;
+      }
+    }
   `],
         encapsulation: ViewEncapsulation.None
     }),