@cofhe/react 0.0.0-alpha-20260420123124 → 0.0.0-alpha-20260526073024

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 CHANGED
@@ -16,7 +16,6 @@ pnpm add @cofhe/react @cofhe/sdk
16
16
 
17
17
  ```tsx
18
18
  import { CofheProvider } from '@cofhe/react';
19
- import '@cofhe/react/styles.css'; // Import component styles
20
19
  import { createCofheClient } from '@cofhe/sdk/web';
21
20
 
22
21
  const client = createCofheClient(config);
@@ -30,10 +29,45 @@ function App() {
30
29
  }
31
30
  ```
32
31
 
32
+ ### Hooks-only usage
33
+
34
+ If you only want hooks/providers and do not want package CSS or UI components, import from the root package only:
35
+
36
+ ```tsx
37
+ import { CofheProvider, useCofheClient } from '@cofhe/react';
38
+
39
+ function App() {
40
+ return (
41
+ <CofheProvider config={config}>
42
+ <YourHookDrivenApp />
43
+ </CofheProvider>
44
+ );
45
+ }
46
+ ```
47
+
48
+ If you do want the styled React UI components, import them from `@cofhe/react/ui`:
49
+
50
+ ```tsx
51
+ import { CofheProvider } from '@cofhe/react';
52
+ import { CofheFloatingButtonWithProvider } from '@cofhe/react/ui';
53
+
54
+ function App() {
55
+ return (
56
+ <CofheProvider config={config}>
57
+ <YourApp />
58
+ <CofheFloatingButtonWithProvider />
59
+ </CofheProvider>
60
+ );
61
+ }
62
+ ```
63
+
64
+ The `@cofhe/react/ui` entrypoint includes the package styles automatically.
65
+
33
66
  ### 2. Use the CofheEncryptInput component
34
67
 
35
68
  ```tsx
36
- import { CofheEncryptInput, FheTypesList } from '@cofhe/react';
69
+ import { FheTypesList } from '@cofhe/react';
70
+ import { CofheEncryptInput } from '@cofhe/react/ui';
37
71
 
38
72
  function MyComponent() {
39
73
  return (
@@ -131,13 +165,13 @@ const {
131
165
 
132
166
  ## Styling
133
167
 
134
- The package includes Tailwind CSS styles. Import them in your app:
168
+ The root `@cofhe/react` entrypoint is headless and does not load package styles.
135
169
 
136
- ```tsx
137
- import '@cofhe/react/styles.css';
138
- ```
170
+ If you import components from `@cofhe/react/ui`, the package styles are loaded automatically.
171
+
172
+ ## Maintainer Notes
139
173
 
140
- If you're using Tailwind CSS in your project, the component classes will work automatically.
174
+ - Query invalidation context and block-hash-aware refetching: [INVALIDATION_CONTEXT.md](./INVALIDATION_CONTEXT.md)
141
175
 
142
176
  ## Dependencies
143
177