{"version":3,"file":"toast-root.cjs","sources":["../../../components/toast/toast-root.tsx"],"sourcesContent":["'use client';\n\nimport { Toast as ToastPrimitive } from '@base-ui/react';\nimport { cx } from 'class-variance-authority';\nimport type { ReactNode } from 'react';\nimport { ErrorIcon, InfoIcon, SuccessIcon, WarningIcon, XIcon } from '~/icons';\nimport { Button } from '../button';\nimport { Flex } from '../flex';\nimport { IconButton } from '../icon-button';\nimport { Spinner } from '../spinner';\nimport styles from './toast.module.css';\nimport type { ToastData } from './toast-manager';\nimport type { ToastPosition } from './toast-provider';\n\nconst TOAST_ICONS: Record<string, ReactNode> = {\n  default: <InfoIcon />,\n  success: <SuccessIcon />,\n  error: <ErrorIcon />,\n  warning: <WarningIcon />,\n  info: <InfoIcon />,\n  loading: <Spinner size={2} color='default' />\n};\n\ntype SwipeDirection = 'up' | 'down' | 'left' | 'right';\n\nfunction getSwipeDirection(position: ToastPosition): SwipeDirection[] {\n  const verticalDirection: SwipeDirection = position.startsWith('top')\n    ? 'up'\n    : 'down';\n\n  if (position.includes('center')) {\n    return [verticalDirection];\n  }\n\n  if (position.includes('left')) {\n    return ['left', verticalDirection];\n  }\n\n  return ['right', verticalDirection];\n}\n\nexport interface ToastRootProps extends ToastPrimitive.Root.Props {\n  position?: ToastPosition;\n}\n\nexport function ToastRoot({\n  toast,\n  className,\n  position = 'bottom-right',\n  ...props\n}: ToastRootProps) {\n  const swipeDirection = getSwipeDirection(position);\n  // Promote description into the title slot when title is missing so the icon\n  // and headline sit on the same row. The second row only renders when both\n  // are present.\n  const title = toast.title ?? toast.description;\n  const hasBoth = !!toast.title && !!toast.description;\n  // `leadingIcon: undefined` (omitted) → fall back to the type default.\n  // `leadingIcon: null` → explicit opt-out, render nothing.\n  // anything else → use what the user provided.\n  const userIcon = (toast.data as ToastData | undefined)?.leadingIcon;\n  const leadingIcon =\n    userIcon !== undefined\n      ? userIcon\n      : ((toast.type ? TOAST_ICONS[toast.type] : null) ?? TOAST_ICONS.default);\n\n  return (\n    <ToastPrimitive.Root\n      toast={toast}\n      className={cx(styles.root, className)}\n      swipeDirection={swipeDirection}\n      data-position={position}\n      data-slot='toast'\n      {...props}\n    >\n      <ToastPrimitive.Content\n        className={styles.content}\n        data-slot='toast-content'\n      >\n        <Flex\n          align='start'\n          gap={3}\n          style={{ width: '100%' }}\n          data-slot='toast-body'\n        >\n          {leadingIcon && (\n            <span\n              className={styles.leadingIcon}\n              aria-hidden='true'\n              data-slot='toast-leading-icon'\n            >\n              {leadingIcon}\n            </span>\n          )}\n          <Flex\n            direction='column'\n            gap={3}\n            className={styles.main}\n            data-slot='toast-main'\n          >\n            <Flex\n              align='center'\n              justify='between'\n              gap={5}\n              className={styles.header}\n              data-slot='toast-header'\n            >\n              {title && (\n                <ToastPrimitive.Title\n                  className={hasBoth ? styles.title : styles.description}\n                  data-slot='toast-title'\n                >\n                  {title}\n                </ToastPrimitive.Title>\n              )}\n              <Flex\n                align='center'\n                gap={3}\n                className={styles.actions}\n                data-slot='toast-actions'\n              >\n                {toast.actionProps && (\n                  <ToastPrimitive.Action\n                    data-slot='toast-action'\n                    {...toast.actionProps}\n                    render={\n                      <Button variant='text' color='neutral' size='small' />\n                    }\n                  />\n                )}\n                <ToastPrimitive.Close\n                  aria-label='Close toast'\n                  render={<IconButton size={2} />}\n                  data-slot='toast-close'\n                >\n                  <XIcon />\n                </ToastPrimitive.Close>\n              </Flex>\n            </Flex>\n            {hasBoth && (\n              <ToastPrimitive.Description\n                className={styles.description}\n                data-slot='toast-description'\n              >\n                {toast.description}\n              </ToastPrimitive.Description>\n            )}\n          </Flex>\n        </Flex>\n      </ToastPrimitive.Content>\n    </ToastPrimitive.Root>\n  );\n}\n\nToastRoot.displayName = 'Toast';\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAcA;;;;;;;;AAWA;AACE;AACE;;AAGF;;;AAIA;AACE;;AAGF;AACF;AAMgB;AAMd;;;;;AAKA;;;;AAIA;AACA;AAEI;;AAGJ;AAsFF;AAEA;;"}