Update dependencies to latest versions. Change build tool to rollup. …

…Refactor CI to use GitHub Actions. Add path aliases.

.github/workflows/build.yml

@@ -0,0 +1,31 @@
+name: build
+on:
+    push:
+        branches:
+            - master
+jobs:
+    main:
+        runs-on: ubuntu-latest
+        steps:
+            - name: Setup Node.js
+              uses: actions/setup-node@v4
+              with:
+                  node-version: 20
+            - name: Checkout
+              uses: actions/checkout@v4
+            - name: Install and Build
+              run: |
+                  npm ci
+                  npm run build
+            - name: Test
+              run: npm run test
+            - name: Coveralls
+              uses: coverallsapp/github-action@v2
+            - name: Build Storybook
+              run: npm run build:storybook
+            - name: Deploy Storybook
+              uses: JamesIves/github-pages-deploy-action@releases/v4
+              with:
+                  ACCESS_TOKEN: ${{ secrets.GITHUB_TOKEN  }}
+                  BRANCH: gh-pages
+                  FOLDER: dist-storybook

.gitignore

@@ -3,3 +3,4 @@ yarn-error.log
 coverage/
 lib/
 dist/
+dist-storybook/

.prettierrc

@@ -0,0 +1,7 @@
+{
+    "endOfLine": "lf",
+    "semi": true,
+    "singleQuote": true,
+    "tabWidth": 4,
+    "trailingComma": "all"
+}

.storybook/main.ts

@@ -0,0 +1,28 @@
+import type { StorybookConfig } from '@storybook/react-vite';
+import { join, dirname } from 'path';
+import tsconfigPaths from 'vite-tsconfig-paths';
+
+/**
+ * This function is used to resolve the absolute path of a package.
+ * It is needed in projects that use Yarn PnP or are set up within a monorepo.
+ */
+const getAbsolutePath = (value: string): any => {
+    return dirname(require.resolve(join(value, 'package.json')));
+};
+
+const config: StorybookConfig = {
+    stories: ['../stories/**/*.stories.tsx'],
+    addons: [getAbsolutePath('@storybook/addon-essentials')],
+    framework: {
+        name: getAbsolutePath('@storybook/react-vite'),
+        options: {},
+    },
+    async viteFinal(config) {
+        const { mergeConfig } = await import('vite');
+        return mergeConfig(config, {
+            plugins: [...(config.plugins || []), tsconfigPaths()],
+        });
+    },
+};
+
+export default config;

.storybook/manager.ts

@@ -0,0 +1,6 @@
+import { addons } from '@storybook/manager-api';
+import theme from './theme';
+
+addons.setConfig({
+    theme,
+});

.storybook/preview.ts

@@ -0,0 +1,9 @@
+import { Preview } from '@storybook/react';
+
+const preview: Preview = {
+    parameters: {
+        showPanel: false,
+    },
+};
+
+export default preview;

.storybook/theme.ts

@@ -0,0 +1,11 @@
+import { create } from '@storybook/theming/create';
+
+const theme = create({
+    base: 'light',
+    brandTitle: 'React SVG GPS',
+    brandUrl: 'https://github.com/kayleecodes1/react-svg-gps',
+    brandImage: 'https://media.githubusercontent.com/media/kayleecodes1/react-svg-gps/master/logo.png',
+    brandTarget: '_self',
+});
+
+export default theme;

README.md

@@ -10,11 +10,11 @@
 
 ---
 
