@proximus/lavender-carousel-native 0.1.0-alpha.4 → 0.1.0-alpha.9

package/package.json

@@ -1,42 +1,14 @@
 {
   "name": "@proximus/lavender-carousel-native",
-  "version": "0.1.0-alpha.4",
+  "version": "0.1.0-alpha.9",
   "description": "Carousel component",
   "license": "MIT",
-  "main": "src/index.ts",
-  "scripts": {
-    "clean": "rm -rf dist",
-    "transform-package-json": "node ../../../scripts/tranformPackageJson.js package.json dist/far/away",
-    "prepublish": "yarn clean && yarn transform-package-json && yarn build",
-    "build": "npx tsc -p tsconfig.json"
-  },
+  "main": "dist/index.js",
   "peerDependencies": {
-    "@proximus/lavender-common-native": "workspace:*",
-    "@proximus/lavender-styling-native": "workspace:*"
-  },
-  "devDependencies": {
-    "@proximus/lavender-common-native": "0.1.0-alpha.6",
-    "@proximus/lavender-styling-native": "0.1.0-alpha.5"
+    "@proximus/lavender-common-native": "*",
+    "@proximus/lavender-styling-native": "*"
   },
   "publishConfig": {
     "access": "public"
-  },
-  "lerna": {
-    "command": {
-      "publish": {
-        "assets": [
-          {
-            "from": "dist/far/away/package.json",
-            "to": "."
-          },
-          "dist/*.js",
-          "dist/*.d.ts",
-          "dist/*.d.ts.map",
-          "src",
-          "package.json"
-        ]
-      }
-    }
-  },
-  "gitHead": "a1feec25c51a94781f121bd6daba378d09021174"
+  }
 }

package/CHANGELOG.md

