@true-tech-team/react-components 0.0.4 → 0.0.5

package/lib/hooks/useResizeObserver/useResizeObserver.d.ts

@@ -0,0 +1,69 @@
+/**
+ * Options for the resize observer hook
+ */
+export interface UseResizeObserverOptions {
+    /**
+     * Callback when size changes
+     */
+    onResize?: (entry: ResizeObserverEntry) => void;
+    /**
+     * Debounce delay for resize callback (ms)
+     * @default 0
+     */
+    debounce?: number;
+    /**
+     * Which box model to observe
+     * @default 'border-box'
+     */
+    box?: ResizeObserverBoxOptions;
+    /**
+     * Whether to disable the observer
+     * @default false
+     */
+    disabled?: boolean;
+}
+/**
+ * Return value from useResizeObserver
+ */
+export interface UseResizeObserverReturn {
+    /**
+     * Ref callback to attach to the observed element
+     */
+    ref: (node: HTMLElement | null) => void;
+    /**
+     * Current width of the element
+     */
+    width: number;
+    /**
+     * Current height of the element
+     */
+    height: number;
+    /**
+     * The observed element
+     */
+    element: HTMLElement | null;
+}
+/**
+ * Hook that observes element resize using ResizeObserver
+ *
+ * @example
+ * ```tsx
+ * const { ref, width, height } = useResizeObserver();
+ *
+ * return (
+ *   <div ref={ref}>
+ *     Width: {width}, Height: {height}
+ *   </div>
+ * );
+ * ```
+ *
+ * @example
+ * ```tsx
+ * const { ref, width } = useResizeObserver({
+ *   onResize: (entry) => console.log('Resized:', entry),
+ *   debounce: 100,
+ * });
+ * ```
+ */
+export declare function useResizeObserver(options?: UseResizeObserverOptions): UseResizeObserverReturn;
+export default useResizeObserver;

package/lib/hooks/useToast/index.d.ts

@@ -0,0 +1,2 @@
+export { useToast } from './useToast';
+export type { UseToastOptions, UseToastReturn } from './useToast';

package/lib/hooks/useToast/useToast.d.ts

@@ -0,0 +1,97 @@
+import { ToastContextValue, ToastData } from '../../components/overlays/Toast';
+/**
+ * Hook options
+ */
+export interface UseToastOptions {
+    /**
+     * Default props to apply to all toasts
+     */
+    defaultProps?: Partial<ToastData>;
+}
+/**
+ * Hook return type
+ */
+export interface UseToastReturn {
+    /**
+     * Add a toast with full configuration
+     * @returns Toast ID
+     */
+    toast: (data: ToastData) => string;
+    /**
+     * Show a success toast
+     * @returns Toast ID
+     */
+    success: (message: string, options?: Partial<ToastData>) => string;
+    /**
+     * Show an error toast
+     * @returns Toast ID
+     */
+    error: (message: string, options?: Partial<ToastData>) => string;
+    /**
+     * Show a warning toast
+     * @returns Toast ID
+     */
+    warning: (message: string, options?: Partial<ToastData>) => string;
+    /**
+     * Show an info toast
+     * @returns Toast ID
+     */
+    info: (message: string, options?: Partial<ToastData>) => string;
+    /**
+     * Show a loading toast
+     * @returns Toast ID
+     */
+    loading: (message: string, options?: Partial<ToastData>) => string;
+    /**
+     * Update an existing toast
+     */
+    update: (id: string, data: Partial<ToastData>) => void;
+    /**
+     * Dismiss a specific toast
+     */
+    dismiss: (id: string) => void;
+    /**
+     * Dismiss all toasts
+     */
+    dismissAll: () => void;
+    /**
+     * Promise-based toast that shows loading, then success/error
+     */
+    promise: ToastContextValue['promise'];
+}
+/**
+ * Hook for programmatically creating toasts
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const toast = useToast();
+ *
+ *   const handleSave = () => {
+ *     toast.success('Changes saved successfully');
+ *   };
+ *
+ *   const handleError = () => {
+ *     toast.error('Failed to save changes', {
+ *       action: { label: 'Retry', onClick: handleSave }
+ *     });
+ *   };
+ *
+ *   const handleAsyncOperation = async () => {
+ *     await toast.promise(
+ *       fetchData(),
+ *       {
+ *         loading: 'Fetching data...',
+ *         success: (data) => `Loaded ${data.length} items`,
+ *         error: (err) => `Error: ${err.message}`,
+ *       }
+ *     );
+ *   };
+ *
+ *   return (
+ *     <Button onClick={handleSave}>Save</Button>
+ *   );
+ * }
+ * ```
+ */
+export declare function useToast(options?: UseToastOptions): UseToastReturn;

package/lib/providers/GlobalProvider/GlobalProvider.d.ts

@@ -1,5 +1,8 @@
 import { ReactNode } from 'react';
 import { PageMessagesProviderProps } from '../../contexts/PageMessagesContext';
+import { DialogProviderProps } from '../../components/overlays/Dialog';
+import { AlertProviderProps } from '../../components/overlays/Alert';
+import { ToastProviderProps } from '../../components/overlays/Toast';
 import { ThemeConfig } from '../../types';
 export interface GlobalProviderProps {
     /**
@@ -18,6 +21,18 @@ export interface GlobalProviderProps {
      * PageMessages default configuration
      */
     pageMessagesConfig?: Omit<PageMessagesProviderProps, 'children'>;
+    /**
+     * Dialog provider configuration
+     */
+    dialogConfig?: Omit<DialogProviderProps, 'children'>;
+    /**
+     * Alert provider configuration
+     */
+    alertConfig?: Omit<AlertProviderProps, 'children'>;
+    /**
+     * Toast provider configuration
+     */
+    toastConfig?: Omit<ToastProviderProps, 'children'>;
 }
 /**
  * GlobalProvider component that wraps the entire application
@@ -57,5 +72,5 @@ export interface GlobalProviderProps {
  * </GlobalProvider>
  * ```
  */
-export declare function GlobalProvider({ children, themeConfig, injectGlobalStyles, pageMessagesConfig, }: GlobalProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function GlobalProvider({ children, themeConfig, injectGlobalStyles, pageMessagesConfig, dialogConfig, alertConfig, toastConfig, }: GlobalProviderProps): import("react/jsx-runtime").JSX.Element;
 export default GlobalProvider;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@true-tech-team/react-components",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "React TypeScript component library",
   "main": "./index.js",
   "types": "./index.d.ts",