@bolio-ui/core 1.0.0

package/esm/tooltip/tooltip-content.js

@@ -0,0 +1,83 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _JSXStyle from "../styled-jsx.es.js";
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import useTheme from '../use-theme';
+import usePortal from '../utils/use-portal';
+import useResize from '../utils/use-resize';
+import CssTransition from '../shared/css-transition';
+import useClickAnyWhere from '../utils/use-click-anywhere';
+import { getColors } from './styles';
+import { getPosition, defaultTooltipPosition } from './placement';
+import TooltipIcon from './tooltip-icon';
+import useScale from '../use-scale';
+import { getRect } from './helper';
+import useClasses from '../use-classes';
+
+var TooltipContent = function TooltipContent(_ref) {
+  var children = _ref.children,
+      parent = _ref.parent,
+      visible = _ref.visible,
+      offset = _ref.offset,
+      iconOffset = _ref.iconOffset,
+      placement = _ref.placement,
+      type = _ref.type,
+      className = _ref.className,
+      hideArrow = _ref.hideArrow;
+  var theme = useTheme();
+
+  var _useScale = useScale(),
+      SCALES = _useScale.SCALES;
+
+  var el = usePortal('tooltip');
+  var selfRef = useRef(null);
+
+  var _useState = useState(defaultTooltipPosition),
+      _useState2 = _slicedToArray(_useState, 2),
+      rect = _useState2[0],
+      setRect = _useState2[1];
+
+  var colors = useMemo(function () {
+    return getColors(type, theme.palette);
+  }, [type, theme.palette]);
+  var hasShadow = type === 'default';
+  var classes = useClasses('tooltip-content', className);
+  if (!parent) return null;
+
+  var updateRect = function updateRect() {
+    var position = getPosition(placement, getRect(parent), offset);
+    setRect(position);
+  };
+
+  useResize(updateRect);
+  useClickAnyWhere(function () {
+    return updateRect();
+  });
+  useEffect(function () {
+    updateRect();
+  }, [visible]);
+
+  var preventHandler = function preventHandler(event) {
+    event.stopPropagation();
+    event.nativeEvent.stopImmediatePropagation();
+  };
+
+  if (!el) return null;
+  return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(CssTransition, {
+    visible: visible
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: selfRef,
+    onClick: preventHandler,
+    className: _JSXStyle.dynamic([["3734161695", [iconOffset.x, iconOffset.y, colors.bgColor, rect.top, rect.left, rect.transform, colors.color, theme.layout.radius, hasShadow ? theme.expressiveness.shadowMedium : 'none', SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.font(1), SCALES.pt(0.65), SCALES.pr(0.9), SCALES.pb(0.65), SCALES.pl(0.9)]]]) + " " + (classes || "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["3734161695", [iconOffset.x, iconOffset.y, colors.bgColor, rect.top, rect.left, rect.transform, colors.color, theme.layout.radius, hasShadow ? theme.expressiveness.shadowMedium : 'none', SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.font(1), SCALES.pt(0.65), SCALES.pr(0.9), SCALES.pb(0.65), SCALES.pl(0.9)]]]) + " " + "inner"
+  }, !hideArrow && /*#__PURE__*/React.createElement(TooltipIcon, {
+    placement: placement,
+    shadow: hasShadow
+  }), children), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "3734161695",
+    dynamic: [iconOffset.x, iconOffset.y, colors.bgColor, rect.top, rect.left, rect.transform, colors.color, theme.layout.radius, hasShadow ? theme.expressiveness.shadowMedium : 'none', SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.font(1), SCALES.pt(0.65), SCALES.pr(0.9), SCALES.pb(0.65), SCALES.pl(0.9)]
+  }, ".tooltip-content.__jsx-style-dynamic-selector{--tooltip-icon-offset-x:".concat(iconOffset.x, ";--tooltip-icon-offset-y:").concat(iconOffset.y, ";--tooltip-content-bg:").concat(colors.bgColor, ";box-sizing:border-box;position:absolute;top:").concat(rect.top, ";left:").concat(rect.left, ";-webkit-transform:").concat(rect.transform, ";-ms-transform:").concat(rect.transform, ";transform:").concat(rect.transform, ";background-color:var(--tooltip-content-bg);color:").concat(colors.color, ";border-radius:").concat(theme.layout.radius, ";padding:0;z-index:1000;box-shadow:").concat(hasShadow ? theme.expressiveness.shadowMedium : 'none', ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";}.inner.__jsx-style-dynamic-selector{box-sizing:border-box;position:relative;font-size:").concat(SCALES.font(1), ";padding:").concat(SCALES.pt(0.65), " ").concat(SCALES.pr(0.9), " ").concat(SCALES.pb(0.65), " ").concat(SCALES.pl(0.9), ";height:100%;}")))), el);
+};
+
+export default TooltipContent;

