Tweak PCUI examples

playcanvas · Feb 4, 2024 · d3024e8 · d3024e8
1 parent 27a815a
commit d3024e8
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/docs/pages/5-examples/5-examples-history.markdown b/docs/pages/5-examples/5-examples-history.markdown
@@ -16,7 +16,7 @@ In this example you can interact with the input slider to update the progress ba
 
 ### Code
 
-```javascript
+```jsx
 import React, { useState } from 'react';
 import ReactDOM from 'react-dom';
 

diff --git a/docs/pages/5-examples/5-examples-todo.markdown b/docs/pages/5-examples/5-examples-todo.markdown
@@ -16,8 +16,7 @@ The todo list below allows you to add items to the list, toggle their 'done' sta
 
 ### Code
 
-```javascript
-
+```jsx
 import React, { useState } from 'react';
 import ReactDOM from 'react-dom';
 import { Observer } from '@playcanvas/observer';
@@ -47,10 +46,9 @@ export const TodoList = (props) => {
         items[key].done = !items[key].done;
         observer.set('items', items);
     };
-    const textInputLink = { observer, path: 'input' };
     return (
         <Container class='todo'>
-            <TextInput blurOnEnter={false} placeholder='enter item' binding={new BindingTwoWay()} link={textInputLink} onChange={addItem}/>
+            <TextInput blurOnEnter={false} placeholder='enter item' binding={new BindingTwoWay()} link={{ observer, path: 'input' }} onChange={addItem}/>
             <SelectInput type="number" options={[{v: 0, t: 'Show all items'}, {v: 1, t: 'Show active items'}, {v: 2, t: 'Show done items'}]} onChange={setListFilter} />
             <Container>
                 {Object.keys(items).map(key => {
@@ -71,5 +69,5 @@ export const TodoList = (props) => {
     );
 };
 
-ReactDOM.render(<Todolist />, document.body);
+ReactDOM.render(<TodoList />, document.body);
 ```