pge-front-common 1.0.3 → 2.0.0

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 (33) hide show
  1. package/package.json +49 -49
  2. package/src/components/Modal/Modal.tsx +2 -4
  3. package/src/components/theme.ts +11 -3
  4. package/src/icons/add-cell-icon.tsx +17 -0
  5. package/src/icons/add-icon.tsx +17 -0
  6. package/src/icons/arrow-expland-icon.tsx +17 -0
  7. package/src/icons/arrow-to-recall-icon.tsx +17 -0
  8. package/src/icons/calendar-icon.tsx +17 -0
  9. package/src/icons/check-circle-icon.tsx +17 -0
  10. package/src/icons/circle-expland-icon.tsx +17 -0
  11. package/src/icons/circle-to-recall-icon.tsx +17 -0
  12. package/src/icons/close-icon.tsx +17 -0
  13. package/src/icons/delete-icon.tsx +17 -0
  14. package/src/icons/download-icon.tsx +17 -0
  15. package/src/icons/edit-icon.tsx +17 -0
  16. package/src/icons/event-avaliable-icon.tsx +17 -0
  17. package/src/icons/icons.stories.tsx +92 -0
  18. package/src/icons/index.ts +49 -0
  19. package/src/icons/logout-icon.tsx +17 -0
  20. package/src/icons/new-tab-icon.tsx +17 -0
  21. package/src/icons/pdf-icon.tsx +17 -0
  22. package/src/icons/profile-icon.tsx +17 -0
  23. package/src/icons/remove-icon.tsx +14 -0
  24. package/src/icons/swap-icon.tsx +17 -0
  25. package/src/icons/triangle-expand-icon.tsx +14 -0
  26. package/src/icons/triangle-to-recall-icon.tsx +14 -0
  27. package/src/icons/upload-icon.tsx +17 -0
  28. package/src/icons/visibillity-icon.tsx +17 -0
  29. package/src/icons/warning-icon.tsx +17 -0
  30. package/src/index.ts +53 -1
  31. package/src/styled-components.d.ts +10 -1
  32. package/tsconfig.json +1 -1
  33. package/src/components/Modal/iconeClose.tsx +0 -17
package/package.json CHANGED
@@ -1,49 +1,49 @@
1
- {
2
- "devDependencies": {
3
- "@chromatic-com/storybook": "^1.6.0",
4
- "@rollup/plugin-commonjs": "^26.0.1",
5
- "@rollup/plugin-node-resolve": "^15.2.3",
6
- "@rollup/plugin-typescript": "^11.1.6",
7
- "@storybook/addon-essentials": "^8.1.11",
8
- "@storybook/addon-interactions": "^8.1.11",
9
- "@storybook/addon-links": "^8.1.11",
10
- "@storybook/addon-onboarding": "^8.1.11",
11
- "@storybook/addon-themes": "^8.1.11",
12
- "@storybook/blocks": "^8.1.11",
13
- "@storybook/react": "^8.1.11",
14
- "@storybook/react-vite": "^8.1.11",
15
- "@storybook/test": "^8.1.11",
16
- "@types/react": "^18.3.3",
17
- "postcss": "^8.4.39",
18
- "react": "^18.3.1",
19
- "react-dom": "^18.3.1",
20
- "rollup": "^4.18.0",
21
- "rollup-plugin-dts": "^6.1.1",
22
- "rollup-plugin-peer-deps-external": "^2.2.4",
23
- "rollup-plugin-postcss": "^4.0.2",
24
- "storybook": "^8.1.11",
25
- "typescript": "^5.5.2",
26
- "@radix-ui/react-alert-dialog": "^1.1.1"
27
- },
28
- "peerDependencies": {
29
- "react": "^18.2.0",
30
- "react-dom": "^18.2.0"
31
- },
32
- "scripts": {
33
- "storybook": "storybook dev -p 6006",
34
- "build-storybook": "storybook build",
35
- "build": "rollup -c"
36
- },
37
- "main": "lib/index.js",
38
- "module": "lib/index.esm.js",
39
- "types": "lib/index.d.ts",
40
- "name": "pge-front-common",
41
- "version": "1.0.3",
42
- "description": "",
43
- "keywords": [],
44
- "author": "sturmer cesar",
45
- "license": "ISC",
46
- "dependencies": {
47
- "styled-components": "^6.1.11"
48
- }
49
- }
1
+ {
2
+ "devDependencies": {
3
+ "@chromatic-com/storybook": "^1.6.0",
4
+ "@radix-ui/react-alert-dialog": "^1.1.1",
5
+ "@rollup/plugin-commonjs": "^26.0.1",
6
+ "@rollup/plugin-node-resolve": "^15.2.3",
7
+ "@rollup/plugin-typescript": "^11.1.6",
8
+ "@storybook/addon-essentials": "^8.1.11",
9
+ "@storybook/addon-interactions": "^8.1.11",
10
+ "@storybook/addon-links": "^8.1.11",
11
+ "@storybook/addon-onboarding": "^8.1.11",
12
+ "@storybook/addon-themes": "^8.1.11",
13
+ "@storybook/blocks": "^8.1.11",
14
+ "@storybook/react": "^8.1.11",
15
+ "@storybook/react-vite": "^8.1.11",
16
+ "@storybook/test": "^8.1.11",
17
+ "@types/react": "^18.3.3",
18
+ "postcss": "^8.4.39",
19
+ "react": "^18.3.1",
20
+ "react-dom": "^18.3.1",
21
+ "rollup": "^4.18.0",
22
+ "rollup-plugin-dts": "^6.1.1",
23
+ "rollup-plugin-peer-deps-external": "^2.2.4",
24
+ "rollup-plugin-postcss": "^4.0.2",
25
+ "storybook": "^8.1.11",
26
+ "typescript": "^5.5.2"
27
+ },
28
+ "peerDependencies": {
29
+ "react": "^18.2.0",
30
+ "react-dom": "^18.2.0"
31
+ },
32
+ "scripts": {
33
+ "storybook": "storybook dev -p 6006",
34
+ "build-storybook": "storybook build",
35
+ "build": "rollup -c"
36
+ },
37
+ "main": "lib/index.js",
38
+ "module": "lib/index.esm.js",
39
+ "types": "lib/index.d.ts",
40
+ "name": "pge-front-common",
41
+ "version": "2.0.0",
42
+ "description": "",
43
+ "keywords": [],
44
+ "author": "sturmer cesar",
45
+ "license": "ISC",
46
+ "dependencies": {
47
+ "styled-components": "^6.1.11"
48
+ }
49
+ }
package/src/components/Modal/Modal.tsx CHANGED
@@ -8,8 +8,7 @@ import {
8
8
  CloseBtn,
9
9
  ContentChildren,
10
10
  } from "./styles";
