fix(component): fix animation error in post-collapsible rendered inside inactive tabs

.changeset/tricky-buckets-sniff.md

@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-components': patch
+---
+
+Resolved an issue where `post-accordion` components placed within inactive tab panels caused animation-related exceptions.

packages/components/src/animations/collapse.ts

@@ -1,6 +1,6 @@
 const collapseDuration = 350;
 const collapseEasing = 'ease';
-const collapsedKeyframe: Keyframe = { height: '0', overflow: 'hidden' };
+export const collapsedKeyframe: Keyframe = { height: '0', overflow: 'hidden' };
 
 const animationOptions: KeyframeAnimationOptions = {
   duration: collapseDuration,

packages/components/src/components/post-collapsible/post-collapsible.tsx

@@ -10,7 +10,7 @@ import {
   Watch,
 } from '@stencil/core';
 import { version } from '@root/package.json';
-import { collapse, expand } from '@/animations/collapse';
+import { collapse, collapsedKeyframe, expand } from '@/animations/collapse';
 import { checkEmptyOrType, isMotionReduced } from '@/utils';
 
 /**
@@ -40,8 +40,18 @@ export class PostCollapsible {
       'boolean',
       'The `collapsed` property of the `post-collapsible` must be a boolean.',
     );
-
-    void this.toggle(!this.collapsed);
+
+    const expandedKeyframe: Keyframe = { height: 'auto', overflow: 'visible' };
+
+    if (!this.isLoaded) {
+      Object.assign(
+        this.host.style, 
+        this.collapsed ? collapsedKeyframe : expandedKeyframe
+      );
+      this.isOpen = !this.collapsed;
+    } else {
+      void this.toggle(!this.collapsed);
+    }
   }
 
   /**