@metamask/design-system-react-native
Version:
1 lines • 5.83 kB
Source Map (JSON)
{"version":3,"file":"ButtonTertiary.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback } from 'react';\n\nimport { ButtonBase } from '../../../ButtonBase';\nimport { IconSize } from '../../../Icon';\nimport { TextVariant, FontWeight } from '../../../Text';\n\nimport type { ButtonTertiaryProps } from './ButtonTertiary.types';\n\nexport const ButtonTertiary = ({\n children,\n textProps,\n spinnerProps,\n startIconProps,\n endIconProps,\n isDanger = false,\n isInverse = false,\n isLoading = false,\n twClassName = '',\n style,\n ...props\n}: ButtonTertiaryProps) => {\n const getContainerClassName = useCallback(\n (pressed: boolean): string => {\n const classNameStr =\n typeof twClassName === 'function' ? twClassName(pressed) : twClassName;\n\n const baseClasses = `\n ${isInverse && !isDanger ? 'border-[1.5px]' : 'border-0'}\n ${classNameStr}\n `;\n\n let backgroundClass = '';\n let borderClass = '';\n\n if (isInverse && isDanger) {\n backgroundClass =\n pressed || isLoading ? 'bg-default-pressed' : 'bg-default';\n borderClass =\n pressed || isLoading\n ? 'border-background-default-pressed'\n : 'border-background-default';\n } else if (isDanger) {\n backgroundClass =\n pressed || isLoading ? 'bg-error-muted-pressed' : 'bg-transparent';\n borderClass =\n pressed || isLoading\n ? 'border-error-muted-pressed'\n : 'border-transparent';\n } else if (isInverse) {\n backgroundClass =\n pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n borderClass = 'border-primary-inverse';\n } else {\n backgroundClass =\n pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n borderClass =\n pressed || isLoading\n ? 'border-background-pressed'\n : 'border-transparent';\n }\n\n return `${backgroundClass} ${borderClass} ${baseClasses}`;\n },\n [isInverse, isDanger, isLoading, twClassName],\n );\n\n const getTextClassName = useCallback(\n (pressed: boolean): string => {\n if (isDanger) {\n return pressed || isLoading\n ? 'text-error-default-pressed'\n : 'text-error-default';\n }\n if (isInverse) {\n return 'text-primary-inverse';\n }\n return pressed || isLoading\n ? 'text-primary-default-pressed'\n : 'text-primary-default';\n },\n [isDanger, isInverse, isLoading],\n );\n\n return (\n <ButtonBase\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n numberOfLines: 1,\n ellipsizeMode: 'clip',\n ...textProps,\n }}\n spinnerProps={{\n ...spinnerProps,\n }}\n startIconProps={{\n size: IconSize.Sm,\n ...startIconProps,\n }}\n endIconProps={{\n size: IconSize.Sm,\n ...endIconProps,\n }}\n isLoading={isLoading}\n twClassName={getContainerClassName}\n textClassName={getTextClassName}\n iconClassName={getTextClassName}\n style={style}\n {...props}\n >\n {children}\n </ButtonBase>\n );\n};\n"]}