package/esm/tooltip/tooltip-icon.js

@@ -0,0 +1,32 @@
+import _JSXStyle from "../styled-jsx.es.js";
+import React, { useMemo } from 'react';
+import { getIconPosition } from './placement';
+import useTheme from '../use-theme';
+
+var TooltipIcon = function TooltipIcon(_ref) {
+  var placement = _ref.placement,
+      shadow = _ref.shadow;
+  var theme = useTheme();
+
+  var _useMemo = useMemo(function () {
+    return getIconPosition(placement, 'var(--tooltip-icon-offset-x)', 'var(--tooltip-icon-offset-y)');
+  }, [placement]),
+      transform = _useMemo.transform,
+      top = _useMemo.top,
+      left = _useMemo.left,
+      right = _useMemo.right,
+      bottom = _useMemo.bottom;
+
+  var bgColorWithDark = useMemo(function () {
+    if (!shadow || theme.type !== 'dark') return 'var(--tooltip-content-bg)';
+    return theme.palette.accents_2;
+  }, [shadow, theme.type, theme.palette.accents_2]);
+  return /*#__PURE__*/React.createElement("span", {
+    className: _JSXStyle.dynamic([["2440507693", [bgColorWithDark, left, top, right, bottom, transform]]])
+  }, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "2440507693",
+    dynamic: [bgColorWithDark, left, top, right, bottom, transform]
+  }, "span.__jsx-style-dynamic-selector{width:0;height:0;border-style:solid;border-width:6px 7px 6px 0;border-color:transparent ".concat(bgColorWithDark, " transparent transparent;position:absolute;left:").concat(left, ";top:").concat(top, ";right:").concat(right, ";bottom:").concat(bottom, ";-webkit-transform:").concat(transform, ";-ms-transform:").concat(transform, ";transform:").concat(transform, ";}")));
+};
+
+export default TooltipIcon;

package/esm/tooltip/tooltip.js

