docs: update the storage hooks demos

malkiii · Jul 9, 2024 · d00e21f · d00e21f
1 parent 3e6ea86
commit d00e21f
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/packages/hooks/src/useLocalStorage/index.page.jsx b/packages/hooks/src/useLocalStorage/index.page.jsx
@@ -14,9 +14,9 @@ export function Example() {
 
   return (
     <div className="demo">
-      <label className="text-center flex flex-col max-w-md gap-4 mx-auto">
+      <label className="text-center text-balance flex flex-col max-w-md gap-4 mx-auto">
         This input will be saved in the local storage.
-        <input type="text" defaultValue={text} onChange={e => setText(e.target.value)} />
+        <input type="text" value={text} onChange={e => setText(e.target.value)} />
       </label>
     </div>
   );

diff --git a/packages/hooks/src/useScrollDirection/index.page.jsx b/packages/hooks/src/useScrollDirection/index.page.jsx
@@ -20,7 +20,7 @@ export function Navbar() {
         }}
         className="sticky top-0 inset-x-0 transition-all duration-300 bg-primary p-4"
       >
-        <p className="mx-auto w-fit text-slate-50">This will apears scroll up.</p>
+        <p className="mx-auto w-fit text-slate-50">This will apears when you scroll up.</p>
       </div>
       <div className="h-[640px]"></div>
     </div>

diff --git a/packages/hooks/src/useSessionStorage/index.page.jsx b/packages/hooks/src/useSessionStorage/index.page.jsx
@@ -15,9 +15,9 @@ export function Example() {
 
   return (
     <div className="demo">
-      <label className="text-center flex flex-col max-w-md gap-4 mx-auto">
+      <label className="text-center text-balance flex flex-col max-w-md gap-4 mx-auto">
         This input will be saved in the session storage.
-        <input type="text" defaultValue={text} onChange={e => setText(e.target.value)} />
+        <input type="text" value={text} onChange={e => setText(e.target.value)} />
       </label>
     </div>
   );