@proximus/lavender-selectablebox-native 0.1.0-alpha.6 → 0.1.0-beta.0

package/package.json

@@ -1,51 +1,22 @@
 {
   "name": "@proximus/lavender-selectablebox-native",
-  "version": "0.1.0-alpha.6",
+  "version": "0.1.0-beta.0",
   "description": "Lavender selectable box component",
   "license": "MIT",
-  "main": "src/index.ts",
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
   "type": "module",
-  "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"
-  },
   "peerDependencies": {
-    "@proximus/lavender-checkbox-native": "workspace:*",
-    "@proximus/lavender-common-native": "workspace:*",
-    "@proximus/lavender-icon-native": "workspace:*",
-    "@proximus/lavender-radio-native": "workspace:*",
-    "@proximus/lavender-styling-native": "workspace:*",
-    "@proximus/lavender-texts-native": "workspace:*"
-  },
-  "devDependencies": {
-    "@proximus/lavender-checkbox-native": "0.1.0-alpha.6",
-    "@proximus/lavender-common-native": "0.1.0-alpha.6",
-    "@proximus/lavender-icon-native": "0.1.0-alpha.6",
-    "@proximus/lavender-radio-native": "0.1.0-alpha.6",
-    "@proximus/lavender-styling-native": "0.1.0-alpha.5",
-    "@proximus/lavender-texts-native": "0.1.0-alpha.6"
+    "@proximus/lavender-checkbox-native": "*",
+    "@proximus/lavender-common-native": "*",
+    "@proximus/lavender-icon-native": "*",
+    "@proximus/lavender-radio-native": "*",
+    "@proximus/lavender-styling-native": "*",
+    "@proximus/lavender-texts-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": "e50a17526561b3eafb159e36c737173956093e0d"
+  }
 }

package/CHANGELOG.md