@@ -0,0 +1,132 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["children", "initialVisible", "text", "offset", "placement", "portalClassName", "enterDelay", "leaveDelay", "trigger", "type", "className", "onVisibleChange", "hideArrow", "visible"];
+import _JSXStyle from "../styled-jsx.es.js";
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import TooltipContent from './tooltip-content';
+import useClickAway from '../utils/use-click-away';
+import { withScale } from '../use-scale';
+import { getRect } from './helper';
+import useClasses from '../use-classes';
+
+function TooltipComponent(_ref) {
+  var children = _ref.children,
+      _ref$initialVisible = _ref.initialVisible,
+      initialVisible = _ref$initialVisible === void 0 ? false : _ref$initialVisible,
+      _ref$text = _ref.text,
+      text = _ref$text === void 0 ? '' : _ref$text,
+      _ref$offset = _ref.offset,
+      offset = _ref$offset === void 0 ? 12 : _ref$offset,
+      _ref$placement = _ref.placement,
+      placement = _ref$placement === void 0 ? 'top' : _ref$placement,
+      _ref$portalClassName = _ref.portalClassName,
+      portalClassName = _ref$portalClassName === void 0 ? '' : _ref$portalClassName,
+      _ref$enterDelay = _ref.enterDelay,
+      enterDelay = _ref$enterDelay === void 0 ? 100 : _ref$enterDelay,
+      _ref$leaveDelay = _ref.leaveDelay,
+      leaveDelay = _ref$leaveDelay === void 0 ? 150 : _ref$leaveDelay,
+      _ref$trigger = _ref.trigger,
+      trigger = _ref$trigger === void 0 ? 'hover' : _ref$trigger,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'default' : _ref$type,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? '' : _ref$className,
+      _ref$onVisibleChange = _ref.onVisibleChange,
+      onVisibleChange = _ref$onVisibleChange === void 0 ? function () {} : _ref$onVisibleChange,
+      _ref$hideArrow = _ref.hideArrow,
+      hideArrow = _ref$hideArrow === void 0 ? false : _ref$hideArrow,
+      customVisible = _ref.visible,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var timer = useRef();
+  var ref = useRef(null);
+
+  var _useState = useState(initialVisible),
+      _useState2 = _slicedToArray(_useState, 2),
+      visible = _useState2[0],
+      setVisible = _useState2[1];
+
+  var iconOffset = useMemo(function () {
+    if (!(ref !== null && ref !== void 0 && ref.current)) return {
+      x: '0.75em',
+      y: '0.75em'
+    };
+    var rect = getRect(ref);
+    return {
+      x: "".concat(rect.width ? rect.width / 2 : 0, "px"),
+      y: "".concat(rect.height ? rect.height / 2 : 0, "px")
+    };
+  }, [ref === null || ref === void 0 ? void 0 : ref.current]);
+  var contentProps = {
+    type: type,
+    visible: visible,
+    offset: offset,
+    placement: placement,
+    hideArrow: hideArrow,
+    iconOffset: iconOffset,
+    parent: ref,
+    className: portalClassName
+  };
+
+  var changeVisible = function changeVisible(nextState) {
+    var clear = function clear() {
+      clearTimeout(timer.current);
+      timer.current = undefined;
+    };
+
+    var handler = function handler(nextState) {
+      setVisible(nextState);
+      onVisibleChange(nextState);
+      clear();
+    };
+
+    clear();
+
+    if (nextState) {
+      timer.current = window.setTimeout(function () {
+        return handler(true);
+      }, enterDelay);
+      return;
+    }
+
+    var leaveDelayWithoutClick = trigger === 'click' ? 0 : leaveDelay;
+    timer.current = window.setTimeout(function () {
+      return handler(false);
+    }, leaveDelayWithoutClick);
+  };
+
+  var mouseEventHandler = function mouseEventHandler(next) {
+    return trigger === 'hover' && changeVisible(next);
+  };
+
+  var clickEventHandler = function clickEventHandler() {
+    return trigger === 'click' && changeVisible(!visible);
+  };
+
+  useClickAway(ref, function () {
+    return trigger === 'click' && changeVisible(false);
+  });
+  useEffect(function () {
+    if (customVisible === undefined) return;
+    changeVisible(customVisible);
+  }, [customVisible]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: ref,
+    onClick: clickEventHandler,
+    onMouseEnter: function onMouseEnter() {
+      return mouseEventHandler(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return mouseEventHandler(false);
+    }
+  }, props, {
+    className: "jsx-418573366" + " " + (props && props.className != null && props.className || useClasses('tooltip', className) || "")
+  }), children, /*#__PURE__*/React.createElement(TooltipContent, contentProps, text), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "418573366"
+  }, ".tooltip.jsx-418573366{width:-webkit-max-content;width:-moz-max-content;width:max-content;display:inline-block;}"));
+}
+
+TooltipComponent.displayName = 'BolioUITooltip';
+var Tooltip = withScale(TooltipComponent);
+export default Tooltip;

package/esm/use-all-themes/all-themes-context.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import Themes from '../themes/themes';
+var defaultAllThemesConfig = {
+  themes: Themes.getPresets()
+};
+export var AllThemesContext = /*#__PURE__*/React.createContext(defaultAllThemesConfig);
+export var useAllThemes = function useAllThemes() {
+  return React.useContext(AllThemesContext);
+};

package/esm/use-all-themes/index.js

@@ -0,0 +1,2 @@
+import { useAllThemes } from './all-themes-context';
+export default useAllThemes;

package/esm/use-body-scroll/index.js

