Update library to use modern technology

Author: che-wf

.babelrc

@@ -1,11 +1,3 @@
 {
-  "presets": [
-    "env",
-    "react",
-    "es2015"
-  ],
-  "plugins": [
-    "transform-class-properties",
-    "transform-object-rest-spread"
-  ]
+  "presets": ["@babel/preset-env", "@babel/preset-react"]
 }

.eslintrc

@@ -1,17 +1,19 @@
 {
-  "extends": "airbnb",
-  "parser": "babel-eslint",
+  "extends": ["airbnb", "airbnb/hooks"],
+  "parser": "@babel/eslint-parser",
   "env": {
     "browser": true,
-    "es6": true
+    "es2020": true,
+    "jest": true
   },
-  "plugins": ["jsx-a11y", "react"],
+  "plugins": ["jsx-a11y", "react", "react-hooks"],
   "parserOptions": {
-    "ecmaVersion": 6,
+    "ecmaVersion": 2020,
     "sourceType": "module",
     "ecmaFeatures": {
       "jsx": true
-    }
+    },
+    "requireConfigFile": false
   },
   "rules": {
     "arrow-parens": ["error", "always"],
@@ -47,6 +49,9 @@
     "react/prop-types": 0,
     "react/require-extension": 0,
     "react/self-closing-comp": 0,
-    "react/sort-comp": 0
+  "react/jsx-props-no-spreading": 0,
+  "react/sort-comp": 0,
+  "react-hooks/rules-of-hooks": "error",
+  "react-hooks/exhaustive-deps": "warn"
   }
 }

.prettierignore

@@ -0,0 +1,4 @@
+node_modules/
+dist/
+build/
+coverage/

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "singleQuote": false,
+  "trailingComma": "es5",
+  "printWidth": 80,
+  "tabWidth": 2,
+  "semi": true
+}

CHANGELOG.md

@@ -1,20 +1,42 @@
-#0.1.3
+# CHANGELOG
+
+## 0.2.0 (2025-08-26)
+
+### Demo and Build Pipeline Modernization
+
+- Demo and library now use a single React instance (no duplicate Reacts)
+- Demo imports library from npm tarball, not local dist
+- Added stable, modular Gulp build pipeline (separate build and watch tasks)
+- Added LESS variable for @primary-color
+- Added /gh-pages/bin/update-demo.sh for one-command demo updates
+- Added npm script 'update-demo' for easy demo refresh
+- Improved error handling and build stability
+- Updated documentation and workflow for best practices
+
+## 0.1.3
+
 Adds in currency (thanks! @jgautheron)
 
-#0.1.2
+## 0.1.2
+
 Adds in decimal values (thanks! @che-wf)
 
-#0.0.5
+## 0.0.5
+
 Updates to React 16 (thanks! @kunukn)
 
-#0.0.4
+## 0.0.4
+
 Fix incorrect numbers being drawn when the screen was inactive. (thanks! @migreva)
 
-#0.0.3
+## 0.0.3
+
 Added `delayValue` prop to delay the start of the animation.
 
-#0.0.2
+## 0.0.2
+
 Added `userLocaleString` prop. Thanks @adjohu.
 
-#0.0.1
+## 0.0.1
+
 Initial release

CONTRIBUTING.md

@@ -0,0 +1,21 @@
+# Contributing
+
+Thank you for considering contributing to react-number-easing!
+
+## How to Contribute
+
+- Fork the repository and create your branch from `main`.
+- Install dependencies: `npm install`
+- Run tests: `npm test`
+- Run linter: `npm run lint`
+- Build the project: `npm run build`
+- Submit a pull request with a clear description of your changes.
+
+## Code Style
+
+- Use Prettier for formatting: `npm run format`
+- Follow ESLint rules.
+
+## Issues
+
+If you find a bug or have a feature request, please open an issue on GitHub.

README.md

@@ -1,23 +1,21 @@
 # [React Number Easing](http://javierbyte.github.io/react-number-easing/)
-[![Rate on Openbase](https://badges.openbase.com/js/rating/che-react-number-easing.svg)](https://openbase.com/js/che-react-number-easing?utm_source=embedded&utm_medium=badge&utm_campaign=rate-badge)
 
 React component for fancy number transitions.
 
 [Live demo](https://che-wf.github.io/react-number-easing/)
 
 [![react-number-easing screenshot](assets/number-easing-infinite.gif)](https://che-wf.github.io/react-number-easing/)
 
-
 ## Installation
 
 ```js
 npm i -S che-react-number-easing
 ```
 
-## Usage.
+## Usage
 
 ```jsx
-const NumberEasing = require('che-react-number-easing');
+import { NumberEasing } from "che-react-number-easing";
 
 <NumberEasing
   ease="quintInOut"
@@ -26,41 +24,55 @@ const NumberEasing = require('che-react-number-easing');
   trail={true}
   useLocaleString={true}
   value={15}
-/>
+/>;
 ```
 
 ### Props
 
-* `[ease]`: The easing equation for the animation.
-  * Default: `quintInOut` (You can choose from [mattdesl/eases](https://github.com/mattdesl/eases/blob/master/index.js).)
-  * Type: `string`
-* `[precision]`: How many decimal places you want to show?
-  * Default: `2`
-  * Type: `number`
-* `[speed]`: How fast do you want to finish the animation?
-  * Default:`500` (ms)
-  * Type: `number`
-* `[trail]`: Do you want trailing zeroes?
-  * Default: `false`
-  * Type: `boolean`
-* `[useLocaleString]`: Use number formatting based on locale?
-  * Default: `false`
-  * Type: `boolean`
-* `[value]`: The value that you want to display at the end of the animation.
-  * `Required`
-  * Type: `number`
-
-# Build
-
-If you want to build this from source, you will need babel and less.
-
-```js
+- `[ease]`: The easing equation for the animation.
+  - Default: `quintInOut` (You can choose from [mattdesl/eases](https://github.com/mattdesl/eases/blob/master/index.js).)
+  - Type: `string`
+- `[precision]`: How many decimal places you want to show?
+  - Default: `2`
+  - Type: `number`
+- `[speed]`: How fast do you want to finish the animation?
+  - Default:`500` (ms)
+  - Type: `number`
+- `[trail]`: Do you want trailing zeroes?
+  - Default: `false`
+  - Type: `boolean`
+- `[useLocaleString]`: Use number formatting based on locale?
+  - Default: `false`
+  - Type: `boolean`
+- `[value]`: The value that you want to display at the end of the animation.
+  - `Required`
+  - Type: `number`
+
+## Requirements
+
+- React 18 or newer
+
+## Build
+
+To build from source:
+
+```sh
 npm install
+npm run build
 ```
 
-And run the pre publish script
+## Test
 
-```js
-npm run prepare
+To run tests:
+
+```sh
+npm test
 ```
+
 [![HitCount](http://hits.dwyl.com/{username}/che-wf/react-number-easing.svg)](http://hits.dwyl.com/{username}/che-wf/react-number-easing)
+
+## Project Structure
+
+- Main component: `src/components/NumberEasing.jsx`
+- All components are exported from `src/index.jsx`
+  [![HitCount](http://hits.dwyl.com/{username}/che-wf/react-number-easing.svg)](http://hits.dwyl.com/{username}/che-wf/react-number-easing)

che-react-number-easing-0.2.0.tgz

@@ -0,0 +1,5 @@
+module.exports = {
+  testEnvironment: 'jsdom',
+  testMatch: ['<rootDir>/src/**/__tests__/**/*.[jt]s?(x)'],
+  testPathIgnorePatterns: ['<rootDir>/dist/'],
+};