Fix: Added support for SSR, Revised license and README (#15)

Author: manacy-keyvalue

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2019 Francisco Hodge
+Copyright (c) 2023 keyvalue software systems
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -70,11 +70,6 @@ b. Rename the style key `Chart` to `Bar` within `styles` prop.
 <b>Before</b>
 
 ```jsx
-  const stylesOverride = {
-    Chart: (ratingId) => ({...styles}),
-    Count: (ratingId) => ({...styles})
-  };
-
  <RatingSummary
     ratings={ratingValues}
     chartColors={{
@@ -84,18 +79,16 @@ b. Rename the style key `Chart` to `Bar` within `styles` prop.
       2: 'blue',
       1: 'green'
     }}
-    styles={stylesOverride}
+    styles={{
+      Chart: (ratingId) => ({...styles}),
+      Count: (ratingId) => ({...styles})
+    }}
   />
 ```
 
 <b>After</b>
 
 ```jsx
-  const stylesOverride = {
-    Bar: (ratingId) => ({...styles}),
-    Count: (ratingId) => ({...styles})
-  };
-
  <RatingSummary
     ratings={ratingValues}
     barColors={{
@@ -105,7 +98,10 @@ b. Rename the style key `Chart` to `Bar` within `styles` prop.
       2: 'blue',
       1: 'green'
     }}
-    styles={stylesOverride}
+    styles={{
+      Bar: (ratingId) => ({...styles}),
+      Count: (ratingId) => ({...styles})
+    }}
   />
 ```
 
@@ -250,14 +246,6 @@ import RatingSummary from '@keyvaluesystems/react-star-rating-summary';
 
 function App() {
 
-  const ratings = {
-		1: 100,
-		2: 200,
-		3: 300,
-		4: 400,
-		5: 500
-	};
-
   const countColors = {
 		1: 'red',
 		2: 'yellow',
@@ -266,24 +254,28 @@ function App() {
 		5: 'white'
   };
 
-  const stylesOverride = {
-    Average: { color: 'purple' },
-    AverageStarIcon: {
-      width: '20px',
-      height: '20px'
-    },
-    LabelStarIcon: () => ({
-      width: '15px',
-      height: '15px'
-    }),
-    Label: (ratingId) => ({ fontSize: '12px' }),
-    Count: (ratingId) => ({color: countColors[ratingId]})
-  };
-
   return (
     <RatingSummary
-      ratings={ratings}
-      styles={stylesOverride}
+      ratings={{
+		    1: 100,
+		    2: 200,
+		    3: 300,
+		    4: 400,
+		    5: 500
+	    }}
+      styles={{
+        Average: { color: 'purple' },
+        AverageStarIcon: {
+          width: '20px',
+          height: '20px'
+        },
+        LabelStarIcon: () => ({
+          width: '15px',
+          height: '15px'
+        }),
+        Label: (ratingId) => ({ fontSize: '12px' }),
+        Count: (ratingId) => ({color: countColors[ratingId]})
+      }}
     />
   );
 }
@@ -322,39 +314,9 @@ import RatingSummary from '@keyvaluesystems/react-star-rating-summary';
 
 function App() {
 
-  const ratings = {
-		1: 100,
-		2: 200,
-		3: 300,
-		4: 400,
-		5: 500
-	};
-
-	const countColors = {
-		1: 'red',
-		2: 'yellow',
-		3: 'blue',
-		4: 'orange',
-		5: 'white'
-	};
-
-  const stylesOverride = {
-    Average: { color: 'purple' },
-    AverageStarIcon: {
-      width: '20px',
-      height: '20px'
-    },
-    LabelStarIcon: () => ({
-      width: '15px',
-      height: '15px'
-    }),
-    Label: (ratingId) => ({ fontSize: '12px' }),
-    Count: (ratingId) => ({color: countColors[ratingId]})
-  };
-
   return (
     <RatingSummary
-      ratings={ratings}
+      ratings={ratingValues}
       showAnimation={false}
       showCount={false}
       averageRatingPrecision={2}

package-lock.json

@@ -24,7 +24,7 @@
     "url": "git+https://github.com/KeyValueSoftwareSystems/react-star-rating-summary"
   },
   "author": "Keyvalue",
-  "license": "ISC",
+  "license": "MIT",
   "homepage": "https://github.com/KeyValueSoftwareSystems/react-star-rating-summary",
   "keywords": [
     "library",

package.json

@@ -2,37 +2,38 @@ const path = require('path');
 const webpack = require('webpack');
 const TerserPlugin = require('terser-webpack-plugin');
 const getPackageJson = require('./scripts/getPackageJson');
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 
-const {
-  version,
-  name,
-  license,
-  repository,
-  author,
-} = getPackageJson('version', 'name', 'license', 'repository', 'author');
+const { version, name, license, repository, author } = getPackageJson(
+  'version',
+  'name',
+  'license',
+  'repository',
+  'author'
+);
 
 const banner = `
   ${name} v${version}
   ${repository.url}
 
-  Copyright (c) ${author.replace(/ *<[^)]*> */g, " ")} and project contributors.
+  Copyright (c) ${author.replace(/ *<[^)]*> */g, ' ')} and project contributors.
 
   This source code is licensed under the ${license} license found in the
   LICENSE file in the root directory of this source tree.
 `;
 
 module.exports = {
-  mode: "production",
+  mode: 'production',
   devtool: 'source-map',
   entry: './src/index.tsx',
   output: {
     filename: 'index.js',
     path: path.resolve(__dirname, 'build'),
-    library: "MyLibrary",
+    library: 'React Star Rating Summary',
     libraryTarget: 'umd',
-    clean: true
+    clean: true,
+    globalObject: 'this'
   },
   externals: {
     react: 'react'
@@ -42,7 +43,7 @@ module.exports = {
     minimizer: [
       new TerserPlugin({ extractComments: false }),
       new CssMinimizerPlugin()
-    ],
+    ]
   },
   module: {
     rules: [
@@ -78,6 +79,6 @@ module.exports = {
     new webpack.BannerPlugin(banner)
   ],
   resolve: {
-    extensions: ['.ts', '.js', '.tsx', '.json', ".css", ".scss"]
+    extensions: ['.ts', '.js', '.tsx', '.json', '.css', '.scss']
   }
 };