dhre-component-lib 0.0.7 → 0.0.8

package/dist/components/Enum.d.ts

@@ -0,0 +1,17 @@
+export declare const INPUT_TYPES: {
+    PASSWORD: string;
+    TEXT: string;
+    EMAIL: string;
+    NUMBER: string;
+    DATE: string;
+};
+export declare const DIVIDER_ORIENTATION: {
+    Horizontal: string;
+    Vertical: string;
+};
+export declare const LINK_TARGET: {
+    Self: string;
+    Blank: string;
+    Parent: string;
+    Top: string;
+};

package/dist/components/Enum.js

@@ -0,0 +1,17 @@
+export var INPUT_TYPES = {
+    PASSWORD: 'password',
+    TEXT: 'text',
+    EMAIL: 'email',
+    NUMBER: 'number',
+    DATE: 'date',
+};
+export var DIVIDER_ORIENTATION = {
+    Horizontal: "horizontal",
+    Vertical: "vertical",
+};
+export var LINK_TARGET = {
+    Self: '_self',
+    Blank: '_blank',
+    Parent: '_parent',
+    Top: '_top',
+};

package/dist/components/InputTextField/InputTextField.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+export interface CustomInputFieldProps {
+    label?: string;
+    value?: string;
+    type?: string;
+    placeholder?: string;
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    className?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    error?: string;
+    errorClassName?: string;
+    id?: string;
+}
+declare const CustomInputField: React.FC<CustomInputFieldProps>;
+export default CustomInputField;

package/dist/components/InputTextField/InputTextField.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { INPUT_TYPES } from '../Enum';
+var CustomInputField = function (_a) {
+    var label = _a.label, _b = _a.value, value = _b === void 0 ? '' : _b, _c = _a.type, type = _c === void 0 ? INPUT_TYPES.TEXT : _c, _d = _a.placeholder, placeholder = _d === void 0 ? '' : _d, onChange = _a.onChange, _e = _a.className, className = _e === void 0 ? '' : _e, _f = _a.inputClassName, inputClassName = _f === void 0 ? '' : _f, _g = _a.labelClassName, labelClassName = _g === void 0 ? '' : _g, _h = _a.error, error = _h === void 0 ? '' : _h, _j = _a.errorClassName, errorClassName = _j === void 0 ? '' : _j, rest = __rest(_a, ["label", "value", "type", "placeholder", "onChange", "className", "inputClassName", "labelClassName", "error", "errorClassName"]);
+    return (_jsxs("div", { className: className, children: [label && _jsx("label", { className: labelClassName, children: label }), _jsx("input", __assign({ type: type, value: value, placeholder: placeholder, onChange: onChange, className: inputClassName }, rest)), error && _jsx("div", { className: errorClassName, children: error })] }));
+};
+export default CustomInputField;

package/dist/components/InputTextField/InputTextField.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/InputTextField/InputTextField.test.js

