@gataca/design-system 0.3.35 → 0.3.37
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.
- package/dist/components/index.native.d.ts +1 -0
- package/dist/components/index.web.d.ts +1 -0
- package/dist/components/native/Action/ActionItems/actionItems_types.native.d.ts +1 -1
- package/dist/components/native/Alerts/Alert/Alert_types.native.d.ts +4 -0
- package/dist/components/native/Buttons/Button/Button.config.native.d.ts +2 -2
- package/dist/components/native/Cards/Consent/ConsentCard.native.d.ts +3 -0
- package/dist/components/native/Cards/Consent/consentCard_styles.native.d.ts +10 -0
- package/dist/components/native/Cards/Consent/consentCard_types.native.d.ts +11 -0
- package/dist/components/native/Cards/Consent/index.native.d.ts +2 -0
- package/dist/components/native/Checkbox/Checkbox/checkbox_types.native.d.ts +2 -0
- package/dist/components/native/Headings/HeadingContainer/HeadingContainer_types.native.d.ts +1 -1
- package/dist/components/native/Lists/List/list_types.native.d.ts +2 -0
- package/dist/components/native/Lists/ListItem/listItem_styles.native.d.ts +0 -1
- package/dist/components/native/Lists/ListItem/listItem_types.native.d.ts +8 -5
- package/dist/components/native/Lists/ListMetaContainer/listMetaContainer_types.native.d.ts +1 -1
- package/dist/components/native/RadioButton/RadioButton/radioButton_types.native.d.ts +2 -0
- package/dist/components/web/Action/ActionItems/actionItems_types.web.d.ts +1 -1
- package/dist/components/web/Alerts/Alert/Alert_types.web.d.ts +4 -0
- package/dist/components/web/Buttons/Button/Button.config.web.d.ts +2 -2
- package/dist/components/web/Cards/Consent/ConsentCard.web.d.ts +3 -0
- package/dist/components/web/Cards/Consent/consentCard_styles.web.d.ts +10 -0
- package/dist/components/web/Cards/Consent/consentCard_types.web.d.ts +11 -0
- package/dist/components/web/Cards/Consent/index.web.d.ts +2 -0
- package/dist/components/web/Checkbox/Checkbox/checkbox_types.web.d.ts +2 -0
- package/dist/components/web/Headings/HeadingContainer/HeadingContainer_types.web.d.ts +1 -1
- package/dist/components/web/Lists/List/list_types.web.d.ts +1 -0
- package/dist/components/web/Lists/ListItem/listItem_types.web.d.ts +8 -5
- package/dist/components/web/Lists/ListMetaContainer/listMetaContainer_types.web.d.ts +1 -1
- package/dist/components/web/RadioButton/RadioButton/radioButton_types.web.d.ts +2 -0
- package/dist/index.native.js +1 -1
- package/dist/index.native.js.map +1 -1
- package/dist/index.web.js +1 -1
- package/dist/index.web.js.map +1 -1
- package/package.json +1 -1
|
@@ -4,6 +4,7 @@ export { default as MultiShadowContainer } from './native/MultiShadowContainer/i
|
|
|
4
4
|
export { default as CredentialCard } from './native/Cards/Credential/index.native';
|
|
5
5
|
export { default as MiniCredentialCard } from './native/Cards/MiniCredential/index.native';
|
|
6
6
|
export { default as HeadingAvatarsCard } from './native/Cards/HeadingAvatars/index.native';
|
|
7
|
+
export { default as ConsentCard } from './native/Cards/Consent/index.native';
|
|
7
8
|
export { default as HeadingCredential } from './native/Headings/HeadingCredential/index.native';
|
|
8
9
|
export { default as HeadingContainer } from './native/Headings/HeadingContainer/index.native';
|
|
9
10
|
export { default as Button } from './native/Buttons/Button/index.native';
|
|
@@ -3,6 +3,7 @@ export { default as ActionItems } from './web/Action/ActionItems/index.web';
|
|
|
3
3
|
export { default as CredentialCard } from './web/Cards/Credential/index.web';
|
|
4
4
|
export { default as MiniCredentialCard } from './web/Cards/MiniCredential/index.web';
|
|
5
5
|
export { default as HeadingAvatarsCard } from './web/Cards/HeadingAvatars/index.web';
|
|
6
|
+
export { default as ConsentCard } from './web/Cards/Consent/index.web';
|
|
6
7
|
export { default as HeadingCredential } from './web/Headings/HeadingCredential/index.web';
|
|
7
8
|
export { default as HeadingContainer } from './web/Headings/HeadingContainer/index.web';
|
|
8
9
|
export { default as Button } from './web/Buttons/Button/index.web';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { HeadingContainerProps } from '../../Headings/HeadingContainer/HeadingContainer_types.native';
|
|
2
2
|
import { IconSize } from '../../Icons/icon_types';
|
|
3
|
-
export type ActionItemsColor = 'black' | 'gray' | 'purple';
|
|
3
|
+
export type ActionItemsColor = 'black' | 'gray' | 'purple' | 'white';
|
|
4
4
|
export type ActionItemsLeading = 'icon' | 'image';
|
|
5
5
|
export type ActionItemsLeadingAlign = 'left' | 'right';
|
|
6
6
|
export type ActionItemsLeadingSize = '24' | '16';
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
import { ButtonProps } from '../../Buttons/Button/Button.types.native';
|
|
2
|
+
export type IconSize = '16' | '24';
|
|
2
3
|
export type AlertState = 'alert' | 'warning' | 'info' | 'success';
|
|
4
|
+
export type AlertAlign = 'left' | 'right';
|
|
3
5
|
export type AlertOrientation = 'vertical' | 'horizontal';
|
|
4
6
|
export interface AlertProps {
|
|
5
7
|
state: AlertState;
|
|
6
8
|
title?: string;
|
|
7
9
|
subTitle?: string;
|
|
10
|
+
align?: AlertAlign;
|
|
8
11
|
orientation: AlertOrientation;
|
|
9
12
|
primaryButton?: ButtonProps;
|
|
10
13
|
secondaryButton?: ButtonProps;
|
|
11
14
|
isClosable?: boolean;
|
|
12
15
|
containerStyle?: any;
|
|
16
|
+
iconSize?: IconSize;
|
|
13
17
|
onClose?: (x?: any) => void;
|
|
14
18
|
}
|
|
@@ -487,7 +487,7 @@ export declare const createColorMap: (Colors: ColorsType) => {
|
|
|
487
487
|
};
|
|
488
488
|
};
|
|
489
489
|
};
|
|
490
|
-
export declare const getButtonGeneralStyles: (colors: ColorsType, color: string, style: string, state: string, textSize: string) => {
|
|
490
|
+
export declare const getButtonGeneralStyles: (colors: ColorsType, color: string, style: string, state: string, textSize: string, hasIcon?: boolean) => {
|
|
491
491
|
elevation?: number | undefined;
|
|
492
492
|
shadowColor?: string | undefined;
|
|
493
493
|
shadowOffset?: {
|
|
@@ -510,7 +510,7 @@ export declare const getButtonPaddings: (textSize: string, style: string) => {
|
|
|
510
510
|
paddingVertical: number;
|
|
511
511
|
paddingHorizontal: number;
|
|
512
512
|
};
|
|
513
|
-
export declare const getButtonMinHeight: (textSize: string) => 48 | 40;
|
|
513
|
+
export declare const getButtonMinHeight: (textSize: string, hasIcon?: boolean) => 34 | 48 | 40 | 42;
|
|
514
514
|
export declare const getButtonContentStyles: (fontStyles: StyleType, colors: ColorsType, color: string, style: string, state: string, textSize: string) => {
|
|
515
515
|
styles: {
|
|
516
516
|
lineHeight: number | undefined;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ButtonProps } from '../../Buttons/Button/Button.types.native';
|
|
2
|
+
import { ListProps } from '../../Lists/List/list_types.native';
|
|
3
|
+
import { ListItemProps } from '../../Lists/ListItem/listItem_types.native';
|
|
4
|
+
export type ConsentCardProps = {
|
|
5
|
+
leadingListItem: ListItemProps;
|
|
6
|
+
button?: ButtonProps;
|
|
7
|
+
contentListItem?: ListItemProps;
|
|
8
|
+
contentList?: ListProps;
|
|
9
|
+
onPress?: (x?: any) => void;
|
|
10
|
+
containerStyle?: any;
|
|
11
|
+
};
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
export type CheckboxSize = 'medium' | 'small';
|
|
2
2
|
export type CheckboxState = 'active' | 'default' | 'hover' | 'disable';
|
|
3
3
|
export type CheckboxAlign = 'left' | 'right';
|
|
4
|
+
export type CheckboxTextColor = 'black' | 'white';
|
|
4
5
|
export interface CheckboxProps {
|
|
5
6
|
state: CheckboxState;
|
|
6
7
|
leadingText?: string;
|
|
7
8
|
size?: CheckboxSize;
|
|
8
9
|
textAlign?: CheckboxAlign;
|
|
9
10
|
showInfoIcon?: boolean;
|
|
11
|
+
textColor?: CheckboxTextColor;
|
|
10
12
|
containerStyle?: any;
|
|
11
13
|
onPress?: (x?: any) => void;
|
|
12
14
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ChipColor } from '../../Chips/Chip/Chip.types.native';
|
|
2
2
|
export type HeadingContainerSize = 'xmall' | 'small' | 'medium';
|
|
3
|
-
export type HeadingContainerContextTextColor = 'grey' | 'black' | 'purple';
|
|
3
|
+
export type HeadingContainerContextTextColor = 'grey' | 'black' | 'purple' | 'white';
|
|
4
4
|
export type HeadingContainerAlign = 'left' | 'center';
|
|
5
5
|
export interface ChipProps {
|
|
6
6
|
color?: ChipColor;
|
|
@@ -9,16 +9,18 @@ import { IconSize } from '../../Icons/icon_types';
|
|
|
9
9
|
import { RadioButtonProps } from '../../RadioButton/RadioButton/radioButton_types.native';
|
|
10
10
|
import { SwitchProps } from '../../Switch/Switch/switch_types.native';
|
|
11
11
|
import { ListMetaContainerColor } from '../ListMetaContainer/listMetaContainer_types.native';
|
|
12
|
-
export type
|
|
12
|
+
export type ListItemType = 'filled' | 'ghost' | 'outline' | 'divider';
|
|
13
|
+
export type ListItemState = 'enable' | 'active';
|
|
13
14
|
export type ListItemCondition = 'all' | 'title' | 'titleExtraInfo';
|
|
14
15
|
export type ListItemSize = 'medium' | 'small';
|
|
15
|
-
export type ListItemColor = 'black' | 'gray';
|
|
16
|
+
export type ListItemColor = 'black' | 'gray' | 'white' | 'red';
|
|
16
17
|
export type ListItemAlign = 'left' | 'right';
|
|
17
|
-
export type ListItemLeading = 'none' | 'avatar' | 'credential' | 'icon' | 'indicator';
|
|
18
|
+
export type ListItemLeading = 'none' | 'avatar' | 'credential' | 'icon' | 'chip' | 'indicator';
|
|
18
19
|
export type ListItemTrailing = 'none' | 'checkbox' | 'switch' | 'radioButton' | 'notifications' | 'icon' | 'segmentedButton' | 'value' | 'action' | 'button' | 'chip';
|
|
19
20
|
export interface ListItemProps {
|
|
20
|
-
|
|
21
|
-
|
|
21
|
+
type?: ListItemType;
|
|
22
|
+
state?: ListItemState;
|
|
23
|
+
condition?: ListItemCondition;
|
|
22
24
|
title?: string;
|
|
23
25
|
content?: string;
|
|
24
26
|
extraInfo?: string;
|
|
@@ -55,6 +57,7 @@ export interface ListItemProps {
|
|
|
55
57
|
onPress: (x?: any) => void;
|
|
56
58
|
};
|
|
57
59
|
button?: ButtonProps;
|
|
60
|
+
leadingChip?: ChipProps;
|
|
58
61
|
chip?: ChipProps;
|
|
59
62
|
onPress?: (x: any) => void;
|
|
60
63
|
}
|
|
@@ -2,7 +2,7 @@ import { ActionItemsProps } from '../../Action/ActionItems/actionItems_types.nat
|
|
|
2
2
|
import { ChipProps } from '../../Chips/Chip/Chip.types.native';
|
|
3
3
|
export type ListMetaContainerCondition = 'all' | 'title' | 'titleExtraInfo';
|
|
4
4
|
export type ListMetaContainerSize = 'medium' | 'small';
|
|
5
|
-
export type ListMetaContainerColor = 'black' | 'gray' | 'red';
|
|
5
|
+
export type ListMetaContainerColor = 'black' | 'gray' | 'red' | 'white';
|
|
6
6
|
export type ListMetaContainerAlign = 'left' | 'right';
|
|
7
7
|
export interface ListMetaContainerProps {
|
|
8
8
|
condition: ListMetaContainerCondition;
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
export type RadioButtonSize = 'medium' | 'small';
|
|
2
2
|
export type RadioButtonState = 'active' | 'default' | 'hover' | 'disable';
|
|
3
3
|
export type RadioButtonAlign = 'left' | 'right';
|
|
4
|
+
export type RadioButtonColor = 'black' | 'white';
|
|
4
5
|
export interface RadioButtonProps {
|
|
5
6
|
state: RadioButtonState;
|
|
6
7
|
leadingText?: string;
|
|
7
8
|
size?: RadioButtonSize;
|
|
8
9
|
textAlign?: RadioButtonAlign;
|
|
9
10
|
showInfoIcon?: boolean;
|
|
11
|
+
textColor?: RadioButtonColor;
|
|
10
12
|
containerStyle?: any;
|
|
11
13
|
onPress?: (x?: any) => void;
|
|
12
14
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { HeadingContainerProps } from '../../Headings/HeadingContainer/HeadingContainer_types.web';
|
|
2
2
|
import { IconSize } from '../../Icons/icon_types';
|
|
3
|
-
export type ActionItemsColor = 'black' | 'gray' | 'purple';
|
|
3
|
+
export type ActionItemsColor = 'black' | 'gray' | 'purple' | 'white';
|
|
4
4
|
export type ActionItemsLeading = 'icon' | 'image';
|
|
5
5
|
export type ActionItemsLeadingAlign = 'left' | 'right';
|
|
6
6
|
export type ActionItemsLeadingSize = '24' | '16';
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
import { ButtonProps } from '../../Buttons/Button/Button.types.web';
|
|
2
|
+
export type IconSize = '16' | '24';
|
|
2
3
|
export type AlertState = 'alert' | 'warning' | 'info' | 'success';
|
|
4
|
+
export type AlertAlign = 'left' | 'right';
|
|
3
5
|
export type AlertOrientation = 'vertical' | 'horizontal';
|
|
4
6
|
export interface AlertProps {
|
|
5
7
|
state: AlertState;
|
|
6
8
|
title?: string;
|
|
7
9
|
subTitle?: string;
|
|
10
|
+
align?: AlertAlign;
|
|
8
11
|
orientation: AlertOrientation;
|
|
9
12
|
primaryButton?: ButtonProps;
|
|
10
13
|
secondaryButton?: ButtonProps;
|
|
11
14
|
isClosable?: boolean;
|
|
12
15
|
containerStyle?: any;
|
|
16
|
+
iconSize?: IconSize;
|
|
13
17
|
onClose?: (x?: any) => void;
|
|
14
18
|
}
|
|
@@ -487,7 +487,7 @@ export declare const createColorMap: (Colors: ColorsType) => {
|
|
|
487
487
|
};
|
|
488
488
|
};
|
|
489
489
|
};
|
|
490
|
-
export declare const getButtonGeneralStyles: (colors: ColorsType, color: string, style: string, state: string, textSize: string) => {
|
|
490
|
+
export declare const getButtonGeneralStyles: (colors: ColorsType, color: string, style: string, state: string, textSize: string, hasIcon?: boolean) => {
|
|
491
491
|
minHeight: number;
|
|
492
492
|
boxShadow: string | undefined;
|
|
493
493
|
padding: string;
|
|
@@ -501,7 +501,7 @@ export declare const getButtonFontStyles: (FontStyles: StyleType, textSize: stri
|
|
|
501
501
|
export declare const getButtonPaddings: (textSize: string, style: string) => {
|
|
502
502
|
padding: string;
|
|
503
503
|
};
|
|
504
|
-
export declare const getButtonMinHeight: (textSize: string) => 48 | 40;
|
|
504
|
+
export declare const getButtonMinHeight: (textSize: string, hasIcon?: boolean) => 48 | 40 | 32;
|
|
505
505
|
export declare const getButtonContentStyles: (fontStyles: StyleType, colors: ColorsType, color: string, style: string, state: string, textSize: string) => {
|
|
506
506
|
styles: {
|
|
507
507
|
lineHeight: string;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ButtonProps } from '../../Buttons/Button/Button.types.web';
|
|
2
|
+
import { ListProps } from '../../Lists/List/list_types.web';
|
|
3
|
+
import { ListItemProps } from '../../Lists/ListItem/listItem_types.web';
|
|
4
|
+
export type ConsentCardProps = {
|
|
5
|
+
leadingListItem: ListItemProps;
|
|
6
|
+
button?: ButtonProps;
|
|
7
|
+
contentListItem?: ListItemProps;
|
|
8
|
+
contentList?: ListProps;
|
|
9
|
+
onPress?: (x?: any) => void;
|
|
10
|
+
containerStyle?: any;
|
|
11
|
+
};
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
export type CheckboxSize = 'medium' | 'small';
|
|
2
2
|
export type CheckboxState = 'active' | 'default' | 'hover' | 'disable';
|
|
3
3
|
export type CheckboxAlign = 'left' | 'right';
|
|
4
|
+
export type CheckboxTextColor = 'black' | 'white';
|
|
4
5
|
export interface CheckboxProps {
|
|
5
6
|
state: CheckboxState;
|
|
6
7
|
leadingText?: string;
|
|
7
8
|
size?: CheckboxSize;
|
|
8
9
|
textAlign?: CheckboxAlign;
|
|
9
10
|
showInfoIcon?: boolean;
|
|
11
|
+
textColor?: CheckboxTextColor;
|
|
10
12
|
containerStyle?: any;
|
|
11
13
|
onPress?: (x?: any) => void;
|
|
12
14
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ChipColor } from '../../Chips/Chip/Chip.types.web';
|
|
2
2
|
export type HeadingContainerSize = 'xmall' | 'small' | 'medium';
|
|
3
|
-
export type HeadingContainercontentTextColor = 'grey' | 'black' | 'purple';
|
|
3
|
+
export type HeadingContainercontentTextColor = 'grey' | 'black' | 'purple' | 'white';
|
|
4
4
|
export type HeadingContainerAlign = 'left' | 'center';
|
|
5
5
|
export interface ChipProps {
|
|
6
6
|
color?: ChipColor;
|
|
@@ -9,16 +9,18 @@ import { IconSize } from '../../Icons/icon_types';
|
|
|
9
9
|
import { RadioButtonProps } from '../../RadioButton/RadioButton/radioButton_types.web';
|
|
10
10
|
import { SwitchProps } from '../../Switch/Switch/switch_types.web';
|
|
11
11
|
import { ListMetaContainerColor } from '../ListMetaContainer/listMetaContainer_types.web';
|
|
12
|
-
export type
|
|
12
|
+
export type ListItemType = 'filled' | 'ghost' | 'outline' | 'divider';
|
|
13
|
+
export type ListItemState = 'enable' | 'active';
|
|
13
14
|
export type ListItemCondition = 'all' | 'title' | 'titleExtraInfo';
|
|
14
15
|
export type ListItemSize = 'medium' | 'small';
|
|
15
|
-
export type ListItemColor = 'black' | 'gray';
|
|
16
|
+
export type ListItemColor = 'black' | 'gray' | 'white' | 'red';
|
|
16
17
|
export type ListItemAlign = 'left' | 'right';
|
|
17
|
-
export type ListItemLeading = 'none' | 'avatar' | 'credential' | 'icon' | 'indicator';
|
|
18
|
+
export type ListItemLeading = 'none' | 'avatar' | 'credential' | 'icon' | 'indicator' | 'chip';
|
|
18
19
|
export type ListItemTrailing = 'none' | 'checkbox' | 'switch' | 'radioButton' | 'notifications' | 'icon' | 'segmentedButton' | 'value' | 'action' | 'button' | 'chip';
|
|
19
20
|
export interface ListItemProps {
|
|
20
|
-
|
|
21
|
-
|
|
21
|
+
type?: ListItemType;
|
|
22
|
+
state?: ListItemState;
|
|
23
|
+
condition?: ListItemCondition;
|
|
22
24
|
title?: string;
|
|
23
25
|
content?: string;
|
|
24
26
|
extraInfo?: string;
|
|
@@ -55,6 +57,7 @@ export interface ListItemProps {
|
|
|
55
57
|
onPress: (x?: any) => void;
|
|
56
58
|
};
|
|
57
59
|
button?: ButtonProps;
|
|
60
|
+
leadingChip?: ChipProps;
|
|
58
61
|
chip?: ChipProps;
|
|
59
62
|
onPress?: (x?: any) => void;
|
|
60
63
|
}
|
|
@@ -2,7 +2,7 @@ import { ActionItemsProps } from '../../Action/ActionItems/actionItems_types.web
|
|
|
2
2
|
import { ChipProps } from '../../Chips/Chip/Chip.types.web';
|
|
3
3
|
export type ListMetaContainerCondition = 'all' | 'title' | 'titleExtraInfo';
|
|
4
4
|
export type ListMetaContainerSize = 'medium' | 'small';
|
|
5
|
-
export type ListMetaContainerColor = 'black' | 'gray' | 'red';
|
|
5
|
+
export type ListMetaContainerColor = 'black' | 'gray' | 'red' | 'white';
|
|
6
6
|
export type ListMetaContainerAlign = 'left' | 'right';
|
|
7
7
|
export interface ListMetaContainerProps {
|
|
8
8
|
condition: ListMetaContainerCondition;
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
export type RadioButtonSize = 'medium' | 'small';
|
|
2
2
|
export type RadioButtonState = 'active' | 'default' | 'hover' | 'disable';
|
|
3
3
|
export type RadioButtonAlign = 'left' | 'right';
|
|
4
|
+
export type RadioButtonColor = 'black' | 'white';
|
|
4
5
|
export interface RadioButtonProps {
|
|
5
6
|
state: RadioButtonState;
|
|
6
7
|
leadingText?: string;
|
|
7
8
|
size?: RadioButtonSize;
|
|
8
9
|
textAlign?: RadioButtonAlign;
|
|
9
10
|
showInfoIcon?: boolean;
|
|
11
|
+
textColor?: RadioButtonColor;
|
|
10
12
|
containerStyle?: any;
|
|
11
13
|
onPress?: (x?: any) => void;
|
|
12
14
|
}
|