@c15t/dev-tools 2.0.1 → 2.0.4
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 +64 -194
- package/dist/379.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/react.cjs +1 -1
- package/dist-types/version.d.ts +1 -1
- package/package.json +18 -4
package/README.md
CHANGED
|
@@ -1,222 +1,92 @@
|
|
|
1
|
-
|
|
1
|
+
<p align="center">
|
|
2
|
+
<a href="https://c15t.com?utm_source=npm&utm_medium=readme&utm_campaign=oss_readme&utm_content=%40c15t%2Fdev-tools" target="_blank" rel="noopener noreferrer">
|
|
3
|
+
<picture>
|
|
4
|
+
<source media="(prefers-color-scheme: dark)" srcset="../../docs/assets/c15t-banner-readme-dark.svg" type="image/svg+xml">
|
|
5
|
+
<img src="../../docs/assets/c15t-banner-readme-light.svg" alt="c15t Banner" type="image/svg+xml">
|
|
6
|
+
</picture>
|
|
7
|
+
</a>
|
|
8
|
+
</p>
|
|
2
9
|
|
|
3
|
-
|
|
10
|
+
# @c15t/dev-tools: Developer Tooling (Work in Progress)
|
|
4
11
|
|
|
5
|
-
|
|
12
|
+
[](https://github.com/c15t/c15t)
|
|
13
|
+
[](https://github.com/c15t/c15t/actions/workflows/ci.yml)
|
|
14
|
+
[](https://github.com/c15t/c15t/blob/main/LICENSE.md)
|
|
15
|
+
[](https://c15t.link/discord)
|
|
16
|
+
[](https://www.npmjs.com/package/@c15t/dev-tools)
|
|
17
|
+
[](https://github.com/c15t/c15t)
|
|
18
|
+
[](https://github.com/c15t/c15t/commits/main)
|
|
19
|
+
[](https://github.com/c15t/c15t/issues)
|
|
6
20
|
|
|
7
|
-
|
|
8
|
-
- **Location Panel**: Inspect location and apply geo/language overrides
|
|
9
|
-
- **Policy Panel**: Inspect detailed runtime policy-pack decision data
|
|
10
|
-
- **Scripts Panel**: Monitor script loading status
|
|
11
|
-
- **Actions Panel**: Quick actions for testing consent flows
|
|
12
|
-
- **Framework Agnostic**: Pure JavaScript core with React wrapper
|
|
13
|
-
- **TanStack DevTools Integration**: Use as a plugin in TanStack DevTools
|
|
14
|
-
- **CSS Animations**: Smooth, accessible animations with reduced motion support
|
|
15
|
-
- **Dark Mode**: Automatic dark mode support
|
|
21
|
+
A collection of developer tools and utilities for the c15t ecosystem, currently under active development.
|
|
16
22
|
|
|
17
|
-
##
|
|
23
|
+
## Key Features
|
|
18
24
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
### React
|
|
26
|
-
|
|
27
|
-
The easiest way to add DevTools to a React application:
|
|
28
|
-
|
|
29
|
-
```tsx
|
|
30
|
-
import { DevTools } from '@c15t/dev-tools/react';
|
|
31
|
-
|
|
32
|
-
function App() {
|
|
33
|
-
return (
|
|
34
|
-
<>
|
|
35
|
-
<YourApp />
|
|
36
|
-
<DevTools position="bottom-right" />
|
|
37
|
-
</>
|
|
38
|
-
);
|
|
39
|
-
}
|
|
40
|
-
```
|
|
25
|
+
- 🚧 Experimental developer utilities
|
|
26
|
+
- React component library with utility tools
|
|
27
|
+
- Radix UI and Tailwind CSS integration
|
|
28
|
+
- State management and UI component helpers
|
|
29
|
+
- Ongoing development and refinement
|
|
41
30
|
|
|
42
|
-
|
|
31
|
+
## Prerequisites
|
|
43
32
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
| `position` | `'bottom-right' \| 'bottom-left' \| 'top-right' \| 'top-left'` | `'bottom-right'` | Position of the floating button |
|
|
48
|
-
| `defaultOpen` | `boolean` | `false` | Whether to start with panel open |
|
|
49
|
-
| `disabled` | `boolean` | `false` | Disable DevTools (e.g., in production) |
|
|
33
|
+
- Node.js 18.17.0 or later
|
|
34
|
+
- React 16.8.0 or later
|
|
35
|
+
- Familiarity with experimental tooling
|
|
50
36
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
```tsx
|
|
54
|
-
<DevTools disabled={process.env.NODE_ENV === 'production'} />
|
|
55
|
-
```
|
|
56
|
-
|
|
57
|
-
### Vanilla JavaScript
|
|
58
|
-
|
|
59
|
-
For non-React applications or more control:
|
|
60
|
-
|
|
61
|
-
```typescript
|
|
62
|
-
import { createDevTools } from '@c15t/dev-tools';
|
|
63
|
-
|
|
64
|
-
const devtools = createDevTools({
|
|
65
|
-
namespace: 'c15tStore',
|
|
66
|
-
position: 'bottom-right',
|
|
67
|
-
});
|
|
68
|
-
|
|
69
|
-
// Control programmatically
|
|
70
|
-
devtools.open();
|
|
71
|
-
devtools.close();
|
|
72
|
-
devtools.toggle();
|
|
73
|
-
|
|
74
|
-
// Cleanup
|
|
75
|
-
devtools.destroy();
|
|
76
|
-
```
|
|
37
|
+
## Manual Installation
|
|
77
38
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
Integrate c15t into TanStack Devtools with the same `render: <Panel />` pattern
|
|
81
|
-
used by the official TanStack plugins:
|
|
82
|
-
|
|
83
|
-
```tsx
|
|
84
|
-
import * as React from 'react';
|
|
85
|
-
import { useRouter } from '@tanstack/react-router';
|
|
86
|
-
import { TanStackDevtools } from '@tanstack/react-devtools';
|
|
87
|
-
import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools';
|
|
88
|
-
import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';
|
|
89
|
-
import { c15tDevtools } from '@c15t/dev-tools/tanstack';
|
|
90
|
-
|
|
91
|
-
export function AppDevtools() {
|
|
92
|
-
const router = useRouter();
|
|
93
|
-
|
|
94
|
-
return (
|
|
95
|
-
<TanStackDevtools
|
|
96
|
-
plugins={[
|
|
97
|
-
{
|
|
98
|
-
name: 'TanStack Query',
|
|
99
|
-
render: <ReactQueryDevtoolsPanel />,
|
|
100
|
-
},
|
|
101
|
-
{
|
|
102
|
-
name: 'TanStack Router',
|
|
103
|
-
render: <TanStackRouterDevtoolsPanel router={router} />,
|
|
104
|
-
},
|
|
105
|
-
c15tDevtools({
|
|
106
|
-
defaultOpen: true,
|
|
107
|
-
}),
|
|
108
|
-
]}
|
|
109
|
-
/>
|
|
110
|
-
);
|
|
111
|
-
}
|
|
112
|
-
```
|
|
113
|
-
|
|
114
|
-
If you want full control over the plugin entry, you can also render the exported
|
|
115
|
-
panel component directly:
|
|
116
|
-
|
|
117
|
-
```tsx
|
|
118
|
-
import { C15tTanStackDevtoolsPanel } from '@c15t/dev-tools/tanstack';
|
|
119
|
-
|
|
120
|
-
<TanStackDevtools
|
|
121
|
-
plugins={[
|
|
122
|
-
{
|
|
123
|
-
id: 'c15t',
|
|
124
|
-
name: 'c15t',
|
|
125
|
-
render: <C15tTanStackDevtoolsPanel namespace="c15tStore" />,
|
|
126
|
-
},
|
|
127
|
-
]}
|
|
128
|
-
/>
|
|
129
|
-
```
|
|
130
|
-
|
|
131
|
-
## Console API
|
|
132
|
-
|
|
133
|
-
The DevTools expose a global API for quick debugging:
|
|
134
|
-
|
|
135
|
-
```javascript
|
|
136
|
-
// Open/close the panel
|
|
137
|
-
window.__c15tDevTools.open();
|
|
138
|
-
window.__c15tDevTools.close();
|
|
139
|
-
window.__c15tDevTools.toggle();
|
|
140
|
-
|
|
141
|
-
// Check state
|
|
142
|
-
window.__c15tDevTools.getState();
|
|
143
|
-
// { isOpen: false, activeTab: 'consents', isConnected: true }
|
|
39
|
+
```bash
|
|
40
|
+
pnpm add @c15t/dev-tools
|
|
144
41
|
```
|
|
145
42
|
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
### Consents
|
|
43
|
+
⚠️ **Note:** This package is experimental and may undergo significant changes.
|
|
149
44
|
|
|
150
|
-
|
|
151
|
-
- Toggle individual consents with immediate feedback
|
|
152
|
-
- Quick actions: Accept All, Reject All
|
|
153
|
-
- Shows consent model (opt-in, opt-out, iab)
|
|
154
|
-
|
|
155
|
-
### Location
|
|
156
|
-
|
|
157
|
-
- Detected country, region, and jurisdiction
|
|
158
|
-
- Compact active policy summary (policy ID + matcher + snapshot status)
|
|
159
|
-
- Set country, region, and language overrides
|
|
160
|
-
- View active consent model with description
|
|
161
|
-
- Clear all overrides
|
|
162
|
-
|
|
163
|
-
### Policy
|
|
45
|
+
## Usage
|
|
164
46
|
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
- i18n profile, expiry, and proof-capture summary
|
|
170
|
-
- Snapshot token presence indicator
|
|
47
|
+
1. 🚧 Explore the dev tools with caution
|
|
48
|
+
2. Import and use components carefully
|
|
49
|
+
3. Expect potential breaking changes
|
|
50
|
+
4. Feedback and contributions welcome!
|
|
171
51
|
|
|
172
|
-
|
|
52
|
+
## Documentation
|
|
173
53
|
|
|
174
|
-
|
|
175
|
-
- Status badges: Loaded, Pending, Blocked
|
|
176
|
-
- Network blocker status
|
|
177
|
-
- Summary of loaded vs pending scripts
|
|
54
|
+
For further information, guides, and examples visit the [reference documentation](https://c15t.com/docs/dev-tools/overview).
|
|
178
55
|
|
|
179
|
-
|
|
56
|
+
## Support
|
|
180
57
|
|
|
181
|
-
-
|
|
182
|
-
- Open
|
|
183
|
-
-
|
|
184
|
-
-
|
|
185
|
-
- Copy state to clipboard for debugging
|
|
58
|
+
- Join our [Discord community](https://c15t.link/discord)
|
|
59
|
+
- Open an issue on our [GitHub repository](https://github.com/c15t/c15t/issues)
|
|
60
|
+
- Visit [inth.com](https://inth.com) and use the chat widget
|
|
61
|
+
- Contact our support team via email [support@inth.com](mailto:support@inth.com)
|
|
186
62
|
|
|
187
|
-
##
|
|
63
|
+
## Contributing
|
|
188
64
|
|
|
189
|
-
|
|
65
|
+
- We're open to all community contributions.
|
|
66
|
+
- Read our [Contribution Guidelines](https://c15t.com/docs/oss/contributing)
|
|
67
|
+
- Review our [Code of Conduct](https://c15t.com/docs/oss/code-of-conduct)
|
|
68
|
+
- Fork the repository
|
|
69
|
+
- Create a new branch for your feature
|
|
70
|
+
- Submit a pull request
|
|
71
|
+
- **All contributions, big or small, are welcome and appreciated.**
|
|
190
72
|
|
|
191
|
-
|
|
192
|
-
/* Override colors */
|
|
193
|
-
:root {
|
|
194
|
-
--c15t-devtools-primary: hsl(220, 90%, 50%);
|
|
195
|
-
--c15t-devtools-surface: hsl(0, 0%, 100%);
|
|
196
|
-
}
|
|
197
|
-
```
|
|
73
|
+
## Security
|
|
198
74
|
|
|
199
|
-
|
|
75
|
+
If you believe you have found a security vulnerability in c15t, we encourage you to **_responsibly disclose this and NOT open a public issue_**. We will investigate all legitimate reports.
|
|
200
76
|
|
|
201
|
-
|
|
202
|
-
- The document has a `.dark` or `.c15t-dark` class
|
|
203
|
-
- System preference is dark (`prefers-color-scheme: dark`)
|
|
77
|
+
Our preference is that you make use of GitHub's private vulnerability reporting feature to disclose potential security vulnerabilities in our open-source software. To do this, please visit [https://github.com/c15t/c15t/security](https://github.com/c15t/c15t/security) and click the "Report a vulnerability" button.
|
|
204
78
|
|
|
205
|
-
|
|
79
|
+
### Security Policy
|
|
206
80
|
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
```
|
|
81
|
+
- Please do not share security vulnerabilities in public forums, issues, or pull requests
|
|
82
|
+
- Provide detailed information about the potential vulnerability
|
|
83
|
+
- Allow reasonable time for us to address the issue before any public disclosure
|
|
84
|
+
- We are committed to addressing security concerns promptly and transparently
|
|
212
85
|
|
|
213
|
-
##
|
|
86
|
+
## License
|
|
214
87
|
|
|
215
|
-
|
|
216
|
-
- Firefox 90+
|
|
217
|
-
- Safari 15+
|
|
218
|
-
- Edge 90+
|
|
88
|
+
[Apache License 2.0](https://github.com/c15t/c15t/blob/main/LICENSE.md)
|
|
219
89
|
|
|
220
|
-
|
|
90
|
+
---
|
|
221
91
|
|
|
222
|
-
|
|
92
|
+
**Built by [Inth](https://inth.com?utm_source=npm&utm_medium=readme&utm_campaign=oss_readme&utm_content=%40c15t%2Fdev-tools)**
|
package/dist/379.js
CHANGED
package/dist/index.cjs
CHANGED
package/dist/react.cjs
CHANGED
package/dist-types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const version = "2.0.
|
|
1
|
+
export declare const version = "2.0.4";
|
package/package.json
CHANGED
|
@@ -1,8 +1,22 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@c15t/dev-tools",
|
|
3
|
-
"version": "2.0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "2.0.4",
|
|
4
|
+
"description": "Developer tools for c15t — React utilities for inspecting consent state, debugging, and dogfooding the SDK.",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"c15t",
|
|
7
|
+
"consent",
|
|
8
|
+
"privacy",
|
|
9
|
+
"developer-tools",
|
|
10
|
+
"devtools",
|
|
11
|
+
"react",
|
|
12
|
+
"gdpr",
|
|
13
|
+
"cmp",
|
|
14
|
+
"debugging"
|
|
15
|
+
],
|
|
5
16
|
"homepage": "https://c15t.com",
|
|
17
|
+
"bugs": {
|
|
18
|
+
"url": "https://github.com/c15t/c15t/issues"
|
|
19
|
+
},
|
|
6
20
|
"repository": {
|
|
7
21
|
"type": "git",
|
|
8
22
|
"url": "https://github.com/c15t/c15t.git",
|
|
@@ -38,7 +52,7 @@
|
|
|
38
52
|
"prebuild": "bunx genversion --esm --semi src/version.ts",
|
|
39
53
|
"build": "bun prebuild && rslib build && bun ../../scripts/normalize-dist-types.mjs",
|
|
40
54
|
"check-types": "bun prebuild && tsc --noEmit",
|
|
41
|
-
"dev": "bun prebuild && rslib build --watch",
|
|
55
|
+
"dev": "sh -c 'bun prebuild && rslib build --no-dts --no-clean && rslib build --watch --no-dts --no-clean'",
|
|
42
56
|
"fmt": "bun biome format --write . && bun biome check --formatter-enabled=false --linter-enabled=false --write",
|
|
43
57
|
"lint": "bun biome lint ./src"
|
|
44
58
|
},
|
|
@@ -53,7 +67,7 @@
|
|
|
53
67
|
"@radix-ui/react-slot": "1.2.4",
|
|
54
68
|
"@radix-ui/react-switch": "1.2.6",
|
|
55
69
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
56
|
-
"c15t": "2.0.
|
|
70
|
+
"c15t": "2.0.4",
|
|
57
71
|
"class-variance-authority": "^0.7.1",
|
|
58
72
|
"lucide-react": "^1.7.0",
|
|
59
73
|
"motion": "^12.38.0",
|