@prokodo/ui 0.0.47 → 0.0.49
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 +20 -6
- package/dist/constants/project.js +1 -1
- package/package.json +16 -5
package/README.md
CHANGED
|
@@ -8,6 +8,12 @@
|
|
|
8
8
|
|
|
9
9
|
**Modern, customizable UI components built with React and TypeScript — developed by [prokodo](https://www.prokodo.com) for high-performance web interfaces.**
|
|
10
10
|
|
|
11
|
+
> 🇺🇸 Need help shipping a production **Next.js + Headless CMS** in 4–6 weeks?
|
|
12
|
+
> **prokodo — Next.js CMS agency** → [click here](https://www.prokodo.com/en/solution/next-js-cms?utm_source=github&utm_medium=readme_top)
|
|
13
|
+
>
|
|
14
|
+
> 🇩🇪 Sie suchen eine **Next.js Agentur** (Strapi/Contentful/WP)?
|
|
15
|
+
> **prokodo — Next.js CMS Agentur** → [hier klicken](https://www.prokodo.com/de/loesung/next-js-cms?utm_source=github&utm_medium=readme_top)
|
|
16
|
+
|
|
11
17
|
[](https://www.npmjs.com/package/@prokodo/ui)
|
|
12
18
|
[](https://github.com/prokodo-agency/ui/actions/workflows/release.yml)
|
|
13
19
|
[](LICENSE)
|
|
@@ -29,7 +35,7 @@
|
|
|
29
35
|
|
|
30
36
|
## ⚡ Lightweight by Design
|
|
31
37
|
|
|
32
|
-
|
|
38
|
+
Adaptive Island Components (AIC) are fully modular and optimized for modern frameworks (Next.js, Remix, etc.).
|
|
33
39
|
Each component is built for **lazy loading**, works seamlessly with **React Server Components (RSC)**, and can be **tree-shaken** out when unused.
|
|
34
40
|
|
|
35
41
|
**Total bundle (all components): ~195 kB gzipped**
|
|
@@ -64,7 +70,7 @@ import { Button, type ButtonProps } from "@prokodo/ui/button";
|
|
|
64
70
|
export default function Layout() {
|
|
65
71
|
// Renders to HTML on the server with zero‐JS.
|
|
66
72
|
// On the client, it will hydrate when scrolled into view or the user interacts.
|
|
67
|
-
return <
|
|
73
|
+
return <Button title="Click me"/>;
|
|
68
74
|
}
|
|
69
75
|
```
|
|
70
76
|
|
|
@@ -77,7 +83,7 @@ import { Button, type ButtonProps } from "@prokodo/ui/button";
|
|
|
77
83
|
export default function Layout() {
|
|
78
84
|
// Renders to HTML on the server with zero‐JS.
|
|
79
85
|
// On the client, it will hydrate when scrolled into view or the user interacts.
|
|
80
|
-
return <
|
|
86
|
+
return <Button title="Click me"/>;
|
|
81
87
|
}
|
|
82
88
|
```
|
|
83
89
|
|
|
@@ -130,8 +136,8 @@ export default function GalleryPage() {
|
|
|
130
136
|
|
|
131
137
|
### Compatibility of the components
|
|
132
138
|
|
|
133
|
-
- ✅ = Available as AIC (renders zero-JS RSC and self-hydrates when needed) and can also used as a client‐only entry.
|
|
134
|
-
- \- = RSC (AIC) only; no client‐side bundle needed. (
|
|
139
|
+
- ✅ = Available as AIC (renders zero-JS RSC and self-hydrates when needed) and can also be used as a client‐only entry.
|
|
140
|
+
- \- = RSC (AIC) only; no client‐side bundle needed. (Usable in both, but best practice to use in RSC only)
|
|
135
141
|
|
|
136
142
|
| Component | ✅ AIC (RSC + optional client) | ✅ SSR-Compatible (`"use client"`) |
|
|
137
143
|
|-----------------------|:--------------------------------:|:---------------------------------:|
|
|
@@ -204,7 +210,7 @@ export const Navbar = createIsland<NavbarProps>({
|
|
|
204
210
|
|
|
205
211
|
```
|
|
206
212
|
|
|
207
|
-
### 2. Create your lazy wrapper (Navbar.lazy):
|
|
213
|
+
### 2. Create your lazy-hydrate wrapper (Navbar.lazy):
|
|
208
214
|
|
|
209
215
|
```tsx
|
|
210
216
|
'use client'
|
|
@@ -237,6 +243,14 @@ export default createLazyWrapper<NavbarProps>({
|
|
|
237
243
|
- [ ] Improve **accessibility** to meet **WCAG 2.2 AAA** standards
|
|
238
244
|
- [ ] Detailed Documentation about the components
|
|
239
245
|
|
|
246
|
+
## Examples (Next.js + Headless CMS)
|
|
247
|
+
|
|
248
|
+
- Next.js + **Strapi** content models
|
|
249
|
+
- Next.js + **Contentful** entries & preview
|
|
250
|
+
- Migration from **Headless WordPress** to Next.js
|
|
251
|
+
|
|
252
|
+
Compare CMS options → [Strapi vs Contentful vs Headless WP](https://www.prokodo.com/de/loesung/next-js-cms?utm_source=github&utm_medium=readme_examples)
|
|
253
|
+
|
|
240
254
|
## 📘 Documentation
|
|
241
255
|
|
|
242
256
|
Explore all components and examples in the official Storybook:
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@prokodo/ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.49",
|
|
4
4
|
"type": "module",
|
|
5
|
-
"description": "
|
|
5
|
+
"description": "UI components for production-grade Next.js + Headless CMS (Strapi, Contentful, Headless WordPress) websites by prokodo – built for Core Web Vitals & SEO.",
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"module": "dist/index.es.js",
|
|
8
8
|
"types": "dist/types/index.d.ts",
|
|
@@ -298,16 +298,23 @@
|
|
|
298
298
|
"react-dom": ">=18"
|
|
299
299
|
},
|
|
300
300
|
"keywords": [
|
|
301
|
+
"nextjs",
|
|
302
|
+
"next.js",
|
|
303
|
+
"headless cms",
|
|
304
|
+
"strapi",
|
|
305
|
+
"contentful",
|
|
306
|
+
"headless wordpress",
|
|
301
307
|
"react",
|
|
302
308
|
"typescript",
|
|
303
309
|
"component-library",
|
|
304
310
|
"ui-components",
|
|
305
311
|
"design-system",
|
|
306
|
-
"prokodo",
|
|
307
|
-
"npm-package",
|
|
308
312
|
"css-modules",
|
|
309
313
|
"storybook",
|
|
310
|
-
"frontend"
|
|
314
|
+
"frontend",
|
|
315
|
+
"core web vitals",
|
|
316
|
+
"seo",
|
|
317
|
+
"prokodo"
|
|
311
318
|
],
|
|
312
319
|
"files": [
|
|
313
320
|
"dist",
|
|
@@ -316,6 +323,10 @@
|
|
|
316
323
|
],
|
|
317
324
|
"author": "prokodo <info@prokodo.com>",
|
|
318
325
|
"license": "BUSL-1.1",
|
|
326
|
+
"funding": {
|
|
327
|
+
"type": "other",
|
|
328
|
+
"url": "https://www.prokodo.com/de/loesung/next-js-cms/?utm_source=npm&utm_medium=funding"
|
|
329
|
+
},
|
|
319
330
|
"publishConfig": {
|
|
320
331
|
"access": "public"
|
|
321
332
|
},
|