-[![build](https://img.shields.io/travis/com/kylepixel/react-svg-gps.svg)](https://travis-ci.com/kylepixel/react-svg-gps)
-[![coverage](https://img.shields.io/coveralls/github/kylepixel/react-svg-gps.svg)](https://coveralls.io/github/kylepixel/react-svg-gps)
+![build](https://github.com/kayleecodes1/react-svg-gps/actions/workflows/build.yml/badge.svg)
+[![coverage](https://img.shields.io/coveralls/github/kayleecodes1/react-svg-gps.svg)](https://coveralls.io/github/kayleecodes1/react-svg-gps)
 [![npm](https://img.shields.io/npm/v/react-svg-gps.svg?color=%230382f8)](https://www.npmjs.com/package/react-svg-gps)
 [![minzipped size](https://img.shields.io/bundlephobia/minzip/react-svg-gps.svg?color=%230382f8)](https://bundlephobia.com/result?p=react-svg-gps)
-[![license](https://img.shields.io/npm/l/react-svg-gps.svg?color=%230382f8)](https://github.com/kylepixel/react-svg-gps/blob/master/LICENSE)
+[![license](https://img.shields.io/npm/l/react-svg-gps.svg?color=%230382f8)](https://github.com/kayleecodes1/react-svg-gps/blob/master/LICENSE)
 
 ## The Problem
 
@@ -30,12 +30,10 @@ It utilizes React Hooks for maximum composability.
 
 ## Installation
 
-React SVG GPS requires **React 16.8 or later**.
+React SVG GPS requires **React 18 or later**.
 
 ```sh
-npm install --save react-svg-gps
-# or
-yarn add react-svg-gps
+npm install react-svg-gps
 ```
 
 ## Basic Usage
@@ -72,11 +70,11 @@ const App = () => (
 
 ## More Examples
 
-[![storybook](https://cdn.jsdelivr.net/gh/storybooks/brand@master/badge/badge-storybook.svg)](http://kylepixel.github.io/react-svg-gps/)
+[![storybook](https://cdn.jsdelivr.net/gh/storybooks/brand@master/badge/badge-storybook.svg)](http://kayleecodes1.github.io/react-svg-gps/)
 
-You can find several usage examples compiled as a Storybook by clicking the badge above. The source code for these examples can be found [here](https://github.com/kylepixel/react-svg-gps/tree/master/examples).
+You can find several usage examples compiled for Storybook by clicking the badge above. The source code for these examples can be found [here](https://github.com/kayleecodes1/react-svg-gps/tree/master/examples).
 
-If you want to run and modify these examples locally, just clone this repository and run `yarn storybook`.
+If you want to run and modify these examples locally, just clone this repository and run `npm run storybook`.
 
 ## API
 

eslint.config.js

@@ -0,0 +1,61 @@
+const react = require('eslint-plugin-react');
+const js = require('@eslint/js');
+const tsEslint = require('@typescript-eslint/parser');
+const globals = require('globals');
+const eslintPluginPrettierRecommended = require('eslint-plugin-prettier/recommended');
+
+module.exports = [
+    {
+        files: ['src/**/*.{ts,tsx}'],
+        plugins: {
+            react,
+        },
+        languageOptions: {
+            parser: tsEslint,
+            parserOptions: {
+                ecmaFeatures: {
+                    jsx: true,
+                },
+            },
+            globals: {
+                ...globals.browser,
+            },
+        },
+        rules: {
+            ...js.configs.recommended.rules,
+            'no-console': ['warn', { allow: ['warn'] }],
+            'no-plusplus': 'off',
+            'react/jsx-indent': ['error', 4],
+            'react/jsx-indent-props': ['error', 4],
+            'react/jsx-filename-extension': ['error', { extensions: ['.tsx'] }],
+            'react/prop-types': 'off',
+            '@typescript-eslint/type-annotation-spacing': [
+                'error',
+                { before: true, after: true },
+            ],
+        },
+    },
+    {
+        files: ['vite.config.ts'],
+        languageOptions: {
+            globals: {
+                ...globals.jest,
+            },
+        },
+    },
+    {
+        files: ['src/**/*.test.{ts,tsx}'],
+        languageOptions: {
+            globals: {
+                ...globals.node,
+                ...globals.jest,
+            },
+        },
+        rules: {
+            'import/no-extraneous-dependencies': 'off',
+            '@typescript-eslint/explicit-function-return-type': 'off',
+            '@typescript-eslint/no-explicit-any': 'off',
+        },
+    },
+    eslintPluginPrettierRecommended,
+];