@adyen/bento-design-tokens - npm Package Compare versions

Comparing version 1.0.0-rc-5 to 1.0.0-rc-6

dist/js/bento/es6-styleguide.js

@@ -116,3 +116,3 @@ export const BColorBackgroundPrimary = "#ffffff";
 export const BFocusRingColor = "#0070f5";
-export const BTextCaptionFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextCaptionFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextCaptionFontSize = "12px";
@@ -126,3 +126,3 @@ export const BTextCaptionFontWeight = 400;
 export const BTextCaptionStrongerWideLineHeight = "20px";
-export const BTextBodyFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextBodyFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextBodyFontSize = "14px";
@@ -145,3 +145,3 @@ export const BTextBodyFontWeight = 400;
 export const BTextBodyCodeTagLineHeight = "20px";
-export const BTextBodyDocsFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextBodyDocsFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextBodyDocsFontSize = "16px";
@@ -157,3 +157,3 @@ export const BTextBodyDocsFontWeight = 400;
 export const BTextBodyDocsStrongestWideLineHeight = "28px";
-export const BTextSubtitleFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextSubtitleFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextSubtitleFontSize = "16px";
@@ -164,3 +164,3 @@ export const BTextSubtitleFontWeight = 500;
 export const BTextSubtitleStrongerFontWeight = 600;
-export const BTextTitleFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleFontSize = "24px";
@@ -172,3 +172,3 @@ export const BTextTitleFontWeight = 600;
 export const BTextTitleMobileLineHeight = "26px";
-export const BTextTitleMFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleMFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleMFontSize = "28px";
@@ -180,3 +180,3 @@ export const BTextTitleMFontWeight = 600;
 export const BTextTitleMMobileLineHeight = "28px";
-export const BTextTitleLFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleLFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleLFontSize = "44px";
@@ -370,4 +370,5 @@ export const BTextTitleLFontWeight = 600;
 export const BCardTitleWrapperGap = "16px";
-export const BCheckboxGroupVerticalGap = "16px";
-export const BCheckboxGroupHorizontalGap = "32px";
+export const BCheckboxGroupCheckboxesVerticalGap = "16px";
+export const BCheckboxGroupCheckboxesHorizontalGap = "32px";
+export const BCheckboxGroupErrorMessageMarginTop = "12px";
 export const BCheckboxDescriptionColor = "#5c687c";
@@ -410,3 +411,3 @@ export const BCheckboxDescriptionDisabledColor = "#5c687c";
 export const BCheckboxOutlineUncheckedErrorBackgroundColor = "#e22d2d";
-export const BCheckboxOutlineUncheckedErrorBorderColor = "#e22d2d";
+export const BCheckboxOutlineUncheckedErrorBorder = "1.5px solid #e22d2d";
 export const BCheckboxOutlineReadonlyBackgroundColor = "#eeeff1";
@@ -429,2 +430,3 @@ export const BCheckboxOutlineReadonlyBorderColor = "#dbdee2";
 export const BCodeSnippetCodeAreaBorderWidth = "1px";
+export const BCodeSnippetCodeAreaContentFontFamily = "Menlo, 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace";
 export const BCodeSnippetCodeAreaHighlightRed = "#c72727";
@@ -518,9 +520,11 @@ export const BCodeSnippetCodeAreaHighlightOrange = "#9b5700";
 export const BDatePickerDescriptionColor = "#5c687c";
-export const BDatePickerDescriptionMargin = "8px";
-export const BDatePickerDescriptionErrorColor = "#e22d2d";
+export const BDatePickerDescriptionMarginTop = "8px";
+export const BDatePickerDescriptionErrorMarginTop = "4px";
 export const BDatePickerLabelMarginBottom = "8px";
 export const BDatePickerLabelRequirementColor = "#5c687c";
+export const BDatePickerErrorMessageMarginTop = "8px";
 export const BDateRangePickerDescriptionColor = "#5c687c";
-export const BDateRangePickerDescriptionMargin = "8px";
-export const BDateRangePickerDescriptionErrorColor = "#e22d2d";
+export const BDateRangePickerDescriptionMarginTop = "8px";
+export const BDateRangePickerDescriptionErrorMarginTop = "4px";
+export const BDateRangePickerErrorMessageMarginTop = "8px";
 export const BDateRangePickerLabelMarginBottom = "8px";
@@ -551,3 +555,4 @@ export const BDateRangePickerLabelRequirementColor = "#5c687c";
 export const BDropdownDescriptionMarginTop = "8px";
-export const BDropdownDescriptionErrorColor = "#e22d2d";
+export const BDropdownDescriptionErrorMarginTop = "4px";
+export const BDropdownErrorMessageMarginTop = "8px";
 export const BDropdownDefaultTextboxBorderColor = "#8d95a3";
@@ -571,3 +576,3 @@ export const BDropdownDefaultTextboxBorderRadius = "8px";
 export const BDropdownDefaultTextboxHoverBorderColor = "#00112c";
