useMapState

import "./styles.css";
import { useMapState } from "rooks";
import { useState } from "react";
 
export default function App() {
  const [
    map,
    { set, setMultiple, has, remove, removeMultiple, removeAll },
  ] = useMapState({ a: 1, b: 2 });
  const [setInputKey, setSetInputKey] = useState("");
  const [setInputValue, setSetInputValue] = useState("");
  const [removeInputKey, setRemoveInputKey] = useState("");
 
  return (
    <div className="App">
      <h1>useMapState CodeSandbox</h1>
 
      <div className="input">
        <input
          value={setInputKey}
          onChange={e => setSetInputKey(e.target.value)}
          placeholder="key"
        />
        <input
          value={setInputValue}
          onChange={e => setSetInputValue(e.target.value)}
          placeholder="value"
        />
        <button onClick={() => set(setInputKey, setInputValue)}>set</button>
      </div>
 
      <div className="input">
        <input
          value={removeInputKey}
          onChange={e => setRemoveInputKey(e.target.value)}
          placeholder="key"
        />
        <button onClick={() => remove(removeInputKey)}>remove</button>
      </div>
 
      {Object.entries(map).map(item => {
        return <div>{item.join(": ")}</div>;
      })}
    </div>
  );
}