{"version":3,"file":"PopoverHeader.cjs","sourceRoot":"","sources":["../../../src/components/PopoverHeader/PopoverHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAKwC;AACxC,+CAA0C;AAE1C,uDAA+C;AAC/C,0CAA6B;AAC7B,wDAA2C;AAC3C,4CAA0C;AAI7B,QAAA,aAAa,GAAG,IAAA,kBAAU,EACrC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,cAAc,EACd,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,2EAA2E;IAC3E,kEAAkE;IAClE,yEAAyE;IACzE,wEAAwE;IACxE,wEAAwE;IACxE,0EAA0E;IAC1E,2EAA2E;IAC3E,MAAM,sBAAsB,GAC1B,cAAc;QACd,CAAC,MAAM,IAAI,eAAe,CAAC,CAAC,CAAC,CAC3B,8BAAC,uBAAU,IACT,QAAQ,EAAE,+BAAQ,CAAC,SAAS,EAC5B,IAAI,EAAE,qCAAc,CAAC,EAAE,EACvB,OAAO,EAAE,MAAM,KACX,eAAe,EACnB,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,eAAe,CAAC,SAAS,CAAC,GAC7D,CACH,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAEZ,MAAM,oBAAoB,GACxB,YAAY;QACZ,CAAC,OAAO,IAAI,gBAAgB,CAAC,CAAC,CAAC,CAC7B,8BAAC,uBAAU,IACT,QAAQ,EAAE,+BAAQ,CAAC,KAAK,EACxB,IAAI,EAAE,qCAAc,CAAC,EAAE,EACvB,OAAO,EAAE,OAAO,KACZ,gBAAgB,EACpB,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,gBAAgB,CAAC,SAAS,CAAC,GAC9D,CACH,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAEZ,MAAM,YAAY,GAChB,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC7B,8BAAC,WAAI,IACH,OAAO,EAAE,kCAAW,CAAC,SAAS,EAC9B,SAAS,EAAE,gBAAS,CAAC,MAAM,EAC3B,KAAK,EAAE,gCAAS,CAAC,OAAO,IAEvB,QAAQ,CACJ,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;IAEJ,OAAO,CACL,0CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,kBAAO;QAChB,oEAAoE;QACpE,gEAAgE;QAChE,4DAA4D;QAC5D,oEAAoE;QACpE,gEAAgE;QAChE,qBAAqB;QACrB,4CAA4C,EAC5C,SAAS,CACV,KACG,IAAI;QAEP,sBAAsB,IAAI,CACzB,8BAAC,SAAG,IAAC,SAAS,EAAC,gCAAgC,IAC5C,sBAAsB,CACnB,CACP;QACA,YAAY,KAAK,SAAS,IAAI,YAAY,KAAK,IAAI,IAAI,CACtD,8BAAC,SAAG,IAAC,SAAS,EAAC,8BAA8B,IAAE,YAAY,CAAO,CACnE;QACA,oBAAoB,IAAI,CACvB,8BAAC,SAAG,IAAC,SAAS,EAAC,8BAA8B,IAC1C,oBAAoB,CACjB,CACP,CACM,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import {\n  ButtonIconSize,\n  IconName,\n  TextColor,\n  TextVariant,\n} from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Box } from '../Box';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text, TextAlign } from '../Text';\n\nimport type { PopoverHeaderProps } from './PopoverHeader.types';\n\nexport const PopoverHeader = forwardRef<HTMLElement, PopoverHeaderProps>(\n  (props, ref) => {\n    const {\n      children,\n      className,\n      startAccessory,\n      endAccessory,\n      onBack,\n      backButtonProps,\n      onClose,\n      closeButtonProps,\n      ...rest\n    } = props;\n\n    // The discriminated union on `PopoverHeaderProps` guarantees that whenever\n    // `onBack` is set, `backButtonProps` is also set (with a required\n    // `ariaLabel`). Same for `onClose` / `closeButtonProps`. The `&&` checks\n    // below give TypeScript a narrowing point and double as runtime guards.\n    // The auto-rendered icon buttons default to `text-inherit` so they pick\n    // up the popover surface color (preserving the legacy `IconColor.inherit`\n    // behavior); consumers can still override via `className` on the prop bag.\n    const resolvedStartAccessory =\n      startAccessory ??\n      (onBack && backButtonProps ? (\n        <ButtonIcon\n          iconName={IconName.ArrowLeft}\n          size={ButtonIconSize.Sm}\n          onClick={onBack}\n          {...backButtonProps}\n          className={twMerge('text-inherit', backButtonProps.className)}\n        />\n      ) : null);\n\n    const resolvedEndAccessory =\n      endAccessory ??\n      (onClose && closeButtonProps ? (\n        <ButtonIcon\n          iconName={IconName.Close}\n          size={ButtonIconSize.Sm}\n          onClick={onClose}\n          {...closeButtonProps}\n          className={twMerge('text-inherit', closeButtonProps.className)}\n        />\n      ) : null);\n\n    const titleContent =\n      typeof children === 'string' ? (\n        <Text\n          variant={TextVariant.HeadingSm}\n          textAlign={TextAlign.Center}\n          color={TextColor.Inherit}\n        >\n          {children}\n        </Text>\n      ) : (\n        children\n      );\n\n    return (\n      <header\n        ref={ref}\n        className={twMerge(\n          // Three-column grid keeps the title visually centered regardless of\n          // which side accessories are present — same layout primitive as\n          // `HeaderBase`, replicated here so the outer element is the\n          // semantic `<header>` (no extra wrapper div). Unlike `ModalHeader`,\n          // PopoverHeader applies no outer padding — popover surfaces own\n          // their own spacing.\n          'grid grid-cols-[1fr_auto_1fr] items-center',\n          className,\n        )}\n        {...rest}\n      >\n        {resolvedStartAccessory && (\n          <Box className=\"col-start-1 justify-self-start\">\n            {resolvedStartAccessory}\n          </Box>\n        )}\n        {titleContent !== undefined && titleContent !== null && (\n          <Box className=\"col-start-2 col-end-3 w-full\">{titleContent}</Box>\n        )}\n        {resolvedEndAccessory && (\n          <Box className=\"col-start-3 justify-self-end\">\n            {resolvedEndAccessory}\n          </Box>\n        )}\n      </header>\n    );\n  },\n);\n\nPopoverHeader.displayName = 'PopoverHeader';\n"]}