@factorearth/component-library 3.2.7-fetch-template-04.0 → 3.2.7

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 (21) hide show
  1. package/README.md +11 -11
  2. package/dist/Atoms/Buttons/Button.js +16 -16
  3. package/dist/Atoms/DateField/DateField.js +94 -94
  4. package/dist/Atoms/DropdownField/DropdownField.js.map +1 -1
  5. package/dist/Atoms/FieldWrapper/FieldWrapper.js +21 -21
  6. package/dist/Atoms/Modal/Modal.d.ts +14 -0
  7. package/dist/Atoms/Modal/Modal.js +25 -0
  8. package/dist/Atoms/Modal/Modal.js.map +1 -0
  9. package/dist/Atoms/MoreHorizonButton/MoreHorizonButton.js +52 -52
  10. package/dist/Atoms/NoteField/NoteField.js +38 -38
  11. package/dist/Atoms/NumberField/NumberField.js +63 -63
  12. package/dist/Atoms/Pagination/Pagination.js +26 -26
  13. package/dist/Atoms/PhoneNumberField/PhoneNumberField.js +12 -12
  14. package/dist/Atoms/PhoneNumberField/PhoneNumberField.js.map +1 -1
  15. package/dist/Atoms/SortDropdown/SortDropdown.js +39 -39
  16. package/dist/Atoms/TextField/TextField.js +19 -19
  17. package/dist/Molecules/Thumbnail/Thumbnail.js +47 -47
  18. package/dist/Organisms/Card/Card.js +36 -36
  19. package/dist/Organisms/Modal/Modal.d.ts +6 -11
  20. package/dist/Organisms/Modal/Modal.js +68 -68
  21. package/package.json +2 -2
package/dist/Organisms/Modal/Modal.js CHANGED
@@ -3,82 +3,82 @@ import * as Dialog from "@radix-ui/react-dialog";
3
3
  import styled from "@emotion/styled";
4
4
  import { Button } from "../../Atoms/Buttons/Button";
5
5
  import { FiX } from "react-icons/fi";
6
- export const StyledDialog = styled(Dialog.Overlay) `
7
- background-color: ${({ colorPalette }) => colorPalette.background.secondary};
8
- opacity: 0.8;
9
- position: absolute;
10
- inset: 0;
11
- animation: overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
12
- z-index: 1000;
6
+ export const StyledDialog = styled(Dialog.Overlay) `
7
+ background-color: ${({ colorPalette }) => colorPalette.background.secondary};
8
+ opacity: 0.8;
9
+ position: absolute;
10
+ inset: 0;
11
+ animation: overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
12
+ z-index: 1000;
13
13
  `;
14
- export const StyledContent = styled(Dialog.Content) `
15
- background-color: ${({ colorPalette }) => colorPalette.background.primary};
16
- box-shadow: ${({ colorPalette }) => `${colorPalette.background.secondary} 0px 5px 15px`};
17
- color: ${({ colorPalette }) => colorPalette.text.primary};
18
- border-radius: 4px;
19
- position: fixed;
20
- top: 50%;
21
- left: 50%;
22
- transform: translate(-50%, -50%);
23
- max-height: 85vh;
24
- animation: contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
25
- z-index: 1000;
26
- display: flex;
27
- flex-direction: column;
28
- min-width: 300px;
29
- gap: 16px;
30
- :focus {
31
- outline: none;
32
- }
14
+ export const StyledContent = styled(Dialog.Content) `
15
+ background-color: ${({ colorPalette }) => colorPalette.background.primary};
16
+ box-shadow: ${({ colorPalette }) => `${colorPalette.background.secondary} 0px 5px 15px`};
17
+ color: ${({ colorPalette }) => colorPalette.text.primary};
18
+ border-radius: 4px;
19
+ position: fixed;
20
+ top: 50%;
21
+ left: 50%;
22
+ transform: translate(-50%, -50%);
23
+ max-height: 85vh;
24
+ animation: contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1);
25
+ z-index: 1000;
26
+ display: flex;
27
+ flex-direction: column;
28
+ min-width: 300px;
29
+ gap: 16px;
30
+ :focus {
31
+ outline: none;
32
+ }
33
33
  `;
