@khanacademy/wonder-blocks-banner - npm Package Compare versions

Comparing version 0.0.0-PR2176-20240201202337 to 0.0.0-PR2177-20240207024629

CHANGELOG.md

 # @khanacademy/wonder-blocks-banner
 
-## 0.0.0-PR2176-20240201202337
+## 0.0.0-PR2177-20240207024629
 
 ### Patch Changes
 
+-   @khanacademy/wonder-blocks-button@0.0.0-PR2177-20240207024629
+-   @khanacademy/wonder-blocks-icon-button@0.0.0-PR2177-20240207024629
+-   @khanacademy/wonder-blocks-link@0.0.0-PR2177-20240207024629
+
+## 3.0.36
+
+### Patch Changes
+
+-   Updated dependencies [e83f8991]
+    -   @khanacademy/wonder-blocks-tokens@1.0.0
+    -   @khanacademy/wonder-blocks-button@6.2.7
+    -   @khanacademy/wonder-blocks-icon-button@5.1.10
+    -   @khanacademy/wonder-blocks-link@6.0.7
+
+## 3.0.35
+
+### Patch Changes
+
+-   60aba5b8: Update internal spacing references (from wb-spacing to wb-tokens)
+-   7c51f377: Migrate wb-color imports to use tokens.color
+-   Updated dependencies [60aba5b8]
 -   Updated dependencies [7cd7f6cc]
-    -   @khanacademy/wonder-blocks-icon-button@0.0.0-PR2176-20240201202337
-    -   @khanacademy/wonder-blocks-button@0.0.0-PR2176-20240201202337
+-   Updated dependencies [7c51f377]
+-   Updated dependencies [7cd7f6cc]
+-   Updated dependencies [7c51f377]
+    -   @khanacademy/wonder-blocks-button@6.2.6
+    -   @khanacademy/wonder-blocks-link@6.0.6
+    -   @khanacademy/wonder-blocks-tokens@0.2.0
+    -   @khanacademy/wonder-blocks-icon-button@5.1.9
 
@@ -11,0 +37,0 @@ ## 3.0.34

dist/es/index.js

@@ -5,3 +5,2 @@ import * as React from 'react';
 import Button from '@khanacademy/wonder-blocks-button';
-import Color from '@khanacademy/wonder-blocks-color';
 import { View } from '@khanacademy/wonder-blocks-core';
@@ -11,3 +10,3 @@ import { PhosphorIcon } from '@khanacademy/wonder-blocks-icon';
 import Link from '@khanacademy/wonder-blocks-link';
-import Spacing from '@khanacademy/wonder-blocks-spacing';
+import { spacing, color } from '@khanacademy/wonder-blocks-tokens';
 import { LabelSmall } from '@khanacademy/wonder-blocks-typography';
