@semcore/utils - npm Package Compare versions

Comparing version 3.13.0 to 3.16.0

CHANGELOG.md

@@ -5,2 +5,51 @@ # Changelog
 
+## [3.16.0] - 2020-06-03
+
+### Added
+
+- Добавлена проверка `children` свойств на одиночных тегах в `propsForElement`
+- функцию `i18nEnhance` для работы с переводами
+
+## [3.15.4] - 2020-06-01
+
+### Fixed
+
+- Добавлен tabIndex по умолчанию для `keyboardFocusEnhance`
+
+## [3.15.3] - 2020-05-29
+
+### Fixed
+
+- В `logger` убрано обращение к window, так как возможен запуск на сервере
+
+### Changed
+
+- `injectStyle` не вставляет одинаковые стили два раза
+
+## [3.15.1] - 2020-05-19
+
+### Fixed
+
+- `useForkRef` теперь возвращает memo функцию, а не ref
+- Убрана ошибка в `autoFocusEnhance` при исчезновении ноды
+
+## [3.15.0] - 2020-04-27
+
+### Added
+
+- Функция `addonTextChildren` теперь может принимать массив `Addon-ов`.
+
+## [3.14.1] - 2020-04-24
+
+### Added
+
+- Добавлена функция `getNodeByRef` для получения dom node из ref-а.
+- Добавлена функция `findComponent` для поиска компонентов в `Children`.
+
+## [3.13.2] - 2020-04-16
+
+### Fixed
+
+- Добавлено описание интерфейса `autoFocusEnhance`
+
 ## [3.13.0] - 2020-04-10
@@ -10,3 +59,3 @@
 
-- Добавлено описание интерфеса `autoFocusEnhance`
+- Добавлена функция `getOriginChildren` для поиска оригинального children.
 
@@ -13,0 +62,0 @@ ## [3.12.1] - 2020-04-03

lib/addonTextChildren.d.ts

 /// <reference types="react" />
 import React from 'react';
-declare function addonTextChildren(Children: any, Text: React.ComponentType, Addon: React.ComponentType): any;
+declare function addonTextChildren(Children: any, Text: React.ComponentType, Addon: React.ComponentType | React.ComponentType[]): any;
 export { addonTextChildren as default };

lib/addonTextChildren.js

@@ -8,2 +8,4 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
 var _react = _interopRequireDefault(require("react"));
@@ -13,8 +15,12 @@
 