@@ -0,0 +1,2 @@
+import useBodyScroll from './use-body-scroll';
+export default useBodyScroll;

package/esm/use-body-scroll/use-body-scroll.js

@@ -0,0 +1,70 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useEffect, useRef, useState } from 'react';
+var defaultOptions = {
+  scrollLayer: false,
+  delayReset: 0
+};
+var elementStack = new Map();
+
+var getOwnerPaddingRight = function getOwnerPaddingRight(element) {
+  var owner = (element === null || element === void 0 ? void 0 : element.ownerDocument) || document;
+  var view = owner.defaultView || window;
+  return Number.parseInt(view.getComputedStyle(element).paddingRight, 10) || 0;
+};
+
+var getOwnerScrollbarWidth = function getOwnerScrollbarWidth(element) {
+  var doc = (element === null || element === void 0 ? void 0 : element.ownerDocument) || document;
+  return Math.abs(window.innerWidth - doc.documentElement.clientWidth);
+};
+
+function useBodyScroll(elementRef, options) {
+  if (typeof document === 'undefined') return [false, function (t) {
+    return t;
+  }];
+  var elRef = elementRef || useRef(document.body);
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      hidden = _useState2[0],
+      setHidden = _useState2[1];
+
+  var safeOptions = _extends({}, defaultOptions, options || {});
+
+  useEffect(function () {
+    if (!elRef || !elRef.current) return;
+    var lastOverflow = elRef.current.style.overflow;
+
+    if (hidden) {
+      if (elementStack.has(elRef.current)) return;
+      var paddingRight = getOwnerPaddingRight(elRef.current);
+      var scrollbarWidth = getOwnerScrollbarWidth(elRef.current);
+      elementStack.set(elRef.current, {
+        overflow: lastOverflow,
+        paddingRight: elRef.current.style.paddingRight
+      });
+      elRef.current.style.overflow = 'hidden';
+      elRef.current.style.paddingRight = "".concat(paddingRight + scrollbarWidth, "px");
+      return;
+    } // reset element overflow
+
+
+    if (!elementStack.has(elRef.current)) return;
+
+    var reset = function reset(el) {
+      var store = elementStack.get(el);
+      if (!store) return;
+      el.style.overflow = store.overflow;
+      el.style.paddingRight = store.paddingRight;
+      elementStack["delete"](el);
+    };
+
+    var timer = window.setTimeout(function () {
+      reset(elRef.current);
+      window.clearTimeout(timer);
+    }, safeOptions.delayReset);
+  }, [hidden, elRef]);
+  return [hidden, setHidden];
+}
+
+export default useBodyScroll;

package/esm/use-classes/index.js

@@ -0,0 +1,2 @@
+import { default as useClasses } from './use-classes';
+export default useClasses;

package/esm/use-classes/use-classes.js

@@ -0,0 +1,41 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+
+var classObjectToString = function classObjectToString(className) {
+  var keys = Object.keys(className);
+  var len = keys.length;
+  var str = '';
+
+  for (var index = 0; index < len; index++) {
+    var key = keys[index];
+    var val = className[keys[index]];
+    if (!val) continue;
+    str = str ? "".concat(str, " ").concat(String(key)) : String(key);
+  }
+
+  return str;
+};
+
+var isObjectClassName = function isObjectClassName(value) {
+  return _typeof(value) === 'object' && !Array.isArray(value);
+};
+
+var useClasses = function useClasses() {
+  var len = arguments.length;
+  var classes = '';
+  if (len === 0) return classes;
+
+  for (var index = 0; index < len; index++) {
+    var val = index < 0 || arguments.length <= index ? undefined : arguments[index];
+    if (!val) continue;
+
+    if (isObjectClassName(val)) {
+      classes += " ".concat(classObjectToString(val));
+    } else {
+      classes += " ".concat(String(val).trim());
+    }
+  }
+
+  return classes.trim();
+};
+
+export default useClasses;

package/esm/use-click-away/index.js

@@ -0,0 +1,2 @@
+import useClickAway from './use-click-away';
+export default useClickAway;

package/esm/use-click-away/use-click-away.js

