@qwickapps/react-framework 1.4.9 → 1.5.1

package/src/__tests__/components/input/FormComponents.serialization.test.tsx

@@ -58,7 +58,7 @@ describe('Form Components Serialization', () => {
         required: true
       };
 
-      let serializedData: any;
+      let serializedData: Record<string, unknown>;
       let deserializedElement: React.ReactElement;
 
       // Test serialization
@@ -127,7 +127,7 @@ describe('Form Components Serialization', () => {
         addButtonText: 'Add Question'
       };
 
-      let serializedData: any;
+      let serializedData: Record<string, unknown>;
       let deserializedElement: React.ReactElement;
 
       // Test serialization
@@ -194,7 +194,7 @@ describe('Form Components Serialization', () => {
         color: 'primary' as const
       };
 
-      let serializedData: any;
+      let serializedData: Record<string, unknown>;
       let deserializedElement: React.ReactElement;
 
       // Test serialization
@@ -264,7 +264,7 @@ describe('Form Components Serialization', () => {
         backgroundImage: 'https://example.com/bg.jpg'
       };
 
-      let serializedData: any;
+      let serializedData: Record<string, unknown>;
       let deserializedElement: React.ReactElement;
 
       // Test serialization
@@ -350,7 +350,7 @@ describe('Form Components Serialization', () => {
         <SwitchInputField key="switch2" label="Another Switch" checked={false} />
       ];
 
-      let serializedData: any[];
+      let serializedData: string[];
       let deserializedElements: React.ReactElement[];
 
       // Bulk serialization
@@ -404,14 +404,14 @@ describe('Form Components Serialization', () => {
         }
       ];
 
-      testComponents.forEach(({ type, element, checkProps }) => {
+      testComponents.forEach(({ element, checkProps }) => {
         let currentElement = element;
-        let originalProps: any;
+        const originalProps: Record<string, unknown> = {};
         
         // Capture original props from first serialization
         const firstSerialized = ComponentTransformer.serialize(currentElement);
         const firstSerialization = JSON.parse(firstSerialized);
-        originalProps = firstSerialization.data;
+        Object.assign(originalProps, firstSerialization.data);
 
         // Perform 5 serialize-deserialize cycles
         for (let cycle = 0; cycle < 5; cycle++) {
@@ -471,7 +471,7 @@ describe('Form Components Serialization', () => {
 
       const element = <ChoiceInputField {...originalProps} />;
       const serialized = ComponentTransformer.serialize(element);
-      const serializedData = JSON.parse(serialized);
+      JSON.parse(serialized);
       const deserializedElement = ComponentTransformer.deserialize(serialized) as React.ReactElement;
       const reserialized = ComponentTransformer.serialize(deserializedElement);
       const reserializedData = JSON.parse(reserialized);

package/src/__tests__/components/input/SelectInputField.serialization.test.tsx

@@ -58,9 +58,8 @@ describe('SelectInputField Serialization', () => {
         placeholder: 'Select a country'
       };
 
-      let serializedData: any;
+      let serializedData: Record<string, unknown>;
       let deserializedElement: React.ReactElement;
-      let reserializedData: any;
 
       // Test serialization
       const serializationTime = measurePerformance('Basic Serialization', () => {
@@ -112,11 +111,11 @@ describe('SelectInputField Serialization', () => {
 
       const element = <SelectInputField {...originalProps} />;
       const serialized = ComponentTransformer.serialize(element);
-      const serializedData = JSON.parse(serialized);
+      JSON.parse(serialized);
       const deserializedElement = ComponentTransformer.deserialize(serialized) as React.ReactElement;
 
-      const { getByText, getByDisplayValue } = render(deserializedElement);
-      
+      const { getByText } = render(deserializedElement);
+
       expect(getByText('Priority Level')).toBeInTheDocument();
     });
   });
@@ -135,8 +134,8 @@ describe('SelectInputField Serialization', () => {
       };
 
       const element = <SelectInputField {...originalProps} />;
-      
-      let serializedData: any;
+
+      let serializedData: Record<string, unknown>;
       measurePerformance('Complex Options Serialization', () => {
         const serialized = ComponentTransformer.serialize(element);
         serializedData = JSON.parse(serialized);
@@ -196,19 +195,19 @@ describe('SelectInputField Serialization', () => {
       };
 
       const element = <SelectInputField {...originalProps} />;
-      
-      let serializedData: any;
+
+      let serializedData: Record<string, unknown>;
       measurePerformance('Validation Serialization', () => {
         const serialized = ComponentTransformer.serialize(element);
         serializedData = JSON.parse(serialized);
       });
 
-      expect(serializedData.data.required).toBe(true);
-      expect(serializedData.data.error).toBe(originalProps.error);
-      expect(serializedData.data.helperText).toBe(originalProps.helperText);
+      expect((serializedData.data as Record<string, unknown>).required).toBe(true);
+      expect((serializedData.data as Record<string, unknown>).error).toBe(originalProps.error);
+      expect((serializedData.data as Record<string, unknown>).helperText).toBe(originalProps.helperText);
 
       const deserializedElement = ComponentTransformer.deserialize(JSON.stringify(serializedData)) as React.ReactElement;
-      const { getByLabelText, getByText } = render(deserializedElement);
+      const { getByText } = render(deserializedElement);
 
       expect(getByText('Required Selection')).toBeInTheDocument();
       expect(getByText('Please select an option')).toBeInTheDocument();
@@ -329,8 +328,7 @@ describe('SelectInputField Serialization', () => {
         options: largeOptions
       };
 
-      let serializedData: any;
-      let deserializedElement: React.ReactElement;
+      let serializedData: unknown;
 
       // Test serialization performance with large dataset
       const serializationTime = measurePerformance('Large Options Serialization (1000 items)', () => {
@@ -341,7 +339,7 @@ describe('SelectInputField Serialization', () => {
 
       // Test deserialization performance
       const deserializationTime = measurePerformance('Large Options Deserialization (1000 items)', () => {
-        deserializedElement = ComponentTransformer.deserialize(JSON.stringify(serializedData)) as React.ReactElement;
+        ComponentTransformer.deserialize(JSON.stringify(serializedData)) as React.ReactElement;
       });
 
       expect(serializedData.data.options).toHaveLength(1000);
@@ -373,7 +371,7 @@ describe('SelectInputField Serialization', () => {
       }));
 
       let elements: React.ReactElement[];
-      let serializedData: any[];
+      let serializedData: unknown[];
       let deserializedElements: React.ReactElement[];
 
       // Bulk serialization
@@ -419,7 +417,7 @@ describe('SelectInputField Serialization', () => {
       };
 
       let currentElement = <SelectInputField {...originalProps} />;
-      let lastSerializedData: any;
+      let lastSerializedData: unknown;
 
       // Perform 10 serialize-deserialize cycles
       for (let cycle = 0; cycle < 10; cycle++) {

package/src/__tests__/components/input/TextInputField.serialization.test.tsx

@@ -32,7 +32,7 @@ describe('TextInputField Serialization', () => {
     ComponentTransformer.clearRegistry();
     
     // Register TextInputField component
-    ComponentTransformer.registerComponent(TextInputField as any);
+    ComponentTransformer.registerComponent(TextInputField as unknown as React.ComponentType);
   });
 
   afterEach(() => {
@@ -68,9 +68,9 @@ describe('TextInputField Serialization', () => {
         type: 'text'
       };
 
-      let serializedData: any;
+      let serializedData: string;
       let deserializedElement: React.ReactElement;
-      let reserializedData: any;
+      let reserializedData: string;
 
       // Test serialization
       const serializationTime = measurePerformance('Basic Serialization', () => {
@@ -141,8 +141,8 @@ describe('TextInputField Serialization', () => {
       };
 
       const element = <TextInputField {...originalProps} />;
-      
-      let serializedData: any;
+
+      let serializedData: Record<string, unknown>;
       measurePerformance('Multiline Serialization', () => {
         const serialized = ComponentTransformer.serialize(element);
         serializedData = JSON.parse(serialized);
@@ -174,8 +174,8 @@ describe('TextInputField Serialization', () => {
       };
 
       const element = <TextInputField {...originalProps} />;
-      
-      let serializedData: any;
+
+      let serializedData: Record<string, unknown>;
       measurePerformance('Validation Serialization', () => {
         const serialized = ComponentTransformer.serialize(element);
         serializedData = JSON.parse(serialized);
@@ -298,7 +298,7 @@ describe('TextInputField Serialization', () => {
       }));
 
       let elements: React.ReactElement[];
-      let serializedData: any[];
+      let serializedData: string[];
       let deserializedElements: React.ReactElement[];
 
       // Bulk serialization
@@ -339,7 +339,7 @@ describe('TextInputField Serialization', () => {
       };
 
       let currentElement = <TextInputField {...originalProps} />;
-      let lastSerializedData: any;
+      let lastSerializedData: Record<string, unknown>;
 
       // Perform 10 serialize-deserialize cycles
       for (let cycle = 0; cycle < 10; cycle++) {

package/src/__tests__/components/layout/CollapsibleLayout.test.tsx

@@ -16,14 +16,13 @@
  */
 
 import React from 'react';
-import { render, screen, fireEvent, waitFor, act } from '@testing-library/react';
+import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 import CollapsibleLayout, { CollapsibleLayoutView, useCollapsibleState } from '../../../components/layout/CollapsibleLayout';
 import { DataProvider } from '../../../contexts/DataContext';
 import { JsonDataProvider } from '@qwickapps/schema';
 import { ThemeProvider, PaletteProvider } from '../../../contexts';
-import { CollapsibleLayoutProps } from '../../../types/CollapsibleLayout';
 
 // Test data for data binding
 const sampleCmsData = {
@@ -130,7 +129,7 @@ const HookTestComponent: React.FC<{
   onToggle?: (collapsed: boolean) => void;
   persistState?: boolean;
   storageKey?: string;
-  onStateChange?: (state: any) => void;
+  onStateChange?: (state: { collapsed: boolean; toggle: () => void }) => void;
 }> = ({ controlled, collapsed, defaultCollapsed, onToggle, persistState, storageKey, onStateChange }) => {
   const state = useCollapsibleState(controlled, collapsed, defaultCollapsed, onToggle, persistState, storageKey);
   
@@ -452,7 +451,6 @@ describe('CollapsibleLayout', () => {
     it('handles controlled mode correctly', async () => {
       const user = userEvent.setup();
       const onToggle = jest.fn();
-      let currentState: any;
 
       render(
         <HookTestComponent
@@ -566,11 +564,9 @@ describe('CollapsibleLayout', () => {
     });
 
     it('handles header trigger area correctly', async () => {
-      const user = userEvent.setup();
-      
       render(
         <TestWrapper>
-          <CollapsibleLayout 
+          <CollapsibleLayout
             title="Header Trigger Test"
             triggerArea="header"
           >
@@ -1258,7 +1254,7 @@ describe('CollapsibleLayout', () => {
       render(
         <TestWrapper>
           <CollapsibleLayout 
-            animationStyle={'invalid' as any}
+            animationStyle={'invalid' as unknown}
           >
             <div>Content</div>
           </CollapsibleLayout>
@@ -1287,7 +1283,7 @@ describe('CollapsibleLayout', () => {
 
     it('preserves component marking for QwickApp framework', () => {
       // The component should be marked as a QwickApp component
-      const component = CollapsibleLayoutView as any;
+      const component = CollapsibleLayoutView as unknown;
       // Note: This test might need adjustment based on actual implementation
       expect(typeof component).toBe('function');
     });

package/src/__tests__/components/layout/GridCell.serialization.test.tsx

@@ -8,7 +8,7 @@
  */
 
 import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { render } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { ComponentTransformer } from '../../../schemas/transformers/ComponentTransformer';
 import { GridCell } from '../../../components/layout/GridCell';
@@ -22,10 +22,10 @@ describe('GridCell Serialization', () => {
     ComponentTransformer.clearRegistry();
     
     // Register all necessary components
-    ComponentTransformer.registerComponent(GridCell as any);
-    ComponentTransformer.registerComponent(Text as any);
-    ComponentTransformer.registerComponent(Button as any);
-    ComponentTransformer.registerComponent(Code as any);
+    ComponentTransformer.registerComponent(GridCell as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(Text as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(Button as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(Code as unknown as React.ComponentType);
   });
 
   afterEach(() => {

package/src/__tests__/components/layout/GridLayout.serialization.test.tsx

@@ -8,7 +8,7 @@
  */
 
 import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { render } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { ComponentTransformer } from '../../../schemas/transformers/ComponentTransformer';
 import { GridLayout } from '../../../components/layout/GridLayout';
@@ -22,10 +22,10 @@ describe('GridLayout Serialization', () => {
     ComponentTransformer.clearRegistry();
     
     // Register all necessary components
-    ComponentTransformer.registerComponent(GridLayout as any);
-    ComponentTransformer.registerComponent(GridCell as any);
-    ComponentTransformer.registerComponent(Text as any);
-    ComponentTransformer.registerComponent(Button as any);
+    ComponentTransformer.registerComponent(GridLayout as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(GridCell as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(Text as unknown as React.ComponentType);
+    ComponentTransformer.registerComponent(Button as unknown as React.ComponentType);
   });
 
   afterEach(() => {

package/src/__tests__/hooks/usePrintMode.test.ts

@@ -83,6 +83,7 @@ describe('PrintConfig Integration', () => {
 
   it('should export PrintModeState interface from usePrintMode', () => {
     // This test ensures the types are properly exported
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
     const { usePrintMode } = require('../../hooks/usePrintMode');
     expect(typeof usePrintMode).toBe('function');
   });

package/src/__tests__/schemas/builders.test.ts

@@ -152,7 +152,7 @@ describe.skip('ModelBuilder', () => {
   });
 
   test('throws error when building without name', () => {
-    const builder = new (ModelBuilder as any)(undefined);
+    const builder = new (ModelBuilder as unknown as new (name?: string) => typeof ModelBuilder)(undefined);
     expect(() => builder.build()).toThrow('Component must have a name');
   });
 });
@@ -249,7 +249,7 @@ describe.skip('SchemaBuilder', () => {
   });
 
   test('throws error when building without name', () => {
-    const builder = new (SchemaBuilder as any)(undefined);
+    const builder = new (SchemaBuilder as unknown as new (name?: string) => typeof SchemaBuilder)(undefined);
     expect(() => builder.build()).toThrow('Schema must have a name');
   });
 });

package/src/__tests__/schemas/transformers/ComponentSerializationPatterns.test.tsx

@@ -15,14 +15,14 @@ import { Serializable, SerializableConstructor } from '../../types/Serializable'
  * Generic test pattern for validating component serialization
  * This pattern should be used for all components implementing Serializable
  */
-export function testComponentSerialization<T extends Serializable>(
+export function testComponentSerialization(
   componentName: string,
   ComponentClass: SerializableConstructor,
   testCases: {
     name: string;
-    props: any;
-    expectedData?: any;
-    validate?: (element: ReactElement, originalProps: any) => void;
+    props: Record<string, unknown>;
+    expectedData?: Record<string, unknown>;
+    validate?: (element: ReactElement, originalProps: Record<string, unknown>) => void;
     shouldThrow?: boolean;
     errorMessage?: string;
   }[]
@@ -158,17 +158,17 @@ export function testComponentSerialization<T extends Serializable>(
 
 // Example component implementations for testing patterns
 class TestButton implements Serializable {
-  constructor(public props: { 
-    label?: string; 
+  constructor(public props: {
+    label?: string;
     variant?: 'primary' | 'secondary' | 'danger';
     disabled?: boolean;
     onClick?: () => void;
-    children?: any;
+    children?: React.ReactNode;
     className?: string;
     'data-testid'?: string;
   }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  static fromJson(jsonData: Record<string, unknown>): ReactElement {
     return React.createElement('button', {
       className: `btn ${jsonData.variant ? `btn-${jsonData.variant}` : 'btn-primary'} ${jsonData.className || ''}`.trim(),
       disabled: jsonData.disabled,
@@ -177,7 +177,7 @@ class TestButton implements Serializable {
     }, jsonData.label || jsonData.children || 'Button');
   }
 
-  toJson(): any {
+  toJson(): unknown {
     return {
       label: this.props.label,
       variant: this.props.variant,
@@ -196,13 +196,13 @@ class TestCard implements Serializable {
     content?: string;
     image?: string;
     imageAlt?: string;
-    actions?: any[];
-    metadata?: Record<string, any>;
+    actions?: unknown[];
+    metadata?: Record<string, unknown>;
     className?: string;
     elevation?: number;
   }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  static fromJson(jsonData: unknown): ReactElement {
     const actions = jsonData.actions ? ComponentTransformer.deserialize(jsonData.actions) : null;
 
     return React.createElement('div', {
@@ -231,7 +231,7 @@ class TestCard implements Serializable {
     ].filter(Boolean));
   }
 
-  toJson(): any {
+  toJson(): unknown {
     return {
       title: this.props.title,
       content: this.props.content,
@@ -249,14 +249,14 @@ class TestSection implements Serializable {
   constructor(public props: {
     title?: string;
     subtitle?: string;
-    children?: any;
+    children?: unknown;
     className?: string;
     backgroundColor?: string;
     padding?: string;
     id?: string;
   }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  static fromJson(jsonData: unknown): ReactElement {
     const children = jsonData.children ? ComponentTransformer.deserialize(jsonData.children) : null;
 
     return React.createElement('section', {
@@ -276,7 +276,7 @@ class TestSection implements Serializable {
     ].filter(Boolean));
   }
 
-  toJson(): any {
+  toJson(): unknown {
     return {
       title: this.props.title,
       subtitle: this.props.subtitle,
@@ -300,7 +300,7 @@ class TestCode implements Serializable {
     filename?: string;
   }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  static fromJson(jsonData: unknown): ReactElement {
     return React.createElement('div', {
       className: `code-container theme-${jsonData.theme || 'light'}`,
       'data-testid': 'test-code'
@@ -319,7 +319,7 @@ class TestCode implements Serializable {
     ].filter(Boolean));
   }
 
-  toJson(): any {
+  toJson(): unknown {
     return {
       code: this.props.code,
       language: this.props.language,
@@ -343,14 +343,14 @@ describe('Component Serialization Pattern Tests', () => {
     },
     {
       name: 'handle button with all props',
-      props: { 
-        label: 'Full Button', 
-        variant: 'danger', 
-        disabled: true, 
+      props: {
+        label: 'Full Button',
+        variant: 'danger',
+        disabled: true,
         className: 'custom-btn',
         'data-testid': 'full-button'
       },
-      validate: (element, props) => {
+      validate: (element) => {
         expect(element.props.className).toContain('btn-danger');
         expect(element.props.className).toContain('custom-btn');
         expect(element.props.disabled).toBe(true);
@@ -391,7 +391,7 @@ describe('Component Serialization Pattern Tests', () => {
       validate: (element) => {
         expect(element.props['data-elevation']).toBe(2);
         // Check for image in children
-        const imageChild = element.props.children.find((child: any) => child?.type === 'img');
+        const imageChild = element.props.children.find((child: unknown) => child?.type === 'img');
         expect(imageChild).toBeTruthy();
         expect(imageChild.props.src).toBe('https://example.com/image.jpg');
         expect(imageChild.props.alt).toBe('Test image');
@@ -476,14 +476,14 @@ describe('Component Serialization Pattern Tests', () => {
       validate: (element) => {
         expect(element.props.className).toContain('theme-dark');
         // Check for filename display
-        const filenameChild = element.props.children.find((child: any) => 
+        const filenameChild = element.props.children.find((child: unknown) => 
           child?.props?.className === 'code-filename'
         );
         expect(filenameChild).toBeTruthy();
         expect(filenameChild.props.children).toBe('example.js');
         
         // Check code block attributes
-        const preChild = element.props.children.find((child: any) => child?.type === 'pre');
+        const preChild = element.props.children.find((child: unknown) => child?.type === 'pre');
         expect(preChild.props['data-line-numbers']).toBe(true);
         expect(preChild.props['data-highlight-lines']).toBe('1,3');
         expect(preChild.props.style.maxHeight).toBe('300px');
@@ -493,7 +493,7 @@ describe('Component Serialization Pattern Tests', () => {
       name: 'handle empty code block',
       props: { language: 'text' },
       validate: (element) => {
-        const preChild = element.props.children.find((child: any) => child?.type === 'pre');
+        const preChild = element.props.children.find((child: unknown) => child?.type === 'pre');
         expect(preChild.props.className).toContain('language-text');
         expect(preChild.props.children.props.children).toBe('');
       }
@@ -511,7 +511,7 @@ describe('Component Serialization Pattern Tests', () => {
 
     it('should handle components with circular references in data', () => {
       const circularData = { name: 'circular' };
-      (circularData as any).self = circularData;
+      (circularData as unknown).self = circularData;
 
       // This should not crash, though the circular reference may be lost
       expect(() => {

package/src/__tests__/schemas/transformers/ComponentTransformer.htmlPatterns.test.ts

@@ -15,7 +15,7 @@ import { Code } from '../../../../schemas/transformers/components/blocks/Code';
 Object.defineProperty(global, 'DOMParser', {
   writable: true,
   value: class DOMParser {
-    parseFromString(htmlString: string, contentType: string) {
+    parseFromString(htmlString: string) {
       // Simple mock that creates elements for our tests
       const mockDoc = {
         body: {
@@ -102,7 +102,7 @@ describe('ComponentTransformer HTML Patterns', () => {
       const mockRegisterPatterns = jest.fn();
       Code.registerPatternHandlers = mockRegisterPatterns;
 
-      ComponentTransformer.registerComponent(Code as any);
+      ComponentTransformer.registerComponent(Code as unknown as React.ComponentType);
 
       expect(mockRegisterPatterns).toHaveBeenCalledWith(ComponentTransformer);
 
@@ -225,7 +225,7 @@ describe('ComponentTransformer HTML Patterns', () => {
   describe('Code Component Integration', () => {
     test('should register Code component patterns', () => {
       // Register Code component
-      ComponentTransformer.registerComponent(Code as any);
+      ComponentTransformer.registerComponent(Code as unknown as React.ComponentType);
 
       // Check that patterns were registered
       expect(ComponentTransformer.hasPattern('pre code')).toBe(true);
@@ -233,7 +233,7 @@ describe('ComponentTransformer HTML Patterns', () => {
     });
 
     test('should transform pre+code elements', () => {
-      ComponentTransformer.registerComponent(Code as any);
+      ComponentTransformer.registerComponent(Code as unknown as React.ComponentType);
 
       // Create pre+code element
       const pre = document.createElement('pre');
@@ -266,7 +266,7 @@ describe('ComponentTransformer HTML Patterns', () => {
     });
 
     test('should handle missing code child in pre element', () => {
-      ComponentTransformer.registerComponent(Code as any);
+      ComponentTransformer.registerComponent(Code as unknown);
 
       const pre = document.createElement('pre');
       pre.textContent = 'Just text, no code element';

package/src/__tests__/schemas/transformers/ComponentTransformer.test.ts

@@ -23,14 +23,14 @@ class MockButton implements Serializable {
   
   constructor(public props: { label?: string; variant?: string; onClick?: () => void }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  static fromJson(jsonData: Record<string, unknown>): ReactElement {
     return React.createElement('button', {
-      className: `btn-${jsonData.variant || 'default'}`,
-      onClick: jsonData.onClick
-    }, jsonData.label || 'Button');
+      className: `btn-${(jsonData.variant as string) || 'default'}`,
+      onClick: jsonData.onClick as (() => void) | undefined
+    }, (jsonData.label as string) || 'Button');
   }
 
-  toJson(): any {
+  toJson(): Record<string, unknown> {
     return {
       label: this.props.label,
       variant: this.props.variant,
@@ -42,10 +42,10 @@ class MockButton implements Serializable {
 class MockCard implements Serializable {
   static readonly tagName = 'Card';
   static readonly version = '1.0.0';
-  
-  constructor(public props: { title?: string; content?: string; children?: any }) {}
 
-  static fromJson(jsonData: any): ReactElement {
+  constructor(public props: { title?: string; content?: string; children?: React.ReactNode }) {}
+
+  static fromJson(jsonData: Record<string, unknown>): ReactElement {
     return React.createElement('div', {
       className: 'card'
     }, [
@@ -54,7 +54,7 @@ class MockCard implements Serializable {
     ]);
   }
 
-  toJson(): any {
+  toJson(): unknown {
     return {
       title: this.props.title,
       content: this.props.content
@@ -367,7 +367,7 @@ describe('ComponentTransformer', () => {
       const result = ComponentTransformer.deserialize(input);
       expect(Array.isArray(result)).toBe(true);
       
-      const elements = result as any[];
+      const elements = result as unknown[];
       expect(elements[0]).toBe('plain text');
       expect(React.isValidElement(elements[1])).toBe(true);
       expect(elements[2]).toBe(42);
@@ -477,7 +477,7 @@ describe('ComponentTransformer', () => {
       const result = ComponentTransformer.deserialize(mixedArray);
       expect(Array.isArray(result)).toBe(true);
       
-      const elements = result as any[];
+      const elements = result as unknown[];
       expect(elements).toHaveLength(3);
       expect(elements[0]).toBe('Text node');
       expect(React.isValidElement(elements[1])).toBe(true);