fix: update text to border-less and link to text

Author: eshankvaish

src/Shared/Components/Button/button.scss

@@ -106,9 +106,9 @@
         }
     }
 
-    // Base styling is same for text and link button
-    &__text,
-    &__link {
+    // Base styling is same for border-less and text button
+    &__border-less,
+    &__text {
         $background: transparent;
         $border-color: transparent;
 
@@ -133,8 +133,8 @@
         }
     }
 
-    // Pseudo states for text button
-    &__text {
+    // Pseudo states for border-less button
+    &__border-less {
         &--default {
             @include pseudo-states(var(--B100), var(--B200));
         }
@@ -156,8 +156,8 @@
         }
     }
 
-    // Overrides for link button
-    &__link {
+    // Overrides for text button
+    &__text {
 
         &--default,
         &--negative,

src/Shared/Components/Button/types.ts

@@ -2,11 +2,12 @@ import { TooltipProps } from '@Common/Tooltip/types'
 import { ComponentSizeType } from '@Shared/constants'
 import { ButtonHTMLAttributes, ReactElement } from 'react'
 
+// Using the same for BEM class elements
 export enum ButtonVariantType {
     primary = 'primary',
     secondary = 'secondary',
+    borderLess = 'border-less',
     text = 'text',
-    link = 'link',
 }
 
 export enum ButtonStyleType {

src/Shared/Components/Button/utils.ts

@@ -1,10 +1,10 @@
 import { BUTTON_SIZE_TO_CLASS_NAME_MAP } from './constants'
-import { ButtonProps, ButtonStyleType, ButtonVariantType } from './types'
+import { ButtonProps } from './types'
 
 export const getButtonDerivedClass = ({
     size,
     variant,
     style,
     isLoading,
 }: Pick<ButtonProps, 'variant' | 'size' | 'style' | 'isLoading'>) =>
-    `button button__${ButtonVariantType[variant]}--${ButtonStyleType[style]} ${BUTTON_SIZE_TO_CLASS_NAME_MAP[size]} ${isLoading ? 'button--loading' : ''}`
+    `button button__${variant}--${style} ${BUTTON_SIZE_TO_CLASS_NAME_MAP[size]} ${isLoading ? 'button--loading' : ''}`