@taiv/ui 1.0.1 → 1.0.2

package/dist/components/Info/Modals/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Modals/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,KAAK,GAAI,6DAAuE,UAAU,4CAoEtG,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/components/Info/Modals/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAGD,eAAO,MAAM,KAAK,GAAI,6DAAuE,UAAU,4CAoEtG,CAAC"}

package/dist/components/Info/Modals/Modal.js

@@ -4,6 +4,7 @@ import { neutral } from '../../../constants/colors';
 import { Title } from '../../Typography/Title';
 import { Stack } from '../../Layout/Stack';
 import { Center } from '../../Layout/Center';
+// Base modal is intended to be extended and customized - use InfoModal or ConfirmationModal for common use cases
 export const Modal = ({ opened, onClose, icon, title, subtitle, children, width = '40rem' }) => {
     return (_jsx(MantineModal, { opened: opened, onClose: onClose, centered: true, radius: '16px', overlayProps: {
             opacity: 0,

package/dist/components/index.d.ts

@@ -2,10 +2,7 @@ export { CheckboxTable } from "./Data/CheckboxTable";
 export { RemovableItemList } from "./Data/RemovableItemList";
 export { ModalProvider } from "./Info/Modals/ModalProvider";
 export { Modal } from "./Info/Modals/Modal";
-export { useConfirmationModal } from "./Info/Modals/ConfirmationModal";
-export { useInfoModal } from "./Info/Modals/InfoModal";
 export { NotificationProvider } from "./Info/Notifications/NotificationProvider";
-export { useNotifications } from "./Info/Notifications/Notifications";
 export { InfoTooltip } from "./Info/Tooltips/InfoTooltip";
 export { Tooltip } from "./Info/Tooltips/Tooltip";
 export { AutoComplete } from "./Inputs/TextInputs/AutoComplete";
@@ -33,6 +30,4 @@ export { CollapsibleText } from "./Typography/CollapsibleText";
 export { Text } from "./Typography/Text";
 export { Title } from "./Typography/Title";
 export { Transition } from "./Misc/Transition";
-export { useCopy } from "./Misc/Copy";
-export { useMediaQuery } from "./Misc/MediaQuery";
 //# 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,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAG7D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AACtE,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGlD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAGvC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAG3C,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAG7D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGlD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAGvC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAG3C,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/index.js

@@ -4,10 +4,7 @@ export { RemovableItemList } from "./Data/RemovableItemList";
 //Info
 export { ModalProvider } from "./Info/Modals/ModalProvider";
 export { Modal } from "./Info/Modals/Modal";
-export { useConfirmationModal } from "./Info/Modals/ConfirmationModal";
-export { useInfoModal } from "./Info/Modals/InfoModal";
 export { NotificationProvider } from "./Info/Notifications/NotificationProvider";
-export { useNotifications } from "./Info/Notifications/Notifications";
 export { InfoTooltip } from "./Info/Tooltips/InfoTooltip";
 export { Tooltip } from "./Info/Tooltips/Tooltip";
 //Inputs
@@ -39,5 +36,3 @@ export { Text } from "./Typography/Text";
 export { Title } from "./Typography/Title";
 //Misc
 export { Transition } from "./Misc/Transition";
-export { useCopy } from "./Misc/Copy";
-export { useMediaQuery } from "./Misc/MediaQuery";

package/dist/hooks/index.d.ts

@@ -1,6 +1,6 @@
-export { useCopy } from '../components/Misc/Copy';
-export { useMediaQuery } from '../components/Misc/MediaQuery';
-export { useNotifications } from '../components/Info/Notifications/Notifications';
-export { useConfirmationModal } from '../components/Info/Modals/ConfirmationModal';
-export { useInfoModal } from '../components/Info/Modals/InfoModal';
+export { useCopy } from './useCopy';
+export { useMediaQuery } from './useMediaQuery';
+export { useNotifications } from './useNotifications';
+export { useConfirmationModal } from './useConfirmationModal';
+export { useInfoModal } from './useInfoModal';
 //# 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,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/hooks/index.js

@@ -1,5 +1,5 @@
-export { useCopy } from '../components/Misc/Copy';
-export { useMediaQuery } from '../components/Misc/MediaQuery';
-export { useNotifications } from '../components/Info/Notifications/Notifications';
-export { useConfirmationModal } from '../components/Info/Modals/ConfirmationModal';
-export { useInfoModal } from '../components/Info/Modals/InfoModal';
+export { useCopy } from './useCopy';
+export { useMediaQuery } from './useMediaQuery';
+export { useNotifications } from './useNotifications';
+export { useConfirmationModal } from './useConfirmationModal';
+export { useInfoModal } from './useInfoModal';

package/dist/hooks/useConfirmationModal.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { modalVariants } from '../components/Info/Modals/variants';
+export declare const useConfirmationModal: () => {
+    show: (options: {
+        variant?: Exclude<keyof typeof modalVariants, "error">;
+        title?: string;
+        message?: string;
+        confirmLabel?: string;
+        cancelLabel?: string;
+        icon?: React.ReactNode;
+        onConfirm?: () => void;
+        onCancel?: () => void;
+        size?: string | number;
+    }) => void;
+    close: (modalId: string) => void;
+    closeAll: () => void;
+};
+//# sourceMappingURL=useConfirmationModal.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useConfirmationModal.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfirmationModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAInE,eAAO,MAAM,oBAAoB;oBACR;QACrB,OAAO,CAAC,EAAE,OAAO,CAAC,MAAM,OAAO,aAAa,EAAE,OAAO,CAAC,CAAC;QACvD,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;QACvB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;QACtB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;KACxB;qBAkGuB,MAAM;;CAa/B,CAAC"}

package/dist/hooks/useConfirmationModal.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { modals } from '@mantine/modals';
+import { neutral } from '../constants/colors';
+import { Title } from '../components/Typography/Title';
+import { Stack } from '../components/Layout/Stack';
+import { Center } from '../components/Layout/Center';
+import { modalVariants } from '../components/Info/Modals/variants';
+import { Button } from '../components/Inputs/Buttons/Button';
+import { Group } from '../components/Layout/Group';
+export const useConfirmationModal = () => {
+    const show = (options) => {
+        const { variant = 'confirm', title, message, confirmLabel, cancelLabel, icon, onConfirm, onCancel, size = '40rem', } = options;
+        const handleConfirm = () => {
+            if (onConfirm)
+                onConfirm();
+            modals.closeAll();
+        };
+        const handleCancel = () => {
+            if (onCancel)
+                onCancel();
+            modals.closeAll();
+        };
+        const selectedVariant = modalVariants[variant];
+        const iconContainer = {
+            width: '4.2rem',
+            height: '4.2rem',
+            borderRadius: '50%',
+            backgroundColor: selectedVariant.iconBackgroundColor,
+            border: `2px solid ${selectedVariant.iconColor}`,
+        };
+        const modalIcon = icon || (_jsx("i", { className: selectedVariant.icon, style: { color: selectedVariant.iconColor, fontSize: '2rem' } }));
+        const ConfirmModalContent = () => {
+            return (_jsx(Center, { h: "100%", w: "100%", children: _jsxs(Stack, { gap: "2rem", h: "100%", w: "100%", align: "center", children: [_jsxs(Stack, { gap: "1.5rem", align: "center", children: [_jsx(Center, { style: iconContainer, children: modalIcon }), _jsxs(Stack, { gap: "0.25rem", align: "center", children: [_jsx(Title, { variant: "cardHeader", align: "center", children: title || selectedVariant.title }), _jsx(Title, { variant: "cardSubheader", align: "center", children: message || selectedVariant.message })] })] }), _jsx(Center, { h: "100%", w: "100%", children: _jsxs(Group, { gap: "1rem", align: "center", children: [_jsx(Button, { onClick: handleCancel, variant: "secondary", children: cancelLabel || selectedVariant.cancelLabel }), _jsx(Button, { onClick: handleConfirm, variant: selectedVariant.buttonVariant, children: confirmLabel || selectedVariant.confirmLabel })] }) })] }) }));
+        };
+        modals.open({
+            children: _jsx(ConfirmModalContent, {}),
+            size,
+            styles: {
+                content: {
+                    borderRadius: '8px',
+                    border: `1px solid ${neutral[50]}`,
+                    boxShadow: '0px 0px 19px 0px #00000040',
+                },
+                header: {
+                    padding: '0.8rem',
+                },
+                close: {
+                    borderRadius: '16px',
+                    backgroundColor: neutral[50],
+                    width: '1.8rem',
+                    height: '1.8rem',
+                    '&:hover': {
+                        backgroundColor: neutral[50],
+                    },
+                    '&:active': {
+                        transform: 'none',
+                    },
+                },
+                body: {
+                    padding: '0 3.2rem 1.6rem 3.2rem',
+                },
+            },
+        });
+    };
+    const close = (modalId) => {
+        modals.close(modalId);
+    };
+    const closeAll = () => {
+        modals.closeAll();
+    };
+    return {
+        show,
+        close,
+        closeAll,
+    };
+};

package/dist/hooks/useCopy.d.ts

@@ -0,0 +1,10 @@
+export declare const useCopy: () => {
+    copy: (options: {
+        value: string;
+        label?: string;
+        onCopy?: (value: string) => void;
+        showNotification?: boolean;
+        notificationMessage?: string;
+    }) => void;
+};
+//# sourceMappingURL=useCopy.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useCopy.d.ts","sourceRoot":"","sources":["../../src/hooks/useCopy.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO;oBAIK;QACrB,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QACjC,gBAAgB,CAAC,EAAE,OAAO,CAAC;QAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;KAC9B;CAmBF,CAAC"}

package/dist/hooks/useCopy.js

@@ -0,0 +1,18 @@
+import { useClipboard } from '@mantine/hooks';
+import { useNotifications } from './useNotifications';
+export const useCopy = () => {
+    const clipboard = useClipboard();
+    const notifications = useNotifications();
+    const copy = (options) => {
+        const { onCopy, showNotification = true, notificationMessage = `${options.label ? `${options.label}: ` : ''}${options.value}`, } = options || {};
+        clipboard.copy(options.value);
+        onCopy === null || onCopy === void 0 ? void 0 : onCopy(options.value);
+        if (showNotification) {
+            notifications.show({
+                message: notificationMessage,
+                variant: 'copy',
+            });
+        }
+    };
+    return { copy };
+};

package/dist/hooks/useInfoModal.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { modalVariants } from '../components/Info/Modals/variants';
+export declare const useInfoModal: () => {
+    show: (options: {
+        variant?: keyof typeof modalVariants;
+        title?: string;
+        message?: string;
+        icon?: React.ReactNode;
+        onConfirm?: () => void;
+        size?: string | number;
+    }) => void;
+    close: (modalId: string) => void;
+    closeAll: () => void;
+};
+//# sourceMappingURL=useInfoModal.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useInfoModal.d.ts","sourceRoot":"","sources":["../../src/hooks/useInfoModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAGnE,eAAO,MAAM,YAAY;oBACA;QACrB,OAAO,CAAC,EAAE,MAAM,OAAO,aAAa,CAAC;QACrC,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;QACvB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;KACxB;qBA8EuB,MAAM;;CAa/B,CAAC"}

package/dist/hooks/useInfoModal.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { modals } from '@mantine/modals';
+import { neutral } from '../constants/colors';
+import { Title } from '../components/Typography/Title';
+import { Stack } from '../components/Layout/Stack';
+import { Center } from '../components/Layout/Center';
+import { modalVariants } from '../components/Info/Modals/variants';
+import { Button } from '../components/Inputs/Buttons/Button';
+export const useInfoModal = () => {
+    const show = (options) => {
+        const { variant = 'info', title, message, icon, onConfirm, size = '35rem' } = options;
+        const handleConfirm = () => {
+            if (onConfirm)
+                onConfirm();
+            modals.closeAll();
+        };
+        const selectedVariant = modalVariants[variant];
+        const iconContainer = {
+            width: '4.2rem',
+            height: '4.2rem',
+            borderRadius: '50%',
+            backgroundColor: selectedVariant.iconBackgroundColor,
+            border: `2px solid ${selectedVariant.iconColor}`,
+        };
+        const modalIcon = icon || (_jsx("i", { className: selectedVariant.icon, style: { color: selectedVariant.iconColor, fontSize: '2rem' } }));
+        const InfoModalContent = () => {
+            return (_jsx(Center, { h: "100%", w: "100%", children: _jsxs(Stack, { gap: "2rem", h: "100%", w: "100%", align: "center", children: [_jsxs(Stack, { gap: "1.5rem", align: "center", children: [_jsx(Center, { style: iconContainer, children: modalIcon }), _jsxs(Stack, { gap: "0.25rem", align: "center", children: [_jsx(Title, { variant: "cardHeader", align: "center", children: title || selectedVariant.title }), _jsx(Title, { variant: "cardSubheader", align: "center", children: message || selectedVariant.message })] })] }), _jsx(Center, { h: "100%", w: "100%", children: _jsx(Button, { onClick: handleConfirm, variant: selectedVariant.buttonVariant, children: "OK" }) })] }) }));
+        };
+        modals.open({
+            children: _jsx(InfoModalContent, {}),
+            size,
+            styles: {
+                content: {
+                    borderRadius: '8px',
+                    border: `1px solid ${neutral[50]}`,
+                    boxShadow: '0px 0px 19px 0px #00000040',
+                },
+                header: {
+                    padding: '0.8rem',
+                },
+                close: {
+                    borderRadius: '16px',
+                    backgroundColor: neutral[50],
+                    width: '1.8rem',
+                    height: '1.8rem',
+                    '&:hover': {
+                        backgroundColor: neutral[50],
+                    },
+                    '&:active': {
+                        transform: 'none',
+                    },
+                },
+                body: {
+                    padding: '0 3.2rem 1.6rem 3.2rem',
+                },
+            },
+        });
+    };
+    const close = (modalId) => {
+        modals.close(modalId);
+    };
+    const closeAll = () => {
+        modals.closeAll();
+    };
+    return {
+        show,
+        close,
+        closeAll,
+    };
+};

package/dist/hooks/useMediaQuery.d.ts

@@ -0,0 +1,3 @@
+import { useMediaQuery as useMantineMediaQuery } from '@mantine/hooks';
+export declare const useMediaQuery: typeof useMantineMediaQuery;
+//# sourceMappingURL=useMediaQuery.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../src/hooks/useMediaQuery.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,IAAI,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEvE,eAAO,MAAM,aAAa,6BAAuB,CAAC"}

package/dist/hooks/useMediaQuery.js

@@ -0,0 +1,2 @@
+import { useMediaQuery as useMantineMediaQuery } from '@mantine/hooks';
+export const useMediaQuery = useMantineMediaQuery;

package/dist/hooks/useNotifications.d.ts

@@ -0,0 +1,16 @@
+import { componentVariants } from '../components/Info/Notifications/variants';
+export declare const useNotifications: () => {
+    show: (options: {
+        variant?: keyof typeof componentVariants;
+        message: string;
+        title?: string;
+        id?: string;
+    }) => void;
+    showError: () => void;
+    showLoading: (options: {
+        message: string;
+        title?: string;
+    }) => string;
+    hide: (id: string) => Promise<void>;
+};
+//# sourceMappingURL=useNotifications.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useNotifications.d.ts","sourceRoot":"","sources":["../../src/hooks/useNotifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAC;AAE9E,eAAO,MAAM,gBAAgB;oBAMJ;QACrB,OAAO,CAAC,EAAE,MAAM,OAAO,iBAAiB,CAAC;QACzC,OAAO,EAAE,MAAM,CAAC;QAChB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,EAAE,CAAC,EAAE,MAAM,CAAC;KACb;;2BAmB6B;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE;eA7BzC,MAAM;CAiD/B,CAAC"}

package/dist/hooks/useNotifications.js

@@ -0,0 +1,41 @@
+import { notifications as mantineNotifications } from '@mantine/notifications';
+import { componentVariants } from '../components/Info/Notifications/variants';
+export const useNotifications = () => {
+    const hide = async (id) => {
+        mantineNotifications.hide(id);
+        await new Promise((resolve) => setTimeout(resolve, 200));
+    };
+    const show = (options) => {
+        const { variant = 'info', message, title, id } = options;
+        const selectedVariant = componentVariants[variant];
+        mantineNotifications.show({
+            title: title || selectedVariant.defaultTitle,
+            message,
+            icon: selectedVariant.icon,
+            autoClose: selectedVariant.autoClose,
+            id,
+            styles: {
+                root: {
+                    borderLeft: `4px solid ${selectedVariant.color}`,
+                },
+            },
+        });
+    };
+    const showLoading = (options) => {
+        const notificationId = `${Math.random()}-${Math.random()}`;
+        show({
+            id: notificationId,
+            message: options.message,
+            title: options.title,
+            variant: 'loading',
+        });
+        return notificationId;
+    };
+    const showError = () => {
+        show({
+            variant: 'error',
+            message: 'An error has occurred. Please try again. If the issue persists, please contact us at support@taiv.tv',
+        });
+    };
+    return { show, showError, showLoading, hide };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taiv/ui",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "author": "Taiv",
   "description": "Taiv's web UI Toolkit built on Mantine v6",
   "main": "dist/index.js",
@@ -30,8 +30,7 @@
     "typescript": "^5.0.2"
   },
   "exports": {
-    ".": "./dist/index.js",
-    "./core": "./dist/components/index.js",
+    ".": "./dist/components/index.js",
     "./hooks": "./dist/hooks/index.js",
     "./constants": "./dist/constants/index.js"
   }