@arkyn/components 3.0.1-beta.23 → 3.0.1-beta.25

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

@@ -0,0 +1,146 @@
+import { ReactNode } from "react";
+import "./styles.css";
+type OrientationProps = "bottomLeft" | "bottomRight" | "topLeft" | "topRight" | "top" | "left" | "bottom" | "right";
+type PopoverProps = {
+    children: ReactNode;
+    button: ReactNode;
+    closeOnClick?: boolean;
+    orientation?: OrientationProps;
+    className?: string;
+};
+/**
+ * Popover component - used for displaying contextual content in a floating container that appears relative to a trigger button
+ *
+ * @param props - Popover component properties
+ * @param props.children - Required content to display inside the popover when opened
+ * @param props.button - Required trigger element that opens the popover when clicked
+ * @param props.closeOnClick - Whether the popover should close when clicking on its content. Default: undefined (remains open)
+ * @param props.orientation - Position where the popover appears relative to the trigger button. Default: "bottomLeft"
+ * @param props.className - Additional CSS classes for styling the popover container
+ *
+ * @returns Popover JSX element with trigger button, animated content, and overlay for outside click handling
+ *
+ * @example
+ * ```tsx
+ * // Basic popover with default orientation
+ * <Popover
+ *   button={<button>Click me</button>}
+ * >
+ *   <div>Popover content here</div>
+ * </Popover>
+ *
+ * // Popover with custom orientation
+ * <Popover
+ *   button={<IconButton icon="menu" />}
+ *   orientation="topRight"
+ * >
+ *   <nav>
+ *     <a href="/profile">Profile</a>
+ *     <a href="/settings">Settings</a>
+ *     <a href="/logout">Logout</a>
+ *   </nav>
+ * </Popover>
+ *
+ * // Popover that closes when content is clicked
+ * <Popover
+ *   button={<Button>Select Option</Button>}
+ *   closeOnClick
+ *   orientation="bottom"
+ * >
+ *   <ul>
+ *     <li onClick={() => selectOption('option1')}>Option 1</li>
+ *     <li onClick={() => selectOption('option2')}>Option 2</li>
+ *     <li onClick={() => selectOption('option3')}>Option 3</li>
+ *   </ul>
+ * </Popover>
+ *
+ * // Popover with custom styling and left orientation
+ * <Popover
+ *   button={<Button variant="outline">Info</Button>}
+ *   orientation="left"
+ *   className="custom-popover"
+ * >
+ *   <div className="info-panel">
+ *     <h3>Additional Information</h3>
+ *     <p>This is some helpful information that appears in a popover.</p>
+ *     <Button size="sm">Learn More</Button>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover with form content and top-right positioning
+ * <Popover
+ *   button={<Badge>Filter</Badge>}
+ *   orientation="topRight"
+ * >
+ *   <form className="filter-form">
+ *     <Input name="search" placeholder="Search..." />
+ *     <Select name="category" options={categories} />
+ *     <Button type="submit">Apply Filters</Button>
+ *   </form>
+ * </Popover>
+ *
+ * // Popover with complex content and bottom-right positioning
+ * <Popover
+ *   button={<Avatar src="/user.jpg" />}
+ *   orientation="bottomRight"
+ *   closeOnClick
+ * >
+ *   <div className="user-menu">
+ *     <div className="user-info">
+ *       <img src="/user.jpg" alt="User" />
+ *       <div>
+ *         <h4>John Doe</h4>
+ *         <p>john@example.com</p>
+ *       </div>
+ *     </div>
+ *     <Divider />
+ *     <MenuItem icon="user">Profile</MenuItem>
+ *     <MenuItem icon="settings">Settings</MenuItem>
+ *     <MenuItem icon="logout">Sign Out</MenuItem>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover for context menu with right orientation
+ * <Popover
+ *   button={<Button variant="ghost" size="sm">⋮</Button>}
+ *   orientation="right"
+ *   closeOnClick
+ * >
+ *   <div className="context-menu">
+ *     <button onClick={() => editItem()}>Edit</button>
+ *     <button onClick={() => duplicateItem()}>Duplicate</button>
+ *     <button onClick={() => deleteItem()}>Delete</button>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover with notification content and top positioning
+ * <Popover
+ *   button={<Badge count={3}>🔔</Badge>}
+ *   orientation="top"
+ * >
+ *   <div className="notifications">
+ *     <h3>Recent Notifications</h3>
+ *     <div className="notification-item">New message received</div>
+ *     <div className="notification-item">Task completed</div>
+ *     <div className="notification-item">Meeting reminder</div>
+ *     <Button variant="ghost" size="sm">View All</Button>
+ *   </div>
+ * </Popover>
+ * ```
+ *
+ * @remarks
+ * This component provides:
+ * - 8 different orientation options for flexible positioning (bottomLeft, bottomRight, topLeft, topRight, top, left, bottom, right)
+ * - Smooth fade animation using Framer Motion for opening and closing
+ * - Automatic scroll lock when popover is open to prevent background scrolling
+ * - Click-outside-to-close functionality via overlay
+ * - Optional click-on-content-to-close behavior
+ * - Full accessibility support for keyboard navigation and screen readers
+ *
+ * The popover automatically handles positioning, animations, and user interactions.
+ * It uses CSS classes for styling and can be customized through the className prop.
+ * The component is ideal for dropdowns, context menus, tooltips, and any contextual UI elements.
+ */
+declare function Popover(props: PopoverProps): import("react/jsx-runtime").JSX.Element;
+export { Popover };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/popover/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAG5C,OAAO,cAAc,CAAC;AAEtB,KAAK,gBAAgB,GACjB,YAAY,GACZ,aAAa,GACb,SAAS,GACT,UAAU,GACV,KAAK,GACL,MAAM,GACN,QAAQ,GACR,OAAO,CAAC;AAEZ,KAAK,YAAY,GAAG;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoIG;AAEH,iBAAS,OAAO,CAAC,KAAK,EAAE,YAAY,2CAwCnC;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/components/popover/index.js