@@ -1,20 +0,0 @@
-# Change Log
-
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-
-# [0.1.0-alpha.4](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-carousel-native@0.1.0-alpha.3...@proximus/lavender-carousel-native@0.1.0-alpha.4) (2025-09-26)
-
-### Features
-
-- **BCRI-000000:** datasource based mendix carousel ([#35](https://github.com/Pxs-Corporate/react-native-lavender/issues/35)) ([c627206](https://github.com/Pxs-Corporate/react-native-lavender/commit/c6272061736ee196d2c2dcea0d239e8819e0489b))
-
-# [0.1.0-alpha.3](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-carousel-native@0.1.0-alpha.2...@proximus/lavender-carousel-native@0.1.0-alpha.3) (2025-09-26)
-
-**Note:** Version bump only for package @proximus/lavender-carousel-native
-
-# 0.1.0-alpha.2 (2025-09-25)
-
-### Bug Fixes
-
-- **BCRI-000000:** no free space on gh runner during build ([#27](https://github.com/Pxs-Corporate/react-native-lavender/issues/27)) ([a7c8604](https://github.com/Pxs-Corporate/react-native-lavender/commit/a7c86043b5cefcb10fd768d449c5718fbabe87ec))

package/dist/far/away/package.json

@@ -1,32 +0,0 @@
-{
-  "name": "@proximus/lavender-carousel-native",
-  "version": "0.1.0-alpha.4",
-  "description": "Carousel component",
-  "license": "MIT",
-  "main": "dist/index.js",
-  "peerDependencies": {
-    "@proximus/lavender-common-native": "*",
-    "@proximus/lavender-styling-native": "*"
-  },
-  "publishConfig": {
-    "access": "public"
-  },
-  "lerna": {
-    "command": {
-      "publish": {
-        "assets": [
-          {
-            "from": "dist/far/away/package.json",
-            "to": "."
-          },
-          "dist/*.js",
-          "dist/*.d.ts",
-          "dist/*.d.ts.map",
-          "src",
-          "package.json"
-        ]
-      }
-    }
-  },
-  "gitHead": "a1feec25c51a94781f121bd6daba378d09021174"
-}

package/src/AppleSeed.tsx

@@ -1,113 +0,0 @@
-import React, { useEffect, useRef } from 'react';
-import { Animated, View } from 'react-native';
-import { useTheme } from '@proximus/lavender-styling-native';
-
-const appleSeedSizeL = 14;
-const appleSeedSizeM = 10;
-const appleSeedSizeS = 6;
-const appleSeedSizeXS = 4;
-
-export function PxAppleSeed({
-  numberOfItems,
-  selectedItemIndex,
-}: {
-  numberOfItems: number;
-  selectedItemIndex: number;
-}) {
-  const { theme } = useTheme();
-  const tx = useRef(new Animated.Value(0)).current;
-  const prevSelectedItemIndex = useRef(selectedItemIndex);
-
-  useEffect(() => {
-    if (
-      (selectedItemIndex <= 2 && prevSelectedItemIndex.current != 3) ||
-      numberOfItems - selectedItemIndex < 3
-    ) {
-      return;
-    }
-
-    const translateLeft =
-      selectedItemIndex > prevSelectedItemIndex.current ? -1 : 1;
-
-    const toValue = translateLeft
-      ? -1 * (selectedItemIndex - 2) * theme.t('SizeIconS').number
-      : (selectedItemIndex - 3) * theme.t('SizeIconS').number;
-
-    Animated.spring(tx, {
-      toValue,
-      useNativeDriver: true,
-    }).start();
-
-    prevSelectedItemIndex.current = selectedItemIndex;
-  }, [numberOfItems, selectedItemIndex, theme, tx]);
-
-  return (
-    <View
-      style={{
-        flexDirection: 'row',
-        width: 5 * theme.t('SizeIconS').number,
-        justifyContent: numberOfItems < 5 ? 'center' : 'flex-start',
-        alignSelf: 'center',
-        overflow: 'hidden',
-        alignItems: 'center',
-      }}
-    >
-      {Array.from({ length: numberOfItems }).map((_, index) => (
-        <Animated.View
-          key={index}
-          style={{
-            width: theme.t('SizeIconS').number,
-            height: theme.t('SizeIconS').number,
-            alignItems: 'center',
-            justifyContent: 'center',
-            transform: [
-              {
-                translateX: tx,
-              },
-            ],
-          }}
-        >
-          <View
-            key={index}
-            style={{
-              borderWidth: theme.t('SizeBorderS').number,
-              height: numberOfItems > 5 ? appleSeedSizeXS : appleSeedSizeM,
-              width: numberOfItems > 5 ? appleSeedSizeXS : appleSeedSizeM,
-              borderRadius: theme.t('RadiusMain').number,
-              borderColor: theme.t('ColorBackgroundStateActiveDefault'),
-              ...(index === numberOfItems - 2 &&
-                numberOfItems > 6 && {
-                  height: appleSeedSizeM,
-                  width: appleSeedSizeM,
-                }),
-              ...(index === numberOfItems - 3 &&
-                numberOfItems > 5 && {
-                  height: appleSeedSizeS,
-                  width: appleSeedSizeS,
-                }),
-              ...((index === selectedItemIndex - 2 ||
-                index === selectedItemIndex + 2) &&
-                numberOfItems > 5 && {
-                  height: appleSeedSizeS,
-                  width: appleSeedSizeS,
-                }),
-              ...((index === selectedItemIndex - 1 ||
-                index === selectedItemIndex + 1) &&
-                numberOfItems > 5 && {
-                  height: appleSeedSizeM,
-                  width: appleSeedSizeM,
-                }),
-              ...(index === selectedItemIndex && {
-                backgroundColor: theme.t('ColorBackgroundStateActiveDefault'),
-                ...(numberOfItems > 5 && {
-                  height: appleSeedSizeL,
-                  width: appleSeedSizeL,
-                }),
-              }),
-            }}
-          />
-        </Animated.View>
-      ))}
-    </View>
-  );
-}

package/src/Carousel.tsx

@@ -1,108 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import {
-  AccessibilityProps,
-  Dimensions,
-  FlatList,
-  StyleProp,
-  View,
-  ViewStyle,
-} from 'react-native';
-import { useTheme } from '@proximus/lavender-styling-native';
-import { PxAppleSeed } from './AppleSeed';
-import { a11y, e2eID } from '@proximus/lavender-common-native';
-
-const inset = 24;
-
-export function PxCarousel({
-  numberOfItemsVisible = 1,
-  children,
-  withAppleSeed = true,
-  containerStyle,
-  testID,
-  accessibilityProps,
-}: {
-  numberOfItemsVisible?: number;
-  children?: React.ReactNode;
-  withAppleSeed?: boolean;
-  containerStyle?: StyleProp<ViewStyle>;
-  testID?: string;
-  accessibilityProps?: AccessibilityProps;
-}) {
-  const [width, setWidth] = useState(0);
-  const [computedGap, setComputedGap] = useState(0);
-  const [elementsCount, setElementsCount] = useState(0);
-  const [selectedItemIndex, setSelectedItemIndex] = useState(0);
-  const [offsets, setOffsets] = useState([]);
-  const { theme } = useTheme();
-
-  useEffect(() => {
-    setWidth(
-      (Dimensions.get('window').width -
-        numberOfItemsVisible * computedGap -
-        2 * inset) /
-        numberOfItemsVisible
-    );
-  }, [numberOfItemsVisible, computedGap, theme]);
-
-  useEffect(() => {
-    setElementsCount(React.Children.count(children));
-  }, [children]);
-
-  useEffect(() => {
-    setComputedGap(theme.t(`SpacingSMobile`).number);
-  }, [theme]);
-
-  useEffect(() => {
-    setOffsets(
-      new Array(elementsCount).fill(0).reduce(
-        (prev, _, i) => {
-          return [...prev, prev[i] + width + computedGap];
-        },
-        [width]
-      )
-    );
-  }, [computedGap, elementsCount, width]);
-
-  return (
-    <View
-      style={[containerStyle, { flexDirection: 'column', gap: 27.15, flex: 1 }]}
-      {...e2eID(testID)}
-      {...a11y(accessibilityProps)}
-    >
-      <FlatList
-        data={new Array(React.Children.count(children)).fill(0)}
-        renderItem={({ index }) => (
-          <View style={{ width }}>
-            {[...(children as Iterable<any>)]?.[index]}
-          </View>
-        )}
-        contentContainerStyle={{
-          gap: computedGap,
-          alignItems: 'stretch',
-          paddingLeft: computedGap,
-        }}
-        horizontal
-        snapToOffsets={offsets}
-        decelerationRate="fast"
-        snapToAlignment={numberOfItemsVisible === 1 ? 'center' : 'start'}
-        showsHorizontalScrollIndicator={false}
-        onViewableItemsChanged={(event) => {
-          if (
-            event.viewableItems.length === 2 &&
-            event.viewableItems?.[0]?.index === 0
-          ) {
-            setSelectedItemIndex(0);
-            return;
-          }
-          setSelectedItemIndex(event.viewableItems?.[1]?.index ?? 0);
-        }}
-      />
-      {withAppleSeed && elementsCount > 1 && (
-        <PxAppleSeed
-          numberOfItems={React.Children.count(children)}
-          selectedItemIndex={selectedItemIndex}
-        />
-      )}
-    </View>
-  );
-}

package/src/index.ts

@@ -1,2 +0,0 @@
-export * from './Carousel';
-export * from './AppleSeed';

package/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "extends": "../../../tsconfig.npm.json",
-  "compilerOptions": {
-    "outDir": "dist",
-  },
-  "include": ["src","../../../lib.d.ts"],
-  "exclude": ["dist", "node_modules", "src/**/*.spec.tsx", "src/**/*.spec.ts"]
-}