@muraldevkit/ui-toolkit 4.72.0 → 4.73.0-dev-t0WE.1

package/dist/cjs/components/toolbar/MrlToolbarButton/MrlToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlToolbarButton.js","sources":["../../../../../src/components/toolbar/MrlToolbarButton/MrlToolbarButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlIconButton, MrlIconButtonProps, MrlMenuItem, MrlMenuItemProps } from '../../../';\n\nimport styles from './MrlToolbarButton.module.scss';\nimport classnames from 'classnames';\n\n/**\n * Props for the MrlToolbarButton component.\n */\nexport interface MrlToolbarButtonProps {\n\t/** Additional class to add to the Toolbar button */\n\tclassName?: string;\n\t/**\n\t * The icon that will be rendered.\n\t */\n\ticon: React.ReactElement;\n\tincludeInRoving?: boolean;\n\t/**\n\t * A prop used to set a toolbar button to never move into the menu.\n\t */\n\tlockedInToolbar?: boolean;\n\t/**\n\t * onClick event for the button.\n\t */\n\tonClick?: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n\t/**\n\t * Props used to control the display of the button in the menu.\n\t */\n\tmenuItemProps?: Omit<MrlMenuItemProps, 'onClick'>;\n\tqa?: string;\n\t/**\n\t * A prop used to render the item in the menu instead of the toolbar.\n\t */\n\trenderInMenu?: boolean;\n\ttext: string;\n\t/**\n\t * Props used to control the display of the button in the toolbar.\n\t */\n\ttoolbarButtonProps?: {\n\t\tbadge?: MrlIconButtonProps['badge'];\n\t\tdisableEvents?: MrlIconButtonProps['disableEvents'];\n\t\tkind?: MrlIconButtonProps['kind'];\n\t\tloading?: MrlIconButtonProps['loading'];\n\t\tloadingText?: MrlIconButtonProps['loadingText'];\n\t\tonKeyUp?: MrlIconButtonProps['onKeyUp'];\n\t\tonMouseUp?: MrlIconButtonProps['onMouseUp'];\n\t\tposition?: MrlIconButtonProps['position'];\n\t\tsize?: MrlIconButtonProps['size'];\n\t\tstate?: MrlIconButtonProps['state'];\n\t\ttipAnchor?: MrlIconButtonProps['tipAnchor'];\n\t\ttoggleAria?: MrlIconButtonProps['toggleAria'];\n\t\ttoggleStyle?: MrlIconButtonProps['toggleStyle'];\n\t};\n}\n\n/**\n * MrlToolbarButton component.\n * @param props The MrlToolbarButton component properties.\n * @returns The MrlToolbarButton component.\n */\nexport const MrlToolbarButton = React.forwardRef<HTMLButtonElement, MrlToolbarButtonProps>(\n\tfunction MrlToolbarButton(props, ref): JSX.Element {\n\t\tconst {\n\t\t\tclassName,\n\t\t\ticon,\n\t\t\tincludeInRoving = false,\n\t\t\tmenuItemProps,\n\t\t\tonClick,\n\t\t\tqa,\n\t\t\trenderInMenu,\n\t\t\ttext,\n\t\t\ttoolbarButtonProps = {\n\t\t\t\tposition: 'bottom',\n\t\t\t\tsize: 'small',\n\t\t\t\tstate: 'default'\n\t\t\t},\n\t\t\t...rest\n\t\t} = props;\n\t\tconst classes = classnames('MrlToolbarButton', className);\n\n\t\tif (renderInMenu) {\n\t\t\treturn (\n\t\t\t\t<MrlMenuItem {...menuItemProps} className={classes} data-qa={qa} onClick={onClick}>\n\t\t\t\t\t<span className={styles.MrlToolbarButtonIcon}>{icon}</span>\n\t\t\t\t\t{text}\n\t\t\t\t</MrlMenuItem>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<MrlIconButton\n\t\t\t\t{...rest}\n\t\t\t\t{...toolbarButtonProps}\n\t\t\t\tclassName={classes}\n\t\t\t\tdata-qa={qa}\n\t\t\t\tdata-roving={includeInRoving ? 'true' : undefined}\n\t\t\t\ticon={icon}\n\t\t\t\tonClick={onClick}\n\t\t\t\tref={ref}\n\t\t\t\ttext={text}\n\t\t\t/>\n\t\t);\n\t}\n);\n"],"names":["MrlToolbarButton","React","forwardRef","props","ref","className","icon","_props$includeInRovin","includeInRoving","menuItemProps","onClick","qa","renderInMenu","text","_props$toolbarButtonP","toolbarButtonProps","position","size","state","rest","_objectWithoutProperties","_excluded","classes","classnames","createElement","MrlMenuItem","_extends","styles","MrlToolbarButtonIcon","MrlIconButton","undefined"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;AACA;AACA;;AA+CA;AACA;AACA;AACA;AACA;AACO,IAAMA,gBAAgB,gBAAGC,gBAAK,CAACC,UAAU,CAC/C,SAASF,gBAAgBA,CAACG,KAAK,EAAEC,GAAG,EAAe;AAClD,EAAA,IACCC,SAAS,GAcNF,KAAK,CAdRE,SAAS;IACTC,IAAI,GAaDH,KAAK,CAbRG,IAAI;IAAAC,qBAAA,GAaDJ,KAAK,CAZRK,eAAe;AAAfA,IAAAA,eAAe,GAAAD,qBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,qBAAA;IACvBE,aAAa,GAWVN,KAAK,CAXRM,aAAa;IACbC,OAAO,GAUJP,KAAK,CAVRO,OAAO;IACPC,EAAE,GASCR,KAAK,CATRQ,EAAE;IACFC,YAAY,GAQTT,KAAK,CARRS,YAAY;IACZC,IAAI,GAODV,KAAK,CAPRU,IAAI;IAAAC,qBAAA,GAODX,KAAK,CANRY,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAA,MAAA,GAAG;AACpBE,MAAAA,QAAQ,EAAE,QAAQ;AAClBC,MAAAA,IAAI,EAAE,OAAO;AACbC,MAAAA,KAAK,EAAE;AACR,KAAC,GAAAJ,qBAAA;AACEK,IAAAA,IAAI,GAAAC,iDAAA,CACJjB,KAAK,EAAAkB,SAAA,CAAA;AACT,EAAA,IAAMC,OAAO,GAAGC,2BAAU,CAAC,kBAAkB,EAAElB,SAAS,CAAC;AAEzD,EAAA,IAAIO,YAAY,EAAE;IACjB,oBACCX,gBAAA,CAAAuB,aAAA,CAACC,uBAAW,EAAAC,iCAAA,KAAKjB,aAAa,EAAA;AAAEJ,MAAAA,SAAS,EAAEiB,OAAQ;AAAC,MAAA,SAAA,EAASX,EAAG;AAACD,MAAAA,OAAO,EAAEA;KAAQ,CAAA,eACjFT,gBAAA,CAAAuB,aAAA,CAAA,MAAA,EAAA;MAAMnB,SAAS,EAAEsB,+BAAM,CAACC;AAAqB,KAAA,EAAEtB,IAAW,CAAC,EAC1DO,IACW,CAAC;AAEhB,EAAA;EAEA,oBACCZ,gBAAA,CAAAuB,aAAA,CAACK,2BAAa,EAAAH,iCAAA,CAAA,EAAA,EACTP,IAAI,EACJJ,kBAAkB,EAAA;AACtBV,IAAAA,SAAS,EAAEiB,OAAQ;AACnB,IAAA,SAAA,EAASX,EAAG;AACZ,IAAA,aAAA,EAAaH,eAAe,GAAG,MAAM,GAAGsB,SAAU;AAClDxB,IAAAA,IAAI,EAAEA,IAAK;AACXI,IAAAA,OAAO,EAAEA,OAAQ;AACjBN,IAAAA,GAAG,EAAEA,GAAI;AACTS,IAAAA,IAAI,EAAEA;AAAK,GAAA,CACX,CAAC;AAEJ,CACD;;;;"}
+{"version":3,"file":"MrlToolbarButton.js","sources":["../../../../../src/components/toolbar/MrlToolbarButton/MrlToolbarButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlIconButton, MrlIconButtonProps, MrlMenuItem, MrlMenuItemProps } from '../../../';\n\nimport styles from './MrlToolbarButton.module.scss';\nimport classnames from 'classnames';\nimport { useMrlTrackInteraction } from '../../../hooks/useMrlAnalytics';\n\n/**\n * Props for the MrlToolbarButton component.\n */\nexport interface MrlToolbarButtonProps {\n\t/** Additional class to add to the Toolbar button */\n\tclassName?: string;\n\t/**\n\t * The icon that will be rendered.\n\t */\n\ticon: React.ReactElement;\n\tincludeInRoving?: boolean;\n\t/**\n\t * A prop used to set a toolbar button to never move into the menu.\n\t */\n\tlockedInToolbar?: boolean;\n\t/**\n\t * onClick event for the button.\n\t */\n\tonClick?: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n\t/**\n\t * Props used to control the display of the button in the menu.\n\t */\n\tmenuItemProps?: Omit<MrlMenuItemProps, 'onClick'>;\n\tqa?: string;\n\t/**\n\t * A prop used to render the item in the menu instead of the toolbar.\n\t */\n\trenderInMenu?: boolean;\n\ttext: string;\n\t/**\n\t * Enables interaction tracking for this button. Provide a stable, non-PII id\n\t * (e.g. 'canvas-toolbar-shapes'). When omitted, the button emits no analytics.\n\t */\n\teventId?: string;\n\t/**\n\t * Props used to control the display of the button in the toolbar.\n\t */\n\ttoolbarButtonProps?: {\n\t\tbadge?: MrlIconButtonProps['badge'];\n\t\tdisableEvents?: MrlIconButtonProps['disableEvents'];\n\t\tkind?: MrlIconButtonProps['kind'];\n\t\tloading?: MrlIconButtonProps['loading'];\n\t\tloadingText?: MrlIconButtonProps['loadingText'];\n\t\tonKeyUp?: MrlIconButtonProps['onKeyUp'];\n\t\tonMouseUp?: MrlIconButtonProps['onMouseUp'];\n\t\tposition?: MrlIconButtonProps['position'];\n\t\tsize?: MrlIconButtonProps['size'];\n\t\tstate?: MrlIconButtonProps['state'];\n\t\ttipAnchor?: MrlIconButtonProps['tipAnchor'];\n\t\ttoggleAria?: MrlIconButtonProps['toggleAria'];\n\t\ttoggleStyle?: MrlIconButtonProps['toggleStyle'];\n\t};\n}\n\n/**\n * MrlToolbarButton component.\n * @param props The MrlToolbarButton component properties.\n * @returns The MrlToolbarButton component.\n */\nexport const MrlToolbarButton = React.forwardRef<HTMLButtonElement, MrlToolbarButtonProps>(\n\tfunction MrlToolbarButton(props, ref): JSX.Element {\n\t\tconst {\n\t\t\tclassName,\n\t\t\ticon,\n\t\t\tincludeInRoving = false,\n\t\t\tmenuItemProps,\n\t\t\tonClick,\n\t\t\tqa,\n\t\t\trenderInMenu,\n\t\t\ttext,\n\t\t\ttoolbarButtonProps = {\n\t\t\t\tposition: 'bottom',\n\t\t\t\tsize: 'small',\n\t\t\t\tstate: 'default'\n\t\t\t},\n\t\t\t// pulled out of `rest` so the nested MrlIconButton/MrlMenuItem doesn't emit a\n\t\t\t// second, less specific event for the same interaction.\n\t\t\teventId,\n\t\t\t...rest\n\t\t} = props;\n\t\tconst classes = classnames('MrlToolbarButton', className);\n\n\t\tconst trackInteraction = useMrlTrackInteraction('MrlToolbarButton', eventId);\n\n\t\t/**\n\t\t * Handle onClick events\n\t\t *\n\t\t * @param {React.MouseEvent<HTMLButtonElement>} e - mouse event\n\t\t */\n\t\tconst handleOnClick = (e?: React.MouseEvent<HTMLButtonElement>) => {\n\t\t\ttrackInteraction({\n\t\t\t\taction: 'click',\n\t\t\t\tvariant: renderInMenu ? 'menu' : 'toolbar'\n\t\t\t});\n\n\t\t\tonClick?.(e);\n\t\t};\n\n\t\tif (renderInMenu) {\n\t\t\treturn (\n\t\t\t\t<MrlMenuItem {...menuItemProps} className={classes} data-qa={qa} onClick={handleOnClick}>\n\t\t\t\t\t<span className={styles.MrlToolbarButtonIcon}>{icon}</span>\n\t\t\t\t\t{text}\n\t\t\t\t</MrlMenuItem>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<MrlIconButton\n\t\t\t\t{...rest}\n\t\t\t\t{...toolbarButtonProps}\n\t\t\t\tclassName={classes}\n\t\t\t\tdata-qa={qa}\n\t\t\t\tdata-roving={includeInRoving ? 'true' : undefined}\n\t\t\t\ticon={icon}\n\t\t\t\tonClick={handleOnClick}\n\t\t\t\tref={ref}\n\t\t\t\ttext={text}\n\t\t\t/>\n\t\t);\n\t}\n);\n"],"names":["MrlToolbarButton","React","forwardRef","props","ref","className","icon","_props$includeInRovin","includeInRoving","menuItemProps","onClick","qa","renderInMenu","text","_props$toolbarButtonP","toolbarButtonProps","position","size","state","eventId","rest","_objectWithoutProperties","_excluded","classes","classnames","trackInteraction","useMrlTrackInteraction","handleOnClick","e","action","variant","createElement","MrlMenuItem","_extends","styles","MrlToolbarButtonIcon","MrlIconButton","undefined"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;AACA;AACA;;AAoDA;AACA;AACA;AACA;AACA;AACO,IAAMA,gBAAgB,gBAAGC,gBAAK,CAACC,UAAU,CAC/C,SAASF,gBAAgBA,CAACG,KAAK,EAAEC,GAAG,EAAe;AAClD,EAAA,IACCC,SAAS,GAiBNF,KAAK,CAjBRE,SAAS;IACTC,IAAI,GAgBDH,KAAK,CAhBRG,IAAI;IAAAC,qBAAA,GAgBDJ,KAAK,CAfRK,eAAe;AAAfA,IAAAA,eAAe,GAAAD,qBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,qBAAA;IACvBE,aAAa,GAcVN,KAAK,CAdRM,aAAa;IACbC,OAAO,GAaJP,KAAK,CAbRO,OAAO;IACPC,EAAE,GAYCR,KAAK,CAZRQ,EAAE;IACFC,YAAY,GAWTT,KAAK,CAXRS,YAAY;IACZC,IAAI,GAUDV,KAAK,CAVRU,IAAI;IAAAC,qBAAA,GAUDX,KAAK,CATRY,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAA,MAAA,GAAG;AACpBE,MAAAA,QAAQ,EAAE,QAAQ;AAClBC,MAAAA,IAAI,EAAE,OAAO;AACbC,MAAAA,KAAK,EAAE;AACR,KAAC,GAAAJ,qBAAA;IAGDK,OAAO,GAEJhB,KAAK,CAFRgB,OAAO;AACJC,IAAAA,IAAI,GAAAC,iDAAA,CACJlB,KAAK,EAAAmB,SAAA,CAAA;AACT,EAAA,IAAMC,OAAO,GAAGC,2BAAU,CAAC,kBAAkB,EAAEnB,SAAS,CAAC;AAEzD,EAAA,IAAMoB,gBAAgB,GAAGC,sCAAsB,CAAC,kBAAkB,EAAEP,OAAO,CAAC;;AAE5E;AACF;AACA;AACA;AACA;EACE,IAAMQ,aAAa,GAAIC,CAAuC,IAAK;AAClEH,IAAAA,gBAAgB,CAAC;AAChBI,MAAAA,MAAM,EAAE,OAAO;AACfC,MAAAA,OAAO,EAAElB,YAAY,GAAG,MAAM,GAAG;AAClC,KAAC,CAAC;AAEFF,IAAAA,OAAO,aAAPA,OAAO,KAAA,MAAA,GAAA,MAAA,GAAPA,OAAO,CAAGkB,CAAC,CAAC;EACb,CAAC;AAED,EAAA,IAAIhB,YAAY,EAAE;IACjB,oBACCX,gBAAA,CAAA8B,aAAA,CAACC,uBAAW,EAAAC,iCAAA,KAAKxB,aAAa,EAAA;AAAEJ,MAAAA,SAAS,EAAEkB,OAAQ;AAAC,MAAA,SAAA,EAASZ,EAAG;AAACD,MAAAA,OAAO,EAAEiB;KAAc,CAAA,eACvF1B,gBAAA,CAAA8B,aAAA,CAAA,MAAA,EAAA;MAAM1B,SAAS,EAAE6B,+BAAM,CAACC;AAAqB,KAAA,EAAE7B,IAAW,CAAC,EAC1DO,IACW,CAAC;AAEhB,EAAA;EAEA,oBACCZ,gBAAA,CAAA8B,aAAA,CAACK,2BAAa,EAAAH,iCAAA,CAAA,EAAA,EACTb,IAAI,EACJL,kBAAkB,EAAA;AACtBV,IAAAA,SAAS,EAAEkB,OAAQ;AACnB,IAAA,SAAA,EAASZ,EAAG;AACZ,IAAA,aAAA,EAAaH,eAAe,GAAG,MAAM,GAAG6B,SAAU;AAClD/B,IAAAA,IAAI,EAAEA,IAAK;AACXI,IAAAA,OAAO,EAAEiB,aAAc;AACvBvB,IAAAA,GAAG,EAAEA,GAAI;AACTS,IAAAA,IAAI,EAAEA;AAAK,GAAA,CACX,CAAC;AAEJ,CACD;;;;"}

package/dist/cjs/components/tooltip/MrlTooltip/MrlTooltip.js

@@ -9,6 +9,7 @@ var classnames = require('classnames');
 var index = require('../useTooltipPosition/index.js');
 var web = require('@react-spring/web');
 var index$1 = require('../../../utils/layers/index.js');
+var useMrlAnalytics = require('../../../hooks/useMrlAnalytics/useMrlAnalytics.js');
 var setAttributes = require('../../../utils/setAttributes/setAttributes.js');
 var MrlPortal = require('../../portal/MrlPortal.js');
 
@@ -35,7 +36,7 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
-var _excluded = ["children", "clickToClose", "disableTooltipHover", "display", "text", "attrs", "dataQa", "position", "anchor", "srAnnouncement", "tooltipClass", "tooltipContentClass"],
+var _excluded = ["children", "clickToClose", "disableTooltipHover", "display", "text", "attrs", "dataQa", "position", "anchor", "srAnnouncement", "tooltipClass", "tooltipContentClass", "eventId"],
   _excluded2 = ["className", "onBlur", "onFocus", "onKeyDown", "onMouseOver", "onMouseOut", "onMouseUp", "children"];
 /**
  * MrlTooltip Component
@@ -65,7 +66,9 @@ var MrlTooltip = /*#__PURE__*/React__namespace.memo(props => {
     srAnnouncement = _props$srAnnouncement === void 0 ? true : _props$srAnnouncement,
     tooltipClass = props.tooltipClass,
     tooltipContentClass = props.tooltipContentClass,
+    eventId = props.eventId,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
+  var trackInteraction = useMrlAnalytics.useMrlTrackInteraction('MrlTooltip', eventId);
   var _React$useState = React__namespace.useState('mouse'),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
     interaction = _React$useState2[0],
@@ -89,6 +92,25 @@ var MrlTooltip = /*#__PURE__*/React__namespace.memo(props => {
     id = _React$useState6[0],
     setId = _React$useState6[1];
 
+  /**
+   * The tooltip shows and hides from hover, focus and click, so open/close is emitted
+   * from the resulting display state rather than from each individual handler.
+   */
+  var previousDisplayRef = React__namespace.useRef(defaultDisplay);
+  React__namespace.useEffect(() => {
+    if (previousDisplayRef.current === display) return;
+    previousDisplayRef.current = display;
+    trackInteraction({
+      action: display === 'show' ? 'open' : 'close',
+      metadata: {
+        interaction
+      },
+      variant: position
+    });
+    // `interaction` only annotates the event; it must not re-trigger it
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [display, position, trackInteraction]);
+
   /**
    * Event handler to show tooltip when the trigger is focused
    */

package/dist/cjs/components/tooltip/MrlTooltip/MrlTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlTooltip.js","sources":["../../../../../src/components/tooltip/MrlTooltip/MrlTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, getUniqueId } from '../../../utils';\nimport {\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition,\n\tMrlTooltipState\n} from '../constants';\nimport { MrlTooltipContent } from '../MrlTooltipContent/MrlTooltipContent';\nimport { curryHandlers } from '../utils';\nimport classNames from 'classnames';\nimport { MrlPortal } from '../../portal';\nimport '../../../styles/shared/a11y-helpers/a11y.global.scss';\nimport { useTooltipPosition } from '../useTooltipPosition';\nimport { useTransition, animated } from '@react-spring/web';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\n\ninterface MrlTooltipProps {\n\t/** The arrow position of the tooltip in relation to its trigger's content */\n\tanchor?: MrlTooltipAnchor;\n\n\t/**\n\t * Attributes that are applied to the component during the initial render.\n\t *\n\t * Example usage: html attributes, custom data attributes (data-qa), aria\n\t * @deprecated please use props for component instead\n\t */\n\tattrs?: AttrsObject;\n\n\t/**\n\t * Children to be rendered within the tooltip. The first child is used as the trigger.\n\t *\n\t * Warning: The tooltip is only setup to work with a single trigger. If multiple children\n\t * are passed in the component will not have event handling for the additional child elements.\n\t */\n\tchildren: React.ReactElement;\n\n\t/** Whether the tooltip should close when clicked */\n\tclickToClose?: boolean;\n\n\t/** The data-qa attribute for the tooltip */\n\tdataQa?: string;\n\n\t/** The state value to determine if the tooltip should be displayed */\n\tdisplay?: MrlTooltipState;\n\n\t/** Whether to disable the tooltip hover action that keeps it open */\n\tdisableTooltipHover?: boolean;\n\n\t/** The placement of the tooltip in relation to its trigger */\n\tposition?: MrlTooltipPosition;\n\n\t/** Whether to announce the tooltip content to screen readers */\n\tsrAnnouncement?: boolean;\n\n\t/** The textual label of tooltip */\n\ttext: string;\n\n\t/** A custom class selector to be applied to the tooltip wrapper */\n\ttooltipClass?: string;\n\n\t/** A class to be applied ot the tooltip content */\n\ttooltipContentClass?: string;\n\n\t/** A custom render function to render the tooltip content */\n\tcustomRender?: (text?: string) => React.ReactNode;\n}\n\n/**\n * MrlTooltip Component\n *\n * This component is not displayed when rendering this component if the primary pointing device can’t hover. Examples include touchscreens and screens that use a basic drawing stylus.\n * Pointing devices that can hover, but for which doing so is inconvenient and not part of the normal way they are used, also match this criteria. For example, a touchscreen where a long press is treated as hovering.\n * @param {MrlTooltipProps} props - The props of the component\n * @returns {HTMLElement} a configured Tooltip component\n */\nexport const MrlTooltip = React.memo((props: MrlTooltipProps): React.ReactElement => {\n\tconst {\n\t\tchildren,\n\t\tclickToClose = true,\n\t\tdisableTooltipHover = false,\n\t\tdisplay: defaultDisplay = 'hide',\n\t\ttext,\n\t\tattrs = {},\n\t\tdataQa,\n\t\tposition = MrlTooltipDefaults.position || 'top',\n\t\tanchor = MrlTooltipDefaults.anchor,\n\t\tsrAnnouncement = true,\n\t\ttooltipClass,\n\t\ttooltipContentClass,\n\t\t...rest\n\t} = props;\n\n\tconst [interaction, setInteraction] = React.useState('mouse');\n\n\tconst triggerRef = React.useRef<HTMLElement | null>(null);\n\n\tconst tooltipRef = React.useRef<HTMLDivElement>(null);\n\n\t/**\n\t * State value to determine if the tooltip should be displayed\n\t */\n\tconst [display, setDisplay] = React.useState<MrlTooltipState>(defaultDisplay);\n\n\t/**\n\t * State value to determine if the tooltip should be displayed\n\t */\n\tconst [id, setId] = React.useState<string>('');\n\n\t/**\n\t * Event handler to show tooltip when the trigger is focused\n\t */\n\tconst handleShowTooltip = React.useCallback(() => {\n\t\tsetDisplay('show');\n\t}, []);\n\n\tconst handleFocus = React.useCallback(() => {\n\t\tif (interaction === 'keyboard') {\n\t\t\thandleShowTooltip();\n\t\t}\n\t}, [interaction, handleShowTooltip]);\n\n\t/**\n\t * Event handler to hide the tooltip on mouseout\n\t */\n\tconst handleHideTooltip = (): void => {\n\t\tsetDisplay('hide');\n\t};\n\n\t/**\n\t * Event handler to hide the tooltip when a user presses escape\n\t * @param {React.KeyboardEvent} e Keyboard event\n\t */\n\tconst handleKeyDown = (e: React.KeyboardEvent): void => {\n\t\tif (e.key === 'Escape' || e.key === 'Enter' || e.key === ' ') {\n\t\t\thandleHideTooltip();\n\t\t}\n\t};\n\n\tconst handleSetKeyboardInteraction = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Tab' || e.key === 'Enter' || e.key === ' ') {\n\t\t\tsetInteraction('keyboard');\n\t\t}\n\t};\n\n\tconst handlesetMouseInteraction = () => setInteraction('mouse');\n\n\t/**\n\t * Setup of the initial component attributes and events\n\t */\n\tReact.useEffect(() => {\n\t\tif (id === '') setId(getUniqueId('mrl-tooltip'));\n\t}, [id]);\n\n\tReact.useEffect(() => {\n\t\tsetDisplay(defaultDisplay);\n\t}, [defaultDisplay]);\n\n\t/**\n\t * Setting the triggerRef to the trigger element\n\t *\n\t * We need to use 'querySelector' because we cannot pass a ref to the child object. There are\n\t * some situations where the child component may not accept a ref, for example: a react router\n\t * link is passed as a child. In older versions of react router you could not pass a ref to the\n\t * component so this causes an issue.\n\t */\n\tReact.useEffect(() => {\n\t\tconst trigger = document.querySelector(`[data-tooltip-id=\"${id}\"]`);\n\t\ttriggerRef.current = trigger as HTMLElement;\n\t}, [id]);\n\n\tReact.useEffect(() => {\n\t\tconst currentTooltipRef = tooltipRef.current;\n\n\t\tdocument.addEventListener('keydown', handleSetKeyboardInteraction);\n\t\tdocument.addEventListener('mousedown', handlesetMouseInteraction);\n\n\t\tif (!disableTooltipHover && currentTooltipRef) {\n\t\t\tcurrentTooltipRef.addEventListener('mouseover', handleShowTooltip);\n\t\t\tcurrentTooltipRef.addEventListener('mouseout', handleHideTooltip);\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (!disableTooltipHover && currentTooltipRef) {\n\t\t\t\tcurrentTooltipRef.removeEventListener('mouseover', handleShowTooltip);\n\t\t\t\tcurrentTooltipRef.removeEventListener('mouseout', handleHideTooltip);\n\t\t\t}\n\n\t\t\tdocument.removeEventListener('keydown', handleSetKeyboardInteraction);\n\t\t\tdocument.removeEventListener('mousedown', handlesetMouseInteraction);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [handleShowTooltip, tooltipRef.current]);\n\n\tconst positionStyles = useTooltipPosition(\n\t\ttriggerRef,\n\t\ttooltipRef,\n\t\t{\n\t\t\talign: anchor,\n\t\t\tposition: position\n\t\t},\n\t\tdisplay === 'show',\n\t\t-1\n\t);\n\n\tconst inlineStyles = {\n\t\tmenu: {\n\t\t\tleft: positionStyles.left,\n\t\t\tposition: 'fixed' as const,\n\t\t\ttop: positionStyles.top\n\t\t}\n\t};\n\n\tconst transitions = useTransition(display === 'show', {\n\t\tconfig: { duration: display === 'show' ? 150 : 25 },\n\t\tenter: { opacity: 1 },\n\t\tfrom: { opacity: 0 },\n\t\tleave: { opacity: 0 }\n\t});\n\n\treturn (\n\t\t<>\n\t\t\t{React.Children.map(children, (child, index) => {\n\t\t\t\tif (index === 0 && React.isValidElement(child)) {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\tonBlur,\n\t\t\t\t\t\tonFocus,\n\t\t\t\t\t\tonKeyDown,\n\t\t\t\t\t\tonMouseOver,\n\t\t\t\t\t\tonMouseOut,\n\t\t\t\t\t\tonMouseUp,\n\t\t\t\t\t\tchildren,\n\t\t\t\t\t\t...otherProps\n\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\t\t\t\t\t} = (child as any).props;\n\n\t\t\t\t\treturn React.cloneElement(child as React.ReactElement, {\n\t\t\t\t\t\t'aria-describedby': display === 'show' && srAnnouncement ? id : undefined,\n\t\t\t\t\t\tclassName: classNames(\n\t\t\t\t\t\t\ttooltipClass,\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t'mrl-tooltip-trigger',\n\t\t\t\t\t\t\tdisplay === 'show' && 'mrl-tooltip-trigger--active'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tonBlur: curryHandlers(onBlur, handleHideTooltip),\n\t\t\t\t\t\t...(clickToClose && !disableTooltipHover\n\t\t\t\t\t\t\t? { onMouseUp: curryHandlers(onMouseUp, handleHideTooltip) }\n\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\tonFocus: curryHandlers(onFocus, handleFocus),\n\t\t\t\t\t\tonKeyDown: curryHandlers(onKeyDown, handleKeyDown),\n\t\t\t\t\t\tonMouseOut: curryHandlers(onMouseOut, handleHideTooltip),\n\t\t\t\t\t\tonMouseOver: curryHandlers(onMouseOver, handleShowTooltip),\n\t\t\t\t\t\t...otherProps,\n\t\t\t\t\t\tchildren,\n\t\t\t\t\t\t['data-tooltip-id']: id\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t\treturn child;\n\t\t\t})}\n\t\t\t<MrlPortal\n\t\t\t\tid={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t\tlayer={PORTAL_LAYERS.TOOLTIP}\n\t\t\t\tclassName={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t\tdata-qa={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t>\n\t\t\t\t{transitions(\n\t\t\t\t\t(style, item) =>\n\t\t\t\t\t\titem && (\n\t\t\t\t\t\t\t<animated.div ref={tooltipRef} style={{ ...inlineStyles.menu, ...style }}>\n\t\t\t\t\t\t\t\t<MrlTooltipContent\n\t\t\t\t\t\t\t\t\t{...rest}\n\t\t\t\t\t\t\t\t\tattrs={attrs}\n\t\t\t\t\t\t\t\t\tanchor={anchor}\n\t\t\t\t\t\t\t\t\tdataQa={dataQa}\n\t\t\t\t\t\t\t\t\tid={id}\n\t\t\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\t\t\ttext={text}\n\t\t\t\t\t\t\t\t\ttooltipContentClass={tooltipContentClass}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</animated.div>\n\t\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</MrlPortal>\n\t\t</>\n\t);\n});\n\nMrlTooltip.displayName = 'MrlTooltip';\n"],"names":["MrlTooltip","React","memo","props","children","_props$clickToClose","clickToClose","_props$disableTooltip","disableTooltipHover","_props$display","display","defaultDisplay","text","_props$attrs","attrs","dataQa","_props$position","position","MrlTooltipDefaults","_props$anchor","anchor","_props$srAnnouncement","srAnnouncement","tooltipClass","tooltipContentClass","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","interaction","setInteraction","triggerRef","useRef","tooltipRef","_React$useState3","_React$useState4","setDisplay","_React$useState5","_React$useState6","id","setId","handleShowTooltip","useCallback","handleFocus","handleHideTooltip","handleKeyDown","e","key","handleSetKeyboardInteraction","handlesetMouseInteraction","useEffect","getUniqueId","trigger","document","querySelector","concat","current","currentTooltipRef","addEventListener","removeEventListener","positionStyles","useTooltipPosition","align","inlineStyles","menu","left","top","transitions","useTransition","config","duration","enter","opacity","from","leave","createElement","Fragment","Children","map","child","index","isValidElement","_props","className","onBlur","onFocus","onKeyDown","onMouseOver","onMouseOut","onMouseUp","otherProps","_excluded2","cloneElement","_objectSpread","undefined","classNames","curryHandlers","MrlPortal","PORTAL_LAYERS","TOOLTIP","name","layer","style","item","animated","div","ref","MrlTooltipContent","_extends","displayName"],"mappings":"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"}
+{"version":3,"file":"MrlTooltip.js","sources":["../../../../../src/components/tooltip/MrlTooltip/MrlTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AttrsObject, getUniqueId } from '../../../utils';\nimport {\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition,\n\tMrlTooltipState\n} from '../constants';\nimport { MrlTooltipContent } from '../MrlTooltipContent/MrlTooltipContent';\nimport { curryHandlers } from '../utils';\nimport classNames from 'classnames';\nimport { MrlPortal } from '../../portal';\nimport '../../../styles/shared/a11y-helpers/a11y.global.scss';\nimport { useTooltipPosition } from '../useTooltipPosition';\nimport { useTransition, animated } from '@react-spring/web';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\nimport { useMrlTrackInteraction } from '../../../hooks/useMrlAnalytics';\n\ninterface MrlTooltipProps {\n\t/** The arrow position of the tooltip in relation to its trigger's content */\n\tanchor?: MrlTooltipAnchor;\n\n\t/**\n\t * Attributes that are applied to the component during the initial render.\n\t *\n\t * Example usage: html attributes, custom data attributes (data-qa), aria\n\t * @deprecated please use props for component instead\n\t */\n\tattrs?: AttrsObject;\n\n\t/**\n\t * Children to be rendered within the tooltip. The first child is used as the trigger.\n\t *\n\t * Warning: The tooltip is only setup to work with a single trigger. If multiple children\n\t * are passed in the component will not have event handling for the additional child elements.\n\t */\n\tchildren: React.ReactElement;\n\n\t/** Whether the tooltip should close when clicked */\n\tclickToClose?: boolean;\n\n\t/** The data-qa attribute for the tooltip */\n\tdataQa?: string;\n\n\t/** The state value to determine if the tooltip should be displayed */\n\tdisplay?: MrlTooltipState;\n\n\t/** Whether to disable the tooltip hover action that keeps it open */\n\tdisableTooltipHover?: boolean;\n\n\t/** The placement of the tooltip in relation to its trigger */\n\tposition?: MrlTooltipPosition;\n\n\t/** Whether to announce the tooltip content to screen readers */\n\tsrAnnouncement?: boolean;\n\n\t/** The textual label of tooltip */\n\ttext: string;\n\n\t/** A custom class selector to be applied to the tooltip wrapper */\n\ttooltipClass?: string;\n\n\t/** A class to be applied ot the tooltip content */\n\ttooltipContentClass?: string;\n\n\t/** A custom render function to render the tooltip content */\n\tcustomRender?: (text?: string) => React.ReactNode;\n\n\t/**\n\t * Enables interaction tracking for this tooltip. Provide a stable, non-PII id\n\t * (e.g. 'facilitation-timer-tooltip'). When omitted, the tooltip emits no analytics.\n\t *\n\t * Note: tooltips open on hover, so an instrumented tooltip is a high-volume source.\n\t * Only add an id where the reveal itself is the signal you need.\n\t */\n\teventId?: string;\n}\n\n/**\n * MrlTooltip Component\n *\n * This component is not displayed when rendering this component if the primary pointing device can’t hover. Examples include touchscreens and screens that use a basic drawing stylus.\n * Pointing devices that can hover, but for which doing so is inconvenient and not part of the normal way they are used, also match this criteria. For example, a touchscreen where a long press is treated as hovering.\n * @param {MrlTooltipProps} props - The props of the component\n * @returns {HTMLElement} a configured Tooltip component\n */\nexport const MrlTooltip = React.memo((props: MrlTooltipProps): React.ReactElement => {\n\tconst {\n\t\tchildren,\n\t\tclickToClose = true,\n\t\tdisableTooltipHover = false,\n\t\tdisplay: defaultDisplay = 'hide',\n\t\ttext,\n\t\tattrs = {},\n\t\tdataQa,\n\t\tposition = MrlTooltipDefaults.position || 'top',\n\t\tanchor = MrlTooltipDefaults.anchor,\n\t\tsrAnnouncement = true,\n\t\ttooltipClass,\n\t\ttooltipContentClass,\n\t\teventId,\n\t\t...rest\n\t} = props;\n\n\tconst trackInteraction = useMrlTrackInteraction('MrlTooltip', eventId);\n\n\tconst [interaction, setInteraction] = React.useState('mouse');\n\n\tconst triggerRef = React.useRef<HTMLElement | null>(null);\n\n\tconst tooltipRef = React.useRef<HTMLDivElement>(null);\n\n\t/**\n\t * State value to determine if the tooltip should be displayed\n\t */\n\tconst [display, setDisplay] = React.useState<MrlTooltipState>(defaultDisplay);\n\n\t/**\n\t * State value to determine if the tooltip should be displayed\n\t */\n\tconst [id, setId] = React.useState<string>('');\n\n\t/**\n\t * The tooltip shows and hides from hover, focus and click, so open/close is emitted\n\t * from the resulting display state rather than from each individual handler.\n\t */\n\tconst previousDisplayRef = React.useRef<MrlTooltipState>(defaultDisplay);\n\n\tReact.useEffect(() => {\n\t\tif (previousDisplayRef.current === display) return;\n\n\t\tpreviousDisplayRef.current = display;\n\n\t\ttrackInteraction({\n\t\t\taction: display === 'show' ? 'open' : 'close',\n\t\t\tmetadata: { interaction },\n\t\t\tvariant: position\n\t\t});\n\t\t// `interaction` only annotates the event; it must not re-trigger it\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [display, position, trackInteraction]);\n\n\t/**\n\t * Event handler to show tooltip when the trigger is focused\n\t */\n\tconst handleShowTooltip = React.useCallback(() => {\n\t\tsetDisplay('show');\n\t}, []);\n\n\tconst handleFocus = React.useCallback(() => {\n\t\tif (interaction === 'keyboard') {\n\t\t\thandleShowTooltip();\n\t\t}\n\t}, [interaction, handleShowTooltip]);\n\n\t/**\n\t * Event handler to hide the tooltip on mouseout\n\t */\n\tconst handleHideTooltip = (): void => {\n\t\tsetDisplay('hide');\n\t};\n\n\t/**\n\t * Event handler to hide the tooltip when a user presses escape\n\t * @param {React.KeyboardEvent} e Keyboard event\n\t */\n\tconst handleKeyDown = (e: React.KeyboardEvent): void => {\n\t\tif (e.key === 'Escape' || e.key === 'Enter' || e.key === ' ') {\n\t\t\thandleHideTooltip();\n\t\t}\n\t};\n\n\tconst handleSetKeyboardInteraction = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Tab' || e.key === 'Enter' || e.key === ' ') {\n\t\t\tsetInteraction('keyboard');\n\t\t}\n\t};\n\n\tconst handlesetMouseInteraction = () => setInteraction('mouse');\n\n\t/**\n\t * Setup of the initial component attributes and events\n\t */\n\tReact.useEffect(() => {\n\t\tif (id === '') setId(getUniqueId('mrl-tooltip'));\n\t}, [id]);\n\n\tReact.useEffect(() => {\n\t\tsetDisplay(defaultDisplay);\n\t}, [defaultDisplay]);\n\n\t/**\n\t * Setting the triggerRef to the trigger element\n\t *\n\t * We need to use 'querySelector' because we cannot pass a ref to the child object. There are\n\t * some situations where the child component may not accept a ref, for example: a react router\n\t * link is passed as a child. In older versions of react router you could not pass a ref to the\n\t * component so this causes an issue.\n\t */\n\tReact.useEffect(() => {\n\t\tconst trigger = document.querySelector(`[data-tooltip-id=\"${id}\"]`);\n\t\ttriggerRef.current = trigger as HTMLElement;\n\t}, [id]);\n\n\tReact.useEffect(() => {\n\t\tconst currentTooltipRef = tooltipRef.current;\n\n\t\tdocument.addEventListener('keydown', handleSetKeyboardInteraction);\n\t\tdocument.addEventListener('mousedown', handlesetMouseInteraction);\n\n\t\tif (!disableTooltipHover && currentTooltipRef) {\n\t\t\tcurrentTooltipRef.addEventListener('mouseover', handleShowTooltip);\n\t\t\tcurrentTooltipRef.addEventListener('mouseout', handleHideTooltip);\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (!disableTooltipHover && currentTooltipRef) {\n\t\t\t\tcurrentTooltipRef.removeEventListener('mouseover', handleShowTooltip);\n\t\t\t\tcurrentTooltipRef.removeEventListener('mouseout', handleHideTooltip);\n\t\t\t}\n\n\t\t\tdocument.removeEventListener('keydown', handleSetKeyboardInteraction);\n\t\t\tdocument.removeEventListener('mousedown', handlesetMouseInteraction);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [handleShowTooltip, tooltipRef.current]);\n\n\tconst positionStyles = useTooltipPosition(\n\t\ttriggerRef,\n\t\ttooltipRef,\n\t\t{\n\t\t\talign: anchor,\n\t\t\tposition: position\n\t\t},\n\t\tdisplay === 'show',\n\t\t-1\n\t);\n\n\tconst inlineStyles = {\n\t\tmenu: {\n\t\t\tleft: positionStyles.left,\n\t\t\tposition: 'fixed' as const,\n\t\t\ttop: positionStyles.top\n\t\t}\n\t};\n\n\tconst transitions = useTransition(display === 'show', {\n\t\tconfig: { duration: display === 'show' ? 150 : 25 },\n\t\tenter: { opacity: 1 },\n\t\tfrom: { opacity: 0 },\n\t\tleave: { opacity: 0 }\n\t});\n\n\treturn (\n\t\t<>\n\t\t\t{React.Children.map(children, (child, index) => {\n\t\t\t\tif (index === 0 && React.isValidElement(child)) {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\tonBlur,\n\t\t\t\t\t\tonFocus,\n\t\t\t\t\t\tonKeyDown,\n\t\t\t\t\t\tonMouseOver,\n\t\t\t\t\t\tonMouseOut,\n\t\t\t\t\t\tonMouseUp,\n\t\t\t\t\t\tchildren,\n\t\t\t\t\t\t...otherProps\n\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\t\t\t\t\t} = (child as any).props;\n\n\t\t\t\t\treturn React.cloneElement(child as React.ReactElement, {\n\t\t\t\t\t\t'aria-describedby': display === 'show' && srAnnouncement ? id : undefined,\n\t\t\t\t\t\tclassName: classNames(\n\t\t\t\t\t\t\ttooltipClass,\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t'mrl-tooltip-trigger',\n\t\t\t\t\t\t\tdisplay === 'show' && 'mrl-tooltip-trigger--active'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tonBlur: curryHandlers(onBlur, handleHideTooltip),\n\t\t\t\t\t\t...(clickToClose && !disableTooltipHover\n\t\t\t\t\t\t\t? { onMouseUp: curryHandlers(onMouseUp, handleHideTooltip) }\n\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\tonFocus: curryHandlers(onFocus, handleFocus),\n\t\t\t\t\t\tonKeyDown: curryHandlers(onKeyDown, handleKeyDown),\n\t\t\t\t\t\tonMouseOut: curryHandlers(onMouseOut, handleHideTooltip),\n\t\t\t\t\t\tonMouseOver: curryHandlers(onMouseOver, handleShowTooltip),\n\t\t\t\t\t\t...otherProps,\n\t\t\t\t\t\tchildren,\n\t\t\t\t\t\t['data-tooltip-id']: id\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t\treturn child;\n\t\t\t})}\n\t\t\t<MrlPortal\n\t\t\t\tid={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t\tlayer={PORTAL_LAYERS.TOOLTIP}\n\t\t\t\tclassName={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t\tdata-qa={PORTAL_LAYERS.TOOLTIP.name}\n\t\t\t>\n\t\t\t\t{transitions(\n\t\t\t\t\t(style, item) =>\n\t\t\t\t\t\titem && (\n\t\t\t\t\t\t\t<animated.div ref={tooltipRef} style={{ ...inlineStyles.menu, ...style }}>\n\t\t\t\t\t\t\t\t<MrlTooltipContent\n\t\t\t\t\t\t\t\t\t{...rest}\n\t\t\t\t\t\t\t\t\tattrs={attrs}\n\t\t\t\t\t\t\t\t\tanchor={anchor}\n\t\t\t\t\t\t\t\t\tdataQa={dataQa}\n\t\t\t\t\t\t\t\t\tid={id}\n\t\t\t\t\t\t\t\t\tposition={position}\n\t\t\t\t\t\t\t\t\ttext={text}\n\t\t\t\t\t\t\t\t\ttooltipContentClass={tooltipContentClass}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</animated.div>\n\t\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</MrlPortal>\n\t\t</>\n\t);\n});\n\nMrlTooltip.displayName = 'MrlTooltip';\n"],"names":["MrlTooltip","React","memo","props","children","_props$clickToClose","clickToClose","_props$disableTooltip","disableTooltipHover","_props$display","display","defaultDisplay","text","_props$attrs","attrs","dataQa","_props$position","position","MrlTooltipDefaults","_props$anchor","anchor","_props$srAnnouncement","srAnnouncement","tooltipClass","tooltipContentClass","eventId","rest","_objectWithoutProperties","_excluded","trackInteraction","useMrlTrackInteraction","_React$useState","useState","_React$useState2","_slicedToArray","interaction","setInteraction","triggerRef","useRef","tooltipRef","_React$useState3","_React$useState4","setDisplay","_React$useState5","_React$useState6","id","setId","previousDisplayRef","useEffect","current","action","metadata","variant","handleShowTooltip","useCallback","handleFocus","handleHideTooltip","handleKeyDown","e","key","handleSetKeyboardInteraction","handlesetMouseInteraction","getUniqueId","trigger","document","querySelector","concat","currentTooltipRef","addEventListener","removeEventListener","positionStyles","useTooltipPosition","align","inlineStyles","menu","left","top","transitions","useTransition","config","duration","enter","opacity","from","leave","createElement","Fragment","Children","map","child","index","isValidElement","_props","className","onBlur","onFocus","onKeyDown","onMouseOver","onMouseOut","onMouseUp","otherProps","_excluded2","cloneElement","_objectSpread","undefined","classNames","curryHandlers","MrlPortal","PORTAL_LAYERS","TOOLTIP","name","layer","style","item","animated","div","ref","MrlTooltipContent","_extends","displayName"],"mappings":"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"}

package/dist/cjs/hooks/useMrlAnalytics/useMrlAnalytics.js

@@ -31,15 +31,15 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
  */
 var useMrlAnalytics = () => React__namespace.useContext(MrlAnalyticsContext.MrlAnalyticsContext);
 /**
- * Component-facing helper. Binds component identity + trackingId once, then
- * `emit({ action })` per interaction. No-ops entirely when trackingId is absent,
+ * Component-facing helper. Binds component identity + eventId once, then
+ * `emit({ action })` per interaction. No-ops entirely when eventId is absent,
  * so instrumentation is opt-in and attributable.
  *
  * @param component - the emitting component's name, e.g. 'MrlButton'
- * @param trackingId - consumer-supplied, non-PII id; undefined disables emission
+ * @param eventId - consumer-supplied, non-PII id; undefined disables emission
  * @returns an `emit` callback that fires a single interaction per call
  */
-var useMrlTrackInteraction = (component, trackingId) => {
+var useMrlTrackInteraction = (component, eventId) => {
   var _useMrlAnalytics = useMrlAnalytics(),
     track = _useMrlAnalytics.track;
   return React__namespace.useCallback(_ref => {
@@ -47,20 +47,20 @@ var useMrlTrackInteraction = (component, trackingId) => {
       variant = _ref.variant,
       metadata = _ref.metadata;
     // opt-in: no id → no event (volume + PII guard)
-    if (!trackingId) return;
+    if (!eventId) return;
     try {
       track({
         action,
         component,
+        eventId,
         metadata,
         toolkitVersion: version.TOOLKIT_VERSION,
-        trackingId,
         variant
       });
     } catch (e) {
       return;
     }
-  }, [track, component, trackingId]);
+  }, [track, component, eventId]);
 };
 
 exports.useMrlAnalytics = useMrlAnalytics;

package/dist/cjs/hooks/useMrlAnalytics/useMrlAnalytics.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMrlAnalytics.js","sources":["../../../../src/hooks/useMrlAnalytics/useMrlAnalytics.ts"],"sourcesContent":["import * as React from 'react';\nimport { MrlAnalyticsContext } from '../../contexts/MrlAnalyticsContext';\nimport { MrlAnalyticsEvent, MrlTrack } from '../../contexts/MrlAnalyticsContext/types';\nimport { TOOLKIT_VERSION } from '../../version';\n\n/**\n * Raw accessor for the analytics context.\n *\n * @returns the injected `track` transport (default no-op)\n */\nexport const useMrlAnalytics = (): { track: MrlTrack } => React.useContext(MrlAnalyticsContext);\n\ntype EmitArgs = Pick<MrlAnalyticsEvent, 'action' | 'variant' | 'metadata'>;\n\n/**\n * Component-facing helper. Binds component identity + trackingId once, then\n * `emit({ action })` per interaction. No-ops entirely when trackingId is absent,\n * so instrumentation is opt-in and attributable.\n *\n * @param component - the emitting component's name, e.g. 'MrlButton'\n * @param trackingId - consumer-supplied, non-PII id; undefined disables emission\n * @returns an `emit` callback that fires a single interaction per call\n */\nexport const useMrlTrackInteraction = (component: string, trackingId?: string) => {\n\tconst { track } = useMrlAnalytics();\n\n\treturn React.useCallback(\n\t\t({ action, variant, metadata }: EmitArgs) => {\n\t\t\t// opt-in: no id → no event (volume + PII guard)\n\t\t\tif (!trackingId) return;\n\t\t\ttry {\n\t\t\t\ttrack({\n\t\t\t\t\taction,\n\t\t\t\t\tcomponent,\n\t\t\t\t\tmetadata,\n\t\t\t\t\ttoolkitVersion: TOOLKIT_VERSION,\n\t\t\t\t\ttrackingId,\n\t\t\t\t\tvariant\n\t\t\t\t});\n\t\t\t} catch (e) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t},\n\t\t[track, component, trackingId]\n\t);\n};\n"],"names":["useMrlAnalytics","React","useContext","MrlAnalyticsContext","useMrlTrackInteraction","component","trackingId","_useMrlAnalytics","track","useCallback","_ref","action","variant","metadata","toolkitVersion","TOOLKIT_VERSION","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AACA;AACA;AACA;AACO,IAAMA,eAAe,GAAGA,MAA2BC,gBAAK,CAACC,UAAU,CAACC,uCAAmB;AAI9F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;IACaC,sBAAsB,GAAGA,CAACC,SAAiB,EAAEC,UAAmB,KAAK;AACjF,EAAA,IAAAC,gBAAA,GAAkBP,eAAe,EAAE;IAA3BQ,KAAK,GAAAD,gBAAA,CAALC,KAAK;AAEb,EAAA,OAAOP,gBAAK,CAACQ,WAAW,CACvBC,IAAA,IAA6C;AAAA,IAAA,IAA1CC,MAAM,GAAAD,IAAA,CAANC,MAAM;MAAEC,OAAO,GAAAF,IAAA,CAAPE,OAAO;MAAEC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;AAC3B;IACA,IAAI,CAACP,UAAU,EAAE;IACjB,IAAI;AACHE,MAAAA,KAAK,CAAC;QACLG,MAAM;QACNN,SAAS;QACTQ,QAAQ;AACRC,QAAAA,cAAc,EAAEC,uBAAe;QAC/BT,UAAU;AACVM,QAAAA;AACD,OAAC,CAAC;IACH,CAAC,CAAC,OAAOI,CAAC,EAAE;AACX,MAAA;AACD,IAAA;EACD,CAAC,EACD,CAACR,KAAK,EAAEH,SAAS,EAAEC,UAAU,CAC9B,CAAC;AACF;;;;;"}
+{"version":3,"file":"useMrlAnalytics.js","sources":["../../../../src/hooks/useMrlAnalytics/useMrlAnalytics.ts"],"sourcesContent":["import * as React from 'react';\nimport { MrlAnalyticsContext } from '../../contexts/MrlAnalyticsContext';\nimport { MrlAnalyticsEvent, MrlTrack } from '../../contexts/MrlAnalyticsContext/types';\nimport { TOOLKIT_VERSION } from '../../version';\n\n/**\n * Raw accessor for the analytics context.\n *\n * @returns the injected `track` transport (default no-op)\n */\nexport const useMrlAnalytics = (): { track: MrlTrack } => React.useContext(MrlAnalyticsContext);\n\ntype EmitArgs = Pick<MrlAnalyticsEvent, 'action' | 'variant' | 'metadata'>;\n\n/**\n * Component-facing helper. Binds component identity + eventId once, then\n * `emit({ action })` per interaction. No-ops entirely when eventId is absent,\n * so instrumentation is opt-in and attributable.\n *\n * @param component - the emitting component's name, e.g. 'MrlButton'\n * @param eventId - consumer-supplied, non-PII id; undefined disables emission\n * @returns an `emit` callback that fires a single interaction per call\n */\nexport const useMrlTrackInteraction = (component: string, eventId?: string) => {\n\tconst { track } = useMrlAnalytics();\n\n\treturn React.useCallback(\n\t\t({ action, variant, metadata }: EmitArgs) => {\n\t\t\t// opt-in: no id → no event (volume + PII guard)\n\t\t\tif (!eventId) return;\n\t\t\ttry {\n\t\t\t\ttrack({\n\t\t\t\t\taction,\n\t\t\t\t\tcomponent,\n\t\t\t\t\teventId,\n\t\t\t\t\tmetadata,\n\t\t\t\t\ttoolkitVersion: TOOLKIT_VERSION,\n\t\t\t\t\tvariant\n\t\t\t\t});\n\t\t\t} catch (e) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t},\n\t\t[track, component, eventId]\n\t);\n};\n"],"names":["useMrlAnalytics","React","useContext","MrlAnalyticsContext","useMrlTrackInteraction","component","eventId","_useMrlAnalytics","track","useCallback","_ref","action","variant","metadata","toolkitVersion","TOOLKIT_VERSION","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AACA;AACA;AACA;AACO,IAAMA,eAAe,GAAGA,MAA2BC,gBAAK,CAACC,UAAU,CAACC,uCAAmB;AAI9F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;IACaC,sBAAsB,GAAGA,CAACC,SAAiB,EAAEC,OAAgB,KAAK;AAC9E,EAAA,IAAAC,gBAAA,GAAkBP,eAAe,EAAE;IAA3BQ,KAAK,GAAAD,gBAAA,CAALC,KAAK;AAEb,EAAA,OAAOP,gBAAK,CAACQ,WAAW,CACvBC,IAAA,IAA6C;AAAA,IAAA,IAA1CC,MAAM,GAAAD,IAAA,CAANC,MAAM;MAAEC,OAAO,GAAAF,IAAA,CAAPE,OAAO;MAAEC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;AAC3B;IACA,IAAI,CAACP,OAAO,EAAE;IACd,IAAI;AACHE,MAAAA,KAAK,CAAC;QACLG,MAAM;QACNN,SAAS;QACTC,OAAO;QACPO,QAAQ;AACRC,QAAAA,cAAc,EAAEC,uBAAe;AAC/BH,QAAAA;AACD,OAAC,CAAC;IACH,CAAC,CAAC,OAAOI,CAAC,EAAE;AACX,MAAA;AACD,IAAA;EACD,CAAC,EACD,CAACR,KAAK,EAAEH,SAAS,EAAEC,OAAO,CAC3B,CAAC;AACF;;;;;"}

package/dist/cjs/version.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var TOOLKIT_VERSION = "4.72.0";
+var TOOLKIT_VERSION = "4.73.0-dev-t0WE.1";
 
 exports.TOOLKIT_VERSION = TOOLKIT_VERSION;
 //# sourceMappingURL=version.js.map

package/dist/cjs/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sources":["../../src/version.ts"],"sourcesContent":["export const TOOLKIT_VERSION = \"4.72.0\";"],"names":["TOOLKIT_VERSION"],"mappings":";;AAAO,IAAMA,eAAe,GAAG;;;;"}
+{"version":3,"file":"version.js","sources":["../../src/version.ts"],"sourcesContent":["export const TOOLKIT_VERSION = \"4.73.0-dev-t0WE.1\";"],"names":["TOOLKIT_VERSION"],"mappings":";;AAAO,IAAMA,eAAe,GAAG;;;;"}

package/dist/components/avatar/MrlAvatarButton/MrlAvatarButton.d.ts

@@ -48,6 +48,11 @@ export interface MrlAvatarButtonPropTypes extends MrlAvatarPropTypes, React.HTML
      * Tooltip configuration for the button
      */
     tooltip?: TooltipConfig;
+    /**
+     * Enables interaction tracking for this button. Provide a stable, non-PII id
+     * (e.g. 'workspace-member-avatar'). When omitted, the button emits no analytics.
+     */
+    eventId?: string;
     /**
      * Reference to the DOM element that is the MrlAvatarButton
      */
@@ -58,4 +63,4 @@ export interface MrlAvatarButtonPropTypes extends MrlAvatarPropTypes, React.HTML
  * @param {MrlAvatarButtonPropTypes} props the props for your MrlAvatarButton
  * @returns {React.ReactElement} an avatar button containing the props you pass
  */
-export declare const MrlAvatarButton: ({ buttonClassName, dataQa, id, includeInRoving, isToggleButton, label, loading, loadingText, onClick, size, state, toggleAria, tooltip, triggerRef, ...rest }: MrlAvatarButtonPropTypes) => React.ReactElement;
+export declare const MrlAvatarButton: ({ buttonClassName, dataQa, id, includeInRoving, isToggleButton, label, loading, loadingText, onClick, size, state, toggleAria, tooltip, eventId, triggerRef, ...rest }: MrlAvatarButtonPropTypes) => React.ReactElement;

package/dist/components/breadcrumb/MrlBreadcrumbItem/MrlBreadcrumbItem.d.ts

@@ -34,6 +34,11 @@ export interface MrlBreadcrumbItemProps extends React.ComponentPropsWithRef<'li'
     isTruncated?: boolean;
     link?: BreadcrumbItem['link'];
     text?: BreadcrumbItem['text'];
+    /**
+     * Enables interaction tracking for this breadcrumb. Provide a stable, non-PII id
+     * (e.g. 'room-breadcrumb'). When omitted, the breadcrumb emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * MrlBreadcrumbItem component.

package/dist/components/button/MrlButton/MrlButton.d.ts

@@ -85,7 +85,7 @@ export interface MrlButtonProps extends Omit<MrlComponentProps, 'style'>, React.
      * Enables interaction tracking for this button. Provide a stable, non-PII id
      * (e.g. 'board-share-cta'). When omitted, the button emits no analytics.
      */
-    trackingId?: string;
+    eventId?: string;
     /**
      * Determines which aria setup to use for various toggle/selected styles.
      * pressed - use for an traditional “toggle button”

package/dist/components/button/MrlIconButton/MrlIconButton.d.ts

@@ -80,6 +80,11 @@ export interface MrlIconButtonProps extends Omit<MrlComponentProps, 'style'>, Re
      * The arrow position of the tooltip in relation to the button.
      */
     tipAnchor?: MrlTooltipAnchor;
+    /**
+     * Enables interaction tracking for this button. Provide a stable, non-PII id
+     * (e.g. 'board-share-cta'). When omitted, the button emits no analytics.
+     */
+    eventId?: string;
     /**
      * Determines which aria setup to use for various toggle/selected styles.
      * pressed - use for an traditional “toggle button”

package/dist/components/callout/MrlCallout/MrlCallout.d.ts

@@ -23,6 +23,13 @@ export interface MrlCalloutProps extends MrlCalloutPopoverProps {
     title?: string;
     primaryCta?: MrlCalloutCTA;
     secondaryCta?: MrlCalloutCTA;
+    /**
+     * Enables interaction tracking for this callout. Provide a stable, non-PII id
+     * (e.g. 'ai-onboarding-callout'). When omitted, the callout emits no analytics.
+     *
+     * Note: title, eyebrow and description text are never emitted.
+     */
+    eventId?: string;
 }
 /**
  * MrlCallout component.

package/dist/components/filter/MrlFilter/MrlFilter.d.ts

@@ -18,6 +18,13 @@ export type MrlFilterProps = {
      * The default checked value for the filter. It will match the value of the MrlFilterItem.
      */
     defaultCheckedValue?: string;
+    /**
+     * Enables interaction tracking for this filter group. Provide a stable, non-PII id
+     * (e.g. 'templates-filter'). When omitted, the filter emits no analytics.
+     *
+     * Note: the selected value is never emitted.
+     */
+    eventId?: string;
 } & Omit<React.ComponentPropsWithoutRef<'div'>, 'defaultChecked' | 'defaultValue'> & Required<Pick<RovingPropTypes, 'orientation'>> & DataQa;
 /**
  * MrlFilter component.

package/dist/components/filter/MrlFilterItem/MrlFilterItem.d.ts

@@ -13,6 +13,13 @@ export type MrlFilterItemProps = {
      * The count of items for this filter option.
      */
     count?: number;
+    /**
+     * Enables interaction tracking for this filter option. Provide a stable, non-PII id
+     * (e.g. 'templates-category-filter'). When omitted, the option emits no analytics.
+     *
+     * Note: the option's value and content are never emitted.
+     */
+    eventId?: string;
 } & React.ComponentPropsWithoutRef<'span'> & DataQa;
 /**
  * MrlFilterItem component.

package/dist/components/form/checkbox/MrlCheckbox/MrlCheckbox.d.ts

@@ -31,6 +31,11 @@ interface MrlCheckboxProps {
      * }>
      */
     description?: string | React.ReactNode;
+    /**
+     * Enables interaction tracking for this checkbox. Provide a stable, non-PII id
+     * (e.g. 'export-include-comments'). When omitted, the checkbox emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * Form element with an associated text label that allows the user to select one or more options
@@ -38,5 +43,5 @@ interface MrlCheckboxProps {
  * @param {MrlCheckboxProps} props - the component props
  * @returns a checkbox element with an associated label
  */
-export declare function MrlCheckbox({ attrs, className, description, hasMultilineLabel, state, selected, icon, label, ...rest }: MrlCheckboxProps): JSX.Element;
+export declare function MrlCheckbox({ attrs, className, description, hasMultilineLabel, state, selected, icon, label, eventId, ...rest }: MrlCheckboxProps): JSX.Element;
 export {};

package/dist/components/form/checkbox/MrlCheckboxStandalone/MrlCheckboxStandalone.d.ts

@@ -8,6 +8,11 @@ interface MrlCheckboxStandaloneProps {
     state?: CheckboxStates;
     /** Sets what selection state the checkbox is in. */
     selected?: CheckboxSelected;
+    /**
+     * Enables interaction tracking for this checkbox. Provide a stable, non-PII id
+     * (e.g. 'export-include-comments'). When omitted, the checkbox emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * Input that allows the user to select one or more options from a provided list.
@@ -16,5 +21,5 @@ interface MrlCheckboxStandaloneProps {
  * @param {MrlCheckboxStandaloneProps} props - the component props
  * @returns a checkbox element
  */
-export declare function MrlCheckboxStandalone({ attrs, state, selected, ...rest }: MrlCheckboxStandaloneProps): JSX.Element;
+export declare function MrlCheckboxStandalone({ attrs, state, selected, eventId, ...rest }: MrlCheckboxStandaloneProps): JSX.Element;
 export {};

package/dist/components/form/date-picker/MrlDatePicker.d.ts

@@ -19,6 +19,13 @@ export interface MrlDatePickerProps extends React.ComponentPropsWithRef<'input'>
      * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
      */
     onChange?: React.ComponentPropsWithRef<'input'>['onChange'];
+    /**
+     * Enables interaction tracking for this date picker. Provide a stable, non-PII id
+     * (e.g. 'trial-end-date'). When omitted, the date picker emits no analytics.
+     *
+     * Note: the selected date is never emitted — only that a change happened.
+     */
+    eventId?: string;
 }
 /**
  * Allows the user to input a date

package/dist/components/form/legacy-select/MrlLegacySelect/MrlLegacySelect.d.ts

@@ -48,6 +48,11 @@ export interface MrlLegacySelectProptypes extends React.HTMLAttributes<HTMLDivEl
      * Can be used in conjunction with `hookChange` to create a controlled component.
      */
     value?: string;
+    /**
+     * Enables interaction tracking for this select. Provide a stable, non-PII id
+     * (e.g. 'workspace-role-select'). When omitted, the select emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * Creates and exports component class for Mural Select
@@ -55,4 +60,4 @@ export interface MrlLegacySelectProptypes extends React.HTMLAttributes<HTMLDivEl
  * @param {MrlLegacySelectProptypes} props the props for your MrlLink
  * @returns {React.ReactElement} an a element containing the text you pass
  */
-export declare const MrlLegacySelect: ({ attrs, children, kind, labelId, size, ...theRest }: MrlLegacySelectProptypes) => React.ReactElement;
+export declare const MrlLegacySelect: ({ attrs, children, kind, labelId, size, eventId, ...theRest }: MrlLegacySelectProptypes) => React.ReactElement;

package/dist/components/form/legacy-select/MrlLegacySelectItem/MrlLegacySelectItem.d.ts

@@ -26,6 +26,13 @@ export interface MrlLegacySelectItemProptypes extends React.HTMLAttributes<HTMLD
      * content for the item
      */
     children: React.ReactNode;
+    /**
+     * Enables interaction tracking for this option. Provide a stable, non-PII id
+     * (e.g. 'workspace-role-option'). When omitted, the option emits no analytics.
+     *
+     * Note: the option's value and text are never emitted.
+     */
+    eventId?: string;
 }
 /**
  * Renders a select component
@@ -33,4 +40,4 @@ export interface MrlLegacySelectItemProptypes extends React.HTMLAttributes<HTMLD
  * @param {MrlLegacySelectItemProptypes} props the props for your MrlLink
  * @returns {React.ReactElement} an a element containing the text you pass
  */
-export declare const MrlLegacySelectItem: ({ attrs, children, index, value, isDisabled, ...theRest }: MrlLegacySelectItemProptypes) => React.ReactElement;
+export declare const MrlLegacySelectItem: ({ attrs, children, index, value, isDisabled, eventId, ...theRest }: MrlLegacySelectItemProptypes) => React.ReactElement;

package/dist/components/form/radio/MrlRadioButton/MrlRadioButton.d.ts

@@ -36,6 +36,11 @@ interface MrlRadioButtonProps extends React.ComponentPropsWithoutRef<'input'> {
     description?: string | React.ReactNode;
     /** Data attribute for QA testing */
     ['data-qa']?: string;
+    /**
+     * Enables interaction tracking for this radio button. Provide a stable, non-PII id
+     * (e.g. 'plan-selection'). When omitted, the radio button emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * Form element with an associated text label and description that allows the user to select one
@@ -44,5 +49,5 @@ interface MrlRadioButtonProps extends React.ComponentPropsWithoutRef<'input'> {
  * @param {MrlRadioButtonProps} props - the component props
  * @returns an input with type "radio" with an associated label
  */
-export declare function MrlRadioButton({ className, description, hasMultilineLabel, name, value, icon, disabled, hasError, label, style, ...rest }: MrlRadioButtonProps): JSX.Element;
+export declare function MrlRadioButton({ className, description, hasMultilineLabel, name, value, icon, disabled, hasError, label, onChange, style, eventId, ...rest }: MrlRadioButtonProps): JSX.Element;
 export {};

package/dist/components/form/radio/MrlRadioButtonStandalone/MrlRadioButtonStandalone.d.ts

@@ -13,6 +13,11 @@ interface MrlRadioButtonStandaloneProps extends React.ComponentPropsWithoutRef<'
     hasError?: boolean;
     /** Additional class to add to the label */
     className?: string;
+    /**
+     * Enables interaction tracking for this radio button. Provide a stable, non-PII id
+     * (e.g. 'plan-selection'). When omitted, the radio button emits no analytics.
+     */
+    eventId?: string;
 }
 /**
  * Input that allows the user to select one options from a provided radio group.
@@ -22,5 +27,5 @@ interface MrlRadioButtonStandaloneProps extends React.ComponentPropsWithoutRef<'
  * @param {MrlRadioButtonStandaloneProps} props - the component props
  * @returns an input element with type="radio"
  */
-export declare function MrlRadioButtonStandalone({ className, disabled, hasError, id, name, ref, value, ...rest }: MrlRadioButtonStandaloneProps): JSX.Element;
+export declare function MrlRadioButtonStandalone({ className, disabled, hasError, id, name, onChange, ref, eventId, value, ...rest }: MrlRadioButtonStandaloneProps): JSX.Element;
 export {};

package/dist/components/form/select/MrlCreatableSelect/MrlCreatableSelect.d.ts

@@ -14,6 +14,13 @@ export interface MrlCreatableSelectProps<Option, IsMulti extends boolean = false
      */
     ['data-qa']?: string;
     showClearIndicatorIcon?: boolean;
+    /**
+     * Enables interaction tracking for this select. Provide a stable, non-PII id
+     * (e.g. 'template-tag-picker'). When omitted, the select emits no analytics.
+     *
+     * Note: option labels, values and created text are never emitted — only the kind of change.
+     */
+    eventId?: string;
 }
 export declare const CREATABLE_SELECT_CLASS_NAME_PREFIX = "MrlCreatableSelect";
 export declare const CREATABLE_SELECT_MENU_LIST_CLASS_NAME = "MrlCreatableSelect__menu-list";

package/dist/components/form/select/MrlMultiCreatableSelect/MrlMultiCreatableSelect.d.ts

@@ -14,6 +14,13 @@ export interface MrlMultiCreatableSelectProps<Option, IsMulti extends boolean =
      */
     ['data-qa']?: string;
     showClearIndicatorIcon?: boolean;
+    /**
+     * Enables interaction tracking for this select. Provide a stable, non-PII id
+     * (e.g. 'mural-tag-picker'). When omitted, the select emits no analytics.
+     *
+     * Note: option labels, values and created text are never emitted — only the kind of change.
+     */
+    eventId?: string;
 }
 export declare const MULTI_CREATABLE_SELECT_CLASS_NAME_PREFIX = "MrlMultiCreatableSelect";
 export declare const MULTI_CREATABLE_SELECT_MENU_LIST_CLASS_NAME = "MrlMultiCreatableSelect__menu-list";

package/dist/components/form/select/MrlMultiSelect/MrlMultiSelect.d.ts

@@ -12,6 +12,13 @@ export interface MrlMultiSelectProps<T, IsMulti extends boolean = false, Group e
      * - value-container, <data-qa-prefix>-value-container
      */
     ['data-qa']?: string;
+    /**
+     * Enables interaction tracking for this select. Provide a stable, non-PII id
+     * (e.g. 'invite-members-picker'). When omitted, the select emits no analytics.
+     *
+     * Note: option labels and values are never emitted — only the kind of change.
+     */
+    eventId?: string;
 }
 export declare const MULTI_SELECT_CLASS_NAME_PREFIX = "MrlMultiSelect";
 export declare const MULTI_SELECT_MENU_LIST_CLASS_NAME = "MrlMultiSelect__menu-list";

package/dist/components/form/select/MrlSelect/MrlSelect.d.ts

@@ -12,6 +12,13 @@ export interface MrlSelectProps<Option, IsMulti extends boolean = false, Group e
      * - value-container, <data-qa-prefix>-value-container
      */
     ['data-qa']?: string;
+    /**
+     * Enables interaction tracking for this select. Provide a stable, non-PII id
+     * (e.g. 'member-role-select'). When omitted, the select emits no analytics.
+     *
+     * Note: option labels and values are never emitted — only the kind of change.
+     */
+    eventId?: string;
 }
 export declare const SELECT_CLASS_NAME_PREFIX = "MrlSelect";
 export declare const SELECT_MENU_LIST_CLASS_NAME = "MrlSelect__menu-list";

package/dist/components/form/switch/MrlSwitch/MrlSwitch.d.ts

@@ -3,6 +3,11 @@ interface MrlSwitchProps extends React.ComponentPropsWithoutRef<'input'> {
     className?: string;
     disabled?: boolean;
     id?: string;
+    /**
+     * Enables interaction tracking for this switch. Provide a stable, non-PII id
+     * (e.g. 'workspace-sso-toggle'). When omitted, the switch emits no analytics.
+     */
+    eventId?: string;
     /**
      * The `label` is best used as a string, which will style according to MrlLabel styles.
      * If you need custom styles, you can use `className` or use a span that you style as `label`
@@ -11,5 +16,5 @@ interface MrlSwitchProps extends React.ComponentPropsWithoutRef<'input'> {
     onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     selected?: boolean;
 }
-export declare const MrlSwitch: React.MemoExoticComponent<({ className, disabled, id, label, onChange, selected, ...rest }: MrlSwitchProps) => React.JSX.Element>;
+export declare const MrlSwitch: React.MemoExoticComponent<({ className, disabled, id, label, onChange, selected, eventId, ...rest }: MrlSwitchProps) => React.JSX.Element>;
 export {};

package/dist/components/form/switch/MrlSwitchStandalone/MrlSwitchStandalone.d.ts

@@ -5,6 +5,11 @@ interface MrlSwitchStandaloneProps extends React.ComponentPropsWithoutRef<'input
     labelledBy?: string;
     onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     selected?: boolean;
+    /**
+     * Enables interaction tracking for this switch. Provide a stable, non-PII id
+     * (e.g. 'workspace-sso-toggle'). When omitted, the switch emits no analytics.
+     */
+    eventId?: string;
 }
-export declare const MrlSwitchStandalone: React.MemoExoticComponent<({ className, id, labelledBy, onChange, selected, ...rest }: MrlSwitchStandaloneProps) => React.JSX.Element>;
+export declare const MrlSwitchStandalone: React.MemoExoticComponent<({ className, id, labelledBy, onChange, selected, eventId, ...rest }: MrlSwitchStandaloneProps) => React.JSX.Element>;
 export {};

package/dist/components/form/text-input/MrlEditableTextInput/MrlEditableTextInput.d.ts

@@ -31,6 +31,14 @@ interface MrlEditableTextInputProps extends React.InputHTMLAttributes<HTMLInputE
      * @default false
      */
     showIconOnHover?: boolean;
+    /**
+     * Enables interaction tracking for this input. Provide a stable, non-PII id
+     * (e.g. 'mural-title'). When omitted, the input emits no analytics.
+     *
+     * Note: the input's value is never emitted, and `change` is emitted once per
+     * editing session (on blur, when the value actually changed) rather than per keystroke.
+     */
+    eventId?: string;
 }
 export declare const MrlEditableTextInput: React.ForwardRefExoticComponent<MrlEditableTextInputProps & React.RefAttributes<HTMLButtonElement>>;
 export {};