@razorpay/blade 11.37.0 → 11.38.1

package/build/lib/web/development/components/Toast/ToastContainer.web.js

@@ -1,5 +1,6 @@
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { useToaster, resolveValue } from 'react-hot-toast';
 import React__default from 'react';
@@ -9,6 +10,7 @@ import '../../utils/index.js';
 import '../Box/BaseBox/index.js';
 import { useIsMobile } from '../../utils/useIsMobile.js';
 import '../../utils/metaAttribute/index.js';
+import '../../utils/makeAnalyticsAttribute/index.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
 import { makeMotionTime } from '../../utils/makeMotionTime/makeMotionTime.web.js';
@@ -16,7 +18,9 @@ import useTheme from '../BladeProvider/useTheme.js';
 import { makeSize } from '../../utils/makeSize/makeSize.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
+import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 
+var _excluded = ["reverseOrder", "position", "toastOptions", "containerClassName"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var StyledToastWrapper = /*#__PURE__*/styled(BaseBox).withConfig({
@@ -77,7 +81,8 @@ var Toaster = function Toaster(_ref2) {
     _ref2$position = _ref2.position,
     position = _ref2$position === void 0 ? 'top-center' : _ref2$position,
     toastOptions = _ref2.toastOptions,
-    containerClassName = _ref2.containerClassName;
+    containerClassName = _ref2.containerClassName,
+    rest = _objectWithoutProperties(_ref2, _excluded);
   var _useToaster = useToaster(toastOptions),
     toasts = _useToaster.toasts,
     handlers = _useToaster.handlers;
@@ -211,7 +216,7 @@ var Toaster = function Toaster(_ref2) {
       return next;
     });
   };
-  return /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread({
+  return /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread(_objectSpread({
     position: "fixed",
     zIndex: TOAST_Z_INDEX,
     top: makeSize(containerGutter),
@@ -224,7 +229,7 @@ var Toaster = function Toaster(_ref2) {
     className: containerClassName
   }, metaAttribute({
     name: MetaConstants.ToastContainer
-  })), {}, {
+  })), makeAnalyticsAttribute(rest)), {}, {
     children: [/*#__PURE__*/jsx(BaseBox, _objectSpread({
       position: "absolute",
       bottom: "".concat(promoToastHeight, "px"),

package/build/lib/web/development/components/Toast/ToastContainer.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastContainer.web.js","sources":["../../../../../../src/components/Toast/ToastContainer.web.tsx"],"sourcesContent":["import type { ToastPosition, ToasterProps, Toast } from 'react-hot-toast';\nimport { resolveValue, useToaster } from 'react-hot-toast';\nimport React from 'react';\nimport styled from 'styled-components';\nimport {\n  PEEKS,\n  MAX_TOASTS,\n  SCALE_FACTOR,\n  GUTTER,\n  PEEK_GUTTER,\n  TOAST_MAX_WIDTH,\n  TOAST_Z_INDEX,\n  MIN_TOAST_MOBILE,\n  MIN_TOAST_DESKTOP,\n  CONTAINER_GUTTER_MOBILE,\n  CONTAINER_GUTTER_DESKTOP,\n} from './constants';\nimport { makeMotionTime, makeSize, useTheme } from '~utils';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { Theme } from '~components/BladeProvider';\nimport { useIsMobile } from '~utils/useIsMobile';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\ntype CalculateYPositionProps = {\n  toast: Toast;\n  index: number;\n  isExpanded: boolean;\n  reverseOrder?: boolean;\n};\n\nconst StyledToastWrapper = styled(BaseBox)<{\n  isVisible: boolean;\n  index: number;\n  isExpanded: boolean;\n  isPromotional: boolean;\n}>(({ isVisible, index, isExpanded, isPromotional }) => {\n  let opacity = isVisible ? 1 : 0;\n  // Only make the PEEKING and MAX_TOASTS toasts visible,\n  // Every other toasts should be hidden\n  if (index < PEEKS + MAX_TOASTS) {\n    opacity = 1;\n  } else if (isPromotional || isExpanded) {\n    opacity = 1;\n  } else {\n    opacity = 0;\n  }\n\n  return {\n    '& > *': {\n      pointerEvents: opacity === 1 ? 'auto' : 'none',\n    },\n    opacity,\n  };\n});\n\nconst getPositionStyle = (\n  position: ToastPosition,\n  offset: number,\n  scale: number,\n  theme: Theme,\n): React.CSSProperties => {\n  const top = position.includes('top');\n  const verticalStyle: React.CSSProperties = top ? { top: 0 } : { bottom: 0 };\n  const horizontalStyle: React.CSSProperties = position.includes('center')\n    ? {\n        justifyContent: 'center',\n      }\n    : position.includes('right')\n    ? {\n        justifyContent: 'flex-end',\n      }\n    : {};\n\n  return {\n    left: 0,\n    right: 0,\n    display: 'flex',\n    position: 'absolute',\n    transformOrigin: 'center',\n    transition: `${makeMotionTime(theme.motion.duration.gentle)} ${\n      theme.motion.easing.standard.effective\n    }`,\n    transitionProperty: 'transform, opacity, height',\n    transform: `translateY(${offset * (top ? 1 : -1)}px) scale(${scale})`,\n    ...verticalStyle,\n    ...horizontalStyle,\n  };\n};\n\nfunction isPromotionalToast(toast: Toast): boolean {\n  // @ts-expect-error\n  return toast.type == 'promotional';\n}\n\nconst Toaster: React.FC<ToasterProps> = ({\n  reverseOrder,\n  position = 'top-center',\n  toastOptions,\n  containerClassName,\n}) => {\n  const { toasts, handlers } = useToaster(toastOptions);\n  const { theme } = useTheme();\n  const [frontToastHeight, setFrontToastHeight] = React.useState(0);\n  const [hasManuallyExpanded, setHasManuallyExpanded] = React.useState(false);\n  const isMobile = useIsMobile();\n  const minToasts = isMobile ? MIN_TOAST_MOBILE : MIN_TOAST_DESKTOP;\n  const containerGutter = isMobile ? CONTAINER_GUTTER_MOBILE : CONTAINER_GUTTER_DESKTOP;\n\n  const infoToasts = React.useMemo(() => toasts.filter((toast) => !isPromotionalToast(toast)), [\n    toasts,\n  ]);\n  const promoToasts = React.useMemo(() => toasts.filter((toast) => isPromotionalToast(toast)), [\n    toasts,\n  ]);\n\n  // always keep promo toasts at the bottom of the stack\n  const recomputedToasts = React.useMemo(() => [...infoToasts, ...promoToasts], [\n    infoToasts,\n    promoToasts,\n  ]);\n\n  const hasPromoToast = promoToasts.length > 0 && promoToasts[0]?.visible;\n  const promoToastHeight = promoToasts[0]?.height ?? 0;\n  const isExpanded = hasManuallyExpanded || recomputedToasts.length <= minToasts;\n\n  React.useLayoutEffect(() => {\n    // find the first toast which is visible\n    const firstToast = infoToasts.find((t, index) => t.visible && index === 0);\n    if (firstToast) {\n      setFrontToastHeight(firstToast.height ?? 0);\n    }\n  }, [infoToasts]);\n\n  // calculate total height of all toasts\n  const totalHeight = React.useMemo(() => {\n    return (\n      recomputedToasts\n        // only consider visible recomputedToasts\n        .filter((toast) => toast.visible)\n        .reduce((prevHeight, toast) => prevHeight + (toast.height ?? 0), 0) +\n      recomputedToasts.length * GUTTER\n    );\n  }, [recomputedToasts]);\n\n  // Stacking logic explained in detail:\n  // https://www.loom.com/share/522d9a445e2f41e1886cce4decb9ab9d?sid=4287acf6-8d44-431b-93e1-c1a0d40a0aba\n  //\n  // 1. 3 toasts can be stacked on top of each other\n  // 2. After 3 toasts, the toasts will be scaled down and peek from behind\n  // 3. There can be maximum of 3 toasts peeking from behind\n  // 4. After 3 peeking toasts, the toasts will be hidden\n  // 5. If there is a promo toast, all toasts will be lifted up\n  // 6. Promo toasts will always be on the bottom\n  const calculateYPosition = React.useCallback(\n    ({ toast, index }: CalculateYPositionProps) => {\n      // find the current toast index\n      const toastIndex = infoToasts.findIndex((t) => t.id === toast.id);\n      // number of toasts before this toast\n      const toastsBefore = infoToasts.filter((toast, i) => i < toastIndex && toast.visible).length;\n\n      let scale = Math.max(0.7, 1 - toastsBefore * SCALE_FACTOR);\n      // first toast should always have a scale of 1\n      if (index < MAX_TOASTS) {\n        scale = 1;\n      }\n\n      // y position of toast,\n      let offset = infoToasts\n        .filter((toast) => toast.visible)\n        .slice(0, toastsBefore)\n        .reduce((y, toast) => {\n          // if the toast is expanded, add the height of the toast + gutter\n          if (isExpanded) {\n            return y + (toast.height ?? 0) + GUTTER;\n          }\n          // if the toast is not expanded, add only the peek gutter\n          return y + PEEK_GUTTER;\n        }, 0);\n\n      // lift all info toasts up if there is a promo toast\n      if (hasPromoToast) {\n        offset += GUTTER + promoToastHeight;\n      }\n\n      // if this is a promo toast, then put it at the bottom and force the scale to 1\n      if (isPromotionalToast(toast)) {\n        offset = 0;\n        scale = 1;\n      }\n\n      return { offset, scale: isExpanded ? 1 : scale };\n    },\n    [hasPromoToast, infoToasts, isExpanded, promoToastHeight],\n  );\n\n  const handleMouseEnter = (): void => {\n    if (isMobile) return;\n    setHasManuallyExpanded(true);\n    handlers.startPause();\n  };\n\n  const handleMouseLeave = (): void => {\n    if (isMobile) return;\n    setHasManuallyExpanded(false);\n    handlers.endPause();\n  };\n\n  const handleToastClick = (): void => {\n    if (!isMobile) return;\n    setHasManuallyExpanded((prev) => {\n      const next = !prev;\n      if (next) {\n        handlers.startPause();\n      } else {\n        handlers.endPause();\n      }\n      return next;\n    });\n  };\n\n  return (\n    <BaseBox\n      position=\"fixed\"\n      zIndex={TOAST_Z_INDEX}\n      top={makeSize(containerGutter)}\n      left={makeSize(containerGutter)}\n      right={makeSize(containerGutter)}\n      bottom={makeSize(containerGutter)}\n      width={`calc(100% - ${containerGutter * 2}px)`}\n      maxWidth={makeSize(TOAST_MAX_WIDTH)}\n      pointerEvents=\"none\"\n      className={containerClassName}\n      {...metaAttribute({ name: MetaConstants.ToastContainer })}\n    >\n      {/*\n       * Mouseover container,\n       * fills in the gap between toasts so that mouseleave doesn't trigger in the gaps\n       */}\n      <BaseBox\n        position=\"absolute\"\n        bottom={`${promoToastHeight}px`}\n        left=\"0px\"\n        width=\"100%\"\n        pointerEvents={isExpanded ? 'all' : 'none'}\n        height={makeSize(isExpanded ? totalHeight - promoToastHeight : frontToastHeight)}\n        zIndex={-100}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        onClick={handleToastClick}\n        {...metaAttribute({ testID: 'toast-mouseover-container' })}\n      />\n      {recomputedToasts.map((toast, index) => {\n        const toastPosition = toast.position ?? position;\n        const isPromotional = isPromotionalToast(toast);\n        const { offset, scale } = calculateYPosition({\n          toast,\n          isExpanded,\n          reverseOrder,\n          index,\n        });\n        const positionStyle = getPositionStyle(toastPosition, offset, scale, theme);\n        // recalculate height of toast\n        const ref = (el: HTMLDivElement): void => {\n          if (el && typeof toast.height !== 'number') {\n            const height = el.getBoundingClientRect().height;\n            handlers.updateHeight(toast.id, height);\n          }\n        };\n\n        let toastHeight = toast.height;\n        if (index > MAX_TOASTS - 1 && !isPromotional) {\n          toastHeight = frontToastHeight;\n        }\n        if (isExpanded) {\n          toastHeight = toast.height;\n        }\n\n        return (\n          <StyledToastWrapper\n            key={toast.id}\n            index={index}\n            ref={ref}\n            isExpanded={isExpanded}\n            isVisible={toast.visible}\n            isPromotional={isPromotional}\n            style={{\n              ...positionStyle,\n              zIndex: -1 * index,\n              height: toastHeight,\n              overflow: 'hidden',\n            }}\n            onMouseEnter={() => {\n              if (isPromotional) return;\n              handleMouseEnter();\n            }}\n            onMouseLeave={() => {\n              if (isPromotional) return;\n              handleMouseLeave();\n            }}\n            onClick={() => {\n              if (isPromotional) return;\n              handleToastClick();\n            }}\n          >\n            <BaseBox height=\"fit-content\" width=\"100%\">\n              {resolveValue(toast.message, { ...toast, index })}\n            </BaseBox>\n          </StyledToastWrapper>\n        );\n      })}\n    </BaseBox>\n  );\n};\n\nconst ToastContainer = (): React.ReactElement => {\n  return <Toaster position=\"bottom-left\" />;\n};\n\nexport { ToastContainer };\n"],"names":["StyledToastWrapper","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","index","isExpanded","isPromotional","opacity","PEEKS","MAX_TOASTS","pointerEvents","getPositionStyle","position","offset","scale","theme","top","includes","verticalStyle","bottom","horizontalStyle","justifyContent","_objectSpread","left","right","display","transformOrigin","transition","concat","makeMotionTime","motion","duration","gentle","easing","standard","effective","transitionProperty","transform","isPromotionalToast","toast","type","Toaster","_ref2","_promoToasts$","_promoToasts$0$height","_promoToasts$2","reverseOrder","_ref2$position","toastOptions","containerClassName","_useToaster","useToaster","toasts","handlers","_useTheme","useTheme","_React$useState","React","useState","_React$useState2","_slicedToArray","frontToastHeight","setFrontToastHeight","_React$useState3","_React$useState4","hasManuallyExpanded","setHasManuallyExpanded","isMobile","useIsMobile","minToasts","MIN_TOAST_MOBILE","MIN_TOAST_DESKTOP","containerGutter","CONTAINER_GUTTER_MOBILE","CONTAINER_GUTTER_DESKTOP","infoToasts","useMemo","filter","promoToasts","recomputedToasts","_toConsumableArray","hasPromoToast","length","visible","promoToastHeight","height","useLayoutEffect","firstToast","find","t","_firstToast$height","totalHeight","reduce","prevHeight","_toast$height","GUTTER","calculateYPosition","useCallback","_ref3","toastIndex","findIndex","id","toastsBefore","i","Math","max","SCALE_FACTOR","slice","y","_toast$height2","PEEK_GUTTER","handleMouseEnter","startPause","handleMouseLeave","endPause","handleToastClick","prev","next","_jsxs","zIndex","TOAST_Z_INDEX","makeSize","width","maxWidth","TOAST_MAX_WIDTH","className","metaAttribute","name","MetaConstants","ToastContainer","children","_jsx","onMouseEnter","onMouseLeave","onClick","testID","map","_toast$position","toastPosition","_calculateYPosition","positionStyle","ref","el","getBoundingClientRect","updateHeight","toastHeight","style","overflow","resolveValue","message"],"mappings":"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"}
+{"version":3,"file":"ToastContainer.web.js","sources":["../../../../../../src/components/Toast/ToastContainer.web.tsx"],"sourcesContent":["import type { ToastPosition, ToasterProps, Toast } from 'react-hot-toast';\nimport { resolveValue, useToaster } from 'react-hot-toast';\nimport React from 'react';\nimport styled from 'styled-components';\nimport {\n  PEEKS,\n  MAX_TOASTS,\n  SCALE_FACTOR,\n  GUTTER,\n  PEEK_GUTTER,\n  TOAST_MAX_WIDTH,\n  TOAST_Z_INDEX,\n  MIN_TOAST_MOBILE,\n  MIN_TOAST_DESKTOP,\n  CONTAINER_GUTTER_MOBILE,\n  CONTAINER_GUTTER_DESKTOP,\n} from './constants';\nimport { makeMotionTime, makeSize, useTheme } from '~utils';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { Theme } from '~components/BladeProvider';\nimport { useIsMobile } from '~utils/useIsMobile';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype CalculateYPositionProps = {\n  toast: Toast;\n  index: number;\n  isExpanded: boolean;\n  reverseOrder?: boolean;\n};\n\nconst StyledToastWrapper = styled(BaseBox)<{\n  isVisible: boolean;\n  index: number;\n  isExpanded: boolean;\n  isPromotional: boolean;\n}>(({ isVisible, index, isExpanded, isPromotional }) => {\n  let opacity = isVisible ? 1 : 0;\n  // Only make the PEEKING and MAX_TOASTS toasts visible,\n  // Every other toasts should be hidden\n  if (index < PEEKS + MAX_TOASTS) {\n    opacity = 1;\n  } else if (isPromotional || isExpanded) {\n    opacity = 1;\n  } else {\n    opacity = 0;\n  }\n\n  return {\n    '& > *': {\n      pointerEvents: opacity === 1 ? 'auto' : 'none',\n    },\n    opacity,\n  };\n});\n\nconst getPositionStyle = (\n  position: ToastPosition,\n  offset: number,\n  scale: number,\n  theme: Theme,\n): React.CSSProperties => {\n  const top = position.includes('top');\n  const verticalStyle: React.CSSProperties = top ? { top: 0 } : { bottom: 0 };\n  const horizontalStyle: React.CSSProperties = position.includes('center')\n    ? {\n        justifyContent: 'center',\n      }\n    : position.includes('right')\n    ? {\n        justifyContent: 'flex-end',\n      }\n    : {};\n\n  return {\n    left: 0,\n    right: 0,\n    display: 'flex',\n    position: 'absolute',\n    transformOrigin: 'center',\n    transition: `${makeMotionTime(theme.motion.duration.gentle)} ${\n      theme.motion.easing.standard.effective\n    }`,\n    transitionProperty: 'transform, opacity, height',\n    transform: `translateY(${offset * (top ? 1 : -1)}px) scale(${scale})`,\n    ...verticalStyle,\n    ...horizontalStyle,\n  };\n};\n\nfunction isPromotionalToast(toast: Toast): boolean {\n  // @ts-expect-error\n  return toast.type == 'promotional';\n}\n\nconst Toaster: React.FC<ToasterProps> = ({\n  reverseOrder,\n  position = 'top-center',\n  toastOptions,\n  containerClassName,\n  ...rest\n}) => {\n  const { toasts, handlers } = useToaster(toastOptions);\n  const { theme } = useTheme();\n  const [frontToastHeight, setFrontToastHeight] = React.useState(0);\n  const [hasManuallyExpanded, setHasManuallyExpanded] = React.useState(false);\n  const isMobile = useIsMobile();\n  const minToasts = isMobile ? MIN_TOAST_MOBILE : MIN_TOAST_DESKTOP;\n  const containerGutter = isMobile ? CONTAINER_GUTTER_MOBILE : CONTAINER_GUTTER_DESKTOP;\n\n  const infoToasts = React.useMemo(() => toasts.filter((toast) => !isPromotionalToast(toast)), [\n    toasts,\n  ]);\n  const promoToasts = React.useMemo(() => toasts.filter((toast) => isPromotionalToast(toast)), [\n    toasts,\n  ]);\n\n  // always keep promo toasts at the bottom of the stack\n  const recomputedToasts = React.useMemo(() => [...infoToasts, ...promoToasts], [\n    infoToasts,\n    promoToasts,\n  ]);\n\n  const hasPromoToast = promoToasts.length > 0 && promoToasts[0]?.visible;\n  const promoToastHeight = promoToasts[0]?.height ?? 0;\n  const isExpanded = hasManuallyExpanded || recomputedToasts.length <= minToasts;\n\n  React.useLayoutEffect(() => {\n    // find the first toast which is visible\n    const firstToast = infoToasts.find((t, index) => t.visible && index === 0);\n    if (firstToast) {\n      setFrontToastHeight(firstToast.height ?? 0);\n    }\n  }, [infoToasts]);\n\n  // calculate total height of all toasts\n  const totalHeight = React.useMemo(() => {\n    return (\n      recomputedToasts\n        // only consider visible recomputedToasts\n        .filter((toast) => toast.visible)\n        .reduce((prevHeight, toast) => prevHeight + (toast.height ?? 0), 0) +\n      recomputedToasts.length * GUTTER\n    );\n  }, [recomputedToasts]);\n\n  // Stacking logic explained in detail:\n  // https://www.loom.com/share/522d9a445e2f41e1886cce4decb9ab9d?sid=4287acf6-8d44-431b-93e1-c1a0d40a0aba\n  //\n  // 1. 3 toasts can be stacked on top of each other\n  // 2. After 3 toasts, the toasts will be scaled down and peek from behind\n  // 3. There can be maximum of 3 toasts peeking from behind\n  // 4. After 3 peeking toasts, the toasts will be hidden\n  // 5. If there is a promo toast, all toasts will be lifted up\n  // 6. Promo toasts will always be on the bottom\n  const calculateYPosition = React.useCallback(\n    ({ toast, index }: CalculateYPositionProps) => {\n      // find the current toast index\n      const toastIndex = infoToasts.findIndex((t) => t.id === toast.id);\n      // number of toasts before this toast\n      const toastsBefore = infoToasts.filter((toast, i) => i < toastIndex && toast.visible).length;\n\n      let scale = Math.max(0.7, 1 - toastsBefore * SCALE_FACTOR);\n      // first toast should always have a scale of 1\n      if (index < MAX_TOASTS) {\n        scale = 1;\n      }\n\n      // y position of toast,\n      let offset = infoToasts\n        .filter((toast) => toast.visible)\n        .slice(0, toastsBefore)\n        .reduce((y, toast) => {\n          // if the toast is expanded, add the height of the toast + gutter\n          if (isExpanded) {\n            return y + (toast.height ?? 0) + GUTTER;\n          }\n          // if the toast is not expanded, add only the peek gutter\n          return y + PEEK_GUTTER;\n        }, 0);\n\n      // lift all info toasts up if there is a promo toast\n      if (hasPromoToast) {\n        offset += GUTTER + promoToastHeight;\n      }\n\n      // if this is a promo toast, then put it at the bottom and force the scale to 1\n      if (isPromotionalToast(toast)) {\n        offset = 0;\n        scale = 1;\n      }\n\n      return { offset, scale: isExpanded ? 1 : scale };\n    },\n    [hasPromoToast, infoToasts, isExpanded, promoToastHeight],\n  );\n\n  const handleMouseEnter = (): void => {\n    if (isMobile) return;\n    setHasManuallyExpanded(true);\n    handlers.startPause();\n  };\n\n  const handleMouseLeave = (): void => {\n    if (isMobile) return;\n    setHasManuallyExpanded(false);\n    handlers.endPause();\n  };\n\n  const handleToastClick = (): void => {\n    if (!isMobile) return;\n    setHasManuallyExpanded((prev) => {\n      const next = !prev;\n      if (next) {\n        handlers.startPause();\n      } else {\n        handlers.endPause();\n      }\n      return next;\n    });\n  };\n\n  return (\n    <BaseBox\n      position=\"fixed\"\n      zIndex={TOAST_Z_INDEX}\n      top={makeSize(containerGutter)}\n      left={makeSize(containerGutter)}\n      right={makeSize(containerGutter)}\n      bottom={makeSize(containerGutter)}\n      width={`calc(100% - ${containerGutter * 2}px)`}\n      maxWidth={makeSize(TOAST_MAX_WIDTH)}\n      pointerEvents=\"none\"\n      className={containerClassName}\n      {...metaAttribute({ name: MetaConstants.ToastContainer })}\n      {...makeAnalyticsAttribute(rest)}\n    >\n      {/*\n       * Mouseover container,\n       * fills in the gap between toasts so that mouseleave doesn't trigger in the gaps\n       */}\n      <BaseBox\n        position=\"absolute\"\n        bottom={`${promoToastHeight}px`}\n        left=\"0px\"\n        width=\"100%\"\n        pointerEvents={isExpanded ? 'all' : 'none'}\n        height={makeSize(isExpanded ? totalHeight - promoToastHeight : frontToastHeight)}\n        zIndex={-100}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        onClick={handleToastClick}\n        {...metaAttribute({ testID: 'toast-mouseover-container' })}\n      />\n      {recomputedToasts.map((toast, index) => {\n        const toastPosition = toast.position ?? position;\n        const isPromotional = isPromotionalToast(toast);\n        const { offset, scale } = calculateYPosition({\n          toast,\n          isExpanded,\n          reverseOrder,\n          index,\n        });\n        const positionStyle = getPositionStyle(toastPosition, offset, scale, theme);\n        // recalculate height of toast\n        const ref = (el: HTMLDivElement): void => {\n          if (el && typeof toast.height !== 'number') {\n            const height = el.getBoundingClientRect().height;\n            handlers.updateHeight(toast.id, height);\n          }\n        };\n\n        let toastHeight = toast.height;\n        if (index > MAX_TOASTS - 1 && !isPromotional) {\n          toastHeight = frontToastHeight;\n        }\n        if (isExpanded) {\n          toastHeight = toast.height;\n        }\n\n        return (\n          <StyledToastWrapper\n            key={toast.id}\n            index={index}\n            ref={ref}\n            isExpanded={isExpanded}\n            isVisible={toast.visible}\n            isPromotional={isPromotional}\n            style={{\n              ...positionStyle,\n              zIndex: -1 * index,\n              height: toastHeight,\n              overflow: 'hidden',\n            }}\n            onMouseEnter={() => {\n              if (isPromotional) return;\n              handleMouseEnter();\n            }}\n            onMouseLeave={() => {\n              if (isPromotional) return;\n              handleMouseLeave();\n            }}\n            onClick={() => {\n              if (isPromotional) return;\n              handleToastClick();\n            }}\n          >\n            <BaseBox height=\"fit-content\" width=\"100%\">\n              {resolveValue(toast.message, { ...toast, index })}\n            </BaseBox>\n          </StyledToastWrapper>\n        );\n      })}\n    </BaseBox>\n  );\n};\n\nconst ToastContainer = (): React.ReactElement => {\n  return <Toaster position=\"bottom-left\" />;\n};\n\nexport { ToastContainer };\n"],"names":["StyledToastWrapper","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","index","isExpanded","isPromotional","opacity","PEEKS","MAX_TOASTS","pointerEvents","getPositionStyle","position","offset","scale","theme","top","includes","verticalStyle","bottom","horizontalStyle","justifyContent","_objectSpread","left","right","display","transformOrigin","transition","concat","makeMotionTime","motion","duration","gentle","easing","standard","effective","transitionProperty","transform","isPromotionalToast","toast","type","Toaster","_ref2","_promoToasts$","_promoToasts$0$height","_promoToasts$2","reverseOrder","_ref2$position","toastOptions","containerClassName","rest","_objectWithoutProperties","_excluded","_useToaster","useToaster","toasts","handlers","_useTheme","useTheme","_React$useState","React","useState","_React$useState2","_slicedToArray","frontToastHeight","setFrontToastHeight","_React$useState3","_React$useState4","hasManuallyExpanded","setHasManuallyExpanded","isMobile","useIsMobile","minToasts","MIN_TOAST_MOBILE","MIN_TOAST_DESKTOP","containerGutter","CONTAINER_GUTTER_MOBILE","CONTAINER_GUTTER_DESKTOP","infoToasts","useMemo","filter","promoToasts","recomputedToasts","_toConsumableArray","hasPromoToast","length","visible","promoToastHeight","height","useLayoutEffect","firstToast","find","t","_firstToast$height","totalHeight","reduce","prevHeight","_toast$height","GUTTER","calculateYPosition","useCallback","_ref3","toastIndex","findIndex","id","toastsBefore","i","Math","max","SCALE_FACTOR","slice","y","_toast$height2","PEEK_GUTTER","handleMouseEnter","startPause","handleMouseLeave","endPause","handleToastClick","prev","next","_jsxs","zIndex","TOAST_Z_INDEX","makeSize","width","maxWidth","TOAST_MAX_WIDTH","className","metaAttribute","name","MetaConstants","ToastContainer","makeAnalyticsAttribute","children","_jsx","onMouseEnter","onMouseLeave","onClick","testID","map","_toast$position","toastPosition","_calculateYPosition","positionStyle","ref","el","getBoundingClientRect","updateHeight","toastHeight","style","overflow","resolveValue","message"],"mappings":"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"}

package/build/lib/web/development/components/Tooltip/Tooltip.web.js

@@ -1,5 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { useFloating, shift, flip, offset, arrow, autoUpdate, useTransitionStyles, useDelayGroup, useDelayGroupContext, useHover, useFocus, useRole, useInteractions, FloatingPortal } from '@floating-ui/react';
 import React__default from 'react';
 import { TooltipContent } from './TooltipContent.js';
@@ -15,6 +16,7 @@ import { mergeProps } from '../../utils/mergeProps.js';
 import '../PopupArrow/index.js';
 import { getFloatingPlacementParts } from '../../utils/getFloatingPlacementParts.js';
 import { componentZIndices } from '../../utils/componentZIndices.js';
+import '../../utils/makeAnalyticsAttribute/index.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import useTheme from '../BladeProvider/useTheme.js';
 import { size } from '../../tokens/global/size.js';
@@ -22,8 +24,10 @@ import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.web.js
 import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
+import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { PopupArrow } from '../PopupArrow/PopupArrow.web.js';
 
+var _excluded = ["title", "content", "children", "placement", "onOpenChange", "zIndex"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Tooltip = function Tooltip(_ref) {
@@ -34,7 +38,8 @@ var Tooltip = function Tooltip(_ref) {
     placement = _ref$placement === void 0 ? 'top' : _ref$placement,
     _onOpenChange = _ref.onOpenChange,
     _ref$zIndex = _ref.zIndex,
-    zIndex = _ref$zIndex === void 0 ? componentZIndices.tooltip : _ref$zIndex;
+    zIndex = _ref$zIndex === void 0 ? componentZIndices.tooltip : _ref$zIndex,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useTheme = useTheme(),
     theme = _useTheme.theme;
   var id = useId();
@@ -106,14 +111,14 @@ var Tooltip = function Tooltip(_ref) {
     }, makeAccessible({
       label: content
     })), mergeProps(children.props, getReferenceProps()))), isMounted && /*#__PURE__*/jsx(FloatingPortal, {
-      children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread({
+      children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
         ref: refs.setFloating,
         style: floatingStyles,
         pointerEvents: "none",
         zIndex: zIndex
       }, getFloatingProps()), metaAttribute({
         name: MetaConstants.Tooltip
-      })), {}, {
+      })), makeAnalyticsAttribute(rest)), {}, {
         children: /*#__PURE__*/jsx(TooltipContent, {
           title: title,
           style: styles,

package/build/lib/web/development/components/Tooltip/Tooltip.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.web.js","sources":["../../../../../../src/components/Tooltip/Tooltip.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n  shift,\n  FloatingPortal,\n  arrow,\n  flip,\n  offset,\n  useDelayGroup,\n  useDelayGroupContext,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n  autoUpdate,\n} from '@floating-ui/react';\nimport React from 'react';\nimport type { TooltipProps } from './types';\nimport { TooltipContent } from './TooltipContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from './constants';\nimport { TooltipContext } from './TooltipContext';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useId } from '~utils/useId';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { mergeProps } from '~utils/mergeProps';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport { componentZIndices } from '~utils/componentZIndices';\n\nconst Tooltip = ({\n  title,\n  content,\n  children,\n  placement = 'top',\n  onOpenChange,\n  zIndex = componentZIndices.tooltip,\n}: TooltipProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const id = useId();\n  const [isOpen, setIsOpen] = React.useState(false);\n  const arrowRef = React.useRef<SVGSVGElement>(null);\n\n  const GAP = theme.spacing[2];\n  const [side] = getFloatingPlacementParts(placement);\n  const isHorizontal = side === 'left' || side === 'right';\n  const isOppositeAxis = side === 'right' || side === 'bottom';\n\n  const { refs, floatingStyles, context } = useFloating({\n    placement,\n    open: isOpen,\n    strategy: 'fixed',\n    onOpenChange: (open) => {\n      setIsOpen(open);\n      onOpenChange?.({ isOpen: open });\n    },\n    middleware: [\n      shift({ crossAxis: false, padding: GAP }),\n      flip({ padding: GAP }),\n      offset(GAP + ARROW_HEIGHT),\n      arrow({\n        element: arrowRef,\n        padding: isHorizontal ? 0 : ARROW_WIDTH,\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\n  });\n\n  const animationOffset = isOppositeAxis ? -size[4] : size[4];\n  const { isMounted, styles } = useTransitionStyles(context, {\n    duration: theme.motion.duration.quick,\n    initial: {\n      opacity: 0,\n      transform: `translate${isHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n    },\n  });\n\n  useDelayGroup(context, { id });\n  const { delay } = useDelayGroupContext();\n  const hover = useHover(context, {\n    delay,\n    move: false,\n  });\n  const focus = useFocus(context);\n  const role = useRole(context, { role: 'tooltip' });\n  const { getReferenceProps, getFloatingProps } = useInteractions([role, hover, focus]);\n\n  return (\n    <TooltipContext.Provider value={true}>\n      {React.cloneElement(children, {\n        ref: refs.setReference,\n        ...makeAccessible({ label: content }),\n        ...mergeProps(children.props, getReferenceProps()),\n      })}\n      {isMounted && (\n        <FloatingPortal>\n          <BaseBox\n            ref={refs.setFloating}\n            style={floatingStyles}\n            pointerEvents=\"none\"\n            zIndex={zIndex}\n            {...getFloatingProps()}\n            {...metaAttribute({ name: MetaConstants.Tooltip })}\n          >\n            <TooltipContent\n              title={title}\n              style={styles}\n              arrow={\n                <PopupArrow\n                  ref={arrowRef}\n                  context={context}\n                  width={ARROW_WIDTH}\n                  height={ARROW_HEIGHT}\n                  fillColor={theme.colors.popup.background.intense}\n                  strokeColor={theme.colors.popup.border.intense}\n                />\n              }\n            >\n              {content}\n            </TooltipContent>\n          </BaseBox>\n        </FloatingPortal>\n      )}\n    </TooltipContext.Provider>\n  );\n};\n\nexport { Tooltip };\n"],"names":["Tooltip","_ref","title","content","children","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","tooltip","_useTheme","useTheme","theme","id","useId","_React$useState","React","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","arrowRef","useRef","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","side","isHorizontal","isOppositeAxis","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","whileElementsMounted","autoUpdate","refs","floatingStyles","context","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","motion","quick","initial","opacity","transform","concat","isMounted","styles","useDelayGroup","_useDelayGroupContext","useDelayGroupContext","delay","hover","useHover","move","focus","useFocus","role","useRole","_useInteractions","useInteractions","getReferenceProps","getFloatingProps","_jsxs","TooltipContext","Provider","value","cloneElement","_objectSpread","ref","setReference","makeAccessible","label","mergeProps","props","_jsx","FloatingPortal","BaseBox","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","TooltipContent","PopupArrow","width","height","fillColor","colors","popup","background","intense","strokeColor","border"],"mappings":"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"}
+{"version":3,"file":"Tooltip.web.js","sources":["../../../../../../src/components/Tooltip/Tooltip.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n  shift,\n  FloatingPortal,\n  arrow,\n  flip,\n  offset,\n  useDelayGroup,\n  useDelayGroupContext,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n  autoUpdate,\n} from '@floating-ui/react';\nimport React from 'react';\nimport type { TooltipProps } from './types';\nimport { TooltipContent } from './TooltipContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from './constants';\nimport { TooltipContext } from './TooltipContext';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useId } from '~utils/useId';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { mergeProps } from '~utils/mergeProps';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst Tooltip = ({\n  title,\n  content,\n  children,\n  placement = 'top',\n  onOpenChange,\n  zIndex = componentZIndices.tooltip,\n  ...rest\n}: TooltipProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const id = useId();\n  const [isOpen, setIsOpen] = React.useState(false);\n  const arrowRef = React.useRef<SVGSVGElement>(null);\n\n  const GAP = theme.spacing[2];\n  const [side] = getFloatingPlacementParts(placement);\n  const isHorizontal = side === 'left' || side === 'right';\n  const isOppositeAxis = side === 'right' || side === 'bottom';\n\n  const { refs, floatingStyles, context } = useFloating({\n    placement,\n    open: isOpen,\n    strategy: 'fixed',\n    onOpenChange: (open) => {\n      setIsOpen(open);\n      onOpenChange?.({ isOpen: open });\n    },\n    middleware: [\n      shift({ crossAxis: false, padding: GAP }),\n      flip({ padding: GAP }),\n      offset(GAP + ARROW_HEIGHT),\n      arrow({\n        element: arrowRef,\n        padding: isHorizontal ? 0 : ARROW_WIDTH,\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\n  });\n\n  const animationOffset = isOppositeAxis ? -size[4] : size[4];\n  const { isMounted, styles } = useTransitionStyles(context, {\n    duration: theme.motion.duration.quick,\n    initial: {\n      opacity: 0,\n      transform: `translate${isHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n    },\n  });\n\n  useDelayGroup(context, { id });\n  const { delay } = useDelayGroupContext();\n  const hover = useHover(context, {\n    delay,\n    move: false,\n  });\n  const focus = useFocus(context);\n  const role = useRole(context, { role: 'tooltip' });\n  const { getReferenceProps, getFloatingProps } = useInteractions([role, hover, focus]);\n\n  return (\n    <TooltipContext.Provider value={true}>\n      {React.cloneElement(children, {\n        ref: refs.setReference,\n        ...makeAccessible({ label: content }),\n        ...mergeProps(children.props, getReferenceProps()),\n      })}\n      {isMounted && (\n        <FloatingPortal>\n          <BaseBox\n            ref={refs.setFloating}\n            style={floatingStyles}\n            pointerEvents=\"none\"\n            zIndex={zIndex}\n            {...getFloatingProps()}\n            {...metaAttribute({ name: MetaConstants.Tooltip })}\n            {...makeAnalyticsAttribute(rest)}\n          >\n            <TooltipContent\n              title={title}\n              style={styles}\n              arrow={\n                <PopupArrow\n                  ref={arrowRef}\n                  context={context}\n                  width={ARROW_WIDTH}\n                  height={ARROW_HEIGHT}\n                  fillColor={theme.colors.popup.background.intense}\n                  strokeColor={theme.colors.popup.border.intense}\n                />\n              }\n            >\n              {content}\n            </TooltipContent>\n          </BaseBox>\n        </FloatingPortal>\n      )}\n    </TooltipContext.Provider>\n  );\n};\n\nexport { Tooltip };\n"],"names":["Tooltip","_ref","title","content","children","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","tooltip","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","id","useId","_React$useState","React","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","arrowRef","useRef","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","side","isHorizontal","isOppositeAxis","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","whileElementsMounted","autoUpdate","refs","floatingStyles","context","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","motion","quick","initial","opacity","transform","concat","isMounted","styles","useDelayGroup","_useDelayGroupContext","useDelayGroupContext","delay","hover","useHover","move","focus","useFocus","role","useRole","_useInteractions","useInteractions","getReferenceProps","getFloatingProps","_jsxs","TooltipContext","Provider","value","cloneElement","_objectSpread","ref","setReference","makeAccessible","label","mergeProps","props","_jsx","FloatingPortal","BaseBox","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","makeAnalyticsAttribute","TooltipContent","PopupArrow","width","height","fillColor","colors","popup","background","intense","strokeColor","border"],"mappings":"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"}

package/build/lib/web/development/components/TopNav/TabNav/TabNav.web.js

@@ -12,8 +12,10 @@ import '../../../utils/index.js';
 import '../../../tokens/global/index.js';
 import '../../../utils/metaAttribute/index.js';
 import '../../Box/index.js';
+import '../../../utils/makeAnalyticsAttribute/index.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { Box } from '../../Box/Box.js';
+import { makeAnalyticsAttribute } from '../../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { Divider } from '../../Divider/Divider.js';
 import { makeSize } from '../../../utils/makeSize/makeSize.js';
 import { size } from '../../../tokens/global/size.js';
@@ -28,13 +30,14 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TabNavItems = function TabNavItems(_ref) {
   var children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/jsxs(Box, _objectSpread(_objectSpread({}, props), {}, {
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/jsxs(Box, _objectSpread(_objectSpread(_objectSpread({}, rest), {}, {
     display: "flex",
     width: "100%",
     gap: "spacing.0",
     position: "relative",
-    left: "-1px",
+    left: "-1px"
+  }, makeAnalyticsAttribute(rest)), {}, {
     children: [React__default.Children.map(children, function (child, index) {
       return /*#__PURE__*/jsxs(Fragment, {
         children: [index > 0 ? /*#__PURE__*/jsx(Divider, {

package/build/lib/web/development/components/TopNav/TabNav/TabNav.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabNav.web.js","sources":["../../../../../../../src/components/TopNav/TabNav/TabNav.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable consistent-return */\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { TabNavContext } from './TabNavContext';\nimport { useResize } from './utils';\nimport type { TabNavItemData, TabNavProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { Divider } from '~components/Divider';\nimport { makeSize } from '~utils';\nimport { size } from '~tokens/global';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\n\nconst TabNavItems = ({ children, ...props }: BoxProps): React.ReactElement => {\n  return (\n    <Box {...props} display=\"flex\" width=\"100%\" gap=\"spacing.0\" position=\"relative\" left=\"-1px\">\n      {React.Children.map(children, (child, index) => {\n        return (\n          <>\n            {index > 0 ? (\n              <Divider\n                margin=\"auto\"\n                variant=\"muted\"\n                orientation=\"vertical\"\n                height={makeSize(size[16])}\n              />\n            ) : null}\n            {React.cloneElement(child as React.ReactElement, {\n              __isInsideTabNavItems: true,\n              __index: index,\n            })}\n          </>\n        );\n      })}\n      <Divider margin=\"auto\" variant=\"muted\" orientation=\"vertical\" height={makeSize(size[16])} />\n    </Box>\n  );\n};\n\nconst TabNav = ({\n  children,\n  items,\n  ...styledProps\n}: TabNavProps & StyledPropsBlade): React.ReactElement => {\n  const ref = React.useRef<HTMLDivElement>(null);\n  const [controlledItems, setControlledItems] = React.useState<TabNavItemData[]>(items);\n\n  const overflowingItems = controlledItems.filter(\n    (item) => item.isAlwaysOverflowing ?? item.isOverflowing,\n  );\n  const _items = controlledItems.filter((item) => !item.isAlwaysOverflowing && !item.isOverflowing);\n\n  // We need to memoize this callback otherwise it will cause infinite re-renders\n  // Because the ResizeObserver callback will be a new reference on every render\n  // and it will trigger a re-render\n  const resizeCallback = React.useCallback((resizeInfo: ResizeObserverEntry): void => {\n    const target = resizeInfo.target as HTMLElement;\n    const updateItems = (): void => {\n      setControlledItems((items) => {\n        return items.map((item, index) => {\n          // never overflow the first item\n          if (index === 0) return { ...item, isOverflowing: false };\n          // add padding to the offsetX to account the \"More\" menu's width changing due to the selection state (eg: More:ProdctName)\n          // Currently, hardcoding this to 150, we can make this dynamic too but that's causing layout thrashing\n          // because first we need to calculate the width of the \"More\" menu and then update the items\n          const padding = 150;\n          const offset = (item.offsetX! + padding)! - target.getBoundingClientRect().left;\n          if (offset > target.offsetWidth) {\n            return { ...item, isOverflowing: true };\n          } else {\n            return { ...item, isOverflowing: false };\n          }\n        });\n      });\n    };\n    // https://github.com/webpack/webpack/issues/14814\n    const flushSync = (ReactDOM as any)['flushSync'.toString()];\n    // Using flushSync to avoid layout thrashing,\n    // this will force React to flush all pending updates and only then update the DOM\n    if (flushSync !== undefined) {\n      flushSync(updateItems);\n    } else {\n      updateItems();\n    }\n  }, []);\n\n  useResize(ref, resizeCallback);\n\n  return (\n    <TabNavContext.Provider value={{ containerRef: ref, controlledItems, setControlledItems }}>\n      <BaseBox\n        as=\"nav\"\n        display=\"flex\"\n        width=\"100%\"\n        alignItems=\"center\"\n        alignSelf=\"end\"\n        position=\"relative\"\n        {...getStyledProps(styledProps)}\n        {...metaAttribute({ name: MetaConstants.TabNav })}\n        ref={ref}\n      >\n        <BaseBox display=\"flex\" width=\"100%\" position=\"relative\">\n          <BaseBox display=\"flex\" flexDirection=\"row\" width=\"max-content\">\n            {children({ items: _items, overflowingItems })}\n          </BaseBox>\n        </BaseBox>\n      </BaseBox>\n    </TabNavContext.Provider>\n  );\n};\n\nexport { TabNav, TabNavItems };\n"],"names":["TabNavItems","_ref","children","props","_objectWithoutProperties","_excluded","_jsxs","Box","_objectSpread","display","width","gap","position","left","React","Children","map","child","index","_Fragment","_jsx","Divider","margin","variant","orientation","height","makeSize","size","cloneElement","__isInsideTabNavItems","__index","TabNav","_ref2","items","styledProps","_excluded2","ref","useRef","_React$useState","useState","_React$useState2","_slicedToArray","controlledItems","setControlledItems","overflowingItems","filter","item","_item$isAlwaysOverflo","isAlwaysOverflowing","isOverflowing","_items","resizeCallback","useCallback","resizeInfo","target","updateItems","padding","offset","offsetX","getBoundingClientRect","offsetWidth","flushSync","ReactDOM","toString","undefined","useResize","TabNavContext","Provider","value","containerRef","BaseBox","as","alignItems","alignSelf","getStyledProps","metaAttribute","name","MetaConstants","flexDirection"],"mappings":"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"}
+{"version":3,"file":"TabNav.web.js","sources":["../../../../../../../src/components/TopNav/TabNav/TabNav.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable consistent-return */\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport { TabNavContext } from './TabNavContext';\nimport { useResize } from './utils';\nimport type { TabNavItemData, TabNavProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { Divider } from '~components/Divider';\nimport { makeSize } from '~utils';\nimport { size } from '~tokens/global';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst TabNavItems = ({ children, ...rest }: BoxProps): React.ReactElement => {\n  return (\n    <Box\n      {...rest}\n      display=\"flex\"\n      width=\"100%\"\n      gap=\"spacing.0\"\n      position=\"relative\"\n      left=\"-1px\"\n      {...makeAnalyticsAttribute(rest)}\n    >\n      {React.Children.map(children, (child, index) => {\n        return (\n          <>\n            {index > 0 ? (\n              <Divider\n                margin=\"auto\"\n                variant=\"muted\"\n                orientation=\"vertical\"\n                height={makeSize(size[16])}\n              />\n            ) : null}\n            {React.cloneElement(child as React.ReactElement, {\n              __isInsideTabNavItems: true,\n              __index: index,\n            })}\n          </>\n        );\n      })}\n      <Divider margin=\"auto\" variant=\"muted\" orientation=\"vertical\" height={makeSize(size[16])} />\n    </Box>\n  );\n};\n\nconst TabNav = ({\n  children,\n  items,\n  ...styledProps\n}: TabNavProps & StyledPropsBlade): React.ReactElement => {\n  const ref = React.useRef<HTMLDivElement>(null);\n  const [controlledItems, setControlledItems] = React.useState<TabNavItemData[]>(items);\n\n  const overflowingItems = controlledItems.filter(\n    (item) => item.isAlwaysOverflowing ?? item.isOverflowing,\n  );\n  const _items = controlledItems.filter((item) => !item.isAlwaysOverflowing && !item.isOverflowing);\n\n  // We need to memoize this callback otherwise it will cause infinite re-renders\n  // Because the ResizeObserver callback will be a new reference on every render\n  // and it will trigger a re-render\n  const resizeCallback = React.useCallback((resizeInfo: ResizeObserverEntry): void => {\n    const target = resizeInfo.target as HTMLElement;\n    const updateItems = (): void => {\n      setControlledItems((items) => {\n        return items.map((item, index) => {\n          // never overflow the first item\n          if (index === 0) return { ...item, isOverflowing: false };\n          // add padding to the offsetX to account the \"More\" menu's width changing due to the selection state (eg: More:ProdctName)\n          // Currently, hardcoding this to 150, we can make this dynamic too but that's causing layout thrashing\n          // because first we need to calculate the width of the \"More\" menu and then update the items\n          const padding = 150;\n          const offset = (item.offsetX! + padding)! - target.getBoundingClientRect().left;\n          if (offset > target.offsetWidth) {\n            return { ...item, isOverflowing: true };\n          } else {\n            return { ...item, isOverflowing: false };\n          }\n        });\n      });\n    };\n    // https://github.com/webpack/webpack/issues/14814\n    const flushSync = (ReactDOM as any)['flushSync'.toString()];\n    // Using flushSync to avoid layout thrashing,\n    // this will force React to flush all pending updates and only then update the DOM\n    if (flushSync !== undefined) {\n      flushSync(updateItems);\n    } else {\n      updateItems();\n    }\n  }, []);\n\n  useResize(ref, resizeCallback);\n\n  return (\n    <TabNavContext.Provider value={{ containerRef: ref, controlledItems, setControlledItems }}>\n      <BaseBox\n        as=\"nav\"\n        display=\"flex\"\n        width=\"100%\"\n        alignItems=\"center\"\n        alignSelf=\"end\"\n        position=\"relative\"\n        {...getStyledProps(styledProps)}\n        {...metaAttribute({ name: MetaConstants.TabNav })}\n        ref={ref}\n      >\n        <BaseBox display=\"flex\" width=\"100%\" position=\"relative\">\n          <BaseBox display=\"flex\" flexDirection=\"row\" width=\"max-content\">\n            {children({ items: _items, overflowingItems })}\n          </BaseBox>\n        </BaseBox>\n      </BaseBox>\n    </TabNavContext.Provider>\n  );\n};\n\nexport { TabNav, TabNavItems };\n"],"names":["TabNavItems","_ref","children","rest","_objectWithoutProperties","_excluded","_jsxs","Box","_objectSpread","display","width","gap","position","left","makeAnalyticsAttribute","React","Children","map","child","index","_Fragment","_jsx","Divider","margin","variant","orientation","height","makeSize","size","cloneElement","__isInsideTabNavItems","__index","TabNav","_ref2","items","styledProps","_excluded2","ref","useRef","_React$useState","useState","_React$useState2","_slicedToArray","controlledItems","setControlledItems","overflowingItems","filter","item","_item$isAlwaysOverflo","isAlwaysOverflowing","isOverflowing","_items","resizeCallback","useCallback","resizeInfo","target","updateItems","padding","offset","offsetX","getBoundingClientRect","offsetWidth","flushSync","ReactDOM","toString","undefined","useResize","TabNavContext","Provider","value","containerRef","BaseBox","as","alignItems","alignSelf","getStyledProps","metaAttribute","name","MetaConstants","flexDirection"],"mappings":"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"}

package/build/lib/web/development/components/TopNav/TopNav.web.js

@@ -8,12 +8,14 @@ import '../../tokens/global/index.js';
 import '../../utils/index.js';
 import '../../utils/metaAttribute/index.js';
 import { componentZIndices } from '../../utils/componentZIndices.js';
+import '../../utils/makeAnalyticsAttribute/index.js';
 import { jsx } from 'react/jsx-runtime';
 import { size } from '../../tokens/global/size.js';
 import { Box } from '../Box/Box.js';
 import { makeSize } from '../../utils/makeSize/makeSize.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
+import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
 
 var _excluded = ["children"];
@@ -23,8 +25,8 @@ var TOP_NAV_HEIGHT = size[56];
 var CONTENT_RIGHT_GAP = size[80];
 var TopNav = function TopNav(_ref) {
   var children = _ref.children,
-    boxProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/jsx(Box, _objectSpread(_objectSpread(_objectSpread({
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/jsx(Box, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
     display: "grid",
     gridTemplateColumns: "auto minmax(0, 1fr) auto",
     alignItems: "center",
@@ -41,9 +43,10 @@ var TopNav = function TopNav(_ref) {
     },
     height: makeSize(TOP_NAV_HEIGHT),
     zIndex: componentZIndices.topnav
-  }, boxProps), metaAttribute({
-    name: MetaConstants.TopNav
-  })), {}, {
+  }, rest), metaAttribute({
+    name: MetaConstants.TopNav,
+    testID: rest.testID
+  })), makeAnalyticsAttribute(rest)), {}, {
     children: children
   }));
 };

package/build/lib/web/development/components/TopNav/TopNav.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopNav.web.js","sources":["../../../../../../src/components/TopNav/TopNav.web.tsx"],"sourcesContent":["import React from 'react';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport BaseBox from '~components/Box/BaseBox';\nimport {\n  SIDE_NAV_EXPANDED_L1_WIDTH_XL,\n  SIDE_NAV_EXPANDED_L1_WIDTH_BASE,\n} from '~components/SideNav/tokens';\nimport { size } from '~tokens/global';\nimport { makeSize } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { componentZIndices } from '~utils/componentZIndices';\n\nconst TOP_NAV_HEIGHT = size[56];\nconst CONTENT_RIGHT_GAP = size[80];\n\ntype TopNavProps = {\n  children: React.ReactNode;\n} & Pick<\n  BoxProps,\n  | 'padding'\n  | 'paddingTop'\n  | 'paddingBottom'\n  | 'paddingLeft'\n  | 'paddingRight'\n  | 'paddingX'\n  | 'paddingY'\n  | 'backgroundColor'\n  | 'position'\n  | 'top'\n  | 'bottom'\n  | 'left'\n  | 'right'\n  | 'width'\n  | 'zIndex'\n> &\n  StyledPropsBlade;\n\nconst TopNav = ({ children, ...boxProps }: TopNavProps): React.ReactElement => {\n  return (\n    <Box\n      display=\"grid\"\n      gridTemplateColumns=\"auto minmax(0, 1fr) auto\"\n      alignItems=\"center\"\n      position=\"sticky\"\n      top=\"0px\"\n      width=\"100%\"\n      paddingY={{ base: 'spacing.3', m: 'spacing.0' }}\n      paddingX={{ base: 'spacing.4', m: 'spacing.3' }}\n      height={makeSize(TOP_NAV_HEIGHT)}\n      zIndex={componentZIndices.topnav}\n      {...boxProps}\n      {...metaAttribute({ name: MetaConstants.TopNav })}\n    >\n      {children}\n    </Box>\n  );\n};\n\nconst TopNavBrand = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <Box\n      flexDirection=\"row\"\n      marginTop=\"spacing.4\"\n      width={{\n        base: makeSize(SIDE_NAV_EXPANDED_L1_WIDTH_BASE),\n        xl: makeSize(SIDE_NAV_EXPANDED_L1_WIDTH_XL),\n      }}\n      {...metaAttribute({ name: MetaConstants.TopNavBrand })}\n    >\n      <BaseBox width=\"100%\" textAlign=\"center\">\n        {children}\n      </BaseBox>\n    </Box>\n  );\n};\n\nconst TopNavContent = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <BaseBox\n      display=\"flex\"\n      alignItems=\"center\"\n      alignSelf=\"end\"\n      paddingRight={{ base: 'spacing.0', m: makeSize(CONTENT_RIGHT_GAP) }}\n      {...metaAttribute({ name: MetaConstants.TopNavContent })}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nconst TopNavActions = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <BaseBox\n      alignSelf=\"end\"\n      display=\"flex\"\n      gap=\"spacing.3\"\n      alignItems=\"center\"\n      marginTop=\"spacing.1\"\n      padding=\"spacing.3\"\n      backgroundColor=\"surface.background.gray.intense\"\n      borderTopLeftRadius=\"medium\"\n      borderTopRightRadius=\"medium\"\n      {...metaAttribute({ name: MetaConstants.TopNavActions })}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nexport { TopNav, TopNavBrand, TopNavContent, TopNavActions };\nexport type { TopNavProps };\n"],"names":["TOP_NAV_HEIGHT","size","CONTENT_RIGHT_GAP","TopNav","_ref","children","boxProps","_objectWithoutProperties","_excluded","_jsx","Box","_objectSpread","display","gridTemplateColumns","alignItems","position","top","width","paddingY","base","m","paddingX","height","makeSize","zIndex","componentZIndices","topnav","metaAttribute","name","MetaConstants","TopNavBrand","_ref2","flexDirection","marginTop","SIDE_NAV_EXPANDED_L1_WIDTH_BASE","xl","SIDE_NAV_EXPANDED_L1_WIDTH_XL","BaseBox","textAlign","TopNavContent","_ref3","alignSelf","paddingRight","TopNavActions","_ref4","gap","padding","backgroundColor","borderTopLeftRadius","borderTopRightRadius"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAcA,IAAMA,cAAc,GAAGC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC/B,IAAMC,iBAAiB,GAAGD,IAAI,CAAC,EAAE,CAAC,CAAA;AAwBlC,IAAME,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAAmE;AAAA,EAAA,IAA7DC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;AAAKC,IAAAA,QAAQ,GAAAC,wBAAA,CAAAH,IAAA,EAAAI,SAAA,CAAA,CAAA;EACrC,oBACEC,GAAA,CAACC,GAAG,EAAAC,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAA;AACFC,IAAAA,OAAO,EAAC,MAAM;AACdC,IAAAA,mBAAmB,EAAC,0BAA0B;AAC9CC,IAAAA,UAAU,EAAC,QAAQ;AACnBC,IAAAA,QAAQ,EAAC,QAAQ;AACjBC,IAAAA,GAAG,EAAC,KAAK;AACTC,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,QAAQ,EAAE;AAAEC,MAAAA,IAAI,EAAE,WAAW;AAAEC,MAAAA,CAAC,EAAE,WAAA;KAAc;AAChDC,IAAAA,QAAQ,EAAE;AAAEF,MAAAA,IAAI,EAAE,WAAW;AAAEC,MAAAA,CAAC,EAAE,WAAA;KAAc;AAChDE,IAAAA,MAAM,EAAEC,QAAQ,CAACvB,cAAc,CAAE;IACjCwB,MAAM,EAAEC,iBAAiB,CAACC,MAAAA;GACtBpB,EAAAA,QAAQ,CACRqB,EAAAA,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAAC1B,MAAAA;AAAO,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AAAAE,IAAAA,QAAA,EAEhDA,QAAAA;AAAQ,GAAA,CACN,CAAC,CAAA;AAEV,EAAC;AAED,IAAMyB,WAAW,GAAG,SAAdA,WAAWA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlE1B,QAAQ,GAAA0B,KAAA,CAAR1B,QAAQ,CAAA;AAC7B,EAAA,oBACEI,GAAA,CAACC,GAAG,EAAAC,aAAA,CAAAA,aAAA,CAAA;AACFqB,IAAAA,aAAa,EAAC,KAAK;AACnBC,IAAAA,SAAS,EAAC,WAAW;AACrBhB,IAAAA,KAAK,EAAE;AACLE,MAAAA,IAAI,EAAEI,QAAQ,CAACW,+BAA+B,CAAC;MAC/CC,EAAE,EAAEZ,QAAQ,CAACa,6BAA6B,CAAA;AAC5C,KAAA;AAAE,GAAA,EACET,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACC,WAAAA;AAAY,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;IAAAzB,QAAA,eAEtDI,GAAA,CAAC4B,OAAO,EAAA;AAACpB,MAAAA,KAAK,EAAC,MAAM;AAACqB,MAAAA,SAAS,EAAC,QAAQ;AAAAjC,MAAAA,QAAA,EACrCA,QAAAA;KACM,CAAA;AAAC,GAAA,CACP,CAAC,CAAA;AAEV,EAAC;AAED,IAAMkC,aAAa,GAAG,SAAhBA,aAAaA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlEnC,QAAQ,GAAAmC,KAAA,CAARnC,QAAQ,CAAA;AAC/B,EAAA,oBACEI,GAAA,CAAC4B,OAAO,EAAA1B,aAAA,CAAAA,aAAA,CAAA;AACNC,IAAAA,OAAO,EAAC,MAAM;AACdE,IAAAA,UAAU,EAAC,QAAQ;AACnB2B,IAAAA,SAAS,EAAC,KAAK;AACfC,IAAAA,YAAY,EAAE;AAAEvB,MAAAA,IAAI,EAAE,WAAW;MAAEC,CAAC,EAAEG,QAAQ,CAACrB,iBAAiB,CAAA;AAAE,KAAA;AAAE,GAAA,EAChEyB,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACU,aAAAA;AAAc,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AAAAlC,IAAAA,QAAA,EAEvDA,QAAAA;AAAQ,GAAA,CACF,CAAC,CAAA;AAEd,EAAC;AAED,IAAMsC,aAAa,GAAG,SAAhBA,aAAaA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlEvC,QAAQ,GAAAuC,KAAA,CAARvC,QAAQ,CAAA;AAC/B,EAAA,oBACEI,GAAA,CAAC4B,OAAO,EAAA1B,aAAA,CAAAA,aAAA,CAAA;AACN8B,IAAAA,SAAS,EAAC,KAAK;AACf7B,IAAAA,OAAO,EAAC,MAAM;AACdiC,IAAAA,GAAG,EAAC,WAAW;AACf/B,IAAAA,UAAU,EAAC,QAAQ;AACnBmB,IAAAA,SAAS,EAAC,WAAW;AACrBa,IAAAA,OAAO,EAAC,WAAW;AACnBC,IAAAA,eAAe,EAAC,iCAAiC;AACjDC,IAAAA,mBAAmB,EAAC,QAAQ;AAC5BC,IAAAA,oBAAoB,EAAC,QAAA;AAAQ,GAAA,EACzBtB,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACc,aAAAA;AAAc,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AAAAtC,IAAAA,QAAA,EAEvDA,QAAAA;AAAQ,GAAA,CACF,CAAC,CAAA;AAEd;;;;"}
+{"version":3,"file":"TopNav.web.js","sources":["../../../../../../src/components/TopNav/TopNav.web.tsx"],"sourcesContent":["import React from 'react';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport BaseBox from '~components/Box/BaseBox';\nimport {\n  SIDE_NAV_EXPANDED_L1_WIDTH_XL,\n  SIDE_NAV_EXPANDED_L1_WIDTH_BASE,\n} from '~components/SideNav/tokens';\nimport { size } from '~tokens/global';\nimport { makeSize } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst TOP_NAV_HEIGHT = size[56];\nconst CONTENT_RIGHT_GAP = size[80];\n\ntype TopNavProps = {\n  children: React.ReactNode;\n} & Pick<\n  BoxProps,\n  | 'padding'\n  | 'paddingTop'\n  | 'paddingBottom'\n  | 'paddingLeft'\n  | 'paddingRight'\n  | 'paddingX'\n  | 'paddingY'\n  | 'backgroundColor'\n  | 'position'\n  | 'top'\n  | 'bottom'\n  | 'left'\n  | 'right'\n  | 'width'\n  | 'zIndex'\n  | keyof DataAnalyticsAttribute\n> &\n  TestID &\n  StyledPropsBlade;\n\nconst TopNav = ({ children, ...rest }: TopNavProps): React.ReactElement => {\n  return (\n    <Box\n      display=\"grid\"\n      gridTemplateColumns=\"auto minmax(0, 1fr) auto\"\n      alignItems=\"center\"\n      position=\"sticky\"\n      top=\"0px\"\n      width=\"100%\"\n      paddingY={{ base: 'spacing.3', m: 'spacing.0' }}\n      paddingX={{ base: 'spacing.4', m: 'spacing.3' }}\n      height={makeSize(TOP_NAV_HEIGHT)}\n      zIndex={componentZIndices.topnav}\n      {...rest}\n      {...metaAttribute({ name: MetaConstants.TopNav, testID: rest.testID })}\n      {...makeAnalyticsAttribute(rest)}\n    >\n      {children}\n    </Box>\n  );\n};\n\nconst TopNavBrand = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <Box\n      flexDirection=\"row\"\n      marginTop=\"spacing.4\"\n      width={{\n        base: makeSize(SIDE_NAV_EXPANDED_L1_WIDTH_BASE),\n        xl: makeSize(SIDE_NAV_EXPANDED_L1_WIDTH_XL),\n      }}\n      {...metaAttribute({ name: MetaConstants.TopNavBrand })}\n    >\n      <BaseBox width=\"100%\" textAlign=\"center\">\n        {children}\n      </BaseBox>\n    </Box>\n  );\n};\n\nconst TopNavContent = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <BaseBox\n      display=\"flex\"\n      alignItems=\"center\"\n      alignSelf=\"end\"\n      paddingRight={{ base: 'spacing.0', m: makeSize(CONTENT_RIGHT_GAP) }}\n      {...metaAttribute({ name: MetaConstants.TopNavContent })}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nconst TopNavActions = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n  return (\n    <BaseBox\n      alignSelf=\"end\"\n      display=\"flex\"\n      gap=\"spacing.3\"\n      alignItems=\"center\"\n      marginTop=\"spacing.1\"\n      padding=\"spacing.3\"\n      backgroundColor=\"surface.background.gray.intense\"\n      borderTopLeftRadius=\"medium\"\n      borderTopRightRadius=\"medium\"\n      {...metaAttribute({ name: MetaConstants.TopNavActions })}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nexport { TopNav, TopNavBrand, TopNavContent, TopNavActions };\nexport type { TopNavProps };\n"],"names":["TOP_NAV_HEIGHT","size","CONTENT_RIGHT_GAP","TopNav","_ref","children","rest","_objectWithoutProperties","_excluded","_jsx","Box","_objectSpread","display","gridTemplateColumns","alignItems","position","top","width","paddingY","base","m","paddingX","height","makeSize","zIndex","componentZIndices","topnav","metaAttribute","name","MetaConstants","testID","makeAnalyticsAttribute","TopNavBrand","_ref2","flexDirection","marginTop","SIDE_NAV_EXPANDED_L1_WIDTH_BASE","xl","SIDE_NAV_EXPANDED_L1_WIDTH_XL","BaseBox","textAlign","TopNavContent","_ref3","alignSelf","paddingRight","TopNavActions","_ref4","gap","padding","backgroundColor","borderTopLeftRadius","borderTopRightRadius"],"mappings":"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"}

package/build/lib/web/development/tokens/global/size.js

@@ -38,8 +38,10 @@ var size = {
   24: 24,
   /** 28 px */
   28: 28,
-  /** 32 px */
+  /** 30 px */
   30: 30,
+  /** 31 px */
+  31: 31,
   /** 32 px */
   32: 32,
   /** 33 px */

package/build/lib/web/development/tokens/global/size.js.map

@@ -1 +1 @@
-{"version":3,"file":"size.js","sources":["../../../../../../src/tokens/global/size.ts"],"sourcesContent":["/**\n * Size tokens are currently not exposed for users (therefore not available in theme)\n */\nexport const size = {\n  /** 0 px */\n  0: 0,\n  /** 1 px */\n  1: 1,\n  /** 2 px */\n  2: 2,\n  /** 3 px */\n  3: 3,\n  /** 4 px */\n  4: 4,\n  /** 5 px */\n  5: 5,\n  /** 6 px */\n  6: 6,\n  /** 7 px */\n  7: 7,\n  /** 8 px */\n  8: 8,\n  /** 10 px */\n  10: 10,\n  /** 12 px */\n  12: 12,\n  /** 14 px */\n  14: 14,\n  /** 15 px */\n  15: 15,\n  /** 16 px */\n  16: 16,\n  /** 18 px */\n  18: 18,\n  /** 20 px */\n  20: 20,\n  /** 24 px */\n  24: 24,\n  /** 28 px */\n  28: 28,\n  /** 32 px */\n  30: 30,\n  /** 32 px */\n  32: 32,\n  /** 33 px */\n  33: 33,\n  /** 36 px */\n  36: 36,\n  /** 40 px */\n  40: 40,\n  /** 44 px */\n  44: 44,\n  /** 48 px */\n  48: 48,\n  /** 52 px */\n  52: 52,\n  /** 56 px */\n  56: 56,\n  /** 60 px */\n  60: 60,\n  /** 64 px */\n  64: 64,\n  /** 72 px */\n  72: 72,\n  /** 80 px */\n  80: 80,\n  /** 100 px */\n  100: 100,\n  /** 120 px */\n  120: 120,\n  /** 140 px */\n  140: 140,\n  /** 160 px */\n  160: 160,\n  /** 176 px */\n  176: 176,\n  /** 200 px */\n  200: 200,\n  /** 208 px */\n  208: 208,\n  /** 240 px */\n  240: 240,\n  /** 245 px */\n  245: 245,\n  /** 256 px */\n  256: 256,\n  /** 264 px */\n  264: 264,\n  /** 300 px */\n  300: 300,\n  /** 314 px */\n  314: 314,\n  /** 360 px */\n  360: 360,\n  /** 400 px */\n  400: 400,\n  /** 584 px */\n  584: 584,\n  /** 640 px */\n  640: 640,\n  /** 760 px */\n  760: 760,\n  /** 800 px */\n  800: 800,\n  /** 1024 px */\n  1024: 1024,\n  /** 1136 px */\n  1136: 1136,\n} as const;\n\nexport type Size = typeof size;\n"],"names":["size"],"mappings":"AAAA;AACA;AACA;AACO,IAAMA,IAAI,GAAG;AAClB;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,IAAI,EAAE,IAAI;AACV;AACA,EAAA,IAAI,EAAE,IAAA;AACR;;;;"}
+{"version":3,"file":"size.js","sources":["../../../../../../src/tokens/global/size.ts"],"sourcesContent":["/**\n * Size tokens are currently not exposed for users (therefore not available in theme)\n */\nexport const size = {\n  /** 0 px */\n  0: 0,\n  /** 1 px */\n  1: 1,\n  /** 2 px */\n  2: 2,\n  /** 3 px */\n  3: 3,\n  /** 4 px */\n  4: 4,\n  /** 5 px */\n  5: 5,\n  /** 6 px */\n  6: 6,\n  /** 7 px */\n  7: 7,\n  /** 8 px */\n  8: 8,\n  /** 10 px */\n  10: 10,\n  /** 12 px */\n  12: 12,\n  /** 14 px */\n  14: 14,\n  /** 15 px */\n  15: 15,\n  /** 16 px */\n  16: 16,\n  /** 18 px */\n  18: 18,\n  /** 20 px */\n  20: 20,\n  /** 24 px */\n  24: 24,\n  /** 28 px */\n  28: 28,\n  /** 30 px */\n  30: 30,\n  /** 31 px */\n  31: 31,\n  /** 32 px */\n  32: 32,\n  /** 33 px */\n  33: 33,\n  /** 36 px */\n  36: 36,\n  /** 40 px */\n  40: 40,\n  /** 44 px */\n  44: 44,\n  /** 48 px */\n  48: 48,\n  /** 52 px */\n  52: 52,\n  /** 56 px */\n  56: 56,\n  /** 60 px */\n  60: 60,\n  /** 64 px */\n  64: 64,\n  /** 72 px */\n  72: 72,\n  /** 80 px */\n  80: 80,\n  /** 100 px */\n  100: 100,\n  /** 120 px */\n  120: 120,\n  /** 140 px */\n  140: 140,\n  /** 160 px */\n  160: 160,\n  /** 176 px */\n  176: 176,\n  /** 200 px */\n  200: 200,\n  /** 208 px */\n  208: 208,\n  /** 240 px */\n  240: 240,\n  /** 245 px */\n  245: 245,\n  /** 256 px */\n  256: 256,\n  /** 264 px */\n  264: 264,\n  /** 300 px */\n  300: 300,\n  /** 314 px */\n  314: 314,\n  /** 360 px */\n  360: 360,\n  /** 400 px */\n  400: 400,\n  /** 584 px */\n  584: 584,\n  /** 640 px */\n  640: 640,\n  /** 760 px */\n  760: 760,\n  /** 800 px */\n  800: 800,\n  /** 1024 px */\n  1024: 1024,\n  /** 1136 px */\n  1136: 1136,\n} as const;\n\nexport type Size = typeof size;\n"],"names":["size"],"mappings":"AAAA;AACA;AACA;AACO,IAAMA,IAAI,GAAG;AAClB;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,CAAC,EAAE,CAAC;AACJ;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,EAAE,EAAE,EAAE;AACN;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,GAAG,EAAE,GAAG;AACR;AACA,EAAA,IAAI,EAAE,IAAI;AACV;AACA,EAAA,IAAI,EAAE,IAAA;AACR;;;;"}

package/build/lib/web/development/utils/makeAnalyticsAttribute/index.js

@@ -0,0 +1,2 @@
+export { makeAnalyticsAttribute } from './makeAnalyticsAttribute.js';
+//# sourceMappingURL=index.js.map

package/build/lib/web/development/utils/makeAnalyticsAttribute/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/lib/web/development/utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js

@@ -0,0 +1,20 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var makeAnalyticsAttribute = function makeAnalyticsAttribute(props) {
+  return Object.entries(props).filter(function (_ref) {
+    var _ref2 = _slicedToArray(_ref, 1),
+      key = _ref2[0];
+    return key.startsWith('data-analytics');
+  }).reduce(function (acc, _ref3) {
+    var _ref4 = _slicedToArray(_ref3, 2),
+      key = _ref4[0],
+      value = _ref4[1];
+    return _objectSpread(_objectSpread({}, acc), {}, _defineProperty({}, key, value));
+  }, {});
+};
+
+export { makeAnalyticsAttribute };
+//# sourceMappingURL=makeAnalyticsAttribute.js.map

package/build/lib/web/development/utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"makeAnalyticsAttribute.js","sources":["../../../../../../src/utils/makeAnalyticsAttribute/makeAnalyticsAttribute.tsx"],"sourcesContent":["import type { DataAnalyticsAttribute } from '~utils/types';\n\nconst makeAnalyticsAttribute = (props: Record<string, unknown>): DataAnalyticsAttribute => {\n  return Object.entries(props)\n    .filter(([key]) => key.startsWith('data-analytics'))\n    .reduce<DataAnalyticsAttribute>(\n      (acc, [key, value]) => ({\n        ...acc,\n        [key]: value as string,\n      }),\n      {},\n    );\n};\n\nexport { makeAnalyticsAttribute };\n"],"names":["makeAnalyticsAttribute","props","Object","entries","filter","_ref","_ref2","_slicedToArray","key","startsWith","reduce","acc","_ref3","_ref4","value","_objectSpread","_defineProperty"],"mappings":";;;;;AAEA,IAAMA,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAIC,KAA8B,EAA6B;EACzF,OAAOC,MAAM,CAACC,OAAO,CAACF,KAAK,CAAC,CACzBG,MAAM,CAAC,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAAC,KAAA,GAAAC,cAAA,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAEG,MAAAA,GAAG,GAAAF,KAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IAAA,OAAME,GAAG,CAACC,UAAU,CAAC,gBAAgB,CAAC,CAAA;AAAA,GAAA,CAAC,CACnDC,MAAM,CACL,UAACC,GAAG,EAAAC,KAAA,EAAA;AAAA,IAAA,IAAAC,KAAA,GAAAN,cAAA,CAAAK,KAAA,EAAA,CAAA,CAAA;AAAGJ,MAAAA,GAAG,GAAAK,KAAA,CAAA,CAAA,CAAA;AAAEC,MAAAA,KAAK,GAAAD,KAAA,CAAA,CAAA,CAAA,CAAA;IAAA,OAAAE,aAAA,CAAAA,aAAA,CACZJ,EAAAA,EAAAA,GAAG,OAAAK,eAAA,CAAA,EAAA,EACLR,GAAG,EAAGM,KAAK,CAAA,CAAA,CAAA;GACZ,EACF,EACF,CAAC,CAAA;AACL;;;;"}

package/build/lib/web/production/components/Accordion/Accordion.js

@@ -9,6 +9,7 @@ import '../Box/styledProps/index.js';
 import '../../tokens/global/index.js';
 import '../../utils/index.js';
 import '../../utils/metaAttribute/index.js';
+import '../../utils/makeAnalyticsAttribute/index.js';
 import { jsx } from 'react/jsx-runtime';
 import { makeSize } from '../../utils/makeSize/makeSize.js';
 import { size } from '../../tokens/global/size.js';
@@ -16,6 +17,7 @@ import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
+import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 
 var _excluded = ["defaultExpandedIndex", "expandedIndex", "onExpandChange", "showNumberPrefix", "children", "variant", "size", "maxWidth", "testID"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -81,7 +83,7 @@ var Accordion = function Accordion(_ref) {
     size = _ref$size === void 0 ? 'large' : _ref$size,
     maxWidth = _ref.maxWidth,
     testID = _ref.testID,
-    styledProps = _objectWithoutProperties(_ref, _excluded);
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(defaultExpandedIndex),
     _useState2 = _slicedToArray(_useState, 2),
     expandedAccordionItemIndex = _useState2[0],
@@ -114,10 +116,10 @@ var Accordion = function Accordion(_ref) {
   }, [expandedAccordionItemIndex, handleExpandChange, expandedIndex, showNumberPrefix, defaultExpandedIndex, variant, numberOfItems, size]);
   return /*#__PURE__*/jsx(AccordionContext.Provider, {
     value: accordionContext,
-    children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
+    children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
       name: MetaConstants.Accordion,
       testID: testID
-    })), getStyledProps(styledProps)), {}, {
+    })), getStyledProps(rest)), makeAnalyticsAttribute(rest)), {}, {
       children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({}, getVariantStyles(variant)), {}, {
         minWidth: MIN_WIDTH,
         maxWidth: maxWidth !== null && maxWidth !== void 0 ? maxWidth : MAX_WIDTH,