@regardio/react 1.0.2 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +34 -32
- package/package.json +25 -20
package/README.md
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
# @regardio/react
|
|
2
2
|
|
|
3
|
-
> Reusable React components from Regardio's projects,
|
|
3
|
+
> Reusable React components from Regardio's projects, shared outward.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
Components that have carried real Regardio work, gathered here so other projects don't have to reinvent them. Accessible defaults, Tailwind-aware styling, and a surface shaped by actual use.
|
|
6
6
|
|
|
7
|
-
##
|
|
7
|
+
## Pre-release notice
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
This package is currently at v0.x. The components run in production across Regardio's own projects, but the API may still move between minor versions. A few habits that help:
|
|
10
10
|
|
|
11
|
-
-
|
|
12
|
-
-
|
|
13
|
-
-
|
|
11
|
+
- Pin to exact versions in `package.json`
|
|
12
|
+
- Read the changelog before upgrading
|
|
13
|
+
- Expect the occasional breaking change until v1.0
|
|
14
14
|
|
|
15
|
-
##
|
|
15
|
+
## What it's for
|
|
16
16
|
|
|
17
|
-
|
|
17
|
+
`@regardio/react` exists so a handful of steady components don't have to be rebuilt in every new app:
|
|
18
18
|
|
|
19
|
-
- **
|
|
20
|
-
- **
|
|
21
|
-
- **
|
|
22
|
-
- **
|
|
19
|
+
- **Shared, well-used pieces** — refined through actual product work, not sketched on a whiteboard
|
|
20
|
+
- **One home, not many copies** — components live here instead of drifting apart across projects
|
|
21
|
+
- **Sensible defaults** — accessibility, responsive behaviour, and Tailwind integration come along for the ride
|
|
22
|
+
- **Tree-shakeable** — bring in what's needed, leave the rest out of the bundle
|
|
23
23
|
|
|
24
24
|
## Installation
|
|
25
25
|
|
|
@@ -27,9 +27,7 @@ We created `@regardio/react` to:
|
|
|
27
27
|
pnpm add @regardio/react
|
|
28
28
|
```
|
|
29
29
|
|
|
30
|
-
### Peer
|
|
31
|
-
|
|
32
|
-
This package requires:
|
|
30
|
+
### Peer dependencies
|
|
33
31
|
|
|
34
32
|
- `react` >= 19.0.0
|
|
35
33
|
- `react-dom` >= 19.0.0
|
|
@@ -38,7 +36,7 @@ This package requires:
|
|
|
38
36
|
|
|
39
37
|
## Usage
|
|
40
38
|
|
|
41
|
-
Import components, hooks, and utilities directly from their paths
|
|
39
|
+
Import components, hooks, and utilities directly from their paths so tree-shaking does its work:
|
|
42
40
|
|
|
43
41
|
```tsx
|
|
44
42
|
import { Box } from '@regardio/react/box';
|
|
@@ -46,15 +44,15 @@ import { Link } from '@regardio/react/link';
|
|
|
46
44
|
import { useNonce } from '@regardio/react/hooks/use-nonce';
|
|
47
45
|
```
|
|
48
46
|
|
|
49
|
-
### TailwindCSS
|
|
47
|
+
### TailwindCSS integration
|
|
50
48
|
|
|
51
|
-
Components
|
|
49
|
+
Components are styled with Tailwind. Pull the base styles in once, from your app:
|
|
52
50
|
|
|
53
51
|
```tsx
|
|
54
52
|
import '@regardio/react/tailwind.css';
|
|
55
53
|
```
|
|
56
54
|
|
|
57
|
-
## What's
|
|
55
|
+
## What's inside
|
|
58
56
|
|
|
59
57
|
### Components
|
|
60
58
|
|
|
@@ -66,12 +64,12 @@ import '@regardio/react/tailwind.css';
|
|
|
66
64
|
| `Carousel` | Embla-powered carousel with navigation controls |
|
|
67
65
|
| `Countdown` | Dynamic countdown timer display |
|
|
68
66
|
| `GenericError` | React Router error boundary with i18n support |
|
|
69
|
-
| `Heading` | Semantic headings (h1
|
|
70
|
-
| `Highlight` | Text highlighting with
|
|
71
|
-
| `IconButton` | Button
|
|
67
|
+
| `Heading` | Semantic headings (h1–h6) with consistent styling |
|
|
68
|
+
| `Highlight` | Text highlighting with customisable styles |
|
|
69
|
+
| `IconButton` | Button shaped for icon-only content |
|
|
72
70
|
| `If` | Conditional rendering utility component |
|
|
73
71
|
| `Iframe` | Responsive iframe with sensible defaults |
|
|
74
|
-
| `Item` | Grid item with theme
|
|
72
|
+
| `Item` | Grid item with theme colours and link support |
|
|
75
73
|
| `LeafletMap` | Leaflet map integration |
|
|
76
74
|
| `Link` | React Router link with external URL detection |
|
|
77
75
|
| `List` | Compound list component with Root and Item |
|
|
@@ -99,16 +97,16 @@ import '@regardio/react/tailwind.css';
|
|
|
99
97
|
|
|
100
98
|
| Utility | Description |
|
|
101
99
|
|---------|-------------|
|
|
102
|
-
| `author` | Author
|
|
103
|
-
| `isRouteActive` | Route matching
|
|
100
|
+
| `author` | Author and contributor data formatting |
|
|
101
|
+
| `isRouteActive` | Route matching helpers |
|
|
104
102
|
| `locale` | Locale detection and formatting |
|
|
105
|
-
| `text` | Typography processing (quotes, special
|
|
103
|
+
| `text` | Typography processing (quotes, special characters) |
|
|
106
104
|
|
|
107
|
-
> **Note:** For Tailwind utilities like `cn`, `tv`, and `twMerge`,
|
|
105
|
+
> **Note:** For Tailwind utilities like `cn`, `tv`, and `twMerge`, reach for `@regardio/tailwind/utils`.
|
|
108
106
|
|
|
109
107
|
## Documentation
|
|
110
108
|
|
|
111
|
-
|
|
109
|
+
The [docs](./docs) folder has detailed notes on each component, hook, and utility.
|
|
112
110
|
|
|
113
111
|
## Storybook
|
|
114
112
|
|
|
@@ -120,12 +118,16 @@ pnpm storybook
|
|
|
120
118
|
|
|
121
119
|
## Contributing
|
|
122
120
|
|
|
123
|
-
|
|
121
|
+
The package is maintained primarily for Regardio's own work, but contributions from elsewhere are welcome:
|
|
124
122
|
|
|
125
123
|
- Bug reports and fixes
|
|
126
124
|
- Documentation improvements
|
|
127
|
-
- Feature suggestions (
|
|
125
|
+
- Feature suggestions (not every one will become an implementation)
|
|
128
126
|
|
|
129
127
|
## License
|
|
130
128
|
|
|
131
|
-
**MIT
|
|
129
|
+
**MIT** — free to use in commercial and open-source projects.
|
|
130
|
+
|
|
131
|
+
---
|
|
132
|
+
|
|
133
|
+
*Part of the [Regardio Ensemble](https://regard.io/ensemble) toolkit for shared well-being.*
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://www.schemastore.org/package.json",
|
|
3
3
|
"name": "@regardio/react",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.1.1",
|
|
5
5
|
"private": false,
|
|
6
6
|
"description": "Regardio React UI components",
|
|
7
7
|
"keywords": [
|
|
@@ -191,24 +191,30 @@
|
|
|
191
191
|
},
|
|
192
192
|
"files": [
|
|
193
193
|
"dist",
|
|
194
|
-
"src"
|
|
194
|
+
"src",
|
|
195
|
+
"pnpm-lock.yaml"
|
|
195
196
|
],
|
|
196
197
|
"dependencies": {
|
|
197
198
|
"@base-ui/react": "1.4.1",
|
|
198
199
|
"@mdx-js/react": "3.1.1",
|
|
199
|
-
"@supabase/supabase-js": "2.
|
|
200
|
+
"@supabase/supabase-js": "2.105.3",
|
|
200
201
|
"embla-carousel": "8.6.0",
|
|
201
202
|
"embla-carousel-react": "8.6.0",
|
|
202
203
|
"markdown-to-jsx": "9.7.16",
|
|
203
|
-
"@regardio/js": "1.
|
|
204
|
-
"@regardio/tailwind": "1.
|
|
204
|
+
"@regardio/js": "1.1.1",
|
|
205
|
+
"@regardio/tailwind": "1.1.1"
|
|
206
|
+
},
|
|
207
|
+
"peerDependencies": {
|
|
208
|
+
"react": ">=19",
|
|
209
|
+
"react-dom": ">=19",
|
|
210
|
+
"react-router": ">=7"
|
|
205
211
|
},
|
|
206
212
|
"devDependencies": {
|
|
207
|
-
"@storybook/addon-a11y": "10.3.
|
|
208
|
-
"@storybook/addon-docs": "10.3.
|
|
209
|
-
"@storybook/addon-vitest": "10.3.
|
|
210
|
-
"@storybook/react": "10.3.
|
|
211
|
-
"@storybook/react-vite": "10.3.
|
|
213
|
+
"@storybook/addon-a11y": "10.3.6",
|
|
214
|
+
"@storybook/addon-docs": "10.3.6",
|
|
215
|
+
"@storybook/addon-vitest": "10.3.6",
|
|
216
|
+
"@storybook/react": "10.3.6",
|
|
217
|
+
"@storybook/react-vite": "10.3.6",
|
|
212
218
|
"@tailwindcss/vite": "4.2.4",
|
|
213
219
|
"@testing-library/jest-dom": "6.9.1",
|
|
214
220
|
"@testing-library/react": "16.3.2",
|
|
@@ -221,20 +227,15 @@
|
|
|
221
227
|
"@vitest/browser-playwright": "4.1.5",
|
|
222
228
|
"@vitest/coverage-v8": "4.1.5",
|
|
223
229
|
"@vitest/ui": "4.1.5",
|
|
224
|
-
"jsdom": "29.
|
|
230
|
+
"jsdom": "29.1.1",
|
|
225
231
|
"playwright": "1.59.1",
|
|
226
|
-
"storybook": "10.3.
|
|
232
|
+
"storybook": "10.3.6",
|
|
227
233
|
"tailwindcss": "4.2.4",
|
|
228
|
-
"tsdown": "0.21.
|
|
234
|
+
"tsdown": "0.21.10",
|
|
229
235
|
"typescript": "6.0.3",
|
|
230
|
-
"vite": "8.0.
|
|
236
|
+
"vite": "8.0.10",
|
|
231
237
|
"vitest": "4.1.5",
|
|
232
|
-
"@regardio/dev": "2.0
|
|
233
|
-
},
|
|
234
|
-
"peerDependencies": {
|
|
235
|
-
"react": "19.2.5",
|
|
236
|
-
"react-dom": "19.2.5",
|
|
237
|
-
"react-router": "7.14.2"
|
|
238
|
+
"@regardio/dev": "2.3.0"
|
|
238
239
|
},
|
|
239
240
|
"engines": {
|
|
240
241
|
"node": ">=24"
|
|
@@ -244,6 +245,10 @@
|
|
|
244
245
|
"clean": "rimraf .turbo dist",
|
|
245
246
|
"dev": "tsdown --watch",
|
|
246
247
|
"fix": "run-s fix:pkg fix:md fix:biome",
|
|
248
|
+
"release": "commit-and-tag-version",
|
|
249
|
+
"release:major": "commit-and-tag-version --release-as major",
|
|
250
|
+
"release:minor": "commit-and-tag-version --release-as minor",
|
|
251
|
+
"release:patch": "commit-and-tag-version --release-as patch",
|
|
247
252
|
"fix:biome": "biome check --write --unsafe .",
|
|
248
253
|
"fix:md": "markdownlint-cli2 --config ../../.markdownlint-cli2.jsonc --fix",
|
|
249
254
|
"fix:pkg": "sort-package-json",
|