文档更新

Author: liuyun

README.md

@@ -38,7 +38,7 @@ Write local state using [React Hooks](https://reactjs.org/docs/hooks-intro.html)
 
 ```jsx
 import React, { useState } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 // 1️⃣ Create a custom hook as usual
 function useCounter() {
@@ -63,6 +63,14 @@ function Count() {
 }
 
 function App() {
+    // const [inject] = CounterProvider.useProvider();
+
+  // return inject(
+  //   <>
+  //     <Count />
+  //     <Button />
+  //   </>
+  // )
   // 5️⃣ Wrap your components with Provider
   return (
     <CounterProvider>
@@ -79,7 +87,7 @@ function App() {
 
 ```jsx
 import React, { useState, useCallback } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 // 1️⃣ Create a custom hook that receives props
 function useCounter({ initialCount = 0 }) {
@@ -109,6 +117,15 @@ function Count() {
 }
 
 function App() {
+  // const [inject] = CounterProvider.useProvider({initialCount: 10});
+
+  // return inject(
+  //   <>
+  //     <Count />
+  //     <Button />
+  //   </>
+  // )
+
   // 6️⃣ Wrap your components with Provider passing props to your hook
   return (
     <CounterProvider initialCount={10}>
@@ -147,7 +164,7 @@ It's any [custom hook](https://reactjs.org/docs/hooks-custom.html):
 
 ```js
 import { useState } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 const [CountProvider, useCountContext] = constate(() => {
   const [count] = useState(0);
@@ -164,6 +181,12 @@ const [CountProvider, useCountContext] = constate(({ initialCount = 0 }) => {
 });
 
 function App() {
+  // const [inject] = CounterProvider.useProvider({initialCount: 10});
+
+  // return inject(
+  //   ...
+  // )
+
   return (
     <CountProvider initialCount={10}>
       ...
@@ -189,7 +212,7 @@ A `selector` function receives the value returned by [`useValue`](#usevalue) and
 
 ```jsx
 import React, { useState, useCallback } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 function useCounter() {
   const [count, setCount] = useState(0);

examples/counter/App.js

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 // 1️⃣ Create a custom hook as usual
 function useCounter() {
@@ -24,6 +24,14 @@ function Count() {
 }
 
 function App() {
+  // const [inject] = CounterProvider.useProvider();
+  // return inject(
+  //   <>
+  //     <Count />
+  //     <Button />
+  //   </>
+  // );
+
   // 5️⃣ Wrap your components with Provider
   return (
     <CounterProvider>

examples/counter/package.json

@@ -15,7 +15,7 @@
     "build": "parcel build index.html"
   },
   "dependencies": {
-    "constate": "3.2.0",
+    "@liuyunjs/constate": "3.3.0",
     "parcel-bundler": "1.12.4",
     "react": "17.0.1",
     "react-dom": "17.0.1"

examples/i18n/App.js

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 const translations = {
   en: {

examples/i18n/package.json

@@ -16,7 +16,7 @@
     "build": "parcel build index.html"
   },
   "dependencies": {
-    "constate": "3.2.0",
+    "@liuyunjs/constate": "3.3.0",
     "parcel-bundler": "1.12.4",
     "react": "17.0.1",
     "react-dom": "17.0.1"

examples/package.json

@@ -14,7 +14,7 @@
     "react-dom": "17.0.1"
   },
   "alias": {
-    "constate": "../src",
+    "@liuyunjs/constate": "../src",
     "react": "./node_modules/react",
     "react-dom": "./node_modules/react-dom"
   }

examples/theming/App.js

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import { GithubPicker } from "react-color";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 const [ThemeProvider, useThemeContext, useThemeColor] = constate(
   (props) => useState(props.initialColor),

examples/theming/package.json

@@ -16,7 +16,7 @@
     "build": "parcel build index.html"
   },
   "dependencies": {
-    "constate": "3.2.0",
+    "@liuyunjs/constate": "3.3.0",
     "parcel-bundler": "1.12.4",
     "react": "17.0.1",
     "react-color": "2.19.3",

examples/typescript/App.tsx

@@ -1,6 +1,6 @@
 // It just works! No need to type anything explicitly.
 import * as React from "react";
-import constate from "constate";
+import constate from "@liuyunjs/constate";
 
 function useCounter({ initialCount = 0 } = {}) {
   const [count, setCount] = React.useState(initialCount);

examples/typescript/package.json

@@ -17,7 +17,7 @@
   "dependencies": {
     "@types/react": "16.9.53",
     "@types/react-dom": "16.9.8",
-    "constate": "3.2.0",
+    "@liuyunjs/constate": "3.3.0",
     "parcel-bundler": "1.12.4",
     "react": "17.0.1",
     "react-dom": "17.0.1",