Skip to content

Commit d8be3bd

Browse files
committed
feat: add primitives module id subpkg
1 parent 03dcc95 commit d8be3bd

File tree

4 files changed

+87
-0
lines changed

4 files changed

+87
-0
lines changed

primitives/id/package.json

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
{
2+
"name": "soybean-react-ui/id",
3+
"version": "1.1.1",
4+
"license": "MIT",
5+
"homepage": "https://radix-ui.com/primitives",
6+
"repository": {
7+
"type": "git",
8+
"url": "git+https://github.com/radix-ui/primitives.git"
9+
},
10+
"bugs": {
11+
"url": "https://github.com/radix-ui/primitives/issues"
12+
},
13+
"publishConfig": {
14+
"main": "./dist/index.js",
15+
"module": "./dist/index.mjs",
16+
"types": "./dist/index.d.ts",
17+
"exports": {
18+
".": {
19+
"import": {
20+
"types": "./dist/index.d.mts",
21+
"default": "./dist/index.mjs"
22+
},
23+
"require": {
24+
"types": "./dist/index.d.ts",
25+
"default": "./dist/index.js"
26+
}
27+
}
28+
}
29+
},
30+
"sideEffects": false,
31+
"main": "./src/index.ts",
32+
"module": "./src/index.ts",
33+
"files": ["dist", "README.md"],
34+
"scripts": {
35+
"build": "radix-build",
36+
"clean": "rm -rf dist",
37+
"lint": "eslint --max-warnings 0 src",
38+
"typecheck": "tsc --noEmit"
39+
},
40+
"peerDependencies": {
41+
"@types/react": "*",
42+
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
43+
},
44+
"peerDependenciesMeta": {
45+
"@types/react": {
46+
"optional": true
47+
}
48+
},
49+
"dependencies": {
50+
"soybean-react-ui/use-layout-effect": "workspace:*"
51+
},
52+
"devDependencies": {
53+
"@types/react": "^19.0.7",
54+
"@types/react-dom": "^19.0.3",
55+
"eslint": "^9.18.0",
56+
"react": "^19.1.0",
57+
"react-dom": "^19.1.0",
58+
"typescript": "^5.7.3"
59+
},
60+
"source": "./src/index.ts"
61+
}

primitives/id/src/id.tsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import * as React from 'react';
2+
import { useLayoutEffect } from 'soybean-react-ui/use-layout-effect';
3+
4+
// We spaces with `.trim().toString()` to prevent bundlers from trying to `import { useId } from 'react';`
5+
const useReactId = (React as any)[' useId '.trim().toString()] || (() => undefined);
6+
let count = 0;
7+
8+
function useId(deterministicId?: string): string {
9+
const [id, setId] = React.useState<string | undefined>(useReactId());
10+
// React versions older than 18 will have client-side ids only.
11+
useLayoutEffect(() => {
12+
if (!deterministicId) setId(reactId => reactId ?? String((count += 1)));
13+
}, [deterministicId]);
14+
return deterministicId || (id ? `soybean-${id}` : '');
15+
}
16+
17+
export { useId };

primitives/id/src/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { useId } from './id';

primitives/id/tsconfig.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"extends": "../../tsconfig.base.json",
3+
"compilerOptions": {
4+
"outDir": "dist"
5+
},
6+
"include": ["src"],
7+
"exclude": ["node_modules", "dist"]
8+
}

0 commit comments

Comments
 (0)