@gataca/design-system 0.4.15 → 1.0.17

package/dist/components/index.native.d.ts

@@ -7,6 +7,7 @@ export { default as HeadingAvatarsCard } from './native/Cards/HeadingAvatars/ind
 export { default as ConsentCard } from './native/Cards/Consent/index.native';
 export { default as HeadingCredential } from './native/Headings/HeadingCredential/index.native';
 export { default as HeadingContainer } from './native/Headings/HeadingContainer/index.native';
+export { default as StatusHeadingContainer } from './native/Headings/StatusHeadingContainer/index.native';
 export { default as Button } from './native/Buttons/Button/index.native';
 export { default as RoundedButton } from './native/Buttons/RoundedButton/index.native';
 export { default as ButtonIcon } from './native/Buttons/ButtonIcon/index.native';

package/dist/components/index.web.d.ts

@@ -6,6 +6,7 @@ export { default as HeadingAvatarsCard } from './web/Cards/HeadingAvatars/index.
 export { default as ConsentCard } from './web/Cards/Consent/index.web';
 export { default as HeadingCredential } from './web/Headings/HeadingCredential/index.web';
 export { default as HeadingContainer } from './web/Headings/HeadingContainer/index.web';
+export { default as StatusHeadingContainer } from './web/Headings/StatusHeadingContainer/index.web';
 export { default as Button } from './web/Buttons/Button/index.web';
 export { default as RoundedButton } from './web/Buttons/RoundedButton/index.web';
 export { default as ButtonIcon } from './web/Buttons/ButtonIcon/index.web';

package/dist/components/native/Buttons/Button/Button.config.native.d.ts