@@ -23,3 +22,3 @@ import infoIcon from '@phosphor-icons/core/regular/info.svg';
       return {
-        color: Color.green,
+        color: color.green,
         icon: successIcon,
@@ -30,3 +29,3 @@ role: "status"
       return {
-        color: Color.gold,
+        color: color.gold,
         icon: warningIcon,
@@ -38,3 +37,3 @@ role: "alert",
       return {
-        color: Color.red,
+        color: color.red,
         icon: criticalIcon,
@@ -45,3 +44,3 @@ role: "alert"
       return {
-        color: Color.blue,
+        color: color.blue,
         icon: infoIcon,
@@ -146,17 +145,17 @@ role: "status"
   containerOuter: {
-    borderInlineStartWidth: Spacing.xxSmall_6,
+    borderInlineStartWidth: spacing.xxSmall_6,
     width: "100%",
-    backgroundColor: Color.white
+    backgroundColor: color.white
   },
   containerInner: {
     flexDirection: "row",
-    padding: Spacing.xSmall_8
+    padding: spacing.xSmall_8
   },
   icon: {
-    marginTop: Spacing.xSmall_8,
-    marginBottom: Spacing.xSmall_8,
-    marginInlineStart: Spacing.xxxxSmall_2,
-    marginInlineEnd: Spacing.xSmall_8,
+    marginTop: spacing.xSmall_8,
+    marginBottom: spacing.xSmall_8,
+    marginInlineStart: spacing.xxxxSmall_2,
+    marginInlineEnd: spacing.xSmall_8,
     alignSelf: "flex-start",
-    color: Color.offBlack64
+    color: color.offBlack64
   },
@@ -173,3 +172,3 @@ labelAndButtonsContainer: {
     flexShrink: 1,
-    margin: Spacing.xSmall_8,
+    margin: spacing.xSmall_8,
     textAlign: "start",
@@ -181,8 +180,8 @@ overflowWrap: "break-word"
     justifyContent: "flex-start",
-    marginTop: Spacing.xSmall_8,
-    marginBottom: Spacing.xSmall_8
+    marginTop: spacing.xSmall_8,
+    marginBottom: spacing.xSmall_8
   },
   action: {
-    marginLeft: Spacing.xSmall_8,
-    marginRight: Spacing.xSmall_8,
+    marginLeft: spacing.xSmall_8,
+    marginRight: spacing.xSmall_8,
     justifyContent: "center",
@@ -202,4 +201,4 @@ height: 18
     alignItems: "center",
-    marginLeft: Spacing.xSmall_8,
-    marginRight: Spacing.xSmall_8
+    marginLeft: spacing.xSmall_8,
+    marginRight: spacing.xSmall_8
   },
@@ -206,0 +205,0 @@ floatingBorder: {

dist/index.js

@@ -7,3 +7,2 @@ 'use strict';
 var Button = require('@khanacademy/wonder-blocks-button');
-var Color = require('@khanacademy/wonder-blocks-color');
 var wonderBlocksCore = require('@khanacademy/wonder-blocks-core');
@@ -13,3 +12,3 @@ var wonderBlocksIcon = require('@khanacademy/wonder-blocks-icon');
 var Link = require('@khanacademy/wonder-blocks-link');
-var Spacing = require('@khanacademy/wonder-blocks-spacing');
+var wonderBlocksTokens = require('@khanacademy/wonder-blocks-tokens');
 var wonderBlocksTypography = require('@khanacademy/wonder-blocks-typography');
@@ -44,6 +43,4 @@ var infoIcon = require('@phosphor-icons/core/regular/info.svg');
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
-var Color__default = /*#__PURE__*/_interopDefaultLegacy(Color);
 var IconButton__default = /*#__PURE__*/_interopDefaultLegacy(IconButton);
 var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
-var Spacing__default = /*#__PURE__*/_interopDefaultLegacy(Spacing);
 var infoIcon__default = /*#__PURE__*/_interopDefaultLegacy(infoIcon);
@@ -58,3 +55,3 @@ var successIcon__default = /*#__PURE__*/_interopDefaultLegacy(successIcon);
       return {
-        color: Color__default["default"].green,
+        color: wonderBlocksTokens.color.green,
         icon: successIcon__default["default"],
@@ -65,3 +62,3 @@ role: "status"
       return {
-        color: Color__default["default"].gold,
+        color: wonderBlocksTokens.color.gold,
         icon: warningIcon__default["default"],
@@ -73,3 +70,3 @@ role: "alert",
       return {
-        color: Color__default["default"].red,
+        color: wonderBlocksTokens.color.red,
         icon: criticalIcon__default["default"],
@@ -80,3 +77,3 @@ role: "alert"
       return {
-        color: Color__default["default"].blue,
+        color: wonderBlocksTokens.color.blue,
         icon: infoIcon__default["default"],
@@ -181,17 +178,17 @@ role: "status"
   containerOuter: {
-    borderInlineStartWidth: Spacing__default["default"].xxSmall_6,
+    borderInlineStartWidth: wonderBlocksTokens.spacing.xxSmall_6,
     width: "100%",
-    backgroundColor: Color__default["default"].white
+    backgroundColor: wonderBlocksTokens.color.white
   },
   containerInner: {
     flexDirection: "row",
-    padding: Spacing__default["default"].xSmall_8
+    padding: wonderBlocksTokens.spacing.xSmall_8
   },
   icon: {
-    marginTop: Spacing__default["default"].xSmall_8,
-    marginBottom: Spacing__default["default"].xSmall_8,
-    marginInlineStart: Spacing__default["default"].xxxxSmall_2,
-    marginInlineEnd: Spacing__default["default"].xSmall_8,
+    marginTop: wonderBlocksTokens.spacing.xSmall_8,
+    marginBottom: wonderBlocksTokens.spacing.xSmall_8,
+    marginInlineStart: wonderBlocksTokens.spacing.xxxxSmall_2,
+    marginInlineEnd: wonderBlocksTokens.spacing.xSmall_8,
     alignSelf: "flex-start",
-    color: Color__default["default"].offBlack64
+    color: wonderBlocksTokens.color.offBlack64
   },
@@ -208,3 +205,3 @@ labelAndButtonsContainer: {
     flexShrink: 1,
-    margin: Spacing__default["default"].xSmall_8,
+    margin: wonderBlocksTokens.spacing.xSmall_8,
     textAlign: "start",
@@ -216,8 +213,8 @@ overflowWrap: "break-word"
     justifyContent: "flex-start",
-    marginTop: Spacing__default["default"].xSmall_8,
-    marginBottom: Spacing__default["default"].xSmall_8
+    marginTop: wonderBlocksTokens.spacing.xSmall_8,
+    marginBottom: wonderBlocksTokens.spacing.xSmall_8
   },
   action: {
-    marginLeft: Spacing__default["default"].xSmall_8,
-    marginRight: Spacing__default["default"].xSmall_8,
+    marginLeft: wonderBlocksTokens.spacing.xSmall_8,
+    marginRight: wonderBlocksTokens.spacing.xSmall_8,
     justifyContent: "center",
@@ -237,4 +234,4 @@ height: 18
     alignItems: "center",
-    marginLeft: Spacing__default["default"].xSmall_8,
-    marginRight: Spacing__default["default"].xSmall_8
+    marginLeft: wonderBlocksTokens.spacing.xSmall_8,
+    marginRight: wonderBlocksTokens.spacing.xSmall_8
   },
@@ -241,0 +238,0 @@ floatingBorder: {

package.json

 {
   "name": "@khanacademy/wonder-blocks-banner",
-  "version": "0.0.0-PR2176-20240201202337",
+  "version": "0.0.0-PR2177-20240207024629",
   "design": "v1",
@@ -19,9 +19,8 @@ "description": "Banner components for Wonder Blocks.",
     "@babel/runtime": "^7.18.6",
-    "@khanacademy/wonder-blocks-button": "0.0.0-PR2176-20240201202337",
-    "@khanacademy/wonder-blocks-color": "^3.0.0",
+    "@khanacademy/wonder-blocks-button": "0.0.0-PR2177-20240207024629",
     "@khanacademy/wonder-blocks-core": "^6.3.1",
     "@khanacademy/wonder-blocks-icon": "^4.0.1",
-    "@khanacademy/wonder-blocks-icon-button": "0.0.0-PR2176-20240201202337",
-    "@khanacademy/wonder-blocks-link": "^6.0.5",
-    "@khanacademy/wonder-blocks-spacing": "^4.0.1",
+    "@khanacademy/wonder-blocks-icon-button": "0.0.0-PR2177-20240207024629",
+    "@khanacademy/wonder-blocks-link": "0.0.0-PR2177-20240207024629",
+    "@khanacademy/wonder-blocks-tokens": "^1.0.0",
     "@khanacademy/wonder-blocks-typography": "^2.1.10"
@@ -28,0 +27,0 @@ },

tsconfig-build.json

@@ -10,3 +10,2 @@ {
         {"path": "../wonder-blocks-button/tsconfig-build.json"},
-        {"path": "../wonder-blocks-color/tsconfig-build.json"},
         {"path": "../wonder-blocks-core/tsconfig-build.json"},
@@ -16,5 +15,5 @@ {"path": "../wonder-blocks-icon/tsconfig-build.json"},
         {"path": "../wonder-blocks-link/tsconfig-build.json"},
-        {"path": "../wonder-blocks-spacing/tsconfig-build.json"},
+        {"path": "../wonder-blocks-tokens/tsconfig-build.json"},
         {"path": "../wonder-blocks-typography/tsconfig-build.json"},
     ]
 }

No alert changes

Improved metrics

Total package byte prevSize

121854

increased by0.6%

Dependency count

11

decreased by-8.33%

Worsened metrics

Lines of code

1290

decreased by-0.46%

Dependency changes

• + Added@khanacademy/wonder-blocks-tokens@^1.0.0

• + Added@khanacademy/wonder-blocks-button@0.0.0-PR2177-20240207024629(transitive)

• + Added@khanacademy/wonder-blocks-clickable@0.0.0-PR2177-20240207024629(transitive)

• + Added@khanacademy/wonder-blocks-icon-button@0.0.0-PR2177-20240207024629(transitive)

• + Added@khanacademy/wonder-blocks-link@0.0.0-PR2177-20240207024629(transitive)

• + Added@khanacademy/wonder-blocks-theming@2.0.2(transitive)

• - Removed@khanacademy/wonder-blocks-color@^3.0.0

• - Removed@khanacademy/wonder-blocks-spacing@^4.0.1

• - Removed@khanacademy/wonder-blocks-button@0.0.0-PR2176-20240201202337(transitive)

• - Removed@khanacademy/wonder-blocks-clickable@4.2.1(transitive)

• - Removed@khanacademy/wonder-blocks-icon-button@0.0.0-PR2176-20240201202337(transitive)

• - Removed@khanacademy/wonder-blocks-link@6.1.1(transitive)

• - Removed@khanacademy/wonder-blocks-spacing@4.0.1(transitive)

• - Removed@khanacademy/wonder-blocks-theming@0.0.0-PR2176-20240201202337(transitive)

• Updated@khanacademy/wonder-blocks-button@0.0.0-PR2177-20240207024629

• Updated@khanacademy/wonder-blocks-icon-button@0.0.0-PR2177-20240207024629

• Updated@khanacademy/wonder-blocks-link@0.0.0-PR2177-20240207024629