1"use strict";(self.webpackChunkdocumentation=self.webpackChunkdocumentation||[]).push([[8752],{5451:(e,n,i)=>{i.r(n),i.d(n,{assets:()=>o,contentTitle:()=>a,default:()=>h,frontMatter:()=>l,metadata:()=>t,toc:()=>d});const t=JSON.parse('{"id":"widgets/statefull_wrapper_appi","title":"StatefullWrapperAppi","description":"A powerful utility widget that wraps any child widget with stateful lifecycle management, allowing you to add initialization, disposal, and dependency change callbacks to stateless widgets without converting them to stateful widgets.","source":"@site/docs/widgets/statefull_wrapper_appi.md","sourceDirName":"widgets","slug":"/widgets/statefull_wrapper_appi","permalink":"/docs/widgets/statefull_wrapper_appi","draft":false,"unlisted":false,"tags":[],"version":"current","sidebarPosition":32,"frontMatter":{"id":"statefull_wrapper_appi","slug":"/widgets/statefull_wrapper_appi","sidebar_position":32,"title":"StatefullWrapperAppi"},"sidebar":"tutorialSidebar","previous":{"title":"BottomSheetAppi","permalink":"/docs/widgets/bottom_sheet_appi"},"next":{"title":"HydratedAppi","permalink":"/docs/widgets/hydrated_appi"}}');var r=i(4848),s=i(8453);const l={id:"statefull_wrapper_appi",slug:"/widgets/statefull_wrapper_appi",sidebar_position:32,title:"StatefullWrapperAppi"},a="StatefullWrapperAppi",o={},d=[{value:"Overview",id:"overview",level:2},{value:"Features",id:"features",level:2},{value:"Basic Usage",id:"basic-usage",level:2},{value:"Properties",id:"properties",level:2},{value:"Examples",id:"examples",level:2},{value:"Basic Initialization and Cleanup",id:"basic-initialization-and-cleanup",level:3},{value:"API Service Integration",id:"api-service-integration",level:3},{value:"Stream Subscription Management",id:"stream-subscription-management",level:3},{value:"Analytics Tracking",id:"analytics-tracking",level:3},{value:"Resource Manager",id:"resource-manager",level:3},{value:"Form Validation Setup",id:"form-validation-setup",level:3},{value:"Advanced Features",id:"advanced-features",level:2},{value:"Lifecycle Event Chaining",id:"lifecycle-event-chaining",level:3},{value:"Conditional Lifecycle Execution",id:"conditional-lifecycle-execution",level:3},{value:"Best Practices",id:"best-practices",level:2},{value:"Common Use Cases",id:"common-use-cases",level:2},{value:"Related Widgets",id:"related-widgets",level:2},{value:"Migration Notes",id:"migration-notes",level:2},{value:"Technical Notes",id:"technical-notes",level:2}];function c(e){const n={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",header:"header",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",ul:"ul",...(0,s.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.header,{children:(0,r.jsx)(n.h1,{id:"statefullwrapperappi",children:"StatefullWrapperAppi"})}),"\n",(0,r.jsx)(n.p,{children:"A powerful utility widget that wraps any child widget with stateful lifecycle management, allowing you to add initialization, disposal, and dependency change callbacks to stateless widgets without converting them to stateful widgets."}),"\n",(0,r.jsx)(n.h2,{id:"overview",children:"Overview"}),"\n",(0,r.jsxs)(n.p,{children:[(0,r.jsx)(n.code,{children:"StatefullWrapperAppi"})," provides a clean and efficient way to add stateful behavior to stateless widgets. It acts as a wrapper that manages the widget lifecycle and provides hooks for initialization, cleanup, and dependency changes, making it perfect for scenarios where you need stateful behavior without the overhead of creating a full stateful widget."]}),"\n",(0,r.jsx)(n.h2,{id:"features",children:"Features"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:["\ud83d\udd04 ",(0,r.jsx)(n.strong,{children:"Lifecycle Management"})," - Access to initState, dispose, and didChangeDependencies"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83c\udfaf ",(0,r.jsx)(n.strong,{children:"Non-intrusive"})," - Wrap any widget without modifying its structure"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83e\uddf9 ",(0,r.jsx)(n.strong,{children:"Automatic Cleanup"})," - Proper disposal handling for resources"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83d\udce6 ",(0,r.jsx)(n.strong,{children:"Lightweight"})," - Minimal overhead and memory footprint"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83d\udd27 ",(0,r.jsx)(n.strong,{children:"Flexible Callbacks"})," - Optional callback functions for different lifecycle events"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83c\udfaa ",(0,r.jsx)(n.strong,{children:"Dependency Tracking"})," - React to dependency changes in the widget tree"]}),"\n",(0,r.jsxs)(n.li,{children:["\u26a1 ",(0,r.jsx)(n.strong,{children:"Performance Optimized"})," - Efficient lifecycle management"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83d\udee1\ufe0f ",(0,r.jsx)(n.strong,{children:"Null Safety"})," - Full null safety support with optional callbacks"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83c\udfa8 ",(0,r.jsx)(n.strong,{children:"Transparent Rendering"})," - Child widget renders exactly as it would normally"]}),"\n",(0,r.jsxs)(n.li,{children:["\ud83d\udd17 ",(0,r.jsx)(n.strong,{children:"Easy Integration"})," - Drop-in replacement for complex stateful logic"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"basic-usage",children:"Basic Usage"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"StatefullWrapperAppi(\n onInit: () {\n print('Widget initialized');\n },\n onDispose: () {\n print('Widget disposed');\n },\n child: Text('Hello World'),\n)\n"})}),"\n",(0,r.jsx)(n.h2,{id:"properties",children:"Properties"}),"\n",(0,r.jsxs)(n.table,{children:[(0,r.jsx)(n.thead,{children:(0,r.jsxs)(n.tr,{children:[(0,r.jsx)(n.th,{children:"Property"}),(0,r.jsx)(n.th,{children:"Type"}),(0,r.jsx)(n.th,{children:"Default"}),(0,r.jsx)(n.th,{children:"Description"})]})}),(0,r.jsxs)(n.tbody,{children:[(0,r.jsxs)(n.tr,{children:[(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"child"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"Widget"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.strong,{children:"required"})}),(0,r.jsx)(n.td,{children:"The child widget to wrap with stateful behavior"})]}),(0,r.jsxs)(n.tr,{children:[(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"onInit"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"Function()?"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"null"})}),(0,r.jsx)(n.td,{children:"Callback executed during initState lifecycle"})]}),(0,r.jsxs)(n.tr,{children:[(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"onDispose"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"Function()?"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"null"})}),(0,r.jsx)(n.td,{children:"Callback executed during dispose lifecycle"})]}),(0,r.jsxs)(n.tr,{children:[(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"didChangeDependencies"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"Function()?"})}),(0,r.jsx)(n.td,{children:(0,r.jsx)(n.code,{children:"null"})}
1),(0,r.jsx)(n.td,{children:"Callback executed when dependencies change"})]})]})]}),"\n",(0,r.jsx)(n.h2,{id:"examples",children:"Examples"}),"\n",(0,r.jsx)(n.h3,{id:"basic-initialization-and-cleanup",children:"Basic Initialization and Cleanup"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class TimerDisplay extends StatelessWidget {\n @override\n Widget build(BuildContext context) {\n return StatefullWrapperAppi(\n onInit: () {\n print('Timer display initialized');\n // Initialize any resources here\n },\n onDispose: () {\n print('Timer display disposed');\n // Clean up resources here\n },\n child: Container(\n padding: EdgeInsets.all(16),\n decoration: BoxDecoration(\n color: Colors.blue[50],\n borderRadius: BorderRadius.circular(8),\n border: Border.all(color: Colors.blue[200]!),\n ),\n child: Column(\n mainAxisSize: MainAxisSize.min,\n children: [\n Icon(Icons.timer, color: Colors.blue),\n SizedBox(height: 8),\n Text(\n 'Timer C
1omponent',\n style: TextStyle(\n fontSize: 16,\n fontWeight: FontWeight.bold,\n color: Colors.blue[800],\n ),\n ),\n Text(\n 'Initialized with lifecycle management',\n style: TextStyle(\n fontSize: 12,\n color: Colors.grey[600],\n ),\n ),\n ],\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"api-service-integration",children:"API Service Integration"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class UserProfileWidget extends StatelessWidget {\n final String userId;\n final Function(Map<String, dynamic>) onUserLoaded;\n\n const UserProfileWidget({\n Key? key,\n required this.userId,\n required this.onUserLoaded,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n return StatefullWrapperAppi(\n onInit: () async {\n // Fetch user data when widget initializes\n try {\n final userData = await ApiService.fetchUser(userId);\n onUserLoaded(userData);\n } catch (e) {\n print('Error loading user: $e');\n }\n },\n onDispose: () {\n // Cancel any ongoing requests\n ApiService.cancelUserRequests(userId);\n },\n didChangeDependencies: () {\n // React to dependency changes (e.g., theme, locale)\n print('Dependencies changed for user $userId');\n },\n child: Card(\n elevation: 4,\n margin: EdgeInsets.all(16),\n child: Padding(\n padding: EdgeInsets.all(20),\n child: Column(\n crossAxisAlignment: CrossAxisAlignment.start,\n children: [\n Row(\n children: [\n CircleAvatar(\n radius: 30,\n backgroundColor: Colors.blue[100],\n child: Icon(Icons.person, size: 30, color: Colors.blue),\n ),\n SizedBox(width: 16),\n Expanded(\n child: Column(\n crossAxisAlignment: CrossAxisAlignment.start,\n children: [\n Text(\n 'User Profile',\n style: TextStyle(\n fontSize: 18,\n fontWeight: FontWeight.bold,\n ),\n ),\n Text(\n 'ID: $userId',\n style: TextStyle(\n color: Colors.grey[600],\n fontSize: 14,\n ),\n ),\n ],\n ),\n ),\n ],\n ),\n SizedBox(height: 16),\n \n Container(\n padding: EdgeInsets.all(12),\n decoration: BoxDecoration(\n color: Colors.green[50],\n borderRadius: BorderRadius.circular(8),\n border: Border.all(color: Colors.green[200]!),\n ),\n child: Row(\n children: [\n Icon(Icons.check_circle, color: Colors.green, size: 20),\n SizedBox(width: 8),\n Text(\n 'Profile data will load automatically',\n style: TextStyle(\n color: Colors.green[800],\n fontSize: 12,\n ),\n ),\n ],\n ),\n ),\n ],\n ),\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"stream-subscription-management",children:"Stream Subscription Management"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class NotificationListener extends StatelessWidget {\n final Function(String) onNotificationReceived;\n\n const NotificationListener({\n Key? key,\n required this.onNotificationReceived,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n StreamSubscription<String>? notificationSubscription;\n\n return StatefullWrapperAppi(\n onInit: () {\n // Subscribe to notifications when widget initializes\n notificationSubscription = NotificationService.stream.listen(\n (notification) {\n onNotificationReceived(notification);\n },\n onError: (error) {\n print('Notification error: $error');\n },\n );\n print('Notification listener started');\n },\n onDispose: () {\n // Clean up subscription when widget is disposed\n notificationSubscription?.cancel();\n print('Notification listener stopped');\n },\n didChangeDependencies: () {\n // Handle dependency changes if needed\n print('Notification listener dependencies changed');\n },\n child: Container(\n padding: EdgeInsets.all(16),\n decoration: BoxDecoration(\n gradient: LinearGradient(\n colors: [Colors.purple[50]!, Colors.white],\n begin: Alignment.topLeft,\n end: Alignment.bottomRight,\n ),\n borderRadius: BorderRadius.circular(12),\n boxShadow: [\n BoxShadow(\n color: Colors.grey.withOpacity(0.2),\n spreadRadius: 2,\n blurRadius: 8,\n offset: Offset(0, 2),\n ),\n ],\n ),\n child: Column(\n mainAxisSize: MainAxisSize.min,\n children: [\n Icon(\n Icons.notifications_active,\n color: Colors.purple,\n size: 32,\n ),\n SizedBox(height: 12),\n Text(\n '
1Notification Listener',\n style: TextStyle(\n fontSize: 16,\n fontWeight: FontWeight.bold,\n color: Colors.purple[800],\n ),\n ),\n SizedBox(height: 4),\n Text(\n 'Listening for real-time notifications',\n style: TextStyle(\n fontSize: 12,\n color: Colors.grey[600],\n ),\n textAlign: TextAlign.center,\n ),\n SizedBox(height: 12),\n \n Container(\n padding: EdgeInsets.symmetric(horizontal: 12, vertical: 6),\n decoration: BoxDecoration(\n color: Colors.purple[100],\n borderRadius: BorderRadius.circular(16),\n ),\n child: Row(\n mainAxisSize: MainAxisSize.min,\n children: [\n Container(\n width: 8,\n height: 8,\n decoration: BoxDecoration(\n color: Colors.green,\n shape: BoxShape.circle,\n ),\n ),\n SizedBox(width: 6),\n Text(\n 'Active',\n style: TextStyle(\n color: Colors.purple[800],\n fontSize: 12,\n fontWeight: FontWeight.w500,\n ),\n ),\n ],\n ),\n ),\n ],\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"analytics-tracking",children:"Analytics Tracking"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class AnalyticsTracker extends StatelessWidget {\n final String screenName;\n final Map<String, dynamic>? additionalData;\n\n const AnalyticsTracker({\n Key? key,\n required this.screenName,\n this.additionalData,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n DateTime? screenStartTime;\n\n return StatefullWrapperAppi(\n onInit: () {\n // Track screen view when widget initializes\n screenStartTime = DateTime.now();\n AnalyticsService.trackScreenView(\n screenName: screenName,\n additionalData: additionalData,\n );\n print('Analytics: Screen view tracked for $screenName');\n },\n onDispose: () {\n // Track screen exit and duration when widget is disposed\n if (screenStartTime != null) {\n final duration = DateTime.now().difference(screenStartTime!);\n AnalyticsService.trackScreenExit(\n screenName: screenName,\n duration: duration,\n );\n print('Analytics: Screen exit tracked for $screenName (${duration.inSeconds}s)');\n }\n },\n didChangeDependencies: () {\n // Track dependency changes if relevant for analytics\n AnalyticsService.trackEvent(\n 'screen_dependency_change',\n {'screen': screenName},\n );\n },\n child: Container(\n padding: EdgeInsets.all(16),\n decoration: BoxDecoration(\n color: Colors.orange[50],\n borderRadius: BorderRadius.circular(8),\n border: Border.all(color: Colors.orange[200]!),\n ),\n child: Column(\n mainAxisSize: MainAxisSize.min,\n children: [\n Row(\n children: [\n Icon(Icons.analytics, c
1olor: Colors.orange),\n SizedBox(width: 8),\n Text(\n 'Analytics Tracker',\n style: TextStyle(\n fontSize: 16,\n fontWeight: FontWeight.bold,\n color: Colors.orange[800],\n ),\n ),\n ],\n ),\n SizedBox(height: 8),\n Text(\n 'Tracking: $screenName',\n style: TextStyle(\n fontSize: 14,\n color: Colors.grey[700],\n ),\n ),\n if (additionalData != null) ...[\n SizedBox(height: 4),\n Text(\n 'Additional data: ${additionalData!.keys.join(', ')}',\n style: TextStyle(\n fontSize: 12,\n color: Colors.grey[600],\n ),\n ),\n ],\n ],\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"resource-manager",children:"Resource Manager"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class ResourceManager extends StatelessWidget {\n final List<String> resourceUrls;\n final Function(List<String>) onResourcesLoaded;\n\n const ResourceManager({\n Key? key,\n required this.resourceUrls,\n required this.onResourcesLoaded,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n List<String> loadedResources = [];\n\n return StatefullWrapperAppi(\n onInit: () async {\n // Preload resources when widget initializes\n try {\n for (String url in resourceUrls) {\n await ResourceService.preloadResource(url);\n loadedResources.add(url);\n }\n onResourcesLoaded(loadedResources);\n print('All resources loaded successfully');\n } catch (e) {\n print('Error loading resources: $e');\n }\n },\n onDispose: () {\n // Clean up cached resources when widget is disposed\n for (String url in loadedResources) {\n ResourceService.clearCache(url);\n }\n print('Resource cache cleared');\n },\n child: Container(\n padding: EdgeInsets.all(16),\n decoration: BoxDecoration(\n gradient: LinearGradient(\n colors: [Colors.teal[50]!, Colors.white],\n begin: Alignment.topLeft,\n end: Alignment.bottomRight,\n ),\n borderRadius: BorderRadius.circular(12),\n border: Border.all(color: Colors.teal[200]!),\n ),\n child: Column(\n mainAxisSize: MainAxisSize.min,\n children: [\n Row(\n children: [\n Icon(Icons.storage, color: Colors.teal),\n SizedBox(width: 8),\n Text(\n 'Resource Manager',\n style: TextStyle(\n fontSize: 16,\n fontWeight: FontWeight.bold,\n color: Colors.teal[800],\n ),\n ),\n ],\n ),\n SizedBox(height: 8),\n Text(\n 'Managing ${resourceUrls.length} resources',\n style: TextStyle(\n fontSize: 14,\n color: Colors.grey[700],\n ),\n ),\n SizedBox(height: 12),\n \n Container(\n padding: EdgeInsets.all(8),\n decoration: BoxDecoration(\n color: Colors.teal[100],\n borderRadius: BorderRadius.circular(6),\n ),\n child: Row(\n mainAxisSize: MainAxisSize.min,\n children: [\n Icon(Icons.cloud_download, size: 16, color: Colors.teal[800]),\n SizedBox(width: 6),\n Text(\n 'Auto-loading resources',\n style: TextStyle(\n fontSize: 12,\n color: Colors.teal[800],\n fontWeight: FontWeight.w500,\n ),\n ),\n ],\n ),\n ),\n ],\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"form-validation-setup",children:"Form Validation Setup"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class FormValidationWrapper extends StatelessWidget {\n final Widget formChild;\n final GlobalKey<FormState> formKey;\n final Function()? onFormReady;\n\n const FormValidationWrapper({\n Key? key,\n required this.formChild,\n required this.formKey,\n this.onFormReady,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n return StatefullWrapperAppi(\n onInit: () {\n // Setup form validation when widget initializes\n WidgetsBinding.instance.addPostFrameCallback((_) {\n onFormReady?.call();\n });\n print('Form validation setup complete');\n },\n onDispose: () {\n // Clean up form state when widget is disposed\n formKey.currentState?.reset();\n print('Form state cleaned up');\n },\n didChangeDependencies: () {\n // Handle form dependency changes\n print('Form dependencies changed');\n },\n child: Form(\n key: formKey,\n child: Container(\n padding: EdgeInsets.all(20),\n decoration: BoxDecoration(\n color: Colors.white,\n borderRadius: BorderRadius.circular(12),\n boxShadow: [\n BoxShadow(\n color: Colors.grey.withOpacity(0.1),\n spreadRadius: 2,\n blurRadius: 8,\n offset: Offset(0, 2),\n ),\n ],\n ),\n child: Column(\n crossAxisAlignment: CrossAxisAlignment.
1start,\n children: [\n Row(\n children: [\n Icon(Icons.assignment, color: Colors.blue),\n SizedBox(width: 8),\n Text(\n 'Form with Lifecycle Management',\n style: TextStyle(\n fontSize: 16,\n fontWeight: FontWeight.bold,\n color: Colors.blue[800],\n ),\n ),\n ],\n ),\n SizedBox(height: 16),\n formChild,\n SizedBox(height: 12),\n \n Container(\n padding: EdgeInsets.all(8),\n decoration: BoxDecoration(\n color: Colors.blue[50],\n borderRadius: BorderRadius.circular(6),\n ),\n child: Row(\n children: [\n Icon(Icons.info, size: 16, color: Colors.blue),\n SizedBox(width: 6),\n Text(\n 'Form automatically manages validation lifecycle',\n style: TextStyle(\n fontSize: 12,\n color: Colors.blue[800],\n ),\n ),\n ],\n ),\n ),\n ],\n ),\n ),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h2,{id:"advanced-features",children:"Advanced Features"}),"\n",(0,r.jsx)(n.h3,{id:"lifecycle-event-chaining",children:"Lifecycle Event Chaining"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class ChainedLifecycleWidget extends StatelessWidget {\n @override\n Widget build(BuildContext context) {\n return StatefullWrapperAppi(\n onInit: () {\n print('1. Widget initialized');\n _setupInitialState();\n _registerEventListeners();\n _loadInitialData();\n },\n didChangeDependencies: () {\n print('2. Dependencies changed');\n _handleDependencyChanges();\n _updateThemeBasedSettings();\n },\n onDispose: () {\n print('3. Widget disposed');\n _cleanupResources();\n _unregisterEventListeners();\n _saveState();\n },\n child: Container(\n padding: EdgeInsets.all(16),\n child: Text('Chained Lifecycle Management'),\n ),\n );\n }\n\n void _setupInitialState() {\n // Initialize component state\n }\n\n void _registerEventListeners() {\n // Register event listeners\n }\n\n void _loadInitialData() {\n // Load initial data\n }\n\n void _handleDependencyChanges() {\n // Handle dependency changes\n }\n\n void _updateThemeBasedSettings() {\n // Update theme-based settings\n }\n\n void _cleanupResources() {\n // Clean up resources\n }\n\n void _unregisterEventListeners() {\n // Unregister event listeners\n }\n\n void _saveState() {\n // Save current state\n }\n}\n"})}),"\n",(0,r.jsx)(n.h3,{id:"conditional-lifecycle-execution",children:"Conditional Lifecycle Execution"}),"\n",(0,r.jsx)(n.pre,{children:(0,r.jsx)(n.code,{className:"language-dart",children:"class ConditionalLifecycleWidget extends StatelessWidget {\n final bool enableAnalytics;\n final bool enableCaching;\n\n const ConditionalLifecycleWidget({\n Key? key,\n this.enableAnalytics = true,\n this.enableCaching = false,\n }) : super(key: key);\n\n @override\n Widget build(BuildContext context) {\n return StatefullWrapperAppi(\n onInit: () {\n if (enableAnalytics) {\n AnalyticsService.trackEvent('widget_initialized');\n }\n if (enableCaching) {\n CacheService.initializeCache();\n }\n },\n onDispose: () {\n if (enableAnalytics) {\n AnalyticsService.trackEvent('widget_disposed');\n }\n if (enableCaching) {\n CacheService.clearCache();\n }\n },\n child: Container(\n padding: EdgeInsets.all(16),\n child: Text('Conditional Lifecycle Widget'),\n ),\n );\n }\n}\n"})}),"\n",(0,r.jsx)(n.h2,{id:"best-practices",children:"Best Practices"}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Resource Management"}),": Always clean up resources in ",(0,r.jsx)(n.code,{children:"onDispose"})," to prevent memory leaks"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Null Safety"}),": Use null-aware operators when calling optional callbacks"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Performance"}),": Keep lifecycle callbacks lightweight and avoid heavy computations"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Error Handling"}),": Wrap lifecycle callbacks in try-catch blocks for robust error handling"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Async Operations"}),": Use proper async/await patterns in lifecycle callbacks"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"State Management"}),": Don't rely on StatefullWrapperAppi for complex state management"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"common-use-cases",children:"Common Use Cases"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"API Integration"}),": Initialize API calls and clean up subscriptions"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Analytics Tracking"}),": Track screen views and user interactions"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Resource Management"}),": Preload and cache resources"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Event Listeners"}),": Register and unregister event listeners"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Form Management"}),": Setup and cleanup form validation"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Timer Management"}),": Start and stop timers or periodic tasks"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Stream Subscriptions"}),": Manage stream subscriptions lifecycle"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Cache Management"}),": Initialize and clear caches"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Theme Updates"}),": React to theme and locale changes"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.strong,{children:"Performance Monitoring"}),": Track widget performance metrics"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"related-widgets",children:"Related Widgets"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.a,{href:"/docs/widgets/hydrated_appi",children:"HydratedAppi"})," - For state persistence with lifecycle management"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.a,{href:"https://appikorn-widgets.web.app/docs/widgets/core-ui/box-appi",children:"BoxAppi"})," - For container widgets with interactions"]}),"\n",(0,r.jsxs)(n.li,{children:[(0,r.jsx)(n.a,{href:"/docs/widgets/animated_box_appi",children:"AnimatedBoxAppi"})," - For animated containers"]}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"migration-notes",children:"Migration Notes"}),"\n",(0,r.jsx)(n.p,{children:"When migrating from StatefulWidget to StatefullWrapperAppi:"}),"\n",(0,r.jsxs)(n.ol,{children:["\n",(0,r.jsxs)(n.li,{children:["Move ",(0,r.jsx)(n.code,{children:"initState"})," logic to ",(0,r.jsx)(n.code,{children:"onInit"})," callback"]}),"\n",(0,r.jsxs)(n.li,{children:["Move ",(0,r.jsx)(n.code,{children:"dispose"})," logic to ",(0,r.jsx)(n.code,{children:"onDispose"})," callback"]}),"\n",(0,r.jsxs)(n.li,{children:["Move ",(0,r.jsx)(n.code,{children:"didChangeDependencies"})," logic to ",(0,r.jsx)(n.code,{children:"didChangeDependencies"})," callback"]}),"\n",(0,r.jsx)(n.li,{children:"Remove the State class and extend StatelessWidget instead"}),"\n",(0,r.jsx)(n.li,{children:"Wrap your build method's return widget with StatefullWrapperAppi"}),"\n"]}),"\n",(0,r.jsx)(n.h2,{id:"technical-notes",children:"Technical Notes"}),"\n",(0,r.jsxs)(n.ul,{children:["\n",(0,r.jsx)(n.li,{children:"Minimal performance overhead compared to full StatefulWidget"}),"\n",(0,r.jsx)(n.li,{children:"Callbacks are executed in the correct lifecycle order"}),"\n",(0,r.jsx)(n.li,{children:"Null safety ensures optional callbacks don't cause runtime errors"}),"\n",(0,r.jsx)(n.li,{children:"Compatible with all Flutter widgets and frameworks"}),"\n",(0,r.jsx)(n.li,{children:"Works seamlessly with state management solutions like Riverpod, Provider, etc."}),"\n"]}),"\n",(0,r.jsx)(n.p,{children:"Ready to add stateful behavior to your stateless widgets? StatefullWrapperAppi makes it simple and efficie
1nt!"})]})}function h(e={}){const{wrapper:n}={...(0,s.R)(),...e.components};return n?(0,r.jsx)(n,{...e,children:(0,r.jsx)(c,{...e})}):c(e)}},8453:(e,n,i)=>{i.d(n,{R:()=>l,x:()=>a});var t=i(6540);const r={},s=t.createContext(r);function l(e){const n=t.useContext(s);return t.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function a(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:l(e.components),t.createElement(s.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.