{"version":3,"file":"toast.mjs","names":[],"sources":["../../../../package/common/toast/toast.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faCircleInfo,\n  faCircleCheck,\n  faCircleXmark,\n  faTriangleExclamation,\n  faBell,\n  faXmark,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport styles from './toast.module.pcss';\nimport type { ToastItem, ToastLabels } from './toast.types';\nimport ActionIcon from '../actionIcon';\nimport { useSwipeDismiss } from '../hooks/useSwipeDismiss';\nimport { ThemeColor } from '../themeProvider/color.types';\nimport { toneProps, useToneCheck } from '../styles/tone';\n\ninterface ToastProps {\n  item: ToastItem;\n  isBottom: boolean;\n  onDismiss: (id: string) => void;\n  /** Already resolved by the provider: defaults, provider, then this toast's own. */\n  labels: Required<ToastLabels>;\n}\n\n// A Map, so a CSS colour can never hit an Object.prototype key.\nconst ICON_BY_COLOR = new Map<string, typeof faBell>([\n  [ThemeColor.Info, faCircleInfo],\n  [ThemeColor.Success, faCircleCheck],\n  [ThemeColor.Warn, faTriangleExclamation],\n  [ThemeColor.Error, faCircleXmark],\n]);\n\nfunction Toast({ item, isBottom, onDismiss, labels }: ToastProps) {\n  const { id, content, options, dismissing } = item;\n  const { duration, showRemainingTime, showCloseButton, pauseOnHover, color, classNames, styles: slotStyles } = options;\n  const tone = toneProps(color);\n  useToneCheck('Toast', [color]);\n\n  const [hovered, setHovered] = useState(false);\n  const [focused, setFocused] = useState(false);\n\n  const [swiped, setSwiped] = useState(false);\n  const { ref: swipeRef, isDragging } = useSwipeDismiss<HTMLDivElement>({\n    onDismiss: () => {\n      setSwiped(true);\n      onDismiss(id);\n    },\n  });\n\n  const paused = (pauseOnHover && (hovered || focused)) || isDragging;\n\n  // Remaining time is carried across pause/resume cycles so the timer continues\n  // where it left off instead of restarting on every hover.\n  const remainingRef = useRef(duration);\n\n  useEffect(() => {\n    if (duration === 0 || paused) return;\n    const start = Date.now();\n    const timer = setTimeout(() => onDismiss(id), remainingRef.current);\n    return () => {\n      clearTimeout(timer);\n      remainingRef.current -= Date.now() - start;\n    };\n  }, [id, duration, onDismiss, paused]);\n\n  return (\n    <div\n      ref={swipeRef}\n      className={cx(\n        styles.toast,\n        isBottom ? styles.toastBottom : null,\n        tone.className,\n        dismissing && !swiped && styles.toastDismissing,\n        paused && styles.toastPaused,\n        classNames?.root,\n      )}\n      style={{ ...tone.style, ...slotStyles?.root }}\n      onMouseEnter={pauseOnHover ? () => setHovered(true) : undefined}\n      onMouseLeave={pauseOnHover ? () => setHovered(false) : undefined}\n      onFocus={pauseOnHover ? () => setFocused(true) : undefined}\n      onBlur={pauseOnHover ? () => setFocused(false) : undefined}\n    >\n      <FontAwesomeIcon\n        icon={ICON_BY_COLOR.get(color) ?? faBell}\n        className={cx(styles.toastIcon, classNames?.icon)}\n        style={slotStyles?.icon as React.CSSProperties & Record<`--fa-font-${string}`, string>}\n      />\n\n      <div className={cx(styles.toastContent, classNames?.content)} style={slotStyles?.content}>\n        {content}\n      </div>\n\n      {showCloseButton && (\n        <ActionIcon\n          icon={faXmark}\n          color='var(--text-dark)'\n          onClick={() => onDismiss(id)}\n          className={cx(styles.toastCloseButton, classNames?.closeButton)}\n          style={slotStyles?.closeButton}\n          aria-label={labels.close}\n        />\n      )}\n\n      {showRemainingTime && duration > 0 && (\n        <div\n          className={cx(styles.toastProgressBar, classNames?.progressBar)}\n          style={{ '--toast-duration': `${duration}ms`, ...slotStyles?.progressBar } as React.CSSProperties}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Toast;\n"],"mappings":"6nBA4BA,IAAM,EAAgB,IAAI,IAA2B,CACnD,CAAC,EAAW,KAAM,CAAY,EAC9B,CAAC,EAAW,QAAS,CAAa,EAClC,CAAC,EAAW,KAAM,CAAqB,EACvC,CAAC,EAAW,MAAO,CAAa,CAClC,CAAC,EAED,SAAS,EAAM,CAAE,OAAM,WAAU,YAAW,UAAsB,CAChE,GAAM,CAAE,KAAI,UAAS,UAAS,cAAe,EACvC,CAAE,WAAU,oBAAmB,kBAAiB,eAAc,QAAO,aAAY,OAAQ,GAAe,EACxG,EAAO,EAAU,CAAK,EAC5B,EAAa,QAAS,CAAC,CAAK,CAAC,EAE7B,GAAM,CAAC,EAAS,GAAc,EAAS,EAAK,EACtC,CAAC,EAAS,GAAc,EAAS,EAAK,EAEtC,CAAC,EAAQ,GAAa,EAAS,EAAK,EACpC,CAAE,IAAK,EAAU,cAAe,EAAgC,CACpE,cAAiB,CACf,EAAU,EAAI,EACd,EAAU,CAAE,CACd,CACF,CAAC,EAEK,EAAU,IAAiB,GAAW,IAAa,EAInD,EAAe,EAAO,CAAQ,EAYpC,OAVA,MAAgB,CACd,GAAI,IAAa,GAAK,EAAQ,OAC9B,IAAM,EAAQ,KAAK,IAAI,EACjB,EAAQ,eAAiB,EAAU,CAAE,EAAG,EAAa,OAAO,EAClE,UAAa,CACX,aAAa,CAAK,EAClB,EAAa,SAAW,KAAK,IAAI,EAAI,CACvC,CACF,EAAG,CAAC,EAAI,EAAU,EAAW,CAAM,CAAC,EAGlC,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EACT,EAAO,MACP,EAAW,EAAO,YAAc,KAChC,EAAK,UACL,GAAc,CAAC,GAAU,EAAO,gBAChC,GAAU,EAAO,YACjB,GAAY,IACd,EACA,MAAO,CAAE,GAAG,EAAK,MAAO,GAAG,GAAY,IAAK,EAC5C,aAAc,MAAqB,EAAW,EAAI,EAAI,IAAA,GACtD,aAAc,MAAqB,EAAW,EAAK,EAAI,IAAA,GACvD,QAAS,MAAqB,EAAW,EAAI,EAAI,IAAA,GACjD,OAAQ,MAAqB,EAAW,EAAK,EAAI,IAAA,GAdnD,SAAA,CAgBE,EAAC,EAAD,CACE,KAAM,EAAc,IAAI,CAAK,GAAK,EAClC,UAAW,EAAG,EAAO,UAAW,GAAY,IAAI,EAChD,MAAO,GAAY,IACpB,CAAA,EAED,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,OAAO,EAAG,MAAO,GAAY,QAC9E,SAAA,CACE,CAAA,EAEJ,GACC,EAAC,EAAD,CACE,KAAM,EACN,MAAM,mBACN,YAAe,EAAU,CAAE,EAC3B,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,GAAY,YACnB,aAAY,EAAO,KACpB,CAAA,EAGF,GAAqB,EAAW,GAC/B,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,CAAE,mBAAoB,GAAG,EAAS,IAAK,GAAG,GAAY,WAAY,CAC1E,CAAA,CAEA,GAET"}