@gataca/design-system 0.3.94 → 0.3.96

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 (35) hide show
  1. package/dist/components/native/Action/ActionItems/actionItems_styles.native.d.ts +8 -8
  2. package/dist/components/native/Alerts/Alert/Alert_styles.native.d.ts +1 -1
  3. package/dist/components/native/BottomSticky/BottomStickyContainer/bottomStickyContainer_styles.native.d.ts +3 -3
  4. package/dist/components/native/Buttons/Button/styles.native.d.ts +2 -2
  5. package/dist/components/native/Buttons/RoundedButton/styles.native.d.ts +2 -2
  6. package/dist/components/native/Buttons/SegmentedButton/styles.native.d.ts +2 -2
  7. package/dist/components/native/Cards/Consent/consentCard_styles.native.d.ts +1 -1
  8. package/dist/components/native/Cards/Credential/credential_styles.native.d.ts +3 -3
  9. package/dist/components/native/Cards/HeadingAvatars/headingAvatarsCard_styles.native.d.ts +2 -2
  10. package/dist/components/native/Cards/MiniCredential/miniCredential_styles.native.d.ts +2 -2
  11. package/dist/components/native/Chips/Chip/styles.native.d.ts +1 -1
  12. package/dist/components/native/Dialog/Dialog/dialog_styles.native.d.ts +11 -11
  13. package/dist/components/native/Drawer/BottomDrawer/bottomDrawer_styles.native.d.ts +6 -6
  14. package/dist/components/native/Headings/HeadingContainer/HeadingContainer_styles.native.d.ts +6 -0
  15. package/dist/components/native/Headings/HeadingContainer/HeadingContainer_types.native.d.ts +2 -0
  16. package/dist/components/native/Headings/HeadingCredential/HeadingCredential_styles.native.d.ts +8 -8
  17. package/dist/components/native/Indicator/Indicator/indicator_styles.native.d.ts +1 -1
  18. package/dist/components/native/Lists/List/list_styles.native.d.ts +1 -1
  19. package/dist/components/native/Lists/ListItem/listItem_styles.native.d.ts +3 -3
  20. package/dist/components/native/NavBar/NavigationBar/navigationBar_styles.native.d.ts +1 -1
  21. package/dist/components/native/Popover/popover_styles.native.d.ts +14 -14
  22. package/dist/components/native/TextField/TextField/textField_styles.native.d.ts +3 -3
  23. package/dist/components/native/Tooltips/Tooltip/tooltip_styles.native.d.ts +2 -2
  24. package/dist/components/native/TopAppBar/TopAppBar/topAppBar_styles.native.d.ts +2 -2
  25. package/dist/components/native/TopAppBar/TopDrawerBar/topDrawerBar_styles.native.d.ts +2 -2
  26. package/dist/components/web/Headings/HeadingContainer/HeadingContainer_styles.web.d.ts +1 -0
  27. package/dist/components/web/Headings/HeadingContainer/HeadingContainer_types.web.d.ts +2 -0
  28. package/dist/components/web/HoverObserver/HoverObserver.web.d.ts +35 -0
  29. package/dist/components/web/HoverObserver/index.web.d.ts +2 -0
  30. package/dist/index.native.js +1 -1
  31. package/dist/index.native.js.map +1 -1
  32. package/dist/index.web.js +1 -1
  33. package/dist/index.web.js.map +1 -1
  34. package/dist/utils/noop.d.ts +2 -0
  35. package/package.json +7 -1
@@ -23,20 +23,20 @@ declare const _default: {
23
23
  borderRadius: number;
24
24
  };
25
25
  landscapeImage: {
26
- minWidth: "100%";
27
- minHeight: "100%";
28
- maxHeight: "100%";
26
+ minWidth: string;
27
+ minHeight: string;
28
+ maxHeight: string;
29
29
  objectFit: "cover";
30
30
  };
31
31
  portraitImage: {
32
- minWidth: "100%";
33
- minHeight: "100%";
34
- maxWidth: "100%";
32
+ minWidth: string;
33
+ minHeight: string;
34
+ maxWidth: string;
35
35
  objectFit: "cover";
36
36
  };
