@momo-kits/rating 0.102.3-beta.1

package/index.tsx

@@ -0,0 +1,71 @@
+import React, {FC} from 'react';
+import {StyleSheet, TouchableOpacity, View} from 'react-native';
+import {Colors} from '../Consts';
+import {Icon} from '../Icon';
+import {RatingProps} from './type';
+
+const Rating: FC<RatingProps> = (
+  {rating, numOfStars, onRatingChange, size, style},
+  props
+) => {
+  const normalizedRating =
+    typeof rating === 'string' ? parseFloat(rating.replace(',', '.')) : rating;
+  const normalizedNumOfStars =
+    typeof numOfStars === 'string' ? parseFloat(numOfStars) : numOfStars;
+
+  const renderStar = (index: number) => {
+    // Full star
+    if (index < Math.floor(normalizedRating)) {
+      return 'reaction_star_full';
+    }
+    // Half star
+    if (index === Math.floor(normalizedRating) && normalizedRating % 1 !== 0) {
+      return 'reaction_star_half';
+    }
+    // Empty star
+    return 'reaction_star_non';
+  };
+
+  const tintColor = (index: number) => {
+    // Full star
+    if (index < Math.floor(normalizedRating)) {
+      return Colors.yellow_03;
+    }
+    // Half star
+    if (index === Math.floor(normalizedRating) && normalizedRating % 1 !== 0) {
+      return Colors.yellow_03;
+    }
+    // Empty star
+    return Colors.black_07;
+  };
+
+  const sizes = size === 'small' ? 16 : size === 'medium' ? 20 : 24;
+
+  return (
+    <View style={[style, styles.container]}>
+      {Array.from({length: normalizedNumOfStars}, (_, index) => (
+        <TouchableOpacity
+          key={index}
+          onPress={() => onRatingChange && onRatingChange(index + 1)}
+          disabled={!onRatingChange} // Disable interaction if no callback
+          {...props}>
+          <Icon
+            source={renderStar(index)}
+            size={sizes}
+            color={
+              tintColor(index) // Set color based on rating
+            }
+          />
+        </TouchableOpacity>
+      ))}
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+  },
+});
+
+export {Rating};

package/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@momo-kits/rating",
+  "version": "0.102.3-beta.1",
+  "private": false,
+  "main": "index.tsx",
+  "peerDependencies": {
+    "@momo-kits/foundation": "latest",
+    "react": "16.9.0",
+    "react-native": ">=0.55",
+    "prop-types": "^15.7.2"
+  },
+  "devDependencies": {
+    "@momo-platform/versions": "4.1.11"
+  },
+  "license": "MoMo",
+  "dependencies": {}
+}

package/publish.sh

@@ -0,0 +1,27 @@
+#!/bin/bash
+
+# Prepare dist files
+rm -rf dist
+mkdir dist
+rsync -r --exclude=/dist ./* dist
+cd dist
+
+if [ "$1" == "stable" ]; then
+  npm version $(npm view @momo-kits/avatar@stable version)
+  npm version patch
+  npm publish --tag stable --access=public
+elif [ "$1" == "latest" ]; then
+  npm version $(npm view @momo-kits/foundation@latest version)
+  npm publish --tag latest --access=public
+else
+  npm version $(npm view @momo-kits/avatar@beta version)
+  npm version prerelease --preid=beta
+  npm publish --tag beta --access=public
+fi
+
+PACKAGE_NAME=$(npm pkg get name)
+NEW_PACKAGE_VERSION=$(npm pkg get version)
+
+# Clean up
+cd ..
+rm -rf dist

package/type.ts

@@ -0,0 +1,25 @@
+import {TouchableOpacityProps} from 'react-native';
+
+export interface RatingProps extends TouchableOpacityProps {
+  /**
+   * `numOfStars`: Represents the number of stars in the Rating component.
+   */
+  numOfStars: number | string;
+
+  /**
+   * `rating`: Represents the rating value of the Rating component.
+   */
+  rating: number | string;
+
+  /**
+   * `onRatingChange`: A callback function that is called when the rating value of the Rating component changes.
+   * It is triggered when the user interacts with the Rating component.
+   */
+  onRatingChange: (rating: number) => void;
+
+  /**
+   * `size`: Optional. Represents the size of the Rating component.
+   * Defaults to `large` is 24 if not provided.
+   */
+  size?: 'small' | 'medium' | 'large';
+}