@@ -0,0 +1,151 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { motion } from "framer-motion";
+import { useState } from "react";
+import { useScrollLock } from "../../hooks/useScrollLock";
+import "./styles.css";
+/**
+ * Popover component - used for displaying contextual content in a floating container that appears relative to a trigger button
+ *
+ * @param props - Popover component properties
+ * @param props.children - Required content to display inside the popover when opened
+ * @param props.button - Required trigger element that opens the popover when clicked
+ * @param props.closeOnClick - Whether the popover should close when clicking on its content. Default: undefined (remains open)
+ * @param props.orientation - Position where the popover appears relative to the trigger button. Default: "bottomLeft"
+ * @param props.className - Additional CSS classes for styling the popover container
+ *
+ * @returns Popover JSX element with trigger button, animated content, and overlay for outside click handling
+ *
+ * @example
+ * ```tsx
+ * // Basic popover with default orientation
+ * <Popover
+ *   button={<button>Click me</button>}
+ * >
+ *   <div>Popover content here</div>
+ * </Popover>
+ *
+ * // Popover with custom orientation
+ * <Popover
+ *   button={<IconButton icon="menu" />}
+ *   orientation="topRight"
+ * >
+ *   <nav>
+ *     <a href="/profile">Profile</a>
+ *     <a href="/settings">Settings</a>
+ *     <a href="/logout">Logout</a>
+ *   </nav>
+ * </Popover>
+ *
+ * // Popover that closes when content is clicked
+ * <Popover
+ *   button={<Button>Select Option</Button>}
+ *   closeOnClick
+ *   orientation="bottom"
+ * >
+ *   <ul>
+ *     <li onClick={() => selectOption('option1')}>Option 1</li>
+ *     <li onClick={() => selectOption('option2')}>Option 2</li>
+ *     <li onClick={() => selectOption('option3')}>Option 3</li>
+ *   </ul>
+ * </Popover>
+ *
+ * // Popover with custom styling and left orientation
+ * <Popover
+ *   button={<Button variant="outline">Info</Button>}
+ *   orientation="left"
+ *   className="custom-popover"
+ * >
+ *   <div className="info-panel">
+ *     <h3>Additional Information</h3>
+ *     <p>This is some helpful information that appears in a popover.</p>
+ *     <Button size="sm">Learn More</Button>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover with form content and top-right positioning
+ * <Popover
+ *   button={<Badge>Filter</Badge>}
+ *   orientation="topRight"
+ * >
+ *   <form className="filter-form">
+ *     <Input name="search" placeholder="Search..." />
+ *     <Select name="category" options={categories} />
+ *     <Button type="submit">Apply Filters</Button>
+ *   </form>
+ * </Popover>
+ *
+ * // Popover with complex content and bottom-right positioning
+ * <Popover
+ *   button={<Avatar src="/user.jpg" />}
+ *   orientation="bottomRight"
+ *   closeOnClick
+ * >
+ *   <div className="user-menu">
+ *     <div className="user-info">
+ *       <img src="/user.jpg" alt="User" />
+ *       <div>
+ *         <h4>John Doe</h4>
+ *         <p>john@example.com</p>
+ *       </div>
+ *     </div>
+ *     <Divider />
+ *     <MenuItem icon="user">Profile</MenuItem>
+ *     <MenuItem icon="settings">Settings</MenuItem>
+ *     <MenuItem icon="logout">Sign Out</MenuItem>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover for context menu with right orientation
+ * <Popover
+ *   button={<Button variant="ghost" size="sm">⋮</Button>}
+ *   orientation="right"
+ *   closeOnClick
+ * >
+ *   <div className="context-menu">
+ *     <button onClick={() => editItem()}>Edit</button>
+ *     <button onClick={() => duplicateItem()}>Duplicate</button>
+ *     <button onClick={() => deleteItem()}>Delete</button>
+ *   </div>
+ * </Popover>
+ *
+ * // Popover with notification content and top positioning
+ * <Popover
+ *   button={<Badge count={3}>🔔</Badge>}
+ *   orientation="top"
+ * >
+ *   <div className="notifications">
+ *     <h3>Recent Notifications</h3>
+ *     <div className="notification-item">New message received</div>
+ *     <div className="notification-item">Task completed</div>
+ *     <div className="notification-item">Meeting reminder</div>
+ *     <Button variant="ghost" size="sm">View All</Button>
+ *   </div>
+ * </Popover>
+ * ```
+ *
+ * @remarks
+ * This component provides:
+ * - 8 different orientation options for flexible positioning (bottomLeft, bottomRight, topLeft, topRight, top, left, bottom, right)
+ * - Smooth fade animation using Framer Motion for opening and closing
+ * - Automatic scroll lock when popover is open to prevent background scrolling
+ * - Click-outside-to-close functionality via overlay
+ * - Optional click-on-content-to-close behavior
+ * - Full accessibility support for keyboard navigation and screen readers
+ *
+ * The popover automatically handles positioning, animations, and user interactions.
+ * It uses CSS classes for styling and can be customized through the className prop.
+ * The component is ideal for dropdowns, context menus, tooltips, and any contextual UI elements.
+ */
+function Popover(props) {
+    const { children, button, closeOnClick, className: baseClassName = "", orientation = "bottomLeft", } = props;
+    const [isOpen, setIsOpen] = useState(false);
+    const visible = isOpen ? "visibleTrue" : "visibleFalse";
+    const className = `arkynPopover ${orientation} ${visible} ${baseClassName}`;
+    function handleOpenPopover() {
+        if (!isOpen)
+            setIsOpen(true);
+    }
+    useScrollLock(isOpen);
+    return (_jsxs("div", { className: className, onClick: handleOpenPopover, children: [button, _jsx(motion.div, { style: { visibility: isOpen ? "visible" : "hidden" }, transition: { ease: "easeOut", duration: 0 }, initial: { opacity: 0 }, animate: { opacity: isOpen ? 1 : 0 }, exit: { opacity: 0 }, onClick: () => closeOnClick && setIsOpen(false), className: "arkynPopoverContent", children: children }), isOpen && (_jsx("div", { onClick: () => setIsOpen(false), className: "arkynPopoverOverlay" }))] }));
+}
+export { Popover };