37
37
  squareImage: {
38
- minWidth: "100%";
39
- minHeight: "100%";
38
+ minWidth: string;
39
+ minHeight: string;
40
40
  objectFit: "cover";
41
41
  };
42
42
  };
@@ -8,7 +8,7 @@ declare const _default: {
8
8
  gap: number;
9
9
  alignItems: "center";
10
10
  padding: number;
11
- width: "100%";
11
+ width: string;
12
12
  };
13
13
  leadingIconContainer: {
14
14
  height: number;
@@ -5,7 +5,7 @@ declare const _default: {
5
5
  alignItems: "center";
6
6
  justifyContent: "center";
7
7
  alignSelf: "stretch";
8
- width: "100%";
8
+ width: string;
9
9
  right: number;
10
10
  left: number;
11
11
  position: "absolute";
@@ -18,9 +18,9 @@ declare const _default: {
18
18
  flexDirection: "row";
19
19
  justifyContent: "center";
20
20
  gap: number;
21
- width: "100%";
21
+ width: string;
22
22
  flexWrap: "wrap-reverse";
23
- marginLeft: "auto";
23
+ marginLeft: string;
24
24
  padding: number;
25
25
  alignItems: "stretch";
26
26
  };
@@ -4,10 +4,10 @@ declare const _default: {
4
4
  alignItems: "center";
5
5
  justifyContent: "center";
6
6
  flexDirection: "row";
7
- width: "auto";
7
+ width: string;
8
8
  gap: number;
9
9
  borderRadius: number;
10
- maxWidth: "100%";
10
+ maxWidth: string;
11
11
  };
12
12
  };
13
13
  export default _default;
@@ -5,10 +5,10 @@ declare const _default: {
5
5
  alignItems: "center";
6
6
  justifyContent: "center";
7
7
  flexDirection: "row";
8
- width: "auto";
8
+ width: string;
9
9
  gap: number;
10
10
  borderRadius: number;
11
- maxWidth: "100%";
11
+ maxWidth: string;
12
12
  };
13
13
  };
14
14
  export default _default;
@@ -1,11 +1,11 @@
1
1
  declare const _default: {
2
2
  container: {
3
- width: "100%";
3
+ width: string;
4
4
  borderRadius: number;
5
5
  flexDirection: "row";
6
6
  justifyContent: "space-between";
7
7
  alignItems: "center";
8
- height: "auto";
8
+ height: string;
9
9
  alignSelf: "flex-start";
10
10
  overflow: "hidden";
11
11
  };
@@ -3,7 +3,7 @@ export declare const styles: {
3
3
  display: "flex";
4
4
  flexDirection: "column";
5
5
  alignItems: "center";
6
- width: "100%";
6
+ width: string;
7
7
  alignSelf: "stretch";
8
8
  borderRadius: number;
9
9
  };
@@ -7,14 +7,14 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
7
7
  backgroundColor: string;
8
8
  borderRadius: number;
9
9
  alignSelf: "stretch";
10
- width: "100%";
10
+ width: string;
11
11
  };
12
12
  linearGradientOverlay: {
13
13
  padding: number;
14
14
  display: "flex";
15
15
  flexDirection: "column";
16
16
  borderRadius: number;
17
- width: "100%";
17
+ width: string;
18
18
  alignSelf: "stretch";
19
19
  };
20
20
  credCardMainContent: {
@@ -22,7 +22,7 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
22
22
  flexDirection: "column";
23
23
  gap: number;
24
24
  minHeight: number;
25
- width: "100%";
25
+ width: string;
26
26
  alignSelf: "center";
27
27
  justifyContent: "space-between";
28
28
  };
