diff --git a/packages/kitchen-sink/package.json b/packages/kitchen-sink/package.json index 133a6d6f..c1e42d22 100644 --- a/packages/kitchen-sink/package.json +++ b/packages/kitchen-sink/package.json @@ -9,16 +9,15 @@ }, "dependencies": { "@vercel/analytics": "^1.4.0", - "babel-plugin-react-compiler": "19.0.0-beta-a7bf2bd-20241110", "bippy": "^0.0.21", - "react": "19.0.0-rc.1", - "react-dom": "19.0.0-rc.1", + "react": "19.0.0", + "react-dom": "19.0.0", "react-scan": "^0.0.34", - "sugar-high": "^0.7.5", - "vite-plugin-inspect": "^0.8.7" + "sugar-high": "^0.7.5" }, "devDependencies": { "@vitejs/plugin-react": "^4.3.1", - "vite": "^5.4.3" + "vite": "^5.4.3", + "vite-plugin-inspect": "^0.8.7" } } diff --git a/packages/kitchen-sink/src/index.jsx b/packages/kitchen-sink/src/index.jsx index b0a1bfca..aa746b58 100644 --- a/packages/kitchen-sink/src/index.jsx +++ b/packages/kitchen-sink/src/index.jsx @@ -39,16 +39,16 @@ export const App = () => {
{ - if (!value) return; - setTasks([...tasks, value]); + onCreate={(task) => { + if (!task) return; + setTasks([...tasks, task]); }} /> - setTasks(tasks.filter((task) => task !== value)) - } + onDelete={(task) => { + setTasks(tasks.filter((t) => t.id !== task.id)); + }} />
@@ -61,7 +61,7 @@ export const TaskList = ({ tasks, onDelete }) => { return ( ); @@ -71,7 +71,7 @@ export const TaskItem = ({ task, onDelete }) => { const { tooltip } = React.useContext(TooltipContext); return (
  • - {task} + {task.text}
  • ); @@ -83,7 +83,7 @@ export const Text = ({ children }) => { export const Button = ({ onClick, children }) => { return ( - ); @@ -92,21 +92,26 @@ export const Button = ({ onClick, children }) => { export const AddTaskBar = ({ onCreate }) => { const [value, setValue] = useState(''); const [id, setId] = useState(0); + + const handleCreate = () => { + if (value.length === 0) return; + onCreate({ id, text: `${value} (${id})` }); + setValue(''); + setId(id + 1); + }; + return (
    setValue(value)} - onEnter={(value) => { - onCreate(`${value} (${id})`); - setValue(''); - setId(id + 1); + onEnter={() => { + handleCreate(); }} value={value} />