@proximus/lavender-list-native 1.2.8-beta.2

package/dist/List.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from 'react';
+type GapSize = 'Xs' | 'Default';
+export interface IPxListProps {
+    gap?: GapSize;
+    inverted?: boolean;
+    children: ReactNode;
+}
+export declare function PxList({ gap, inverted, children }: IPxListProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=List.d.ts.map

package/dist/List.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../src/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKzC,KAAK,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC;AAEhC,MAAM,WAAW,YAAY;IAC3B,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,MAAM,CAAC,EAAE,GAAG,EAAE,QAAgB,EAAE,QAAQ,EAAE,EAAE,YAAY,qBASvE"}

package/dist/List.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useTheme } from '@proximus/lavender-styling-native';
+import ListContext from './ListContext';
+export function PxList({ gap, inverted = false, children }) {
+    const { theme } = useTheme();
+    const styles = useStyles({ gap, theme });
+    return (React.createElement(ListContext.Provider, { value: { inverted } },
+        React.createElement(View, { style: styles.listContainer }, children)));
+}
+function useStyles({ gap, theme }) {
+    return StyleSheet.create({
+        listContainer: {
+            gap: theme.t(`Spacing${gap ?? 'Xs'}Mobile`).number,
+        },
+    });
+}

package/dist/ListContext.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare const ListContext: React.Context<{
+    inverted: boolean;
+}>;
+export default ListContext;
+//# sourceMappingURL=ListContext.d.ts.map

package/dist/ListContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListContext.d.ts","sourceRoot":"","sources":["../src/ListContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,QAAA,MAAM,WAAW;cAAmC,OAAO;EAEzD,CAAC;AAEH,eAAe,WAAW,CAAC"}

package/dist/ListContext.js

@@ -0,0 +1,5 @@
+import React from 'react';
+const ListContext = React.createContext({
+    inverted: false,
+});
+export default ListContext;

package/dist/ListItem.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { IconColor } from '@proximus/lavender-icon-common';
+import type { IconName } from '@proximus/lavender-icon/dist/iconNames.js';
+export interface IPxListItemProps {
+    label: string;
+    iconName?: IconName;
+    iconColor?: IconColor;
+    iconAriaLabel?: string;
+    testID?: string;
+}
+export declare function PxListItem({ label, iconName, iconColor, iconAriaLabel, testID, }: IPxListItemProps): React.JSX.Element;
+//# sourceMappingURL=ListItem.d.ts.map

package/dist/ListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../src/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2CAA2C,CAAC;AAS1E,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,aAAa,EACb,MAAM,GACP,EAAE,gBAAgB,qBA8BlB"}

package/dist/ListItem.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { Body } from '@proximus/lavender-texts-native';
+import { PxIcon } from '@proximus/lavender-icon-native';
+import { useTheme } from '@proximus/lavender-styling-native';
+import { e2eID } from '@proximus/lavender-common-native';
+import ListContext from './ListContext';
+const DEFAULT_ICON_COLOR = 'Brand';
+export function PxListItem({ label, iconName, iconColor, iconAriaLabel, testID, }) {
+    const { theme } = useTheme();
+    const styles = useStyles({ theme });
+    const { inverted } = React.useContext(ListContext);
+    return (React.createElement(View, { style: [styles.listItemContainer], ...(testID && e2eID(`${testID}`)) },
+        iconName && (React.createElement(View, { ...(testID && e2eID(`${testID}-icon`)) },
+            React.createElement(PxIcon, { name: iconName, color: iconColor ?? DEFAULT_ICON_COLOR, size: "M", inverted: inverted, accessibilityLabel: iconAriaLabel }))),
+        React.createElement(Body, { style: styles.label, inverted: inverted, ...(testID && e2eID(`${testID}-label`)) }, label)));
+}
+function useStyles({ theme }) {
+    return StyleSheet.create({
+        listItemContainer: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: theme.t('SpacingXsMobile').number,
+        },
+        label: {
+            fontSize: theme.t('TextSizeLabelLMobile').number,
+        },
+    });
+}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export * from './List';
+export * from './ListItem';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export * from './List';
+export * from './ListItem';

package/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@proximus/lavender-list-native",
+  "version": "1.2.8-beta.2",
+  "description": "Lavender list component",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "peerDependencies": {
+    "@proximus/lavender-buttonicon-native": "*",
+    "@proximus/lavender-common-native": "*",
+    "@proximus/lavender-icon-native": "*",
+    "@proximus/lavender-styling-native": "*",
+    "@proximus/lavender-texts-native": "*"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}