@razorpay/blade 12.68.0 → 12.89.0

package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js

@@ -5,68 +5,273 @@ import { makeSize } from '../../../utils/makeSize/makeSize.js';
 
 /* eslint-disable @typescript-eslint/explicit-function-return-type */
 
-var backgroundColor = function backgroundColor(property) {
-  var isBorder = property === 'border';
+var backgroundGradient = function backgroundGradient(color) {
   return {
     base: {
       primary: {
-        "default": "interactive.".concat(property, ".primary.default"),
-        highlighted: "interactive.".concat(property, ".primary.highlighted"),
-        disabled: "interactive.".concat(property, ".primary.disabled")
+        "default": "interactive.background.".concat(color, ".default"),
+        highlighted: "interactive.background.".concat(color, ".highlighted"),
+        disabled: "interactive.background.".concat(color, ".disabled")
       },
       secondary: {
-        "default": isBorder ? 'interactive.border.primary.default' : 'transparent',
-        highlighted: isBorder ? "interactive.border.primary.default" : "interactive.background.primary.faded",
-        disabled: isBorder ? "interactive.border.primary.disabled" : "transparent"
+        "default": 'surface.background.gray.intense',
+        highlighted: 'surface.background.gray.intense',
+        disabled: 'interactive.background.staticWhite.ghost'
       },
       tertiary: {
-        "default": "interactive.".concat(property, ".gray.default"),
-        highlighted: "interactive.".concat(property, ".gray.highlighted"),
-        disabled: "interactive.".concat(property, ".gray.disabled")
+        "default": 'surface.background.gray.intense',
+        highlighted: 'surface.background.gray.intense',
+        disabled: 'interactive.background.staticWhite.ghost'
       },
       transparent: {
         "default": 'transparent',
-        highlighted: "interactive.".concat(property, ".gray.faded"),
-        disabled: "interactive.".concat(property, ".gray.disabled")
+        highlighted: 'interactive.background.gray.faded',
+        disabled: 'interactive.background.gray.disabled'
       }
     },
     white: {
       primary: {
-        "default": "interactive.".concat(property, ".staticWhite.default"),
-        highlighted: "interactive.".concat(property, ".staticWhite.highlighted"),
-        disabled: "interactive.".concat(property, ".staticWhite.disabled")
+        "default": 'interactive.background.staticWhite.default',
+        highlighted: 'interactive.background.staticWhite.highlighted',
+        disabled: 'interactive.background.staticWhite.disabled'
       },
       secondary: {
-        "default": isBorder ? 'interactive.border.staticWhite.highlighted' : 'transparent',
-        highlighted: isBorder ? 'interactive.border.staticWhite.highlighted' : 'interactive.background.staticWhite.faded',
-        disabled: isBorder ? "interactive.border.staticWhite.disabled" : 'transparent'
+        "default": 'interactive.background.staticWhite.faded',
+        highlighted: 'interactive.background.staticBlack.faded',
+        disabled: 'interactive.background.gray.disabled'
       },
       tertiary: {
-        "default": "interactive.background.staticWhite.faded",
-        highlighted: "interactive.background.staticWhite.fadedHighlighted",
-        disabled: "interactive.background.staticWhite.disabled"
+        "default": 'interactive.background.staticWhite.faded',
+        highlighted: 'interactive.background.staticBlack.faded',
+        disabled: 'interactive.background.gray.disabled'
       }
-    },
-    transparent: {
+    }
+  };
+};
+/**
+ * Box-shadow tokens for buttons (includes border + 3D effects)
+ * Each shadow is: inset 0 {y}px {blur}px {spread}px {color}
+ */
+var boxShadow = function boxShadow(color) {
+  return {
+    base: {
+      primary: {
+        "default": [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: "interactive.border.".concat(color, ".highlighted")
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 0.5,
+          color: "interactive.border.".concat(color, ".default")
+        }, {
+          y: 1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticWhite.faded'
+        }, {
+          y: -2,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticWhite.faded'
+        }],
+        highlighted: [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: "interactive.border.".concat(color, ".highlighted")
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 0.5,
+          color: "interactive.border.".concat(color, ".highlighted")
+        }, {
+          y: 1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticWhite.faded'
+        }, {
+          y: -2,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticWhite.faded'
+        }],
+        disabled: []
+      },
+      secondary: {
+        "default": [{
+          y: -1,
+          blur: 0.5,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.default'
+        }, {
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.gray.default'
+        }],
+        highlighted: [{
+          y: -1,
+          blur: 0.5,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.highlighted'
+        }, {
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.gray.default'
+        }],
+        disabled: [{
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.disabled'
+        }]
+      },
       tertiary: {
-        "default": 'transparent',
-        highlighted: 'interactive.background.gray.faded',
-        disabled: "interactive.background.staticWhite.disabled"
+        "default": [{
+          y: -1,
+          blur: 0.5,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.default'
+        }, {
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.gray.default'
+        }],
+        highlighted: [{
+          y: -1,
+          blur: 0.5,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.highlighted'
+        }, {
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.gray.default'
+        }],
+        disabled: [{
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.gray.disabled'
+        }]
+      },
+      transparent: {
+        "default": [],
+        highlighted: [],
+        disabled: []
       }
     },
-    color: function color(_color) {
-      return {
-        primary: {
-          "default": "interactive.".concat(property, ".").concat(_color, ".default"),
-          highlighted: "interactive.".concat(property, ".").concat(_color, ".highlighted"),
-          disabled: "interactive.".concat(property, ".").concat(_color, ".disabled")
-        },
-        secondary: {
-          "default": isBorder ? "interactive.border.".concat(_color, ".default") : "interactive.background.".concat(_color, ".faded"),
-          highlighted: isBorder ? "interactive.border.".concat(_color, ".default") : "interactive.background.".concat(_color, ".fadedHighlighted"),
-          disabled: "interactive.".concat(property, ".").concat(_color, ".disabled")
-        }
-      };
+    white: {
+      primary: {
+        "default": [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 0.5,
+          color: 'interactive.border.staticWhite.default'
+        }],
+        highlighted: [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 0.5,
+          color: 'interactive.border.staticWhite.default'
+        }],
+        disabled: []
+      },
+      secondary: {
+        "default": [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.highlighted'
+        }],
+        highlighted: [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.highlighted'
+        }],
+        disabled: [{
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.disabled'
+        }]
+      },
+      tertiary: {
+        "default": [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.highlighted'
+        }],
+        highlighted: [{
+          y: -1.5,
+          blur: 0,
+          spread: 0,
+          color: 'interactive.border.staticBlack.fadedHighlighted'
+        }, {
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.highlighted'
+        }],
+        disabled: [{
+          y: 0,
+          blur: 0,
+          spread: 1,
+          color: 'interactive.border.staticWhite.disabled'
+        }]
+      }
     }
   };
 };
