diff --git a/README.md b/README.md index 2c8335c..dda352e 100755 --- a/README.md +++ b/README.md @@ -16,7 +16,56 @@ Depends on `react` as ## Usage - +```typescript +import React from 'react'; +import { createNextContext, useContextSelector } from 'use-context-next'; +interface AppValue { + firstName: string; + lastName: string; +} + +const defaultValue = { + firstName: 'Ahmed', + lastName: 'Bouhuolia', +}; + +const AppContext = createNextContext(defaultValue); + +const useFirstName = () => + useContextSelector(AppContext, (value) => value.firstName); + +const useLastName = () => + useContextSelector(AppContext, (value) => value.lastName); + +export default function App() { + return ( + + + + ); +} + +function AppContent() { + return ( +
+ + +
+ ); +} + +const AppContentMemo = React.memo(AppContent); + +function FirstName() { + const firstName = useFirstName(); + return {firstName}; +} + +function LastName() { + const lastName = useLastName(); + return {lastName}; +} +``` ## FAQs