@hsds/keyboard-badge - npm Package Compare versions

Comparing version 9.1.1 to 9.2.0

CHANGELOG.md

@@ -5,2 +5,13 @@ # Changelog
 
+## [9.2.0](https://github.com/helpscout/hsds/compare/components-keyboard-badge-9.1.1...components-keyboard-badge-9.2.0) (2024-03-14)
+
+### Dependency Updates
+
+* `tokens` updated to version `2.2.0`
+* `utils-color` updated to version `9.0.3`
+
+### Features
+
+* **components-keyboard-badge:** extract text to tokens ([67385b6](https://github.com/helpscout/hsds/commit/67385b6e138f9bb59de950a1b593d1967dd16771))
+
 ## [9.1.1](https://github.com/helpscout/hsds/compare/components-keyboard-badge-9.1.1-next.4...components-keyboard-badge-9.1.1) (2024-03-01)
@@ -7,0 +18,0 @@

KeyboardBadge.styles.js

@@ -6,2 +6,3 @@ "use strict";
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _tokens = require("@hsds/tokens");
 var _utilsColor = require("@hsds/utils-color");
@@ -17,3 +18,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
   componentId: "sc-16ya8og-1"
-})(["font-size:11px;font-family:var(--HSDSGlobalFontFamilyMono);background-color:", ";color:", ";border-radius:3px;box-sizing:border-box;border:none;display:inline-flex;align-items:center;justify-content:center;font-weight:500;min-width:18px;height:18px;line-height:18px;padding:0 6px;white-space:nowrap;& + &{margin-left:4px;}"], (0, _utilsColor.getColor)('charcoal.300'), (0, _utilsColor.getColor)('charcoal.800'));
+})(["font-size:11px;font-family:var(--HSDSGlobalFontFamilyMono);background-color:", ";color:", ";border-radius:3px;box-sizing:border-box;border:none;display:inline-flex;align-items:center;justify-content:center;font-weight:500;min-width:18px;height:18px;line-height:18px;padding:0 6px;white-space:nowrap;& + &{margin-left:4px;}"], (0, _utilsColor.getColor)('charcoal.300'), (0, _tokens.getToken)('keyboardBadge.color.text'));
 exports.KeysUI = KeysUI;

package.json

 {
   "name": "@hsds/keyboard-badge",
-  "version": "9.1.1",
+  "version": "9.2.0",
   "peerDependencies": {
@@ -13,3 +13,4 @@ "prop-types": "~15.7.2",
   "dependencies": {
-    "@hsds/utils-color": "9.0.2",
+    "@hsds/tokens": "2.2.0",
+    "@hsds/utils-color": "9.0.3",
     "@hsds/utils-react": "9.0.1",
@@ -16,0 +17,0 @@ "classnames": "2.3.1"

src/KeyboardBadge.styles.js

 import styled from 'styled-components'
 
+import { getToken } from '@hsds/tokens'
+
 import { getColor } from '@hsds/utils-color'
@@ -13,3 +15,3 @@
   background-color: ${getColor('charcoal.300')};
-  color: ${getColor('charcoal.800')};
+  color: ${getToken('keyboardBadge.color.text')};
   border-radius: 3px;
@@ -16,0 +18,0 @@ box-sizing: border-box;

No alert changes

Improved metrics

Total package byte prevSize

20565

increased by2.67%

Lines of code

174

increased by1.16%

Worsened metrics

Dependency count

8

increased by14.29%

Dependency changes

• + Added@hsds/tokens@2.2.0

• + Added@hsds/tokens@2.2.0(transitive)

• + Added@hsds/utils-color@9.0.3(transitive)

• + Addedcamelcase@5.3.1(transitive)

• - Removed@hsds/utils-color@9.0.2(transitive)

• Updated@hsds/utils-color@9.0.3