Refresh

.github/workflows/ci.yml

@@ -0,0 +1,93 @@
+name: CI
+
+on:
+  pull_request:
+  workflow_dispatch:
+
+jobs:
+  discover-packages:
+    name: Discover packages
+    runs-on: ubuntu-latest
+    outputs:
+      packages: ${{ steps.packages.outputs.packages }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v6
+
+      - name: Build package matrix
+        id: packages
+        shell: bash
+        run: |
+          packages_json=$(find ./packages -mindepth 1 -maxdepth 1 -type d -exec basename {} \; | sort | jq -R -s -c 'split("\n") | map(select(length > 0))')
+          echo "packages=${packages_json}" >> "$GITHUB_OUTPUT"
+
+  build-workspaces:
+    name: Build workspaces
+    needs: discover-packages
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v6
+
+      - name: Setup Node
+        uses: actions/setup-node@v6
+        with:
+          node-version-file: .nvmrc
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build workspace packages
+        run: npm --workspaces --if-present run build 2>&1 | tee build.log
+
+      - name: Debug - List package structure
+        run: |
+          echo "=== Checking for dist directories ==="
+          find packages -maxdepth 2 -type d -name dist
+          echo "=== Current working directory ==="
+          pwd
+          echo "=== Listing packages directory ==="
+          ls -la packages/ | head -20
+
+      - name: Upload workspace dist artifacts
+        uses: actions/upload-artifact@v7
+        with:
+          name: workspace-dist
+          path: packages/*/dist/**
+          if-no-files-found: error
+
+  test:
+    name: Test
+    needs:
+      - discover-packages
+      - build-workspaces
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        package: ${{ fromJson(needs.discover-packages.outputs.packages) }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v6
+
+      - name: Setup Node
+        uses: actions/setup-node@v6
+        with:
+          node-version-file: .nvmrc
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Download workspace dist artifacts
+        uses: actions/download-artifact@v8
+        with:
+          name: workspace-dist
+          path: .
+
+      - name: Run tests
+        run: npm test -- packages/${{ matrix.package }}
+
+      - name: Run typecheck
+        run: npm --workspace ./packages/${{ matrix.package }} run typecheck

.gitignore

@@ -1,8 +1,4 @@
 node_modules
 coverage
-cjs
-esm
-typings
+dist
 *.log
-.yarn
-storybook-static

.nvmrc

@@ -0,0 +1 @@
+lts/krypton

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "cSpell.words": ["nvmrc", "yoctocolors"]
+}

CONTRIBUTING.md

@@ -0,0 +1,20 @@
+# Contributing
+
+## Guidelines
+
+- Written in TypeScript
+- Must be fully tested on client and server
+- Use NPM workspaces
+- Each workspace is a separate package with its own README.md and package.json and is published to NPM.
+- Command should be run from the root of the repo, not from inside a package, just use `-w` or `--workspace` to specify the package, e.g. `npm run build -w packages/my-package`.
+- Each workspace/package should be a self contained React hook with a single purpose. Its totally fine to for packages to use each other.
+
+## Getting Started
+
+- Branch from `main`
+- Run `npm ci`
+- Run `npm start`
+- Commit your changes, push and create a pull request to `main` with a description of your changes.
+- A merged PR will trigger a GitHub workflow to run tests, typecheck and build each package. If any of these fail the PR will be marked as failed and you will need to fix the issues before it can be merged.
+- Upon successful merge, the workflow will automatically publish beta package versions any packages that have changed to NPM.
+- A repository owner will need to release productions versions.

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020 Mike Simmonds
+Copyright (c) 2026 Mike Simmonds
 
 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

@@ -1,16 +1,21 @@
-# 🎒 React Hooks
+<br/>
 
-A modular collection of React hooks.
+<picture>
+	<source media="(prefers-color-scheme: dark)" srcset="./.github/assets/logo-dark.svg">
+	<img alt="Hooks logo" src="./.github/assets/logo-light.svg" width="150">
+</picture>
 
-🦄 TypeScript support • 🐐 Fully tested • 👾 Server rendering compatible
+<p><small>A modular collection of React hooks.</small></p>
 
-![Travis](https://img.shields.io/travis/com/simmo/hooks?style=flat-square)
-![Netlify](https://img.shields.io/netlify/ec8abac0-d0d3-4928-8f30-15163c256eb0?style=flat-square)
-![License](https://img.shields.io/github/license/simmo/hooks?style=flat-square)
+<p>🦄 TypeScript support • 🐐 Fully tested • 👾 Server rendering compatible</p>
+
+[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/simmo/hooks/ci.yml?style=flat)](https://github.com/simmo/hooks/actions/workflows/ci.yml) ![License](https://img.shields.io/github/license/simmo/hooks?style=flat)
+
+---
 
 ## Help
 
-Run `yarn go`
+Run `npm start`
 
 ## Packages
 
@@ -24,7 +29,7 @@ See `./packages/*` for individual package installation details.
 | [@hooks/interval](packages/interval)             | ![npm](https://img.shields.io/npm/v/@hooks/interval?style=flat-square)       | React hook to wrap setInterval                                     |
 | [@hooks/media-query](packages/media-query)       | ![npm](https://img.shields.io/npm/v/@hooks/media-query?style=flat-square)    | React hook to respond to media queries                             |
 | [@hooks/mount](packages/mount)                   | ![npm](https://img.shields.io/npm/v/@hooks/mount?style=flat-square)          | React hook to execute callback on component mount                  |
-| [@hooks/network-status](packages/network-status) | ![npm](https://img.shields.io/npm/v/@hooks/network-status?style=flat-square) | React hook return network status details                           |
+| [@hooks/network-status](packages/network-status) | ![npm](https://img.shields.io/npm/v/@hooks/network-status?style=flat-square) | React hook to return network status details                        |
 | [@hooks/previous](packages/previous)             | ![npm](https://img.shields.io/npm/v/@hooks/previous?style=flat-square)       | React hook to remember a value between renders                     |
 | [@hooks/queue](packages/queue)                   | ![npm](https://img.shields.io/npm/v/@hooks/queue?style=flat-square)          | React hook to manage a queue                                       |
 | [@hooks/raf](packages/raf)                       | ![npm](https://img.shields.io/npm/v/@hooks/raf?style=flat-square)            | React hook to wrap requestAnimationFrame                           |