-export const BDropdownDefaultTextboxErrorBorderColor = "#e22d2d";
+export const BDropdownDefaultTextboxErrorBorder = "1.5px solid #e22d2d";
 export const BDropdownDefaultTextboxErrorFocusBorderColor = "#791818";
@@ -607,2 +612,3 @@ export const BDropdownDefaultTextboxErrorFocusOutlineColor = "#791818";
 export const BErrorMessageIconMarginRight = "8px";
+export const BErrorMessageIconHeight = "20px";
 export const BFilterBarGap = "8px";
@@ -891,4 +897,2 @@ export const BFilterBarPaddingRight = "16px";
 export const BRadioGroupErrorMessageMarginTop = "12px";
-export const BRadioGroupErrorMessageColor = "#e22d2d";
-export const BRadioGroupErrorMessageScreenReaderOnlyMargin = "-1px";
 export const BSegmentedControlBackgroundColor = "#eeeff1";
@@ -967,2 +971,3 @@ export const BSegmentedControlBorderRadius = "12px";
 export const BTextareaLabelItemColor = "#5c687c";
+export const BTextareaLabelItemErrorColor = "#e22d2d";
 export const BTextareaInputBoxMarginBottom = "8px";
@@ -979,11 +984,12 @@ export const BTextareaInputBorder = "1px solid #8d95a3";
 export const BTextareaInputErrorBackgroundColor = "#e22d2d";
-export const BTextareaInputFocusBorder = "1px solid #8d95a3";
+export const BTextareaInputFocusBorder = "1.5px solid #00112c";
 export const BTextareaInputHoverBorderColor = "#00112c";
 export const BTextareaInputPlaceholderColor = "#8d95a3";
 export const BTextareaInputReadonlyBackgroundColor = "#eeeff1";
+export const BTextareaInputReadonlyBorderColor = "#dbdee2";
+export const BTextareaInputClearablePadding = "12px 40px 8px 12px";
 export const BTextareaDescriptionColor = "#5c687c";
-export const BTextareaDescriptionMarginTop = "8px";
+export const BTextareaDescriptionMarginTop = "4px";
 export const BTextareaDescriptionPadding = 0;
 export const BTextareaDescriptionErrorColor = "#e22d2d";
-export const BTextareaClearablePadding = "12px 40px 8px 12px";
 export const BTimelineItemRowGap = "16px";
@@ -990,0 +996,0 @@ export const BTimelineItemContentPaddingBottom = "32px";

dist/js/bento/es6.js

@@ -117,3 +117,3 @@ export const BColorBackgroundPrimary = "#ffffff";
 export const BFocusRingColor = "#0070f5";
-export const BTextCaptionFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextCaptionFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextCaptionFontSize = "12px";
@@ -127,3 +127,3 @@ export const BTextCaptionFontWeight = 400;
 export const BTextCaptionStrongerWideLineHeight = "20px";
-export const BTextBodyFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextBodyFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextBodyFontSize = "14px";
@@ -140,3 +140,3 @@ export const BTextBodyFontWeight = 400;
 export const BTextBodyStrongestWideLineHeight = "24px";
-export const BTextSubtitleFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextSubtitleFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextSubtitleFontSize = "16px";
@@ -147,3 +147,3 @@ export const BTextSubtitleFontWeight = 500;
 export const BTextSubtitleStrongerFontWeight = 600;
-export const BTextTitleFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleFontSize = "16px";
@@ -155,3 +155,3 @@ export const BTextTitleFontWeight = 600;
 export const BTextTitleMobileLineHeight = "26px";
-export const BTextTitleMFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleMFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleMFontSize = "20px";
@@ -163,3 +163,3 @@ export const BTextTitleMFontWeight = 600;
 export const BTextTitleMMobileLineHeight = "28px";
-export const BTextTitleLFontFamily = "Inter, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif";
+export const BTextTitleLFontFamily = "Inter, Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif";
 export const BTextTitleLFontSize = "24px";
@@ -353,4 +353,5 @@ export const BTextTitleLFontWeight = 600;
 export const BCardTitleWrapperGap = "16px";
-export const BCheckboxGroupVerticalGap = "16px";
-export const BCheckboxGroupHorizontalGap = "32px";
+export const BCheckboxGroupCheckboxesVerticalGap = "16px";
+export const BCheckboxGroupCheckboxesHorizontalGap = "32px";
+export const BCheckboxGroupErrorMessageMarginTop = "12px";
 export const BCheckboxDescriptionColor = "#5c687c";
@@ -393,3 +394,3 @@ export const BCheckboxDescriptionDisabledColor = "#5c687c";
 export const BCheckboxOutlineUncheckedErrorBackgroundColor = "#e22d2d";
-export const BCheckboxOutlineUncheckedErrorBorderColor = "#e22d2d";
+export const BCheckboxOutlineUncheckedErrorBorder = "1.5px solid #e22d2d";
 export const BCheckboxOutlineReadonlyBackgroundColor = "#eeeff1";
