@greatapps/common 1.1.380 → 1.1.381

package/src/components/widgets/notifications/NotificationCard.tsx

@@ -1,68 +1,68 @@
-import { IconClock } from '@tabler/icons-react';
-import { ReactNode } from 'react';
-import { cn } from '../../../infra/utils/clsx';
-
-type NotificationCardProps = {
-  icon: ReactNode;
-  iconBgColor?: string;
-  title: string;
-  description?: string;
-  time: string;
-  actions?: ReactNode;
-  isUnread?: boolean;
-  showBorder?: boolean;
-  className?: string;
-  gapPx: number;
-};
-
-export default function NotificationCard({
-  icon,
-  iconBgColor,
-  title,
-  description,
-  time,
-  actions,
-  isUnread = false,
-  showBorder = true,
-  className,
-  gapPx = 16
-}: NotificationCardProps) {
-  return (
-    <div
-      className={cn(
-        'flex flex-col lg:flex-row items-start p-4 lg:p-5 gap-3 lg:gap-4 relative',
-        showBorder && 'border-b border-gray-200',
-        className
-      )}
-    >
-      <div
-        className={cn(
-          'flex items-center justify-center size-10 rounded-full shrink-0',
-          iconBgColor
-        )}
-      >
-        {icon}
-      </div>
-
-      <div className="flex flex-col flex-1" style={{ gap: `${gapPx}px` }}>
-        <div className="flex flex-col gap-1">
-          <span className="paragraph-small-semibold text-gray-950">{title}</span>
-          {description && (
-            <span className="paragraph-small-regular text-gray-600">{description}</span>
-          )}
-        </div>
-
-        <div className="flex items-center gap-1.5">
-          <IconClock size={14} className="text-gray-400" />
-          <span className="paragraph-xsmall-medium text-gray-600">{time}</span>
-        </div>
-
-        {actions && <div className="flex items-center gap-2">{actions}</div>}
-      </div>
-
-      {isUnread && <div className="size-2 bg-cyan-400 rounded-full shrink-0 mt-1" />}
-    </div>
-  );
-}
-
-export type { NotificationCardProps };
+import { IconClock } from '@tabler/icons-react';
+import { ReactNode } from 'react';
+import { cn } from '../../../infra/utils/clsx';
+
+type NotificationCardProps = {
+  icon: ReactNode;
+  iconBgColor?: string;
+  title: string;
+  description?: string;
+  time: string;
+  actions?: ReactNode;
+  isUnread?: boolean;
+  showBorder?: boolean;
+  className?: string;
+  gapPx: number;
+};
+
+export default function NotificationCard({
+  icon,
+  iconBgColor,
+  title,
+  description,
+  time,
+  actions,
+  isUnread = false,
+  showBorder = true,
+  className,
+  gapPx = 16
+}: NotificationCardProps) {
+  return (
+    <div
+      className={cn(
+        'flex flex-col lg:flex-row items-start p-4 lg:p-5 gap-3 lg:gap-4 relative',
+        showBorder && 'border-b border-gray-200',
+        className
+      )}
+    >
+      <div
+        className={cn(
+          'flex items-center justify-center size-10 rounded-full shrink-0',
+          iconBgColor
+        )}
+      >
+        {icon}
+      </div>
+
+      <div className="flex flex-col flex-1" style={{ gap: `${gapPx}px` }}>
+        <div className="flex flex-col gap-1">
+          <span className="paragraph-small-semibold text-gray-950">{title}</span>
+          {description && (
+            <span className="paragraph-small-regular text-gray-600">{description}</span>
+          )}
+        </div>
+
+        <div className="flex items-center gap-1.5">
+          <IconClock size={14} className="text-gray-400" />
+          <span className="paragraph-xsmall-medium text-gray-600">{time}</span>
+        </div>
+
+        {actions && <div className="flex items-center gap-2">{actions}</div>}
+      </div>
+
+      {isUnread && <div className="size-2 bg-cyan-400 rounded-full shrink-0 mt-1" />}
+    </div>
+  );
+}
+
+export type { NotificationCardProps };

package/src/hooks/copy-to-clipboard.hook.tsx

