@bigbinary/neeto-molecules 1.0.52 → 1.0.53

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-molecules",
-  "version": "1.0.52",
+  "version": "1.0.53",
   "description": "A package of reusable molecular components for neeto products.",
   "repository": "git@github.com:bigbinary/neeto-molecules.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",

package/types/CopyToClipboardButton.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+/**
+ *
+ * A button that copies the given value to the clipboard.
+ *
+ * @example 
+ *
+ * import CopyToClipboardButton from "@bigbinary/neeto-molecules/CopyToClipboardButton";
+ * 
+ * const CopyToClipboardDemo = ({ value }) => (
+ *   <CopyToClipboardButton label="Copy text" value={value} />
+ * );
+ * @endexample
+*/
+const CopyToClipboardButton: React.FC<{
+  className?: string;
+  icon?: string | any;
+  label?: string;
+  value: string;
+}>;
+export default CopyToClipboardButton;

package/types/KeyboardShortcuts.d.ts

@@ -8,7 +8,7 @@ interface Category {
   [index: string]: Shortcut | string;
   fullShortcutsLink?: string;
 }
-interface ProductShortcuts {
+interface ShortcutsObject {
   [index: string | TFunction]: Category;
 }
 /**
@@ -96,11 +96,48 @@ interface ProductShortcuts {
  *   </>
  * );
  * @endexample
+ * This constant exposes the list of global shortcuts displayed by the pane to the product.
+ *
+ * It will give the following shortcuts:
+ *
+ * @example 
+ *
+ * {
+ *   GLOBAL: {
+ *     openKeyboardShortcutsPane: {
+ *       sequence: "shift+/",
+ *       description: "See keyboard shortcuts",
+ *     },
+ *     close: {
+ *       sequence: "esc",
+ *       description: "Close modals, panes",
+ *     },
+ *     submitForm: {
+ *       sequence: "command+return",
+ *       description: "Submit form or text input",
+ *     },
+ *   },
+ * }
+ * @endexample
+ * It can be used by the product to implement the shortcuts without needing to define the shortcut constant again.
+ *
+ * @example 
+ *
+ * import KeyboardShortcuts from "@bigbinary/neeto-molecules/KeyboardShortcuts";
+ * import { useHotKeys } from "neetocommons/react-utils";
+ * 
+ * useHotKeys(
+ *     KeyboardShortcuts.GLOBAL_SHORTCUTS.GLOBAL.submitForm.sequence,
+ *     keyboardShortCutHandlers.SUBMIT_FORM,
+ *     { mode: "global" }
+ *   );
+ * @endexample
 */
 const KeyboardShortcuts: {
   Pane: React.FC<{
-    productShortcuts?: ProductShortcuts;
+    productShortcuts?: ShortcutsObject;
   }>;
   usePaneState(): [boolean, React.Dispatch<React.SetStateAction<boolean>>];
+  GLOBAL_SHORTCUTS: ShortcutsObject;
 };
 export default KeyboardShortcuts;