{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,4BAA4B,EAC5B,aAAa,EACb,kBAAkB,EAClB,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,aAAa,EACb,UAAU,EACV,QAAQ,EACR,WAAW,EACZ,uCAAuC;AACxC,OAAO,QAAO,EACZ,UAAU,EACV,WAAW,EACX,eAAe,EACf,MAAM,EACN,QAAQ,EACT,cAAc;;AAEf,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,MAAM,EAAE,4BAAkB;AACnC,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAI/B,0EAA0E;AAC1E,MAAM,mBAAmB,GAAG,EAAE,CAAC;AAC/B,gFAAgF;AAChF,MAAM,mBAAmB,GAAG,EAAE,CAAC;AAC/B,8CAA8C;AAC9C,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAChC,uEAAuE;AACvE,MAAM,wBAAwB,GAAG,CAAC,CAAC;AAEnC,MAAM,aAAa,GAAG,CAAC,OAAwB,EAA8B,EAAE,CAC7E,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,OAAO,KAAK,QAAQ,CAAC;AAE7D,MAAM,UAAU,GAAG,CAAC,OAAwB,EAAE,EAAE,CAC9C,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS,CAAC;AAE5C,MAAM,0BAA0B,GAAG,CAAC,EAClC,QAAQ,EACR,cAAc,EACd,WAAW,GAKZ,EAAE,EAAE;IACH,IAAI,SAAS,GAAG,CAAC,CAAC;IAElB,IAAI,QAAQ,EAAE;QACZ,SAAS,IAAI,mBAAmB,CAAC;KAClC;IACD,IAAI,cAAc,EAAE;QAClB,IAAI,QAAQ,EAAE;YACZ,SAAS,IAAI,qBAAqB,CAAC;SACpC;QACD,SAAS,IAAI,mBAAmB,CAAC;KAClC;IACD,IAAI,WAAW,EAAE;QACf,SAAS,IAAI,mBAAmB,CAAC;KAClC;IAED,OAAO,SAAS,GAAG,wBAAwB,CAAC;AAC9C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,kBAAkB,GAAG,4BAA4B,CAAC,KAAK,EACvD,cAAc,EACd,OAAO,EACP,gBAAgB,EAChB,SAAS,EACT,eAAe,GAAG,kBAAkB,CAAC,iBAAiB,EACtD,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,yBAAyB,GAAG,iBAAiB,IAAI,EAAE,CAAC;IAE1D,MAAM,EACJ,SAAS,EAAE,oBAAoB,GAAG,cAAc,EAChD,SAAS,EAAE,oBAAoB,EAC/B,GAAG,wBAAwB,EAC5B,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAE3B,MAAM,qBAAqB,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,sBAAsB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC5D,MAAM,uBAAuB,GAC3B,kBAAkB,KAAK,4BAA4B,CAAC,GAAG,CAAC;IAC1D,MAAM,oBAAoB,GACxB,sBAAsB,IAAI,CAAC,uBAAuB,CAAC;IACrD,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;IACnC,MAAM,cAAc,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/C,MAAM,WAAW,GAAG,UAAU,CAAC,QAAQ,CAAC,CAAC;IACzC,8DAA8D;IAC9D,MAAM,oBAAoB,GACxB,CAAC,QAAQ,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC,cAAc,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QAC/C,CAAC,WAAW,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC;IAE5C,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,wEAAwE;IACxE,wEAAwE;IACxE,oCAAoC;IACpC,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChE,MAAM,iBAAiB,GACrB,CAAC,QAAQ,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC;IAEvE,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,IAAI,oBAAoB,IAAI,oBAAoB,IAAI,iBAAiB,EAAE;YACrE,mBAAmB,CAAC,KAAK,CAAC,CAAC;YAC3B,OAAO;SACR;QAED,MAAM,MAAM,GAAG,UAAU,CAAC,OAAO,EAAE,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC;QACvE,MAAM,gBAAgB,GAAG,0BAA0B,CAAC;YAClD,QAAQ;YACR,cAAc;YACd,WAAW;SACZ,CAAC,CAAC;QACH,mBAAmB,CAAC,MAAM,GAAG,CAAC,IAAI,MAAM,IAAI,gBAAgB,CAAC,CAAC;IAChE,CAAC,EAAE;QACD,oBAAoB;QACpB,WAAW;QACX,cAAc;QACd,QAAQ;QACR,oBAAoB;QACpB,iBAAiB;KAClB,CAAC,CAAC;IAEH,eAAe,CAAC,GAAG,EAAE;QACnB,cAAc,EAAE,CAAC;QAEjB,IAAI,OAAO,cAAc,KAAK,WAAW,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;YAChE,OAAO,SAAS,CAAC;SAClB;QAED,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;YACvC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,CAAC;QACH,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAErC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAEnD,MAAM,eAAe,GACnB,CAAC,oBAAoB;QACrB,CAAC,oBAAoB;QACrB,CAAC,QAAQ,IAAI,cAAc,IAAI,WAAW,CAAC;QAC3C,CAAC,iBAAiB,IAAI,gBAAgB,CAAC,CAAC;IAE1C,MAAM,YAAY,GAAG,sBAAsB,CAAC,CAAC,CAAC,CAC5C,oBAAC,MAAM,IACL,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,OAAO,EAAE,mBAAmB,KACxB,yBAAyB,EAC7B,OAAO,EAAE,aAAa,CAAC,SAAS,IAE/B,iBAAiB,CACX,CACV,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,OAAO,CACL,oBAAC,GAAG,OACE,KAAK,EACT,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,gBAAgB,CAAC,GAAG,EACnC,UAAU,EACR,eAAe,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,EAE9D,GAAG,EAAE,CAAC,EACN,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,CAAC,EACb,aAAa,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3C,WAAW,EAAE,CAAC,EACd,YAAY,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3C,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC;QAE1C,cAAc;QAEf,oBAAC,GAAG,IACF,SAAS,EAAC,gBAAgB,EAC1B,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;gBACZ,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;YAC5B,CAAC;YAEA,QAAQ;gBACP,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,oBAAC,IAAI,IACH,OAAO,EAAE,WAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,UAAU,CAAC,MAAM,KACzB,UAAU,IAEb,KAAK,CACD,CACR,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC;YAEH,cAAc,IAAI,CACjB,oBAAC,GAAG,IAAC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IAC5C,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC5B,oBAAC,IAAI,IAAC,OAAO,EAAE,WAAW,CAAC,MAAM,KAAM,gBAAgB,IACpD,WAAW,CACP,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,CACG,CACP;YAEA,WAAW;gBACV,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACzB,oBAAC,IAAI,IAAC,OAAO,EAAE,WAAW,CAAC,MAAM,KAAM,oBAAoB,IACxD,QAAQ,CACJ,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;YAEH,oBAAoB,IAAI,oBAAC,GAAG,IAAC,SAAS,EAAC,MAAM,IAAE,YAAY,CAAO,CAC/D;QAEL,sBAAsB,IAAI,uBAAuB,IAAI,CACpD,oBAAC,GAAG,IAAC,SAAS,EAAC,aAAa,IAAE,YAAY,CAAO,CAClD;QAEA,qBAAqB,IAAI,CACxB,oBAAC,UAAU,IACT,SAAS,EAAE,OAAO,CAChB,CAAC,eAAe,IAAI,OAAO,EAC3B,oBAAoB,CACrB,EACD,QAAQ,EAAE,QAAQ,CAAC,KAAK,EACxB,IAAI,EAAE,cAAc,CAAC,EAAE,EACvB,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAO,KACZ,wBAAwB,GAC5B,CACH,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import {\n  BannerBaseActionButtonLayout,\n  BoxAlignItems,\n  BoxBackgroundColor,\n  BoxFlexDirection,\n  ButtonIconSize,\n  ButtonSize,\n  ButtonVariant,\n  FontWeight,\n  IconName,\n  TextVariant,\n} from '@metamask/design-system-shared';\nimport React, {\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\n/** BodyMd line height — title block (`typography.sBodyMD.lineHeight`). */\nconst BODY_MD_LINE_HEIGHT = 24;\n/** BodySm line height — description block (`typography.sBodySM.lineHeight`). */\nconst BODY_SM_LINE_HEIGHT = 22;\n/** `mt-0.5` between title and description. */\nconst TITLE_DESCRIPTION_GAP = 2;\n/** Sub-pixel / font rounding allowance when comparing stack height. */\nconst COMPACT_HEIGHT_TOLERANCE = 4;\n\nconst isTextContent = (content: React.ReactNode): content is string | number =>\n  typeof content === 'string' || typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n  content !== null && content !== undefined;\n\nconst getCompactContentMaxHeight = ({\n  hasTitle,\n  hasDescription,\n  hasChildren,\n}: {\n  hasTitle: boolean;\n  hasDescription: boolean;\n  hasChildren: boolean;\n}) => {\n  let maxHeight = 0;\n\n  if (hasTitle) {\n    maxHeight += BODY_MD_LINE_HEIGHT;\n  }\n  if (hasDescription) {\n    if (hasTitle) {\n      maxHeight += TITLE_DESCRIPTION_GAP;\n    }\n    maxHeight += BODY_SM_LINE_HEIGHT;\n  }\n  if (hasChildren) {\n    maxHeight += BODY_MD_LINE_HEIGHT;\n  }\n\n  return maxHeight + COMPACT_HEIGHT_TOLERANCE;\n};\n\nexport const BannerBase = forwardRef<HTMLDivElement, BannerBaseProps>(\n  (\n    {\n      title,\n      titleProps,\n      description,\n      descriptionProps,\n      children,\n      childrenWrapperProps,\n      actionButtonLabel,\n      actionButtonOnClick,\n      actionButtonProps,\n      actionButtonLayout = BannerBaseActionButtonLayout.Below,\n      startAccessory,\n      onClose,\n      closeButtonProps,\n      className,\n      backgroundColor = BoxBackgroundColor.BackgroundDefault,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedActionButtonProps = actionButtonProps ?? {};\n\n    const {\n      ariaLabel: closeButtonAriaLabel = 'Close banner',\n      className: closeButtonClassName,\n      ...resolvedCloseButtonProps\n    } = closeButtonProps ?? {};\n\n    const shouldShowCloseButton = Boolean(onClose);\n    const shouldShowActionButton = Boolean(actionButtonOnClick);\n    const isActionButtonLayoutEnd =\n      actionButtonLayout === BannerBaseActionButtonLayout.End;\n    const hasActionButtonBelow =\n      shouldShowActionButton && !isActionButtonLayoutEnd;\n    const hasTitle = hasContent(title);\n    const hasDescription = hasContent(description);\n    const hasChildren = hasContent(children);\n    // Custom nodes can't be measured reliably — keep top-aligned.\n    const hasUnmeasuredContent =\n      (hasTitle && !isTextContent(title)) ||\n      (hasDescription && !isTextContent(description)) ||\n      (hasChildren && !isTextContent(children));\n\n    const contentRef = useRef<HTMLDivElement | null>(null);\n    // Multiple text blocks: default top-aligned until the stack measures as\n    // single-line per block. A single title, description, or children block\n    // always centers (including wraps).\n    const [isCompactContent, setIsCompactContent] = useState(false);\n    const isSingleTextBlock =\n      [hasTitle, hasDescription, hasChildren].filter(Boolean).length === 1;\n\n    const measureContent = useCallback(() => {\n      if (hasUnmeasuredContent || hasActionButtonBelow || isSingleTextBlock) {\n        setIsCompactContent(false);\n        return;\n      }\n\n      const height = contentRef.current?.getBoundingClientRect().height ?? 0;\n      const maxCompactHeight = getCompactContentMaxHeight({\n        hasTitle,\n        hasDescription,\n        hasChildren,\n      });\n      setIsCompactContent(height > 0 && height <= maxCompactHeight);\n    }, [\n      hasActionButtonBelow,\n      hasChildren,\n      hasDescription,\n      hasTitle,\n      hasUnmeasuredContent,\n      isSingleTextBlock,\n    ]);\n\n    useLayoutEffect(() => {\n      measureContent();\n\n      if (typeof ResizeObserver === 'undefined' || !contentRef.current) {\n        return undefined;\n      }\n\n      const observer = new ResizeObserver(() => {\n        measureContent();\n      });\n      observer.observe(contentRef.current);\n\n      return () => {\n        observer.disconnect();\n      };\n    }, [title, description, children, measureContent]);\n\n    const isCenterAligned =\n      !hasActionButtonBelow &&\n      !hasUnmeasuredContent &&\n      (hasTitle || hasDescription || hasChildren) &&\n      (isSingleTextBlock || isCompactContent);\n\n    const actionButton = shouldShowActionButton ? (\n      <Button\n        size={ButtonSize.Md}\n        onClick={actionButtonOnClick}\n        {...resolvedActionButtonProps}\n        variant={ButtonVariant.Secondary}\n      >\n        {actionButtonLabel}\n      </Button>\n    ) : null;\n\n    return (\n      <Box\n        {...props}\n        ref={ref}\n        flexDirection={BoxFlexDirection.Row}\n        alignItems={\n          isCenterAligned ? BoxAlignItems.Center : BoxAlignItems.Start\n        }\n        gap={4}\n        backgroundColor={backgroundColor}\n        paddingTop={3}\n        paddingBottom={hasActionButtonBelow ? 4 : 3}\n        paddingLeft={4}\n        paddingRight={shouldShowCloseButton ? 2 : 4}\n        className={twMerge('rounded-xl', className)}\n      >\n        {startAccessory}\n\n        <Box\n          className=\"min-w-0 flex-1\"\n          ref={(node) => {\n            contentRef.current = node;\n          }}\n        >\n          {hasTitle &&\n            (isTextContent(title) ? (\n              <Text\n                variant={TextVariant.BodyMd}\n                fontWeight={FontWeight.Medium}\n                {...titleProps}\n              >\n                {title}\n              </Text>\n            ) : (\n              title\n            ))}\n\n          {hasDescription && (\n            <Box className={hasTitle ? 'mt-0.5' : undefined}>\n              {isTextContent(description) ? (\n                <Text variant={TextVariant.BodySm} {...descriptionProps}>\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </Box>\n          )}\n\n          {hasChildren &&\n            (isTextContent(children) ? (\n              <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n                {children}\n              </Text>\n            ) : (\n              children\n            ))}\n\n          {hasActionButtonBelow && <Box className=\"mt-2\">{actionButton}</Box>}\n        </Box>\n\n        {shouldShowActionButton && isActionButtonLayoutEnd && (\n          <Box className=\"self-center\">{actionButton}</Box>\n        )}\n\n        {shouldShowCloseButton && (\n          <ButtonIcon\n            className={twMerge(\n              !isCenterAligned && '-mt-1',\n              closeButtonClassName,\n            )}\n            iconName={IconName.Close}\n            size={ButtonIconSize.Md}\n            ariaLabel={closeButtonAriaLabel}\n            onClick={onClose}\n            {...resolvedCloseButtonProps}\n          />\n        )}\n      </Box>\n    );\n  },\n);\n\nBannerBase.displayName = 'BannerBase';\n"]}