@@ -1,67 +1,67 @@
-'use client';
-
-import { useState, useCallback, useRef, useEffect } from "react";
-
-interface UseCopyToClipboardOptions {
-  feedbackDuration?: number;
-  onSuccess?: () => void;
-  onError?: (error: Error) => void;
-}
-
-interface UseCopyToClipboardReturn {
-  isCopied: boolean;
-  copy: (text: string) => Promise<void>;
-}
-
-export default function useCopyToClipboard({
-  feedbackDuration = 2000,
-  onSuccess,
-  onError,
-}: UseCopyToClipboardOptions = {}): UseCopyToClipboardReturn {
-  const [isCopied, setIsCopied] = useState(false);
-  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
-
-  useEffect(() => {
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, []);
-
-  const copy = useCallback(
-    async (text: string) => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-
-      try {
-        if (navigator.clipboard?.writeText) {
-          await navigator.clipboard.writeText(text);
-        } else {
-          const textarea = document.createElement("textarea");
-          textarea.value = text;
-          textarea.style.cssText = "position:fixed;top:-9999px;left:-9999px;opacity:0";
-          document.body.appendChild(textarea);
-          textarea.focus();
-          textarea.select();
-          const success = document.execCommand("copy");
-          document.body.removeChild(textarea);
-          if (!success) throw new Error("execCommand copy failed");
-        }
-
-        setIsCopied(true);
-        onSuccess?.();
-
-        timeoutRef.current = setTimeout(() => {
-          setIsCopied(false);
-        }, feedbackDuration);
-      } catch (error) {
-        onError?.(error instanceof Error ? error : new Error("Failed to copy"));
-      }
-    },
-    [feedbackDuration, onSuccess, onError],
-  );
-
-  return { isCopied, copy };
-}
+'use client';
+
+import { useState, useCallback, useRef, useEffect } from "react";
+
+interface UseCopyToClipboardOptions {
+  feedbackDuration?: number;
+  onSuccess?: () => void;
+  onError?: (error: Error) => void;
+}
+
+interface UseCopyToClipboardReturn {
+  isCopied: boolean;
+  copy: (text: string) => Promise<void>;
+}
+
+export default function useCopyToClipboard({
+  feedbackDuration = 2000,
+  onSuccess,
+  onError,
+}: UseCopyToClipboardOptions = {}): UseCopyToClipboardReturn {
+  const [isCopied, setIsCopied] = useState(false);
+  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
+
+  useEffect(() => {
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
+
+  const copy = useCallback(
+    async (text: string) => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+
+      try {
+        if (navigator.clipboard?.writeText) {
+          await navigator.clipboard.writeText(text);
+        } else {
+          const textarea = document.createElement("textarea");
+          textarea.value = text;
+          textarea.style.cssText = "position:fixed;top:-9999px;left:-9999px;opacity:0";
+          document.body.appendChild(textarea);
+          textarea.focus();
+          textarea.select();
+          const success = document.execCommand("copy");
+          document.body.removeChild(textarea);
+          if (!success) throw new Error("execCommand copy failed");
+        }
+
+        setIsCopied(true);
+        onSuccess?.();
+
+        timeoutRef.current = setTimeout(() => {
+          setIsCopied(false);
+        }, feedbackDuration);
+      } catch (error) {
+        onError?.(error instanceof Error ? error : new Error("Failed to copy"));
+      }
+    },
+    [feedbackDuration, onSuccess, onError],
+  );
+
+  return { isCopied, copy };
+}

package/src/hooks/useDebounce.ts

@@ -1,26 +1,26 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-
-/**
- * Hook para aplicar debounce em valores
- * @param value - Valor a ser debounced
- * @param delay - Delay em milissegundos (padrão: 400ms)
- * @returns Valor debounced
- */
-export function useDebounce<T>(value: T, delay: number = 400, onDebounce?: () => void): T {
-  const [debouncedValue, setDebouncedValue] = useState<T>(value);
-
-  useEffect(() => {
-    const handler = setTimeout(() => {
-      setDebouncedValue(value);
-      onDebounce?.();
-    }, delay);
-
-    return () => {
-      clearTimeout(handler);
-    };
-  }, [value, delay, onDebounce]);
-
-  return debouncedValue;
-}
+'use client';
+
+import { useEffect, useState } from 'react';
+
+/**
+ * Hook para aplicar debounce em valores
+ * @param value - Valor a ser debounced
+ * @param delay - Delay em milissegundos (padrão: 400ms)
+ * @returns Valor debounced
+ */
+export function useDebounce<T>(value: T, delay: number = 400, onDebounce?: () => void): T {
+  const [debouncedValue, setDebouncedValue] = useState<T>(value);
+
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value);
+      onDebounce?.();
+    }, delay);
+
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [value, delay, onDebounce]);
+
+  return debouncedValue;
+}

package/src/hooks/useDebounceState.ts

