@proximus/lavender-skeleton-native 0.1.0-alpha.8 → 0.1.0-beta.0

package/dist/CardSkeleton.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ISkeletonProps } from './types';
-export declare function PxCardSkeleton({ inverted, containerStyle }: ISkeletonProps): React.JSX.Element;
+export declare function PxCardSkeleton({ inverted, containerStyle, testID, }: ISkeletonProps): React.JSX.Element;
 //# sourceMappingURL=CardSkeleton.d.ts.map

package/dist/CardSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardSkeleton.d.ts","sourceRoot":"","sources":["../src/CardSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,cAAc,qBAsB1E"}
+{"version":3,"file":"CardSkeleton.d.ts","sourceRoot":"","sources":["../src/CardSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,cAAc,EACd,MAAM,GACP,EAAE,cAAc,qBAuBhB"}

package/dist/CardSkeleton.js

@@ -2,9 +2,10 @@ import { View } from 'react-native';
 import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
-export function PxCardSkeleton({ inverted, containerStyle }) {
+import { e2eID } from '@proximus/lavender-common-native';
+export function PxCardSkeleton({ inverted, containerStyle, testID, }) {
     const { theme } = useTheme();
-    return (React.createElement(View, { style: [containerStyle, { borderRadius: theme.t('RadiusMain').number }] },
+    return (React.createElement(View, { style: [containerStyle, { borderRadius: theme.t('RadiusMain').number }], ...e2eID(testID) },
         React.createElement(PxSkeleton, { variant: 'assetL', inverted: inverted, expand: true }),
         React.createElement(View, { style: {
                 gap: theme.t('SpacingSMobile').number,

package/dist/CarouselSkeleton.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ISkeletonProps } from './types';
-export declare function PxCarouselSkeleton({ inverted, itemsVisible, containerStyle, }: {
+export declare function PxCarouselSkeleton({ inverted, itemsVisible, containerStyle, testID, }: {
     itemsVisible?: number;
 } & ISkeletonProps): React.JSX.Element;
 //# sourceMappingURL=CarouselSkeleton.d.ts.map

package/dist/CarouselSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselSkeleton.d.ts","sourceRoot":"","sources":["../src/CarouselSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,YAAgB,EAChB,cAAc,GACf,EAAE;IACD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,GAAG,cAAc,qBAqCjB"}
+{"version":3,"file":"CarouselSkeleton.d.ts","sourceRoot":"","sources":["../src/CarouselSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,YAAgB,EAChB,cAAc,EACd,MAAM,GACP,EAAE;IACD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,GAAG,cAAc,qBAsCjB"}

package/dist/CarouselSkeleton.js

@@ -2,7 +2,8 @@ import { View } from 'react-native';
 import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
-export function PxCarouselSkeleton({ inverted, itemsVisible = 1, containerStyle, }) {
+import { e2eID } from '@proximus/lavender-common-native';
+export function PxCarouselSkeleton({ inverted, itemsVisible = 1, containerStyle, testID, }) {
     const { theme } = useTheme();
     const panelVariant = itemsVisible === 1 ? 'panel' : 'panelS';
     return (React.createElement(View, { style: [
@@ -11,7 +12,7 @@ export function PxCarouselSkeleton({ inverted, itemsVisible = 1, containerStyle,
                 gap: theme.t('SpacingSMobile').number,
                 borderRadius: theme.t('RadiusMain').number,
             },
-        ] },
+        ], ...e2eID(testID) },
         React.createElement(View, { style: {
                 flexDirection: 'row',
                 gap: theme.t('SpacingSMobile').number,

package/dist/DataUsageSkeleton.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ISkeletonProps } from './types';
-export declare function PxDataUsageSkeleton({ inverted, containerStyle, }: ISkeletonProps): React.JSX.Element;
+export declare function PxDataUsageSkeleton({ inverted, containerStyle, testID, }: ISkeletonProps): React.JSX.Element;
 //# sourceMappingURL=DataUsageSkeleton.d.ts.map

package/dist/DataUsageSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataUsageSkeleton.d.ts","sourceRoot":"","sources":["../src/DataUsageSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,cAAc,GACf,EAAE,cAAc,qBAkChB"}
+{"version":3,"file":"DataUsageSkeleton.d.ts","sourceRoot":"","sources":["../src/DataUsageSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,cAAc,EACd,MAAM,GACP,EAAE,cAAc,qBAmChB"}

package/dist/DataUsageSkeleton.js

@@ -3,7 +3,8 @@ import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
 import { PxStatusSkeleton } from './StatusSkeleton';
-export function PxDataUsageSkeleton({ inverted, containerStyle, }) {
+import { e2eID } from '@proximus/lavender-common-native';
+export function PxDataUsageSkeleton({ inverted, containerStyle, testID, }) {
     const { theme } = useTheme();
     return (React.createElement(View, { style: [
             containerStyle,
@@ -13,7 +14,7 @@ export function PxDataUsageSkeleton({ inverted, containerStyle, }) {
                 padding: theme.t('PaddingSMobile').number,
                 backgroundColor: theme.t('ColorBackgroundSurfaceLight'),
             },
-        ] },
+        ], ...e2eID(testID) },
         React.createElement(View, { style: {
                 gap: theme.t('SpacingXsMobile').number,
             } },

package/dist/MessageCardSkeleton.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ISkeletonProps } from './types';
-export declare function PxMessageCardSkeleton({ inverted, containerStyle, }: ISkeletonProps): React.JSX.Element;
+export declare function PxMessageCardSkeleton({ inverted, containerStyle, testID, }: ISkeletonProps): React.JSX.Element;
 //# sourceMappingURL=MessageCardSkeleton.d.ts.map

package/dist/MessageCardSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageCardSkeleton.d.ts","sourceRoot":"","sources":["../src/MessageCardSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,cAAc,GACf,EAAE,cAAc,qBAiChB"}
+{"version":3,"file":"MessageCardSkeleton.d.ts","sourceRoot":"","sources":["../src/MessageCardSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,cAAc,EACd,MAAM,GACP,EAAE,cAAc,qBAkChB"}

package/dist/MessageCardSkeleton.js

@@ -2,7 +2,8 @@ import { View } from 'react-native';
 import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
-export function PxMessageCardSkeleton({ inverted, containerStyle, }) {
+import { e2eID } from '@proximus/lavender-common-native';
+export function PxMessageCardSkeleton({ inverted, containerStyle, testID, }) {
     const { theme } = useTheme();
     return (React.createElement(View, { style: [
             containerStyle,
@@ -12,7 +13,7 @@ export function PxMessageCardSkeleton({ inverted, containerStyle, }) {
                 padding: theme.t('PaddingSMobile').number,
                 gap: theme.t('SpacingSMobile').number,
             },
-        ] },
+        ], ...e2eID(testID) },
         React.createElement(View, { style: {
                 flexDirection: 'row',
                 gap: theme.t('SpacingSMobile').number,

package/dist/Skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../src/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAIL,SAAS,EAGT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAOtB,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG;IAC9C,uBAAuB;IACvB,OAAO,EACH,UAAU,GACV,UAAU,GACV,UAAU,GACV,MAAM,GACN,OAAO,GACP,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,QAAQ,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAeF,wBAAgB,UAAU,CAAC,KAAK,EAAE,qBAAqB,qBA+EtD"}
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../src/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAIL,SAAS,EAGT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAQtB,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG;IAC9C,uBAAuB;IACvB,OAAO,EACH,UAAU,GACV,UAAU,GACV,UAAU,GACV,MAAM,GACN,OAAO,GACP,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,QAAQ,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAeF,wBAAgB,UAAU,CAAC,KAAK,EAAE,qBAAqB,qBAsFtD"}

package/dist/Skeleton.js

@@ -2,6 +2,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { Animated, Easing, StyleSheet, View, } from 'react-native';
 import LinearGradient from 'react-native-linear-gradient';
 import { useTheme } from '@proximus/lavender-styling-native';
+import { e2eID } from '@proximus/lavender-common-native';
 const DURATION = 1500;
 const ANGLE = 18;
 function useColors({ inverted }) {
@@ -15,7 +16,7 @@ function useColors({ inverted }) {
     return { backgroundColor, highlightColor, highlightColorWithOpacity };
 }
 export function PxSkeleton(props) {
-    const { inverted = false, containerStyle, variant, expand = false } = props;
+    const { inverted = false, containerStyle, variant, expand = false, testID, } = props;
     const [layout, setLayout] = useState({ width: 0, height: 0 });
     const translateX = useRef(new Animated.Value(0)).current;
     const { theme } = useTheme();
@@ -54,7 +55,7 @@ export function PxSkeleton(props) {
         ], onLayout: (e) => {
             const { width, height } = e.nativeEvent.layout;
             setLayout({ width, height });
-        } },
+        }, ...e2eID(testID) },
         React.createElement(Animated.View, { style: {
                 position: 'absolute',
                 top: -3 * layout.height, // ensure coverage when rotated

package/dist/StatusSkeleton.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ISkeletonProps } from './types';
-export declare function PxStatusSkeleton({ inverted, containerStyle }: ISkeletonProps): React.JSX.Element;
+export declare function PxStatusSkeleton({ inverted, containerStyle, testID, }: ISkeletonProps): React.JSX.Element;
 //# sourceMappingURL=StatusSkeleton.d.ts.map

package/dist/StatusSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusSkeleton.d.ts","sourceRoot":"","sources":["../src/StatusSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,cAAc,qBAc5E"}
+{"version":3,"file":"StatusSkeleton.d.ts","sourceRoot":"","sources":["../src/StatusSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,MAAM,GACP,EAAE,cAAc,qBAehB"}

package/dist/StatusSkeleton.js

@@ -2,12 +2,13 @@ import { View } from 'react-native';
 import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
-export function PxStatusSkeleton({ inverted, containerStyle }) {
+import { e2eID } from '@proximus/lavender-common-native';
+export function PxStatusSkeleton({ inverted, containerStyle, testID, }) {
     const { theme } = useTheme();
     return (React.createElement(View, { style: [
             containerStyle,
             { flexDirection: 'row', gap: theme.t('Spacing2xsMobile').number },
-        ] },
+        ], ...e2eID(testID) },
         React.createElement(PxSkeleton, { variant: 'assetXS', inverted: inverted }),
         React.createElement(PxSkeleton, { variant: 'body', inverted: inverted })));
 }

package/dist/TileSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TileSkeleton.d.ts","sourceRoot":"","sources":["../src/TileSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAsBzC,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,cAAc,qBAmB3E"}
+{"version":3,"file":"TileSkeleton.d.ts","sourceRoot":"","sources":["../src/TileSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAuBzC,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,cAAc,qBAmB3E"}

package/dist/TileSkeleton.js

@@ -2,16 +2,16 @@ import { View } from 'react-native';
 import { PxSkeleton } from './Skeleton';
 import React from 'react';
 import { useTheme } from '@proximus/lavender-styling-native';
-function PxTileSkeleton({ inverted }) {
+import { e2eID } from '@proximus/lavender-common-native';
+function PxTileSkeleton({ inverted, testID }) {
     const { theme } = useTheme();
     return (React.createElement(View, { style: {
             alignItems: 'center',
             gap: theme.t('SpacingSMobile').number,
-            borderBottomEndRadius: theme.t('RadiusMain').number,
-            borderBottomStartRadius: theme.t('RadiusMain').number,
+            borderRadius: theme.t('RadiusMain').number,
             padding: theme.t('PaddingSMobile').number,
             backgroundColor: theme.t('ColorBackgroundSurfaceLight'),
-        } },
+        }, ...e2eID(testID) },
         React.createElement(PxSkeleton, { variant: 'assetS', inverted: inverted }),
         React.createElement(PxSkeleton, { variant: 'headingS', inverted: inverted })));
 }

package/dist/types.d.ts

@@ -2,5 +2,6 @@ import { StyleProp, ViewStyle } from 'react-native';
 export interface ISkeletonProps {
     inverted?: boolean;
     containerStyle?: StyleProp<ViewStyle>;
+    testID?: string;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACvC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-skeleton-native",
-  "version": "0.1.0-alpha.8",
+  "version": "0.1.0-beta.0",
   "description": "Lavender skeleton component",
   "license": "MIT",
   "main": "dist/index.js",