import { j as u } from "./index.es37.js";
import { useRef as c, useEffect as n } from "react";
import i from "./index.es70.js";
/* empty css           */
const l = "{lock}", f = "{shift}", m = "default", r = "shift", y = (e) => {
  const t = c(), a = (s) => {
    const o = s === l || s === f;
    o && t.current && t.current.options.layoutName === r ? t.current.setOptions({ layoutName: m }) : o && t.current && t.current.options.layoutName !== r && t.current.setOptions({ layoutName: r });
  };
  return n(() => {
    const { layout: s, onChange: o } = e;
    t.current = new i(`.${e.keyboardClass}`, { ...s, onChange: o, onKeyPress: a }), t.current.setInput(e.value);
  }, []), n(() => {
    t.current && t.current.setInput(e.value);
  }, [e.value]), /* @__PURE__ */ u.jsx("div", { className: e.keyboardClass });
};
y.defaultProps = {
  keyboardClass: "simple-keyboard"
};
export {
  y as default
};
//# sourceMappingURL=index.es7.js.map