@@ -79,9 +284,9 @@ var textColor = function textColor(property) {
         disabled: "interactive.".concat(property, ".primary.disabled")
       },
       secondary: {
-        "default": "interactive.".concat(property, ".primary.subtle"),
-        highlighted: "interactive.".concat(property, ".primary.subtle"),
-        disabled: "interactive.".concat(property, ".primary.disabled")
+        "default": "interactive.".concat(property, ".gray.normal"),
+        highlighted: "interactive.".concat(property, ".gray.normal"),
+        disabled: "interactive.".concat(property, ".gray.disabled")
       },
       tertiary: {
         "default": "interactive.".concat(property, ".gray.normal"),
@@ -113,17 +318,17 @@ var textColor = function textColor(property) {
         disabled: "interactive.".concat(property, ".gray.disabled")
       }
     },
-    color: function color(_color2) {
+    color: function color(_color) {
       return {
         primary: {
           "default": "interactive.".concat(property, ".staticWhite.normal"),
           highlighted: "interactive.".concat(property, ".staticWhite.normal"),
-          disabled: "interactive.".concat(property, ".").concat(_color2, ".disabled")
+          disabled: "interactive.".concat(property, ".").concat(_color, ".disabled")
         },
         secondary: {
-          "default": "interactive.".concat(property, ".").concat(_color2, ".normal"),
-          highlighted: "interactive.".concat(property, ".").concat(_color2, ".normal"),
-          disabled: "interactive.".concat(property, ".").concat(_color2, ".disabled")
+          "default": "interactive.".concat(property, ".").concat(_color, ".normal"),
+          highlighted: "interactive.".concat(property, ".").concat(_color, ".normal"),
+          disabled: "interactive.".concat(property, ".").concat(_color, ".disabled")
         }
       };
     }
@@ -161,22 +366,28 @@ var buttonPadding = {
   small: {
     top: 0,
     bottom: 0,
-    left: 4,
-    right: 4
+    left: 3,
+    right: 3
   },
   medium: {
     top: 0,
     bottom: 0,
-    left: 6,
-    right: 6
+    left: 4,
+    right: 4
   },
   large: {
     top: 0,
     bottom: 0,
-    left: 6,
-    right: 6
+    left: 5,
+    right: 5
   }
 };
+var buttonBorderRadius = {
+  xsmall: 'small',
+  small: 'small',
+  medium: 'small',
+  large: 'medium'
+};
 var buttonIconOnlyHeightWidth = {
   xsmall: makeSize(size['28']),
   small: makeSize(size['32']),
@@ -197,16 +408,47 @@ var buttonIconOnlySizeToIconSizeMap = {
 };
 var buttonSizeToSpinnerSizeMap = {
   xsmall: 'medium',
-  small: 'large',
-  medium: 'large',
-  large: 'xlarge'
+  small: 'medium',
+  medium: 'medium',
+  large: 'large'
 };
-var buttonIconPadding = {
-  xsmall: 1,
-  small: 2,
-  medium: 3,
-  large: 3
+
+/**
+ * Spinner color mapping based on button variant and color
+ */
+var spinnerColor = {
+  base: {
+    primary: 'primary',
+    secondary: 'neutral',
+    tertiary: 'neutral',
+    transparent: 'primary'
+  },
+  white: {
+    primary: 'white',
+    secondary: 'white',
+    tertiary: 'white'
+  },
+  positive: {
+    primary: 'positive',
+    secondary: 'positive'
+  },
+  negative: {
+    primary: 'negative',
+    secondary: 'negative'
+  },
+  notice: {
+    primary: 'notice',
+    secondary: 'notice'
+  },
+  information: {
+    primary: 'information',
+    secondary: 'information'
+  },
+  neutral: {
+    primary: 'neutral',
+    secondary: 'neutral'
+  }
 };
 
-export { backgroundColor, buttonIconOnlyHeightWidth, buttonIconOnlySizeToIconSizeMap, buttonIconPadding, buttonPadding, buttonSizeToIconSizeMap, buttonSizeToSpinnerSizeMap, minHeight, textColor, typography };
+export { backgroundGradient, boxShadow, buttonBorderRadius, buttonIconOnlyHeightWidth, buttonIconOnlySizeToIconSizeMap, buttonPadding, buttonSizeToIconSizeMap, buttonSizeToSpinnerSizeMap, minHeight, spinnerColor, textColor, typography };
 //# sourceMappingURL=buttonTokens.js.map

package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"buttonTokens.js","sources":["../../../../../../../src/components/Button/BaseButton/buttonTokens.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport type { BaseButtonProps } from './BaseButton';\nimport type { Theme } from '~components/BladeProvider';\nimport type { IconSize } from '~components/Icons';\nimport type { SpinnerProps } from '~components/Spinner';\nimport type { Size } from '~tokens/global';\nimport { size } from '~tokens/global';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { makeSize } from '~utils';\n\nexport type ButtonMinHeight = Size[28] | Size[32] | Size[36] | Size[48];\n\nexport type ButtonTypography = {\n  fonts: {\n    size: Record<NonNullable<BaseButtonProps['size']>, keyof Theme['typography']['fonts']['size']>;\n  };\n  lineHeights: Record<\n    NonNullable<BaseButtonProps['size']>,\n    keyof Theme['typography']['lineHeights']\n  >;\n};\n\nconst backgroundColor = (property: 'background' | 'border') => {\n  const isBorder = property === 'border';\n  return {\n    base: {\n      primary: {\n        default: `interactive.${property}.primary.default`,\n        highlighted: `interactive.${property}.primary.highlighted`,\n        disabled: `interactive.${property}.primary.disabled`,\n      },\n      secondary: {\n        default: isBorder ? 'interactive.border.primary.default' : 'transparent',\n        highlighted: isBorder\n          ? `interactive.border.primary.default`\n          : `interactive.background.primary.faded`,\n        disabled: isBorder ? `interactive.border.primary.disabled` : `transparent`,\n      },\n      tertiary: {\n        default: `interactive.${property}.gray.default`,\n        highlighted: `interactive.${property}.gray.highlighted`,\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n      transparent: {\n        default: 'transparent',\n        highlighted: `interactive.${property}.gray.faded`,\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n    },\n    white: {\n      primary: {\n        default: `interactive.${property}.staticWhite.default`,\n        highlighted: `interactive.${property}.staticWhite.highlighted`,\n        disabled: `interactive.${property}.staticWhite.disabled`,\n      },\n      secondary: {\n        default: isBorder ? 'interactive.border.staticWhite.highlighted' : 'transparent',\n        highlighted: isBorder\n          ? 'interactive.border.staticWhite.highlighted'\n          : 'interactive.background.staticWhite.faded',\n        disabled: isBorder ? `interactive.border.staticWhite.disabled` : 'transparent',\n      },\n      tertiary: {\n        default: `interactive.background.staticWhite.faded`,\n        highlighted: `interactive.background.staticWhite.fadedHighlighted`,\n        disabled: `interactive.background.staticWhite.disabled`,\n      },\n    },\n    transparent: {\n      tertiary: {\n        default: 'transparent',\n        highlighted: 'interactive.background.gray.faded',\n        disabled: `interactive.background.staticWhite.disabled`,\n      },\n    },\n    color: (color: FeedbackColors) => {\n      return {\n        primary: {\n          default: `interactive.${property}.${color}.default`,\n          highlighted: `interactive.${property}.${color}.highlighted`,\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n        secondary: {\n          default: isBorder\n            ? (`interactive.border.${color}.default` as const)\n            : (`interactive.background.${color}.faded` as const),\n          highlighted: isBorder\n            ? (`interactive.border.${color}.default` as const)\n            : (`interactive.background.${color}.fadedHighlighted` as const),\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n      } as const;\n    },\n  } as const;\n};\n\nconst textColor = (property: 'icon' | 'text') => {\n  return {\n    base: {\n      primary: {\n        default: `interactive.${property}.onPrimary.normal`,\n        highlighted: `interactive.${property}.onPrimary.normal`,\n        disabled: `interactive.${property}.primary.disabled`,\n      },\n      secondary: {\n        default: `interactive.${property}.primary.subtle`,\n        highlighted: `interactive.${property}.primary.subtle`,\n        disabled: `interactive.${property}.primary.disabled`,\n      },\n      tertiary: {\n        default: `interactive.${property}.gray.normal`,\n        highlighted: `interactive.${property}.gray.normal`,\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n    },\n    white: {\n      primary: {\n        default: `interactive.${property}.staticBlack.muted`,\n        highlighted: `interactive.${property}.staticBlack.muted`,\n        disabled: `interactive.${property}.staticBlack.disabled`,\n      },\n      secondary: {\n        default: `interactive.${property}.staticWhite.normal`,\n        highlighted: `interactive.${property}.staticWhite.normal`,\n        disabled: `interactive.${property}.staticWhite.disabled`,\n      },\n      tertiary: {\n        default: `interactive.${property}.staticWhite.normal`,\n        highlighted: `interactive.${property}.staticWhite.normal`,\n        disabled: `interactive.${property}.staticWhite.disabled`,\n      },\n    },\n    transparent: {\n      tertiary: {\n        default: property === 'icon' ? 'interactive.icon.gray.muted' : 'surface.text.gray.normal',\n        highlighted:\n          property === 'icon' ? 'interactive.icon.gray.subtle' : 'surface.text.gray.normal',\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n    },\n\n    color: (color: FeedbackColors) => {\n      return {\n        primary: {\n          default: `interactive.${property}.staticWhite.normal`,\n          highlighted: `interactive.${property}.staticWhite.normal`,\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n        secondary: {\n          default: `interactive.${property}.${color}.normal`,\n          highlighted: `interactive.${property}.${color}.normal`,\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n      } as const;\n    },\n  } as const;\n};\n\nconst typography: ButtonTypography = {\n  fonts: {\n    size: {\n      xsmall: 75,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n  },\n  lineHeights: {\n    xsmall: 75,\n    small: 75,\n    medium: 100,\n    large: 200,\n  },\n};\n\nconst minHeight: Record<NonNullable<BaseButtonProps['size']>, ButtonMinHeight> = {\n  xsmall: size[28],\n  small: size[32],\n  medium: size[36],\n  large: size[48],\n};\n\nconst buttonPadding: Record<\n  NonNullable<BaseButtonProps['size']>,\n  Record<'top' | 'bottom' | 'left' | 'right', keyof Theme['spacing']>\n> = {\n  xsmall: {\n    top: 0,\n    bottom: 0,\n    left: 3,\n    right: 3,\n  },\n  small: {\n    top: 0,\n    bottom: 0,\n    left: 4,\n    right: 4,\n  },\n  medium: {\n    top: 0,\n    bottom: 0,\n    left: 6,\n    right: 6,\n  },\n  large: {\n    top: 0,\n    bottom: 0,\n    left: 6,\n    right: 6,\n  },\n};\n\nconst buttonIconOnlyHeightWidth = {\n  xsmall: makeSize(size['28']),\n  small: makeSize(size['32']),\n  medium: makeSize(size['36']),\n  large: makeSize(size['48']),\n} as const;\n\nconst buttonSizeToIconSizeMap: Record<NonNullable<BaseButtonProps['size']>, IconSize> = {\n  xsmall: 'small',\n  small: 'small',\n  medium: 'medium',\n  large: 'medium',\n};\n\nconst buttonIconOnlySizeToIconSizeMap: Record<NonNullable<BaseButtonProps['size']>, IconSize> = {\n  xsmall: 'medium',\n  small: 'medium',\n  medium: 'medium',\n  large: 'medium',\n};\n\nconst buttonSizeToSpinnerSizeMap: Record<\n  NonNullable<BaseButtonProps['size']>,\n  SpinnerProps['size']\n> = {\n  xsmall: 'medium',\n  small: 'large',\n  medium: 'large',\n  large: 'xlarge',\n};\n\nconst buttonIconPadding: Record<NonNullable<BaseButtonProps['size']>, keyof Theme['spacing']> = {\n  xsmall: 1,\n  small: 2,\n  medium: 3,\n  large: 3,\n};\n\nexport {\n  backgroundColor,\n  textColor,\n  typography,\n  minHeight,\n  buttonSizeToIconSizeMap,\n  buttonIconOnlySizeToIconSizeMap,\n  buttonSizeToSpinnerSizeMap,\n  buttonIconPadding,\n  buttonPadding,\n  buttonIconOnlyHeightWidth,\n};\n"],"names":["backgroundColor","property","isBorder","base","primary","concat","highlighted","disabled","secondary","tertiary","transparent","white","color","textColor","typography","fonts","size","xsmall","small","medium","large","lineHeights","minHeight","buttonPadding","top","bottom","left","right","buttonIconOnlyHeightWidth","makeSize","buttonSizeToIconSizeMap","buttonIconOnlySizeToIconSizeMap","buttonSizeToSpinnerSizeMap","buttonIconPadding"],"mappings":"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"}
+{"version":3,"file":"buttonTokens.js","sources":["../../../../../../../src/components/Button/BaseButton/buttonTokens.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport type { BaseButtonProps } from './BaseButton';\nimport type { Theme } from '~components/BladeProvider';\nimport type { IconSize } from '~components/Icons';\nimport type { SpinnerProps } from '~components/Spinner';\nimport type { Size } from '~tokens/global';\nimport { size } from '~tokens/global';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { makeSize } from '~utils';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\n\nexport type ButtonMinHeight = Size[28] | Size[32] | Size[36] | Size[48];\n\nexport type ButtonTypography = {\n  fonts: {\n    size: Record<NonNullable<BaseButtonProps['size']>, keyof Theme['typography']['fonts']['size']>;\n  };\n  lineHeights: Record<\n    NonNullable<BaseButtonProps['size']>,\n    keyof Theme['typography']['lineHeights']\n  >;\n};\n\nconst backgroundGradient = (color: FeedbackColors | 'primary') => {\n  return {\n    base: {\n      primary: {\n        default: `interactive.background.${color}.default`,\n        highlighted: `interactive.background.${color}.highlighted`,\n        disabled: `interactive.background.${color}.disabled`,\n      },\n      secondary: {\n        default: 'surface.background.gray.intense',\n        highlighted: 'surface.background.gray.intense',\n        disabled: 'interactive.background.staticWhite.ghost',\n      },\n      tertiary: {\n        default: 'surface.background.gray.intense',\n        highlighted: 'surface.background.gray.intense',\n        disabled: 'interactive.background.staticWhite.ghost',\n      },\n      transparent: {\n        default: 'transparent',\n        highlighted: 'interactive.background.gray.faded',\n        disabled: 'interactive.background.gray.disabled',\n      },\n    },\n    white: {\n      primary: {\n        default: 'interactive.background.staticWhite.default',\n        highlighted: 'interactive.background.staticWhite.highlighted',\n        disabled: 'interactive.background.staticWhite.disabled',\n      },\n      secondary: {\n        default: 'interactive.background.staticWhite.faded',\n        highlighted: 'interactive.background.staticBlack.faded',\n        disabled: 'interactive.background.gray.disabled',\n      },\n      tertiary: {\n        default: 'interactive.background.staticWhite.faded',\n        highlighted: 'interactive.background.staticBlack.faded',\n        disabled: 'interactive.background.gray.disabled',\n      },\n    },\n  } as const;\n};\n\ntype BoxShadowValue = {\n  y: number;\n  blur: number;\n  spread: number;\n  color: DotNotationToken<Theme['colors']>;\n};\n\ntype ButtonBoxShadow = BoxShadowValue[];\n\n/**\n * Box-shadow tokens for buttons (includes border + 3D effects)\n * Each shadow is: inset 0 {y}px {blur}px {spread}px {color}\n */\nconst boxShadow = (\n  color: FeedbackColors | 'primary',\n): {\n  base: Record<\n    'primary' | 'secondary' | 'tertiary' | 'transparent',\n    Record<'default' | 'highlighted' | 'disabled', ButtonBoxShadow>\n  >;\n  white: Record<\n    'primary' | 'secondary' | 'tertiary',\n    Record<'default' | 'highlighted' | 'disabled', ButtonBoxShadow>\n  >;\n} => {\n  return {\n    base: {\n      primary: {\n        default: [\n          { y: -1.5, blur: 0, spread: 0, color: `interactive.border.${color}.highlighted` },\n          { y: 0, blur: 0, spread: 0.5, color: `interactive.border.${color}.default` },\n          { y: 1.5, blur: 0, spread: 0, color: 'interactive.border.staticWhite.faded' },\n          { y: -2, blur: 0, spread: 0, color: 'interactive.border.staticWhite.faded' },\n        ],\n        highlighted: [\n          { y: -1.5, blur: 0, spread: 0, color: `interactive.border.${color}.highlighted` },\n          { y: 0, blur: 0, spread: 0.5, color: `interactive.border.${color}.highlighted` },\n          { y: 1.5, blur: 0, spread: 0, color: 'interactive.border.staticWhite.faded' },\n          { y: -2, blur: 0, spread: 0, color: 'interactive.border.staticWhite.faded' },\n        ],\n        disabled: [],\n      },\n      secondary: {\n        default: [\n          { y: -1, blur: 0.5, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.default' },\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.gray.default' },\n        ],\n        highlighted: [\n          { y: -1, blur: 0.5, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.highlighted' },\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.gray.default' },\n        ],\n        disabled: [{ y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.disabled' }],\n      },\n      tertiary: {\n        default: [\n          { y: -1, blur: 0.5, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.default' },\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.gray.default' },\n        ],\n        highlighted: [\n          { y: -1, blur: 0.5, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.highlighted' },\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.gray.default' },\n        ],\n        disabled: [{ y: 0, blur: 0, spread: 1, color: 'interactive.border.gray.disabled' }],\n      },\n      transparent: {\n        default: [],\n        highlighted: [],\n        disabled: [],\n      },\n    },\n    white: {\n      primary: {\n        default: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 0.5, color: 'interactive.border.staticWhite.default' },\n        ],\n        highlighted: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 0.5, color: 'interactive.border.staticWhite.default' },\n        ],\n        disabled: [],\n      },\n      secondary: {\n        default: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.highlighted' },\n        ],\n        highlighted: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.highlighted' },\n        ],\n        disabled: [{ y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.disabled' }],\n      },\n      tertiary: {\n        default: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.highlighted' },\n        ],\n        highlighted: [\n          { y: -1.5, blur: 0, spread: 0, color: 'interactive.border.staticBlack.fadedHighlighted' },\n          { y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.highlighted' },\n        ],\n        disabled: [{ y: 0, blur: 0, spread: 1, color: 'interactive.border.staticWhite.disabled' }],\n      },\n    },\n  };\n};\n\nconst textColor = (property: 'icon' | 'text') => {\n  return {\n    base: {\n      primary: {\n        default: `interactive.${property}.onPrimary.normal`,\n        highlighted: `interactive.${property}.onPrimary.normal`,\n        disabled: `interactive.${property}.primary.disabled`,\n      },\n      secondary: {\n        default: `interactive.${property}.gray.normal`,\n        highlighted: `interactive.${property}.gray.normal`,\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n      tertiary: {\n        default: `interactive.${property}.gray.normal`,\n        highlighted: `interactive.${property}.gray.normal`,\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n    },\n    white: {\n      primary: {\n        default: `interactive.${property}.staticBlack.muted`,\n        highlighted: `interactive.${property}.staticBlack.muted`,\n        disabled: `interactive.${property}.staticBlack.disabled`,\n      },\n      secondary: {\n        default: `interactive.${property}.staticWhite.normal`,\n        highlighted: `interactive.${property}.staticWhite.normal`,\n        disabled: `interactive.${property}.staticWhite.disabled`,\n      },\n      tertiary: {\n        default: `interactive.${property}.staticWhite.normal`,\n        highlighted: `interactive.${property}.staticWhite.normal`,\n        disabled: `interactive.${property}.staticWhite.disabled`,\n      },\n    },\n    transparent: {\n      tertiary: {\n        default: property === 'icon' ? 'interactive.icon.gray.muted' : 'surface.text.gray.normal',\n        highlighted:\n          property === 'icon' ? 'interactive.icon.gray.subtle' : 'surface.text.gray.normal',\n        disabled: `interactive.${property}.gray.disabled`,\n      },\n    },\n\n    color: (color: FeedbackColors) => {\n      return {\n        primary: {\n          default: `interactive.${property}.staticWhite.normal`,\n          highlighted: `interactive.${property}.staticWhite.normal`,\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n        secondary: {\n          default: `interactive.${property}.${color}.normal`,\n          highlighted: `interactive.${property}.${color}.normal`,\n          disabled: `interactive.${property}.${color}.disabled`,\n        },\n      } as const;\n    },\n  } as const;\n};\n\nconst typography: ButtonTypography = {\n  fonts: {\n    size: {\n      xsmall: 75,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n  },\n  lineHeights: {\n    xsmall: 75,\n    small: 75,\n    medium: 100,\n    large: 200,\n  },\n};\n\nconst minHeight: Record<NonNullable<BaseButtonProps['size']>, ButtonMinHeight> = {\n  xsmall: size[28],\n  small: size[32],\n  medium: size[36],\n  large: size[48],\n};\n\nconst buttonPadding: Record<\n  NonNullable<BaseButtonProps['size']>,\n  Record<'top' | 'bottom' | 'left' | 'right', keyof Theme['spacing']>\n> = {\n  xsmall: {\n    top: 0,\n    bottom: 0,\n    left: 3,\n    right: 3,\n  },\n  small: {\n    top: 0,\n    bottom: 0,\n    left: 3,\n    right: 3,\n  },\n  medium: {\n    top: 0,\n    bottom: 0,\n    left: 4,\n    right: 4,\n  },\n  large: {\n    top: 0,\n    bottom: 0,\n    left: 5,\n    right: 5,\n  },\n};\n\nconst buttonBorderRadius = {\n  xsmall: 'small',\n  small: 'small',\n  medium: 'small',\n  large: 'medium',\n} as const;\n\nconst buttonIconOnlyHeightWidth = {\n  xsmall: makeSize(size['28']),\n  small: makeSize(size['32']),\n  medium: makeSize(size['36']),\n  large: makeSize(size['48']),\n} as const;\n\nconst buttonSizeToIconSizeMap: Record<NonNullable<BaseButtonProps['size']>, IconSize> = {\n  xsmall: 'small',\n  small: 'small',\n  medium: 'medium',\n  large: 'medium',\n};\n\nconst buttonIconOnlySizeToIconSizeMap: Record<NonNullable<BaseButtonProps['size']>, IconSize> = {\n  xsmall: 'medium',\n  small: 'medium',\n  medium: 'medium',\n  large: 'medium',\n};\n\nconst buttonSizeToSpinnerSizeMap: Record<\n  NonNullable<BaseButtonProps['size']>,\n  SpinnerProps['size']\n> = {\n  xsmall: 'medium',\n  small: 'medium',\n  medium: 'medium',\n  large: 'large',\n};\n\n/**\n * Spinner color mapping based on button variant and color\n */\nconst spinnerColor = {\n  base: {\n    primary: 'primary',\n    secondary: 'neutral',\n    tertiary: 'neutral',\n    transparent: 'primary',\n  },\n  white: {\n    primary: 'white',\n    secondary: 'white',\n    tertiary: 'white',\n  },\n  positive: {\n    primary: 'positive',\n    secondary: 'positive',\n  },\n  negative: {\n    primary: 'negative',\n    secondary: 'negative',\n  },\n  notice: {\n    primary: 'notice',\n    secondary: 'notice',\n  },\n  information: {\n    primary: 'information',\n    secondary: 'information',\n  },\n  neutral: {\n    primary: 'neutral',\n    secondary: 'neutral',\n  },\n} as const;\n\nexport {\n  boxShadow,\n  backgroundGradient,\n  textColor,\n  spinnerColor,\n  typography,\n  minHeight,\n  buttonSizeToIconSizeMap,\n  buttonIconOnlySizeToIconSizeMap,\n  buttonSizeToSpinnerSizeMap,\n  buttonPadding,\n  buttonIconOnlyHeightWidth,\n  buttonBorderRadius,\n};\n\nexport type { ButtonBoxShadow };\n"],"names":["backgroundGradient","color","base","primary","concat","highlighted","disabled","secondary","tertiary","transparent","white","boxShadow","y","blur","spread","textColor","property","typography","fonts","size","xsmall","small","medium","large","lineHeights","minHeight","buttonPadding","top","bottom","left","right","buttonBorderRadius","buttonIconOnlyHeightWidth","makeSize","buttonSizeToIconSizeMap","buttonIconOnlySizeToIconSizeMap","buttonSizeToSpinnerSizeMap","spinnerColor","positive","negative","notice","information","neutral"],"mappings":"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"}

package/build/lib/web/development/components/Button/BaseButton/getStyledBaseButtonStyles.js

@@ -1,14 +1,13 @@
 var getBaseButtonStyles = function getBaseButtonStyles(_ref) {
-  var defaultBorderColor = _ref.defaultBorderColor,
-    minHeight = _ref.minHeight,
+  var minHeight = _ref.minHeight,
     buttonPaddingTop = _ref.buttonPaddingTop,
     buttonPaddingBottom = _ref.buttonPaddingBottom,
     buttonPaddingLeft = _ref.buttonPaddingLeft,
     buttonPaddingRight = _ref.buttonPaddingRight,
     defaultBackgroundColor = _ref.defaultBackgroundColor,
+    defaultBoxShadow = _ref.defaultBoxShadow,
     disabled = _ref.disabled,
     isFullWidth = _ref.isFullWidth,
-    borderWidth = _ref.borderWidth,
     borderRadius = _ref.borderRadius,
     height = _ref.height,
     _ref$width = _ref.width,
@@ -19,10 +18,9 @@ var getBaseButtonStyles = function getBaseButtonStyles(_ref) {
     width: isFullWidth ? '100%' : width,
     cursor: disabled ? 'not-allowed' : 'pointer',
     backgroundColor: defaultBackgroundColor,
-    borderColor: defaultBorderColor,
-    borderWidth: borderWidth,
+    border: 'none',
     borderRadius: borderRadius,
-    borderStyle: 'solid',
+    boxShadow: defaultBoxShadow,
     paddingTop: buttonPaddingTop,
     paddingBottom: buttonPaddingBottom,
     paddingLeft: buttonPaddingLeft,

package/build/lib/web/development/components/Button/BaseButton/getStyledBaseButtonStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"getStyledBaseButtonStyles.js","sources":["../../../../../../../src/components/Button/BaseButton/getStyledBaseButtonStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { StyledBaseButtonProps } from './types';\n\nconst getBaseButtonStyles = ({\n  defaultBorderColor,\n  minHeight,\n  buttonPaddingTop,\n  buttonPaddingBottom,\n  buttonPaddingLeft,\n  buttonPaddingRight,\n  defaultBackgroundColor,\n  disabled,\n  isFullWidth,\n  borderWidth,\n  borderRadius,\n  height,\n  width = 'auto',\n}: Omit<\n  StyledBaseButtonProps,\n  'children' | 'onClick' | 'accessibilityProps' | 'accessibilityLabel'\n>): CSSObject => ({\n  minHeight,\n  height,\n  width: isFullWidth ? '100%' : width,\n  cursor: disabled ? 'not-allowed' : 'pointer',\n  backgroundColor: defaultBackgroundColor,\n  borderColor: defaultBorderColor,\n  borderWidth,\n  borderRadius,\n  borderStyle: 'solid',\n  paddingTop: buttonPaddingTop,\n  paddingBottom: buttonPaddingBottom,\n  paddingLeft: buttonPaddingLeft,\n  paddingRight: buttonPaddingRight,\n  justifyContent: 'center',\n  alignItems: 'center',\n  textDecoration: 'none',\n  overflow: 'hidden',\n});\n\nexport default getBaseButtonStyles;\n"],"names":["getBaseButtonStyles","_ref","defaultBorderColor","minHeight","buttonPaddingTop","buttonPaddingBottom","buttonPaddingLeft","buttonPaddingRight","defaultBackgroundColor","disabled","isFullWidth","borderWidth","borderRadius","height","_ref$width","width","cursor","backgroundColor","borderColor","borderStyle","paddingTop","paddingBottom","paddingLeft","paddingRight","justifyContent","alignItems","textDecoration","overflow"],"mappings":"AAGA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IACvBC,kBAAkB,GAAAD,IAAA,CAAlBC,kBAAkB;IAClBC,SAAS,GAAAF,IAAA,CAATE,SAAS;IACTC,gBAAgB,GAAAH,IAAA,CAAhBG,gBAAgB;IAChBC,mBAAmB,GAAAJ,IAAA,CAAnBI,mBAAmB;IACnBC,iBAAiB,GAAAL,IAAA,CAAjBK,iBAAiB;IACjBC,kBAAkB,GAAAN,IAAA,CAAlBM,kBAAkB;IAClBC,sBAAsB,GAAAP,IAAA,CAAtBO,sBAAsB;IACtBC,QAAQ,GAAAR,IAAA,CAARQ,QAAQ;IACRC,WAAW,GAAAT,IAAA,CAAXS,WAAW;IACXC,WAAW,GAAAV,IAAA,CAAXU,WAAW;IACXC,YAAY,GAAAX,IAAA,CAAZW,YAAY;IACZC,MAAM,GAAAZ,IAAA,CAANY,MAAM;IAAAC,UAAA,GAAAb,IAAA,CACNc,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,UAAA,CAAA;EAAA,OAIE;AAChBX,IAAAA,SAAS,EAATA,SAAS;AACTU,IAAAA,MAAM,EAANA,MAAM;AACNE,IAAAA,KAAK,EAAEL,WAAW,GAAG,MAAM,GAAGK,KAAK;AACnCC,IAAAA,MAAM,EAAEP,QAAQ,GAAG,aAAa,GAAG,SAAS;AAC5CQ,IAAAA,eAAe,EAAET,sBAAsB;AACvCU,IAAAA,WAAW,EAAEhB,kBAAkB;AAC/BS,IAAAA,WAAW,EAAXA,WAAW;AACXC,IAAAA,YAAY,EAAZA,YAAY;AACZO,IAAAA,WAAW,EAAE,OAAO;AACpBC,IAAAA,UAAU,EAAEhB,gBAAgB;AAC5BiB,IAAAA,aAAa,EAAEhB,mBAAmB;AAClCiB,IAAAA,WAAW,EAAEhB,iBAAiB;AAC9BiB,IAAAA,YAAY,EAAEhB,kBAAkB;AAChCiB,IAAAA,cAAc,EAAE,QAAQ;AACxBC,IAAAA,UAAU,EAAE,QAAQ;AACpBC,IAAAA,cAAc,EAAE,MAAM;AACtBC,IAAAA,QAAQ,EAAE,QAAA;GACX,CAAA;AAAA;;;;"}
+{"version":3,"file":"getStyledBaseButtonStyles.js","sources":["../../../../../../../src/components/Button/BaseButton/getStyledBaseButtonStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { StyledBaseButtonProps } from './types';\n\nconst getBaseButtonStyles = ({\n  minHeight,\n  buttonPaddingTop,\n  buttonPaddingBottom,\n  buttonPaddingLeft,\n  buttonPaddingRight,\n  defaultBackgroundColor,\n  defaultBoxShadow,\n  disabled,\n  isFullWidth,\n  borderRadius,\n  height,\n  width = 'auto',\n}: Omit<\n  StyledBaseButtonProps,\n  'children' | 'onClick' | 'accessibilityProps' | 'accessibilityLabel'\n>): CSSObject => ({\n  minHeight,\n  height,\n  width: isFullWidth ? '100%' : width,\n  cursor: disabled ? 'not-allowed' : 'pointer',\n  backgroundColor: defaultBackgroundColor,\n  border: 'none',\n  borderRadius,\n  boxShadow: defaultBoxShadow,\n  paddingTop: buttonPaddingTop,\n  paddingBottom: buttonPaddingBottom,\n  paddingLeft: buttonPaddingLeft,\n  paddingRight: buttonPaddingRight,\n  justifyContent: 'center',\n  alignItems: 'center',\n  textDecoration: 'none',\n  overflow: 'hidden',\n});\n\nexport default getBaseButtonStyles;\n"],"names":["getBaseButtonStyles","_ref","minHeight","buttonPaddingTop","buttonPaddingBottom","buttonPaddingLeft","buttonPaddingRight","defaultBackgroundColor","defaultBoxShadow","disabled","isFullWidth","borderRadius","height","_ref$width","width","cursor","backgroundColor","border","boxShadow","paddingTop","paddingBottom","paddingLeft","paddingRight","justifyContent","alignItems","textDecoration","overflow"],"mappings":"AAGA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IACvBC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,gBAAgB,GAAAF,IAAA,CAAhBE,gBAAgB;IAChBC,mBAAmB,GAAAH,IAAA,CAAnBG,mBAAmB;IACnBC,iBAAiB,GAAAJ,IAAA,CAAjBI,iBAAiB;IACjBC,kBAAkB,GAAAL,IAAA,CAAlBK,kBAAkB;IAClBC,sBAAsB,GAAAN,IAAA,CAAtBM,sBAAsB;IACtBC,gBAAgB,GAAAP,IAAA,CAAhBO,gBAAgB;IAChBC,QAAQ,GAAAR,IAAA,CAARQ,QAAQ;IACRC,WAAW,GAAAT,IAAA,CAAXS,WAAW;IACXC,YAAY,GAAAV,IAAA,CAAZU,YAAY;IACZC,MAAM,GAAAX,IAAA,CAANW,MAAM;IAAAC,UAAA,GAAAZ,IAAA,CACNa,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,UAAA,CAAA;EAAA,OAIE;AAChBX,IAAAA,SAAS,EAATA,SAAS;AACTU,IAAAA,MAAM,EAANA,MAAM;AACNE,IAAAA,KAAK,EAAEJ,WAAW,GAAG,MAAM,GAAGI,KAAK;AACnCC,IAAAA,MAAM,EAAEN,QAAQ,GAAG,aAAa,GAAG,SAAS;AAC5CO,IAAAA,eAAe,EAAET,sBAAsB;AACvCU,IAAAA,MAAM,EAAE,MAAM;AACdN,IAAAA,YAAY,EAAZA,YAAY;AACZO,IAAAA,SAAS,EAAEV,gBAAgB;AAC3BW,IAAAA,UAAU,EAAEhB,gBAAgB;AAC5BiB,IAAAA,aAAa,EAAEhB,mBAAmB;AAClCiB,IAAAA,WAAW,EAAEhB,iBAAiB;AAC9BiB,IAAAA,YAAY,EAAEhB,kBAAkB;AAChCiB,IAAAA,cAAc,EAAE,QAAQ;AACxBC,IAAAA,UAAU,EAAE,QAAQ;AACpBC,IAAAA,cAAc,EAAE,MAAM;AACtBC,IAAAA,QAAQ,EAAE,QAAA;GACX,CAAA;AAAA;;;;"}

package/build/lib/web/development/components/Button/IconButton/StyledIconButton.web.js

@@ -2,7 +2,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import styled from 'styled-components';
 import React__default from 'react';
-import { highlightedButtonSizeMap, highlightedHoverColorMap } from './tokens.js';
+import { highlightedButtonSizeMap, highlightedHoverColorMap, focusBackgroundColorMap } from './tokens.js';
 import '../../../utils/index.js';
 import '../../../utils/metaAttribute/index.js';
 import '../../../utils/makeAccessible/index.js';
@@ -53,7 +53,7 @@ var StyledButton = /*#__PURE__*/styled.button.withConfig({
     // We throw error for size large on top
     makeSize(highlightedButtonSizeMap[props.$size]) : undefined,
     width: props.$isHighlighted ? makeSize(highlightedButtonSizeMap[props.$size]) : undefined,
-    borderRadius: props.$isHighlighted ? theme.border.radius.round : theme.border.radius.small,
+    borderRadius: props.$isHighlighted ? theme.border.radius.small : theme.border.radius['2xsmall'],
     background: 'transparent',
     display: 'flex',
     alignItems: 'center',
@@ -69,7 +69,8 @@ var StyledButton = /*#__PURE__*/styled.button.withConfig({
     '&:focus-visible': _objectSpread(_objectSpread({}, getFocusRingStyles({
       theme: theme
     })), {}, {
-      color: theme.colors.interactive.icon[emphasisColor].subtle
+      color: theme.colors.interactive.icon[emphasisColor].subtle,
+      backgroundColor: props.$isHighlighted ? getIn(theme.colors, focusBackgroundColorMap[emphasis]) : 'transparent'
     }),
     '&:active': {
       color: theme.colors.interactive.icon[emphasisColor].subtle