{"version":3,"file":"Alert.cjs","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import { useId } from '@raikou/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  RaikouColor,\n  RaikouRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport {\n  AlertBodyStyle,\n  AlertCloseButtonStyle,\n  AlertIconStyle,\n  AlertLabelStyle,\n  AlertMessageStyle,\n  AlertRootStyle,\n  AlertTitleStyle,\n  AlertWrapperStyle,\n} from './Alert.css';\n\nexport type AlertStylesNames =\n  | 'root'\n  | 'body'\n  | 'label'\n  | 'title'\n  | 'icon'\n  | 'wrapper'\n  | 'message'\n  | 'closeButton';\nexport type AlertVariant = 'filled' | 'light' | 'outline' | 'default' | 'transparent' | 'white';\nexport type AlertCssVariables = {\n  root: '--alert-radius' | '--alert-bg' | '--alert-color' | '--alert-bd';\n};\n\nexport interface AlertProps\n  extends BoxProps,\n    StylesApiProps<AlertFactory>,\n    ElementProps<'div', 'title'> {\n  /** Key of `theme.radius` or any valid CSS value to set border-radius, `theme.defaultRadius` by default */\n  radius?: RaikouRadius;\n\n  /** Key of `theme.colors` or any valid CSS color, default value is `theme.primaryColor`  */\n  color?: RaikouColor;\n\n  /** Alert title */\n  title?: React.ReactNode;\n\n  /** Icon displayed next to the title */\n  icon?: React.ReactNode;\n\n  /** Determines whether close button should be displayed, `false` by default */\n  withCloseButton?: boolean;\n\n  /** Called when the close button is clicked */\n  onClose?: () => void;\n\n  /** Close button `aria-label` */\n  closeButtonLabel?: string;\n\n  /** Determines whether text color with filled variant should depend on `background-color`. If luminosity of the `color` prop is less than `theme.luminosityThreshold`, then `theme.white` will be used for text color, otherwise `theme.black`. Overrides `theme.autoContrast`. */\n  autoContrast?: boolean;\n}\n\nexport type AlertFactory = Factory<{\n  props: AlertProps;\n  ref: HTMLDivElement;\n  stylesNames: AlertStylesNames;\n  vars: AlertCssVariables;\n  variant: AlertVariant;\n}>;\n\nconst defaultProps: Partial<AlertProps> = {};\n\nconst varsResolver = createVarsResolver<AlertFactory>(\n  (theme, { radius, color, variant, autoContrast }) => {\n    const colors = theme.variantColorResolver({\n      color: color || theme.primaryColor,\n      theme,\n      variant: variant || 'light',\n      autoContrast,\n    });\n\n    return {\n      root: {\n        '--alert-radius': radius === undefined ? undefined : getRadius(radius),\n        '--alert-bg': color || variant ? colors.background : undefined,\n        '--alert-color': colors.color,\n        '--alert-bd': color || variant ? colors.border : undefined,\n      },\n    };\n  }\n);\n\nexport const Alert = factory<AlertFactory>((_props, ref) => {\n  const props = useProps('Alert', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    radius,\n    color,\n    title,\n    children,\n    id,\n    icon,\n    withCloseButton,\n    onClose,\n    closeButtonLabel,\n    variant,\n    autoContrast,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<AlertFactory>({\n    name: 'Alert',\n    classes: {\n      root: AlertRootStyle,\n      body: AlertBodyStyle,\n      label: AlertLabelStyle,\n      title: AlertTitleStyle,\n      icon: AlertIconStyle,\n      wrapper: AlertWrapperStyle,\n      message: AlertMessageStyle,\n      closeButton: AlertCloseButtonStyle,\n    },\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    varsResolver,\n  });\n\n  const rootId = useId(id);\n  const titleId = (title && `${rootId}-title`) || undefined;\n  const bodyId = `${rootId}-body`;\n\n  return (\n    <Box\n      id={rootId}\n      {...getStyles('root', { variant })}\n      variant={variant}\n      ref={ref}\n      {...others}\n      role=\"alert\"\n      aria-describedby={bodyId}\n      aria-labelledby={titleId}\n    >\n      <div {...getStyles('wrapper')}>\n        {icon && <div {...getStyles('icon')}>{icon}</div>}\n\n        <div {...getStyles('body')}>\n          {title && (\n            <div {...getStyles('title')} data-with-close-button={withCloseButton || undefined}>\n              <span id={titleId} {...getStyles('label')}>\n                {title}\n              </span>\n            </div>\n          )}\n\n          {children && (\n            <div id={bodyId} {...getStyles('message')} data-variant={variant}>\n              {children}\n            </div>\n          )}\n        </div>\n\n        {withCloseButton && (\n          <CloseButton\n            {...getStyles('closeButton')}\n            onClick={onClose}\n            variant=\"transparent\"\n            size={16}\n            iconSize={16}\n            aria-label={closeButtonLabel}\n            unstyled={unstyled}\n          />\n        )}\n      </div>\n    </Box>\n  );\n});\n\nAlert.displayName = '@raikou/core/Alert';\n"],"names":["createVarsResolver","getRadius","factory","useProps","useStyles","AlertRootStyle","AlertBodyStyle","AlertLabelStyle","AlertTitleStyle","AlertIconStyle","AlertWrapperStyle","AlertMessageStyle","AlertCloseButtonStyle","useId","jsx","Box","jsxs","CloseButton"],"mappings":"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"}