package/dist/components/tab/tabContainer/index.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes, ReactNode } from "react";
 import "./styles.css";
-type TabContainerProps = Omit<HTMLAttributes<HTMLElement>, "onClick" | "children" | "ref"> & {
+type TabContainerProps = Omit<HTMLAttributes<HTMLElement>, "onChange" | "children" | "ref" | "onClick"> & {
     children: ReactNode;
     disabled?: boolean;
     defaultValue?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/tab/tabContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAG5D,OAAO,cAAc,CAAC;AAEtB,KAAK,iBAAiB,GAAG,IAAI,CAC3B,cAAc,CAAC,WAAW,CAAC,EAC3B,SAAS,GAAG,UAAU,GAAG,KAAK,CAC/B,GAAG;IACF,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AAEH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA8B7C;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/tab/tabContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAG5D,OAAO,cAAc,CAAC;AAEtB,KAAK,iBAAiB,GAAG,IAAI,CAC3B,cAAc,CAAC,WAAW,CAAC,EAC3B,UAAU,GAAG,UAAU,GAAG,KAAK,GAAG,SAAS,CAC5C,GAAG;IACF,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AAEH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA8B7C;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/hooks/useToast.d.ts

@@ -0,0 +1,70 @@
+/**
+ * Custom hook to access toast functionality from ToastProvider context
+ *
+ * @returns Object containing toast methods and state
+ * @returns {function} showToast - Function to display toast notifications
+ *
+ * @throws {Error} Throws an error if used outside of ToastProvider
+ *
+ * @example
+ * Basic usage:
+ * ```tsx
+ * function MyComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleSuccess = () => {
+ *     showToast({
+ *       message: 'Operation completed successfully!',
+ *       type: 'success'
+ *     });
+ *   };
+ *
+ *   const handleError = () => {
+ *     showToast({
+ *       message: 'Something went wrong!',
+ *       type: 'danger'
+ *     });
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={handleSuccess}>Success Toast</button>
+ *       <button onClick={handleError}>Error Toast</button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * Using in async operations:
+ * ```tsx
+ * function FormComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleSubmit = async (data) => {
+ *     try {
+ *       await submitForm(data);
+ *       showToast({
+ *         message: 'Form submitted successfully!',
+ *         type: 'success'
+ *       });
+ *     } catch (error) {
+ *       showToast({
+ *         message: 'Failed to submit form',
+ *         type: 'danger'
+ *       });
+ *     }
+ *   };
+ *
+ *   return <form onSubmit={handleSubmit}>...</form>;
+ * }
+ * ```
+ */
+declare function useToast(): {
+    showToast(toast: {
+        message: string;
+        type: "success" | "danger";
+    }): void;
+};
+export { useToast };
+//# sourceMappingURL=useToast.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/hooks/useToast.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AAEH,iBAAS,QAAQ;;;;;EAQhB;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/hooks/useToast.js

@@ -0,0 +1,72 @@
+import { toastContext } from "../providers/toastProvider";
+import { useContext } from "react";
+/**
+ * Custom hook to access toast functionality from ToastProvider context
+ *
+ * @returns Object containing toast methods and state
+ * @returns {function} showToast - Function to display toast notifications
+ *
+ * @throws {Error} Throws an error if used outside of ToastProvider
+ *
+ * @example
+ * Basic usage:
+ * ```tsx
+ * function MyComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleSuccess = () => {
+ *     showToast({
+ *       message: 'Operation completed successfully!',
+ *       type: 'success'
+ *     });
+ *   };
+ *
+ *   const handleError = () => {
+ *     showToast({
+ *       message: 'Something went wrong!',
+ *       type: 'danger'
+ *     });
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={handleSuccess}>Success Toast</button>
+ *       <button onClick={handleError}>Error Toast</button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * Using in async operations:
+ * ```tsx
+ * function FormComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleSubmit = async (data) => {
+ *     try {
+ *       await submitForm(data);
+ *       showToast({
+ *         message: 'Form submitted successfully!',
+ *         type: 'success'
+ *       });
+ *     } catch (error) {
+ *       showToast({
+ *         message: 'Failed to submit form',
+ *         type: 'danger'
+ *       });
+ *     }
+ *   };
+ *
+ *   return <form onSubmit={handleSubmit}>...</form>;
+ * }
+ * ```
+ */
+function useToast() {
+    const contextData = useContext(toastContext);
+    if (Object.entries(contextData).length === 0) {
+        throw new Error("useToast must be used within a Provider");
+    }
+    return contextData;
+}
+export { useToast };

package/dist/index.d.ts

@@ -28,6 +28,7 @@ export { ModalFooter } from "./components/modal/modalFooter";
 export { ModalHeader } from "./components/modal/modalHeader";
 export { MultiSelect } from "./components/multiSelect";
 export { PhoneInput } from "./components/phoneInput";
+export { Popover } from "./components/popover";
 export { RadioBox } from "./components/radio/radioBox";
 export { RadioGroup } from "./components/radio/radioGroup";
 export { Slider } from "./components/slider";
@@ -51,4 +52,5 @@ export { useSlider } from "./hooks/useSlider";
 export { DrawerProvider } from "./providers/drawerProvider";
 export { FormProvider } from "./providers/formProvider";
 export { ModalProvider } from "./providers/modalProvider";
+export { ToastProvider } from "./providers/toastProvider";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -29,6 +29,7 @@ export { ModalFooter } from "./components/modal/modalFooter";
 export { ModalHeader } from "./components/modal/modalHeader";
 export { MultiSelect } from "./components/multiSelect";
 export { PhoneInput } from "./components/phoneInput";
+export { Popover } from "./components/popover";
 export { RadioBox } from "./components/radio/radioBox";
 export { RadioGroup } from "./components/radio/radioGroup";
 export { Slider } from "./components/slider";
@@ -54,3 +55,4 @@ export { useSlider } from "./hooks/useSlider";
 export { DrawerProvider } from "./providers/drawerProvider";
 export { FormProvider } from "./providers/formProvider";
 export { ModalProvider } from "./providers/modalProvider";
+export { ToastProvider } from "./providers/toastProvider";

package/dist/providers/toastProvider.d.ts

@@ -0,0 +1,48 @@
+import { ReactNode } from "react";
+type ToastProps = {
+    message: string;
+    type: "success" | "danger";
+};
+type ToastContextProps = {
+    showToast(toast: ToastProps): void;
+};
+type ToastProviderProps = {
+    children: ReactNode;
+};
+declare const toastContext: import("react").Context<ToastContextProps>;
+/**
+ * ToastProvider component - provides toast context for managing toast notifications
+ *
+ * @param props - ToastProvider component properties
+ * @param props.children - React elements that will have access to the toast context
+ *
+ * @returns ToastProvider JSX element that wraps children with toast context
+ *
+ * @example
+ * Basic usage:
+ * ```tsx
+ * <ToastProvider>
+ *   <App />
+ * </ToastProvider>
+ * ```
+ *
+ * @example
+ * Using toast in component:
+ * ```tsx
+ * function MyComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleClick = () => {
+ *     showToast({
+ *       message: 'Success!',
+ *       type: 'success'
+ *     });
+ *   };
+ *
+ *   return <button onClick={handleClick}>Show Toast</button>;
+ * }
+ * ```
+ */
+declare function ToastProvider({ children }: ToastProviderProps): import("react/jsx-runtime").JSX.Element;
+export { toastContext, ToastProvider };
+//# sourceMappingURL=toastProvider.d.ts.map

package/dist/providers/toastProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toastProvider.d.ts","sourceRoot":"","sources":["../../src/providers/toastProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjD,KAAK,UAAU,GAAG;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,SAAS,GAAG,QAAQ,CAAC;CAC5B,CAAC;AAEF,KAAK,iBAAiB,GAAG;IACvB,SAAS,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CACpC,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,QAAA,MAAM,YAAY,4CAAyC,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CA2CtD;AAED,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,CAAC"}

package/dist/providers/toastProvider.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext } from "react";
+import toast, { Toaster } from "react-hot-toast";
+const toastContext = createContext({});
+/**
+ * ToastProvider component - provides toast context for managing toast notifications
+ *
+ * @param props - ToastProvider component properties
+ * @param props.children - React elements that will have access to the toast context
+ *
+ * @returns ToastProvider JSX element that wraps children with toast context
+ *
+ * @example
+ * Basic usage:
+ * ```tsx
+ * <ToastProvider>
+ *   <App />
+ * </ToastProvider>
+ * ```
+ *
+ * @example
+ * Using toast in component:
+ * ```tsx
+ * function MyComponent() {
+ *   const { showToast } = useToast();
+ *
+ *   const handleClick = () => {
+ *     showToast({
+ *       message: 'Success!',
+ *       type: 'success'
+ *     });
+ *   };
+ *
+ *   return <button onClick={handleClick}>Show Toast</button>;
+ * }
+ * ```
+ */
+function ToastProvider({ children }) {
+    function showToast(props) {
+        switch (props.type) {
+            case "success":
+                return toast.success(props.message, {
+                    style: {
+                        background: "#10B981",
+                        color: "#ffffff",
+                        padding: "12px 16px",
+                        fontSize: "14px",
+                        fontWeight: 600,
+                    },
+                    iconTheme: {
+                        primary: "#059669",
+                        secondary: "#ffffff",
+                    },
+                });
+            case "danger":
+                return toast.error(props.message, {
+                    style: {
+                        background: "#E11D48",
+                        color: "#ffffff",
+                        padding: "12px 16px",
+                        fontSize: "14px",
+                        fontWeight: 600,
+                    },
+                    iconTheme: {
+                        primary: "#BE123C",
+                        secondary: "#ffffff",
+                    },
+                });
+        }
+    }
+    return (_jsxs(toastContext.Provider, { value: { showToast }, children: [_jsx(Toaster, { position: "top-right", containerStyle: { zIndex: 999999999999999 } }), children] }));
+}
+export { toastContext, ToastProvider };