dhre-component-lib 0.1.7 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (158) hide show
  1. package/{src/components/Badge → dist}/Badge.module.scss +0 -1
  2. package/{src/components/BreadCrumb → dist}/Breadcrumb.module.scss +0 -3
  3. package/{src/components/Button → dist}/Button.module.scss +3 -16
  4. package/{src/components/CircularProgress → dist}/CircularProgress.module.scss +0 -1
  5. package/dist/assets/output-4Fi7j5sB.css +247 -0
  6. package/dist/components/Badge/index.d.ts +0 -1
  7. package/dist/components/BreadCrumb/index.d.ts +0 -1
  8. package/dist/components/Button/index.d.ts +0 -1
  9. package/dist/components/CircularProgress/index.d.ts +0 -1
  10. package/dist/components/Map/index.d.ts +0 -1
  11. package/dist/components/Modal/index.d.ts +0 -1
  12. package/dist/components/Notification/index.d.ts +0 -1
  13. package/dist/components/OtpInput/index.d.ts +0 -1
  14. package/dist/components/PdfView/index.d.ts +0 -1
  15. package/dist/components/Tooltip/index.d.ts +0 -1
  16. package/dist/dist/styles.css +2 -0
  17. package/dist/dist/styles.css.map +1 -0
  18. package/dist/index.d.ts +15 -1
  19. package/dist/index.esm.js +9323 -0
  20. package/dist/index.esm.js.map +1 -0
  21. package/dist/index.js +9359 -1
  22. package/dist/index.js.map +1 -0
  23. package/package.json +8 -7
  24. package/dist/components/Avatar/Avatar.js +0 -6
  25. package/dist/components/Avatar/Avatar.test.js +0 -39
  26. package/dist/components/Avatar/index.js +0 -1
  27. package/dist/components/Badge/Badge.js +0 -6
  28. package/dist/components/Badge/Badge.test.js +0 -44
  29. package/dist/components/Badge/index.js +0 -2
  30. package/dist/components/BreadCrumb/BreadCrumb.js +0 -8
  31. package/dist/components/BreadCrumb/BreadCrumb.test.js +0 -55
  32. package/dist/components/BreadCrumb/index.js +0 -2
  33. package/dist/components/Button/Button.js +0 -6
  34. package/dist/components/Button/Button.test.js +0 -36
  35. package/dist/components/Button/index.js +0 -2
  36. package/dist/components/Checkbox/Checkbox.js +0 -7
  37. package/dist/components/Checkbox/Checkbox.test.js +0 -59
  38. package/dist/components/Checkbox/index.js +0 -1
  39. package/dist/components/CircularProgress/CircularProgress.js +0 -15
  40. package/dist/components/CircularProgress/CircularProgress.test.js +0 -31
  41. package/dist/components/CircularProgress/index.js +0 -2
  42. package/dist/components/Divider/Divider.js +0 -7
  43. package/dist/components/Divider/Divider.test.js +0 -30
  44. package/dist/components/Divider/index.js +0 -1
  45. package/dist/components/Enum.js +0 -17
  46. package/dist/components/InputTextField/InputTextField.js +0 -9
  47. package/dist/components/InputTextField/InputTextField.test.js +0 -98
  48. package/dist/components/InputTextField/index.js +0 -1
  49. package/dist/components/Link/Link.js +0 -6
  50. package/dist/components/Link/Link.test.js +0 -47
  51. package/dist/components/Link/index.js +0 -1
  52. package/dist/components/Map/Directions.js +0 -9
  53. package/dist/components/Map/GoogleMap.js +0 -104
  54. package/dist/components/Map/GoogleMapsLoader.js +0 -10
  55. package/dist/components/Map/index.js +0 -3
  56. package/dist/components/Modal/Modal.js +0 -14
  57. package/dist/components/Modal/Modal.test.js +0 -52
  58. package/dist/components/Modal/index.js +0 -2
  59. package/dist/components/Notification/Notification.js +0 -21
  60. package/dist/components/Notification/Notification.test.js +0 -40
  61. package/dist/components/Notification/index.js +0 -2
  62. package/dist/components/OtpInput/OtpInput.js +0 -68
  63. package/dist/components/OtpInput/OtpInput.test.js +0 -36
  64. package/dist/components/OtpInput/index.js +0 -2
  65. package/dist/components/PdfView/PdfView.js +0 -59
  66. package/dist/components/PdfView/PdfView.test.js +0 -41
  67. package/dist/components/PdfView/index.js +0 -2
  68. package/dist/components/Progress/Progress.js +0 -9
  69. package/dist/components/Progress/Progress.test.js +0 -34
  70. package/dist/components/Progress/index.js +0 -1
  71. package/dist/components/RadioButton/RadioButton.js +0 -7
  72. package/dist/components/RadioButton/RadioButton.test.js +0 -29
  73. package/dist/components/RadioButton/index.js +0 -1
  74. package/dist/components/Switch/Switch.js +0 -10
  75. package/dist/components/Switch/Switch.test.js +0 -45
  76. package/dist/components/Switch/index.js +0 -1
  77. package/dist/components/Tag/Tag.js +0 -6
  78. package/dist/components/Tag/Tag.test.js +0 -43
  79. package/dist/components/Tag/index.js +0 -1
  80. package/dist/components/Tooltip/Tooltip.js +0 -11
  81. package/dist/components/Tooltip/Tooltip.test.js +0 -48
  82. package/dist/components/Tooltip/index.js +0 -2
  83. package/dist/components/index.d.ts +0 -15
  84. package/dist/components/index.js +0 -15
  85. package/dist/theme/colors.js +0 -2
  86. package/src/__mocks__/styleMock.js +0 -1
  87. package/src/components/Avatar/Avatar.test.tsx +0 -53
  88. package/src/components/Avatar/Avatar.tsx +0 -28
  89. package/src/components/Avatar/index.ts +0 -1
  90. package/src/components/Badge/Badge.test.tsx +0 -59
  91. package/src/components/Badge/Badge.tsx +0 -25
  92. package/src/components/Badge/index.ts +0 -2
  93. package/src/components/BreadCrumb/BreadCrumb.test.tsx +0 -90
  94. package/src/components/BreadCrumb/BreadCrumb.tsx +0 -45
  95. package/src/components/BreadCrumb/index.ts +0 -2
  96. package/src/components/Button/Button.test.tsx +0 -49
  97. package/src/components/Button/Button.tsx +0 -29
  98. package/src/components/Button/index.ts +0 -2
  99. package/src/components/Checkbox/Checkbox.test.tsx +0 -93
  100. package/src/components/Checkbox/Checkbox.tsx +0 -35
  101. package/src/components/Checkbox/index.ts +0 -1
  102. package/src/components/CircularProgress/CircularProgress.test.tsx +0 -39
  103. package/src/components/CircularProgress/CircularProgress.tsx +0 -37
  104. package/src/components/CircularProgress/index.ts +0 -2
  105. package/src/components/Divider/Divider.test.tsx +0 -44
  106. package/src/components/Divider/Divider.tsx +0 -24
  107. package/src/components/Divider/index.ts +0 -1
  108. package/src/components/Enum.ts +0 -19
  109. package/src/components/InputTextField/InputTextField.test.tsx +0 -118
  110. package/src/components/InputTextField/InputTextField.tsx +0 -48
  111. package/src/components/InputTextField/index.ts +0 -1
  112. package/src/components/Link/Link.test.tsx +0 -55
  113. package/src/components/Link/Link.tsx +0 -33
  114. package/src/components/Link/index.ts +0 -1
  115. package/src/components/Map/Directions.tsx +0 -36
  116. package/src/components/Map/GoogleMap.tsx +0 -186
  117. package/src/components/Map/GoogleMapsLoader.tsx +0 -12
  118. package/src/components/Map/index.ts +0 -3
  119. package/src/components/Modal/Modal.test.tsx +0 -74
  120. package/src/components/Modal/Modal.tsx +0 -39
  121. package/src/components/Modal/index.ts +0 -2
  122. package/src/components/Notification/Notification.test.tsx +0 -53
  123. package/src/components/Notification/Notification.tsx +0 -42
  124. package/src/components/Notification/index.ts +0 -2
  125. package/src/components/OtpInput/OtpInput.test.tsx +0 -53
  126. package/src/components/OtpInput/OtpInput.tsx +0 -137
  127. package/src/components/OtpInput/index.ts +0 -2
  128. package/src/components/PdfView/PdfView.test.tsx +0 -52
  129. package/src/components/PdfView/PdfView.tsx +0 -116
  130. package/src/components/PdfView/index.ts +0 -2
  131. package/src/components/Progress/Progress.test.tsx +0 -43
  132. package/src/components/Progress/Progress.tsx +0 -35
  133. package/src/components/Progress/index.ts +0 -1
  134. package/src/components/RadioButton/RadioButton.test.tsx +0 -56
  135. package/src/components/RadioButton/RadioButton.tsx +0 -43
  136. package/src/components/RadioButton/index.ts +0 -1
  137. package/src/components/Switch/Switch.test.tsx +0 -83
  138. package/src/components/Switch/Switch.tsx +0 -38
  139. package/src/components/Switch/index.ts +0 -1
  140. package/src/components/Tag/Tag.css +0 -14
  141. package/src/components/Tag/Tag.test.tsx +0 -61
  142. package/src/components/Tag/Tag.tsx +0 -19
  143. package/src/components/Tag/index.ts +0 -1
  144. package/src/components/Tooltip/Tooltip.test.tsx +0 -68
  145. package/src/components/Tooltip/Tooltip.tsx +0 -38
  146. package/src/components/Tooltip/index.ts +0 -2
  147. package/src/components/index.ts +0 -15
  148. package/src/index.ts +0 -1
  149. package/src/theme/colors.ts +0 -3
  150. package/src/typings.d.ts +0 -1
  151. /package/{src/components/Map → dist}/GoogleMap.module.scss +0 -0
  152. /package/{src/components/Modal → dist}/Modal.module.scss +0 -0
  153. /package/{src/components/Notification → dist}/Notification.module.scss +0 -0
  154. /package/{src/components/OtpInput → dist}/OtpInput.module.scss +0 -0
  155. /package/{src/components/PdfView → dist}/PdfView.module.scss +0 -0
  156. /package/{src/components/Tooltip → dist}/Tooltip.module.scss +0 -0
  157. /package/{src/theme/colors → dist}/colors.scss +0 -0
  158. /package/{src/theme/Typography → dist}/typography.scss +0 -0
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "dhre-component-lib",
3
- "version": "0.1.7",
3
+ "version": "0.1.8",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "test": "jest",
7
7
  "rollup": "rollup -c",
