docs(codes): Add (key) codes documentation

Create codes documentation for standardized keys.

Closes #218.  Fixes #308.  Ref #21.

1 files changed, 30 insertions, 0 deletions

diff --git a/docs/src/components/codes/ToastyCopyToClipboard.jsx b/docs/src/components/codes/ToastyCopyToClipboard.jsx
new file mode 100644
index 0000000..b0e9809
--- /dev/null
+++ b/docs/src/components/codes/ToastyCopyToClipboard.jsx
@@ -0,0 +1,30 @@
+/*
+ * Copyright (c) 2020 The ZMK Contributors
+ *
+ * SPDX-License-Identifier: CC-BY-NC-SA-4.0
+ */
+
+import React from "react";
+import PropTypes from "prop-types";
+import { toast } from "react-toastify";
+import { CopyToClipboard } from "react-copy-to-clipboard";
+
+export default function ToastyCopyToClipboard({ children, text }) {
+  const notify = () =>
+    toast(
+      <span>
+        📋 Copied <code>{text}</code>
+      </span>
+    );
+  return (
+    <div onClick={notify}>
+      <CopyToClipboard text={text}>{children}</CopyToClipboard>
+    </div>
+  );
+}
+
+ToastyCopyToClipboard.propTypes = {
+  children: PropTypes.oneOfType([PropTypes.element, PropTypes.string])
+    .isRequired,
+  text: PropTypes.string.isRequired,
+};