@undp/design-system-react/dist/Button.cjs.map

React based design system for UNDP

{"version":3,"file":"Button.cjs","names":[],"sources":["../src/components/ui/button.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { Slot } from 'radix-ui';\nimport type * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst buttonVariants = cva(\n  'cursor-pointer m-0! tracking-[0.48px] inline-flex items-center justify-center gap-2 uppercase whitespace-nowrap rounded font-bold transition-colors focus-visible:outline-hidden focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        primary: 'bg-primary text-content-reverse hover:bg-primary-hover',\n        secondary: 'bg-secondary text-content-reverse hover:bg-secondary-hover',\n        tertiary: 'bg-tertiary text-content-primary hover:bg-tertiary-hover',\n        quaternary: 'bg-quaternary text-content-primary hover:bg-quaternary-hover',\n        link: 'text-content-primary hover:text-content-secondary',\n        outline:\n          'bg-transparent text-content-primary border-2 border-foreground hover:bg-surface-xs',\n        icon: 'bg-transparent text-content-primary hover:text-content-secondary',\n        success: 'bg-success text-content-reverse hover:bg-success-hover',\n        warning: 'bg-warning text-content-primary hover:bg-warning-hover',\n        info: 'bg-info text-content-reverse hover:bg-info-hover',\n        error: 'bg-error text-content-reverse hover:bg-error-hover',\n        surface: 'bg-surface text-content-primary hover:bg-surface-hover',\n        'surface-hard': 'bg-surface-hard text-content-primary hover:bg-surface-hard-hover',\n        background: 'bg-background text-content-primary hover:bg-background-soft',\n        'background-soft': 'bg-background-soft text-content-primary hover:bg-background',\n        foreground: 'bg-foreground text-content-reverse hover:bg-foreground-soft',\n        'foreground-soft': 'bg-foreground-soft text-content-reverse hover:bg-foreground',\n      },\n      arrow: {\n        true: `\n          after:content-['']\n          after:inline-block\n          after:h-[20px]\n          after:w-[13px]\n          after:ml-3\n          rtl:after:ml-0\n          rtl:after:mr-3\n          rtl:after:scale-x-[-1]\n          after:bg-no-repeat\n          after:bg-left\n          after:transition-transform\n          after:duration-200\n          after:ease-in-out\n          hover:after:translate-x-[70%]\n          rtl:hover:after:-translate-x-[70%]\n          disabled:hover:after:translate-x-0\n          rtl:disabled:hover:after:translate-x-0\n          group-hover:after:translate-x-[70%]\n          rtl:group-hover:after:-translate-x-[70%]\n          disabled:group-hover:after:translate-x-0\n          rtl:disabled:group-hover:after:translate-x-0\n        `,\n      },\n      size: {\n        base: 'text-base leading-xs',\n        xs: 'text-xs leading-xs',\n        sm: 'text-sm leading-xs',\n        xl: 'text-xl leading-xs',\n      },\n      rounded: {\n        base: 'rounded-base',\n        sm: 'rounded-sm',\n        md: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        full: 'rounded-full',\n      },\n      padding: {\n        base: 'py-4 px-6',\n        sm: 'px-4 py-2',\n        none: 'py-0 px-0',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'base',\n      padding: 'base',\n      rounded: 'base',\n      arrow: true,\n    },\n  },\n);\nfunction Button({\n  className,\n  variant = 'primary',\n  size,\n  arrow = true,\n  rounded,\n  padding,\n  asChild = false,\n  ...props\n}: React.ComponentProps<'button'> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean;\n  }) {\n  const Comp = asChild ? Slot.Root : 'button';\n\n  return (\n    <Comp\n      data-slot='button'\n      data-variant={variant}\n      data-size={size}\n      className={cn(\n        buttonVariants({\n          variant,\n          size,\n          rounded,\n          padding,\n          arrow: variant === 'icon' ? false : arrow,\n        }),\n        arrow\n          ? variant === 'primary'\n            ? 'foreground-arrow'\n            : variant === 'secondary' ||\n                variant === 'foreground' ||\n                variant === 'foreground-soft' ||\n                variant === 'success' ||\n                variant === 'error' ||\n                variant === 'info'\n              ? 'background-arrow'\n              : variant === 'link' ||\n                  variant === 'tertiary' ||\n                  variant === 'quaternary' ||\n                  variant === 'surface' ||\n                  variant === 'surface-hard' ||\n                  variant === 'outline' ||\n                  variant === 'background' ||\n                  variant === 'background-soft'\n                ? 'primary-arrow'\n                : ''\n          : '',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Button, buttonVariants };\n"],"mappings":"gNAMA,IAAM,EAAiB,EAAA,EACrB,qTACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yDACT,UAAW,6DACX,SAAU,2DACV,WAAY,+DACZ,KAAM,oDACN,QACE,qFACF,KAAM,mEACN,QAAS,yDACT,QAAS,yDACT,KAAM,mDACN,MAAO,qDACP,QAAS,yDACT,eAAgB,mEAChB,WAAY,8DACZ,kBAAmB,8DACnB,WAAY,8DACZ,kBAAmB,6DACrB,EACA,MAAO,CACL,KAAM;;;;;;;;;;;;;;;;;;;;;;SAuBR,EACA,KAAM,CACJ,KAAM,uBACN,GAAI,qBACJ,GAAI,qBACJ,GAAI,oBACN,EACA,QAAS,CACP,KAAM,eACN,GAAI,aACJ,GAAI,aACJ,GAAI,aACJ,GAAI,aACJ,MAAO,cACP,KAAM,cACR,EACA,QAAS,CACP,KAAM,YACN,GAAI,YACJ,KAAM,WACR,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,OACN,QAAS,OACT,QAAS,OACT,MAAO,EACT,CACF,CACF,EACA,SAAS,EAAO,CACd,YACA,UAAU,UACV,OACA,QAAQ,GACR,UACA,UACA,UAAU,GACV,GAAG,GAIA,CAGH,OACE,EAAA,EAAA,IAAA,CAHW,EAAA,EAAA,EAAsB,SAGjC,CACE,YAAU,SACV,eAAc,EACd,YAAW,EACX,UAAW,EAAA,EACT,EAAe,CACb,UACA,OACA,UACA,UACA,MAAO,IAAY,QAAiB,CACtC,CAAC,EACD,EACI,IAAY,UACV,mBACA,IAAY,aACV,IAAY,cACZ,IAAY,mBACZ,IAAY,WACZ,IAAY,SACZ,IAAY,OACZ,mBACA,IAAY,QACV,IAAY,YACZ,IAAY,cACZ,IAAY,WACZ,IAAY,gBACZ,IAAY,WACZ,IAAY,cACZ,IAAY,kBACZ,gBACA,GACN,GACJ,CACF,EACA,GAAI,CACL,CAAA,CAEL"}