dhre-component-lib 0.1.7 → 0.1.8

package/dist/components/Tag/Tag.test.js

@@ -1,43 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import Tag from './Tag';
-describe('Tag Component', () => {
-    let handleClick;
-    beforeEach(() => {
-        handleClick = jest.fn(); // Reset the mock function before each test
-    });
-    // Function to generate default props for each test
-    const getDefaultProps = () => ({
-        content: 'Sample Tag',
-        tagClassName: 'tag-class',
-        handleClick,
-    });
-    it('renders the tag with the correct content', () => {
-        render(React.createElement(Tag, { ...getDefaultProps() }));
-        const tagElement = screen.getByText('Sample Tag');
-        expect(tagElement).toBeInTheDocument();
-    });
-    it('applies the correct className to the tag', () => {
-        render(React.createElement(Tag, { ...getDefaultProps() }));
-        const tagElement = screen.getByText('Sample Tag');
-        expect(tagElement).toHaveClass('tag-class');
-    });
-    it('calls the handleClick function when the tag is clicked', () => {
-        render(React.createElement(Tag, { ...getDefaultProps() }));
-        const tagElement = screen.getByText('Sample Tag');
-        fireEvent.click(tagElement);
-        expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-    it('does not call handleClick when the tag is not clicked', () => {
-        render(React.createElement(Tag, { ...getDefaultProps() }));
-        expect(handleClick).not.toHaveBeenCalled();
-    });
-    it('renders correctly with different content', () => {
-        const newContent = 'New Tag Content';
-        render(React.createElement(Tag, { ...getDefaultProps(), content: newContent }));
-        const tagElement = screen.getByText(newContent);
-        expect(tagElement).toBeInTheDocument();
-        expect(tagElement).toHaveTextContent(newContent);
-    });
-});

package/dist/components/Tag/index.js

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

package/dist/components/Tooltip/Tooltip.js

@@ -1,11 +0,0 @@
-import React, { useState } from "react";
-import styles from './Tooltip.module.scss';
-const Tooltip = ({ content, tooltipClassName, children, containerClassName = "", }) => {
-    const [visible, setVisible] = useState(false);
-    const showTooltip = () => setVisible(true);
-    const hideTooltip = () => setVisible(false);
-    return (React.createElement("div", { className: `${styles.tooltipWrapper} ${containerClassName}`, onMouseEnter: showTooltip, onMouseLeave: hideTooltip },
-        children,
-        visible && (React.createElement("div", { className: `${styles.customTooltipClass} ${tooltipClassName}` }, content))));
-};
-export default Tooltip;

package/dist/components/Tooltip/Tooltip.test.js

@@ -1,48 +0,0 @@
-import React from "react";
-import { render, screen, fireEvent } from "@testing-library/react";
-import "@testing-library/jest-dom";
-import Tooltip from "./Tooltip";
-describe("Tooltip Component", () => {
-    const defaultProps = {
-        content: "Tooltip content",
-        tooltipClassName: "tooltip-class",
-        children: React.createElement("button", null, "Hover me"),
-    };
-    it("renders the children correctly", () => {
-        render(React.createElement(Tooltip, { ...defaultProps }));
-        const childElement = screen.getByText("Hover me");
-        expect(childElement).toBeInTheDocument();
-    });
-    it("does not show tooltip content by default", () => {
-        render(React.createElement(Tooltip, { ...defaultProps }));
-        const tooltipElement = screen.queryByText(defaultProps.content);
-        expect(tooltipElement).not.toBeInTheDocument();
-    });
-    it("shows tooltip content on mouse enter and hides it on mouse leave", () => {
-        render(React.createElement(Tooltip, { ...defaultProps }));
-        const childElement = screen.getByText("Hover me");
-        // Trigger mouse enter
-        fireEvent.mouseEnter(childElement);
-        let tooltipElement = screen.queryByText(defaultProps.content);
-        expect(tooltipElement).toBeInTheDocument();
-        expect(tooltipElement).toHaveClass(defaultProps.tooltipClassName);
-        // Trigger mouse leave
-        fireEvent.mouseLeave(childElement);
-        tooltipElement = screen.queryByText(defaultProps.content);
-        // Ensure tooltipElement is null if it was not found
-        expect(tooltipElement).toBeNull();
-    });
-    it("applies the correct container className", () => {
-        const customClassName = "custom-container-class";
-        render(React.createElement(Tooltip, { ...defaultProps, containerClassName: customClassName }));
-        const containerElement = screen.getByText("Hover me").parentElement;
-        expect(containerElement).toHaveClass(customClassName);
-    });
-    it("handles tooltip visibility correctly", () => {
-        render(React.createElement(Tooltip, { ...defaultProps }));
-        const childElement = screen.getByText("Hover me");
-        fireEvent.mouseEnter(childElement);
-        const tooltipElement = screen.queryByText(defaultProps.content);
-        expect(tooltipElement).toBeInTheDocument();
-    });
-});

package/dist/components/Tooltip/index.js

@@ -1,2 +0,0 @@
-export { default } from "./Tooltip";
-import "./Tooltip.module.scss";

package/dist/components/index.d.ts

@@ -1,15 +0,0 @@
-export { default as Button } from "./Button";
-export { default as Avatar } from "./Avatar";
-export { default as Badge } from "./Badge";
-export { default as BreadCrumb } from "./BreadCrumb";
-export { default as Checkbox } from "./Checkbox";
-export { default as CircularProgress } from "./CircularProgress";
-export { default as Divider } from "./Divider";
-export { default as Link } from "./Link";
-export { default as Progress } from "./Progress";
-export { default as RadioButton } from "./RadioButton";
-export { default as InputTextField } from "./InputTextField";
-export { default } from "./PdfView";
-export { default as Directions } from "./Map/Directions";
-export { default as GoogleMap } from "./Map/GoogleMap";
-export { default as OtpInput } from "./OtpInput/OtpInput";

package/dist/components/index.js

@@ -1,15 +0,0 @@
-export { default as Button } from "./Button";
-export { default as Avatar } from "./Avatar";
-export { default as Badge } from "./Badge";
-export { default as BreadCrumb } from "./BreadCrumb";
-export { default as Checkbox } from "./Checkbox";
-export { default as CircularProgress } from "./CircularProgress";
-export { default as Divider } from "./Divider";
-export { default as Link } from "./Link";
-export { default as Progress } from "./Progress";
-export { default as RadioButton } from "./RadioButton";
-export { default as InputTextField } from "./InputTextField";
-export { default } from "./PdfView";
-export { default as Directions } from "./Map/Directions";
-export { default as GoogleMap } from "./Map/GoogleMap";
-export { default as OtpInput } from "./OtpInput/OtpInput";

package/dist/theme/colors.js

@@ -1,2 +0,0 @@
-// format: Color name: BRAND_800
-export const COLORS = {};

package/src/__mocks__/styleMock.js

@@ -1 +0,0 @@
-module.exports = {};

package/src/components/Avatar/Avatar.test.tsx

@@ -1,53 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import Avatar, { AvatarProps } from './Avatar';
-
-describe('Avatar Component', () => {
-  const defaultProps: AvatarProps = {
-    src: 'test-image.jpg',
-    alt: 'Test Avatar',
-    imgClassName: 'avatar-class',
-  };
-
-  it('renders the image with the provided src and alt attributes', () => {
-    render(<Avatar {...defaultProps} />);
-    
-    const imgElement = screen.getByAltText(defaultProps.alt);
-    
-    expect(imgElement).toHaveAttribute('src', defaultProps.src);
-    expect(imgElement).toHaveAttribute('alt', defaultProps.alt);
-  });
-
-  it('applies the correct className to the image', () => {
-    render(<Avatar {...defaultProps} />);
-    
-    const imgElement = screen.getByAltText(defaultProps.alt);
-    
-    expect(imgElement).toHaveClass(defaultProps.imgClassName);
-  });
-
-  it('handles the onClick event correctly', () => {
-    const handleClick = jest.fn();
-    render(<Avatar {...defaultProps} handleClick={handleClick} />);
-    
-    const imgElement = screen.getByAltText(defaultProps.alt);
-    fireEvent.click(imgElement);
-    
-    expect(handleClick).toHaveBeenCalledTimes(1);
-  });
-
-  it('does not crash without handleClick prop', () => {
-    render(<Avatar {...defaultProps} />);
-    
-    const imgElement = screen.getByAltText(defaultProps.alt);
-    expect(() => fireEvent.click(imgElement)).not.toThrow();
-  });
-
-  it('renders correctly without crashing', () => {
-    render(<Avatar {...defaultProps} />);
-    
-    const imgElement = screen.getByAltText(defaultProps.alt);
-    expect(imgElement).toBeInTheDocument();
-  });
-});

package/src/components/Avatar/Avatar.tsx

@@ -1,28 +0,0 @@
-import React from "react";
-
-export interface AvatarProps {
-  src: string;
-  alt: string;
-  imgClassName: string;
-  handleClick?: () => void;
-}
-
-const Avatar: React.FC<AvatarProps> = ({
-  src,
-  alt,
-  imgClassName,
-  handleClick,
-}) => {
-  return (
-    <button onClick={handleClick}>
-    <img
-          src={src}
-          alt={alt}
-          
-          className={imgClassName}
-        />
-    </button>
-  );
-};
-
-export default Avatar;

package/src/components/Avatar/index.ts

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

package/src/components/Badge/Badge.test.tsx

@@ -1,59 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import Badge, { BadgeProps } from './Badge';
-
-describe('Badge Component', () => {
-  const defaultProps: BadgeProps = {
-    content: 'Test Badge',
-    badgeClassName: 'badge-class',
-  };
-
-  it('renders the badge with the provided content', () => {
-    render(<Badge {...defaultProps} />);
-    
-    const badgeElement = screen.getByText(defaultProps.content as string);
-    
-    expect(badgeElement).toBeInTheDocument();
-  });
-
-  it('handles the onClick event correctly', () => {
-    const handleClick = jest.fn();
-    render(<Badge {...defaultProps} handleClick={handleClick} />);
-    
-    const badgeElement = screen.getByText(defaultProps.content as string);
-    fireEvent.click(badgeElement);
-    
-    expect(handleClick).toHaveBeenCalledTimes(1);
-  });
-
-  it('does not crash without handleClick prop', () => {
-    render(<Badge {...defaultProps} />);
-    
-    const badgeElement = screen.getByText(defaultProps.content as string);
-    expect(() => fireEvent.click(badgeElement)).not.toThrow();
-  });
-
-  it('renders correctly with numeric content', () => {
-    const numericProps: BadgeProps = {
-      ...defaultProps,
-      content: 99,
-    };
-    render(<Badge {...numericProps} />);
-    
-    const badgeElement = screen.getByText(numericProps.content.toString());
-    
-    expect(badgeElement).toBeInTheDocument();
-    expect(badgeElement).toHaveTextContent('99');
-  });
-
-  it('renders correctly with different content', () => {
-    const newContent = 'Updated Badge';
-    render(<Badge {...defaultProps} content={newContent} />);
-    
-    const badgeElement = screen.getByText(newContent);
-    
-    expect(badgeElement).toBeInTheDocument();
-    expect(badgeElement).toHaveTextContent(newContent);
-  });
-});

package/src/components/Badge/Badge.tsx

@@ -1,25 +0,0 @@
-import React from "react";
-import styles from './Badge.module.scss';
-
-export interface BadgeProps {
-  content: string | number; 
-  badgeClassName?: string;   
-  handleClick?: () => void; 
-}
-
-const Badge: React.FC<BadgeProps> = ({
-  content,
-  badgeClassName,
-  handleClick,
-}) => {
-  return (
-    <button 
-      onClick={handleClick} 
-      className={`${styles.badge} ${badgeClassName}`}
-    >
-      {content}
-    </button>
-  );
-};
-
-export default Badge;

package/src/components/Badge/index.ts

@@ -1,2 +0,0 @@
-export { default } from "./Badge";
-import "./Badge.module.scss"

package/src/components/BreadCrumb/BreadCrumb.test.tsx

@@ -1,90 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import Breadcrumb from './BreadCrumb';
-
-describe('Breadcrumb', () => {
-  it('should render with given props', () => {
-    const items = [
-      { label: 'Home', handleClick: () => {} },
-      { label: 'Library' },
-      { label: 'Data' },
-    ];
-
-    render(
-      <Breadcrumb
-        items={items}
-        breadcrumbClassName="breadcrumb-class"
-        itemClassName="item-class"
-        separator=">"
-        separatorClassName="separator-class"
-      />
-    );
-
-    // Check if breadcrumb container is rendered
-    const breadcrumb = screen.getByRole('navigation');
-    expect(breadcrumb).toBeInTheDocument();
-    expect(breadcrumb).toHaveClass('breadcrumb-class');
-
-    // Check if breadcrumb items are rendered
-    items.forEach((item) => {
-      const itemElement = screen.getByText(item.label);
-      expect(itemElement).toBeInTheDocument();
-      expect(itemElement).toHaveClass('item-class');
-    });
-
-    // Check if separators are rendered
-    const separators = screen.getAllByText('>');
-    expect(separators.length).toBe(items.length - 1);
-    separators.forEach(separator => expect(separator).toHaveClass('separator-class'));
-  });
-
-  it('should call handleClick when a breadcrumb item is clicked', () => {
-    const handleClick = jest.fn();
-    const items = [
-      { label: 'Home', handleClick },
-      { label: 'Library' },
-    ];
-
-    render(
-      <Breadcrumb
-        items={items}
-        breadcrumbClassName="breadcrumb-class"
-        itemClassName="item-class"
-        separator=">"
-        separatorClassName="separator-class"
-      />
-    );
-
-    const homeItem = screen.getByText('Home');
-    fireEvent.click(homeItem);
-
-    expect(handleClick).toHaveBeenCalled();
-  });
-
-  it('should render without separators if none are provided', () => {
-    const items = [
-      { label: 'Home' },
-      { label: 'Library' },
-    ];
-
-    render(
-      <Breadcrumb
-        items={items}
-        breadcrumbClassName="breadcrumb-class"
-        itemClassName="item-class"
-        separator=""  // Pass an empty string for separator
-      />
-    );
-
-    // Check if breadcrumb items are rendered
-    items.forEach((item) => {
-      const itemElement = screen.getByText(item.label);
-      expect(itemElement).toBeInTheDocument();
-    });
-
-    // Check that no separators are present by querying with the separator class name
-    const separators = screen.queryAllByRole('presentation');
-    expect(separators.length).toBe(0);
-  });
-});

package/src/components/BreadCrumb/BreadCrumb.tsx

@@ -1,45 +0,0 @@
-import React from "react";
-import styles from './Breadcrumb.module.scss';
-
-export interface BreadcrumbItem {
-  label: string;           
-  handleClick?: () => void; 
-}
-
-export interface BreadcrumbProps {
-  items: BreadcrumbItem[];  
-  breadcrumbClassName: string; 
-  itemClassName?: string;      
-  separator?: string;   
-  separatorClassName?: string;       
-}
-
-const Breadcrumb: React.FC<BreadcrumbProps> = ({
-  items,
-  breadcrumbClassName,
-  itemClassName,
-  separator = "/",
-  separatorClassName,
-}) => {
-  return (
-    <nav className={`${styles.breadcrumb} ${breadcrumbClassName}`}>
-      {items.map((item, index) => (
-        <React.Fragment key={index}>
-          <button 
-            className={`${styles.breadcrumbItem} ${itemClassName}`} 
-            onClick={item.handleClick}
-          >
-            {item.label}
-          </button>
-          {index < items.length - 1 && (
-            <span className={`${styles.separator} ${separatorClassName}`}>
-              {separator}
-            </span>
-          )}
-        </React.Fragment>
-      ))}
-    </nav>
-  );
-};
-
-export default Breadcrumb;

package/src/components/BreadCrumb/index.ts

@@ -1,2 +0,0 @@
-export { default } from "./BreadCrumb";
-import "./Breadcrumb.module.scss";

package/src/components/Button/Button.test.tsx

@@ -1,49 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import Button, { ButtonProps } from './Button';
-
-describe('Button Component', () => {
-  let handleClick: jest.Mock;
-
-  beforeEach(() => {
-    handleClick = jest.fn(); // Initialize the mock function before each test
-  });
-
-  const renderButton = (props: Partial<ButtonProps> = {}) => {
-    const defaultProps: ButtonProps = {
-      label: 'Click Me',
-      variant: 'contained',
-      color: 'primary',
-      size: 'small',
-      handleClick: handleClick
-    };
-
-    return render(<Button {...defaultProps} />);
-  };
-
-  it('renders the button with the correct label', () => {
-    renderButton();
-    
-    const buttonElement = screen.getByText('Click Me');
-    
-    expect(buttonElement).toBeInTheDocument();
-    expect(buttonElement.tagName).toBe('BUTTON');
-  });
-
-  it('calls the handleClick function when the button is clicked', () => {
-    renderButton();
-    
-    const buttonElement = screen.getByText('Click Me');
-    
-    fireEvent.click(buttonElement);
-    
-    expect(handleClick).toHaveBeenCalledTimes(1); // Ensure the mock function is called once
-  });
-
-  it('does not call handleClick when the button is not clicked', () => {
-    renderButton();
-    
-    expect(handleClick).not.toHaveBeenCalled();
-  });
-});

package/src/components/Button/Button.tsx

@@ -1,29 +0,0 @@
-import React from "react";
-import styles from './Button.module.scss';
-
-export interface ButtonProps {  
-  label: string;
-  variant: 'text' | 'outlined' | 'contained';  
-  color: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info';
-  size: 'small' | 'medium' | 'large';
-  handleClick: () => void;
-}
-
-const Button: React.FC<ButtonProps> = ({  
-  label,
-  variant,
-  color,
-  size,
-  handleClick,  
-}) => {
-  return (
-    <button 
-      onClick={handleClick} 
-      className={`${styles.button} ${styles[variant]} ${styles[color]} ${styles[size]}`}
-    >
-      {label}
-    </button>
-  );
-};
-
-export default Button;

package/src/components/Button/index.ts

@@ -1,2 +0,0 @@
-export { default } from "./Button";
-import "./Button.module.scss"

package/src/components/Checkbox/Checkbox.test.tsx

@@ -1,93 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import CustomCheckbox from './Checkbox';
-
-interface CustomCheckboxProps {
-  label?: string;
-  checked?: boolean;
-  onChange?: React.ChangeEventHandler<HTMLInputElement>;
-  className?: string;
-  checkboxClassName?: string;
-  labelClassName?: string;
-}
-
-describe('CustomCheckbox Component', () => {
-  let handleChange: jest.Mock;
-
-  // Function to generate default props for each test
-  const getDefaultProps = (): CustomCheckboxProps => ({
-    label: 'Accept Terms',
-    checked: false,
-    onChange: handleChange,
-    className: 'custom-container',
-    checkboxClassName: 'custom-checkbox',
-    labelClassName: 'custom-label',
-  });
-
-  beforeEach(() => {
-    handleChange = jest.fn();  // Reset the mock function before each test
-  });
-
-  it('renders the checkbox with a label', () => {
-    render(<CustomCheckbox {...getDefaultProps()} />);
-    
-    const checkboxElement = screen.getByRole('checkbox');
-    const labelElement = screen.getByText('Accept Terms');
-    
-    expect(checkboxElement).toBeInTheDocument();
-    expect(labelElement).toBeInTheDocument();
-  });
-
-  it('applies the correct className to the checkbox container', () => {
-    render(<CustomCheckbox {...getDefaultProps()} />);
-    
-    const container = screen.getByRole('checkbox').parentElement;
-    
-    expect(container).toHaveClass('custom-container');
-  });
-
-  it('applies the correct className to the checkbox', () => {
-    render(<CustomCheckbox {...getDefaultProps()} />);
-    
-    const checkboxElement = screen.getByRole('checkbox');
-    
-    expect(checkboxElement).toHaveClass('custom-checkbox');
-  });
-
-  it('applies the correct className to the label', () => {
-    render(<CustomCheckbox {...getDefaultProps()} />);
-    
-    const labelElement = screen.getByText('Accept Terms');
-    
-    expect(labelElement).toHaveClass('custom-label');
-  });
-
-  it('checks the checkbox based on the checked prop', () => {
-    render(<CustomCheckbox {...getDefaultProps()} checked={true} />);
-    
-    const checkboxElement = screen.getByRole('checkbox');
-    
-    expect(checkboxElement).toBeChecked();
-  });
-
-  it('calls the onChange function when the checkbox state changes', () => {
-    render(<CustomCheckbox {...getDefaultProps()} checked={false} />);
-    
-    const checkboxElement = screen.getByRole('checkbox');
-    
-    fireEvent.click(checkboxElement);  // Toggle the checkbox
-    
-    expect(handleChange).toHaveBeenCalledTimes(1);
-  });
-
-  it('renders correctly with different label', () => {
-    const newLabel = 'Agree to Privacy Policy';
-    render(<CustomCheckbox {...getDefaultProps()} label={newLabel} />);
-    
-    const labelElement = screen.getByText(newLabel);
-    
-    expect(labelElement).toBeInTheDocument();
-    expect(labelElement).toHaveTextContent(newLabel);
-  });
-});