premium-react-loaders 3.0.0 → 3.1.0

package/README.md

@@ -1,6 +1,6 @@
 # Premium React Loaders
 
-A comprehensive collection of **40 premium, production-ready loading components** for React applications. Built with TypeScript and custom CSS for maximum flexibility and zero configuration.
+A comprehensive collection of **50+ premium, production-ready loading components** for React applications. Built with TypeScript and custom CSS for maximum flexibility and zero configuration.
 
 [![npm version](https://img.shields.io/npm/v/premium-react-loaders.svg)](https://www.npmjs.com/package/premium-react-loaders)
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
@@ -11,11 +11,15 @@ A comprehensive collection of **40 premium, production-ready loading components*
 
 📚 **[Storybook Documentation](https://docs.premium-react-loaders.ishansasika.dev/)** - Detailed component documentation and examples
 
-See all 40 components in action with interactive examples and customization options.
+See all 50+ components in action with interactive examples and customization options.
 
 ## Features
 
-- **40 Premium Components** across 13 categories (Skeleton, Spinner, Progress, Pulse, Overlay, Button, Status, Transition, Shimmer, Orbit, Bounce, Infinity, Text)
+- **50+ Premium Components** across 15 categories (Skeleton, Spinner, Progress, Pulse, Overlay, Button, Status, Transition, Shimmer, Orbit, Bounce, Infinity, Text, 3D, Smart)
+- **6 Powerful Hooks** - useLoader, useEnhancedLoader, useLoadingOrchestrator, useLoadingAnalytics, useSmartLoader, useTheme ✨ *New in v3.1.0*
+- **3D Loaders** - Immersive 3D animations with CSS transforms ✨ *New in v3.1.0*
+- **Smart Components** - Context-aware skeletons and form field loaders ✨ *New in v3.1.0*
+- **Accessibility First** - LiveRegion component and announcement system ✨ *New in v3.1.0*
 - **Global Theming** - ThemeProvider for app-wide customization ✨ *New in v2.1.0*
 - **Smart Loading UX** - useLoader hook with delay, minDuration, and autoHide ✨ *New in v2.1.0*
 - **Enhanced CSS Variables** - Comprehensive theming with dark mode support ✨ *New in v2.1.0*
@@ -220,6 +224,44 @@ Animated loading text:
 
 - **LoadingText** - Animated loading text with multiple animation styles (dots, fade, bounce, wave)
 
+### 3D Components (5 components) ✨ *New in v3.1.0*
+
+Immersive 3D loaders with perspective transforms:
+
+- **CubeSpinner** - Rotating 3D cube with customizable faces and rotation axes (x, y, z, diagonal)
+- **FlipCard** - 3D card flip animation with horizontal/vertical modes
+- **PlaneRotate** - Multiple rotating planes in 3D space with synchronized/staggered modes
+- **Helix** - DNA-like spiral animation with particles and optional connecting lines
+- **PerspectiveRing** - 3D ring with tilt angle, shadow effects, and depth perception
+
+### Smart Components (3 components) ✨ *New in v3.1.0*
+
+Intelligent, context-aware loading placeholders:
+
+- **SmartSkeleton** - Auto-detecting skeleton that analyzes content type (text, image, card, list, table, form)
+- **FormFieldLoader** - Loading states for form inputs (text, select, checkbox, radio, textarea, file)
+- **DataTableSkeleton** - Advanced table skeleton with headers, sorting, filtering, pagination, and selection
+
+### Accessibility Components (1 component) ✨ *New in v3.1.0*
+
+Screen reader support and ARIA announcements:
+
+- **LiveRegion** - ARIA live region for screen reader announcements with configurable politeness levels
+
+## Hooks
+
+### Loading State Management
+
+- **useLoader** - Basic loading state with delay, minDuration, and autoHide *(v2.1.0+)*
+- **useEnhancedLoader** - Advanced loading with retry logic, success/error states, and history *(v2.3.0+)*
+- **useLoadingOrchestrator** - Manage multiple loading tasks with dependencies ✨ *New in v3.1.0*
+- **useLoadingAnalytics** - Track loading performance metrics and user experience ✨ *New in v3.1.0*
+- **useSmartLoader** - Intelligent loader with connection detection and progress estimation ✨ *New in v3.1.0*
+
+### Theming
+
+- **useTheme** - Access global theme configuration *(v2.1.0+)*
+
 ## Usage Examples
 
 ### Skeleton Components

package/dist/components/3d/CubeSpinner.d.ts

@@ -0,0 +1,21 @@
+import { CubeSpinnerProps } from '../../types';
+/**
+ * CubeSpinner - 3D rotating cube loader with perspective
+ *
+ * A visually striking 3D cube that rotates in space with customizable face colors,
+ * rotation axis, and optional wireframe edges.
+ *
+ * @example
+ * ```tsx
+ * <CubeSpinner size={60} />
+ * <CubeSpinner size="lg" rotationAxis="diagonal" />
+ * <CubeSpinner
+ *   size={80}
+ *   faceColors={['#ef4444', '#f59e0b', '#10b981', '#3b82f6', '#8b5cf6', '#ec4899']}
+ *   showEdges
+ *   edgeColor="#000000"
+ * />
+ * ```
+ */
+export declare const CubeSpinner: import('react').ForwardRefExoticComponent<CubeSpinnerProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CubeSpinner.d.ts.map

package/dist/components/3d/CubeSpinner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CubeSpinner.d.ts","sourceRoot":"","sources":["../../../src/components/3d/CubeSpinner.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAS/C;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,WAAW,6GA0JvB,CAAC"}

package/dist/components/3d/FlipCard.d.ts

@@ -0,0 +1,21 @@
+import { FlipCardProps } from '../../types';
+/**
+ * FlipCard - 3D card flip loader
+ *
+ * A card that flips between front and back faces in 3D space,
+ * with customizable colors and flip direction.
+ *
+ * @example
+ * ```tsx
+ * <FlipCard width={100} height={60} />
+ * <FlipCard
+ *   width={120}
+ *   height={80}
+ *   direction="vertical"
+ *   frontColor="#3b82f6"
+ *   backColor="#8b5cf6"
+ * />
+ * ```
+ */
+export declare const FlipCard: import('react').ForwardRefExoticComponent<FlipCardProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=FlipCard.d.ts.map

package/dist/components/3d/FlipCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlipCard.d.ts","sourceRoot":"","sources":["../../../src/components/3d/FlipCard.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAS5C;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,QAAQ,0GAsGpB,CAAC"}

package/dist/components/3d/Helix.d.ts

@@ -0,0 +1,23 @@
+import { HelixProps } from '../../types';
+/**
+ * Helix - DNA-like spiral loader with 3D depth
+ *
+ * Creates a mesmerizing helix/spiral animation with particles rotating
+ * in a 3D spiral pattern, reminiscent of DNA structure.
+ *
+ * @example
+ * ```tsx
+ * <Helix size={80} />
+ * <Helix
+ *   size={100}
+ *   particleCount={16}
+ *   radius={30}
+ *   height={120}
+ *   turns={2}
+ *   direction="down"
+ *   showLines
+ * />
+ * ```
+ */
+export declare const Helix: import('react').ForwardRefExoticComponent<HelixProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Helix.d.ts.map

package/dist/components/3d/Helix.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Helix.d.ts","sourceRoot":"","sources":["../../../src/components/3d/Helix.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAUzC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,KAAK,uGA4IjB,CAAC"}

package/dist/components/3d/PerspectiveRing.d.ts

@@ -0,0 +1,21 @@
+import { PerspectiveRingProps } from '../../types';
+/**
+ * PerspectiveRing - 3D ring with perspective and shadow
+ *
+ * A ring that appears to rotate in 3D space with adjustable tilt,
+ * creating depth perception with optional shadow effects.
+ *
+ * @example
+ * ```tsx
+ * <PerspectiveRing size={80} />
+ * <PerspectiveRing
+ *   size={100}
+ *   tilt={60}
+ *   thickness={8}
+ *   showShadow
+ *   segments={12}
+ * />
+ * ```
+ */
+export declare const PerspectiveRing: import('react').ForwardRefExoticComponent<PerspectiveRingProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=PerspectiveRing.d.ts.map

package/dist/components/3d/PerspectiveRing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PerspectiveRing.d.ts","sourceRoot":"","sources":["../../../src/components/3d/PerspectiveRing.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AASnD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,eAAe,iHA6G3B,CAAC"}

package/dist/components/3d/PlaneRotate.d.ts

@@ -0,0 +1,21 @@
+import { PlaneRotateProps } from '../../types';
+/**
+ * PlaneRotate - Multiple rotating planes in 3D space
+ *
+ * Creates a mesmerizing effect with multiple semi-transparent planes
+ * rotating in 3D space with different timing patterns.
+ *
+ * @example
+ * ```tsx
+ * <PlaneRotate size={60} />
+ * <PlaneRotate
+ *   size={80}
+ *   planeCount={4}
+ *   rotationType="staggered"
+ *   spacing={8}
+ *   opacity={0.7}
+ * />
+ * ```
+ */
+export declare const PlaneRotate: import('react').ForwardRefExoticComponent<PlaneRotateProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=PlaneRotate.d.ts.map

package/dist/components/3d/PlaneRotate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlaneRotate.d.ts","sourceRoot":"","sources":["../../../src/components/3d/PlaneRotate.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAS/C;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,WAAW,6GAkHvB,CAAC"}

package/dist/components/3d/index.d.ts

@@ -0,0 +1,6 @@
+export { CubeSpinner } from './CubeSpinner';
+export { FlipCard } from './FlipCard';
+export { PlaneRotate } from './PlaneRotate';
+export { Helix } from './Helix';
+export { PerspectiveRing } from './PerspectiveRing';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/3d/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/3d/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/accessibility/LiveRegion.d.ts

@@ -0,0 +1,34 @@
+import { LiveRegionProps } from '../../types';
+/**
+ * LiveRegion - Accessible announcements for screen readers
+ *
+ * An ARIA live region that announces messages to screen readers without
+ * disrupting the visual interface. Useful for loading state updates,
+ * progress announcements, and status changes.
+ *
+ * @example
+ * ```tsx
+ * // Polite announcement (waits for user to finish current task)
+ * <LiveRegion
+ *   message="Loading data..."
+ *   politeness="polite"
+ *   clearAfter={3000}
+ * />
+ *
+ * // Assertive announcement (interrupts immediately)
+ * <LiveRegion
+ *   message="Error: Failed to load data"
+ *   politeness="assertive"
+ *   atomic
+ * />
+ *
+ * // Progress updates
+ * <LiveRegion
+ *   message={`Loading ${progress}% complete`}
+ *   politeness="polite"
+ *   clearAfter={1000}
+ * />
+ * ```
+ */
+export declare const LiveRegion: import('react').ForwardRefExoticComponent<LiveRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=LiveRegion.d.ts.map

package/dist/components/accessibility/LiveRegion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LiveRegion.d.ts","sourceRoot":"","sources":["../../../src/components/accessibility/LiveRegion.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAG9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,UAAU,4GAwDtB,CAAC"}

package/dist/components/accessibility/index.d.ts

@@ -0,0 +1,2 @@
+export { LiveRegion } from './LiveRegion';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/accessibility/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/accessibility/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/index.d.ts

@@ -11,4 +11,7 @@ export * from './orbit';
 export * from './bounce';
 export * from './infinity';
 export * from './text';
+export * from './3d';
+export * from './smart';
+export * from './accessibility';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,YAAY,CAAC;AAG3B,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,SAAS,CAAC;AAGxB,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,cAAc,CAAC;AAG7B,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,YAAY,CAAC;AAG3B,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,SAAS,CAAC;AAGxB,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,cAAc,CAAC;AAG7B,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC;AAGvB,cAAc,MAAM,CAAC;AAGrB,cAAc,SAAS,CAAC;AAGxB,cAAc,iBAAiB,CAAC"}

package/dist/components/skeleton/DataTableSkeleton.d.ts

@@ -0,0 +1,25 @@
+import { DataTableSkeletonProps } from '../../types';
+/**
+ * DataTableSkeleton - Advanced table skeleton with features
+ *
+ * Comprehensive table loading placeholder with support for headers, sorting,
+ * filtering, pagination, row selection, and action columns.
+ *
+ * @example
+ * ```tsx
+ * <DataTableSkeleton rows={5} columns={4} />
+ * <DataTableSkeleton
+ *   rows={10}
+ *   columns={6}
+ *   showHeader
+ *   showSortIndicators
+ *   showFilters
+ *   showPagination
+ *   showSelection
+ *   showActions
+ *   striped
+ * />
+ * ```
+ */
+export declare const DataTableSkeleton: import('react').ForwardRefExoticComponent<DataTableSkeletonProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=DataTableSkeleton.d.ts.map

package/dist/components/skeleton/DataTableSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/DataTableSkeleton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAIrD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,iBAAiB,mHA4R7B,CAAC"}

package/dist/components/skeleton/SmartSkeleton.d.ts

@@ -0,0 +1,23 @@
+import { SmartSkeletonProps } from '../../types';
+/**
+ * SmartSkeleton - Intelligent skeleton with auto-detection
+ *
+ * Automatically detects content layout and generates appropriate skeleton variant,
+ * or uses explicit content type for predictable rendering.
+ *
+ * @example
+ * ```tsx
+ * // Explicit content type
+ * <SmartSkeleton contentType="card" />
+ * <SmartSkeleton contentType="table" itemCount={5} />
+ *
+ * // Auto-detection from reference element
+ * <SmartSkeleton
+ *   contentType="auto"
+ *   referenceElement={containerRef.current}
+ *   detectionStrategy="mixed"
+ * />
+ * ```
+ */
+export declare const SmartSkeleton: import('react').ForwardRefExoticComponent<SmartSkeletonProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=SmartSkeleton.d.ts.map

package/dist/components/skeleton/SmartSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SmartSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/SmartSkeleton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAQjD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,aAAa,+GAkKzB,CAAC"}

package/dist/components/skeleton/index.d.ts

@@ -7,4 +7,6 @@ export { SkeletonList } from './SkeletonList';
 export { SkeletonTable } from './SkeletonTable';
 export { SkeletonPage } from './SkeletonPage';
 export { SkeletonForm } from './SkeletonForm';
+export { SmartSkeleton } from './SmartSkeleton';
+export { DataTableSkeleton } from './DataTableSkeleton';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/skeleton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/skeleton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/smart/FormFieldLoader.d.ts

@@ -0,0 +1,22 @@
+import { FormFieldLoaderProps } from '../../types';
+/**
+ * FormFieldLoader - Loading state for form inputs
+ *
+ * Specialized loader for form fields that maintains layout during loading,
+ * with support for various input types, labels, and validation messages.
+ *
+ * @example
+ * ```tsx
+ * <FormFieldLoader fieldType="text" showLabel showRequired />
+ * <FormFieldLoader
+ *   fieldType="select"
+ *   labelWidth={120}
+ *   fieldWidth="100%"
+ *   showLabel
+ *   showValidation
+ * />
+ * <FormFieldLoader fieldType="textarea" fieldHeight={120} />
+ * ```
+ */
+export declare const FormFieldLoader: import('react').ForwardRefExoticComponent<FormFieldLoaderProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=FormFieldLoader.d.ts.map

package/dist/components/smart/FormFieldLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldLoader.d.ts","sourceRoot":"","sources":["../../../src/components/smart/FormFieldLoader.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAInD;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,eAAe,iHAyK3B,CAAC"}

package/dist/components/smart/index.d.ts

@@ -0,0 +1,2 @@
+export { FormFieldLoader } from './FormFieldLoader';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/smart/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/smart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/hooks/index.d.ts

@@ -1,5 +1,11 @@
 export { useLoader } from './useLoader';
 export { useEnhancedLoader } from './useEnhancedLoader';
+export { useLoadingOrchestrator } from './useLoadingOrchestrator';
+export { useLoadingAnalytics } from './useLoadingAnalytics';
+export { useSmartLoader } from './useSmartLoader';
 export type { UseLoaderOptions as BasicUseLoaderOptions, UseLoaderReturn as BasicUseLoaderReturn } from './useLoader';
 export type { UseLoaderOptions, UseLoaderReturn, LoadingStatus, LoadingHistoryEntry, RetryConfig } from '../types/hooks';
+export type { LoadingTask, LoadingTaskStatus, OrchestratorOptions, UseLoadingOrchestratorReturn, } from './useLoadingOrchestrator';
+export type { LoadingSession, LoadingMetrics, AnalyticsOptions, UseLoadingAnalyticsReturn, } from './useLoadingAnalytics';
+export type { ConnectionSpeed, SmartLoaderOptions, UseSmartLoaderReturn, } from './useSmartLoader';
 //# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,YAAY,EAAE,gBAAgB,IAAI,qBAAqB,EAAE,eAAe,IAAI,oBAAoB,EAAE,MAAM,aAAa,CAAC;AACtH,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,aAAa,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,YAAY,EAAE,gBAAgB,IAAI,qBAAqB,EAAE,eAAe,IAAI,oBAAoB,EAAE,MAAM,aAAa,CAAC;AACtH,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,aAAa,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AACzH,YAAY,EACV,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,4BAA4B,GAC7B,MAAM,0BAA0B,CAAC;AAClC,YAAY,EACV,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,yBAAyB,GAC1B,MAAM,uBAAuB,CAAC;AAC/B,YAAY,EACV,eAAe,EACf,kBAAkB,EAClB,oBAAoB,GACrB,MAAM,kBAAkB,CAAC"}

package/dist/hooks/useLoadingAnalytics.d.ts

@@ -0,0 +1,101 @@
+export interface LoadingSession {
+    /** Session start timestamp */
+    startTime: number;
+    /** Session end timestamp */
+    endTime?: number;
+    /** Duration in milliseconds */
+    duration?: number;
+    /** Whether the loading was successful */
+    success?: boolean;
+    /** Whether the user abandoned (navigated away) */
+    abandoned?: boolean;
+}
+export interface LoadingMetrics {
+    /** Total number of loading sessions */
+    totalSessions: number;
+    /** Average loading duration in milliseconds */
+    averageDuration: number;
+    /** Longest loading time in milliseconds */
+    maxDuration: number;
+    /** Shortest loading time in milliseconds */
+    minDuration: number;
+    /** Success rate (0-1) */
+    successRate: number;
+    /** User abandonment rate (0-1) */
+    abandonmentRate: number;
+    /** All sessions data */
+    sessions: LoadingSession[];
+}
+export interface AnalyticsOptions {
+    /** Track user interactions during loading */
+    trackInteractions?: boolean;
+    /** Callback when metrics are updated */
+    onMetricsUpdate?: (metrics: LoadingMetrics) => void;
+    /** Local storage key for persisting metrics */
+    storageKey?: string;
+    /** Maximum number of sessions to store */
+    maxSessions?: number;
+}
+export interface UseLoadingAnalyticsReturn {
+    /** Current metrics */
+    metrics: LoadingMetrics;
+    /** Start tracking a loading session */
+    startTracking: () => void;
+    /** Stop tracking and mark as success or failure */
+    stopTracking: (success: boolean) => void;
+    /** Record user abandonment */
+    recordAbandonment: () => void;
+    /** Clear all metrics */
+    clearMetrics: () => void;
+    /** Export metrics as JSON */
+    exportMetrics: () => LoadingMetrics;
+    /** Whether currently tracking */
+    isTracking: boolean;
+}
+/**
+ * useLoadingAnalytics - Track loading performance and user experience
+ *
+ * Monitors loading sessions, calculates performance metrics, and tracks user behavior
+ * like abandonment. Useful for optimizing loading UX and identifying bottlenecks.
+ *
+ * @param options - Configuration options
+ * @returns Metrics and tracking control functions
+ *
+ * @example
+ * ```tsx
+ * function AnalyticsDemo() {
+ *   const {
+ *     metrics,
+ *     startTracking,
+ *     stopTracking,
+ *     isTracking,
+ *   } = useLoadingAnalytics({
+ *     storageKey: 'my-app-loading-metrics',
+ *     onMetricsUpdate: (metrics) => {
+ *       console.log('Average load time:', metrics.averageDuration, 'ms');
+ *       console.log('Success rate:', (metrics.successRate * 100).toFixed(1), '%');
+ *     },
+ *   });
+ *
+ *   const loadData = async () => {
+ *     startTracking();
+ *     try {
+ *       await fetchData();
+ *       stopTracking(true);
+ *     } catch (error) {
+ *       stopTracking(false);
+ *     }
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <p>Total sessions: {metrics.totalSessions}</p>
+ *       <p>Avg duration: {metrics.averageDuration.toFixed(0)}ms</p>
+ *       <p>Success rate: {(metrics.successRate * 100).toFixed(1)}%</p>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useLoadingAnalytics(options?: AnalyticsOptions): UseLoadingAnalyticsReturn;
+//# sourceMappingURL=useLoadingAnalytics.d.ts.map

package/dist/hooks/useLoadingAnalytics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoadingAnalytics.d.ts","sourceRoot":"","sources":["../../src/hooks/useLoadingAnalytics.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,cAAc;IAC7B,8BAA8B;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B,uCAAuC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,eAAe,EAAE,MAAM,CAAC;IACxB,2CAA2C;IAC3C,WAAW,EAAE,MAAM,CAAC;IACpB,4CAA4C;IAC5C,WAAW,EAAE,MAAM,CAAC;IACpB,yBAAyB;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,kCAAkC;IAClC,eAAe,EAAE,MAAM,CAAC;IACxB,wBAAwB;IACxB,QAAQ,EAAE,cAAc,EAAE,CAAC;CAC5B;AAED,MAAM,WAAW,gBAAgB;IAC/B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,wCAAwC;IACxC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,KAAK,IAAI,CAAC;IACpD,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0CAA0C;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,yBAAyB;IACxC,sBAAsB;IACtB,OAAO,EAAE,cAAc,CAAC;IACxB,uCAAuC;IACvC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,mDAAmD;IACnD,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,8BAA8B;IAC9B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,wBAAwB;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,6BAA6B;IAC7B,aAAa,EAAE,MAAM,cAAc,CAAC;IACpC,iCAAiC;IACjC,UAAU,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,GAAE,gBAAqB,GAC7B,yBAAyB,CA0L3B"}

package/dist/hooks/useLoadingOrchestrator.d.ts

@@ -0,0 +1,104 @@
+export type LoadingTaskStatus = 'pending' | 'loading' | 'success' | 'error';
+export interface LoadingTask {
+    /** Unique identifier for the task */
+    id: string;
+    /** Human-readable label */
+    label: string;
+    /** Current status */
+    status: LoadingTaskStatus;
+    /** Task dependencies (IDs of tasks that must complete first) */
+    dependsOn?: string[];
+    /** Progress percentage (0-100) */
+    progress?: number;
+    /** Error object if task failed */
+    error?: Error;
+}
+export interface OrchestratorOptions {
+    /** Execution mode: parallel or sequential */
+    mode?: 'parallel' | 'sequential';
+    /** Stop all tasks on first error */
+    stopOnError?: boolean;
+    /** Callback when a task starts */
+    onTaskStart?: (taskId: string) => void;
+    /** Callback when a task completes successfully */
+    onTaskComplete?: (taskId: string) => void;
+    /** Callback when a task fails */
+    onTaskError?: (taskId: string, error: Error) => void;
+    /** Callback when all tasks complete */
+    onAllComplete?: () => void;
+}
+export interface UseLoadingOrchestratorReturn {
+    /** Current state of all tasks */
+    tasks: LoadingTask[];
+    /** Start a specific task */
+    startTask: (taskId: string) => Promise<void>;
+    /** Mark a task as complete */
+    completeTask: (taskId: string) => void;
+    /** Mark a task as failed */
+    failTask: (taskId: string, error: Error) => void;
+    /** Update progress for a task */
+    updateProgress: (taskId: string, progress: number) => void;
+    /** Reset all tasks to pending */
+    resetTasks: () => void;
+    /** Overall progress (0-100) */
+    overallProgress: number;
+    /** Whether all tasks are complete */
+    allComplete: boolean;
+    /** Whether any task has errors */
+    hasErrors: boolean;
+}
+/**
+ * useLoadingOrchestrator - Manage multiple loading states with dependencies
+ *
+ * Coordinates multiple loading tasks with dependency management, progress tracking,
+ * and execution control (parallel or sequential).
+ *
+ * @param initialTasks - Array of loading tasks
+ * @param options - Configuration options
+ * @returns Task state and control functions
+ *
+ * @example
+ * ```tsx
+ * function DataLoader() {
+ *   const {
+ *     tasks,
+ *     startTask,
+ *     completeTask,
+ *     failTask,
+ *     updateProgress,
+ *     overallProgress,
+ *   } = useLoadingOrchestrator(
+ *     [
+ *       { id: 'auth', label: 'Authenticating...', status: 'pending' },
+ *       { id: 'data', label: 'Fetching data...', status: 'pending', dependsOn: ['auth'] },
+ *       { id: 'render', label: 'Rendering...', status: 'pending', dependsOn: ['data'] },
+ *     ],
+ *     {
+ *       mode: 'sequential',
+ *       onAllComplete: () => console.log('All done!'),
+ *     }
+ *   );
+ *
+ *   const loadAll = async () => {
+ *     await startTask('auth');
+ *     // ... perform auth
+ *     completeTask('auth');
+ *
+ *     await startTask('data');
+ *     // ... fetch data
+ *     completeTask('data');
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <ProgressBar value={overallProgress} />
+ *       {tasks.map(task => (
+ *         <div key={task.id}>{task.label}: {task.status}</div>
+ *       ))}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useLoadingOrchestrator(initialTasks: LoadingTask[], options?: OrchestratorOptions): UseLoadingOrchestratorReturn;
+//# sourceMappingURL=useLoadingOrchestrator.d.ts.map

package/dist/hooks/useLoadingOrchestrator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoadingOrchestrator.d.ts","sourceRoot":"","sources":["../../src/hooks/useLoadingOrchestrator.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE5E,MAAM,WAAW,WAAW;IAC1B,qCAAqC;IACrC,EAAE,EAAE,MAAM,CAAC;IACX,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kCAAkC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,MAAM,WAAW,mBAAmB;IAClC,6CAA6C;IAC7C,IAAI,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACjC,oCAAoC;IACpC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kCAAkC;IAClC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kDAAkD;IAClD,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,iCAAiC;IACjC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACrD,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,4BAA4B;IAC3C,iCAAiC;IACjC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,4BAA4B;IAC5B,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7C,8BAA8B;IAC9B,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,4BAA4B;IAC5B,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjD,iCAAiC;IACjC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,iCAAiC;IACjC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,+BAA+B;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,qCAAqC;IACrC,WAAW,EAAE,OAAO,CAAC;IACrB,kCAAkC;IAClC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,wBAAgB,sBAAsB,CACpC,YAAY,EAAE,WAAW,EAAE,EAC3B,OAAO,GAAE,mBAAwB,GAChC,4BAA4B,CA0J9B"}