@sula-tech/webcomponents 0.17.4 → 0.17.5

package/dist/cjs/sula-avatar_29.cjs.entry.js

@@ -27786,17 +27786,29 @@ const SulaLoader = class {
          * Tamanho predefinido (small, medium, large)
          */
         this.size = SulaLoaderSize.Medium;
+        this.animationInstance = null;
+    }
+    connectedCallback() {
+        this.tryInitLottie();
     }
     componentDidLoad() {
-        this.initLottie();
+        this.tryInitLottie();
+    }
+    componentDidRender() {
+        this.tryInitLottie();
     }
     disconnectedCallback() {
-        if (this.animationInstance) {
-            this.animationInstance.destroy();
+        this.destroyAnimation();
+    }
+    destroyAnimation() {
+        if (!this.animationInstance) {
+            return;
         }
+        this.animationInstance.destroy();
+        this.animationInstance = null;
     }
-    initLottie() {
-        if (!this.containerRef)
+    tryInitLottie() {
+        if (!this.containerRef || this.animationInstance)
             return;
         try {
             const animationData = loaderAnimation;
@@ -27813,6 +27825,9 @@ const SulaLoader = class {
             console.error('Erro ao carregar animação Lottie:', error);
         }
     }
+    initLottie() {
+        this.tryInitLottie();
+    }
     getDimensions() {
         const sizes = {
             small: '24px',
@@ -27823,7 +27838,7 @@ const SulaLoader = class {
     }
     render() {
         const { width, height } = this.getDimensions();
-        return (index.h(index.Host, { key: 'abd6665256f4e7173603ccc791b20f884bf9e9b6' }, index.h("div", { key: '41f9fb073388d7fc2a1585231fb8c257e5996847', ref: el => (this.containerRef = el), style: {
+        return (index.h(index.Host, { key: '4d73099f19f4e81ed2cd83ee1402e0f06f71f7ca' }, index.h("div", { key: '2593fe1c91bf4c7f167caa55fdc476d0a9d73841', ref: el => (this.containerRef = el), style: {
                 width: width,
                 height: height,
             } })));