11
- import { CloseIcon } from "./iconeClose";
12
-
11
+ import { IconCLose } from "../../icons/close-icon";
13
12
  export interface ModalProps {
14
13
  isModalOpen: boolean;
15
14
  onOpenChange: React.Dispatch<React.SetStateAction<boolean>>;
@@ -31,8 +30,7 @@ export const Modal = ({
31
30
  <ModalHeaderContainer>
32
31
  <ModalHeaderText>{title}</ModalHeaderText>
33
32
  <CloseBtn onClick={() => onOpenChange(!isModalOpen)}>
34
- <CloseIcon />
35
- {/* <CustomIcon className="material-icons-outlined">close</CustomIcon> */}
33
+ <IconCLose />
36
34
  </CloseBtn>
37
35
  </ModalHeaderContainer>
38
36
 
package/src/components/theme.ts CHANGED
@@ -4,11 +4,19 @@ const theme: DefaultTheme = {
4
4
  colors: {
5
5
  primary: "#005a92",
6
6
  secondary: "",
7
- // success:
8
-
7
+ hover: "#005A92",
8
+ textSecondary: "",
9
+ iconColor: "#4A4A4B",
10
+ success: "#198754",
11
+ warning: "#CB8700",
12
+ alert: "#CB0A0A",
13
+ information: "#1A95B0",
14
+ border: "#D9D9D9",
15
+ lightGrey: "#C3C3C3",
16
+ grey: "#A0A0A0",
9
17
  base: {
10
18
  white: "#FFFFFF",
11
- black: "",
19
+ black: "#303030",
12
20
  },
13
21
  },
14
22
  };
package/src/icons/add-cell-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconAddCell = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="21"
6
+ height="21"
7
+ viewBox="0 0 21 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M9.6665 15.5H11.6665V11.5H15.6665V9.5H11.6665V5.5H9.6665V9.5H5.6665V11.5H9.6665V15.5ZM10.6665 20.5C9.28317 20.5 7.98317 20.2375 6.7665 19.7125C5.54984 19.1875 4.4915 18.475 3.5915 17.575C2.6915 16.675 1.979 15.6167 1.454 14.4C0.929004 13.1833 0.666504 11.8833 0.666504 10.5C0.666504 9.11667 0.929004 7.81667 1.454 6.6C1.979 5.38333 2.6915 4.325 3.5915 3.425C4.4915 2.525 5.54984 1.8125 6.7665 1.2875C7.98317 0.7625 9.28317 0.5 10.6665 0.5C12.0498 0.5 13.3498 0.7625 14.5665 1.2875C15.7832 1.8125 16.8415 2.525 17.7415 3.425C18.6415 4.325 19.354 5.38333 19.879 6.6C20.404 7.81667 20.6665 9.11667 20.6665 10.5C20.6665 11.8833 20.404 13.1833 19.879 14.4C19.354 15.6167 18.6415 16.675 17.7415 17.575C16.8415 18.475 15.7832 19.1875 14.5665 19.7125C13.3498 20.2375 12.0498 20.5 10.6665 20.5ZM10.6665 18.5C12.8998 18.5 14.7915 17.725 16.3415 16.175C17.8915 14.625 18.6665 12.7333 18.6665 10.5C18.6665 8.26667 17.8915 6.375 16.3415 4.825C14.7915 3.275 12.8998 2.5 10.6665 2.5C8.43317 2.5 6.5415 3.275 4.9915 4.825C3.4415 6.375 2.6665 8.26667 2.6665 10.5C2.6665 12.7333 3.4415 14.625 4.9915 16.175C6.5415 17.725 8.43317 18.5 10.6665 18.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/add-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconAdd = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="15"
6
+ height="15"
7
+ viewBox="0 0 15 15"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M6.6665 8.5H0.666504V6.5H6.6665V0.5H8.6665V6.5H14.6665V8.5H8.6665V14.5H6.6665V8.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/arrow-expland-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconArrowExpland = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="13"
6
+ height="8"
7
+ viewBox="0 0 13 8"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.0665 7.87498L0.666504 6.47498L6.6665 0.474976L12.6665 6.47498L11.2665 7.87498L6.6665 3.27498L2.0665 7.87498Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/arrow-to-recall-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconArrowRecall = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="13"
6
+ height="8"
7
+ viewBox="0 0 13 8"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M6.6665 7.87498L0.666504 1.87498L2.0665 0.474976L6.6665 5.07498L11.2665 0.474976L12.6665 1.87498L6.6665 7.87498Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/calendar-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconCalendar = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="19"
6
+ height="21"
7
+ viewBox="0 0 19 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.6665 20.5C2.1165 20.5 1.64567 20.3042 1.254 19.9125C0.862337 19.5208 0.666504 19.05 0.666504 18.5V4.5C0.666504 3.95 0.862337 3.47917 1.254 3.0875C1.64567 2.69583 2.1165 2.5 2.6665 2.5H3.6665V0.5H5.6665V2.5H13.6665V0.5H15.6665V2.5H16.6665C17.2165 2.5 17.6873 2.69583 18.079 3.0875C18.4707 3.47917 18.6665 3.95 18.6665 4.5V18.5C18.6665 19.05 18.4707 19.5208 18.079 19.9125C17.6873 20.3042 17.2165 20.5 16.6665 20.5H2.6665ZM2.6665 18.5H16.6665V8.5H2.6665V18.5ZM2.6665 6.5H16.6665V4.5H2.6665V6.5ZM9.6665 12.5C9.38317 12.5 9.14567 12.4042 8.954 12.2125C8.76234 12.0208 8.6665 11.7833 8.6665 11.5C8.6665 11.2167 8.76234 10.9792 8.954 10.7875C9.14567 10.5958 9.38317 10.5 9.6665 10.5C9.94984 10.5 10.1873 10.5958 10.379 10.7875C10.5707 10.9792 10.6665 11.2167 10.6665 11.5C10.6665 11.7833 10.5707 12.0208 10.379 12.2125C10.1873 12.4042 9.94984 12.5 9.6665 12.5ZM5.6665 12.5C5.38317 12.5 5.14567 12.4042 4.954 12.2125C4.76234 12.0208 4.6665 11.7833 4.6665 11.5C4.6665 11.2167 4.76234 10.9792 4.954 10.7875C5.14567 10.5958 5.38317 10.5 5.6665 10.5C5.94984 10.5 6.18734 10.5958 6.379 10.7875C6.57067 10.9792 6.6665 11.2167 6.6665 11.5C6.6665 11.7833 6.57067 12.0208 6.379 12.2125C6.18734 12.4042 5.94984 12.5 5.6665 12.5ZM13.6665 12.5C13.3832 12.5 13.1457 12.4042 12.954 12.2125C12.7623 12.0208 12.6665 11.7833 12.6665 11.5C12.6665 11.2167 12.7623 10.9792 12.954 10.7875C13.1457 10.5958 13.3832 10.5 13.6665 10.5C13.9498 10.5 14.1873 10.5958 14.379 10.7875C14.5707 10.9792 14.6665 11.2167 14.6665 11.5C14.6665 11.7833 14.5707 12.0208 14.379 12.2125C14.1873 12.4042 13.9498 12.5 13.6665 12.5ZM9.6665 16.5C9.38317 16.5 9.14567 16.4042 8.954 16.2125C8.76234 16.0208 8.6665 15.7833 8.6665 15.5C8.6665 15.2167 8.76234 14.9792 8.954 14.7875C9.14567 14.5958 9.38317 14.5 9.6665 14.5C9.94984 14.5 10.1873 14.5958 10.379 14.7875C10.5707 14.9792 10.6665 15.2167 10.6665 15.5C10.6665 15.7833 10.5707 16.0208 10.379 16.2125C10.1873 16.4042 9.94984 16.5 9.6665 16.5ZM5.6665 16.5C5.38317 16.5 5.14567 16.4042 4.954 16.2125C4.76234 16.0208 4.6665 15.7833 4.6665 15.5C4.6665 15.2167 4.76234 14.9792 4.954 14.7875C5.14567 14.5958 5.38317 14.5 5.6665 14.5C5.94984 14.5 6.18734 14.5958 6.379 14.7875C6.57067 14.9792 6.6665 15.2167 6.6665 15.5C6.6665 15.7833 6.57067 16.0208 6.379 16.2125C6.18734 16.4042 5.94984 16.5 5.6665 16.5ZM13.6665 16.5C13.3832 16.5 13.1457 16.4042 12.954 16.2125C12.7623 16.0208 12.6665 15.7833 12.6665 15.5C12.6665 15.2167 12.7623 14.9792 12.954 14.7875C13.1457 14.5958 13.3832 14.5 13.6665 14.5C13.9498 14.5 14.1873 14.5958 14.379 14.7875C14.5707 14.9792 14.6665 15.2167 14.6665 15.5C14.6665 15.7833 14.5707 16.0208 14.379 16.2125C14.1873 16.4042 13.9498 16.5 13.6665 16.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/check-circle-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconCheckCircle = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="21"
6
+ height="21"
7
+ viewBox="0 0 21 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M9.2665 15.1L16.3165 8.05L14.9165 6.65L9.2665 12.3L6.4165 9.45L5.0165 10.85L9.2665 15.1ZM10.6665 20.5C9.28317 20.5 7.98317 20.2375 6.7665 19.7125C5.54984 19.1875 4.4915 18.475 3.5915 17.575C2.6915 16.675 1.979 15.6167 1.454 14.4C0.929004 13.1833 0.666504 11.8833 0.666504 10.5C0.666504 9.11667 0.929004 7.81667 1.454 6.6C1.979 5.38333 2.6915 4.325 3.5915 3.425C4.4915 2.525 5.54984 1.8125 6.7665 1.2875C7.98317 0.7625 9.28317 0.5 10.6665 0.5C12.0498 0.5 13.3498 0.7625 14.5665 1.2875C15.7832 1.8125 16.8415 2.525 17.7415 3.425C18.6415 4.325 19.354 5.38333 19.879 6.6C20.404 7.81667 20.6665 9.11667 20.6665 10.5C20.6665 11.8833 20.404 13.1833 19.879 14.4C19.354 15.6167 18.6415 16.675 17.7415 17.575C16.8415 18.475 15.7832 19.1875 14.5665 19.7125C13.3498 20.2375 12.0498 20.5 10.6665 20.5ZM10.6665 18.5C12.8998 18.5 14.7915 17.725 16.3415 16.175C17.8915 14.625 18.6665 12.7333 18.6665 10.5C18.6665 8.26667 17.8915 6.375 16.3415 4.825C14.7915 3.275 12.8998 2.5 10.6665 2.5C8.43317 2.5 6.5415 3.275 4.9915 4.825C3.4415 6.375 2.6665 8.26667 2.6665 10.5C2.6665 12.7333 3.4415 14.625 4.9915 16.175C6.5415 17.725 8.43317 18.5 10.6665 18.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/circle-expland-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconCircleExpland = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="21"
6
+ height="21"
7
+ viewBox="0 0 21 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M10.6665 14L15.1665 9.5L13.7415 8.1L10.6665 11.175L7.5915 8.1L6.1665 9.5L10.6665 14ZM10.6665 20.5C9.28317 20.5 7.98317 20.2375 6.7665 19.7125C5.54984 19.1875 4.4915 18.475 3.5915 17.575C2.6915 16.675 1.979 15.6167 1.454 14.4C0.929004 13.1833 0.666504 11.8833 0.666504 10.5C0.666504 9.11667 0.929004 7.81667 1.454 6.6C1.979 5.38333 2.6915 4.325 3.5915 3.425C4.4915 2.525 5.54984 1.8125 6.7665 1.2875C7.98317 0.7625 9.28317 0.5 10.6665 0.5C12.0498 0.5 13.3498 0.7625 14.5665 1.2875C15.7832 1.8125 16.8415 2.525 17.7415 3.425C18.6415 4.325 19.354 5.38333 19.879 6.6C20.404 7.81667 20.6665 9.11667 20.6665 10.5C20.6665 11.8833 20.404 13.1833 19.879 14.4C19.354 15.6167 18.6415 16.675 17.7415 17.575C16.8415 18.475 15.7832 19.1875 14.5665 19.7125C13.3498 20.2375 12.0498 20.5 10.6665 20.5ZM10.6665 18.5C12.8998 18.5 14.7915 17.725 16.3415 16.175C17.8915 14.625 18.6665 12.7333 18.6665 10.5C18.6665 8.26667 17.8915 6.375 16.3415 4.825C14.7915 3.275 12.8998 2.5 10.6665 2.5C8.43317 2.5 6.5415 3.275 4.9915 4.825C3.4415 6.375 2.6665 8.26667 2.6665 10.5C2.6665 12.7333 3.4415 14.625 4.9915 16.175C6.5415 17.725 8.43317 18.5 10.6665 18.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/circle-to-recall-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconCircleRecall = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="21"
6
+ height="21"
7
+ viewBox="0 0 21 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M7.5915 12.9L10.6665 9.825L13.7415 12.9L15.1665 11.5L10.6665 7L6.1665 11.5L7.5915 12.9ZM10.6665 20.5C9.28317 20.5 7.98317 20.2375 6.7665 19.7125C5.54984 19.1875 4.4915 18.475 3.5915 17.575C2.6915 16.675 1.979 15.6167 1.454 14.4C0.929004 13.1833 0.666504 11.8833 0.666504 10.5C0.666504 9.11667 0.929004 7.81667 1.454 6.6C1.979 5.38333 2.6915 4.325 3.5915 3.425C4.4915 2.525 5.54984 1.8125 6.7665 1.2875C7.98317 0.7625 9.28317 0.5 10.6665 0.5C12.0498 0.5 13.3498 0.7625 14.5665 1.2875C15.7832 1.8125 16.8415 2.525 17.7415 3.425C18.6415 4.325 19.354 5.38333 19.879 6.6C20.404 7.81667 20.6665 9.11667 20.6665 10.5C20.6665 11.8833 20.404 13.1833 19.879 14.4C19.354 15.6167 18.6415 16.675 17.7415 17.575C16.8415 18.475 15.7832 19.1875 14.5665 19.7125C13.3498 20.2375 12.0498 20.5 10.6665 20.5ZM10.6665 18.5C12.8998 18.5 14.7915 17.725 16.3415 16.175C17.8915 14.625 18.6665 12.7333 18.6665 10.5C18.6665 8.26667 17.8915 6.375 16.3415 4.825C14.7915 3.275 12.8998 2.5 10.6665 2.5C8.43317 2.5 6.5415 3.275 4.9915 4.825C3.4415 6.375 2.6665 8.26667 2.6665 10.5C2.6665 12.7333 3.4415 14.625 4.9915 16.175C6.5415 17.725 8.43317 18.5 10.6665 18.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/close-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconCLose = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="15"
6
+ height="15"
7
+ viewBox="0 0 15 15"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.0665 14.5L0.666504 13.1L6.2665 7.5L0.666504 1.9L2.0665 0.5L7.6665 6.1L13.2665 0.5L14.6665 1.9L9.0665 7.5L14.6665 13.1L13.2665 14.5L7.6665 8.9L2.0665 14.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/delete-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconDelete = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="19"
7
+ viewBox="0 0 17 19"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M3.6665 18.5C3.1165 18.5 2.64567 18.3042 2.254 17.9125C1.86234 17.5208 1.6665 17.05 1.6665 16.5V3.5H0.666504V1.5H5.6665V0.5H11.6665V1.5H16.6665V3.5H15.6665V16.5C15.6665 17.05 15.4707 17.5208 15.079 17.9125C14.6873 18.3042 14.2165 18.5 13.6665 18.5H3.6665ZM13.6665 3.5H3.6665V16.5H13.6665V3.5ZM5.6665 14.5H7.6665V5.5H5.6665V14.5ZM9.6665 14.5H11.6665V5.5H9.6665V14.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/download-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconDownload = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="17"
7
+ viewBox="0 0 17 17"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M8.6665 12.5L3.6665 7.5L5.0665 6.05L7.6665 8.65V0.5H9.6665V8.65L12.2665 6.05L13.6665 7.5L8.6665 12.5ZM2.6665 16.5C2.1165 16.5 1.64567 16.3042 1.254 15.9125C0.862337 15.5208 0.666504 15.05 0.666504 14.5V11.5H2.6665V14.5H14.6665V11.5H16.6665V14.5C16.6665 15.05 16.4707 15.5208 16.079 15.9125C15.6873 16.3042 15.2165 16.5 14.6665 16.5H2.6665Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/edit-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconEdit = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="19"
6
+ height="19"
7
+ viewBox="0 0 19 19"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.6665 16.5H4.0915L13.8665 6.725L12.4415 5.3L2.6665 15.075V16.5ZM0.666504 18.5V14.25L13.8665 1.075C14.0665 0.891667 14.2873 0.75 14.529 0.65C14.7707 0.55 15.0248 0.5 15.2915 0.5C15.5582 0.5 15.8165 0.55 16.0665 0.65C16.3165 0.75 16.5332 0.9 16.7165 1.1L18.0915 2.5C18.2915 2.68333 18.4373 2.9 18.529 3.15C18.6207 3.4 18.6665 3.65 18.6665 3.9C18.6665 4.16667 18.6207 4.42083 18.529 4.6625C18.4373 4.90417 18.2915 5.125 18.0915 5.325L4.9165 18.5H0.666504ZM13.1415 6.025L12.4415 5.3L13.8665 6.725L13.1415 6.025Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/event-avaliable-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconEventAvaliable = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="21"
7
+ viewBox="0 0 17 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M7.74775 16.85L4.6415 13.3L5.91025 11.85L7.74775 13.95L11.4228 9.75L12.6915 11.2L7.74775 16.85ZM2.5415 20.5C2.06025 20.5 1.64827 20.3042 1.30557 19.9125C0.962858 19.5208 0.791504 19.05 0.791504 18.5V4.5C0.791504 3.95 0.962858 3.47917 1.30557 3.0875C1.64827 2.69583 2.06025 2.5 2.5415 2.5H3.4165V0.5H5.1665V2.5H12.1665V0.5H13.9165V2.5H14.7915C15.2728 2.5 15.6847 2.69583 16.0274 3.0875C16.3701 3.47917 16.5415 3.95 16.5415 4.5V18.5C16.5415 19.05 16.3701 19.5208 16.0274 19.9125C15.6847 20.3042 15.2728 20.5 14.7915 20.5H2.5415ZM2.5415 18.5H14.7915V8.5H2.5415V18.5ZM2.5415 6.5H14.7915V4.5H2.5415V6.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/icons.stories.tsx ADDED
@@ -0,0 +1,92 @@
1
+ import { Meta, StoryObj } from "@storybook/react";
2
+ import React from "react";
3
+ import { IconPdf } from "./pdf-icon";
4
+ import styled from "styled-components";
5
+ import { IconDownload } from "./download-icon";
6
+ import { IconVisibillity } from "./visibillity-icon";
7
+ import { IconEdit } from "./edit-icon";
8
+ import { IconDelete } from "./delete-icon";
9
+ import { IconCalendar } from "./calendar-icon";
10
+ import { IconProfile } from "./profile-icon";
11
+ import { IconUpload } from "./upload-icon";
12
+ import { IconNewTab } from "./new-tab-icon";
13
+ import { IconWarning } from "./warning-icon";
14
+ import { IconCheckCircle } from "./check-circle-icon";
15
+ import { IconEventAvaliable } from "./event-avaliable-icon";
16
+ import { IconLogout } from "./logout-icon";
17
+ import { IconCLose } from "./close-icon";
18
+ import { IconAdd } from "./add-icon";
19
+ import { IconRemove } from "./remove-icon";
20
+ import { IconCircleExpland } from "./circle-expland-icon";
21
+ import { IconCircleRecall } from "./circle-to-recall-icon";
22
+ import { IconArrowExpland } from "./arrow-expland-icon";
23
+ import { IconArrowRecall } from "./arrow-to-recall-icon";
24
+ import { IconTriangleExpand } from "./triangle-expand-icon";
25
+ import { IconTriangleRecall } from "./triangle-to-recall-icon";
26
+ import { IconSwap } from "./swap-icon";
27
+ import { IconAddCell } from "./add-cell-icon";
28
+
29
+ const meta: Meta = {
30
+ title: "Example/Icons",
31
+ };
32
+
33
+ const WrapperIcons = styled.div`
34
+ display: flex;
35
+ align-items: center;
36
+ gap: 10px;
37
+ justify-content: start;
38
+ `;
39
+
40
+ export default meta;
41
+ type Story = StoryObj<typeof meta>;
42
+
43
+ const iconList = [
44
+ { component: IconDownload, name: "Download" },
45
+ { component: IconVisibillity, name: "Visualizar " },
46
+ { component: IconEdit, name: "Editar" },
47
+ { component: IconDelete, name: "Excluir" },
48
+ { component: IconCalendar, name: "Calendário" },
49
+ { component: IconProfile, name: "Perfil" },
50
+ { component: IconUpload, name: "Exportar" },
51
+ { component: IconNewTab, name: "Abrir em nova aba" },
52
+ { component: IconWarning, name: "Alerta" },
53
+ { component: IconCheckCircle, name: "Sucesso" },
54
+ { component: IconEventAvaliable, name: "Evento" },
55
+ { component: IconLogout, name: "Sair" },
56
+ { component: IconCLose, name: "Fechar" },
57
+ { component: IconAdd, name: "Adicionar" },
58
+ { component: IconRemove, name: "Remover" },
59
+ { component: IconPdf, name: "Aba de PDF" },
60
+ { component: IconCircleExpland, name: "Expandir aba" },
61
+ { component: IconCircleRecall, name: "Recolher aba" },
62
+ { component: IconArrowExpland, name: "Expandir aba" },
63
+ { component: IconArrowRecall, name: "Recolher aba" },
64
+ { component: IconTriangleExpand, name: "Expandir aba" },
65
+ { component: IconTriangleRecall, name: "Recolher aba" },
66
+ { component: IconSwap, name: "Compartilhamento" },
67
+ { component: IconAddCell, name: "Adição" },
68
+ ];
69
+
70
+ const grupIcons: Story = {
71
+ render: (args) => {
72
+ return (
73
+ <>
74
+ {iconList.map((icon, index) => {
75
+ const IconComponent = icon.component;
76
+
77
+ return (
78
+ <WrapperIcons>
79
+ <p>{icon.name}: </p>
80
+ <IconComponent key={index} {...args} />
81
+ </WrapperIcons>
82
+ );
83
+ })}
84
+ </>
85
+ );
86
+ },
87
+ };
88
+
89
+ export const Default: Story = {
90
+ ...grupIcons,
91
+ args: {},
92
+ };
package/src/icons/index.ts ADDED
@@ -0,0 +1,49 @@
1
+ import { IconDownload } from "./download-icon";
2
+ import { IconVisibillity } from "./visibillity-icon";
3
+ import { IconEdit } from "./edit-icon";
4
+ import { IconDelete } from "./delete-icon";
5
+ import { IconCalendar } from "./calendar-icon";
6
+ import { IconProfile } from "./profile-icon";
7
+ import { IconUpload } from "./upload-icon";
8
+ import { IconNewTab } from "./new-tab-icon";
9
+ import { IconWarning } from "./warning-icon";
10
+ import { IconCheckCircle } from "./check-circle-icon";
11
+ import { IconEventAvaliable } from "./event-avaliable-icon";
12
+ import { IconLogout } from "./logout-icon";
13
+ import { IconCLose } from "./close-icon";
14
+ import { IconAdd } from "./add-icon";
15
+ import { IconRemove } from "./remove-icon";
16
+ import { IconCircleExpland } from "./circle-expland-icon";
17
+ import { IconCircleRecall } from "./circle-to-recall-icon";
18
+ import { IconArrowExpland } from "./arrow-expland-icon";
19
+ import { IconArrowRecall } from "./arrow-to-recall-icon";
20
+ import { IconTriangleExpand } from "./triangle-expand-icon";
21
+ import { IconTriangleRecall } from "./triangle-to-recall-icon";
22
+ import { IconSwap } from "./swap-icon";
23
+ import { IconAddCell } from "./add-cell-icon";
24
+
25
+ export {
26
+ IconDownload,
27
+ IconVisibillity,
28
+ IconEdit,
29
+ IconDelete,
30
+ IconCalendar,
31
+ IconProfile,
32
+ IconUpload,
33
+ IconNewTab,
34
+ IconWarning,
35
+ IconCheckCircle,
36
+ IconEventAvaliable,
37
+ IconLogout,
38
+ IconCLose,
39
+ IconAdd,
40
+ IconRemove,
41
+ IconCircleExpland,
42
+ IconCircleRecall,
43
+ IconArrowExpland,
44
+ IconArrowRecall,
45
+ IconTriangleExpand,
46
+ IconTriangleRecall,
47
+ IconSwap,
48
+ IconAddCell,
49
+ };
package/src/icons/logout-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconLogout = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="19"
6
+ height="19"
7
+ viewBox="0 0 19 19"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.6665 18.5C2.1165 18.5 1.64567 18.3042 1.254 17.9125C0.862337 17.5208 0.666504 17.05 0.666504 16.5V2.5C0.666504 1.95 0.862337 1.47917 1.254 1.0875C1.64567 0.695833 2.1165 0.5 2.6665 0.5H9.6665V2.5H2.6665V16.5H9.6665V18.5H2.6665ZM13.6665 14.5L12.2915 13.05L14.8415 10.5H6.6665V8.5H14.8415L12.2915 5.95L13.6665 4.5L18.6665 9.5L13.6665 14.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/new-tab-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconNewTab = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="19"
6
+ height="19"
7
+ viewBox="0 0 19 19"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M2.6665 18.5C2.1165 18.5 1.64567 18.3042 1.254 17.9125C0.862337 17.5208 0.666504 17.05 0.666504 16.5V2.5C0.666504 1.95 0.862337 1.47917 1.254 1.0875C1.64567 0.695833 2.1165 0.5 2.6665 0.5H9.6665V2.5H2.6665V16.5H16.6665V9.5H18.6665V16.5C18.6665 17.05 18.4707 17.5208 18.079 17.9125C17.6873 18.3042 17.2165 18.5 16.6665 18.5H2.6665ZM7.3665 13.2L5.9665 11.8L15.2665 2.5H11.6665V0.5H18.6665V7.5H16.6665V3.9L7.3665 13.2Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/pdf-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconPdf = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="21"
6
+ height="21"
7
+ viewBox="0 0 21 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M7.6665 11H8.6665V9H9.6665C9.94984 9 10.1873 8.90417 10.379 8.7125C10.5707 8.52083 10.6665 8.28333 10.6665 8V7C10.6665 6.71667 10.5707 6.47917 10.379 6.2875C10.1873 6.09583 9.94984 6 9.6665 6H7.6665V11ZM8.6665 8V7H9.6665V8H8.6665ZM11.6665 11H13.6665C13.9498 11 14.1873 10.9042 14.379 10.7125C14.5707 10.5208 14.6665 10.2833 14.6665 10V7C14.6665 6.71667 14.5707 6.47917 14.379 6.2875C14.1873 6.09583 13.9498 6 13.6665 6H11.6665V11ZM12.6665 10V7H13.6665V10H12.6665ZM15.6665 11H16.6665V9H17.6665V8H16.6665V7H17.6665V6H15.6665V11ZM6.6665 16.5C6.1165 16.5 5.64567 16.3042 5.254 15.9125C4.86234 15.5208 4.6665 15.05 4.6665 14.5V2.5C4.6665 1.95 4.86234 1.47917 5.254 1.0875C5.64567 0.695833 6.1165 0.5 6.6665 0.5H18.6665C19.2165 0.5 19.6873 0.695833 20.079 1.0875C20.4707 1.47917 20.6665 1.95 20.6665 2.5V14.5C20.6665 15.05 20.4707 15.5208 20.079 15.9125C19.6873 16.3042 19.2165 16.5 18.6665 16.5H6.6665ZM6.6665 14.5H18.6665V2.5H6.6665V14.5ZM2.6665 20.5C2.1165 20.5 1.64567 20.3042 1.254 19.9125C0.862337 19.5208 0.666504 19.05 0.666504 18.5V4.5H2.6665V18.5H16.6665V20.5H2.6665Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/profile-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconProfile = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="17"
7
+ viewBox="0 0 17 17"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M8.6665 8.5C7.5665 8.5 6.62484 8.10833 5.8415 7.325C5.05817 6.54167 4.6665 5.6 4.6665 4.5C4.6665 3.4 5.05817 2.45833 5.8415 1.675C6.62484 0.891667 7.5665 0.5 8.6665 0.5C9.7665 0.5 10.7082 0.891667 11.4915 1.675C12.2748 2.45833 12.6665 3.4 12.6665 4.5C12.6665 5.6 12.2748 6.54167 11.4915 7.325C10.7082 8.10833 9.7665 8.5 8.6665 8.5ZM0.666504 16.5V13.7C0.666504 13.1333 0.812337 12.6125 1.104 12.1375C1.39567 11.6625 1.78317 11.3 2.2665 11.05C3.29984 10.5333 4.34984 10.1458 5.4165 9.8875C6.48317 9.62917 7.5665 9.5 8.6665 9.5C9.7665 9.5 10.8498 9.62917 11.9165 9.8875C12.9832 10.1458 14.0332 10.5333 15.0665 11.05C15.5498 11.3 15.9373 11.6625 16.229 12.1375C16.5207 12.6125 16.6665 13.1333 16.6665 13.7V16.5H0.666504ZM2.6665 14.5H14.6665V13.7C14.6665 13.5167 14.6207 13.35 14.529 13.2C14.4373 13.05 14.3165 12.9333 14.1665 12.85C13.2665 12.4 12.3582 12.0625 11.4415 11.8375C10.5248 11.6125 9.59984 11.5 8.6665 11.5C7.73317 11.5 6.80817 11.6125 5.8915 11.8375C4.97484 12.0625 4.0665 12.4 3.1665 12.85C3.0165 12.9333 2.89567 13.05 2.804 13.2C2.71234 13.35 2.6665 13.5167 2.6665 13.7V14.5ZM8.6665 6.5C9.2165 6.5 9.68734 6.30417 10.079 5.9125C10.4707 5.52083 10.6665 5.05 10.6665 4.5C10.6665 3.95 10.4707 3.47917 10.079 3.0875C9.68734 2.69583 9.2165 2.5 8.6665 2.5C8.1165 2.5 7.64567 2.69583 7.254 3.0875C6.86234 3.47917 6.6665 3.95 6.6665 4.5C6.6665 5.05 6.86234 5.52083 7.254 5.9125C7.64567 6.30417 8.1165 6.5 8.6665 6.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/remove-icon.tsx ADDED
@@ -0,0 +1,14 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconRemove = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="15"
6
+ height="3"
7
+ viewBox="0 0 15 3"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path d="M0.666504 2.5V0.5H14.6665V2.5H0.666504Z" fill="black" />
13
+ </svg>
14
+ );
package/src/icons/swap-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconSwap = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="21"
7
+ viewBox="0 0 17 21"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M4.6665 11.5V4.325L2.0915 6.9L0.666504 5.5L5.6665 0.5L10.6665 5.5L9.2415 6.9L6.6665 4.325V11.5H4.6665ZM11.6665 20.5L6.6665 15.5L8.0915 14.1L10.6665 16.675V9.5H12.6665V16.675L15.2415 14.1L16.6665 15.5L11.6665 20.5Z"
14
+ fill="black"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/triangle-expand-icon.tsx ADDED
@@ -0,0 +1,14 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconTriangleExpand = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="11"
6
+ height="6"
7
+ viewBox="0 0 11 6"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path d="M0.666504 5.5L5.6665 0.5L10.6665 5.5H0.666504Z" fill="black" />
13
+ </svg>
14
+ );
package/src/icons/triangle-to-recall-icon.tsx ADDED
@@ -0,0 +1,14 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconTriangleRecall = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="11"
6
+ height="6"
7
+ viewBox="0 0 11 6"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path d="M5.6665 5.5L0.666504 0.5H10.6665L5.6665 5.5Z" fill="#4A4A4B" />
13
+ </svg>
14
+ );
package/src/icons/upload-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconUpload = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="17"
6
+ height="17"
7
+ viewBox="0 0 17 17"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M7.6665 16.5V8.35L5.0665 10.95L3.6665 9.5L8.6665 4.5L13.6665 9.5L12.2665 10.95L9.6665 8.35V16.5H7.6665ZM0.666504 5.5V2.5C0.666504 1.95 0.862337 1.47917 1.254 1.0875C1.64567 0.695833 2.1165 0.5 2.6665 0.5H14.6665C15.2165 0.5 15.6873 0.695833 16.079 1.0875C16.4707 1.47917 16.6665 1.95 16.6665 2.5V5.5H14.6665V2.5H2.6665V5.5H0.666504Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/visibillity-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconVisibillity = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="23"
6
+ height="15"
7
+ viewBox="0 0 23 15"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M11.6665 12C12.9165 12 13.979 11.5625 14.854 10.6875C15.729 9.8125 16.1665 8.75 16.1665 7.5C16.1665 6.25 15.729 5.1875 14.854 4.3125C13.979 3.4375 12.9165 3 11.6665 3C10.4165 3 9.354 3.4375 8.479 4.3125C7.604 5.1875 7.1665 6.25 7.1665 7.5C7.1665 8.75 7.604 9.8125 8.479 10.6875C9.354 11.5625 10.4165 12 11.6665 12ZM11.6665 10.2C10.9165 10.2 10.279 9.9375 9.754 9.4125C9.229 8.8875 8.9665 8.25 8.9665 7.5C8.9665 6.75 9.229 6.1125 9.754 5.5875C10.279 5.0625 10.9165 4.8 11.6665 4.8C12.4165 4.8 13.054 5.0625 13.579 5.5875C14.104 6.1125 14.3665 6.75 14.3665 7.5C14.3665 8.25 14.104 8.8875 13.579 9.4125C13.054 9.9375 12.4165 10.2 11.6665 10.2ZM11.6665 15C9.23317 15 7.0165 14.3208 5.0165 12.9625C3.0165 11.6042 1.5665 9.78333 0.666504 7.5C1.5665 5.21667 3.0165 3.39583 5.0165 2.0375C7.0165 0.679167 9.23317 0 11.6665 0C14.0998 0 16.3165 0.679167 18.3165 2.0375C20.3165 3.39583 21.7665 5.21667 22.6665 7.5C21.7665 9.78333 20.3165 11.6042 18.3165 12.9625C16.3165 14.3208 14.0998 15 11.6665 15ZM11.6665 13C13.5498 13 15.279 12.5042 16.854 11.5125C18.429 10.5208 19.6332 9.18333 20.4665 7.5C19.6332 5.81667 18.429 4.47917 16.854 3.4875C15.279 2.49583 13.5498 2 11.6665 2C9.78317 2 8.054 2.49583 6.479 3.4875C4.904 4.47917 3.69984 5.81667 2.8665 7.5C3.69984 9.18333 4.904 10.5208 6.479 11.5125C8.054 12.5042 9.78317 13 11.6665 13Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/icons/warning-icon.tsx ADDED
@@ -0,0 +1,17 @@
1
+ import React, { SVGProps } from "react";
2
+
3
+ export const IconWarning = (props?: SVGProps<SVGSVGElement>) => (
4
+ <svg
5
+ width="23"
6
+ height="20"
7
+ viewBox="0 0 23 20"
8
+ fill="none"
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ {...props}
11
+ >
12
+ <path
13
+ d="M0.666504 19.5L11.6665 0.5L22.6665 19.5H0.666504ZM4.1165 17.5H19.2165L11.6665 4.5L4.1165 17.5ZM11.6665 16.5C11.9498 16.5 12.1873 16.4042 12.379 16.2125C12.5707 16.0208 12.6665 15.7833 12.6665 15.5C12.6665 15.2167 12.5707 14.9792 12.379 14.7875C12.1873 14.5958 11.9498 14.5 11.6665 14.5C11.3832 14.5 11.1457 14.5958 10.954 14.7875C10.7623 14.9792 10.6665 15.2167 10.6665 15.5C10.6665 15.7833 10.7623 16.0208 10.954 16.2125C11.1457 16.4042 11.3832 16.5 11.6665 16.5ZM10.6665 13.5H12.6665V8.5H10.6665V13.5Z"
14
+ fill="#4A4A4B"
15
+ />
16
+ </svg>
17
+ );
package/src/index.ts CHANGED
@@ -1,4 +1,56 @@
1
1
  import { Button } from "./components/Button/Button";