@@ -514,7 +514,7 @@ export declare const getButtonMinHeight: (textSize: string, hasIcon?: boolean) =
 export declare const getButtonContentStyles: (fontStyles: StyleType, colors: ColorsType, color: string, style: string, state: string, textSize: string) => {
     styles: {
         lineHeight: number | undefined;
-        textAlignVertical: string;
+        textAlignVertical: "center";
         color: any;
         fontFamily?: string;
         fontSize?: number;

package/dist/components/native/Cards/MiniCredential/miniCredential_styles.native.d.ts

@@ -1,6 +1,6 @@
 import { ColorsType } from '../../../../styles/Colors';
 import { StyleType } from '../../../../styles';
-export declare const styles: (colors: ColorsType, fontStyles: StyleType, background_color?: string) => {
+export declare const styles: (credIsWhite: boolean, colors: ColorsType, fontStyles: StyleType, background_color?: string, hasIndicator?: boolean, size?: string) => {
     credCardContainer: {
         display: "flex";
         flexDirection: "column";
@@ -9,6 +9,10 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
         alignSelf: "stretch";
         width: number;
         height: number;
+        justifyContent: "flex-start" | "flex-end";
+        marginRight: number;
+        marginTop: number;
+        position: "relative";
     };
     linearGradientOverlay: {
         paddingVertical: number;
@@ -16,6 +20,7 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
         display: "flex";
         flexDirection: "column";
         borderRadius: number;
+        justifyContent: "flex-start" | "flex-end";
         width: "100%";
         height: "100%";
         alignSelf: "stretch";
@@ -63,6 +68,41 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
         height: number;
         resizeMode: "contain";
     };
+    credCardVerifiedIcon: {
+        marginLeft: "auto";
+        display: "flex";
+        alignItems: "flex-start";
+        justifyContent: "flex-end";
+    };
+    credCardIndicator: {
+        position: "absolute";
+        right: number;
+        top: number;
+    };
+    smallCredLines: {
+        display: "flex";
+        gap: number;
+        flexDirection: "column";
+        width: "100%";
+        alignSelf: "stretch";
+        marginTop: "auto";
+    };
+    smallCredLinesTop: {
+        backgroundColor: string;
+        height: number;
+        width: number;
+        gap: number;
+        borderRadius: number;
+        opacity: number;
+    };
+    smallCredLinesBottom: {
+        backgroundColor: string;
+        height: number;
+        width: number;
+        gap: number;
+        borderRadius: number;
+        opacity: number;
+    };
 };
 export declare const credentialCardShadows: (colors: ColorsType) => {
     elevation: number;

package/dist/components/native/Cards/MiniCredential/miniCredential_types.native.d.ts

@@ -1,5 +1,7 @@
 import { IconSize, IconStyle, ShieldIconSize } from '../../Icons/icon_types';
+import { IndicatorProps } from '../../Indicator/Indicator/indicator_types.native';
 export type VerifiedIcons = 'error' | 'check';
+export type MiniCredSize = 'medium' | 'small';
 export declare const verifiedIconMap: {
     [key in VerifiedIcons]: React.FC<{
         size: IconSize | ShieldIconSize;
@@ -11,11 +13,13 @@ export declare const verifiedIconMap: {
 };
 export type MiniCredentialCardProps = {
     id?: string;
+    size?: MiniCredSize;
     issuer: {
         image?: string;
         name: string;
         failToLoadImageText?: string;
     };
+    indicator?: IndicatorProps;
     chip?: {
         text: string;
         color?: string;

package/dist/components/native/Chips/Chip/Chip.config.native.d.ts

@@ -320,6 +320,40 @@ export declare const createColorMap: (Colors: ColorsType) => {
             };
         };
     };
+    lightPink: {
+        filled: {
+            enable: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            hover: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            active: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            disable: {
+                backgroundColor: string;
+                textColor: string;
+            };
+        };
+        outline: {
+            enable: {
+                textColor: string;
+            };
+            hover: {
+                textColor: string;
+            };
+            active: {
+                textColor: string;
+            };
+            disable: {
+                textColor: string;
+            };
+        };
+    };
     grey: {
         filled: {
             enable: {

package/dist/components/native/Chips/Chip/Chip.types.native.d.ts

@@ -1,5 +1,5 @@
 import { ParentComponentTooltipProps } from '../../Tooltips/Tooltip/tooltip_types.native';
-export type ChipColor = 'yellow' | 'lightYellow' | 'red' | 'grey' | 'white' | 'purple' | 'green' | 'blue' | 'teal' | 'pink' | 'black';
+export type ChipColor = 'yellow' | 'lightYellow' | 'red' | 'grey' | 'white' | 'purple' | 'green' | 'blue' | 'teal' | 'pink' | 'lightPink' | 'black';
 export type ChipState = 'enable' | 'hover' | 'disable' | 'active';
 export type ChipStyle = 'outline' | 'filled';
 export type ChipForm = 'square' | 'round';

package/dist/components/native/Headings/StatusHeadingContainer/StatusHeadingContainer.native.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StatusHeadingContainerProps } from './StatusHeadingContainer_types.native';
+declare const StatusHeadingContainer: (props: React.PropsWithChildren<StatusHeadingContainerProps>) => import("react/jsx-runtime").JSX.Element;
+export default StatusHeadingContainer;

package/dist/components/native/Headings/StatusHeadingContainer/StatusHeadingContainer_styles.native.d.ts

@@ -0,0 +1,16 @@
+declare const _default: {
+    statusHeadingContainer: {
+        display: "flex";
+        flexDirection: "column";
+        gap: number;
+        alignItems: "center";
+        width: "100%";
+    };
+    bottomImageContainer: {
+        width: "100%";
+        paddingVertical: number;
+        paddingHorizontal: number;
+        borderRadius: number;
+    };
+};
+export default _default;

package/dist/components/native/Headings/StatusHeadingContainer/StatusHeadingContainer_types.native.d.ts

@@ -0,0 +1,18 @@
+import { IllustrationProps } from '../../Illustrations/illustrations_types';
+import { HeadingContainerProps } from '../HeadingContainer/HeadingContainer_types.native';
+export interface StatusHeadingContainerProps {
+    id?: string;
+    swapIllustration: IllustrationProps;
+    headingContainer: HeadingContainerProps;
+    bottomImage?: {
+        source: any;
+        id?: string;
+        width?: number | string;
+        height?: number | string;
+        containerStyle?: any;
+        resizeMode?: 'cover' | 'contain' | 'stretch' | 'repeat' | 'center' | undefined;
+        resizeMethod?: 'auto' | 'resize' | 'scale' | undefined;
+        parentContainerStyle?: any;
+    };
+    containerStyle?: any;
+}

package/dist/components/native/Headings/StatusHeadingContainer/index.native.d.ts

@@ -0,0 +1,2 @@
+import StatusHeadingContainer from './StatusHeadingContainer.native';
+export default StatusHeadingContainer;

package/dist/components/native/Lists/List/list_types.native.d.ts

@@ -1,9 +1,12 @@
+import { HeadingContainerProps } from '../../Headings/HeadingContainer/HeadingContainer_types.native';
 import { ListItemProps } from '../ListItem/listItem_types.native';
 export type ListBg = 'grey' | 'white';
 export interface ListProps {
     id?: string;
     list: ListItemProps[];
     bgColor?: ListBg;
+    spacing?: boolean;
+    headingContainer?: HeadingContainerProps;
     containerStyle?: any;
     contentContainerStyle?: any;
     nestedScrollEnabled?: boolean;

package/dist/components/native/TopAppBar/TopDrawerBar/topDrawerBar_styles.native.d.ts

@@ -29,5 +29,19 @@ declare const _default: {
         justifyContent: "flex-start";
         flexDirection: "row";
     };
+    notchContainer: {
+        width: "100%";
+        paddingTop: number;
+        paddingBottom: number;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    notch: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        backgroundColor: string;
+    };
 };
 export default _default;

package/dist/components/native/TopAppBar/TopDrawerBar/topDrawerBar_types.native.d.ts

@@ -5,6 +5,7 @@ export interface TopDrawerBarProps {
     configuration: TopDrawerBarConfiguration;
     bg?: boolean;
     divider?: boolean;
+    notch?: boolean;
     leadingIcon?: {
         Icon: React.FC<{
             size: IconSize;

package/dist/components/web/Cards/MiniCredential/miniCredential_styles.web.d.ts

@@ -1,6 +1,6 @@
 import { ColorsType } from '../../../../styles/Colors';
 import { StyleType } from '../../../../styles';
-export declare const styles: (colors: ColorsType, fontStyles: StyleType, background_color?: string, verifiedIcon?: boolean, hasGradient?: boolean) => {
+export declare const styles: (credIsWhite: boolean, colors: ColorsType, fontStyles: StyleType, background_color?: string, verifiedIcon?: boolean, hasGradient?: boolean, hasIndicator?: boolean, size?: string) => {
     credCardContainer: React.CSSProperties;
     linearGradientOverlay: React.CSSProperties;
     credCardMainContent: React.CSSProperties;
@@ -9,4 +9,8 @@ export declare const styles: (colors: ColorsType, fontStyles: StyleType, backgro
     credIssuerImageError: React.CSSProperties;
     credCardIssuerImage: React.CSSProperties;
     credCardVerifiedIcon: React.CSSProperties;
+    credCardIndicator: React.CSSProperties;
+    smallCredLines: React.CSSProperties;
+    smallCredLinesTop: React.CSSProperties;
+    smallCredLinesBottom: React.CSSProperties;
 };

package/dist/components/web/Cards/MiniCredential/miniCredential_types.web.d.ts

@@ -1,5 +1,7 @@
 import { IconSize, IconStyle, ShieldIconSize } from '../../Icons/icon_types';
+import { IndicatorProps } from '../../Indicator/Indicator/indicator_types.web';
 export type VerifiedIcons = 'error' | 'check';
+export type MiniCredSize = 'medium' | 'small';
 export declare const verifiedIconMap: {
     [key in VerifiedIcons]: React.FC<{
         size: IconSize | ShieldIconSize;
@@ -11,7 +13,9 @@ export declare const verifiedIconMap: {
 };
 export type MiniCredentialCardProps = {
     id?: string;
+    size?: MiniCredSize;
     className?: string;
+    indicator?: IndicatorProps;
     issuer: {
         image?: string;
         name: string;

package/dist/components/web/Chips/Chip/Chip.config.web.d.ts

@@ -320,6 +320,40 @@ export declare const createColorMap: (Colors: ColorsType) => {
             };
         };
     };
+    lightPink: {
+        filled: {
+            enable: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            hover: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            active: {
+                backgroundColor: string;
+                textColor: string;
+            };
+            disable: {
+                backgroundColor: string;
+                textColor: string;
+            };
+        };
+        outline: {
+            enable: {
+                textColor: string;
+            };
+            hover: {
+                textColor: string;
+            };
+            active: {
+                textColor: string;
+            };
+            disable: {
+                textColor: string;
+            };
+        };
+    };
     grey: {
         filled: {
             enable: {

package/dist/components/web/Chips/Chip/Chip.types.web.d.ts

@@ -1,5 +1,5 @@
 import { ParentComponentTooltipProps } from '../../Tooltips/Tooltip/tooltip_types.web';
-export type ChipColor = 'yellow' | 'lightYellow' | 'red' | 'grey' | 'white' | 'purple' | 'green' | 'blue' | 'teal' | 'pink' | 'black';
+export type ChipColor = 'yellow' | 'lightYellow' | 'red' | 'grey' | 'white' | 'purple' | 'green' | 'blue' | 'teal' | 'pink' | 'lightPink' | 'black';
 export type ChipState = 'enable' | 'hover' | 'disable' | 'active';
 export type ChipStyle = 'outline' | 'filled';
 export type ChipForm = 'square' | 'round';

package/dist/components/web/Headings/StatusHeadingContainer/StatusHeadingContainer.web.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StatusHeadingContainerProps } from './StatusHeadingContainer_types.web';
+declare const StatusHeadingContainer: (props: React.PropsWithChildren<StatusHeadingContainerProps>) => import("react/jsx-runtime").JSX.Element;
+export default StatusHeadingContainer;

package/dist/components/web/Headings/StatusHeadingContainer/StatusHeadingContainer_styles.web.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const styles: () => {
+    statusHeadingContainer: React.CSSProperties;
+    bottomImageContainer: React.CSSProperties;
+};

package/dist/components/web/Headings/StatusHeadingContainer/StatusHeadingContainer_types.web.d.ts

@@ -0,0 +1,19 @@
+import { IllustrationProps } from '../../Illustrations/illustrations_types';
+import { HeadingContainerProps } from '../HeadingContainer/HeadingContainer_types.web';
+export interface StatusHeadingContainerProps {
+    id?: string;
+    swapIllustration: IllustrationProps;
+    headingContainer: HeadingContainerProps;
+    bottomImage?: {
+        source: any;
+        id?: string;
+        width?: number | string;
+        height?: number | string;
+        containerStyle?: any;
+        resizeMode?: 'cover' | 'contain' | 'stretch' | 'repeat' | 'center' | undefined;
+        resizeMethod?: 'auto' | 'resize' | 'scale' | undefined;
+        parentContainerStyle?: any;
+        alt?: string;
+    };
+    containerStyle?: any;
+}

package/dist/components/web/Headings/StatusHeadingContainer/index.web.d.ts

@@ -0,0 +1,2 @@
+import StatusHeadingContainer from './StatusHeadingContainer.web';
+export default StatusHeadingContainer;

package/dist/components/web/Lists/List/list_types.web.d.ts

@@ -1,10 +1,13 @@
+import { HeadingContainerProps } from '../../Headings/HeadingContainer/HeadingContainer_types.web';
 import { ListItemProps } from '../ListItem/listItem_types.web';
 export type ListBg = 'grey' | 'white';
 export interface ListProps {
     id?: string;
     className?: string;
     list: ListItemProps[];
+    spacing?: boolean;
     bgColor?: ListBg;
     borderTop?: boolean;
     containerStyle?: any;
+    headingContainer?: HeadingContainerProps;
 }