@@ -0,0 +1,22 @@
+import { useEffect, useRef } from 'react';
+
+var useClickAway = function useClickAway(ref, handler) {
+  var handlerRef = useRef(handler);
+  useEffect(function () {
+    handlerRef.current = handler;
+  }, [handler]);
+  useEffect(function () {
+    var callback = function callback(event) {
+      var el = ref.current;
+      if (!event || !el || el.contains(event.target)) return;
+      handlerRef.current(event);
+    };
+
+    document.addEventListener('click', callback);
+    return function () {
+      return document.removeEventListener('click', callback);
+    };
+  }, [ref]);
+};
+
+export default useClickAway;

package/esm/use-clipboard/index.js

@@ -0,0 +1,2 @@
+import useClipboard from './use-clipboard';
+export default useClipboard;

package/esm/use-clipboard/use-clipboard.js

@@ -0,0 +1,46 @@
+import usePortal from '../utils/use-portal';
+import useWarning from '../utils/use-warning';
+import { useCallback } from 'react';
+var defaultOptions = {
+  onError: function onError() {
+    return useWarning('Failed to copy.', 'use-clipboard');
+  }
+};
+
+var useClipboard = function useClipboard() {
+  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultOptions;
+  var el = usePortal('clipboard');
+
+  var copyText = function copyText(el, text) {
+    if (!el || !text) return;
+    var selection = window.getSelection();
+    if (!selection) return;
+    el.style.whiteSpace = 'pre';
+    el.textContent = text;
+    var range = window.document.createRange();
+    selection.removeAllRanges();
+    range.selectNode(el);
+    selection.addRange(range);
+
+    try {
+      window.document.execCommand('copy');
+    } catch (e) {
+      options.onError && options.onError();
+    }
+
+    selection.removeAllRanges();
+
+    if (el) {
+      el.textContent = '';
+    }
+  };
+
+  var copy = useCallback(function (text) {
+    copyText(el, text);
+  }, [el]);
+  return {
+    copy: copy
+  };
+};
+
+export default useClipboard;

package/esm/use-current-state/index.js

@@ -0,0 +1,2 @@
+import useCurrentState from './use-current-state';
+export default useCurrentState;

package/esm/use-current-state/use-current-state.js

