refactor: rename SwitchProps to DTSwitchProps for consistency across Switch component

Author: AbhishekA1509

src/Shared/Components/Switch/Switch.component.tsx

@@ -7,7 +7,7 @@ import { getUniqueId } from '@Shared/Helpers'
 
 import { Icon } from '../Icon'
 import { INDETERMINATE_ICON_WIDTH_MAP, LOADING_COLOR_MAP } from './constants'
-import { SwitchProps } from './types'
+import { DTSwitchProps } from './types'
 import {
     getSwitchContainerClass,
     getSwitchIconColor,
@@ -32,7 +32,7 @@ const Switch = ({
     size = ComponentSizeType.medium,
     name,
     onChange,
-}: SwitchProps) => {
+}: DTSwitchProps) => {
     const inputId = useRef(getUniqueId())
 
     const getAriaCheckedValue = (): AriaAttributes['aria-checked'] => {

src/Shared/Components/Switch/constants.ts

@@ -1,19 +1,19 @@
 import { ComponentSizeType } from '@Shared/constants'
 import { IconBaseColorType } from '@Shared/types'
 
-import { SwitchProps } from './types'
+import { DTSwitchProps } from './types'
 
-export const SWITCH_VARIANTS: Readonly<Record<SwitchProps['variant'], null>> = {
+export const SWITCH_VARIANTS: Readonly<Record<DTSwitchProps['variant'], null>> = {
     theme: null,
     positive: null,
 }
 
-export const SWITCH_SHAPES: Readonly<Record<SwitchProps['shape'], null>> = {
+export const SWITCH_SHAPES: Readonly<Record<DTSwitchProps['shape'], null>> = {
     rounded: null,
     square: null,
 }
 
-export const ROUNDED_SWITCH_SIZE_MAP: Readonly<Record<SwitchProps['size'], string>> = {
+export const ROUNDED_SWITCH_SIZE_MAP: Readonly<Record<DTSwitchProps['size'], string>> = {
     [ComponentSizeType.medium]: 'w-32',
     [ComponentSizeType.small]: 'w-24',
 }
@@ -23,17 +23,17 @@ export const SQUARE_SWITCH_SIZE_MAP: typeof ROUNDED_SWITCH_SIZE_MAP = {
     [ComponentSizeType.small]: 'w-24',
 }
 
-export const SWITCH_HEIGHT_MAP: Readonly<Record<SwitchProps['size'], string>> = {
+export const SWITCH_HEIGHT_MAP: Readonly<Record<DTSwitchProps['size'], string>> = {
     [ComponentSizeType.medium]: 'h-24',
     [ComponentSizeType.small]: 'h-20',
 }
 
-export const LOADING_COLOR_MAP: Record<SwitchProps['variant'], IconBaseColorType> = {
+export const LOADING_COLOR_MAP: Record<DTSwitchProps['variant'], IconBaseColorType> = {
     theme: 'B500',
     positive: 'G500',
 }
 
-export const ROUNDED_SWITCH_TRACK_COLOR_MAP: Record<SwitchProps['variant'], string> = {
+export const ROUNDED_SWITCH_TRACK_COLOR_MAP: Record<DTSwitchProps['variant'], string> = {
     theme: 'bcb-5',
     positive: 'bcg-5',
 }
@@ -43,22 +43,22 @@ export const SQUARE_SWITCH_TRACK_COLOR_MAP: typeof ROUNDED_SWITCH_TRACK_COLOR_MA
     positive: 'bcg-3',
 }
 
-export const ROUNDED_SWITCH_THUMB_SIZE_MAP: Record<SwitchProps['size'], string> = {
+export const ROUNDED_SWITCH_THUMB_SIZE_MAP: Record<DTSwitchProps['size'], string> = {
     [ComponentSizeType.medium]: 'icon-dim-16',
     [ComponentSizeType.small]: 'icon-dim-12',
 }
 
-export const INDETERMINATE_ICON_WIDTH_MAP: Record<SwitchProps['size'], string> = {
+export const INDETERMINATE_ICON_WIDTH_MAP: Record<DTSwitchProps['size'], string> = {
     [ComponentSizeType.medium]: 'w-12',
     [ComponentSizeType.small]: 'w-10',
 }
 
-export const SWITCH_THUMB_PADDING_MAP: Record<SwitchProps['size'], string> = {
+export const SWITCH_THUMB_PADDING_MAP: Record<DTSwitchProps['size'], string> = {
     [ComponentSizeType.medium]: 'p-3',
     [ComponentSizeType.small]: 'p-1',
 }
 
-export const THUMB_OUTER_PADDING_MAP: Record<SwitchProps['shape'], string> = {
+export const THUMB_OUTER_PADDING_MAP: Record<DTSwitchProps['shape'], string> = {
     rounded: 'p-2',
     square: 'p-1',
 }

src/Shared/Components/Switch/index.ts

@@ -1,3 +1,3 @@
 export { SWITCH_SHAPES, SWITCH_VARIANTS } from './constants'
-export { default as Switch } from './Switch.component'
-export type { SwitchProps } from './types'
+export { default as DTSwitch } from './Switch.component'
+export type { DTSwitchProps } from './types'

src/Shared/Components/Switch/types.ts

@@ -63,7 +63,7 @@ type SwitchShapeProps =
 /**
  * Represents the properties for the `Switch` component.
  */
-export type SwitchProps = {
+export type DTSwitchProps = {
     /**
      * The ARIA label for the switch, used for accessibility purposes.
      */

src/Shared/Components/Switch/utils.ts

@@ -10,17 +10,17 @@ import {
     SWITCH_THUMB_PADDING_MAP,
     THUMB_OUTER_PADDING_MAP,
 } from './constants'
-import { SwitchProps } from './types'
+import { DTSwitchProps } from './types'
 
-export const getSwitchContainerClass = ({ shape, size }: Required<Pick<SwitchProps, 'shape' | 'size'>>): string =>
+export const getSwitchContainerClass = ({ shape, size }: Required<Pick<DTSwitchProps, 'shape' | 'size'>>): string =>
     `${SWITCH_HEIGHT_MAP[size]} ${shape === 'rounded' ? ROUNDED_SWITCH_SIZE_MAP[size] : SQUARE_SWITCH_SIZE_MAP[size]}`
 
 export const getSwitchTrackColor = ({
     shape,
     variant,
     isChecked,
     isLoading,
-}: Required<Pick<SwitchProps, 'shape' | 'variant' | 'isChecked' | 'isLoading'>>): string => {
+}: Required<Pick<DTSwitchProps, 'shape' | 'variant' | 'isChecked' | 'isLoading'>>): string => {
     if (isLoading) {
         return 'dc__transparent--unstyled'
     }
@@ -36,7 +36,7 @@ export const getSwitchThumbClass = ({
     shape,
     size,
     showIndeterminateIcon,
-}: Pick<SwitchProps, 'shape' | 'size'> & { showIndeterminateIcon: boolean }) => {
+}: Pick<DTSwitchProps, 'shape' | 'size'> & { showIndeterminateIcon: boolean }) => {
     if (showIndeterminateIcon) {
         return 'w-100 h-100 flex'
     }
@@ -48,7 +48,7 @@ export const getSwitchIconColor = ({
     iconColor,
     isChecked,
     variant,
-}: Pick<SwitchProps, 'iconColor' | 'isChecked' | 'variant'>): IconBaseColorType => {
+}: Pick<DTSwitchProps, 'iconColor' | 'isChecked' | 'variant'>): IconBaseColorType => {
     if (!isChecked) {
         return 'N200'
     }
@@ -59,15 +59,15 @@ export const getSwitchIconColor = ({
 export const getThumbPosition = ({
     isLoading,
     isChecked,
-}: Pick<SwitchProps, 'isLoading' | 'isChecked'>): 'left' | 'right' | 'center' => {
+}: Pick<DTSwitchProps, 'isLoading' | 'isChecked'>): 'left' | 'right' | 'center' => {
     if (isLoading) {
         return 'center'
     }
 
     return isChecked ? 'right' : 'left'
 }
 
-export const getThumbPadding = ({ shape, isLoading }: Pick<SwitchProps, 'shape' | 'isLoading'>): string => {
+export const getThumbPadding = ({ shape, isLoading }: Pick<DTSwitchProps, 'shape' | 'isLoading'>): string => {
     if (isLoading) {
         return ''
     }