8
8
  "test:coverage": "jest --coverage",
9
- "build": "tsc"
9
+ "build": "rollup -c"
10
10
  },
11
11
  "author": "",
12
12
  "license": "ISC",
@@ -45,6 +45,8 @@
45
45
  "@mui/icons-material": "^5.16.7",
46
46
  "@mui/material": "^5.16.7",
47
47
  "@react-google-maps/api": "^2.19.3",
48
+ "rollup-plugin-copy": "^3.5.0",
49
+ "rollup-plugin-postcss": "^4.0.2",
48
50
  "tslib": "^2.6.3"
49
51
  },
50
52
  "peerDependencies": {
@@ -52,9 +54,9 @@
52
54
  "react-dom": "^18.3.1"
53
55
  },
54
56
  "main": "dist/index.js",
55
- "module": "dist/esm/index.js",
57
+ "module": "dist/index.esm.js",
56
58
  "types": "dist/index.d.ts",
57
- "styles": "dist/styles.css",
59
+ "type": "module",
58
60
  "keywords": [
59
61
  "react",
60
62
  "components",
@@ -62,7 +64,6 @@
62
64
  "scss"
63
65
  ],
64
66
  "files": [
65
- "dist",
66
- "src"
67
- ]
67
+ "dist"
68
+ ]
68
69
  }
