premium-react-loaders 2.2.0 → 2.3.0

package/README.md

@@ -350,6 +350,89 @@ import { SpinnerCircle, ProgressBar, PulseDots } from 'premium-react-loaders';
 <PulseDots size="md" reverse />
 ```
 
+### New in v2.3.0
+
+**LoaderTransition** - Smooth transitions between loading and loaded states:
+
+```tsx
+import { LoaderTransition, Skeleton } from 'premium-react-loaders';
+
+// Eliminate jarring content switches
+<LoaderTransition
+  loading={isLoading}
+  loadingContent={<Skeleton width={300} height={100} />}
+  transitionType="fade"
+  duration={300}
+  delay={200}
+  minDuration={600}
+>
+  <YourActualContent />
+</LoaderTransition>
+
+// Different transition types
+<LoaderTransition loading={isLoading} loadingContent={<Spinner />} transitionType="slide-up">
+  <Content />
+</LoaderTransition>
+
+<LoaderTransition loading={isLoading} loadingContent={<Skeleton />} transitionType="scale" timing="spring">
+  <Content />
+</LoaderTransition>
+```
+
+**useEnhancedLoader** - Supercharged loading state management:
+
+```tsx
+import { useEnhancedLoader } from 'premium-react-loaders';
+
+function MyComponent() {
+  const {
+    status,              // 'idle' | 'loading' | 'success' | 'error'
+    error,               // Error object if failed
+    retryAttempt,        // Current retry attempt number
+    history,             // Loading history with timestamps
+    startLoading,
+    stopLoading,
+    setError,
+    retry,
+    reset,
+  } = useEnhancedLoader({
+    delay: 200,
+    minDuration: 600,
+    retry: {
+      maxRetries: 3,
+      initialDelay: 1000,
+      backoffMultiplier: 2,
+    },
+    debounce: 300,       // Debounce loading starts
+    onSuccess: () => console.log('Success!'),
+    onError: (err) => console.error(err),
+  });
+
+  const fetchData = async () => {
+    startLoading();
+    try {
+      const data = await api.fetch();
+      stopLoading();
+    } catch (err) {
+      setError(err);
+    }
+  };
+
+  return (
+    <div>
+      {status === 'loading' && <SpinnerCircle visible={isVisible} />}
+      {status === 'success' && <SuccessCheckmark visible />}
+      {status === 'error' && (
+        <>
+          <ErrorIndicator visible />
+          <button onClick={retry}>Retry ({retryAttempt}/3)</button>
+        </>
+      )}
+    </div>
+  );
+}
+```
+
 ### New in v2.2.0
 
 **Button Loaders** - Specialized spinners for button states:

package/dist/components/index.d.ts

@@ -5,4 +5,5 @@ export * from './pulse';
 export * from './overlay';
 export * from './button';
 export * from './status';
+export * from './transition';
 //# 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"}
+{"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"}

package/dist/components/transition/LoaderTransition.d.ts

@@ -0,0 +1,32 @@
+import { LoaderTransitionProps } from '../../types';
+/**
+ * LoaderTransition - Smooth transitions between loading and loaded states
+ *
+ * Provides seamless transitions between loading content (skeleton, spinner) and actual content,
+ * preventing jarring content switches and improving perceived performance.
+ *
+ * @example
+ * ```tsx
+ * // Fade transition from skeleton to content
+ * <LoaderTransition
+ *   loading={isLoading}
+ *   loadingContent={<Skeleton width="100%" height={200} />}
+ *   transitionType="fade"
+ *   duration={300}
+ * >
+ *   <YourActualContent />
+ * </LoaderTransition>
+ *
+ * // Slide up transition
+ * <LoaderTransition
+ *   loading={isLoading}
+ *   loadingContent={<SpinnerCircle size={48} />}
+ *   transitionType="slide-up"
+ *   timing="spring"
+ * >
+ *   <YourContent />
+ * </LoaderTransition>
+ * ```
+ */
+export declare const LoaderTransition: import('react').ForwardRefExoticComponent<LoaderTransitionProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=LoaderTransition.d.ts.map

package/dist/components/transition/LoaderTransition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoaderTransition.d.ts","sourceRoot":"","sources":["../../../src/components/transition/LoaderTransition.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC;AAGpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,gBAAgB,kHAsL5B,CAAC"}

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

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

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

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

package/dist/hooks/index.d.ts

@@ -1,3 +1,5 @@
 export { useLoader } from './useLoader';
-export type { UseLoaderOptions, UseLoaderReturn } from './useLoader';
+export { useEnhancedLoader } from './useEnhancedLoader';
+export type { UseLoaderOptions as BasicUseLoaderOptions, UseLoaderReturn as BasicUseLoaderReturn } from './useLoader';
+export type { UseLoaderOptions, UseLoaderReturn, LoadingStatus, LoadingHistoryEntry, RetryConfig } from '../types/hooks';
 //# 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,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,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;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"}

package/dist/hooks/useEnhancedLoader.d.ts

@@ -0,0 +1,62 @@
+import { UseLoaderOptions, UseLoaderReturn } from '../types/hooks';
+/**
+ * useEnhancedLoader - Advanced loading state management with retry, success/error states, and history
+ *
+ * An enhanced version of useLoader with additional features:
+ * - Retry logic with exponential backoff
+ * - Success and error state management
+ * - Loading history tracking
+ * - Debounce and throttle support
+ * - Lifecycle callbacks
+ *
+ * @param options - Configuration options
+ * @returns Enhanced loading state and control functions
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const {
+ *     loading,
+ *     status,
+ *     error,
+ *     startLoading,
+ *     stopLoading,
+ *     setError,
+ *     retry,
+ *     history
+ *   } = useEnhancedLoader({
+ *     delay: 200,
+ *     minDuration: 600,
+ *     retry: {
+ *       maxRetries: 3,
+ *       initialDelay: 1000,
+ *       backoffMultiplier: 2,
+ *     },
+ *     successDuration: 2000,
+ *     onSuccess: () => console.log('Success!'),
+ *     onError: (err) => console.error('Error:', err),
+ *   });
+ *
+ *   const fetchData = async () => {
+ *     startLoading();
+ *     try {
+ *       await api.fetchData();
+ *       stopLoading();
+ *     } catch (err) {
+ *       setError(err as Error);
+ *     }
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       {status === 'loading' && <SpinnerCircle visible={true} />}
+ *       {status === 'success' && <SuccessCheckmark visible={true} />}
+ *       {status === 'error' && <ErrorIndicator visible={true} />}
+ *       {error && <button onClick={retry}>Retry</button>}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useEnhancedLoader(options?: UseLoaderOptions): UseLoaderReturn;
+//# sourceMappingURL=useEnhancedLoader.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useEnhancedLoader.d.ts","sourceRoot":"","sources":["../../src/hooks/useEnhancedLoader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAsC,MAAM,gBAAgB,CAAC;AAE5G;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,GAAE,gBAAqB,GAAG,eAAe,CAkUjF"}

package/dist/index.cjs

@@ -33,6 +33,7 @@ const LoaderOverlay = require("./index31.cjs");
 const ButtonSpinner = require("./index32.cjs");
 const SuccessCheckmark = require("./index33.cjs");
 const ErrorIndicator = require("./index34.cjs");
+const LoaderTransition = require("./index35.cjs");
 const version = "2.1.0";
 exports.cn = classNames.cn;
 exports.getAnimationDuration = colors.getAnimationDuration;
@@ -68,4 +69,5 @@ exports.LoaderOverlay = LoaderOverlay.LoaderOverlay;
 exports.ButtonSpinner = ButtonSpinner.ButtonSpinner;
 exports.SuccessCheckmark = SuccessCheckmark.SuccessCheckmark;
 exports.ErrorIndicator = ErrorIndicator.ErrorIndicator;
+exports.LoaderTransition = LoaderTransition.LoaderTransition;
 exports.version = version;

package/dist/index.js

@@ -31,11 +31,13 @@ import { LoaderOverlay } from "./index31.js";
 import { ButtonSpinner } from "./index32.js";
 import { SuccessCheckmark } from "./index33.js";
 import { ErrorIndicator } from "./index34.js";
+import { LoaderTransition } from "./index35.js";
 const version = "2.1.0";
 export {
   ButtonSpinner,
   ErrorIndicator,
   LoaderOverlay,
+  LoaderTransition,
   ProgressBar,
   ProgressCircle,
   ProgressRing,

package/dist/index10.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const Skeleton = require("./index7.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const SkeletonImage = react.forwardRef(
   ({
     width = "100%",

package/dist/index10.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 const SkeletonImage = forwardRef(
   ({
     width = "100%",

package/dist/index11.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const Skeleton = require("./index7.cjs");
 const SkeletonAvatar = require("./index9.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const SkeletonCard = react.forwardRef(
   ({

package/dist/index11.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
 import { SkeletonAvatar } from "./index9.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { cn } from "./index3.js";
 const SkeletonCard = forwardRef(
   ({

package/dist/index12.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const Skeleton = require("./index7.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const SkeletonList = react.forwardRef(

package/dist/index12.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { normalizeSize } from "./index4.js";
 import { cn } from "./index3.js";
 const SkeletonList = forwardRef(

package/dist/index13.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const Skeleton = require("./index7.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const SkeletonTable = react.forwardRef(
   ({

package/dist/index13.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { cn } from "./index3.js";
 const SkeletonTable = forwardRef(
   ({

package/dist/index14.cjs

@@ -5,7 +5,7 @@ const react = require("react");
 const Skeleton = require("./index7.cjs");
 const SkeletonText = require("./index8.cjs");
 const SkeletonAvatar = require("./index9.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const SkeletonPage = react.forwardRef(
   ({

package/dist/index14.js

@@ -3,7 +3,7 @@ import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
 import { SkeletonText } from "./index8.js";
 import { SkeletonAvatar } from "./index9.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { cn } from "./index3.js";
 const SkeletonPage = forwardRef(
   ({

package/dist/index15.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const Skeleton = require("./index7.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const SkeletonForm = react.forwardRef(

package/dist/index15.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Skeleton } from "./index7.js";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { normalizeSize } from "./index4.js";
 import { cn } from "./index3.js";
 const SkeletonForm = forwardRef(

package/dist/index16.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const colors = require("./index4.cjs");
 const SpinnerCircle = react.forwardRef(

package/dist/index16.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 import { normalizeSize } from "./index4.js";
 const SpinnerCircle = forwardRef(

package/dist/index17.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const colors = require("./index4.cjs");
 const SpinnerRing = react.forwardRef(

package/dist/index17.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 import { normalizeSize } from "./index4.js";
 const SpinnerRing = forwardRef(

package/dist/index18.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const colors = require("./index4.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const SpinnerDots = react.forwardRef(
   ({

package/dist/index18.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 const SpinnerDots = forwardRef(
   ({

package/dist/index19.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const SpinnerBars = react.forwardRef(

package/dist/index19.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
 import { cn } from "./index3.js";
 const SpinnerBars = forwardRef(

package/dist/index20.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const colors = require("./index4.cjs");
 const SpinnerGrid = react.forwardRef(

package/dist/index20.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
 const SpinnerGrid = forwardRef(

package/dist/index21.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const colors = require("./index4.cjs");
 const SpinnerWave = react.forwardRef(

package/dist/index21.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 import { normalizeSize } from "./index4.js";
 const SpinnerWave = forwardRef(

package/dist/index22.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const colors = require("./index4.cjs");
 const SpinnerPulse = react.forwardRef(

package/dist/index22.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 import { normalizeSize } from "./index4.js";
 const SpinnerPulse = forwardRef(

package/dist/index23.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
 const colors = require("./index4.cjs");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const ProgressBar = react.forwardRef(
   ({

package/dist/index23.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useMemo } from "react";
 import { normalizeSize, getContrastColor } from "./index4.js";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { cn } from "./index3.js";
 const ProgressBar = forwardRef(
   ({

package/dist/index24.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const ProgressCircle = react.forwardRef(

package/dist/index24.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
 import { cn } from "./index3.js";
 const ProgressCircle = forwardRef(

package/dist/index25.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const ProgressRing = react.forwardRef(

package/dist/index25.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useMemo } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
 import { cn } from "./index3.js";
 const ProgressRing = forwardRef(

package/dist/index26.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const classNames = require("./index3.cjs");
 const ProgressSteps = react.forwardRef(
   ({

package/dist/index26.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, Fragment } from "react";
-import { useLoaderVisibility } from "./index35.js";
+import { useLoaderVisibility } from "./index36.js";
 import { cn } from "./index3.js";
 const ProgressSteps = forwardRef(
   ({

package/dist/index27.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const PulseDots = react.forwardRef(

package/dist/index27.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { normalizeSize } from "./index4.js";
 import { cn } from "./index3.js";
 const PulseDots = forwardRef(

package/dist/index28.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const hooks = require("./index35.cjs");
+const hooks = require("./index36.cjs");
 const colors = require("./index4.cjs");
 const classNames = require("./index3.cjs");
 const PulseWave = react.forwardRef(

package/dist/index28.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index35.js";
+import { useReducedMotion, useLoaderVisibility, getEffectiveDuration } from "./index36.js";
 import { normalizeSize, parseSizeToNumber } from "./index4.js";
 import { cn } from "./index3.js";
 const PulseWave = forwardRef(