@semcore/utils - npm Package Compare versions

Comparing version 4.32.2 to 4.35.0-prerelease.0

CHANGELOG.md

@@ -5,2 +5,20 @@ # Changelog
 
+## [4.35.0] - 2024-09-06
+
+### Added
+
+- Internal api for understanding what (mouse or keyboard) caused focus change.
+
+## [4.34.0] - 2024-09-04
+
+### Added
+
+- New `--intergalactic-form-control-s` token for Button with `s` size. Use it for small interactive addons. Avoid using it with the main actions.
+
+## [4.33.0] - 2024-07-26
+
+### Fixed
+
+- Now focus lock is preventing focus from falling into iframes.
+
 ## [4.32.2] - 2024-07-22
@@ -7,0 +25,0 @@

lib/components/invalid-state-pattern/InvalidStatePattern.js

@@ -13,4 +13,4 @@ "use strict";
 /*__reshadow-styles__:"./invalidStatePattern.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SPattern_16p8i_gg_{width:6px;height:100%;position:absolute;background-image:var(--intergalactic-border-critical-pattern, repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%));background-size:6px 6px;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:var(--intergalactic-control-rounded, 6px)}" /*__inner_css_end__*/, "16p8i_gg_") /*__reshadow_css_end__*/, {
-  "__SPattern": "___SPattern_16p8i_gg_"
+var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SPattern_gbjpm_gg_{width:6px;height:100%;position:absolute;background-image:var(--intergalactic-border-critical-pattern, repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%));background-size:6px 6px;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-bottom-left-radius:var(--intergalactic-control-rounded, 6px);border-top-left-radius:var(--intergalactic-control-rounded, 6px)}" /*__inner_css_end__*/, "gbjpm_gg_") /*__reshadow_css_end__*/, {
+  "__SPattern": "___SPattern_gbjpm_gg_"
 });