@@ -1,11 +1,11 @@
-'use client';
-
-import { useState } from 'react';
-import type React from 'react';
-import { useDebounce } from './useDebounce';
-
-export function useDebounceState<T>(initialValue: T, delay: number = 400): [T, React.Dispatch<React.SetStateAction<T>>] {
-  const [rawValue, setRawValue] = useState<T>(initialValue);
-  const debouncedValue = useDebounce(rawValue, delay);
-  return [debouncedValue, setRawValue];
-}
+'use client';
+
+import { useState } from 'react';
+import type React from 'react';
+import { useDebounce } from './useDebounce';
+
+export function useDebounceState<T>(initialValue: T, delay: number = 400): [T, React.Dispatch<React.SetStateAction<T>>] {
+  const [rawValue, setRawValue] = useState<T>(initialValue);
+  const debouncedValue = useDebounce(rawValue, delay);
+  return [debouncedValue, setRawValue];
+}

package/src/hooks/useDebouncedEffect.ts

@@ -1,69 +1,69 @@
-'use client';
-
-import { useEffect, useRef, useState, useCallback } from 'react';
-
-interface UseDebouncedEffectOptions {
-  effect: () => void;
-  debouncedDeps: React.DependencyList;
-  immediateDeps?: React.DependencyList;
-  delay?: number;
-}
-
-/**
- * Executes an effect with two trigger modes:
- * - `debouncedDeps`: triggers the effect after a delay (resets on each change)
- * - `immediateDeps`: triggers the effect immediately (also cancels any pending debounce)
- *
- * On mount, the effect fires once immediately via `immediateDeps`.
- * The effect callback always uses the latest closure values via a ref.
- *
- * @returns `{ isDebouncing }` — true while waiting for a debounced trigger to fire
- */
-export function useDebouncedEffect({
-  effect,
-  debouncedDeps,
-  immediateDeps = [],
-  delay = 500,
-}: UseDebouncedEffectOptions) {
-  const [isDebouncing, setIsDebouncing] = useState(false);
-  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-  const effectRef = useRef(effect);
-  effectRef.current = effect;
-  const hasMounted = useRef(false);
-
-  const clearTimer = useCallback(() => {
-    if (timerRef.current) {
-      clearTimeout(timerRef.current);
-      timerRef.current = null;
-    }
-  }, []);
-
-  useEffect(() => {
-    clearTimer();
-    setIsDebouncing(false);
-    effectRef.current();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, immediateDeps);
-
-  useEffect(() => {
-    if (!hasMounted.current) {
-      hasMounted.current = true;
-      return;
-    }
-
-    clearTimer();
-    setIsDebouncing(true);
-
-    timerRef.current = setTimeout(() => {
-      setIsDebouncing(false);
-      effectRef.current();
-    }, delay);
-
-    return clearTimer;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [...debouncedDeps, delay]);
-
-  useEffect(() => clearTimer, [clearTimer]);
-
-  return { isDebouncing };
-}
+'use client';
+
+import { useEffect, useRef, useState, useCallback } from 'react';
+
+interface UseDebouncedEffectOptions {
+  effect: () => void;
+  debouncedDeps: React.DependencyList;
+  immediateDeps?: React.DependencyList;
+  delay?: number;
+}
+
+/**
+ * Executes an effect with two trigger modes:
+ * - `debouncedDeps`: triggers the effect after a delay (resets on each change)
+ * - `immediateDeps`: triggers the effect immediately (also cancels any pending debounce)
+ *
+ * On mount, the effect fires once immediately via `immediateDeps`.
+ * The effect callback always uses the latest closure values via a ref.
+ *
+ * @returns `{ isDebouncing }` — true while waiting for a debounced trigger to fire
+ */
+export function useDebouncedEffect({
+  effect,
+  debouncedDeps,
+  immediateDeps = [],
+  delay = 500,
+}: UseDebouncedEffectOptions) {
+  const [isDebouncing, setIsDebouncing] = useState(false);
+  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const effectRef = useRef(effect);
+  effectRef.current = effect;
+  const hasMounted = useRef(false);
+
+  const clearTimer = useCallback(() => {
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+      timerRef.current = null;
+    }
+  }, []);
+
+  useEffect(() => {
+    clearTimer();
+    setIsDebouncing(false);
+    effectRef.current();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, immediateDeps);
+
+  useEffect(() => {
+    if (!hasMounted.current) {
+      hasMounted.current = true;
+      return;
+    }
+
+    clearTimer();
+    setIsDebouncing(true);
+
+    timerRef.current = setTimeout(() => {
+      setIsDebouncing(false);
+      effectRef.current();
+    }, delay);
+
+    return clearTimer;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [...debouncedDeps, delay]);
+
+  useEffect(() => clearTimer, [clearTimer]);
+
+  return { isDebouncing };
+}