@@ -1,6 +0,0 @@
1
- import React from "react";
2
- const Avatar = ({ src, alt, imgClassName, handleClick, }) => {
3
- return (React.createElement("button", { onClick: handleClick },
4
- React.createElement("img", { src: src, alt: alt, className: imgClassName })));
5
- };
6
- export default Avatar;
@@ -1,39 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import '@testing-library/jest-dom';
4
- import Avatar from './Avatar';
5
- describe('Avatar Component', () => {
6
- const defaultProps = {
7
- src: 'test-image.jpg',
8
- alt: 'Test Avatar',
9
- imgClassName: 'avatar-class',
10
- };
11
- it('renders the image with the provided src and alt attributes', () => {
12
- render(React.createElement(Avatar, { ...defaultProps }));
13
- const imgElement = screen.getByAltText(defaultProps.alt);
14
- expect(imgElement).toHaveAttribute('src', defaultProps.src);
15
- expect(imgElement).toHaveAttribute('alt', defaultProps.alt);
16
- });
17
- it('applies the correct className to the image', () => {
18
- render(React.createElement(Avatar, { ...defaultProps }));
19
- const imgElement = screen.getByAltText(defaultProps.alt);
20
- expect(imgElement).toHaveClass(defaultProps.imgClassName);
21
- });
22
- it('handles the onClick event correctly', () => {
23
- const handleClick = jest.fn();
24
- render(React.createElement(Avatar, { ...defaultProps, handleClick: handleClick }));
25
- const imgElement = screen.getByAltText(defaultProps.alt);
26
- fireEvent.click(imgElement);
27
- expect(handleClick).toHaveBeenCalledTimes(1);
28
- });
29
- it('does not crash without handleClick prop', () => {
30
- render(React.createElement(Avatar, { ...defaultProps }));
31
- const imgElement = screen.getByAltText(defaultProps.alt);
32
- expect(() => fireEvent.click(imgElement)).not.toThrow();
33
- });
34
- it('renders correctly without crashing', () => {
35
- render(React.createElement(Avatar, { ...defaultProps }));
36
- const imgElement = screen.getByAltText(defaultProps.alt);
37
- expect(imgElement).toBeInTheDocument();
38
- });
39
- });
@@ -1 +0,0 @@
1
- export { default } from "./Avatar";
@@ -1,6 +0,0 @@
1
- import React from "react";
2
- import styles from './Badge.module.scss';
3
- const Badge = ({ content, badgeClassName, handleClick, }) => {
4
- return (React.createElement("button", { onClick: handleClick, className: `${styles.badge} ${badgeClassName}` }, content));
5
- };
6
- export default Badge;
@@ -1,44 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import '@testing-library/jest-dom';
4
- import Badge from './Badge';
5
- describe('Badge Component', () => {
6
- const defaultProps = {
7
- content: 'Test Badge',
8
- badgeClassName: 'badge-class',
9
- };
10
- it('renders the badge with the provided content', () => {
11
- render(React.createElement(Badge, { ...defaultProps }));
12
- const badgeElement = screen.getByText(defaultProps.content);
13
- expect(badgeElement).toBeInTheDocument();
14
- });
15
- it('handles the onClick event correctly', () => {
16
- const handleClick = jest.fn();
17
- render(React.createElement(Badge, { ...defaultProps, handleClick: handleClick }));
18
- const badgeElement = screen.getByText(defaultProps.content);
19
- fireEvent.click(badgeElement);
20
- expect(handleClick).toHaveBeenCalledTimes(1);
21
- });
22
- it('does not crash without handleClick prop', () => {
23
- render(React.createElement(Badge, { ...defaultProps }));
24
- const badgeElement = screen.getByText(defaultProps.content);
25
- expect(() => fireEvent.click(badgeElement)).not.toThrow();
26
- });
27
- it('renders correctly with numeric content', () => {
28
- const numericProps = {
29
- ...defaultProps,
30
- content: 99,
31
- };
32
- render(React.createElement(Badge, { ...numericProps }));
33
- const badgeElement = screen.getByText(numericProps.content.toString());
34
- expect(badgeElement).toBeInTheDocument();
35
- expect(badgeElement).toHaveTextContent('99');
36
- });
37
- it('renders correctly with different content', () => {
38
- const newContent = 'Updated Badge';
39
- render(React.createElement(Badge, { ...defaultProps, content: newContent }));
40
- const badgeElement = screen.getByText(newContent);
41
- expect(badgeElement).toBeInTheDocument();
42
- expect(badgeElement).toHaveTextContent(newContent);
43
- });
44
- });
@@ -1,2 +0,0 @@
1
- export { default } from "./Badge";
2
- import "./Badge.module.scss";
@@ -1,8 +0,0 @@
1
- import React from "react";
2
- import styles from './Breadcrumb.module.scss';
3
- const Breadcrumb = ({ items, breadcrumbClassName, itemClassName, separator = "/", separatorClassName, }) => {
4
- return (React.createElement("nav", { className: `${styles.breadcrumb} ${breadcrumbClassName}` }, items.map((item, index) => (React.createElement(React.Fragment, { key: index },
5
- React.createElement("button", { className: `${styles.breadcrumbItem} ${itemClassName}`, onClick: item.handleClick }, item.label),
6
- index < items.length - 1 && (React.createElement("span", { className: `${styles.separator} ${separatorClassName}` }, separator)))))));
7
- };
8
- export default Breadcrumb;
@@ -1,55 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import '@testing-library/jest-dom';
4
- import Breadcrumb from './BreadCrumb';
5
- describe('Breadcrumb', () => {
6
- it('should render with given props', () => {
7
- const items = [
8
- { label: 'Home', handleClick: () => { } },
9
- { label: 'Library' },
10
- { label: 'Data' },
11
- ];
12
- render(React.createElement(Breadcrumb, { items: items, breadcrumbClassName: "breadcrumb-class", itemClassName: "item-class", separator: ">", separatorClassName: "separator-class" }));
13
- // Check if breadcrumb container is rendered
14
- const breadcrumb = screen.getByRole('navigation');
15
- expect(breadcrumb).toBeInTheDocument();
16
- expect(breadcrumb).toHaveClass('breadcrumb-class');
17
- // Check if breadcrumb items are rendered
18
- items.forEach((item) => {
19
- const itemElement = screen.getByText(item.label);
20
- expect(itemElement).toBeInTheDocument();
21
- expect(itemElement).toHaveClass('item-class');
22
- });
23
- // Check if separators are rendered
24
- const separators = screen.getAllByText('>');
25
- expect(separators.length).toBe(items.length - 1);
26
- separators.forEach(separator => expect(separator).toHaveClass('separator-class'));
27
- });
28
- it('should call handleClick when a breadcrumb item is clicked', () => {
29
- const handleClick = jest.fn();
30
- const items = [
31
- { label: 'Home', handleClick },
32
- { label: 'Library' },
33
- ];
34
- render(React.createElement(Breadcrumb, { items: items, breadcrumbClassName: "breadcrumb-class", itemClassName: "item-class", separator: ">", separatorClassName: "separator-class" }));
35
- const homeItem = screen.getByText('Home');
36
- fireEvent.click(homeItem);
37
- expect(handleClick).toHaveBeenCalled();
38
- });
39
- it('should render without separators if none are provided', () => {
40
- const items = [
41
- { label: 'Home' },
42
- { label: 'Library' },
43
- ];
44
- render(React.createElement(Breadcrumb, { items: items, breadcrumbClassName: "breadcrumb-class", itemClassName: "item-class", separator: "" // Pass an empty string for separator
45
- }));
46
- // Check if breadcrumb items are rendered
47
- items.forEach((item) => {
48
- const itemElement = screen.getByText(item.label);
49
- expect(itemElement).toBeInTheDocument();
50
- });
51
- // Check that no separators are present by querying with the separator class name
52
- const separators = screen.queryAllByRole('presentation');
53
- expect(separators.length).toBe(0);
54
- });
55
- });
@@ -1,2 +0,0 @@
1
- export { default } from "./BreadCrumb";
2
- import "./Breadcrumb.module.scss";
@@ -1,6 +0,0 @@
1
- import React from "react";
2
- import styles from './Button.module.scss';
3
- const Button = ({ label, variant, color, size, handleClick, }) => {
4
- return (React.createElement("button", { onClick: handleClick, className: `${styles.button} ${styles[variant]} ${styles[color]} ${styles[size]}` }, label));
5
- };
6
- export default Button;
@@ -1,36 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import '@testing-library/jest-dom';
4
- import Button from './Button';
5
- describe('Button Component', () => {
6
- let handleClick;
7
- beforeEach(() => {
8
- handleClick = jest.fn(); // Initialize the mock function before each test
9
- });
10
- const renderButton = (props = {}) => {
11
- const defaultProps = {
12
- label: 'Click Me',
13
- variant: 'contained',
14
- color: 'primary',
15
- size: 'small',
16
- handleClick: handleClick
17
- };
18
- return render(React.createElement(Button, { ...defaultProps }));
19
- };
20
- it('renders the button with the correct label', () => {
21
- renderButton();
22
- const buttonElement = screen.getByText('Click Me');
23
- expect(buttonElement).toBeInTheDocument();
24
- expect(buttonElement.tagName).toBe('BUTTON');
25
- });
26
- it('calls the handleClick function when the button is clicked', () => {
27
- renderButton();
28
- const buttonElement = screen.getByText('Click Me');
29
- fireEvent.click(buttonElement);
30
- expect(handleClick).toHaveBeenCalledTimes(1); // Ensure the mock function is called once
31
- });
32
- it('does not call handleClick when the button is not clicked', () => {
33
- renderButton();
34
- expect(handleClick).not.toHaveBeenCalled();
35
- });
36
- });
@@ -1,2 +0,0 @@
1
- export { default } from "./Button";
2
- import "./Button.module.scss";
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- const CustomCheckbox = ({ label, checked = false, onChange, className = '', checkboxClassName = '', labelClassName = '', ...rest }) => {
3
- return (React.createElement("div", { className: className },
4
- React.createElement("input", { type: "checkbox", checked: checked, onChange: onChange, className: checkboxClassName, ...rest }),
5
- label && React.createElement("label", { className: labelClassName }, label)));
6
- };
7
- export default CustomCheckbox;
@@ -1,59 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import '@testing-library/jest-dom';
4
- import CustomCheckbox from './Checkbox';
5
- describe('CustomCheckbox Component', () => {
6
- let handleChange;
7
- // Function to generate default props for each test
8
- const getDefaultProps = () => ({
9
- label: 'Accept Terms',
10
- checked: false,
11
- onChange: handleChange,
12
- className: 'custom-container',
13
- checkboxClassName: 'custom-checkbox',
14
- labelClassName: 'custom-label',
15
- });
16
- beforeEach(() => {
17
- handleChange = jest.fn(); // Reset the mock function before each test
18
- });
19
- it('renders the checkbox with a label', () => {
20
- render(React.createElement(CustomCheckbox, { ...getDefaultProps() }));
21
- const checkboxElement = screen.getByRole('checkbox');
22
- const labelElement = screen.getByText('Accept Terms');
23
- expect(checkboxElement).toBeInTheDocument();
24
- expect(labelElement).toBeInTheDocument();
25
- });
26
- it('applies the correct className to the checkbox container', () => {
27
- render(React.createElement(CustomCheckbox, { ...getDefaultProps() }));
28
- const container = screen.getByRole('checkbox').parentElement;
29
- expect(container).toHaveClass('custom-container');
30
- });
31
- it('applies the correct className to the checkbox', () => {
32
- render(React.createElement(CustomCheckbox, { ...getDefaultProps() }));
33
- const checkboxElement = screen.getByRole('checkbox');
34
- expect(checkboxElement).toHaveClass('custom-checkbox');
35
- });
36
- it('applies the correct className to the label', () => {
37
- render(React.createElement(CustomCheckbox, { ...getDefaultProps() }));
38
- const labelElement = screen.getByText('Accept Terms');
39
- expect(labelElement).toHaveClass('custom-label');
40
- });
41
- it('checks the checkbox based on the checked prop', () => {
42
- render(React.createElement(CustomCheckbox, { ...getDefaultProps(), checked: true }));
43
- const checkboxElement = screen.getByRole('checkbox');
44
- expect(checkboxElement).toBeChecked();
45
- });
46
- it('calls the onChange function when the checkbox state changes', () => {
47
- render(React.createElement(CustomCheckbox, { ...getDefaultProps(), checked: false }));
48
- const checkboxElement = screen.getByRole('checkbox');
49
- fireEvent.click(checkboxElement); // Toggle the checkbox
50
- expect(handleChange).toHaveBeenCalledTimes(1);
51
- });
52
- it('renders correctly with different label', () => {
53
- const newLabel = 'Agree to Privacy Policy';
54
- render(React.createElement(CustomCheckbox, { ...getDefaultProps(), label: newLabel }));
55
- const labelElement = screen.getByText(newLabel);
56
- expect(labelElement).toBeInTheDocument();
57
- expect(labelElement).toHaveTextContent(newLabel);
58
- });
59
- });
@@ -1 +0,0 @@
1
- export { default } from "./Checkbox";
@@ -1,15 +0,0 @@
1
- import React from 'react';
2
- import styles from './CircularProgress.module.scss';
3
- const CircularProgress = ({ value = 0, variant = 'indeterminate', color = 'primary', thickness = 4, size = 100, }) => {
4
- const isDeterminate = variant === 'determinate';
5
- const rotationStyle = isDeterminate
6
- ? { transform: `rotate(${(value / 100) * 360}deg)` }
7
- : {};
8
- return (React.createElement("div", { className: `${styles.spinner} ${styles[color]}`, style: {
9
- width: typeof size === 'number' ? `${size}px` : size,
10
- height: typeof size === 'number' ? `${size}px` : size,
11
- borderWidth: `${thickness}px`,
12
- ...rotationStyle,
13
- } }));
14
- };
15
- export default CircularProgress;
@@ -1,31 +0,0 @@
1
- import React from "react";
2
- import { render } from "@testing-library/react";
3
- import CircularProgress from "./CircularProgress";
4
- describe("Loading Component", () => {
5
- const renderComponent = (props) => render(React.createElement(CircularProgress, { ...props }));
6
- it("applies the correct size and thickness", () => {
7
- const { container } = renderComponent({ size: 60, thickness: 5 });
8
- const spinner = container.firstChild;
9
- expect(spinner).not.toBeNull();
10
- expect(spinner.style.width).toBe("60px");
11
- expect(spinner.style.height).toBe("60px");
12
- expect(spinner.style.borderWidth).toBe("5px");
13
- });
14
- it("renders the determinate spinner with the correct rotation", () => {
15
- const { container } = renderComponent({
16
- variant: "determinate",
17
- value: 75,
18
- });
19
- const spinner = container.firstChild;
20
- const expectedRotation = `rotate(${(75 / 100) * 360}deg)`;
21
- expect(spinner).not.toBeNull();
22
- expect(spinner.style.transform).toBe(expectedRotation);
23
- });
24
- it("handles string size correctly", () => {
25
- const { container } = renderComponent({ size: "50%" });
26
- const spinner = container.firstChild;
27
- expect(spinner).not.toBeNull();
28
- expect(spinner.style.width).toBe("50%");
29
- expect(spinner.style.height).toBe("50%");
30
- });
31
- });
@@ -1,2 +0,0 @@
1
- export { default } from "./CircularProgress";
2
- import "./CircularProgress.module.scss";
@@ -1,7 +0,0 @@
1
- import React from "react";
2
- import { DIVIDER_ORIENTATION } from "../Enum";
3
- const CustomDivider = ({ orientation = DIVIDER_ORIENTATION.Horizontal, className = "", dividerClassName = "", ...rest }) => {
4
- return (React.createElement("div", { className: `${className} ${orientation}`, ...rest },
5
- React.createElement("div", { className: dividerClassName })));
6
- };
7
- export default CustomDivider;
@@ -1,30 +0,0 @@
1
- import React from "react";
2
- import { render } from "@testing-library/react";
3
- import CustomDivider from "./Divider";
4
- import { DIVIDER_ORIENTATION } from "../Enum";
5
- describe("CustomDivider Component", () => {
6
- it("renders without crashing", () => {
7
- const { container } = render(React.createElement(CustomDivider, null));
8
- expect(container.firstChild).toBeTruthy();
9
- });
10
- it("applies the correct default orientation class", () => {
11
- const { container } = render(React.createElement(CustomDivider, null));
12
- expect(container.firstChild).toHaveClass(DIVIDER_ORIENTATION.Horizontal);
13
- });
14
- it("applies a custom orientation class", () => {
15
- const { container } = render(React.createElement(CustomDivider, { orientation: DIVIDER_ORIENTATION.Vertical }));
16
- expect(container.firstChild).toHaveClass(DIVIDER_ORIENTATION.Vertical);
17
- });
18
- it("applies the passed className to the outer div", () => {
19
- const { container } = render(React.createElement(CustomDivider, { className: "custom-class" }));
20
- expect(container.firstChild).toHaveClass("custom-class");
21
- });
22
- it("applies the passed dividerClassName to the inner div", () => {
23
- const { container } = render(React.createElement(CustomDivider, { dividerClassName: "inner-class" }));
24
- expect(container.firstChild?.firstChild).toHaveClass("inner-class");
25
- });
26
- it("passes additional props to the outer div", () => {
27
- const { container } = render(React.createElement(CustomDivider, { "data-testid": "custom-divider" }));
28
- expect(container.firstChild).toHaveAttribute("data-testid", "custom-divider");
29
- });
30
- });
@@ -1 +0,0 @@
1
- export { default } from "./Divider";
@@ -1,17 +0,0 @@
1
- export const INPUT_TYPES = {
2
- PASSWORD: 'password',
3
- TEXT: 'text',
4
- EMAIL: 'email',
5
- NUMBER: 'number',
6
- DATE: 'date',
7
- };
8
- export const DIVIDER_ORIENTATION = {
9
- Horizontal: "horizontal",
10
- Vertical: "vertical",
11
- };
12
- export const LINK_TARGET = {
13
- Self: '_self',
14
- Blank: '_blank',
15
- Parent: '_parent',
16
- Top: '_top',
17
- };
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import { INPUT_TYPES } from '../Enum';
3
- const CustomInputField = ({ label, value = '', type = INPUT_TYPES.TEXT, placeholder = '', onChange, className = '', inputClassName = '', labelClassName = '', error = '', errorClassName = '', ...rest }) => {
4
- return (React.createElement("div", { className: className },
5
- label && React.createElement("label", { className: labelClassName }, label),
6
- React.createElement("input", { type: type, value: value, placeholder: placeholder, onChange: onChange, className: inputClassName, ...rest }),
7
- error && React.createElement("div", { className: errorClassName }, error)));
8
- };
9
- export default CustomInputField;
@@ -1,98 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, fireEvent } from '@testing-library/react';
3
- import CustomInputField from './InputTextField';
4
- import { INPUT_TYPES } from '../Enum';
5
- const renderWithProps = (props = {}) => {
6
- const defaultProps = {
7
- label: 'Test Label',
8
- value: 'Test Value',
9
- type: INPUT_TYPES.TEXT,
10
- placeholder: 'Enter text...',
11
- onChange: jest.fn(),
12
- className: 'custom-input-wrapper',
13
- inputClassName: 'custom-input',
14
- labelClassName: 'custom-label',
15
- error: '',
16
- errorClassName: 'custom-error',
17
- id: 'test-input-field',
18
- ...props
19
- };
20
- return render(React.createElement(CustomInputField, { ...defaultProps }));
21
- };
22
- describe('CustomInputField Component', () => {
23
- // it('renders without crashing', () => {
24
- // renderWithProps();
25
- // // Check if the label correctly associates with the input by using the id
26
- // const input = screen.getByLabelText('Test Label');
27
- // expect(input).toBeInTheDocument();
28
- // });
29
- it('renders the label correctly', () => {
30
- renderWithProps();
31
- expect(screen.getByText('Test Label')).toHaveClass('custom-label');
32
- });
33
- it('renders the input with the correct value', () => {
34
- renderWithProps();
35
- expect(screen.getByDisplayValue('Test Value')).toHaveClass('custom-input');
36
- });
37
- it('calls the onChange handler when input value changes', () => {
38
- const mockOnChange = jest.fn();
39
- renderWithProps({ onChange: mockOnChange });
40
- const input = screen.getByDisplayValue('Test Value');
41
- fireEvent.change(input, { target: { value: 'New Value' } });
42
- expect(mockOnChange).toHaveBeenCalledTimes(1);
43
- });
44
- it('displays the error message correctly', () => {
45
- renderWithProps({ error: 'Error message' });
46
- expect(screen.getByText('Error message')).toHaveClass('custom-error');
47
- });
48
- it('renders the input with the correct type', () => {
49
- renderWithProps({ type: INPUT_TYPES.EMAIL });
50
- expect(screen.getByPlaceholderText('Enter text...')).toHaveAttribute('type', INPUT_TYPES.EMAIL);
51
- });
52
- // it('applies the passed className to the wrapper div', () => {
53
- // renderWithProps();
54
- // // Check the class name of the wrapper div
55
- // const wrapper = screen.getByLabelText('Test Label').parentElement?.parentElement;
56
- // expect(wrapper).toHaveClass('custom-input-wrapper');
57
- // });
58
- it('applies additional props to the input field', () => {
59
- renderWithProps();
60
- expect(screen.getByPlaceholderText('Enter text...')).toBeInTheDocument();
61
- });
62
- });
63
- describe('CustomInputField Component - Default Values', () => {
64
- it('renders the input field with default value when value prop is not provided', () => {
65
- render(React.createElement(CustomInputField, { label: "Test Label", type: INPUT_TYPES.TEXT, value: "", onChange: jest.fn() }));
66
- expect(screen.getByPlaceholderText('')).toHaveValue('');
67
- });
68
- it('renders the input field with default type when type prop is not provided', () => {
69
- render(React.createElement(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
70
- expect(screen.getByDisplayValue('Test Value')).toHaveAttribute('type', INPUT_TYPES.TEXT);
71
- });
72
- it('renders the input field with default placeholder when placeholder prop is not provided', () => {
73
- render(React.createElement(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
74
- expect(screen.getByDisplayValue('Test Value')).toHaveAttribute('placeholder', '');
75
- });
76
- // it('applies default class names if className, inputClassName, or labelClassName are not provided', () => {
77
- // render(<CustomInputField label="Test Label" value="Test Value" type={INPUT_TYPES.TEXT} onChange={jest.fn()} />);
78
- // // Get the label element
79
- // const label = screen.getByText('Test Label');
80
- // const input = screen.getByDisplayValue('Test Value');
81
- // // Get the parent wrapper div
82
- // const wrapper = label.closest('div');
83
- // // Check if the wrapper div has default class names or no class names
84
- // if (wrapper) {
85
- // // Expect no additional class names or specific default class names
86
- // expect(wrapper).toHaveClass('default-wrapper-class'); // Replace with actual default class
87
- // }
88
- // // Check if the input field has default input class names or no class names
89
- // expect(input).toHaveClass('default-input-class'); // Replace with actual default class
90
- // // Check if the label has default label class names or no class names
91
- // expect(label).toHaveClass('default-label-class'); // Replace with actual default class
92
- // });
93
- it('does not render the error message if error prop is not provided', () => {
94
- render(React.createElement(CustomInputField, { label: "Test Label", value: "Test Value", type: INPUT_TYPES.TEXT, onChange: jest.fn() }));
95
- const errorMessage = screen.queryByText('Error message');
96
- expect(errorMessage).not.toBeInTheDocument();
97
- });
98
- });
@@ -1 +0,0 @@
1
- export { default } from "./InputTextField";
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { LINK_TARGET } from '../Enum';
3
- const Link = ({ href, target = LINK_TARGET.Self, rel, className = '', children, ...rest }) => {
4
- return (React.createElement("a", { href: href, target: target, rel: rel, className: className, ...rest }, children));
5
- };
6
- export default Link;
@@ -1,47 +0,0 @@
1
- import React from 'react';
2
- import { render, screen } from '@testing-library/react';
3
- import Link from './Link';
4
- import { LINK_TARGET } from '../Enum';
5
- describe('Link Component', () => {
6
- const defaultProps = {
7
- href: 'https://example.com',
8
- target: LINK_TARGET.Self,
9
- rel: 'noopener noreferrer',
10
- className: 'custom-link',
11
- children: 'Click here',
12
- };
13
- it('renders the link with the correct href', () => {
14
- render(React.createElement(Link, { ...defaultProps }));
15
- expect(screen.getByText('Click here')).toHaveAttribute('href', 'https://example.com');
16
- });
17
- it('renders the link with the correct target attribute', () => {
18
- render(React.createElement(Link, { ...defaultProps }));
19
- expect(screen.getByText('Click here')).toHaveAttribute('target', LINK_TARGET.Self);
20
- });
21
- it('renders the link with the correct rel attribute', () => {
22
- render(React.createElement(Link, { ...defaultProps }));
23
- expect(screen.getByText('Click here')).toHaveAttribute('rel', 'noopener noreferrer');
24
- });
25
- it('renders the link with the correct className', () => {
26
- render(React.createElement(Link, { ...defaultProps }));
27
- expect(screen.getByText('Click here')).toHaveClass('custom-link');
28
- });
29
- it('renders the link with the correct children', () => {
30
- render(React.createElement(Link, { ...defaultProps }));
31
- expect(screen.getByText('Click here')).toBeInTheDocument();
32
- });
33
- it('renders with default target when not specified', () => {
34
- const propsWithoutTarget = {
35
- href: defaultProps.href,
36
- rel: defaultProps.rel,
37
- className: defaultProps.className,
38
- children: defaultProps.children,
39
- };
40
- render(React.createElement(Link, { ...propsWithoutTarget }));
41
- expect(screen.getByText('Click here')).toHaveAttribute('target', LINK_TARGET.Self);
42
- });
43
- it('applies additional props to the link element', () => {
44
- render(React.createElement(Link, { ...defaultProps, "data-testid": "custom-link" }));
45
- expect(screen.getByTestId('custom-link')).toBeInTheDocument();
46
- });
47
- });
@@ -1 +0,0 @@
1
- export { default } from "./Link";
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- const GetDirectionAction = ({ title, titleClasses, location, locationClasses, hours, hoursClasses, directionsLink, buttonName = 'Get Directions', }) => {
3
- return (React.createElement("div", { className: "direction-action-container" },
4
- React.createElement("h3", { className: titleClasses }, title),
5
- React.createElement("p", { className: locationClasses }, location),
6
- React.createElement("p", { className: hoursClasses }, hours),
7
- React.createElement("a", { href: directionsLink, target: "_blank", rel: "noopener noreferrer", className: "directions-link" }, buttonName)));
8
- };
9
- export default GetDirectionAction;