@@ -412,2 +413,3 @@ export const BCheckboxOutlineReadonlyBorderColor = "#dbdee2";
 export const BCodeSnippetCodeAreaBorderWidth = "1px";
+export const BCodeSnippetCodeAreaContentFontFamily = "Menlo, 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace";
 export const BCodeSnippetCodeAreaHighlightRed = "#c72727";
@@ -501,9 +503,11 @@ export const BCodeSnippetCodeAreaHighlightOrange = "#9b5700";
 export const BDatePickerDescriptionColor = "#5c687c";
-export const BDatePickerDescriptionMargin = "8px";
-export const BDatePickerDescriptionErrorColor = "#e22d2d";
+export const BDatePickerDescriptionMarginTop = "8px";
+export const BDatePickerDescriptionErrorMarginTop = "4px";
 export const BDatePickerLabelMarginBottom = "8px";
 export const BDatePickerLabelRequirementColor = "#5c687c";
+export const BDatePickerErrorMessageMarginTop = "8px";
 export const BDateRangePickerDescriptionColor = "#5c687c";
-export const BDateRangePickerDescriptionMargin = "8px";
-export const BDateRangePickerDescriptionErrorColor = "#e22d2d";
+export const BDateRangePickerDescriptionMarginTop = "8px";
+export const BDateRangePickerDescriptionErrorMarginTop = "4px";
+export const BDateRangePickerErrorMessageMarginTop = "8px";
 export const BDateRangePickerLabelMarginBottom = "8px";
@@ -534,3 +538,4 @@ export const BDateRangePickerLabelRequirementColor = "#5c687c";
 export const BDropdownDescriptionMarginTop = "8px";
-export const BDropdownDescriptionErrorColor = "#e22d2d";
+export const BDropdownDescriptionErrorMarginTop = "4px";
+export const BDropdownErrorMessageMarginTop = "8px";
 export const BDropdownDefaultTextboxBorderColor = "#8d95a3";
@@ -554,3 +559,3 @@ export const BDropdownDefaultTextboxBorderRadius = "8px";
 export const BDropdownDefaultTextboxHoverBorderColor = "#00112c";
-export const BDropdownDefaultTextboxErrorBorderColor = "#e22d2d";
+export const BDropdownDefaultTextboxErrorBorder = "1.5px solid #e22d2d";
 export const BDropdownDefaultTextboxErrorFocusBorderColor = "#791818";
@@ -590,2 +595,3 @@ export const BDropdownDefaultTextboxErrorFocusOutlineColor = "#791818";
 export const BErrorMessageIconMarginRight = "8px";
+export const BErrorMessageIconHeight = "20px";
 export const BFilterBarGap = "8px";
@@ -874,4 +880,2 @@ export const BFilterBarPaddingRight = "16px";
 export const BRadioGroupErrorMessageMarginTop = "12px";
-export const BRadioGroupErrorMessageColor = "#e22d2d";
-export const BRadioGroupErrorMessageScreenReaderOnlyMargin = "-1px";
 export const BSegmentedControlBackgroundColor = "#eeeff1";
@@ -950,2 +954,3 @@ export const BSegmentedControlBorderRadius = "12px";
 export const BTextareaLabelItemColor = "#5c687c";
+export const BTextareaLabelItemErrorColor = "#e22d2d";
 export const BTextareaInputBoxMarginBottom = "8px";
@@ -962,11 +967,12 @@ export const BTextareaInputBorder = "1px solid #8d95a3";
 export const BTextareaInputErrorBackgroundColor = "#e22d2d";
-export const BTextareaInputFocusBorder = "1px solid #8d95a3";
+export const BTextareaInputFocusBorder = "1.5px solid #00112c";
 export const BTextareaInputHoverBorderColor = "#00112c";
 export const BTextareaInputPlaceholderColor = "#8d95a3";
 export const BTextareaInputReadonlyBackgroundColor = "#eeeff1";
+export const BTextareaInputReadonlyBorderColor = "#dbdee2";
+export const BTextareaInputClearablePadding = "12px 40px 8px 12px";
 export const BTextareaDescriptionColor = "#5c687c";
-export const BTextareaDescriptionMarginTop = "8px";
+export const BTextareaDescriptionMarginTop = "4px";
 export const BTextareaDescriptionPadding = 0;
 export const BTextareaDescriptionErrorColor = "#e22d2d";
-export const BTextareaClearablePadding = "12px 40px 8px 12px";
 export const BTimelineItemRowGap = "16px";
@@ -973,0 +979,0 @@ export const BTimelineItemContentPaddingBottom = "32px";

package.json

 {
     "name": "@adyen/bento-design-tokens",
-    "version": "1.0.0-rc-5",
+    "version": "1.0.0-rc-6",
     "license": "MIT",
@@ -5,0 +5,0 @@ "files": [

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

737480

increased by0.08%

Lines of code

8561

increased by0.38%

No dependency changes