+var _getOriginChildren = _interopRequireDefault(require("./getOriginChildren"));
+
 function addonTextChildren(Children, Text, Addon) {
-  if (typeof Children.origin === 'function') {
+  var children = (0, _getOriginChildren["default"])(Children);
+
+  if (typeof children === 'function') {
     return _react["default"].createElement(Children, null);
   }
 
-  return _react["default"].Children.toArray(Children.origin).some(function (element) {
+  return _react["default"].Children.toArray(children).some(function (element) {
     if (!_react["default"].isValidElement(element)) return false;
@@ -35,3 +41,8 @@ if (element.type === _react["default"].Fragment) return true;
     var inheritedNames = element.type[_core.INHERITED_NAME] || [element.type.displayName];
-    return inheritedNames.includes(Text.displayName) || inheritedNames.includes(Addon.displayName);
+    var addonNames = Array.isArray(Addon) ? Addon.map(function (Component) {
+      return Component.displayName;
+    }) : [Addon.displayName];
+    return [Text.displayName].concat((0, _toConsumableArray2["default"])(addonNames)).find(function (name) {
+      return inheritedNames.includes(name);
+    });
   }) ? _react["default"].createElement(Children, null) : _react["default"].createElement(Text, null, _react["default"].createElement(Children, null));
@@ -38,0 +49,0 @@ }

lib/assignProps.js

@@ -59,6 +59,3 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
   if (source.ref) {
-    newProps.ref = function (ref) {
-      (0, _ref.setRef)(source.ref, ref);
-      (0, _ref.setRef)(props.ref, ref);
-    };
+    newProps.ref = (0, _ref.forkRef)(source.ref, props.ref);
   }
@@ -65,0 +62,0 @@

lib/createHoc.js

@@ -36,31 +36,37 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
     return function (WrappedComponent) {
-      var Component = /*#__PURE__*/function (_PureComponent) {
-        (0, _inherits2["default"])(Component, _PureComponent);
+      var Component =
+      /** @class */
+      function () {
+        var Component = /*#__PURE__*/function (_PureComponent) {
+          (0, _inherits2["default"])(Component, _PureComponent);
 
-        var _super = _createSuper(Component);
+          var _super = _createSuper(Component);
 
-        function Component() {
-          (0, _classCallCheck2["default"])(this, Component);
-          return _super.apply(this, arguments);
-        }
+          function Component() {
+            (0, _classCallCheck2["default"])(this, Component);
+            return _super.apply(this, arguments);
+          }
 
-        (0, _createClass2["default"])(Component, [{
-          key: "render",
-          value: function render() {
-            // @ts-ignore
-            var _this$props = this.props,
-                forwardedRef = _this$props.forwardedRef,
-                others = (0, _objectWithoutProperties2["default"])(_this$props, ["forwardedRef"]);
-            return _react["default"].createElement(EnhancedComponent, Object.assign({}, options, this.props), function (enhancedComponentProps) {
-              return _react["default"].createElement(WrappedComponent, Object.assign({
-                forwardedRef: forwardedRef
-              }, others, enhancedComponentProps));
-            });
-          }
-        }]);
+          (0, _createClass2["default"])(Component, [{
+            key: "render",
+            value: function render() {
+              // @ts-ignore
+              var _this$props = this.props,
+                  forwardedRef = _this$props.forwardedRef,
+                  others = (0, _objectWithoutProperties2["default"])(_this$props, ["forwardedRef"]);
+              return _react["default"].createElement(EnhancedComponent, Object.assign({}, options, this.props), function (enhancedComponentProps) {
+                return _react["default"].createElement(WrappedComponent, Object.assign({
+                  forwardedRef: forwardedRef
+                }, others, enhancedComponentProps));
+              });
+            }
+          }]);
+          return Component;
+        }(_react.PureComponent);
+
+        Component.displayName = (0, _getDisplayName["default"])(WrappedComponent);
+        Component.defaultProps = WrappedComponent.defaultProps || {};
         return Component;
-      }(_react.PureComponent);
+      }();
 
-      Component.displayName = (0, _getDisplayName["default"])(WrappedComponent);
-      Component.defaultProps = WrappedComponent.defaultProps || {};
       return (0, _hoistNonReactStatics["default"])(Component, WrappedComponent);
@@ -67,0 +73,0 @@ };

lib/enhances/autoFocusEnhance.d.ts

 interface IWithAutoFocusEnhanceProps {
+    /** Нативный автофокус, но с поддержкой внутри модальных окон, так же можно передать количество ms до срабатывания фокуса */
     autoFocus?: Boolean | Number;
@@ -3,0 +4,0 @@ }

lib/enhances/autoFocusEnhance.js

@@ -42,3 +42,5 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
       var timer = setTimeout(function () {
-        return nodeRef.current.focus();
+        var _nodeRef$current;
+
+        return (_nodeRef$current = nodeRef.current) === null || _nodeRef$current === void 0 ? void 0 : _nodeRef$current.focus();
       }, autoFocus || 0);
@@ -45,0 +47,0 @@ return function () {

lib/enhances/keyboardFocusEnhance.js

@@ -22,3 +22,4 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
   return function (props) {
-    var tabIndex = props.tabIndex,
+    var _props$tabIndex = props.tabIndex,
+        tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex,
         disabled = props.disabled;
@@ -25,0 +26,0 @@

lib/enhances/WithAutoFocus.js

@@ -28,58 +28,63 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var EnhancedWithAutoFocus = /*#__PURE__*/function (_PureComponent) {
-  (0, _inherits2["default"])(EnhancedWithAutoFocus, _PureComponent);
+var EnhancedWithAutoFocus =
+/** @class */
+function () {
+  var EnhancedWithAutoFocus = /*#__PURE__*/function (_PureComponent) {
+    (0, _inherits2["default"])(EnhancedWithAutoFocus, _PureComponent);
 
-  var _super = _createSuper(EnhancedWithAutoFocus);
+    var _super = _createSuper(EnhancedWithAutoFocus);
 
-  function EnhancedWithAutoFocus() {
-    (0, _classCallCheck2["default"])(this, EnhancedWithAutoFocus);
-    return _super.apply(this, arguments);
-  }
+    function EnhancedWithAutoFocus() {
+      (0, _classCallCheck2["default"])(this, EnhancedWithAutoFocus);
+      return _super.apply(this, arguments);
+    }
 
-  (0, _createClass2["default"])(EnhancedWithAutoFocus, [{
-    key: "notUsingNativeAutoFocus",
-    value: function notUsingNativeAutoFocus() {
-      var autoFocus = this.props.autoFocus;
-      return typeof autoFocus === 'boolean' || typeof autoFocus === 'number';
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      if (this.notUsingNativeAutoFocus()) {
+    (0, _createClass2["default"])(EnhancedWithAutoFocus, [{
+      key: "notUsingNativeAutoFocus",
+      value: function notUsingNativeAutoFocus() {
         var autoFocus = this.props.autoFocus;
-        if (autoFocus === false) return;
-        var node = (0, _reactDom.findDOMNode)(this);
-        if (!node) return; //@ts-ignore
+        return typeof autoFocus === 'boolean' || typeof autoFocus === 'number';
+      }
+    }, {
+      key: "componentDidMount",
+      value: function componentDidMount() {
+        if (this.notUsingNativeAutoFocus()) {
+          var autoFocus = this.props.autoFocus;
+          if (autoFocus === false) return;
+          var node = (0, _reactDom.findDOMNode)(this);
+          if (!node) return; //@ts-ignore
 
-        this.timer = setTimeout(function () {
-          return node.focus();
-        }, autoFocus || 0);
+          this.timer = setTimeout(function () {
+            return node.focus();
+          }, autoFocus || 0);
+        }
       }
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      clearTimeout(this.timer);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var children = this.props.children;
-      var props = {};
+    }, {
+      key: "componentWillUnmount",
+      value: function componentWillUnmount() {
+        clearTimeout(this.timer);
+      }
+    }, {
+      key: "render",
+      value: function render() {
+        var children = this.props.children;
+        var props = {};
 
-      if (this.notUsingNativeAutoFocus()) {
-        props.autoFocus = undefined;
+        if (this.notUsingNativeAutoFocus()) {
+          props.autoFocus = undefined;
+        }
+
+        return children(props);
       }
+    }]);
+    return EnhancedWithAutoFocus;
+  }(_react.PureComponent);
 
-      return children(props);
-    }
-  }]);
+  EnhancedWithAutoFocus.displayName = 'EnhancedWithAutoFocus';
+  EnhancedWithAutoFocus.defaultProps = {
+    autoFocus: undefined
+  };
   return EnhancedWithAutoFocus;
-}(_react.PureComponent);
+}();
 
-EnhancedWithAutoFocus.displayName = 'EnhancedWithAutoFocus';
-EnhancedWithAutoFocus.defaultProps = {
-  autoFocus: undefined
-};
-
 var _default = (0, _createHoc["default"])(EnhancedWithAutoFocus);
@@ -86,0 +91,0 @@

lib/enhances/WithCSS.js

@@ -67,48 +67,54 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 
-var EnhancedWithCSS = /*#__PURE__*/function (_PureComponent) {
-  (0, _inherits2["default"])(EnhancedWithCSS, _PureComponent);
+var EnhancedWithCSS =
+/** @class */
+function () {
+  var EnhancedWithCSS = /*#__PURE__*/function (_PureComponent) {
+    (0, _inherits2["default"])(EnhancedWithCSS, _PureComponent);
 
-  var _super = _createSuper(EnhancedWithCSS);
+    var _super = _createSuper(EnhancedWithCSS);
 
-  function EnhancedWithCSS(props, context) {
-    var _this;
+    function EnhancedWithCSS(props, context) {
+      var _this;
 
-    (0, _classCallCheck2["default"])(this, EnhancedWithCSS);
-    _this = _super.call(this, props, context);
-    _this.state = {
-      dynamicClassName: ''
-    };
-    initNanoCss(context);
-    return _this;
-  }
-
-  (0, _createClass2["default"])(EnhancedWithCSS, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          _this$props$className = _this$props.className,
-          className = _this$props$className === void 0 ? '' : _this$props$className;
-      var dynamicClassName = this.state.dynamicClassName;
-      return children({
-        className: className + dynamicClassName || undefined
-      });
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(props) {
-      var cleanCss = normaliseCss(props.css);
-      return {
-        dynamicClassName: Object.keys(cleanCss).length ? (0, _CSSinJS["default"])().cache(cleanCss) : ''
+      (0, _classCallCheck2["default"])(this, EnhancedWithCSS);
+      _this = _super.call(this, props, context);
+      _this.state = {
+        dynamicClassName: ''
       };
+      initNanoCss(context);
+      return _this;
     }
-  }]);
+
+    (0, _createClass2["default"])(EnhancedWithCSS, [{
+      key: "render",
+      value: function render() {
+        var _this$props = this.props,
+            children = _this$props.children,
+            _this$props$className = _this$props.className,
+            className = _this$props$className === void 0 ? '' : _this$props$className;
+        var dynamicClassName = this.state.dynamicClassName;
+        return children({
+          className: className + dynamicClassName || undefined
+        });
+      }
+    }], [{
+      key: "getDerivedStateFromProps",
+      value: function getDerivedStateFromProps(props) {
+        var cleanCss = normaliseCss(props.css);
+        return {
+          dynamicClassName: Object.keys(cleanCss).length ? (0, _CSSinJS["default"])().cache(cleanCss) : ''
+        };
+      }
+    }]);
+    return EnhancedWithCSS;
+  }(_react.PureComponent);
+
+  EnhancedWithCSS.contextType = WithCssContext;
+  EnhancedWithCSS.defaultProps = {
+    css: {}
+  };
   return EnhancedWithCSS;
-}(_react.PureComponent);
+}();
 
 exports.EnhancedWithCSS = EnhancedWithCSS;
-EnhancedWithCSS.contextType = WithCssContext;
-EnhancedWithCSS.defaultProps = {
-  css: {}
-};
 
@@ -115,0 +121,0 @@ var _default = (0, _createHoc["default"])(EnhancedWithCSS);

lib/enhances/WithI18n.d.ts

@@ -11,4 +11,5 @@ /// <reference types="react" />
 };
+declare const Context: React.Context<LocaleKeys>;
 declare const I18nProvider: React.Provider<LocaleKeys>, I18nConsumer: React.Consumer<LocaleKeys>;
-declare function getText(dictionaries: Dictionary, locale: LocaleKeys): (key: React.ReactText) => string;
+declare function getText(dictionaries: Dictionary, locale: LocaleKeys): (key: keyof DictionaryItem) => string;
 interface IWithI18nInjectedProps {
@@ -30,4 +31,4 @@ getText: WithI18n['getText'];
 }
-declare const useI18n: (dictionary: Dictionary, locale?: LocaleKeys) => (key: React.ReactText) => string;
+declare const useI18n: (dictionary: Dictionary, locale?: LocaleKeys) => (key: keyof DictionaryItem) => string;
 declare const _default: (options?: {}) => (WrappedComponent: any) => any;
-export { _default as default, LocaleKeys, DictionaryItem, Dictionary, IWithI18nInjectedProps, IWithI18nProps, useI18n, I18nProvider, I18nConsumer };
+export { _default as default, LocaleKeys, DictionaryItem, Dictionary, Context, IWithI18nInjectedProps, IWithI18nProps, useI18n, I18nProvider, I18nConsumer };

lib/enhances/WithI18n.js

@@ -6,3 +6,3 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 });
-exports.I18nConsumer = exports.I18nProvider = exports.useI18n = exports["default"] = void 0;
+exports.I18nConsumer = exports.I18nProvider = exports.useI18n = exports["default"] = exports.Context = void 0;
 
@@ -28,2 +28,3 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var Context = (0, _react.createContext)('en');
+exports.Context = Context;
 var I18nProvider = Context.Provider,
@@ -41,41 +42,46 @@ I18nConsumer = Context.Consumer;
 
-var WithI18n = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(WithI18n, _Component);
+var WithI18n =
+/** @class */
+function () {
+  var WithI18n = /*#__PURE__*/function (_Component) {
+    (0, _inherits2["default"])(WithI18n, _Component);
 
-  var _super = _createSuper(WithI18n);
+    var _super = _createSuper(WithI18n);
 
-  function WithI18n() {
-    var _this;
+    function WithI18n() {
+      var _this;
 
-    (0, _classCallCheck2["default"])(this, WithI18n);
-    _this = _super.apply(this, arguments);
+      (0, _classCallCheck2["default"])(this, WithI18n);
+      _this = _super.apply(this, arguments);
 
-    _this.getText = function (dictionary, selfLocale) {
-      var _this$props = _this.props,
-          locale = _this$props.locale,
-          getText = _this$props.getText;
-      var contextLocale = _this.context;
-      return getText(dictionary, selfLocale || locale || contextLocale);
-    };
+      _this.getText = function (dictionary, selfLocale) {
+        var _this$props = _this.props,
+            locale = _this$props.locale,
+            getText = _this$props.getText;
+        var contextLocale = _this.context;
+        return getText(dictionary, selfLocale || locale || contextLocale);
+      };
 
-    return _this;
-  }
+      return _this;
+    }
 
-  (0, _createClass2["default"])(WithI18n, [{
-    key: "render",
-    value: function render() {
-      var children = this.props.children;
-      return children({
-        getText: this.getText
-      });
-    }
-  }]);
+    (0, _createClass2["default"])(WithI18n, [{
+      key: "render",
+      value: function render() {
+        var children = this.props.children;
+        return children({
+          getText: this.getText
+        });
+      }
+    }]);
+    return WithI18n;
+  }(_react.Component);
+
+  WithI18n.contextType = Context;
+  WithI18n.defaultProps = {
+    getText: getText
+  };
   return WithI18n;
-}(_react.Component);
+}();
 
-WithI18n.contextType = Context;
-WithI18n.defaultProps = {
-  getText: getText
-};
-
 var useI18n = function useI18n(dictionary) {
@@ -82,0 +88,0 @@ var locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'en';

lib/enhances/WithKeyboardFocus.js

@@ -34,83 +34,89 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var EnhancedWithKeyboardFocus = /*#__PURE__*/function (_PureComponent) {
-  (0, _inherits2["default"])(EnhancedWithKeyboardFocus, _PureComponent);
+var EnhancedWithKeyboardFocus =
+/** @class */
+function () {
+  var EnhancedWithKeyboardFocus = /*#__PURE__*/function (_PureComponent) {
+    (0, _inherits2["default"])(EnhancedWithKeyboardFocus, _PureComponent);
 
-  var _super = _createSuper(EnhancedWithKeyboardFocus);
+    var _super = _createSuper(EnhancedWithKeyboardFocus);
 
-  function EnhancedWithKeyboardFocus() {
-    var _this;
+    function EnhancedWithKeyboardFocus() {
+      var _this;
 
-    (0, _classCallCheck2["default"])(this, EnhancedWithKeyboardFocus);
-    _this = _super.apply(this, arguments);
-    _this.state = {
-      keyboardFocused: false
-    };
+      (0, _classCallCheck2["default"])(this, EnhancedWithKeyboardFocus);
+      _this = _super.apply(this, arguments);
+      _this.state = {
+        keyboardFocused: false
+      };
 
-    _this.handlerFocus = function (e) {
-      (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onFocus', e);
+      _this.handlerFocus = function (e) {
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onFocus', e);
 
-      if (usingKeyBoard) {
+        if (usingKeyBoard) {
+          (0, _uncontroll.internalSetState)((0, _assertThisInitialized2["default"])(_this), {
+            keyboardFocused: true
+          });
+        }
+      };
+
+      _this.handlerBlur = function (e) {
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onBlur', e);
         (0, _uncontroll.internalSetState)((0, _assertThisInitialized2["default"])(_this), {
-          keyboardFocused: true
+          keyboardFocused: false
         });
-      }
-    };
+      };
 
-    _this.handlerBlur = function (e) {
-      (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onBlur', e);
-      (0, _uncontroll.internalSetState)((0, _assertThisInitialized2["default"])(_this), {
-        keyboardFocused: false
-      });
-    };
+      _this.handlerKeyDown = function (e) {
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onKeyDown', e);
+        usingKeyBoard = true;
+      };
 
-    _this.handlerKeyDown = function (e) {
-      (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onKeyDown', e);
-      usingKeyBoard = true;
-    };
+      _this.handlerMouseDown = function (e) {
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onMouseDown', e);
+        usingKeyBoard = false;
+      };
 
-    _this.handlerMouseDown = function (e) {
-      (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onMouseDown', e);
-      usingKeyBoard = false;
-    };
+      return _this;
+    }
 
-    return _this;
-  }
+    (0, _createClass2["default"])(EnhancedWithKeyboardFocus, [{
+      key: "render",
+      value: function render() {
+        var _this$props = this.props,
+            children = _this$props.children,
+            tabIndex = _this$props.tabIndex,
+            disabled = _this$props.disabled;
+        var keyboardFocused = this.state.keyboardFocused;
+        return children({
+          tabIndex: disabled ? -1 : tabIndex,
+          keyboardFocused: keyboardFocused,
+          onFocus: this.handlerFocus,
+          onBlur: this.handlerBlur,
+          onKeyDown: this.handlerKeyDown,
+          onMouseDown: this.handlerMouseDown
+        });
+      }
+    }], [{
+      key: "getDerivedStateFromProps",
+      value: function getDerivedStateFromProps(props, state) {
+        if (props.keyboardFocused !== undefined) {
+          return {
+            keyboardFocused: props.keyboardFocused
+          };
+        }
 
-  (0, _createClass2["default"])(EnhancedWithKeyboardFocus, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          tabIndex = _this$props.tabIndex,
-          disabled = _this$props.disabled;
-      var keyboardFocused = this.state.keyboardFocused;
-      return children({
-        tabIndex: disabled ? -1 : tabIndex,
-        keyboardFocused: keyboardFocused,
-        onFocus: this.handlerFocus,
-        onBlur: this.handlerBlur,
-        onKeyDown: this.handlerKeyDown,
-        onMouseDown: this.handlerMouseDown
-      });
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(props, state) {
-      if (props.keyboardFocused !== undefined) {
-        return {
-          keyboardFocused: props.keyboardFocused
-        };
+        return state;
       }
+    }]);
+    return EnhancedWithKeyboardFocus;
+  }(_react.PureComponent);
 
-      return state;
-    }
-  }]);
+  EnhancedWithKeyboardFocus.displayName = 'EnhancedWithKeyboardFocus';
+  EnhancedWithKeyboardFocus.defaultProps = {
+    tabIndex: 0
+  };
   return EnhancedWithKeyboardFocus;
-}(_react.PureComponent);
+}();
 
 exports.EnhancedWithKeyboardFocus = EnhancedWithKeyboardFocus;
-EnhancedWithKeyboardFocus.displayName = 'EnhancedWithKeyboardFocus';
-EnhancedWithKeyboardFocus.defaultProps = {
-  tabIndex: 0
-};
 
@@ -117,0 +123,0 @@ var _default = (0, _createHoc["default"])(EnhancedWithKeyboardFocus);

lib/injectStyle.js

@@ -15,2 +15,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+function hashCode(str) {
+  var hash = 0,
+      i,
+      chr;
+
+  for (i = 0; i < str.length; i++) {
+    chr = str.charCodeAt(i);
+    hash = (hash << 5) - hash + chr;
+    hash |= 0; // Convert to 32bit integer
+  }
+
+  return hash;
+}
+
 function injectStyle(css) {
@@ -25,3 +39,3 @@ if ((typeof window === "undefined" ? "undefined" : (0, _typeof2["default"])(window)) === 'object') {
         // @ts-ignore
-        var version = "3.13.0";
+        var version = "3.16.0";
         sh = document.createElement('style');
@@ -34,3 +48,8 @@ sh.setAttribute('data-ui-v', version);
 
-    sh.insertAdjacentText('beforeend', css);
+    var hash = Math.abs(hashCode(css));
+
+    if (!sh.dataset[hash]) {
+      sh.dataset[hash] = true;
+      sh.insertAdjacentText('beforeend', css);
+    }
   }
@@ -37,0 +56,0 @@ }

lib/logger.js

@@ -17,3 +17,5 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
     (0, _classCallCheck2["default"])(this, Logger);
-    this.logger = logger;
+    this.logger = logger || {
+      warn: function warn() {}
+    };
   }
@@ -41,5 +43,5 @@
 
-var _default = new Logger(window.console);
+var _default = new Logger(console);
 
 exports["default"] = _default;
 //# sourceMappingURL=logger.js.map

lib/propsForElement.js

@@ -42,2 +42,21 @@ Object.defineProperty(exports, "__esModule", {
 exports.validAttr = validAttr;
+var omittedCloseTags = {
+  area: true,
+  base: true,
+  br: true,
+  col: true,
+  embed: true,
+  hr: true,
+  img: true,
+  input: true,
+  keygen: true,
+  link: true,
+  meta: true,
+  param: true,
+  source: true,
+  track: true,
+  wbr: true,
+  // because Children default value [Object object]
+  textarea: true
+};
 
@@ -49,3 +68,4 @@ function propsForElement(props, element) {
     return Object.keys(props).reduce(function (acc, propName) {
-      if (validAttr(propName)) {
+      // @ts-ignore
+      if (validAttr(propName) && !(omittedCloseTags[element] && propName === 'children')) {
         acc[propName] = props[propName];
@@ -52,0 +72,0 @@ }

lib/ref.d.ts

@@ -1,5 +0,8 @@
-import { Ref } from 'react';
+import { MutableRefObject, Ref, RefObject } from 'react';
 declare function setRef<T>(ref: Ref<T>, value: T): void;
+declare function useCallbackRef<T>(initialValue: T | null, callback: (newValue: T | null, lastValue: T | null) => void): MutableRefObject<T | null>;
 declare function useForkRef<T>(...refs: any[]): Ref<T>;
 declare function forkRef<T>(...refs: any[]): Ref<T>;
-export { setRef, useForkRef, forkRef };
+type NodeByRef = RefObject<HTMLElement> | HTMLElement | (() => RefObject<HTMLElement> | HTMLElement);
+declare function getNodeByRef(ref: NodeByRef): HTMLElement;
+export { setRef, useCallbackRef, useForkRef, forkRef, NodeByRef, getNodeByRef };

lib/ref.js

@@ -7,7 +7,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.setRef = setRef;
+exports.useCallbackRef = useCallbackRef;
 exports.useForkRef = useForkRef;
 exports.forkRef = forkRef;
+exports.getNodeByRef = getNodeByRef;
 
-var _react = _interopRequireDefault(require("react"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _react = require("react");
+
+var _reactDom = require("react-dom");
+
 function setRef(ref, value) {
@@ -22,2 +28,35 @@ if (typeof ref === 'function') {
 
+function useCallbackRef(initialValue, callback) {
+  var _useState = (0, _react.useState)(function () {
+    return {
+      // value
+      value: initialValue,
+      // last callback
+      callback: callback,
+      // "memoized" public interface
+      facade: {
+        get current() {
+          return ref.value;
+        },
+
+        set current(value) {
+          var last = ref.value;
+
+          if (last !== value) {
+            ref.value = value;
+            ref.callback(value, last);
+          }
+        }
+
+      }
+    };
+  }),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 1),
+      ref = _useState2[0]; // update callback
+
+
+  ref.callback = callback;
+  return ref.facade;
+}
+
 function useForkRef() {
@@ -28,4 +67,6 @@ for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
 
-  return _react["default"].useMemo(function () {
-    return forkRef.apply(void 0, refs);
+  return (0, _react.useCallback)(function (refValue) {
+    refs.forEach(function (ref) {
+      return setRef(ref, refValue);
+    });
   }, refs);
@@ -51,2 +92,14 @@ }
 }
+
+function getNodeByRef(ref) {
+  if (typeof ref === 'function') {
+    ref = ref();
+  }
+
+  if (!ref) return null;
+  var node = 'current' in ref ? ref.current : ref;
+  if (!node) return null;
+  if (node.nodeType === 1) return node;
+  return (0, _reactDom.findDOMNode)(node);
+}
 //# sourceMappingURL=ref.js.map

lib/use/useCss.d.ts

 import { CssLikeObject } from 'nano-css/types/common';
 type IUseCssArg = CssLikeObject;
-declare const useCss: (css?: CssLikeObject) => string;
+declare const useCss: (css?: IUseCssArg) => string;
 export { useCss as default, IUseCssArg };

lib/use/useEnhancedEffect.d.ts

 /// <reference types="react" />
 import React from 'react';
-declare const useEnhancedEffect: typeof React.useLayoutEffect;
+declare const useEnhancedEffect: typeof React.useEffect;
 export { useEnhancedEffect as default };

package.json

 {
   "name": "@semcore/utils",
   "description": "SEMRush Utils Component",
-  "version": "3.13.0",
+  "version": "3.16.0",
   "author": "Roman Lysov <[e-mail]>",
@@ -12,6 +12,6 @@ "license": "MIT",
   "devDependencies": {
-    "@semcore/core": "^0.0.1-4"
+    "@semcore/core": "^1"
   },
   "dependencies": {
-    "@babel/runtime": "^7.9",
+    "@babel/runtime": "^7.10",
     "@types/react": "^16.9",
@@ -25,3 +25,3 @@ "classnames": "^2.2",
     "react-dom": "^16.8",
-    "@semcore/core": "^0.0.1-4"
+    "@semcore/core": "^1"
   },
@@ -28,0 +28,0 @@ "jest": {

src/assignProps.ts

@@ -1,5 +0,4 @@
-/* eslint-disable */
 import cn from 'classnames';
 import { CSSProperties, Ref } from 'react';
-import { setRef } from './ref';
+import { forkRef } from './ref';
 
@@ -45,6 +44,3 @@ export function callAllEventHandlers(...fns) {
   if (source.ref) {
-    newProps.ref = (ref) => {
-      setRef(source.ref, ref);
-      setRef(props.ref, ref);
-    };
+    newProps.ref = forkRef(source.ref, props.ref);
   }
@@ -51,0 +47,0 @@

src/injectStyle.ts

@@ -7,2 +7,14 @@ /* eslint-disable */
 
+function hashCode(str) {
+  let hash = 0,
+    i,
+    chr;
+  for (i = 0; i < str.length; i++) {
+    chr = str.charCodeAt(i);
+    hash = (hash << 5) - hash + chr;
+    hash |= 0; // Convert to 32bit integer
+  }
+  return hash;
+}
+
 function injectStyle(css) {
@@ -25,3 +37,7 @@ if (typeof window === 'object') {
     }
-    sh.insertAdjacentText('beforeend', css);
+    const hash = Math.abs(hashCode(css));
+    if (!sh.dataset[hash]) {
+      sh.dataset[hash] = true;
+      sh.insertAdjacentText('beforeend', css);
+    }
   }
@@ -28,0 +44,0 @@ }

src/logger.ts

@@ -7,3 +7,5 @@ const DEV = process.env.NODE_ENV !== 'production';
   constructor(logger) {
-    this.logger = logger;
+    this.logger = logger || {
+      warn: () => {}
+    };
   }
@@ -24,2 +26,2 @@
 export { Logger };
-export default new Logger(window.console);
+export default new Logger(console);

src/propsForElement.ts

@@ -36,2 +36,22 @@ /* eslint-disable */
 
+const omittedCloseTags = {
+  area: true,
+  base: true,
+  br: true,
+  col: true,
+  embed: true,
+  hr: true,
+  img: true,
+  input: true,
+  keygen: true,
+  link: true,
+  meta: true,
+  param: true,
+  source: true,
+  track: true,
+  wbr: true,
+  // because Children default value [Object object]
+  textarea: true,
+};
+
 export default function propsForElement<T extends {}>(
@@ -45,3 +65,4 @@ props: T,
     return Object.keys(props).reduce((acc, propName) => {
-      if (validAttr(propName)) {
+      // @ts-ignore
+      if (validAttr(propName) && !(omittedCloseTags[element] && propName === 'children')) {
         acc[propName] = props[propName];
@@ -48,0 +69,0 @@ }

src/ref.ts

@@ -1,2 +0,3 @@
-import React, { Ref } from 'react';
+import { MutableRefObject, Ref, RefObject, useCallback, useState } from 'react';
+import { findDOMNode } from 'react-dom';
 
@@ -12,4 +13,35 @@ export function setRef<T>(ref: Ref<T>, value: T) {
 
+export function useCallbackRef<T>(
+  initialValue: T | null,
+  callback: (newValue: T | null, lastValue: T | null) => void,
+): MutableRefObject<T | null> {
+  const [ref] = useState(() => ({
+    // value
+    value: initialValue,
+    // last callback
+    callback,
+    // "memoized" public interface
+    facade: {
+      get current() {
+        return ref.value;
+      },
+      set current(value) {
+        const last = ref.value;
+        if (last !== value) {
+          ref.value = value;
+          ref.callback(value, last);
+        }
+      },
+    },
+  }));
+  // update callback
+  ref.callback = callback;
+
+  return ref.facade;
+}
+
 export function useForkRef<T>(...refs): Ref<T> {
-  return React.useMemo(() => forkRef(...refs), refs);
+  return useCallback((refValue) => {
+    refs.forEach((ref) => setRef(ref, refValue));
+  }, refs);
 }
@@ -25,1 +57,19 @@
 }
+
+export type NodeByRef =
+  | RefObject<HTMLElement>
+  | HTMLElement
+  | (() => RefObject<HTMLElement> | HTMLElement);
+
+export function getNodeByRef(ref: NodeByRef): HTMLElement {
+  if (typeof ref === 'function') {
+    ref = ref();
+  }
+  if (!ref) return null;
+
+  const node = 'current' in ref ? ref.current : ref;
+  if (!node) return null;
+  if (node.nodeType === 1) return node;
+
+  return findDOMNode(node);
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

234149

increased by12.03%

Number of package files

189

increased by9.25%

Lines of code

3244

increased by13.23%

Dependency changes

• + Added@reshadow/core@0.0.1-alpha.74(transitive)

• + Added@semcore/core@1.15.8(transitive)

• + Added@semcore/utils@3.54.1(transitive)

• + Addedclassnames@2.2.6(transitive)

• + Addedfast-loops@1.1.4(transitive)

• + Addedfocus-lock@0.11.3(transitive)

• + Addedinline-style-prefixer@6.0.4(transitive)

• + Addednano-css@5.3.4(transitive)

• + Addedsourcemap-codec@1.4.8(transitive)

• + Addedtslib@2.7.0(transitive)

• Updated@babel/runtime@^7.10