34
- export const DialogContainer = styled.div `
35
- display: flex;
36
- padding: 24px 24px 0px 24px;
37
- flex-direction: column;
38
- align-items: center;
39
- gap: 16px;
40
- align-self: stretch;
34
+ export const DialogContainer = styled.div `
35
+ display: flex;
36
+ padding: 24px 24px 0px 24px;
37
+ flex-direction: column;
38
+ align-items: center;
39
+ gap: 16px;
40
+ align-self: stretch;
41
41
  `;
42
- export const ModalTitleContainer = styled.div `
43
- display: flex;
44
- justify-content: space-between;
45
- width: 100%;
42
+ export const ModalTitleContainer = styled.div `
43
+ display: flex;
44
+ justify-content: space-between;
45
+ width: 100%;
46
46
  `;
47
- export const ModalTitle = styled.div `
48
- font-size: 24px;
49
- font-style: normal;
50
- font-weight: 600;
51
- line-height: 150%;
47
+ export const ModalTitle = styled.div `
48
+ font-size: 24px;
49
+ font-style: normal;
50
+ font-weight: 600;
51
+ line-height: 150%;
52
52
  `;
53
- export const ModalHeading = styled.div `
54
- font-size: 16px;
55
- font-style: normal;
56
- font-weight: 700;
57
- line-height: 150%;
53
+ export const ModalHeading = styled.div `
54
+ font-size: 16px;
55
+ font-style: normal;
56
+ font-weight: 700;
57
+ line-height: 150%;
58
58
  `;
59
- export const ModelSubHeading = styled.div `
60
- font-size: 16px;
61
- font-style: normal;
62
- font-weight: 400;
63
- line-height: 24px; /* 150% */
64
- letter-spacing: 0.16px;
65
- width: 100%;
59
+ export const ModelSubHeading = styled.div `
60
+ font-size: 16px;
61
+ font-style: normal;
62
+ font-weight: 400;
63
+ line-height: 24px; /* 150% */
64
+ letter-spacing: 0.16px;
65
+ width: 100%;
66
66
  `;
67
- export const ModalFooter = styled.div `
68
- display: flex;
69
- padding: 24px 16px;
70
- justify-content: center;
71
- align-items: center;
72
- gap: 16px;
73
- align-self: stretch;
67
+ export const ModalFooter = styled.div `
68
+ display: flex;
69
+ padding: 24px 16px;
70
+ justify-content: center;
71
+ align-items: center;
72
+ gap: 16px;
73
+ align-self: stretch;
74
74
  `;
75
- export const ModalInputBox = styled.div `
76
- display: flex;
77
- width: 322px;
78
- flex-direction: column;
79
- justify-content: center;
80
- align-items: flex-start;
81
- gap: 8px;
75
+ export const ModalInputBox = styled.div `
76
+ display: flex;
77
+ width: 322px;
78
+ flex-direction: column;
79
+ justify-content: center;
80
+ align-items: flex-start;
81
+ gap: 8px;
82
82
  `;
83
83
  export const Modal = (props) => {
84
84
  const { open, children, colorPalette, setOpen, ...remainderProps } = props;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@factorearth/component-library",
3
- "version": "3.2.7-fetch-template-04.0",
3
+ "version": "3.2.7",
4
4
  "description": " A storybook component library for FactorEarth",
5
5
  "author": "madtrx <marlin.makori@gmail.com>",
6
6
  "homepage": "https://github.com/FactorEarth/RecordMiddleware#readme",
@@ -46,7 +46,7 @@
46
46
  "access": "public",
47
47
  "registry": "https://registry.npmjs.org/"
48
48
  },
49
- "gitHead": "dc94918ad24b9ef48d3110e4b047405ee158e302",
49
+ "gitHead": "e5724d5a801d289a70085752e01b19dd0b5d0ee7",
50
50
  "dependencies": {
51
51
  "@emotion/react": "^11.13.0",
52
52
  "@emotion/styled": "^11.13.0",