2
2
  import { Modal } from "./components/Modal/Modal";
3
3
 
4
- export { Button, Modal };
4
+ import {
5
+ IconDownload,
6
+ IconVisibillity,
7
+ IconEdit,
8
+ IconDelete,
9
+ IconCalendar,
10
+ IconProfile,
11
+ IconUpload,
12
+ IconNewTab,
13
+ IconWarning,
14
+ IconCheckCircle,
15
+ IconEventAvaliable,
16
+ IconLogout,
17
+ IconCLose,
18
+ IconAdd,
19
+ IconRemove,
20
+ IconCircleExpland,
21
+ IconCircleRecall,
22
+ IconArrowExpland,
23
+ IconArrowRecall,
24
+ IconTriangleExpand,
25
+ IconTriangleRecall,
26
+ IconSwap,
27
+ IconAddCell,
28
+ } from "./icons/index";
29
+
30
+ export {
31
+ Button,
32
+ Modal,
33
+ IconDownload,
34
+ IconVisibillity,
35
+ IconEdit,
36
+ IconDelete,
37
+ IconCalendar,
38
+ IconProfile,
39
+ IconUpload,
40
+ IconNewTab,
41
+ IconWarning,
42
+ IconCheckCircle,
43
+ IconEventAvaliable,
44
+ IconLogout,
45
+ IconCLose,
46
+ IconAdd,
47
+ IconRemove,
48
+ IconCircleExpland,
49
+ IconCircleRecall,
50
+ IconArrowExpland,
51
+ IconArrowRecall,
52
+ IconTriangleExpand,
53
+ IconTriangleRecall,
54
+ IconSwap,
55
+ IconAddCell,
56
+ };
package/src/styled-components.d.ts CHANGED
@@ -6,7 +6,16 @@ declare module "styled-components" {
6
6
  colors: {
7
7
  primary: string;
8
8
  secondary: string;
9
-
9
+ hover: string;
10
+ textSecondary: string;
11
+ iconColor: string;
12
+ success: string;
13
+ warning: string;
14
+ alert: string;
15
+ information: string;
16
+ border: string;
17
+ lightGrey: string;
18
+ grey: string;
10
19
  base: {
11
20
  white: string;
12
21
  black: string;
package/tsconfig.json CHANGED
@@ -18,6 +18,6 @@
18
18
  "noEmit": true,
19
19
  "jsx": "react"
20
20
  },
21
- "include": ["src"],
21
+ "include": ["src", "src/icons/.tsx"],
22
22
  "exclude": ["node_modules", "lib"]
23
23
  }
package/src/components/Modal/iconeClose.tsx DELETED
@@ -1,17 +0,0 @@
1
- import React, { SVGProps } from "react";
2
-
3
- export const CloseIcon = (props: SVGProps<SVGSVGElement>) => (
4
- <svg
5
- width="14"
6
- height="17"
7
- viewBox="0 0 14 17"
8
- fill="none"
9
- xmlns="http://www.w3.org/2000/svg"
10
- {...props}
11
- >
12
- <path
13
- d="M7.4251 10.1343L2.5251 15.8543C2.34176 16.0684 2.10843 16.1754 1.8251 16.1754C1.54176 16.1754 1.30843 16.0684 1.1251 15.8543C0.941764 15.6403 0.850098 15.3679 0.850098 15.0372C0.850098 14.7064 0.941764 14.4341 1.1251 14.2201L6.0251 8.50003L1.1251 2.78002C0.941764 2.566 0.850098 2.29362 0.850098 1.96287C0.850098 1.63212 0.941764 1.35974 1.1251 1.14573C1.30843 0.931714 1.54176 0.824707 1.8251 0.824707C2.10843 0.824707 2.34176 0.931714 2.5251 1.14573L7.4251 6.86574L12.3251 1.14573C12.5084 0.931714 12.7418 0.824707 13.0251 0.824707C13.3084 0.824707 13.5418 0.931714 13.7251 1.14573C13.9084 1.35974 14.0001 1.63212 14.0001 1.96287C14.0001 2.29362 13.9084 2.566 13.7251 2.78002L8.8251 8.50003L13.7251 14.2201C13.9084 14.4341 14.0001 14.7064 14.0001 15.0372C14.0001 15.3679 13.9084 15.6403 13.7251 15.8543C13.5418 16.0684 13.3084 16.1754 13.0251 16.1754C12.7418 16.1754 12.5084 16.0684 12.3251 15.8543L7.4251 10.1343Z"
14
- fill="white"
15
- />
16
- </svg>
17
- );