@@ -0,0 +1,97 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen, fireEvent } from '@testing-library/react';
+import CustomInputField from './InputTextField';
+import { INPUT_TYPES } from '../Enum';
+var renderWithProps = function (props) {
+    if (props === void 0) { props = {}; }
+    var defaultProps = __assign({ label: 'Test Label', value: 'Test Value', type: INPUT_TYPES.TEXT, placeholder: 'Enter text...', onChange: jest.fn(), className: 'custom-input-wrapper', inputClassName: 'custom-input', labelClassName: 'custom-label', error: '', errorClassName: 'custom-error', id: 'test-input-field' }, props);
+    return render(_jsx(CustomInputField, __assign({}, defaultProps)));
+};
+describe('CustomInputField Component', function () {
+    // it('renders without crashing', () => {
+    //   renderWithProps();
+    //   // Check if the label correctly associates with the input by using the id
+    //   const input = screen.getByLabelText('Test Label');
+    //   expect(input).toBeInTheDocument();
+    // });
+    it('renders the label correctly', function () {
+        renderWithProps();
+        expect(screen.getByText('Test Label')).toHaveClass('custom-label');
+    });
+    it('renders the input with the correct value', function () {
+        renderWithProps();
+        expect(screen.getByDisplayValue('Test Value')).toHaveClass('custom-input');
+    });
+    it('calls the onChange handler when input value changes', function () {
+        var mockOnChange = jest.fn();
+        renderWithProps({ onChange: mockOnChange });
+        var input = screen.getByDisplayValue('Test Value');
+        fireEvent.change(input, { target: { value: 'New Value' } });
+        expect(mockOnChange).toHaveBeenCalledTimes(1);
+    });
+    it('displays the error message correctly', function () {
+        renderWithProps({ error: 'Error message' });
+        expect(screen.getByText('Error message')).toHaveClass('custom-error');
+    });
+    it('renders the input with the correct type', function () {
+        renderWithProps({ type: INPUT_TYPES.EMAIL });
+        expect(screen.getByPlaceholderText('Enter text...')).toHaveAttribute('type', INPUT_TYPES.EMAIL);
+    });
+    // it('applies the passed className to the wrapper div', () => {
+    //   renderWithProps();
+    //   // Check the class name of the wrapper div
+    //   const wrapper = screen.getByLabelText('Test Label').parentElement?.parentElement;
+    //   expect(wrapper).toHaveClass('custom-input-wrapper');
+    // });
+    it('applies additional props to the input field', function () {
+        renderWithProps();
+        expect(screen.getByPlaceholderText('Enter text...')).toBeInTheDocument();
+    });
+});
+describe('CustomInputField Component - Default Values', function () {
+    it('renders the input field with default value when value prop is not provided', function () {
+        render(_jsx(CustomInputField, { label: "Test Label", type: INPUT_TYPES.TEXT, value: "", onChange: jest.fn() }));
+        expect(screen.getByPlaceholderText('')).toHaveValue('');
+    });
+    it('renders the input field with default type when type prop is not provided', function () {
+        render(_jsx(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
+        expect(screen.getByDisplayValue('Test Value')).toHaveAttribute('type', INPUT_TYPES.TEXT);
+    });
+    it('renders the input field with default placeholder when placeholder prop is not provided', function () {
+        render(_jsx(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
+        expect(screen.getByDisplayValue('Test Value')).toHaveAttribute('placeholder', '');
+    });
+    // it('applies default class names if className, inputClassName, or labelClassName are not provided', () => {
+    //   render(<CustomInputField label="Test Label" value="Test Value" type={INPUT_TYPES.TEXT} onChange={jest.fn()} />);
+    //   // Get the label element
+    //   const label = screen.getByText('Test Label');
+    //   const input = screen.getByDisplayValue('Test Value');
+    //   // Get the parent wrapper div
+    //   const wrapper = label.closest('div');
+    //   // Check if the wrapper div has default class names or no class names
+    //   if (wrapper) {
+    //     // Expect no additional class names or specific default class names
+    //     expect(wrapper).toHaveClass('default-wrapper-class'); // Replace with actual default class
+    //   }
+    //   // Check if the input field has default input class names or no class names
+    //   expect(input).toHaveClass('default-input-class'); // Replace with actual default class
+    //   // Check if the label has default label class names or no class names
+    //   expect(label).toHaveClass('default-label-class'); // Replace with actual default class
+    // });
+    it('does not render the error message if error prop is not provided', function () {
+        render(_jsx(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
+        var errorMessage = screen.queryByText('Error message');
+        expect(errorMessage).not.toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1 @@
+export { default } from "./InputTextField";

package/dist/components/InputTextField/index.js

@@ -0,0 +1 @@
+export { default } from "./InputTextField";

package/dist/components/Link/Link.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface LinkProps {
+    href: string;
+    target?: string;
+    rel?: string;
+    className?: string;
+    children?: React.ReactNode;
+}
+declare const Link: React.FC<LinkProps>;
+export default Link;

package/dist/components/Link/Link.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LINK_TARGET } from '../Enum';
+var Link = function (_a) {
+    var href = _a.href, _b = _a.target, target = _b === void 0 ? LINK_TARGET.Self : _b, rel = _a.rel, _c = _a.className, className = _c === void 0 ? '' : _c, children = _a.children, rest = __rest(_a, ["href", "target", "rel", "className", "children"]);
+    return (_jsx("a", __assign({ href: href, target: target, rel: rel, className: className }, rest, { children: children })));
+};
+export default Link;

package/dist/components/Link/Link.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Link/Link.test.js

@@ -0,0 +1,58 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from '@testing-library/react';
+import Link from './Link';
+import { LINK_TARGET } from '../Enum';
+describe('Link Component', function () {
+    var defaultProps = {
+        href: 'https://example.com',
+        target: LINK_TARGET.Self,
+        rel: 'noopener noreferrer',
+        className: 'custom-link',
+        children: 'Click here',
+    };
+    it('renders the link with the correct href', function () {
+        render(_jsx(Link, __assign({}, defaultProps)));
+        expect(screen.getByText('Click here')).toHaveAttribute('href', 'https://example.com');
+    });
+    it('renders the link with the correct target attribute', function () {
+        render(_jsx(Link, __assign({}, defaultProps)));
+        expect(screen.getByText('Click here')).toHaveAttribute('target', LINK_TARGET.Self);
+    });
+    it('renders the link with the correct rel attribute', function () {
+        render(_jsx(Link, __assign({}, defaultProps)));
+        expect(screen.getByText('Click here')).toHaveAttribute('rel', 'noopener noreferrer');
+    });
+    it('renders the link with the correct className', function () {
+        render(_jsx(Link, __assign({}, defaultProps)));
+        expect(screen.getByText('Click here')).toHaveClass('custom-link');
+    });
+    it('renders the link with the correct children', function () {
+        render(_jsx(Link, __assign({}, defaultProps)));
+        expect(screen.getByText('Click here')).toBeInTheDocument();
+    });
+    it('renders with default target when not specified', function () {
+        var propsWithoutTarget = {
+            href: defaultProps.href,
+            rel: defaultProps.rel,
+            className: defaultProps.className,
+            children: defaultProps.children,
+        };
+        render(_jsx(Link, __assign({}, propsWithoutTarget)));
+        expect(screen.getByText('Click here')).toHaveAttribute('target', LINK_TARGET.Self);
+    });
+    it('applies additional props to the link element', function () {
+        render(_jsx(Link, __assign({}, defaultProps, { "data-testid": "custom-link" })));
+        expect(screen.getByTestId('custom-link')).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1 @@
+export { default } from "./Link";

package/dist/components/Link/index.js

@@ -0,0 +1 @@
+export { default } from "./Link";

package/dist/components/Map/Directions.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface GetDirectionActionProps {
+    title: string;
+    titleClasses?: string;
+    location: string;
+    locationClasses?: string;
+    hours: string;
+    hoursClasses?: string;
+    directionsLink: string;
+    buttonName?: string;
+}
+declare const GetDirectionAction: React.FC<GetDirectionActionProps>;
+export default GetDirectionAction;

package/dist/components/Map/Directions.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var GetDirectionAction = function (_a) {
+    var title = _a.title, titleClasses = _a.titleClasses, location = _a.location, locationClasses = _a.locationClasses, hours = _a.hours, hoursClasses = _a.hoursClasses, directionsLink = _a.directionsLink, _b = _a.buttonName, buttonName = _b === void 0 ? 'Get Directions' : _b;
+    return (_jsxs("div", { className: "direction-action-container", children: [_jsx("h3", { className: titleClasses, children: title }), _jsx("p", { className: locationClasses, children: location }), _jsx("p", { className: hoursClasses, children: hours }), _jsx("a", { href: directionsLink, target: "_blank", rel: "noopener noreferrer", className: "directions-link", children: buttonName })] }));
+};
+export default GetDirectionAction;

package/dist/components/Map/GoogleMap.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface MapComponentProps {
+    containerClassName?: string;
+    zoom?: number;
+    mapOptions?: google.maps.MapOptions;
+    radius?: number;
+    googleMapsUrls: string[];
+    buttonText: string;
+    buttonClassName: string;
+}
+declare const MapComponent: React.FC<MapComponentProps>;
+export default MapComponent;

package/dist/components/Map/GoogleMap.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import { GoogleMap, Marker, Circle, DirectionsRenderer, } from "@react-google-maps/api";
+import { useGoogleMapsLoader } from "./GoogleMapsLoader";
+import styles from './GoogleMap.module.scss';
+var MapComponent = function (_a) {
+    var _b = _a.containerClassName, containerClassName = _b === void 0 ? "map-container" : _b, _c = _a.zoom, zoom = _c === void 0 ? 18 : _c, _d = _a.mapOptions, mapOptions = _d === void 0 ? {
+        zoomControl: true,
+        tilt: 0,
+        gestureHandling: "auto",
+        mapTypeId: "roadmap",
+    } : _d, _e = _a.radius, radius = _e === void 0 ? 5000 : _e, googleMapsUrls = _a.googleMapsUrls, buttonText = _a.buttonText, buttonClassName = _a.buttonClassName;
+    var _f = useState(null), location = _f[0], setLocation = _f[1];
+    var _g = useState(false), mapVisible = _g[0], setMapVisible = _g[1];
+    var _h = useState(null), directionsResponse = _h[0], setDirectionsResponse = _h[1];
+    var mapRef = useRef(null);
+    var directionsService = useRef(null);
+    var directionsRenderer = useRef(null);
+    var handleLocationRequest = function () {
+        if ("geolocation" in navigator) {
+            navigator.geolocation.getCurrentPosition(function (_a) {
+                var coords = _a.coords;
+                var latitude = coords.latitude, longitude = coords.longitude;
+                setLocation({ latitude: latitude, longitude: longitude });
+                setMapVisible(true);
+            }, function () {
+                alert("Failed to get location. Please try again.");
+            });
+        }
+        else {
+            alert("Geolocation is not supported by this browser.");
+        }
+    };
+    var handleMarkerClick = function (lat, lng) {
+        if (location) {
+            var directionsServiceInstance = directionsService.current || new google.maps.DirectionsService();
+            var directionsRendererInstance = directionsRenderer.current || new google.maps.DirectionsRenderer();
+            if (!directionsService.current)
+                directionsService.current = directionsServiceInstance;
+            if (!directionsRenderer.current)
+                directionsRenderer.current = directionsRendererInstance;
+            var directionsRequest = {
+                origin: { lat: location.latitude, lng: location.longitude },
+                destination: { lat: lat, lng: lng },
+                travelMode: google.maps.TravelMode.DRIVING,
+            };
+            directionsService.current.route(directionsRequest, function (result, status) {
+                if (status === google.maps.DirectionsStatus.OK) {
+                    setDirectionsResponse(result);
+                    if (mapRef.current && directionsRenderer.current) {
+                        directionsRenderer.current.setMap(mapRef.current);
+                        directionsRenderer.current.setDirections(result);
+                    }
+                }
+                else {
+                    alert("Failed to get directions. Please try again.");
+                }
+            });
+        }
+    };
+    var extractCoordinatesFromUrl = function (url) {
+        var regex = /@(-?\d+\.\d+),(-?\d+\.\d+)/;
+        var match = url.match(regex);
+        if (match) {
+            return {
+                lat: parseFloat(match[1]),
+                lng: parseFloat(match[2]),
+            };
+        }
+        return null;
+    };
+    var isLoaded = useGoogleMapsLoader().isLoaded;
+    useEffect(function () { }, [isLoaded]);
+    useEffect(function () { }, [mapVisible]);
+    if (!isLoaded) {
+        return _jsx("div", { children: "Loading map..." });
+    }
+    if (mapVisible && location) {
+        return (_jsxs("div", { className: containerClassName, children: [_jsx("button", { onClick: handleLocationRequest, className: buttonClassName, children: buttonText }), _jsxs(GoogleMap, { mapContainerStyle: styles.mapContainerStyle, center: { lat: location.latitude, lng: location.longitude }, zoom: zoom, options: mapOptions, onLoad: function (map) {
+                        mapRef.current = map;
+                        directionsRenderer.current = new google.maps.DirectionsRenderer();
+                        directionsRenderer.current.setMap(map);
+                    }, children: [_jsx(Marker, { position: { lat: location.latitude, lng: location.longitude }, icon: "http://maps.google.com/mapfiles/ms/icons/red-dot.png" }), _jsx(Circle, { center: { lat: location.latitude, lng: location.longitude }, radius: radius, options: {
+                                strokeColor: "#FF0000",
+                                strokeOpacity: 0.8,
+                                strokeWeight: 2,
+                                fillColor: "#FF0000",
+                                fillOpacity: 0,
+                            } }), googleMapsUrls.map(function (url, index) {
+                            var coord = extractCoordinatesFromUrl(url);
+                            if (!coord)
+                                return null;
+                            return (_jsx(Marker, { position: { lat: coord.lat, lng: coord.lng }, title: "Sample Location ".concat(index + 1), icon: "http://maps.google.com/mapfiles/ms/icons/blue-dot.png", onClick: function () { return handleMarkerClick(coord.lat, coord.lng); } }, index));
+                        }), directionsResponse && (_jsx(DirectionsRenderer, { directions: directionsResponse, options: { suppressMarkers: true } }))] })] }));
+    }
+    else {
+        return (_jsx("div", { className: containerClassName, children: _jsx("button", { onClick: handleLocationRequest, className: buttonClassName, children: buttonText }) }));
+    }
+};
+export default MapComponent;

package/dist/components/Map/GoogleMapsLoader.d.ts

@@ -0,0 +1,4 @@
+export declare const useGoogleMapsLoader: () => {
+    isLoaded: boolean;
+    loadError: Error | undefined;
+};

package/dist/components/Map/GoogleMapsLoader.js

@@ -0,0 +1,10 @@
+import { useJsApiLoader } from '@react-google-maps/api';
+var GOOGLE_MAPS_API_KEY = process.env.NEXT_PUBLIC_GOOGLE_MAP_API; // Ensure you are using environment variable
+export var useGoogleMapsLoader = function () {
+    return useJsApiLoader({
+        googleMapsApiKey: GOOGLE_MAPS_API_KEY, // Replace with your API key
+        libraries: ['places', 'drawing', 'geometry'], // Include all libraries you need
+        language: 'en',
+        region: 'US',
+    });
+};

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

@@ -0,0 +1,2 @@
+export { default as Directions } from "./Directions";
+export { default as GoogleMap } from "./GoogleMap";

package/dist/components/Map/index.js

@@ -0,0 +1,2 @@
+export { default as Directions } from "./Directions";
+export { default as GoogleMap } from "./GoogleMap";

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+interface ModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    children: React.ReactNode;
+    modalOverlayClassname?: string;
+    modalContentClassname?: string;
+}
+declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/components/Modal/Modal.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styles from './Modal.module.scss';
+var Modal = function (_a) {
+    var isOpen = _a.isOpen, onClose = _a.onClose, children = _a.children, _b = _a.modalOverlayClassname, modalOverlayClassname = _b === void 0 ? '' : _b, _c = _a.modalContentClassname, modalContentClassname = _c === void 0 ? '' : _c;
+    if (!isOpen)
+        return null;
+    var handleOverlayClick = function (event) {
+        if (event.target === event.currentTarget) {
+            onClose();
+        }
+    };
+    return (_jsx("button", { className: "".concat(styles.modalOverlay, " ").concat(modalOverlayClassname), onClick: handleOverlayClick, children: _jsx("div", { className: "".concat(styles.modalContent, " ").concat(modalContentClassname), children: children }) }));
+};
+export default Modal;

package/dist/components/Modal/Modal.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Modal/Modal.test.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen, fireEvent } from '@testing-library/react';
+import Modal from './Modal';
+describe('Modal Component', function () {
+    var onCloseMock = jest.fn();
+    var modalContentText = 'This is the modal content';
+    var renderModal = function (isOpen, modalOverlayClassname, modalContentClassname) {
+        render(_jsx(Modal, { isOpen: isOpen, onClose: onCloseMock, modalOverlayClassname: modalOverlayClassname, modalContentClassname: modalContentClassname, children: _jsx("div", { children: modalContentText }) }));
+    };
+    afterEach(function () {
+        jest.clearAllMocks();
+    });
+    it('renders the modal when isOpen is true', function () {
+        renderModal(true);
+        expect(screen.getByText(modalContentText)).toBeInTheDocument();
+    });
+    it('does not render the modal when isOpen is false', function () {
+        renderModal(false);
+        expect(screen.queryByText(modalContentText)).not.toBeInTheDocument();
+    });
+    it('calls onClose when clicking on the overlay', function () {
+        renderModal(true);
+        var overlay = screen.getByText(modalContentText).closest('button');
+        fireEvent.click(overlay);
+        expect(onCloseMock).toHaveBeenCalled();
+    });
+    it('does not call onClose when clicking inside the modal content', function () {
+        renderModal(true);
+        var modalContent = screen.getByText(modalContentText);
+        fireEvent.click(modalContent);
+        expect(onCloseMock).not.toHaveBeenCalled();
+    });
+    it('applies the provided modalOverlayClassname', function () {
+        var overlayClass = 'customOverlayClass';
+        renderModal(true, overlayClass);
+        var overlay = screen.getByText(modalContentText).closest('button');
+        expect(overlay).toHaveClass(overlayClass);
+    });
+    it('applies the provided modalContentClassname', function () {
+        var contentClass = 'customContentClass';
+        renderModal(true, undefined, contentClass);
+        var modalContent = screen.getByText(modalContentText);
+        expect(modalContent.parentElement).toHaveClass(contentClass);
+    });
+    it('does not render modal when isOpen is false, even if modalOverlayClassname and modalContentClassname are provided', function () {
+        var overlayClass = 'customOverlayClass';
+        var contentClass = 'customContentClass';
+        renderModal(false, overlayClass, contentClass);
+        expect(screen.queryByText(modalContentText)).not.toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1 @@
+export { default } from "./Modal";

package/dist/components/Modal/index.js

@@ -0,0 +1 @@
+export { default } from "./Modal";

package/dist/components/Notification/Notification.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import './Notification.module.scss';
+export interface NotificationProps {
+    message: string;
+    severity?: 'error' | 'warning' | 'info' | 'success';
+    autoHideDuration?: number;
+    onClose?: (event: React.SyntheticEvent<any> | Event, reason?: string) => void;
+}
+declare const Notification: React.FC<NotificationProps>;
+export default Notification;

package/dist/components/Notification/Notification.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import './Notification.module.scss';
+var Notification = function (_a) {
+    var message = _a.message, _b = _a.severity, severity = _b === void 0 ? 'info' : _b, _c = _a.autoHideDuration, autoHideDuration = _c === void 0 ? 6000 : _c, onClose = _a.onClose;
+    useEffect(function () {
+        if (autoHideDuration && onClose) {
+            var timer_1 = setTimeout(function () {
+                onClose(new Event('timeout'), 'timeout');
+            }, autoHideDuration);
+            return function () { return clearTimeout(timer_1); };
+        }
+    }, [autoHideDuration, onClose]);
+    var handleClose = function (event, reason) {
+        if (onClose) {
+            onClose(event, reason);
+        }
+    };
+    return (_jsxs("div", { className: "notification ".concat(severity), onClick: function (e) { return handleClose(e); }, role: "alert", children: [_jsx("div", { className: "notification-message", children: message }), _jsx("button", { className: "close-button", onClick: function (e) { return handleClose(e, 'close'); }, "aria-label": "Close notification", children: "\u00D7" })] }));
+};
+export default Notification;

package/dist/components/Notification/Notification.test.d.ts

@@ -0,0 +1 @@
+export {};