@metamask/design-system-react/dist/components/TextButton/TextButton.mjs.map

Design system react ui components

{"version":3,"file":"TextButton.mjs","sourceRoot":"","sources":["../../../src/components/TextButton/TextButton.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAE3C,OAAO,EAAE,+BAA+B,EAAE,mCAA+B;AAGzE,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,SAAS,EACT,SAAS,EACT,UAAU,EACV,IAAI,GAAG,cAAc,CAAC,MAAM,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,OAAO;IAC7B,uCAAuC;IACvC,yCAAyC,EACzC,iDAAiD;IACjD,6BAA6B;IAC7B,CAAC,SAAS,IAAI,sBAAsB;IACpC,iBAAiB;IACjB,SAAS,IAAI,sBAAsB;IACnC,sDAAsD;IACtD,CAAC,UAAU,IAAI;QACb,CAAC,SAAS,IAAI;YACZ,oJAAoJ;YACpJ,iGAAiG;SAClG;QACD,SAAS,IAAI;YACX,wIAAwI;YACxI,iFAAiF;SAClF;KACF;IACD,kBAAkB;IAClB,UAAU,IAAI,CAAC,YAAY,EAAE,oBAAoB,CAAC,EAClD,SAAS,CACV,CAAC;IAEF,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE;YACT,OAAO,EAAE,+BAA+B,CAAC,IAAI,CAAC;YAC9C,GAAG,SAAS;SACb,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { TextButtonSize } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonBase } from '../ButtonBase';\n\nimport { MAP_TEXTBUTTON_SIZE_TEXTVARIANT } from './TextButton.constants';\nimport type { TextButtonProps } from './TextButton.types';\n\nexport const TextButton = forwardRef<HTMLButtonElement, TextButtonProps>(\n  (\n    {\n      className,\n      isInverse,\n      isDisabled,\n      size = TextButtonSize.BodyMd,\n      textProps,\n      ...props\n    },\n    ref,\n  ) => {\n    const mergedClassName = twMerge(\n      // Reset padding, height and animations\n      'h-auto rounded-none bg-transparent px-0',\n      'transform-none transition-none active:scale-100',\n      // Default text button styles\n      !isInverse && 'text-primary-default',\n      // Inverse styles\n      isInverse && 'text-primary-inverse',\n      // Hover/Active states - only applied when interactive\n      !isDisabled && [\n        !isInverse && [\n          'hover:bg-hover hover:text-primary-default-hover hover:underline hover:decoration-primary-default-hover hover:decoration-2 hover:underline-offset-4',\n          'active:bg-pressed active:text-primary-default-pressed active:decoration-primary-default-pressed',\n        ],\n        isInverse && [\n          'hover:bg-hover hover:text-primary-inverse hover:underline hover:decoration-primary-inverse hover:decoration-2 hover:underline-offset-4',\n          'active:bg-pressed active:text-primary-inverse active:decoration-primary-inverse',\n        ],\n      ],\n      // Disabled styles\n      isDisabled && ['opacity-50', 'cursor-not-allowed'],\n      className,\n    );\n\n    return (\n      <ButtonBase\n        ref={ref}\n        className={mergedClassName}\n        isDisabled={isDisabled}\n        textProps={{\n          variant: MAP_TEXTBUTTON_SIZE_TEXTVARIANT[size],\n          ...textProps,\n        }}\n        {...props}\n      />\n    );\n  },\n);\n\nTextButton.displayName = 'TextButton';\n"]}