@puzzle-ui/icons 0.1.0 → 0.3.0
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 +85 -0
- package/package.json +3 -3
package/README.md
ADDED
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
# @puzzle-ui/icons
|
|
2
|
+
|
|
3
|
+
React icon components backed by Iconify. Use named icons in your application
|
|
4
|
+
or alongside Puzzle UI components.
|
|
5
|
+
|
|
6
|
+
> Puzzle is under active development. APIs and framework compatibility may
|
|
7
|
+
> change; use it for experimentation and evaluation rather than production.
|
|
8
|
+
|
|
9
|
+
## Installation
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
npm install @puzzle-ui/icons
|
|
13
|
+
# or
|
|
14
|
+
bun add @puzzle-ui/icons
|
|
15
|
+
# or
|
|
16
|
+
pnpm add @puzzle-ui/icons
|
|
17
|
+
# or
|
|
18
|
+
yarn add @puzzle-ui/icons
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
Requires React and React DOM 19 (`^19.0.0`). No theme provider is required.
|
|
22
|
+
|
|
23
|
+
## Usage
|
|
24
|
+
|
|
25
|
+
```tsx
|
|
26
|
+
import { Icon } from "@puzzle-ui/icons";
|
|
27
|
+
|
|
28
|
+
export const HomeIcon = () => (
|
|
29
|
+
<Icon name="lucide:house" size={24} aria-hidden="true" />
|
|
30
|
+
);
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
`Icon` accepts a collection-prefixed `name`, optional numeric `size` in
|
|
34
|
+
pixels, optional `color`, and SVG attributes. Without an explicit color,
|
|
35
|
+
it can inherit the surrounding text color.
|
|
36
|
+
|
|
37
|
+
For icon-only controls, label the control and keep its icon decorative:
|
|
38
|
+
|
|
39
|
+
```tsx
|
|
40
|
+
<button type="button" aria-label="Search">
|
|
41
|
+
<Icon name="lucide:search" aria-hidden="true" />
|
|
42
|
+
</button>
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
## Server rendering
|
|
46
|
+
|
|
47
|
+
The package also exports `SSRIcon` and `SSRIconProps`. `SSRIcon` is an async
|
|
48
|
+
component that fetches icon data on the server and falls back to Iconify's
|
|
49
|
+
client-side loading when data is unavailable.
|
|
50
|
+
|
|
51
|
+
Use it only in rendering environments that support async components, such
|
|
52
|
+
as an appropriate React Server Component setup. It is not a drop-in async
|
|
53
|
+
component for ordinary client-side React rendering.
|
|
54
|
+
|
|
55
|
+
Icon loading can make external requests to Iconify. Account for network
|
|
56
|
+
availability and your Content Security Policy. Framework compatibility is
|
|
57
|
+
still being evaluated.
|
|
58
|
+
|
|
59
|
+
## Exports
|
|
60
|
+
|
|
61
|
+
- `Icon`, `IconProps`
|
|
62
|
+
- `SSRIcon`, `SSRIconProps`
|
|
63
|
+
|
|
64
|
+
Import from `@puzzle-ui/icons`; generated internal icon-set files are not
|
|
65
|
+
exported package entry points. ESM and CommonJS builds and TypeScript
|
|
66
|
+
declarations are included.
|
|
67
|
+
|
|
68
|
+
## Development
|
|
69
|
+
|
|
70
|
+
```sh
|
|
71
|
+
# From the repository root
|
|
72
|
+
npm run build --workspace=@puzzle-ui/icons
|
|
73
|
+
|
|
74
|
+
# From this package directory
|
|
75
|
+
bun run vitest
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
`prepack` rebuilds the package before packing or publishing. See the root
|
|
79
|
+
[publishing guide](../../README.md#publishing-packages).
|
|
80
|
+
|
|
81
|
+
## License
|
|
82
|
+
|
|
83
|
+
Package code is MIT; see [LICENSE](../../LICENSE), also included at
|
|
84
|
+
`dist/LICENSE` in published packages. Individual icon collections may carry
|
|
85
|
+
their own licenses; check the collection's terms before using its artwork.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@puzzle-ui/icons",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Icons for Puzzle",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"publishConfig": {
|
|
@@ -30,14 +30,14 @@
|
|
|
30
30
|
"scripts": {
|
|
31
31
|
"build": "tsdown",
|
|
32
32
|
"vitest": "bunx vitest run --passWithNoTests",
|
|
33
|
-
"vitest:watch": "bunx vitest",
|
|
33
|
+
"vitest:watch": "bunx vitest run --watch --passWithNoTests",
|
|
34
34
|
"clean": "rm -rf dist",
|
|
35
35
|
"prepack": "tsdown"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"@iconify/react": "^6.0.3",
|
|
39
39
|
"@iconify/utils": "^3.1.7",
|
|
40
|
-
"@puzzle-ui/core": "^0.
|
|
40
|
+
"@puzzle-ui/core": "^0.3.0"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"react": "^19.0.0",
|