@@ -4,7 +4,7 @@ export declare const styles: {
4
4
  display: "flex";
5
5
  flexDirection: "column";
6
6
  alignItems: "center";
7
- width: "100%";
7
+ width: string;
8
8
  borderRadius: number;
9
9
  alignSelf: "stretch";
10
10
  overflow: "hidden";
@@ -16,7 +16,7 @@ export declare const styles: {
16
16
  paddingBottom: number;
17
17
  flexDirection: "column";
18
18
  alignItems: "center";
19
- width: "100%";
19
+ width: string;
20
20
  alignSelf: "stretch";
21
21
  gap: number;
22
22
  };
@@ -16,8 +16,8 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
16
16
  display: "flex";
17
17
  flexDirection: "column";
18
18
  borderRadius: number;
19
- width: "100%";
20
- height: "100%";
19
+ width: string;
20
+ height: string;
21
21
  alignSelf: "stretch";
22
22
  gap: number;
23
23
  };
@@ -5,7 +5,7 @@ declare const _default: {
5
5
  alignItems: "center";
6
6
  justifyContent: "center";
7
7
  flexDirection: "row";
8
- width: "auto";
8
+ width: string;
9
9
  gap: number;
10
10
  };
11
11
  };
@@ -6,8 +6,8 @@ declare const _default: {
6
6
  top: number;
7
7
  left: number;
8
8
  right: number;
9
- width: "100%";
10
- height: "100%";
9
+ width: string;
10
+ height: string;
11
11
  flexDirection: "column";
12
12
  zIndex: number;
13
13
  display: "flex";
@@ -19,7 +19,7 @@ declare const _default: {
19
19
  display: "flex";
20
20
  flexDirection: "column";
21
21
  width: number;
22
- height: "auto";
22
+ height: string;
23
23
  elevation: number;
24
24
  shadowOffset: {
25
25
  width: number;
@@ -29,15 +29,15 @@ declare const _default: {
29
29
  shadowOpacity: number;
30
30
  shadowRadius: number;
31
31
  overflow: "hidden";
32
- maxWidth: "90%";
33
- maxHeight: "90%";
32
+ maxWidth: string;
33
+ maxHeight: string;
34
34
  };
35
35
  topContainer: {
36
36
  display: "flex";
37
37
  flexDirection: "row";
38
38
  justifyContent: "space-between";
39
39
  alignItems: "flex-start";
40
- width: "100%";
40
+ width: string;
41
41
  flexWrap: "wrap-reverse";
42
42
  paddingVertical: number;
43
43
  paddingHorizontal: number;
@@ -47,7 +47,7 @@ declare const _default: {
47
47
  display: "flex";
48
48
  justifyContent: "flex-start";
49
49
  alignItems: "flex-start";
50
- marginLeft: "auto";
50
+ marginLeft: string;
51
51
  alignSelf: "center";
52
52
  };
53
53
  mainContainer: {
@@ -67,7 +67,7 @@ declare const _default: {
67
67
  justifyContent: "flex-start";
68
68
  alignItems: "flex-start";
69
69
  gap: number;
70
- width: "100%";
70
+ width: string;
71
71
  };
72
72
  scrollableArea: {
73
73
  display: "flex";
@@ -77,7 +77,7 @@ declare const _default: {
77
77
  alignItems: "flex-start";
78
78
  gap: number;
79
79
  overflow: "scroll";
80
- width: "100%";
80
+ width: string;
81
81
  };
82
82
  textsContainer: {
83
83
  display: "flex";
@@ -85,7 +85,7 @@ declare const _default: {
85
85
  gap: number;
86
86
  alignItems: "flex-start";
87
87
  paddingHorizontal: number;
88
- width: "100%";
88
+ width: string;
89
89
  };
90
90
  bottomContainer: {
91
91
  paddingVertical: number;
@@ -98,7 +98,7 @@ declare const _default: {
98
98
  gap: number;
99
99
  alignItems: "center";
100
100
  flexWrap: "wrap-reverse";
101
- marginLeft: "auto";
101
+ marginLeft: string;
102
102
  };
103
103
  };
104
104
  export default _default;
@@ -4,13 +4,13 @@ declare const _default: {
4
4
  borderTopRightRadius: number;
5
5
  display: "flex";
6
6
  flexDirection: "column";
7
- height: "auto";
7
+ height: string;
8
8
  elevation: number;
9
9
  shadowOffset: {
10
10
  width: number;
11
11
  height: number;
12
12
  };
13
- width: "100%";
13
+ width: string;
14
14
  zIndex: number;
15
15
  shadowOpacity: number;
16
16
  shadowRadius: number;
@@ -18,7 +18,7 @@ declare const _default: {
18
18
  flex: number;
19
19
  };
20
20
  topSeparator: {
21
- width: "100%";
21
+ width: string;
22
22
  paddingTop: number;
23
23
  display: "flex";
24
24
  justifyContent: "center";
@@ -29,14 +29,14 @@ declare const _default: {
29
29
  paddingTop: number;
30
30
  borderRadius: number;
31
31
  backgroundColor: string;
32
- margin: "auto";
32
+ margin: string;
33
33
  };
34
34
  topContainer: {
35
35
  display: "flex";
36
36
  flexDirection: "row";
37
37
  justifyContent: "space-between";
38
38
  alignItems: "flex-start";
39
- width: "100%";
39
+ width: string;
40
40
  flexWrap: "wrap-reverse";
41
41
  paddingVertical: number;
42
42
  paddingHorizontal: number;
@@ -46,7 +46,7 @@ declare const _default: {
46
46
  display: "flex";
47
47
  justifyContent: "flex-start";
48
48
  alignItems: "flex-start";
49
- marginLeft: "auto";
49
+ marginLeft: string;
50
50
  alignSelf: "center";
51
51
  };
52
52
  mainContainer: {
@@ -5,5 +5,11 @@ declare const _default: {
5
5
  gap: number;
6
6
  alignItems: "flex-start";
7
7
  };
8
+ titleContainer: {
9
+ display: "flex";
10
+ flexDirection: "row";
11
+ gap: number;
12
+ alignItems: "center";
13
+ };
8
14
  };
9
15
  export default _default;
@@ -1,4 +1,5 @@
1
1
  import { ChipColor } from '../../Chips/Chip/Chip.types.native';
2
+ import { ParentComponentTooltipProps } from '../../Tooltips/Tooltip/tooltip_types.native';
2
3
  export type HeadingContainerSize = 'xmall' | 'small' | 'medium';
3
4
  export type HeadingContainerContextTextColor = 'grey' | 'black' | 'purple' | 'white';
4
5
  export type HeadingContainerAlign = 'left' | 'center';
@@ -13,6 +14,7 @@ export interface HeadingContainerProps {
13
14
  align?: HeadingContainerAlign;
14
15
  sectionName?: string;
15
16
  titleText?: string;
17
+ titleTooltip?: ParentComponentTooltipProps;
16
18
  contentText?: string;
17
19
  chip?: ChipProps;
18
20
  containerStyle?: any;
@@ -13,20 +13,20 @@ declare const _default: {
13
13
  borderRadius: number;
14
14
  };
15
15
  landscapeImage: {
16
- minWidth: "100%";
17
- minHeight: "100%";
18
- maxHeight: "100%";
16
+ minWidth: string;
17
+ minHeight: string;
18
+ maxHeight: string;
19
19
  objectFit: "cover";
20
20
  };
21
21
  portraitImage: {
22
- minWidth: "100%";
23
- minHeight: "100%";
24
- maxWidth: "100%";
22
+ minWidth: string;
23
+ minHeight: string;
24
+ maxWidth: string;
25
25
  objectFit: "cover";
26
26
  };
27
27
  squareImage: {
28
- minWidth: "100%";
29
- minHeight: "100%";
28
+ minWidth: string;
29
+ minHeight: string;
30
30
  objectFit: "cover";
31
31
  };
32
32
  };
@@ -7,7 +7,7 @@ declare const _default: {
7
7
  flexShrink: number;
8
8
  };
9
9
  indicatorText: {
10
- minWidth: "100%";
10
+ minWidth: string;
11
11
  textAlign: "center";
12
12
  alignSelf: "center";
13
13
  };
@@ -1,7 +1,7 @@
1
1
  declare const _default: {
2
2
  listContainer: {
3
3
  alignSelf: "flex-start";
4
- width: "100%";
4
+ width: string;
5
5
  borderRadius: number;
6
6
  flexDirection: "column";
7
7
  overflow: "visible";
@@ -5,7 +5,7 @@ declare const _default: {
5
5
  justifyContent: "flex-start";
6
6
  alignItems: "flex-start";
7
7
  gap: number;
8
- width: "100%";
8
+ width: string;
9
9
  alignSelf: "stretch";
10
10
  };
11
11
  listItemContainer: {
@@ -18,7 +18,7 @@ declare const _default: {
18
18
  alignSelf: "stretch";
19
19
  paddingVertical: number;
20
20
  paddingHorizontal: number;
21
- width: "100%";
21
+ width: string;
22
22
  };
23
23
  listItemLeftContainer: {
24
24
  display: "flex";
@@ -34,7 +34,7 @@ declare const _default: {
34
34
  justifyContent: "center";
35
35
  alignItems: "center";
36
36
  cursor: "pointer";
37
- marginLeft: "auto";
37
+ marginLeft: string;
38
38
  };
39
39
  };
40
40
  export default _default;
@@ -1,6 +1,6 @@
1
1
  declare const _default: {
2
2
  navigationBarContainer: {
3
- width: "100%";
3
+ width: string;
4
4
  right: number;
5
5
  left: number;
6
6
  position: "absolute";
@@ -6,8 +6,8 @@ declare const _default: {
6
6
  top: number;
7
7
  left: number;
8
8
  right: number;
9
- width: "100%";
10
- height: "100%";
9
+ width: string;
10
+ height: string;
11
11
  flexDirection: "column";
12
12
  zIndex: number;
13
13
  display: "flex";
@@ -26,8 +26,8 @@ declare const _default: {
26
26
  shadowOpacity: number;
27
27
  shadowRadius: number;
28
28
  overflow: "hidden";
29
- maxWidth: "90%";
30
- maxHeight: "90%";
29
+ maxWidth: string;
30
+ maxHeight: string;
31
31
  padding: number;
32
32
  gap: number;
33
33
  };
@@ -35,29 +35,29 @@ declare const _default: {
35
35
  position: "relative";
36
36
  flex: number;
37
37
  maxHeight: number;
38
- width: "100%";
38
+ width: string;
39
39
  overflow: "hidden";
40
40
  borderRadius: number;
41
41
  };
42
42
  landscapeImage: {
43
- minWidth: "100%";
44
- minHeight: "100%";
45
- maxHeight: "100%";
43
+ minWidth: string;
44
+ minHeight: string;
45
+ maxHeight: string;
46
46
  objectFit: "cover";
47
47
  };
48
48
  portraitImage: {
49
- minWidth: "100%";
50
- minHeight: "100%";
51
- maxWidth: "100%";
49
+ minWidth: string;
50
+ minHeight: string;
51
+ maxWidth: string;
52
52
  objectFit: "cover";
53
53
  };
54
54
  squareImage: {
55
- minWidth: "100%";
56
- minHeight: "100%";
55
+ minWidth: string;
56
+ minHeight: string;
57
57
  objectFit: "cover";
58
58
  };
59
59
  bottomContainer: {
60
- width: "100%";
60
+ width: string;
61
61
  };
62
62
  };
63
63
  export default _default;
@@ -5,13 +5,13 @@ declare const _default: {
5
5
  alignItems: "flex-start";
6
6
  gap: number;
7
7
  alignSelf: "stretch";
8
- width: "100%";
8
+ width: string;
9
9
  };
10
10
  textFieldTopTextContainer: {
11
11
  display: "flex";
12
12
  flexDirection: "row";
13
13
  justifyContent: "space-between";
14
- width: "100%";
14
+ width: string;
15
15
  alignItems: "center";
16
16
  gap: number;
17
17
  };
@@ -34,7 +34,7 @@ declare const _default: {
34
34
  zIndex: number;
35
35
  };
36
36
  textFieldInput: {
37
- width: "100%";
37
+ width: string;
38
38
  borderWidth: number;
39
39
  borderRadius: number;
40
40
  paddingHorizontal: number;
@@ -6,10 +6,10 @@ export declare const popableStyles: {
6
6
  zIndex: number;
7
7
  };
8
8
  popoverTop: {
9
- bottom: "100%";
9
+ bottom: string;
10
10
  };
11
11
  popoverBottom: {
12
- top: "100%";
12
+ top: string;
13
13
  };
14
14
  popoverCaretLeft: {
15
15
  left: number;
@@ -1,6 +1,6 @@
1
1
  declare const _default: {
2
2
  topAppBarWrapper: {
3
- width: "100%";
3
+ width: string;
4
4
  right: number;
5
5
  left: number;
6
6
  position: "absolute";
@@ -16,7 +16,7 @@ declare const _default: {
16
16
  gap: number;
17
17
  minHeight: number;
18
18
  alignSelf: "stretch";
19
- width: "100%";
19
+ width: string;
20
20
  flexShrink: number;
21
21
  flexWrap: "wrap";
22
22
  };
@@ -1,6 +1,6 @@
1
1
  declare const _default: {
2
2
  topDrawerBarWrapper: {
3
- width: "100%";
3
+ width: string;
4
4
  right: number;
5
5
  left: number;
6
6
  position: "absolute";
@@ -16,7 +16,7 @@ declare const _default: {
16
16
  gap: number;
17
17
  minHeight: number;
18
18
  alignSelf: "stretch";
19
- width: "100%";
19
+ width: string;
20
20
  flexShrink: number;
21
21
  flexWrap: "wrap";
22
22
  paddingVertical: number;
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
2
  export declare const styles: () => {
3
3
  headingContainer: React.CSSProperties;
4
+ titleContainer: React.CSSProperties;
4
5
  };
@@ -1,4 +1,5 @@
1
1
  import { ChipColor } from '../../Chips/Chip/Chip.types.web';
2
+ import { ParentComponentTooltipProps } from '../../Tooltips/Tooltip/tooltip_types.web';
2
3
  export type HeadingContainerSize = 'xmall' | 'small' | 'medium';
3
4
  export type HeadingContainercontentTextColor = 'grey' | 'black' | 'purple' | 'white';
4
5
  export type HeadingContainerAlign = 'left' | 'center';
@@ -13,6 +14,7 @@ export interface HeadingContainerProps {
13
14
  contentTextColor: HeadingContainercontentTextColor;
14
15
  align?: HeadingContainerAlign;
15
16
  titleText?: string;
17
+ titleTooltip?: ParentComponentTooltipProps;
16
18
  contentText?: string;
17
19
  sectionName?: string;
18
20
  chip?: ChipProps;
@@ -0,0 +1,35 @@
1
+ import React, { ReactNode } from 'react';
2
+ type ReactHoverObserverProps = {
3
+ children: ReactNode | ((props: {
4
+ isHovering: boolean;
5
+ }) => ReactNode);
6
+ className?: string;
7
+ hoverDelayInMs?: number;
8
+ hoverOffDelayInMs?: number;
9
+ onHoverChanged?: (state: {
10
+ isHovering: boolean;
11
+ }) => void;
12
+ onMouseEnter?: (params: {
13
+ e: React.MouseEvent;
14
+ setIsHovering: () => void;
15
+ unsetIsHovering: () => void;
16
+ }) => void;
17
+ onMouseLeave?: (params: {
18
+ e: React.MouseEvent;
19
+ setIsHovering: () => void;
20
+ unsetIsHovering: () => void;
21
+ }) => void;
22
+ onMouseOver?: (params: {
23
+ e: React.MouseEvent;
24
+ setIsHovering: () => void;
25
+ unsetIsHovering: () => void;
26
+ }) => void;
27
+ onMouseOut?: (params: {
28
+ e: React.MouseEvent;
29
+ setIsHovering: () => void;
30
+ unsetIsHovering: () => void;
31
+ }) => void;
32
+ shouldDecorateChildren?: boolean;
33
+ };
34
+ declare const ReactHoverObserver: React.FC<ReactHoverObserverProps>;
35
+ export default ReactHoverObserver;
@@ -0,0 +1,2 @@
1
+ import HoverObserver from './HoverObserver.web';
2
+ export default HoverObserver;