{"version":3,"file":"alert.mjs","names":[],"sources":["../../../../package/common/alert/alert.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport cx from 'classnames';\nimport {\n  faCircleInfo,\n  faCircleCheck,\n  faCircleXmark,\n  faTriangleExclamation,\n  faBell,\n  faXmark,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport type { AlertLabels, AlertProps } from './alert.types';\nimport styles from './alert.module.pcss';\nimport ActionIcon from '../actionIcon';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { renderIcon } from '../utils/renderIcon';\nimport { ThemeColor } from '../themeProvider/color.types';\nimport { toneProps, useToneCheck } from '../styles/tone';\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\nconst DEFAULT_LABELS: Required<AlertLabels> = {\n  dismiss: 'Dismiss',\n};\n\nfunction Alert(props: AlertProps): ReactElement {\n  const {\n    title,\n    children = null,\n    color = ThemeColor.Primary,\n    icon,\n    hideIcon = false,\n    onClose,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    labels,\n    ...rest\n  } = useComponentDefaults('Alert', props);\n  const text = useLabels('Alert', labels, DEFAULT_LABELS);\n  const tone = toneProps(color);\n  useToneCheck('Alert', [color]);\n\n  return (\n    <div\n      {...rest}\n      role='alert'\n      className={cx(styles.alert, tone.className, classNames?.root, className)}\n      style={{ ...tone.style, ...style, ...slotStyles?.root }}\n    >\n      {!hideIcon &&\n        renderIcon(icon ?? ICON_BY_COLOR.get(color) ?? faBell, {\n          className: cx(styles.alertIcon, classNames?.icon),\n          style: slotStyles?.icon,\n        })}\n\n      <div className={cx(styles.alertContent, classNames?.content)} style={slotStyles?.content}>\n        {title && (\n          <div className={cx(styles.alertTitle, classNames?.title)} style={slotStyles?.title}>\n            {title}\n          </div>\n        )}\n        {children && (\n          <div className={cx(styles.alertDescription, classNames?.description)} style={slotStyles?.description}>\n            {children}\n          </div>\n        )}\n      </div>\n\n      {onClose && (\n        <ActionIcon\n          icon={faXmark}\n          color='var(--text-dark)'\n          onClick={onClose}\n          className={cx(styles.alertCloseButton, classNames?.closeButton)}\n          style={slotStyles?.closeButton}\n          aria-label={text.dismiss}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Alert;\n"],"mappings":"ooBAoBA,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,EAEK,EAAwC,CAC5C,QAAS,SACX,EAEA,SAAS,EAAM,EAAiC,CAC9C,GAAM,CACJ,QACA,WAAW,KACX,QAAQ,EAAW,QACnB,OACA,WAAW,GACX,UACA,YACA,QACA,aACA,OAAQ,EACR,SACA,GAAG,GACD,EAAqB,QAAS,CAAK,EACjC,EAAO,EAAU,QAAS,EAAQ,CAAc,EAChD,EAAO,EAAU,CAAK,EAG5B,OAFA,EAAa,QAAS,CAAC,CAAK,CAAC,EAG3B,EAAC,MAAD,CACE,GAAI,EACJ,KAAK,QACL,UAAW,EAAG,EAAO,MAAO,EAAK,UAAW,GAAY,KAAM,CAAS,EACvE,MAAO,CAAE,GAAG,EAAK,MAAO,GAAG,EAAO,GAAG,GAAY,IAAK,EAJxD,SAAA,CAMG,CAAC,GACA,EAAW,GAAQ,EAAc,IAAI,CAAK,GAAK,EAAQ,CACrD,UAAW,EAAG,EAAO,UAAW,GAAY,IAAI,EAChD,MAAO,GAAY,IACrB,CAAC,EAEH,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,OAAO,EAAG,MAAO,GAAY,QAAjF,SAAA,CACG,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,WAAY,GAAY,KAAK,EAAG,MAAO,GAAY,MAC1E,SAAA,CACE,CAAA,EAEN,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAAG,MAAO,GAAY,YACtF,UACE,CAAA,CAEJ,IAEJ,GACC,EAAC,EAAD,CACE,KAAM,EACN,MAAM,mBACN,QAAS,EACT,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,GAAY,YACnB,aAAY,EAAK,OAClB,CAAA,CAEA,GAET"}