@@ -1,14 +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.6](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-selectablebox-native@0.1.0-alpha.5...@proximus/lavender-selectablebox-native@0.1.0-alpha.6) (2025-09-26)
-
-**Note:** Version bump only for package @proximus/lavender-selectablebox-native
-
-# [0.1.0-alpha.5](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-selectablebox-native@0.1.0-alpha.4...@proximus/lavender-selectablebox-native@0.1.0-alpha.5) (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,37 +0,0 @@
-{
-  "name": "@proximus/lavender-selectablebox-native",
-  "version": "0.1.0-alpha.6",
-  "description": "Lavender selectable box component",
-  "license": "MIT",
-  "main": "dist/index.js",
-  "type": "module",
-  "peerDependencies": {
-    "@proximus/lavender-checkbox-native": "*",
-    "@proximus/lavender-common-native": "*",
-    "@proximus/lavender-icon-native": "*",
-    "@proximus/lavender-radio-native": "*",
-    "@proximus/lavender-styling-native": "*",
-    "@proximus/lavender-texts-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": "e50a17526561b3eafb159e36c737173956093e0d"
-}

package/src/PxSelectableBox.tsx

@@ -1,185 +0,0 @@
-import React, { ReactNode } from 'react';
-import {
-  AccessibilityProps,
-  StyleProp,
-  StyleSheet,
-  TouchableOpacity,
-  View,
-  ViewStyle,
-} from 'react-native';
-import { a11y, e2eID } from '@proximus/lavender-common-native';
-import { PxRadioButton } from '@proximus/lavender-radio-native';
-import { PxCheckBox } from '@proximus/lavender-checkbox-native';
-import { useTheme } from '@proximus/lavender-styling-native';
-import { Body, Header } from '@proximus/lavender-texts-native';
-
-export interface ISelectableBoxProps {
-  selected: boolean;
-  label: string;
-  onPress: (val: boolean) => void;
-  withCheckbox?: boolean;
-  containerStyle?: StyleProp<ViewStyle>;
-  disabled?: boolean;
-  locked?: boolean;
-  priceComponent?: ReactNode;
-  contentComponent?: ReactNode;
-  description?: string;
-  testID?: string;
-  wrapperStyle?: StyleProp<ViewStyle>;
-}
-
-export function PxSelectableBox({
-  selected,
-  label,
-  onPress,
-  containerStyle,
-  withCheckbox,
-  disabled = false,
-  locked,
-  priceComponent,
-  contentComponent,
-  description,
-  testID = 'selectableBox',
-  ...accessibilityProps
-}: ISelectableBoxProps & AccessibilityProps) {
-  const { theme } = useTheme();
-
-  const accessibilityRole = locked
-    ? 'text'
-    : withCheckbox
-      ? 'checkbox'
-      : 'radio';
-  const accessibilityHint = `Selectable Item ${label}, checked: ${selected}`;
-
-  const colors = {
-    uncheckedBorderColor: theme.t('ColorBorderMainDefault'),
-    backgroundColor: theme.t('ColorBackgroundContainerLightDefault'),
-    focusBorderColor: theme.t('ColorBorderBrandDefault'),
-    disabledBackgroundColor: theme.t('ColorBackgroundStateDisabledDefault'),
-    defaultLabel: theme.t('ColorTextNeutralDefault'),
-    uncheckedLabel: theme.t('ColorTextNeutralDefault'),
-    borderColor: theme.t('ColorBorderBrandDefault'),
-  };
-
-  return (
-    <TouchableOpacity
-      onPress={() => {
-        onPress?.(!selected);
-      }}
-      style={[{ width: '100%' }, containerStyle]}
-      disabled={disabled || locked}
-      {...e2eID(testID)}
-      {...a11y({
-        accessible: true,
-        accessibilityRole,
-        accessibilityHint,
-        accessibilityLabel: label,
-        accessibilityState: {
-          checked: selected,
-          disabled: disabled || locked,
-        },
-        ...accessibilityProps,
-      })}
-    >
-      <View
-        style={[
-          styles.container,
-          {
-            borderColor: selected
-              ? colors.borderColor
-              : colors.uncheckedBorderColor,
-            backgroundColor: colors.backgroundColor,
-          },
-          disabled && {
-            borderWidth: 0,
-            backgroundColor: colors.disabledBackgroundColor,
-          },
-          locked && {
-            borderColor: colors.borderColor,
-          },
-        ]}
-        {...a11y({
-          accessible: true,
-          accessibilityRole,
-          accessibilityHint,
-        })}
-      >
-        <View style={styles.topContentContainer}>
-          <View style={styles.topContainer}>
-            {withCheckbox ? (
-              <PxCheckBox
-                onChange={onPress}
-                checked={selected}
-                disabled={disabled}
-              />
-            ) : (
-              <PxRadioButton
-                onPress={() => onPress?.(!selected)}
-                checked={selected}
-                disabled={disabled}
-              />
-            )}
-            <View style={styles.textContainer}>
-              <Header
-                textBreakStrategy={'balanced'}
-                accessible={true}
-                style={[
-                  styles.title,
-                  {
-                    color: !selected
-                      ? colors.uncheckedLabel
-                      : colors.defaultLabel,
-                  },
-                ]}
-              >
-                {label}
-              </Header>
-              <Body style={styles.description}>{description}</Body>
-            </View>
-          </View>
-          {contentComponent && (
-            <View style={{ marginTop: 16 }}>{contentComponent}</View>
-          )}
-        </View>
-
-        {priceComponent && (
-          <View style={styles.priceComponent}>{priceComponent}</View>
-        )}
-      </View>
-    </TouchableOpacity>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flexDirection: 'row',
-    borderWidth: 2,
-    borderRadius: 12,
-  },
-  title: {
-    fontSize: 14,
-  },
-  priceComponent: {
-    padding: 8,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  description: {
-    fontSize: 12,
-  },
-  topContentContainer: {
-    padding: 16,
-    flex: 1,
-  },
-  topContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'flex-start',
-  },
-  textContainer: {
-    flexDirection: 'column',
-    marginHorizontal: 16,
-    justifyContent: 'center',
-    flex: 1,
-  },
-});

package/src/index.ts

@@ -1 +0,0 @@
-export * from './PxSelectableBox';

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"]
-}