@@ -17,0 +17,0 @@ var InvalidStatePatternComponent = function InvalidStatePatternComponent() {

lib/enhances/keyboardFocusEnhance.d.ts

 import React from 'react';
 import { UnknownProperties } from '../core';
+import { useFocusSource } from './focusSourceEnhance';
+export { useFocusSource };
 /** @deprecated */
@@ -15,3 +17,2 @@ export interface IKeyboardFocusProps extends KeyboardFocusProps, UnknownProperties {
 export declare const enforcedKeyboardFocusEnhanceContext: React.Context<boolean>;
-export declare const useFocusSource: () => React.MutableRefObject<"none" | "mouse" | "keyboard">;
 export type KeyboardFocusEnhanceHook = (props: {
@@ -18,0 +19,0 @@ tabIndex?: number;

lib/enhances/keyboardFocusEnhance.js

@@ -7,63 +7,15 @@ "use strict";
 });
-exports.useFocusSource = exports.enforcedKeyboardFocusEnhanceContext = exports["default"] = void 0;
+exports.enforcedKeyboardFocusEnhanceContext = exports["default"] = void 0;
+Object.defineProperty(exports, "useFocusSource", {
+  enumerable: true,
+  get: function get() {
+    return _focusSourceEnhance.useFocusSource;
+  }
+});
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
 var _assignProps = _interopRequireDefault(require("../assignProps"));
+var _focusSourceEnhance = require("./focusSourceEnhance");
 var enforcedKeyboardFocusEnhanceContext = /*#__PURE__*/_react["default"].createContext(false);
 exports.enforcedKeyboardFocusEnhanceContext = enforcedKeyboardFocusEnhanceContext;
-var lastFocusSource = 'none';
-var focusSourceListeners = [];
-var useFocusSource = function useFocusSource() {
-  var handleMouseDown = _react["default"].useCallback(function () {
-    return focusSourceListeners.forEach(function (listener) {
-      return listener.setFocusSource('mouse');
-    });
-  }, []);
-  var handleKeyDown = _react["default"].useCallback(function () {
-    return focusSourceListeners.forEach(function (listener) {
-      return listener.setFocusSource('keyboard');
-    });
-  }, []);
-  var focusSourceRef = _react["default"].useRef(lastFocusSource);
-  var setFocusSource = _react["default"].useCallback(function (source) {
-    focusSourceRef.current = source;
-    lastFocusSource = source;
-  }, []);
-  var subscribeListeners = _react["default"].useCallback(function () {
-    document.addEventListener('mousedown', handleMouseDown, {
-      capture: true
-    });
-    document.addEventListener('keydown', handleKeyDown, {
-      capture: true
-    });
-  }, []);
-  var unsubscribeListeners = _react["default"].useCallback(function () {
-    document.removeEventListener('mousedown', handleMouseDown, {
-      capture: true
-    });
-    document.removeEventListener('keydown', handleKeyDown, {
-      capture: true
-    });
-  }, []);
-  _react["default"].useEffect(function () {
-    var needToAddListeners = focusSourceListeners.length === 0;
-    var sourceListener = {
-      setFocusSource: setFocusSource,
-      subscribeListeners: subscribeListeners
-    };
-    focusSourceListeners.push(sourceListener);
-    if (needToAddListeners) subscribeListeners();
-    var needToRemoveListeners = needToAddListeners;
-    return function () {
-      var sourceListenerIndex = focusSourceListeners.indexOf(sourceListener);
-      focusSourceListeners.splice(sourceListenerIndex, 1);
-      if (needToRemoveListeners) unsubscribeListeners();
-      if (needToRemoveListeners && focusSourceListeners.length > 0) {
-        focusSourceListeners[0].subscribeListeners();
-      }
-    };
-  }, []);
-  return focusSourceRef;
-};
-exports.useFocusSource = useFocusSource;
 var keyboardFocusEnhance = function keyboardFocusEnhance() {
@@ -80,3 +32,3 @@ var makeFocusable = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
       setKeyboardFocused = _React$useState2[1];
-    var focusSourceRef = useFocusSource();
+    var focusSourceRef = (0, _focusSourceEnhance.useFocusSource)();
     var ref = _react["default"].useRef(null);
@@ -83,0 +35,0 @@ var handleFocus = _react["default"].useCallback(function (event) {

lib/injectStyle.js

@@ -33,3 +33,3 @@ "use strict";
         // @ts-ignore
-        var version = "4.32.2";
+        var version = "4.35.0";
         sh = document.createElement('style');
@@ -36,0 +36,0 @@ sh.setAttribute('data-ui-v', version);

lib/themes/dark.json

@@ -225,2 +225,3 @@ {
   "--intergalactic-scale-indent": "4px",
+  "--intergalactic-form-control-s": "20px",
   "--intergalactic-form-control-m": "28px",
@@ -266,3 +267,3 @@ "--intergalactic-form-control-l": "40px",
   "--intergalactic-z-index-overlay": "500",
-  "--intergalactic-z-index-modal": "600",
+  "--intergalactic-z-index-modal": "900",
   "--intergalactic-z-index-popper": "700",
@@ -269,0 +270,0 @@ "--intergalactic-z-index-dropdown": "750",

lib/themes/default.json

@@ -234,2 +234,3 @@ {
   "--intergalactic-scale-indent": "4px",
+  "--intergalactic-form-control-s": "20px",
   "--intergalactic-form-control-m": "28px",
@@ -277,3 +278,3 @@ "--intergalactic-form-control-l": "40px",
   "--intergalactic-z-index-overlay": "500",
-  "--intergalactic-z-index-modal": "600",
+  "--intergalactic-z-index-modal": "900",
   "--intergalactic-z-index-popper": "700",
@@ -280,0 +281,0 @@ "--intergalactic-z-index-dropdown": "750",

lib/themes/light.json

@@ -234,2 +234,3 @@ {
   "--intergalactic-scale-indent": "4px",
+  "--intergalactic-form-control-s": "20px",
   "--intergalactic-form-control-m": "28px",
@@ -277,3 +278,3 @@ "--intergalactic-form-control-l": "40px",
   "--intergalactic-z-index-overlay": "500",
-  "--intergalactic-z-index-modal": "600",
+  "--intergalactic-z-index-modal": "900",
   "--intergalactic-z-index-popper": "700",
@@ -280,0 +281,0 @@ "--intergalactic-z-index-dropdown": "750",

lib/use/useFocusLock.js

@@ -30,2 +30,3 @@ "use strict";
 var _focusBorders = require("../focus-lock/focusBorders");
+var _iframeBorders = require("../focus-lock/iframeBorders");
 var focusBordersConsumers = new Set();
@@ -69,6 +70,13 @@ var syntheticEvents = {
     if (!(0, _focusBorders.areFocusBordersPlacedCorrectly)()) (0, _focusBorders.removeFocusBorders)();
-    if (focusBordersConsumers.size > 0) (0, _focusBorders.addFocusBorders)();
+    if (!(0, _iframeBorders.areIframeBordersPlacedCorrectly)()) (0, _iframeBorders.removeIframeBorders)();
+    if (focusBordersConsumers.size > 0) {
+      (0, _focusBorders.addFocusBorders)();
+      (0, _iframeBorders.addIframeBorders)();
+    }
     return function () {
       focusBordersConsumers["delete"](id);
-      if (focusBordersConsumers.size === 0) (0, _focusBorders.removeFocusBorders)();
+      if (focusBordersConsumers.size === 0) {
+        (0, _focusBorders.removeFocusBorders)();
+        (0, _iframeBorders.removeIframeBorders)();
+      }
     };
@@ -75,0 +83,0 @@ }, [disabled]);

package.json

 {
   "name": "@semcore/utils",
   "description": "Semrush Utils Component",
-  "version": "4.32.2",
+  "version": "4.35.0-prerelease.0",
   "main": "lib/index.js",
@@ -6,0 +6,0 @@ "sideEffects": false,

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

1496024

increased by1.45%

Number of package files

478

increased by2.14%

Lines of code

15236

increased by1.31%

Worsened metrics

Number of low quality alerts

2

increased by100%

No dependency changes