@@ -0,0 +1,26 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useEffect, useRef, useState } from 'react';
+
+var useCurrentState = function useCurrentState(initialState) {
+  var _useState = useState(function () {
+    return typeof initialState === 'function' ? initialState() : initialState;
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      state = _useState2[0],
+      setState = _useState2[1];
+
+  var ref = useRef(initialState);
+  useEffect(function () {
+    ref.current = state;
+  }, [state]);
+
+  var setValue = function setValue(val) {
+    var result = typeof val === 'function' ? val(ref.current) : val;
+    ref.current = result;
+    setState(result);
+  };
+
+  return [state, setValue, ref];
+};
+
+export default useCurrentState;

package/esm/use-input/index.js

@@ -0,0 +1,2 @@
+import useInput from './use-input';
+export default useInput;

package/esm/use-input/use-input.js

@@ -0,0 +1,32 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import useCurrentState from '../utils/use-current-state';
+
+var useInput = function useInput(initialValue) {
+  var _useCurrentState = useCurrentState(initialValue),
+      _useCurrentState2 = _slicedToArray(_useCurrentState, 3),
+      state = _useCurrentState2[0],
+      setState = _useCurrentState2[1],
+      currentRef = _useCurrentState2[2];
+
+  return {
+    state: state,
+    setState: setState,
+    currentRef: currentRef,
+    reset: function reset() {
+      return setState(initialValue);
+    },
+    bindings: {
+      value: state,
+      onChange: function onChange(event) {
+        if (_typeof(event) === 'object' && event.target) {
+          setState(event.target.value);
+        } else {
+          setState(event);
+        }
+      }
+    }
+  };
+};
+
+export default useInput;

package/esm/use-keyboard/codes.js

@@ -0,0 +1,97 @@
+/**
+ * KeyBinding Codes
+ * The content of this file is based on the design of the open source project "microsoft/vscode",
+ *   Copyright (c) Microsoft Corporation. All rights reserved.
+ *
+ * We inherit the KeyMod values from "microsoft/vscode",
+ * but use the Browser's KeyboardEvent event implementation, and all values are used only as identification.
+ */
+export var KeyCode;
+
+(function (KeyCode) {
+  KeyCode[KeyCode["Unknown"] = 0] = "Unknown";
+  KeyCode[KeyCode["Backspace"] = 8] = "Backspace";
+  KeyCode[KeyCode["Tab"] = 9] = "Tab";
+  KeyCode[KeyCode["Enter"] = 13] = "Enter";
+  KeyCode[KeyCode["Shift"] = 16] = "Shift";
+  KeyCode[KeyCode["Ctrl"] = 17] = "Ctrl";
+  KeyCode[KeyCode["Alt"] = 18] = "Alt";
+  KeyCode[KeyCode["PauseBreak"] = 19] = "PauseBreak";
+  KeyCode[KeyCode["CapsLock"] = 20] = "CapsLock";
+  KeyCode[KeyCode["Escape"] = 27] = "Escape";
+  KeyCode[KeyCode["Space"] = 32] = "Space";
+  KeyCode[KeyCode["PageUp"] = 33] = "PageUp";
+  KeyCode[KeyCode["PageDown"] = 34] = "PageDown";
+  KeyCode[KeyCode["End"] = 35] = "End";
+  KeyCode[KeyCode["Home"] = 36] = "Home";
+  KeyCode[KeyCode["LeftArrow"] = 37] = "LeftArrow";
+  KeyCode[KeyCode["UpArrow"] = 38] = "UpArrow";
+  KeyCode[KeyCode["RightArrow"] = 39] = "RightArrow";
+  KeyCode[KeyCode["DownArrow"] = 40] = "DownArrow";
+  KeyCode[KeyCode["Insert"] = 45] = "Insert";
+  KeyCode[KeyCode["Delete"] = 46] = "Delete";
+  KeyCode[KeyCode["KEY_0"] = 48] = "KEY_0";
+  KeyCode[KeyCode["KEY_1"] = 49] = "KEY_1";
+  KeyCode[KeyCode["KEY_2"] = 50] = "KEY_2";
+  KeyCode[KeyCode["KEY_3"] = 51] = "KEY_3";
+  KeyCode[KeyCode["KEY_4"] = 52] = "KEY_4";
+  KeyCode[KeyCode["KEY_5"] = 53] = "KEY_5";
+  KeyCode[KeyCode["KEY_6"] = 54] = "KEY_6";
+  KeyCode[KeyCode["KEY_7"] = 55] = "KEY_7";
+  KeyCode[KeyCode["KEY_8"] = 56] = "KEY_8";
+  KeyCode[KeyCode["KEY_9"] = 57] = "KEY_9";
+  KeyCode[KeyCode["KEY_A"] = 65] = "KEY_A";
+  KeyCode[KeyCode["KEY_B"] = 66] = "KEY_B";
+  KeyCode[KeyCode["KEY_C"] = 67] = "KEY_C";
+  KeyCode[KeyCode["KEY_D"] = 68] = "KEY_D";
+  KeyCode[KeyCode["KEY_E"] = 69] = "KEY_E";
+  KeyCode[KeyCode["KEY_F"] = 70] = "KEY_F";
+  KeyCode[KeyCode["KEY_G"] = 71] = "KEY_G";
+  KeyCode[KeyCode["KEY_H"] = 72] = "KEY_H";
+  KeyCode[KeyCode["KEY_I"] = 73] = "KEY_I";
+  KeyCode[KeyCode["KEY_J"] = 74] = "KEY_J";
+  KeyCode[KeyCode["KEY_K"] = 75] = "KEY_K";
+  KeyCode[KeyCode["KEY_L"] = 76] = "KEY_L";
+  KeyCode[KeyCode["KEY_M"] = 77] = "KEY_M";
+  KeyCode[KeyCode["KEY_N"] = 78] = "KEY_N";
+  KeyCode[KeyCode["KEY_O"] = 79] = "KEY_O";
+  KeyCode[KeyCode["KEY_P"] = 80] = "KEY_P";
+  KeyCode[KeyCode["KEY_Q"] = 81] = "KEY_Q";
+  KeyCode[KeyCode["KEY_R"] = 82] = "KEY_R";
+  KeyCode[KeyCode["KEY_S"] = 83] = "KEY_S";
+  KeyCode[KeyCode["KEY_T"] = 84] = "KEY_T";
+  KeyCode[KeyCode["KEY_U"] = 85] = "KEY_U";
+  KeyCode[KeyCode["KEY_V"] = 86] = "KEY_V";
+  KeyCode[KeyCode["KEY_W"] = 87] = "KEY_W";
+  KeyCode[KeyCode["KEY_X"] = 88] = "KEY_X";
+  KeyCode[KeyCode["KEY_Y"] = 89] = "KEY_Y";
+  KeyCode[KeyCode["KEY_Z"] = 90] = "KEY_Z";
+  KeyCode[KeyCode["Meta"] = 91] = "Meta";
+  KeyCode[KeyCode["F1"] = 112] = "F1";
+  KeyCode[KeyCode["F2"] = 113] = "F2";
+  KeyCode[KeyCode["F3"] = 114] = "F3";
+  KeyCode[KeyCode["F4"] = 115] = "F4";
+  KeyCode[KeyCode["F5"] = 116] = "F5";
+  KeyCode[KeyCode["F6"] = 117] = "F6";
+  KeyCode[KeyCode["F7"] = 118] = "F7";
+  KeyCode[KeyCode["F8"] = 119] = "F8";
+  KeyCode[KeyCode["F9"] = 120] = "F9";
+  KeyCode[KeyCode["F10"] = 121] = "F10";
+  KeyCode[KeyCode["F11"] = 122] = "F11";
+  KeyCode[KeyCode["F12"] = 123] = "F12";
+  KeyCode[KeyCode["NumLock"] = 144] = "NumLock";
+  KeyCode[KeyCode["ScrollLock"] = 145] = "ScrollLock";
+  KeyCode[KeyCode["Equal"] = 187] = "Equal";
+  KeyCode[KeyCode["Minus"] = 189] = "Minus";
+  KeyCode[KeyCode["Backquote"] = 192] = "Backquote";
+  KeyCode[KeyCode["Backslash"] = 220] = "Backslash";
+})(KeyCode || (KeyCode = {}));
+
+export var KeyMod;
+
+(function (KeyMod) {
+  KeyMod[KeyMod["CtrlCmd"] = 2048] = "CtrlCmd";
+  KeyMod[KeyMod["Shift"] = 1024] = "Shift";
+  KeyMod[KeyMod["Alt"] = 512] = "Alt";
+  KeyMod[KeyMod["WinCtrl"] = 256] = "WinCtrl";
+})(KeyMod || (KeyMod = {}));

package/esm/use-keyboard/helper.js

@@ -0,0 +1,26 @@
+import { isMac } from '../utils/collections';
+import { KeyMod } from './codes';
+/* istanbul ignore next */
+
+export var getCtrlKeysByPlatform = function getCtrlKeysByPlatform() {
+  return {
+    CtrlCmd: isMac() ? 'metaKey' : 'ctrlKey',
+    WinCtrl: isMac() ? 'ctrlKey' : 'metaKey'
+  };
+};
+export var getActiveModMap = function getActiveModMap(bindings) {
+  var modBindings = bindings.filter(function (item) {
+    return !!KeyMod[item];
+  });
+  var activeModMap = {
+    CtrlCmd: false,
+    Shift: false,
+    Alt: false,
+    WinCtrl: false
+  };
+  modBindings.forEach(function (code) {
+    var modKey = KeyMod[code];
+    activeModMap[modKey] = true;
+  });
+  return activeModMap;
+};

package/esm/use-keyboard/index.js

@@ -0,0 +1,4 @@
+import useKeyboard from './use-keyboard';
+import { KeyMod, KeyCode } from './codes';
+export { KeyMod, KeyCode };
+export default useKeyboard;