@muraldevkit/ui-toolkit 4.68.0-dev-NFbt.1 → 4.68.0-dev-nPeA.1

package/dist/esm/components/button/MrlIconButton/MrlIconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlIconButton.js","sources":["../../../../../src/components/button/MrlIconButton/MrlIconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport {\n\tbuttonDefaults,\n\tMrlButtonKind,\n\tMrlButtonSize,\n\tMrlGhostIconButtonSize,\n\tToggleAria\n} from '../constants';\nimport { _isDisabled, _isSelected, _isToggleButton, _spinnerProps } from '../helpers';\nimport { AttrsObject, MrlComponentProps, setAttributes, getUniqueId } from '../../../utils';\nimport {\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition,\n\tMrlTooltipVariant\n} from '../../tooltip/constants';\nimport { MrlButtonState, MrlSpinner, MrlTooltip, ToggleStyle } from '../../';\nimport { spinnerDefaults } from '../../loader/constants';\nimport './MrlIconButton.scss';\n\nexport interface MrlIconButtonProps\n\textends Omit<MrlComponentProps, 'style'>,\n\t\tReact.ComponentProps<'button'> {\n\t/**\n\t * Applies additional HTML attributes to the button element.\n\t * @deprecated\n\t */\n\tattrs?: AttrsObject;\n\t/**\n\t * Allow developers to add badge to buttons.\n\t */\n\tbadge?: React.ReactElement;\n\t/** Additional class to add to the button */\n\tclassName?: string;\n\t/**\n\t * Allows developers the ability to disable built in event listeners so they can manage user\n\t * interactions from the application.\n\t */\n\tdisableEvents?: boolean;\n\n\t/** Whether to disable the tooltip hover action that keeps it open */\n\tdisableTooltipHover?: boolean;\n\n\t/**\n\t * The icon that will be rendered.\n\t */\n\ticon: React.ReactElement;\n\t/**\n\t * Changes the visual emphasis of the button.\n\t *\n\t * Note: size=\"xsmall\" should ONLY be used with a kind of `ghost` or `ghost-inverse`.\n\t */\n\tkind?: MrlButtonKind;\n\t/**\n\t * Displays a spinner in the button to indicate some action is in progress.\n\t */\n\tloading?: boolean;\n\t/**\n\t * Text for the spinner when the button is in a loading state.\n\t */\n\tloadingText?: string;\n\n\t/**\n\t * onClick event for the button.\n\t */\n\tonClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * onKeyDown event for the button.\n\t */\n\tonKeyUp?: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * onMouseUp event for the button.\n\t */\n\tonMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * The placement of the tooltip in relation to the button.\n\t */\n\tposition?: MrlTooltipPosition;\n\t/**\n\t * Changes the size of the button so it can scale with its surrounding context.\n\t *\n\t * Note: size=\"xsmall\" should ONLY be used with a kind of `ghost` or `ghost-inverse`.\n\t */\n\tsize?: MrlButtonSize | MrlGhostIconButtonSize;\n\t/**\n\t * Changes the state of the button based on user permissions or actions.\n\t *\n\t * Note: The Basic Button does not fully support state=\"disabled\", use\n\t * the 'disabled' prop instead. Since it does not support state=\"disabled\",\n\t * it also doesn't not support state=\"selected-disabled\".\n\t */\n\tstate?: MrlButtonState;\n\t/**\n\t * The textual label describing the button's purpose/action.\n\t * Icon buttons require a text label to ensure accessibility.\n\t */\n\ttext: string;\n\t/**\n\t * The arrow position of the tooltip in relation to the button.\n\t */\n\ttipAnchor?: MrlTooltipAnchor;\n\n\t/**\n\t * Determines which aria setup to use for various toggle/selected styles.\n\t * pressed - use for an traditional “toggle button”\n\t * selected - use for tabs and custom select options\n\t * expanded - use for menus, panels, and popovers\n\t * checked - use for custom [radiobutton](https://www.w3.org/WAI/ARIA/apg/patterns/radiobutton/#wai-aria-roles-states-and-properties-16)\n\t * \t\tor [checkbox](https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/#wai-aria-roles-states-and-properties-5) inputs\n\t */\n\ttoggleAria?: ToggleAria;\n\t/**\n\t * Selected state variant when the button is a Toggle Button. The visual styles\n\t * are also impacted by the \"kind\" prop. Toggle buttons are only supported\n\t * when \"kind\" is set to either \"ghost\" or \"ghost-inverse\". Setting this prop\n\t * informs the component that this is a toggle button and to add that functionality\n\t */\n\ttoggleStyle?: ToggleStyle;\n\n\t/** tooltip varient kind */\n\ttooltipKind?: MrlTooltipVariant;\n\n\t/**\n\t * An optional class name to add to the tooltip wrapper.\n\t */\n\twrapperClassName?: string;\n\n\t/**\n\t * Controlled state that overrides the internal state management.\n\t * When provided, this takes precedence over the `state` prop and allows\n\t * the parent component to fully control the icon button's state.\n\t */\n\tcontrolledState?: MrlButtonState;\n}\n\nexport const MrlIconButton = React.forwardRef<HTMLButtonElement, MrlIconButtonProps>(\n\tfunction MrlIconButton(\n\t\t{\n\t\t\t['aria-label']: ariaLabel,\n\t\t\tattrs = {},\n\t\t\tbadge,\n\t\t\tclassName,\n\t\t\tdisableEvents = false,\n\t\t\tdisableTooltipHover = false,\n\t\t\ticon,\n\t\t\t// We intentionally deviate from the basic button for icon-buttons since the vast\n\t\t\t// majority of icon buttons are ghost buttons. The proptype remains\n\t\t\t// consistent with the basic button however to keep our code DRY.\n\t\t\tkind = 'ghost',\n\t\t\tloading = false,\n\t\t\tloadingText = spinnerDefaults.text,\n\t\t\tonClick,\n\t\t\tonKeyUp,\n\t\t\tonMouseUp,\n\t\t\tposition = MrlTooltipDefaults.position,\n\t\t\ttoggleAria = buttonDefaults.toggleAria,\n\t\t\ttoggleStyle,\n\t\t\ttext,\n\t\t\ttipAnchor = MrlTooltipDefaults.anchor,\n\t\t\ttooltipKind = 'default',\n\t\t\tsize = buttonDefaults.size,\n\t\t\tstate = buttonDefaults.state,\n\t\t\twrapperClassName,\n\t\t\tcontrolledState,\n\t\t\t...remainingProps\n\t\t}: MrlIconButtonProps,\n\t\tref\n\t) {\n\t\t/**\n\t\t * Determine the effective button state.\n\t\t * Uses controlledState if provided (controlled mode),\n\t\t * otherwise falls back to the state prop (uncontrolled mode).\n\t\t * This allows the component to work in both controlled and uncontrolled scenarios.\n\t\t */\n\t\tconst effectiveButtonState = controlledState ?? state;\n\n\t\tconst [isSelected, setIsSelected] = React.useState(() => _isSelected(effectiveButtonState));\n\n\t\tconst buttonRef = React.useRef<HTMLButtonElement>(null);\n\t\tReact.useImperativeHandle<HTMLButtonElement | null, HTMLButtonElement | null>(\n\t\t\tref,\n\t\t\t() => buttonRef.current\n\t\t);\n\n\t\t/**\n\t\t * MrlIconButton could behave as a toggle button if toggleStyle is 'default' or 'secondary'\n\t\t */\n\t\tconst isToggleButton = toggleStyle && _isToggleButton(toggleStyle);\n\n\t\t/**\n\t\t * We need to watch the value of state to keep in sync\n\t\t * the value of state passed as props and the internal\n\t\t * isSelected piece of state.\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\t// allows consumers to set the 'selected' or 'selected-disabled' state from a parent component.\n\t\t\tsetIsSelected(_isSelected(effectiveButtonState));\n\t\t}, [effectiveButtonState]);\n\n\t\t/**\n\t\t * Handle onClick events\n\t\t * @param {React.MouseEvent<HTMLButtonElement>} e - mouse event\n\t\t */\n\t\tfunction handleOnClick(e: React.MouseEvent<HTMLButtonElement>) {\n\t\t\te.stopPropagation();\n\n\t\t\tif (_isDisabled(effectiveButtonState, loading) || disableEvents) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (isToggleButton && !controlledState) {\n\t\t\t\tsetIsSelected((prevIsSelected) => !prevIsSelected);\n\t\t\t}\n\n\t\t\tif (onClick && typeof onClick === 'function') {\n\t\t\t\tonClick(e);\n\t\t\t}\n\t\t}\n\n\t\tconst classNames = classnames(\n\t\t\t'mrlIconButton',\n\t\t\t`mrlIconButton--${size}`,\n\t\t\t`mrlIconButton--${kind}`,\n\t\t\tisToggleButton && toggleStyle && `toggleStyle--${toggleStyle}`,\n\t\t\tattrs.class || attrs.className,\n\t\t\tclassName\n\t\t);\n\n\t\tdelete attrs.class;\n\t\tdelete attrs.className;\n\n\t\tconst getAriaLabel = (): string => {\n\t\t\t// Set loading text if loading\n\t\t\tif (loading) return `${loadingText} ${text}`;\n\n\t\t\t// Only set aria-label if we have actual content\n\t\t\tconst hasAriaLabel = ariaLabel && ariaLabel.trim() !== '';\n\n\t\t\t// If we have a custom ariaLabel, override the default text\n\t\t\tif (hasAriaLabel) return ariaLabel;\n\n\t\t\t// Fallback to icon button text\n\t\t\treturn text;\n\t\t};\n\n\t\tconst ariaLabelValue = getAriaLabel();\n\n\t\tconst attributes = setAttributes(attrs, {\n\t\t\t'aria-disabled': _isDisabled(effectiveButtonState, loading),\n\t\t\t'aria-label': ariaLabelValue,\n\t\t\t...(isToggleButton && { [`aria-${toggleAria}`]: isSelected || false }),\n\t\t\ttype: 'button'\n\t\t});\n\n\t\t// MrlSvg should always have size=\"auto\"\n\t\tconst iconWithSizeAuto = React.useMemo(\n\t\t\t() =>\n\t\t\t\tReact.cloneElement(icon, {\n\t\t\t\t\tsize: 'auto'\n\t\t\t\t}),\n\t\t\t[icon]\n\t\t);\n\n\t\tconst spinnerProps = _spinnerProps(kind, size);\n\t\tconst spinner = <MrlSpinner kind={spinnerProps.kind} size={spinnerProps.size} />;\n\n\t\tconst dataQaProp = (remainingProps as { 'data-qa'?: string })['data-qa'];\n\t\tconst tooltipQa = dataQaProp ? `${dataQaProp}-tooltip` : getUniqueId('tooltip');\n\t\tconst tooltipContentClass =\n\t\t\tsize === 'xsmall' || size === 'small' ? `mrlIconButton--${size}-wrapper` : undefined;\n\n\t\treturn (\n\t\t\t<MrlTooltip\n\t\t\t\tanchor={tipAnchor}\n\t\t\t\tdataQa={tooltipQa}\n\t\t\t\tkind={tooltipKind}\n\t\t\t\tposition={position}\n\t\t\t\ttext={text}\n\t\t\t\ttooltipClass={classnames('mrlIconButton-wrapper', wrapperClassName)}\n\t\t\t\ttooltipContentClass={tooltipContentClass}\n\t\t\t\tdisableTooltipHover={disableTooltipHover}\n\t\t\t\tsrAnnouncement={false}\n\t\t\t>\n\t\t\t\t<button\n\t\t\t\t\t{...attributes}\n\t\t\t\t\t{...remainingProps}\n\t\t\t\t\tclassName={classNames}\n\t\t\t\t\tref={buttonRef}\n\t\t\t\t\tonClick={handleOnClick}\n\t\t\t\t\tonKeyUp={onKeyUp}\n\t\t\t\t\tonMouseUp={onMouseUp}\n\t\t\t\t>\n\t\t\t\t\t{loading ? spinner : iconWithSizeAuto}\n\t\t\t\t\t{badge}\n\t\t\t\t</button>\n\t\t\t</MrlTooltip>\n\t\t);\n\t}\n);\n"],"names":["MrlIconButton","React","forwardRef","_ref","ref","ariaLabel","_ref$attrs","attrs","badge","className","_ref$disableEvents","disableEvents","_ref$disableTooltipHo","disableTooltipHover","icon","_ref$kind","kind","_ref$loading","loading","_ref$loadingText","loadingText","spinnerDefaults","text","onClick","onKeyUp","onMouseUp","_ref$position","position","MrlTooltipDefaults","_ref$toggleAria","toggleAria","buttonDefaults","toggleStyle","_ref$tipAnchor","tipAnchor","anchor","_ref$tooltipKind","tooltipKind","_ref$size","size","_ref$state","state","wrapperClassName","controlledState","remainingProps","_objectWithoutProperties","_excluded","effectiveButtonState","_React$useState","useState","_isSelected","_React$useState2","_slicedToArray","isSelected","setIsSelected","buttonRef","useRef","useImperativeHandle","current","isToggleButton","_isToggleButton","useEffect","handleOnClick","e","stopPropagation","_isDisabled","prevIsSelected","classNames","classnames","concat","getAriaLabel","hasAriaLabel","trim","ariaLabelValue","attributes","setAttributes","_objectSpread","_defineProperty","type","iconWithSizeAuto","useMemo","cloneElement","spinnerProps","_spinnerProps","spinner","createElement","MrlSpinner","dataQaProp","tooltipQa","getUniqueId","tooltipContentClass","undefined","MrlTooltip","dataQa","tooltipClass","srAnnouncement","_extends"],"mappings":"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"}
+{"version":3,"file":"MrlIconButton.js","sources":["../../../../../src/components/button/MrlIconButton/MrlIconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport {\n\tbuttonDefaults,\n\tMrlButtonKind,\n\tMrlButtonSize,\n\tMrlGhostIconButtonSize,\n\tToggleAria\n} from '../constants';\nimport { _isDisabled, _isSelected, _isToggleButton, _spinnerProps } from '../helpers';\nimport { AttrsObject, MrlComponentProps, setAttributes, getUniqueId } from '../../../utils';\nimport {\n\tMrlTooltipAnchor,\n\tMrlTooltipDefaults,\n\tMrlTooltipPosition,\n\tMrlTooltipVariant\n} from '../../tooltip/constants';\nimport { MrlButtonState, MrlSpinner, MrlTooltip, ToggleStyle } from '../../';\nimport { spinnerDefaults } from '../../loader/constants';\nimport './MrlIconButton.scss';\n\nexport interface MrlIconButtonProps\n\textends Omit<MrlComponentProps, 'style'>,\n\t\tReact.ComponentProps<'button'> {\n\t/**\n\t * Applies additional HTML attributes to the button element.\n\t * @deprecated\n\t */\n\tattrs?: AttrsObject;\n\t/**\n\t * Allow developers to add badge to buttons.\n\t */\n\tbadge?: React.ReactElement;\n\t/** Additional class to add to the button */\n\tclassName?: string;\n\t/**\n\t * Allows developers the ability to disable built in event listeners so they can manage user\n\t * interactions from the application.\n\t */\n\tdisableEvents?: boolean;\n\n\t/** Whether to disable the tooltip hover action that keeps it open */\n\tdisableTooltipHover?: boolean;\n\n\t/**\n\t * The icon that will be rendered.\n\t */\n\ticon: React.ReactElement;\n\t/**\n\t * Changes the visual emphasis of the button.\n\t *\n\t * Note: size=\"xsmall\" should ONLY be used with a kind of `ghost` or `ghost-inverse`.\n\t */\n\tkind?: MrlButtonKind;\n\t/**\n\t * Displays a spinner in the button to indicate some action is in progress.\n\t */\n\tloading?: boolean;\n\t/**\n\t * Text for the spinner when the button is in a loading state.\n\t */\n\tloadingText?: string;\n\n\t/**\n\t * onClick event for the button.\n\t */\n\tonClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * onKeyDown event for the button.\n\t */\n\tonKeyUp?: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * onMouseUp event for the button.\n\t */\n\tonMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n\n\t/**\n\t * The placement of the tooltip in relation to the button.\n\t */\n\tposition?: MrlTooltipPosition;\n\t/**\n\t * Changes the size of the button so it can scale with its surrounding context.\n\t *\n\t * Note: size=\"xsmall\" should ONLY be used with a kind of `ghost` or `ghost-inverse`.\n\t */\n\tsize?: MrlButtonSize | MrlGhostIconButtonSize;\n\t/**\n\t * Changes the state of the button based on user permissions or actions.\n\t *\n\t * Note: The Basic Button does not fully support state=\"disabled\", use\n\t * the 'disabled' prop instead. Since it does not support state=\"disabled\",\n\t * it also doesn't not support state=\"selected-disabled\".\n\t */\n\tstate?: MrlButtonState;\n\t/**\n\t * The textual label describing the button's purpose/action.\n\t * Icon buttons require a text label to ensure accessibility.\n\t */\n\ttext: string;\n\t/**\n\t * The arrow position of the tooltip in relation to the button.\n\t */\n\ttipAnchor?: MrlTooltipAnchor;\n\n\t/**\n\t * Determines which aria setup to use for various toggle/selected styles.\n\t * pressed - use for an traditional “toggle button”\n\t * selected - use for tabs and custom select options\n\t * expanded - use for menus, panels, and popovers\n\t * checked - use for custom [radiobutton](https://www.w3.org/WAI/ARIA/apg/patterns/radiobutton/#wai-aria-roles-states-and-properties-16)\n\t * \t\tor [checkbox](https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/#wai-aria-roles-states-and-properties-5) inputs\n\t */\n\ttoggleAria?: ToggleAria;\n\t/**\n\t * Selected state variant when the button is a Toggle Button. The visual styles\n\t * are also impacted by the \"kind\" prop. Toggle buttons are only supported\n\t * when \"kind\" is set to either \"ghost\" or \"ghost-inverse\". Setting this prop\n\t * informs the component that this is a toggle button and to add that functionality\n\t */\n\ttoggleStyle?: ToggleStyle;\n\n\t/** tooltip varient kind */\n\ttooltipKind?: MrlTooltipVariant;\n\n\t/**\n\t * An optional class name to add to the tooltip wrapper.\n\t */\n\twrapperClassName?: string;\n\n\t/**\n\t * Controlled state that overrides the internal state management.\n\t * When provided, this takes precedence over the `state` prop and allows\n\t * the parent component to fully control the icon button's state.\n\t */\n\tcontrolledState?: MrlButtonState;\n}\n\nexport const MrlIconButton = React.forwardRef<HTMLButtonElement, MrlIconButtonProps>(\n\tfunction MrlIconButton(\n\t\t{\n\t\t\t['aria-label']: ariaLabel,\n\t\t\tattrs = {},\n\t\t\tbadge,\n\t\t\tclassName,\n\t\t\tdisableEvents = false,\n\t\t\tdisableTooltipHover = false,\n\t\t\ticon,\n\t\t\t// We intentionally deviate from the basic button for icon-buttons since the vast\n\t\t\t// majority of icon buttons are ghost buttons. The proptype remains\n\t\t\t// consistent with the basic button however to keep our code DRY.\n\t\t\tkind = 'ghost',\n\t\t\tloading = false,\n\t\t\tloadingText = spinnerDefaults.text,\n\t\t\tonClick,\n\t\t\tonKeyUp,\n\t\t\tonMouseUp,\n\t\t\tposition = MrlTooltipDefaults.position,\n\t\t\ttoggleAria = buttonDefaults.toggleAria,\n\t\t\ttoggleStyle,\n\t\t\ttext,\n\t\t\ttipAnchor = MrlTooltipDefaults.anchor,\n\t\t\ttooltipKind = 'default',\n\t\t\tsize = buttonDefaults.size,\n\t\t\tstate = buttonDefaults.state,\n\t\t\twrapperClassName,\n\t\t\tcontrolledState,\n\t\t\t...remainingProps\n\t\t}: MrlIconButtonProps,\n\t\tref\n\t) {\n\t\t/**\n\t\t * Determine the effective button state.\n\t\t * Uses controlledState if provided (controlled mode),\n\t\t * otherwise falls back to the state prop (uncontrolled mode).\n\t\t * This allows the component to work in both controlled and uncontrolled scenarios.\n\t\t */\n\t\tconst effectiveButtonState = controlledState ?? state;\n\n\t\tconst [isSelected, setIsSelected] = React.useState(() => _isSelected(effectiveButtonState));\n\n\t\tconst buttonRef = React.useRef<HTMLButtonElement>(null);\n\t\tReact.useImperativeHandle<HTMLButtonElement | null, HTMLButtonElement | null>(\n\t\t\tref,\n\t\t\t() => buttonRef.current\n\t\t);\n\n\t\t/**\n\t\t * MrlIconButton could behave as a toggle button if toggleStyle is 'default' or 'secondary'\n\t\t */\n\t\tconst isToggleButton = toggleStyle && _isToggleButton(toggleStyle);\n\n\t\t/**\n\t\t * We need to watch the value of state to keep in sync\n\t\t * the value of state passed as props and the internal\n\t\t * isSelected piece of state.\n\t\t */\n\t\tReact.useEffect(() => {\n\t\t\t// allows consumers to set the 'selected' or 'selected-disabled' state from a parent component.\n\t\t\tsetIsSelected(_isSelected(effectiveButtonState));\n\t\t}, [effectiveButtonState]);\n\n\t\t/**\n\t\t * Handle onClick events\n\t\t * @param {React.MouseEvent<HTMLButtonElement>} e - mouse event\n\t\t */\n\t\tfunction handleOnClick(e: React.MouseEvent<HTMLButtonElement>) {\n\t\t\te.stopPropagation();\n\n\t\t\tif (_isDisabled(effectiveButtonState, loading) || disableEvents) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (isToggleButton && !controlledState) {\n\t\t\t\tsetIsSelected((prevIsSelected) => !prevIsSelected);\n\t\t\t}\n\n\t\t\tif (onClick && typeof onClick === 'function') {\n\t\t\t\tonClick(e);\n\t\t\t}\n\t\t}\n\n\t\tconst classNames = classnames(\n\t\t\t'mrlIconButton',\n\t\t\t`mrlIconButton--${size}`,\n\t\t\t`mrlIconButton--${kind}`,\n\t\t\tisToggleButton && toggleStyle && `toggleStyle--${toggleStyle}`,\n\t\t\tattrs.class || attrs.className,\n\t\t\tclassName\n\t\t);\n\n\t\tdelete attrs.class;\n\t\tdelete attrs.className;\n\n\t\tconst getAriaLabel = (): string => {\n\t\t\t// Set loading text if loading\n\t\t\tif (loading) return `${loadingText} ${text}`;\n\n\t\t\t// Only set aria-label if we have actual content\n\t\t\tconst hasAriaLabel = ariaLabel && ariaLabel.trim() !== '';\n\n\t\t\t// If we have a custom ariaLabel, override the default text\n\t\t\tif (hasAriaLabel) return ariaLabel;\n\n\t\t\t// Fallback to icon button text\n\t\t\treturn text;\n\t\t};\n\n\t\tconst ariaLabelValue = getAriaLabel();\n\n\t\tconst attributes = setAttributes(attrs, {\n\t\t\t'aria-disabled': _isDisabled(effectiveButtonState, loading),\n\t\t\t'aria-label': ariaLabelValue,\n\t\t\t...(isToggleButton && { [`aria-${toggleAria}`]: isSelected || false }),\n\t\t\ttype: 'button'\n\t\t});\n\n\t\t// MrlSvg should always have size=\"auto\"\n\t\tconst iconWithSizeAuto = React.useMemo(\n\t\t\t() =>\n\t\t\t\tReact.cloneElement(icon, {\n\t\t\t\t\tsize: 'auto'\n\t\t\t\t}),\n\t\t\t[icon]\n\t\t);\n\n\t\tconst spinnerProps = _spinnerProps(kind, size);\n\t\tconst spinner = <MrlSpinner kind={spinnerProps.kind} size={spinnerProps.size} />;\n\n\t\tconst dataQaProp = (remainingProps as { 'data-qa'?: string })['data-qa'];\n\t\tconst tooltipQa = dataQaProp ? `${dataQaProp}-tooltip` : getUniqueId('tooltip');\n\t\tconst tooltipContentClass =\n\t\t\tsize === 'xsmall' || size === 'small' ? `mrlIconButton--${size}-wrapper` : undefined;\n\n\t\treturn (\n\t\t\t<MrlTooltip\n\t\t\t\tanchor={tipAnchor}\n\t\t\t\tdataQa={tooltipQa}\n\t\t\t\tkind={tooltipKind}\n\t\t\t\tposition={position}\n\t\t\t\ttext={text}\n\t\t\t\ttooltipClass={classnames('mrlIconButton-wrapper', wrapperClassName)}\n\t\t\t\ttooltipContentClass={tooltipContentClass}\n\t\t\t\tdisableTooltipHover={disableTooltipHover}\n\t\t\t\tsrAnnouncement={false}\n\t\t\t>\n\t\t\t\t<button\n\t\t\t\t\t{...attributes}\n\t\t\t\t\t{...remainingProps}\n\t\t\t\t\tclassName={classNames}\n\t\t\t\t\tref={buttonRef}\n\t\t\t\t\tonClick={handleOnClick}\n\t\t\t\t\tonKeyUp={onKeyUp}\n\t\t\t\t\tonMouseUp={onMouseUp}\n\t\t\t\t>\n\t\t\t\t\t{loading ? spinner : iconWithSizeAuto}\n\t\t\t\t\t{badge}\n\t\t\t\t</button>\n\t\t\t</MrlTooltip>\n\t\t);\n\t}\n);\n"],"names":["MrlIconButton","React","forwardRef","_ref","ref","ariaLabel","_ref$attrs","attrs","badge","className","_ref$disableEvents","disableEvents","_ref$disableTooltipHo","disableTooltipHover","icon","_ref$kind","kind","_ref$loading","loading","_ref$loadingText","loadingText","spinnerDefaults","text","onClick","onKeyUp","onMouseUp","_ref$position","position","MrlTooltipDefaults","_ref$toggleAria","toggleAria","buttonDefaults","toggleStyle","_ref$tipAnchor","tipAnchor","anchor","_ref$tooltipKind","tooltipKind","_ref$size","size","_ref$state","state","wrapperClassName","controlledState","remainingProps","_objectWithoutProperties","_excluded","effectiveButtonState","_React$useState","useState","_isSelected","_React$useState2","_slicedToArray","isSelected","setIsSelected","buttonRef","useRef","useImperativeHandle","current","isToggleButton","_isToggleButton","useEffect","handleOnClick","e","stopPropagation","_isDisabled","prevIsSelected","classNames","classnames","concat","class","getAriaLabel","hasAriaLabel","trim","ariaLabelValue","attributes","setAttributes","_objectSpread","type","iconWithSizeAuto","useMemo","cloneElement","spinnerProps","_spinnerProps","spinner","createElement","MrlSpinner","dataQaProp","tooltipQa","getUniqueId","tooltipContentClass","undefined","MrlTooltip","dataQa","tooltipClass","srAnnouncement","_extends"],"mappings":";;;;;;;;;;;;AA2IO,IAAMA,aAAa,gBAAGC,KAAK,CAACC,UAAU,CAC5C,SAASF,aAAaA,CAAAG,IAAA,EA8BrBC,GAAG,EACF;AAAA,EAAA,IA7BgBC,SAAS,GAAAF,IAAA,CAAxB,YAAY,CAAA;IAAAG,UAAA,GAAAH,IAAA,CACbI,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,UAAA;IACVE,KAAK,GAAAL,IAAA,CAALK,KAAK;IACLC,SAAS,GAAAN,IAAA,CAATM,SAAS;IAAAC,kBAAA,GAAAP,IAAA,CACTQ,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,kBAAA;IAAAE,qBAAA,GAAAT,IAAA,CACrBU,mBAAmB;AAAnBA,IAAAA,mBAAmB,GAAAD,qBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,qBAAA;IAC3BE,IAAI,GAAAX,IAAA,CAAJW,IAAI;IAAAC,SAAA,GAAAZ,IAAA,CAIJa,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,MAAA,GAAG,OAAO,GAAAA,SAAA;IAAAE,YAAA,GAAAd,IAAA,CACde,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,YAAA;IAAAE,gBAAA,GAAAhB,IAAA,CACfiB,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAA,MAAA,GAAGE,eAAe,CAACC,IAAI,GAAAH,gBAAA;IAClCI,OAAO,GAAApB,IAAA,CAAPoB,OAAO;IACPC,OAAO,GAAArB,IAAA,CAAPqB,OAAO;IACPC,SAAS,GAAAtB,IAAA,CAATsB,SAAS;IAAAC,aAAA,GAAAvB,IAAA,CACTwB,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,aAAA,KAAA,MAAA,GAAGE,kBAAkB,CAACD,QAAQ,GAAAD,aAAA;IAAAG,eAAA,GAAA1B,IAAA,CACtC2B,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAA,MAAA,GAAGE,cAAc,CAACD,UAAU,GAAAD,eAAA;IACtCG,WAAW,GAAA7B,IAAA,CAAX6B,WAAW;IACXV,IAAI,GAAAnB,IAAA,CAAJmB,IAAI;IAAAW,cAAA,GAAA9B,IAAA,CACJ+B,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAA,MAAA,GAAGL,kBAAkB,CAACO,MAAM,GAAAF,cAAA;IAAAG,gBAAA,GAAAjC,IAAA,CACrCkC,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAA,MAAA,GAAG,SAAS,GAAAA,gBAAA;IAAAE,SAAA,GAAAnC,IAAA,CACvBoC,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,MAAA,GAAGP,cAAc,CAACQ,IAAI,GAAAD,SAAA;IAAAE,UAAA,GAAArC,IAAA,CAC1BsC,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAA,MAAA,GAAGT,cAAc,CAACU,KAAK,GAAAD,UAAA;IAC5BE,gBAAgB,GAAAvC,IAAA,CAAhBuC,gBAAgB;IAChBC,eAAe,GAAAxC,IAAA,CAAfwC,eAAe;AACZC,IAAAA,cAAc,GAAAC,wBAAA,CAAA1C,IAAA,EAAA2C,SAAA,CAAA;AAIlB;AACF;AACA;AACA;AACA;AACA;EACE,IAAMC,oBAAoB,GAAGJ,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAA,MAAA,GAAfA,eAAe,GAAIF,KAAK;EAErD,IAAAO,eAAA,GAAoC/C,KAAK,CAACgD,QAAQ,CAAC,MAAMC,WAAW,CAACH,oBAAoB,CAAC,CAAC;IAAAI,gBAAA,GAAAC,cAAA,CAAAJ,eAAA,EAAA,CAAA,CAAA;AAApFK,IAAAA,UAAU,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,aAAa,GAAAH,gBAAA,CAAA,CAAA,CAAA;AAEhC,EAAA,IAAMI,SAAS,GAAGtD,KAAK,CAACuD,MAAM,CAAoB,IAAI,CAAC;EACvDvD,KAAK,CAACwD,mBAAmB,CACxBrD,GAAG,EACH,MAAMmD,SAAS,CAACG,OACjB,CAAC;;AAED;AACF;AACA;AACE,EAAA,IAAMC,cAAc,GAAG3B,WAAW,IAAI4B,eAAe,CAAC5B,WAAW,CAAC;;AAElE;AACF;AACA;AACA;AACA;EACE/B,KAAK,CAAC4D,SAAS,CAAC,MAAM;AACrB;AACAP,IAAAA,aAAa,CAACJ,WAAW,CAACH,oBAAoB,CAAC,CAAC;AACjD,EAAA,CAAC,EAAE,CAACA,oBAAoB,CAAC,CAAC;;AAE1B;AACF;AACA;AACA;EACE,SAASe,aAAaA,CAACC,CAAsC,EAAE;IAC9DA,CAAC,CAACC,eAAe,EAAE;IAEnB,IAAIC,WAAW,CAAClB,oBAAoB,EAAE7B,OAAO,CAAC,IAAIP,aAAa,EAAE;AAChE,MAAA;AACD,IAAA;AAEA,IAAA,IAAIgD,cAAc,IAAI,CAAChB,eAAe,EAAE;AACvCW,MAAAA,aAAa,CAAEY,cAAc,IAAK,CAACA,cAAc,CAAC;AACnD,IAAA;AAEA,IAAA,IAAI3C,OAAO,IAAI,OAAOA,OAAO,KAAK,UAAU,EAAE;MAC7CA,OAAO,CAACwC,CAAC,CAAC;AACX,IAAA;AACD,EAAA;AAEA,EAAA,IAAMI,UAAU,GAAGC,UAAU,CAC5B,eAAe,EAAA,iBAAA,CAAAC,MAAA,CACG9B,IAAI,CAAA,EAAA,iBAAA,CAAA8B,MAAA,CACJrD,IAAI,GACtB2C,cAAc,IAAI3B,WAAW,IAAA,eAAA,CAAAqC,MAAA,CAAoBrC,WAAW,CAAE,EAC9DzB,KAAK,CAAC+D,KAAK,IAAI/D,KAAK,CAACE,SAAS,EAC9BA,SACD,CAAC;EAED,OAAOF,KAAK,CAAC+D,KAAK;EAClB,OAAO/D,KAAK,CAACE,SAAS;EAEtB,IAAM8D,YAAY,GAAGA,MAAc;AAClC;IACA,IAAIrD,OAAO,EAAE,OAAA,EAAA,CAAAmD,MAAA,CAAUjD,WAAW,EAAA,GAAA,CAAA,CAAAiD,MAAA,CAAI/C,IAAI,CAAA;;AAE1C;IACA,IAAMkD,YAAY,GAAGnE,SAAS,IAAIA,SAAS,CAACoE,IAAI,EAAE,KAAK,EAAE;;AAEzD;IACA,IAAID,YAAY,EAAE,OAAOnE,SAAS;;AAElC;AACA,IAAA,OAAOiB,IAAI;EACZ,CAAC;AAED,EAAA,IAAMoD,cAAc,GAAGH,YAAY,EAAE;EAErC,IAAMI,UAAU,GAAGC,aAAa,CAACrE,KAAK,EAAAsE,cAAA,CAAAA,cAAA,CAAA;AACrC,IAAA,eAAe,EAAEZ,WAAW,CAAClB,oBAAoB,EAAE7B,OAAO,CAAC;AAC3D,IAAA,YAAY,EAAEwD;AAAc,GAAA,EACxBf,cAAc,IAAI;AAAE,IAAA,CAAA,OAAA,CAAAU,MAAA,CAASvC,UAAU,CAAA,GAAKuB,UAAU,IAAI;GAAO,CAAA,EAAA,EAAA,EAAA;AACrEyB,IAAAA,IAAI,EAAE;AAAQ,GAAA,CACd,CAAC;;AAEF;AACA,EAAA,IAAMC,gBAAgB,GAAG9E,KAAK,CAAC+E,OAAO,CACrC,mBACC/E,KAAK,CAACgF,YAAY,CAACnE,IAAI,EAAE;AACxByB,IAAAA,IAAI,EAAE;AACP,GAAC,CAAC,EACH,CAACzB,IAAI,CACN,CAAC;AAED,EAAA,IAAMoE,YAAY,GAAGC,aAAa,CAACnE,IAAI,EAAEuB,IAAI,CAAC;AAC9C,EAAA,IAAM6C,OAAO,gBAAGnF,KAAA,CAAAoF,aAAA,CAACC,UAAU,EAAA;IAACtE,IAAI,EAAEkE,YAAY,CAAClE,IAAK;IAACuB,IAAI,EAAE2C,YAAY,CAAC3C;AAAK,GAAE,CAAC;AAEhF,EAAA,IAAMgD,UAAU,GAAI3C,cAAc,CAA4B,SAAS,CAAC;EACxE,IAAM4C,SAAS,GAAGD,UAAU,GAAA,EAAA,CAAAlB,MAAA,CAAMkB,UAAU,EAAA,UAAA,CAAA,GAAaE,WAAW,CAAC,SAAS,CAAC;AAC/E,EAAA,IAAMC,mBAAmB,GACxBnD,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,OAAO,GAAA,iBAAA,CAAA8B,MAAA,CAAqB9B,IAAI,gBAAaoD,SAAS;AAErF,EAAA,oBACC1F,KAAA,CAAAoF,aAAA,CAACO,UAAU,EAAA;AACVzD,IAAAA,MAAM,EAAED,SAAU;AAClB2D,IAAAA,MAAM,EAAEL,SAAU;AAClBxE,IAAAA,IAAI,EAAEqB,WAAY;AAClBV,IAAAA,QAAQ,EAAEA,QAAS;AACnBL,IAAAA,IAAI,EAAEA,IAAK;AACXwE,IAAAA,YAAY,EAAE1B,UAAU,CAAC,uBAAuB,EAAE1B,gBAAgB,CAAE;AACpEgD,IAAAA,mBAAmB,EAAEA,mBAAoB;AACzC7E,IAAAA,mBAAmB,EAAEA,mBAAoB;AACzCkF,IAAAA,cAAc,EAAE;GAAM,eAEtB9F,KAAA,CAAAoF,aAAA,CAAA,QAAA,EAAAW,QAAA,CAAA,EAAA,EACKrB,UAAU,EACV/B,cAAc,EAAA;AAClBnC,IAAAA,SAAS,EAAE0D,UAAW;AACtB/D,IAAAA,GAAG,EAAEmD,SAAU;AACfhC,IAAAA,OAAO,EAAEuC,aAAc;AACvBtC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,SAAS,EAAEA;GAAU,CAAA,EAEpBP,OAAO,GAAGkE,OAAO,GAAGL,gBAAgB,EACpCvE,KACM,CACG,CAAC;AAEf,CACD;;;;"}

package/dist/esm/components/button/MrlProcessingButton/MrlProcessingButton.js

@@ -33,19 +33,19 @@ function MrlProcessingButton(props) {
     currentState = _React$useState2[0],
     setCurrentState = _React$useState2[1];
   var timeoutRef = React.useRef(null);
-  var handleClick = function handleClick() {
+  var handleClick = () => {
     if (currentState === 'processing') return;
     setCurrentState('processing');
   };
   var feedbackTime = (_processingButtonConf = processingButtonConfig.processing.feedbackTime) !== null && _processingButtonConf !== void 0 ? _processingButtonConf : DEFAULT_FEEDBACK_TIME;
-  var executeAction = React.useCallback(function () {
-    processingButtonConfig.processing.action().then(function () {
+  var executeAction = React.useCallback(() => {
+    processingButtonConfig.processing.action().then(() => {
       if (processingButtonConfig.success) {
         setCurrentState('success');
       } else {
         setCurrentState('normal');
       }
-    })["catch"](function () {
+    }).catch(() => {
       if (processingButtonConfig.error) {
         setCurrentState('error');
       } else {
@@ -53,19 +53,19 @@ function MrlProcessingButton(props) {
       }
     });
   }, [processingButtonConfig.error, processingButtonConfig.processing, processingButtonConfig.success]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     switch (currentState) {
       case 'processing':
         timeoutRef.current = setTimeout(executeAction, feedbackTime);
         break;
       case 'success':
       case 'error':
-        timeoutRef.current = setTimeout(function () {
+        timeoutRef.current = setTimeout(() => {
           setCurrentState('normal');
         }, resetTime);
         break;
     }
-    return function () {
+    return () => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
       }

package/dist/esm/components/button/MrlProcessingButton/MrlProcessingButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlProcessingButton.js","sources":["../../../../../src/components/button/MrlProcessingButton/MrlProcessingButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlButtonProps, MrlButton } from '../MrlButton';\nimport { DSIconType, MrlSvg } from '../../svg';\nimport { DataQa } from '../../../utils/dataQa';\nimport { placeholder } from '@muraldevkit/ds-icons';\nimport { MrlLiveRegion } from '../../live-region';\nimport styles from './MrlProcessingButton.module.scss';\n\nexport const DEFAULT_RESET_TIME = 4000;\nexport const DEFAULT_FEEDBACK_TIME = 500;\n\nexport type PossibleState = 'normal' | 'processing' | 'success' | 'error';\n\nexport type MrlProcessingButtonConfig = {\n\tnormal: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n\tprocessing: {\n\t\taction: () => Promise<void>;\n\t\t/**\n\t\t * The minimum time to show the processing state before executing the action.\n\t\t * This provides visual feedback to users that their action was registered.\n\t\t */\n\t\tfeedbackTime?: number;\n\t\ttext?: string;\n\t};\n\tsuccess?: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n\terror?: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n};\n\nexport interface MrlProcessingButtonProps extends Omit<MrlButtonProps, 'ref' | 'text'>, DataQa {\n\t/**\n\t * The configuration for the processing button.\n\t */\n\tprocessingButtonConfig: MrlProcessingButtonConfig;\n\t/**\n\t * The time to wait before resetting the button to the normal state.\n\t */\n\tresetTime?: number;\n}\n\n/**\n * A specialized button component that provides visual feedback during processing operations.\n *\n * The MrlProcessingButton extends the standard MrlButton with additional processing state\n * management and user feedback capabilities. It automatically handles the transition between\n * normal, loading, and completion states to provide clear visual feedback to users.\n *\n * @param props - The component props extending MrlButtonProps with additional processing capabilities\n * @returns a MrlProcessingButton React component\n */\nexport function MrlProcessingButton(props: MrlProcessingButtonProps) {\n\tconst {\n\t\t['data-qa']: dataQa,\n\t\tprocessingButtonConfig,\n\t\tresetTime = DEFAULT_RESET_TIME,\n\t\tclassName,\n\t\t...buttonProps\n\t} = props;\n\n\tconst [currentState, setCurrentState] = React.useState<PossibleState>('normal');\n\tconst timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n\n\tconst handleClick = () => {\n\t\tif (currentState === 'processing') return;\n\t\tsetCurrentState('processing');\n\t};\n\n\tconst feedbackTime = processingButtonConfig.processing.feedbackTime ?? DEFAULT_FEEDBACK_TIME;\n\n\tconst executeAction = React.useCallback(() => {\n\t\tprocessingButtonConfig.processing\n\t\t\t.action()\n\t\t\t.then(() => {\n\t\t\t\tif (processingButtonConfig.success) {\n\t\t\t\t\tsetCurrentState('success');\n\t\t\t\t} else {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}\n\t\t\t})\n\t\t\t.catch(() => {\n\t\t\t\tif (processingButtonConfig.error) {\n\t\t\t\t\tsetCurrentState('error');\n\t\t\t\t} else {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}\n\t\t\t});\n\t}, [\n\t\tprocessingButtonConfig.error,\n\t\tprocessingButtonConfig.processing,\n\t\tprocessingButtonConfig.success\n\t]);\n\n\tReact.useEffect(() => {\n\t\tswitch (currentState) {\n\t\t\tcase 'processing':\n\t\t\t\ttimeoutRef.current = setTimeout(executeAction, feedbackTime);\n\t\t\t\tbreak;\n\t\t\tcase 'success':\n\t\t\tcase 'error':\n\t\t\t\ttimeoutRef.current = setTimeout(() => {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}, resetTime);\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (timeoutRef.current) {\n\t\t\t\tclearTimeout(timeoutRef.current);\n\t\t\t}\n\t\t};\n\t}, [currentState, processingButtonConfig, resetTime, executeAction, feedbackTime]);\n\n\tconst button =\n\t\tcurrentState === 'processing' ? (\n\t\t\t<MrlButton\n\t\t\t\tdata-qa={dataQa}\n\t\t\t\t{...buttonProps}\n\t\t\t\tclassName={classnames(\n\t\t\t\t\tstyles['MrlProcessingButton'],\n\t\t\t\t\tstyles['MrlProcessingButton-is-processing'],\n\t\t\t\t\tclassName\n\t\t\t\t)}\n\t\t\t\taria-busy={true}\n\t\t\t\taria-disabled={false}\n\t\t\t\t// We need to use a placeholder icon to display text and the MrlSpinner\n\t\t\t\ticon={<MrlSvg svg={placeholder} />}\n\t\t\t\tloading={true}\n\t\t\t\tloadingText=\" \"\n\t\t\t\tstate=\"disabled\"\n\t\t\t\ttext={processingButtonConfig.processing.text || processingButtonConfig.normal.text}\n\t\t\t/>\n\t\t) : (\n\t\t\t<MrlButton\n\t\t\t\tdata-qa={dataQa}\n\t\t\t\tclassName={className}\n\t\t\t\t{...buttonProps}\n\t\t\t\ticon={\n\t\t\t\t\tprocessingButtonConfig[currentState]?.icon && (\n\t\t\t\t\t\t<MrlSvg svg={processingButtonConfig[currentState]?.icon} />\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tstate=\"default\"\n\t\t\t\ttext={processingButtonConfig[currentState]?.text || ''}\n\t\t\t/>\n\t\t);\n\n\treturn (\n\t\t<>\n\t\t\t{button}\n\t\t\t<MrlLiveRegion\n\t\t\t\tariaLive=\"assertive\"\n\t\t\t\tsrContent={processingButtonConfig[currentState]?.text || ''}\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],"names":["DEFAULT_RESET_TIME","DEFAULT_FEEDBACK_TIME","MrlProcessingButton","props","_processingButtonConf","_processingButtonConf2","_processingButtonConf3","_processingButtonConf4","_processingButtonConf5","dataQa","processingButtonConfig","_props$resetTime","resetTime","className","buttonProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","currentState","setCurrentState","timeoutRef","useRef","handleClick","feedbackTime","processing","executeAction","useCallback","action","then","success","error","useEffect","current","setTimeout","clearTimeout","button","createElement","MrlButton","_extends","classnames","styles","icon","MrlSvg","svg","placeholder","loading","loadingText","state","text","normal","onClick","Fragment","MrlLiveRegion","ariaLive","srContent"],"mappings":"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"}
+{"version":3,"file":"MrlProcessingButton.js","sources":["../../../../../src/components/button/MrlProcessingButton/MrlProcessingButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlButtonProps, MrlButton } from '../MrlButton';\nimport { DSIconType, MrlSvg } from '../../svg';\nimport { DataQa } from '../../../utils/dataQa';\nimport { placeholder } from '@muraldevkit/ds-icons';\nimport { MrlLiveRegion } from '../../live-region';\nimport styles from './MrlProcessingButton.module.scss';\n\nexport const DEFAULT_RESET_TIME = 4000;\nexport const DEFAULT_FEEDBACK_TIME = 500;\n\nexport type PossibleState = 'normal' | 'processing' | 'success' | 'error';\n\nexport type MrlProcessingButtonConfig = {\n\tnormal: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n\tprocessing: {\n\t\taction: () => Promise<void>;\n\t\t/**\n\t\t * The minimum time to show the processing state before executing the action.\n\t\t * This provides visual feedback to users that their action was registered.\n\t\t */\n\t\tfeedbackTime?: number;\n\t\ttext?: string;\n\t};\n\tsuccess?: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n\terror?: {\n\t\ttext: string;\n\t\ticon?: DSIconType;\n\t};\n};\n\nexport interface MrlProcessingButtonProps extends Omit<MrlButtonProps, 'ref' | 'text'>, DataQa {\n\t/**\n\t * The configuration for the processing button.\n\t */\n\tprocessingButtonConfig: MrlProcessingButtonConfig;\n\t/**\n\t * The time to wait before resetting the button to the normal state.\n\t */\n\tresetTime?: number;\n}\n\n/**\n * A specialized button component that provides visual feedback during processing operations.\n *\n * The MrlProcessingButton extends the standard MrlButton with additional processing state\n * management and user feedback capabilities. It automatically handles the transition between\n * normal, loading, and completion states to provide clear visual feedback to users.\n *\n * @param props - The component props extending MrlButtonProps with additional processing capabilities\n * @returns a MrlProcessingButton React component\n */\nexport function MrlProcessingButton(props: MrlProcessingButtonProps) {\n\tconst {\n\t\t['data-qa']: dataQa,\n\t\tprocessingButtonConfig,\n\t\tresetTime = DEFAULT_RESET_TIME,\n\t\tclassName,\n\t\t...buttonProps\n\t} = props;\n\n\tconst [currentState, setCurrentState] = React.useState<PossibleState>('normal');\n\tconst timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n\n\tconst handleClick = () => {\n\t\tif (currentState === 'processing') return;\n\t\tsetCurrentState('processing');\n\t};\n\n\tconst feedbackTime = processingButtonConfig.processing.feedbackTime ?? DEFAULT_FEEDBACK_TIME;\n\n\tconst executeAction = React.useCallback(() => {\n\t\tprocessingButtonConfig.processing\n\t\t\t.action()\n\t\t\t.then(() => {\n\t\t\t\tif (processingButtonConfig.success) {\n\t\t\t\t\tsetCurrentState('success');\n\t\t\t\t} else {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}\n\t\t\t})\n\t\t\t.catch(() => {\n\t\t\t\tif (processingButtonConfig.error) {\n\t\t\t\t\tsetCurrentState('error');\n\t\t\t\t} else {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}\n\t\t\t});\n\t}, [\n\t\tprocessingButtonConfig.error,\n\t\tprocessingButtonConfig.processing,\n\t\tprocessingButtonConfig.success\n\t]);\n\n\tReact.useEffect(() => {\n\t\tswitch (currentState) {\n\t\t\tcase 'processing':\n\t\t\t\ttimeoutRef.current = setTimeout(executeAction, feedbackTime);\n\t\t\t\tbreak;\n\t\t\tcase 'success':\n\t\t\tcase 'error':\n\t\t\t\ttimeoutRef.current = setTimeout(() => {\n\t\t\t\t\tsetCurrentState('normal');\n\t\t\t\t}, resetTime);\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (timeoutRef.current) {\n\t\t\t\tclearTimeout(timeoutRef.current);\n\t\t\t}\n\t\t};\n\t}, [currentState, processingButtonConfig, resetTime, executeAction, feedbackTime]);\n\n\tconst button =\n\t\tcurrentState === 'processing' ? (\n\t\t\t<MrlButton\n\t\t\t\tdata-qa={dataQa}\n\t\t\t\t{...buttonProps}\n\t\t\t\tclassName={classnames(\n\t\t\t\t\tstyles['MrlProcessingButton'],\n\t\t\t\t\tstyles['MrlProcessingButton-is-processing'],\n\t\t\t\t\tclassName\n\t\t\t\t)}\n\t\t\t\taria-busy={true}\n\t\t\t\taria-disabled={false}\n\t\t\t\t// We need to use a placeholder icon to display text and the MrlSpinner\n\t\t\t\ticon={<MrlSvg svg={placeholder} />}\n\t\t\t\tloading={true}\n\t\t\t\tloadingText=\" \"\n\t\t\t\tstate=\"disabled\"\n\t\t\t\ttext={processingButtonConfig.processing.text || processingButtonConfig.normal.text}\n\t\t\t/>\n\t\t) : (\n\t\t\t<MrlButton\n\t\t\t\tdata-qa={dataQa}\n\t\t\t\tclassName={className}\n\t\t\t\t{...buttonProps}\n\t\t\t\ticon={\n\t\t\t\t\tprocessingButtonConfig[currentState]?.icon && (\n\t\t\t\t\t\t<MrlSvg svg={processingButtonConfig[currentState]?.icon} />\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tstate=\"default\"\n\t\t\t\ttext={processingButtonConfig[currentState]?.text || ''}\n\t\t\t/>\n\t\t);\n\n\treturn (\n\t\t<>\n\t\t\t{button}\n\t\t\t<MrlLiveRegion\n\t\t\t\tariaLive=\"assertive\"\n\t\t\t\tsrContent={processingButtonConfig[currentState]?.text || ''}\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],"names":["DEFAULT_RESET_TIME","DEFAULT_FEEDBACK_TIME","MrlProcessingButton","props","_processingButtonConf","_processingButtonConf2","_processingButtonConf3","_processingButtonConf4","_processingButtonConf5","dataQa","processingButtonConfig","_props$resetTime","resetTime","className","buttonProps","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","currentState","setCurrentState","timeoutRef","useRef","handleClick","feedbackTime","processing","executeAction","useCallback","action","then","success","catch","error","useEffect","current","setTimeout","clearTimeout","button","createElement","MrlButton","_extends","classnames","styles","icon","MrlSvg","svg","placeholder","loading","loadingText","state","text","normal","onClick","Fragment","MrlLiveRegion","ariaLive","srContent"],"mappings":"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"}

package/dist/esm/components/button/MrlProcessingButton/actions.js

@@ -1,4 +1,4 @@
-import { asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { asyncToGenerator as _asyncToGenerator } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 
 /**
  * Copies text to the clipboard using the browser's clipboard API
@@ -14,26 +14,21 @@ function copyToClipboard(_x, _x2) {
  * Actions for the MrlProcessingButton
  */
 function _copyToClipboard() {
-  _copyToClipboard = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(text, processing_time) {
-    return _regenerator().w(function (_context) {
-      while (1) switch (_context.n) {
-        case 0:
-          return _context.a(2, new Promise(function (resolve, reject) {
-            if (processing_time) {
-              setTimeout(function () {
-                navigator.clipboard.writeText(text).then(resolve)["catch"](reject);
-              }, processing_time);
-            } else {
-              navigator.clipboard.writeText(text).then(resolve)["catch"](reject);
-            }
-          }));
+  _copyToClipboard = _asyncToGenerator(function* (text, processing_time) {
+    return new Promise((resolve, reject) => {
+      if (processing_time) {
+        setTimeout(() => {
+          navigator.clipboard.writeText(text).then(resolve).catch(reject);
+        }, processing_time);
+      } else {
+        navigator.clipboard.writeText(text).then(resolve).catch(reject);
       }
-    }, _callee);
-  }));
+    });
+  });
   return _copyToClipboard.apply(this, arguments);
 }
 var MRL_PROCESSING_BUTTON_ACTIONS = {
-  copyToClipboard: copyToClipboard
+  copyToClipboard
 };
 
 export { MRL_PROCESSING_BUTTON_ACTIONS, copyToClipboard };

package/dist/esm/components/button/MrlProcessingButton/actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"actions.js","sources":["../../../../../src/components/button/MrlProcessingButton/actions.ts"],"sourcesContent":["/**\n * Copies text to the clipboard using the browser's clipboard API\n * @param text - The text to copy to clipboard\n * @param processing_time - The time to wait before copying the text to the clipboard\n * @returns Promise that resolves when text is copied\n */\nexport async function copyToClipboard(text: string, processing_time?: number): Promise<void> {\n\treturn new Promise((resolve, reject) => {\n\t\tif (processing_time) {\n\t\t\tsetTimeout(() => {\n\t\t\t\tnavigator.clipboard.writeText(text).then(resolve).catch(reject);\n\t\t\t}, processing_time);\n\t\t} else {\n\t\t\tnavigator.clipboard.writeText(text).then(resolve).catch(reject);\n\t\t}\n\t});\n}\n\n/**\n * Actions for the MrlProcessingButton\n */\nexport const MRL_PROCESSING_BUTTON_ACTIONS = {\n\tcopyToClipboard\n};\n"],"names":["copyToClipboard","_x","_x2","_copyToClipboard","apply","arguments","_asyncToGenerator","_regenerator","m","_callee","text","processing_time","w","_context","n","a","Promise","resolve","reject","setTimeout","navigator","clipboard","writeText","then","MRL_PROCESSING_BUTTON_ACTIONS"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAAsBA,eAAeA,CAAAC,EAAA,EAAAC,GAAA,EAAA;AAAA,EAAA,OAAAC,gBAAA,CAAAC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA;AAAA;;AAYrC;AACA;AACA;AAFA,SAAAF,gBAAAA,GAAA;EAAAA,gBAAA,GAAAG,iBAAA,cAAAC,YAAA,EAAA,CAAAC,CAAA,CAZO,SAAAC,OAAAA,CAA+BC,IAAY,EAAEC,eAAwB,EAAA;AAAA,IAAA,OAAAJ,YAAA,EAAA,CAAAK,CAAA,CAAA,UAAAC,QAAA,EAAA;MAAA,OAAA,CAAA,EAAA,QAAAA,QAAA,CAAAC,CAAA;AAAA,QAAA,KAAA,CAAA;UAAA,OAAAD,QAAA,CAAAE,CAAA,CAAA,CAAA,EACpE,IAAIC,OAAO,CAAC,UAACC,OAAO,EAAEC,MAAM,EAAK;AACvC,YAAA,IAAIP,eAAe,EAAE;AACpBQ,cAAAA,UAAU,CAAC,YAAM;AAChBC,gBAAAA,SAAS,CAACC,SAAS,CAACC,SAAS,CAACZ,IAAI,CAAC,CAACa,IAAI,CAACN,OAAO,CAAC,CAAA,OAAA,CAAM,CAACC,MAAM,CAAC;cAChE,CAAC,EAAEP,eAAe,CAAC;AACpB,YAAA,CAAC,MAAM;AACNS,cAAAA,SAAS,CAACC,SAAS,CAACC,SAAS,CAACZ,IAAI,CAAC,CAACa,IAAI,CAACN,OAAO,CAAC,CAAA,OAAA,CAAM,CAACC,MAAM,CAAC;AAChE,YAAA;AACD,UAAA,CAAC,CAAC,CAAA;AAAA;AAAA,IAAA,CAAA,EAAAT,OAAA,CAAA;EAAA,CACF,CAAA,CAAA;AAAA,EAAA,OAAAN,gBAAA,CAAAC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA;AAAA;AAKM,IAAMmB,6BAA6B,GAAG;AAC5CxB,EAAAA,eAAe,EAAfA;AACD;;;;"}
+{"version":3,"file":"actions.js","sources":["../../../../../src/components/button/MrlProcessingButton/actions.ts"],"sourcesContent":["/**\n * Copies text to the clipboard using the browser's clipboard API\n * @param text - The text to copy to clipboard\n * @param processing_time - The time to wait before copying the text to the clipboard\n * @returns Promise that resolves when text is copied\n */\nexport async function copyToClipboard(text: string, processing_time?: number): Promise<void> {\n\treturn new Promise((resolve, reject) => {\n\t\tif (processing_time) {\n\t\t\tsetTimeout(() => {\n\t\t\t\tnavigator.clipboard.writeText(text).then(resolve).catch(reject);\n\t\t\t}, processing_time);\n\t\t} else {\n\t\t\tnavigator.clipboard.writeText(text).then(resolve).catch(reject);\n\t\t}\n\t});\n}\n\n/**\n * Actions for the MrlProcessingButton\n */\nexport const MRL_PROCESSING_BUTTON_ACTIONS = {\n\tcopyToClipboard\n};\n"],"names":["copyToClipboard","_x","_x2","_copyToClipboard","apply","arguments","_asyncToGenerator","text","processing_time","Promise","resolve","reject","setTimeout","navigator","clipboard","writeText","then","catch","MRL_PROCESSING_BUTTON_ACTIONS"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAAsBA,eAAeA,CAAAC,EAAA,EAAAC,GAAA,EAAA;AAAA,EAAA,OAAAC,gBAAA,CAAAC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA;AAAA;;AAYrC;AACA;AACA;AAFA,SAAAF,gBAAAA,GAAA;AAAAA,EAAAA,gBAAA,GAAAG,iBAAA,CAZO,WAA+BC,IAAY,EAAEC,eAAwB,EAAiB;AAC5F,IAAA,OAAO,IAAIC,OAAO,CAAC,CAACC,OAAO,EAAEC,MAAM,KAAK;AACvC,MAAA,IAAIH,eAAe,EAAE;AACpBI,QAAAA,UAAU,CAAC,MAAM;AAChBC,UAAAA,SAAS,CAACC,SAAS,CAACC,SAAS,CAACR,IAAI,CAAC,CAACS,IAAI,CAACN,OAAO,CAAC,CAACO,KAAK,CAACN,MAAM,CAAC;QAChE,CAAC,EAAEH,eAAe,CAAC;AACpB,MAAA,CAAC,MAAM;AACNK,QAAAA,SAAS,CAACC,SAAS,CAACC,SAAS,CAACR,IAAI,CAAC,CAACS,IAAI,CAACN,OAAO,CAAC,CAACO,KAAK,CAACN,MAAM,CAAC;AAChE,MAAA;AACD,IAAA,CAAC,CAAC;EACH,CAAC,CAAA;AAAA,EAAA,OAAAR,gBAAA,CAAAC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA;AAAA;AAKM,IAAMa,6BAA6B,GAAG;AAC5ClB,EAAAA;AACD;;;;"}

package/dist/esm/components/button/helpers.js

@@ -8,7 +8,7 @@ import { allowedButtonValues } from './constants.js';
  * @param {MrlGhostIconButtonSize} [buttonSize] - the size of the current button.
  * @returns {SpinnerComponent} - an MrlSpinner element themed to the button.
  */
-var _spinnerProps = function _spinnerProps(buttonKind, buttonSize) {
+var _spinnerProps = (buttonKind, buttonSize) => {
   /** Set the Spinner kind */
   var spinnerStyle = buttonKind === 'primary' || buttonKind === 'ghost-inverse' ? 'inverse' : 'default';
   /** Set the Spinner size */
@@ -29,7 +29,7 @@ var _spinnerProps = function _spinnerProps(buttonKind, buttonSize) {
  * 		This is used for @Watch statements where this.state is not consistent.
  * @returns {boolean} - if the button is disabled
  */
-var _isDisabled = function _isDisabled(currentState, isLoading, enforcedState) {
+var _isDisabled = (currentState, isLoading, enforcedState) => {
   var value = enforcedState || currentState;
   // We treat Skeleton as disabled so users can't interact with it
   // Note: this may need to be re-evaluated a bit when we allow screen reader and
@@ -47,7 +47,7 @@ var _isDisabled = function _isDisabled(currentState, isLoading, enforcedState) {
  * 		This is used for @Watch statements where this.state is not consistent.
  * @returns {boolean} - if the button is disabled
  */
-var _isSelected = function _isSelected(currentState, enforcedState) {
+var _isSelected = (currentState, enforcedState) => {
   var value = enforcedState || currentState;
   return value === 'selected' || value === 'selected-disabled' ? true : false;
 };
@@ -58,9 +58,7 @@ var _isSelected = function _isSelected(currentState, enforcedState) {
  * @param {ToggleStyle} toggleStyle type of toggle
  * @returns {boolean} returns boolean if it's togglable
  */
-var _isToggleButton = function _isToggleButton(toggleStyle) {
-  return toggleStyle && allowedButtonValues.toggleStyles.includes(toggleStyle);
-};
+var _isToggleButton = toggleStyle => toggleStyle && allowedButtonValues.toggleStyles.includes(toggleStyle);
 
 export { _isDisabled, _isSelected, _isToggleButton, _spinnerProps };
 //# sourceMappingURL=helpers.js.map

package/dist/esm/components/button/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../../src/components/button/helpers.ts"],"sourcesContent":["import { MrlButtonState, ToggleStyle } from './MrlButton';\nimport { MrlButtonKind, MrlGhostIconButtonSize, allowedButtonValues } from './constants';\nimport { SpinnerComponent, SpinnerSize, SpinnerStyle } from '../loader/constants';\n\n/**\n * Determines what loader should be displayed in which types of buttons.\n *\n * @private\n * @param {MrlButtonKind} [buttonKind] - the kind of the current button.\n * @param {MrlGhostIconButtonSize} [buttonSize] - the size of the current button.\n * @returns {SpinnerComponent} - an MrlSpinner element themed to the button.\n */\nexport const _spinnerProps = (\n\tbuttonKind: MrlButtonKind,\n\tbuttonSize: MrlGhostIconButtonSize\n): SpinnerComponent => {\n\t/** Set the Spinner kind */\n\tconst spinnerStyle: SpinnerStyle =\n\t\tbuttonKind === 'primary' || buttonKind === 'ghost-inverse' ? 'inverse' : 'default';\n\t/** Set the Spinner size */\n\tconst spinnerSize: SpinnerSize =\n\t\tbuttonSize === 'large' || buttonSize === 'medium'\n\t\t\t? 'medium'\n\t\t\t: buttonSize === 'xsmall'\n\t\t\t\t? 'xsmall'\n\t\t\t\t: 'small';\n\n\treturn {\n\t\tkind: spinnerStyle,\n\t\tsize: spinnerSize\n\t};\n};\n\n/**\n * Determines if the button is disabled since multiple states represent disabled\n *\n * @private\n * @param {MrlButtonState} [currentState] - the value of this.state from the component.\n * @param {boolean} [isLoading] - if the button is loading\n * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.\n * \t\tThis is used for @Watch statements where this.state is not consistent.\n * @returns {boolean} - if the button is disabled\n */\nexport const _isDisabled = (\n\tcurrentState: MrlButtonState,\n\tisLoading: boolean,\n\tenforcedState?: MrlButtonState\n): boolean => {\n\tconst value = enforcedState || currentState;\n\t// We treat Skeleton as disabled so users can't interact with it\n\t// Note: this may need to be re-evaluated a bit when we allow screen reader and\n\t// keyboard users access to disabled buttons as we would still not want them to\n\t// access hydrated skeletons.\n\treturn isLoading || value === 'disabled' || value === 'selected-disabled' || value === 'skeleton'\n\t\t? true\n\t\t: false;\n};\n\n/**\n * Determines if the button is selected since multiple states represent selected\n *\n * @private\n * @param {MrlButtonState} [currentState] - the value of this.state from the component.\n * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.\n * \t\tThis is used for @Watch statements where this.state is not consistent.\n * @returns {boolean} - if the button is disabled\n */\nexport const _isSelected = (\n\tcurrentState: MrlButtonState,\n\tenforcedState?: MrlButtonState\n): boolean => {\n\tconst value = enforcedState || currentState;\n\treturn value === 'selected' || value === 'selected-disabled' ? true : false;\n};\n\n/**\n * MrlIconButton and MrlAnimatedIconButton could behave as a toggle button if toggleStyle is 'default' or 'secondary'\n *\n * @param {ToggleStyle} toggleStyle type of toggle\n * @returns {boolean} returns boolean if it's togglable\n */\nexport const _isToggleButton = (toggleStyle: ToggleStyle): boolean =>\n\ttoggleStyle && allowedButtonValues.toggleStyles.includes(toggleStyle);\n"],"names":["_spinnerProps","buttonKind","buttonSize","spinnerStyle","spinnerSize","kind","size","_isDisabled","currentState","isLoading","enforcedState","value","_isSelected","_isToggleButton","toggleStyle","allowedButtonValues","toggleStyles","includes"],"mappings":";;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,aAAa,GAAG,SAAhBA,aAAaA,CACzBC,UAAyB,EACzBC,UAAkC,EACZ;AACtB;AACA,EAAA,IAAMC,YAA0B,GAC/BF,UAAU,KAAK,SAAS,IAAIA,UAAU,KAAK,eAAe,GAAG,SAAS,GAAG,SAAS;AACnF;AACA,EAAA,IAAMG,WAAwB,GAC7BF,UAAU,KAAK,OAAO,IAAIA,UAAU,KAAK,QAAQ,GAC9C,QAAQ,GACRA,UAAU,KAAK,QAAQ,GACtB,QAAQ,GACR,OAAO;EAEZ,OAAO;AACNG,IAAAA,IAAI,EAAEF,YAAY;AAClBG,IAAAA,IAAI,EAAEF;GACN;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMG,WAAW,GAAG,SAAdA,WAAWA,CACvBC,YAA4B,EAC5BC,SAAkB,EAClBC,aAA8B,EACjB;AACb,EAAA,IAAMC,KAAK,GAAGD,aAAa,IAAIF,YAAY;AAC3C;AACA;AACA;AACA;AACA,EAAA,OAAOC,SAAS,IAAIE,KAAK,KAAK,UAAU,IAAIA,KAAK,KAAK,mBAAmB,IAAIA,KAAK,KAAK,UAAU,GAC9F,IAAI,GACJ,KAAK;AACT;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CACvBJ,YAA4B,EAC5BE,aAA8B,EACjB;AACb,EAAA,IAAMC,KAAK,GAAGD,aAAa,IAAIF,YAAY;EAC3C,OAAOG,KAAK,KAAK,UAAU,IAAIA,KAAK,KAAK,mBAAmB,GAAG,IAAI,GAAG,KAAK;AAC5E;;AAEA;AACA;AACA;AACA;AACA;AACA;IACaE,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,WAAwB,EAAA;EAAA,OACvDA,WAAW,IAAIC,mBAAmB,CAACC,YAAY,CAACC,QAAQ,CAACH,WAAW,CAAC;AAAA;;;;"}
+{"version":3,"file":"helpers.js","sources":["../../../../src/components/button/helpers.ts"],"sourcesContent":["import { MrlButtonState, ToggleStyle } from './MrlButton';\nimport { MrlButtonKind, MrlGhostIconButtonSize, allowedButtonValues } from './constants';\nimport { SpinnerComponent, SpinnerSize, SpinnerStyle } from '../loader/constants';\n\n/**\n * Determines what loader should be displayed in which types of buttons.\n *\n * @private\n * @param {MrlButtonKind} [buttonKind] - the kind of the current button.\n * @param {MrlGhostIconButtonSize} [buttonSize] - the size of the current button.\n * @returns {SpinnerComponent} - an MrlSpinner element themed to the button.\n */\nexport const _spinnerProps = (\n\tbuttonKind: MrlButtonKind,\n\tbuttonSize: MrlGhostIconButtonSize\n): SpinnerComponent => {\n\t/** Set the Spinner kind */\n\tconst spinnerStyle: SpinnerStyle =\n\t\tbuttonKind === 'primary' || buttonKind === 'ghost-inverse' ? 'inverse' : 'default';\n\t/** Set the Spinner size */\n\tconst spinnerSize: SpinnerSize =\n\t\tbuttonSize === 'large' || buttonSize === 'medium'\n\t\t\t? 'medium'\n\t\t\t: buttonSize === 'xsmall'\n\t\t\t\t? 'xsmall'\n\t\t\t\t: 'small';\n\n\treturn {\n\t\tkind: spinnerStyle,\n\t\tsize: spinnerSize\n\t};\n};\n\n/**\n * Determines if the button is disabled since multiple states represent disabled\n *\n * @private\n * @param {MrlButtonState} [currentState] - the value of this.state from the component.\n * @param {boolean} [isLoading] - if the button is loading\n * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.\n * \t\tThis is used for @Watch statements where this.state is not consistent.\n * @returns {boolean} - if the button is disabled\n */\nexport const _isDisabled = (\n\tcurrentState: MrlButtonState,\n\tisLoading: boolean,\n\tenforcedState?: MrlButtonState\n): boolean => {\n\tconst value = enforcedState || currentState;\n\t// We treat Skeleton as disabled so users can't interact with it\n\t// Note: this may need to be re-evaluated a bit when we allow screen reader and\n\t// keyboard users access to disabled buttons as we would still not want them to\n\t// access hydrated skeletons.\n\treturn isLoading || value === 'disabled' || value === 'selected-disabled' || value === 'skeleton'\n\t\t? true\n\t\t: false;\n};\n\n/**\n * Determines if the button is selected since multiple states represent selected\n *\n * @private\n * @param {MrlButtonState} [currentState] - the value of this.state from the component.\n * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.\n * \t\tThis is used for @Watch statements where this.state is not consistent.\n * @returns {boolean} - if the button is disabled\n */\nexport const _isSelected = (\n\tcurrentState: MrlButtonState,\n\tenforcedState?: MrlButtonState\n): boolean => {\n\tconst value = enforcedState || currentState;\n\treturn value === 'selected' || value === 'selected-disabled' ? true : false;\n};\n\n/**\n * MrlIconButton and MrlAnimatedIconButton could behave as a toggle button if toggleStyle is 'default' or 'secondary'\n *\n * @param {ToggleStyle} toggleStyle type of toggle\n * @returns {boolean} returns boolean if it's togglable\n */\nexport const _isToggleButton = (toggleStyle: ToggleStyle): boolean =>\n\ttoggleStyle && allowedButtonValues.toggleStyles.includes(toggleStyle);\n"],"names":["_spinnerProps","buttonKind","buttonSize","spinnerStyle","spinnerSize","kind","size","_isDisabled","currentState","isLoading","enforcedState","value","_isSelected","_isToggleButton","toggleStyle","allowedButtonValues","toggleStyles","includes"],"mappings":";;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;IACaA,aAAa,GAAGA,CAC5BC,UAAyB,EACzBC,UAAkC,KACZ;AACtB;AACA,EAAA,IAAMC,YAA0B,GAC/BF,UAAU,KAAK,SAAS,IAAIA,UAAU,KAAK,eAAe,GAAG,SAAS,GAAG,SAAS;AACnF;AACA,EAAA,IAAMG,WAAwB,GAC7BF,UAAU,KAAK,OAAO,IAAIA,UAAU,KAAK,QAAQ,GAC9C,QAAQ,GACRA,UAAU,KAAK,QAAQ,GACtB,QAAQ,GACR,OAAO;EAEZ,OAAO;AACNG,IAAAA,IAAI,EAAEF,YAAY;AAClBG,IAAAA,IAAI,EAAEF;GACN;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMG,WAAW,GAAGA,CAC1BC,YAA4B,EAC5BC,SAAkB,EAClBC,aAA8B,KACjB;AACb,EAAA,IAAMC,KAAK,GAAGD,aAAa,IAAIF,YAAY;AAC3C;AACA;AACA;AACA;AACA,EAAA,OAAOC,SAAS,IAAIE,KAAK,KAAK,UAAU,IAAIA,KAAK,KAAK,mBAAmB,IAAIA,KAAK,KAAK,UAAU,GAC9F,IAAI,GACJ,KAAK;AACT;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;IACaC,WAAW,GAAGA,CAC1BJ,YAA4B,EAC5BE,aAA8B,KACjB;AACb,EAAA,IAAMC,KAAK,GAAGD,aAAa,IAAIF,YAAY;EAC3C,OAAOG,KAAK,KAAK,UAAU,IAAIA,KAAK,KAAK,mBAAmB,GAAG,IAAI,GAAG,KAAK;AAC5E;;AAEA;AACA;AACA;AACA;AACA;AACA;AACO,IAAME,eAAe,GAAIC,WAAwB,IACvDA,WAAW,IAAIC,mBAAmB,CAACC,YAAY,CAACC,QAAQ,CAACH,WAAW;;;;"}

package/dist/esm/components/callout/MrlCallout/MrlCallout.js

@@ -16,7 +16,7 @@ var _excluded = ["ariaControls", "alignment", "children", "description", "disabl
  * @param props - The props.
  * @returns {React.ReactElement} The MrlCallout component.
  */
-var MrlCallout = function MrlCallout(props) {
+var MrlCallout = props => {
   // In some cases when `show` is false, the content is also null or empty.
   // At the same time callout shows fade-out animation and do not disappear immediately.
   // Saving last visible content to show it while animating on close.
@@ -63,12 +63,10 @@ var MrlCallout = function MrlCallout(props) {
   if (/*#__PURE__*/React.isValidElement(children) && children.type === React.Fragment) {
     throw new Error('MrlCallout accepts a single child and does not accept a React.Fragment as a child.');
   }
-  var calloutId = React.useMemo(function () {
-    return getUniqueId('callout-append');
-  }, []);
+  var calloutId = React.useMemo(() => getUniqueId('callout-append'), []);
   var triggerRef = React.useRef(null);
-  var childElement = React.useMemo(function () {
-    return React.Children.map(children, function (child) {
+  var childElement = React.useMemo(() => {
+    return React.Children.map(children, child => {
       return /*#__PURE__*/React.cloneElement(child, _objectSpread2(_objectSpread2(_objectSpread2({}, child.props), child.type !== 'button' && {
         role: 'button'
       }), {}, {
@@ -83,7 +81,7 @@ var MrlCallout = function MrlCallout(props) {
   //
   // We are using querySelector to set the triggerRef instead of assigning a ref directly in childElement because
   // a child element may already have a ref assigned to it and we don't want to override it.
-  React.useEffect(function () {
+  React.useEffect(() => {
     triggerRef.current = document.querySelector("#".concat(calloutId));
   }, [calloutId]);
   var popoverKind = kind === 'primary' ? 'inverse' : 'primary';

package/dist/esm/components/callout/MrlCallout/MrlCallout.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlCallout.js","sources":["../../../../../src/components/callout/MrlCallout/MrlCallout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlPopover, MrlPopoverProps } from '../../popover';\nimport { MrlText, MrlTextHeading } from '../../text';\nimport styles from './MrlCallout.module.scss';\nimport { MrlButton } from '../../button';\nimport { getUniqueId } from '../../../utils';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\nimport { useRef } from 'react';\n\nexport type MrlCalloutPopoverProps = Omit<\n\tMrlPopoverProps,\n\t'children' | 'actionState' | 'isSubMenu' | 'triggerRef' | 'kind'\n>;\n\ninterface MrlCalloutCTA {\n\tonClick: () => void;\n\tdataQa?: string;\n\ttext: string;\n}\n\nexport type CalloutKind = 'primary' | 'secondary';\n\nexport interface MrlCalloutProps extends MrlCalloutPopoverProps {\n\t/** a unique id that binds the callout content and the trigger for assistive technologies */\n\tariaControls?: string;\n\tautoFocus?: boolean;\n\tchildren: React.ReactElement;\n\tdisableClickOutside?: boolean;\n\tdescription?: string | JSX.Element;\n\teyebrow?: string;\n\tid?: string;\n\timage?: JSX.Element;\n\tkind?: CalloutKind;\n\trenderWithPortal?: boolean;\n\tshow: boolean;\n\ttitle?: string;\n\tprimaryCta?: MrlCalloutCTA;\n\tsecondaryCta?: MrlCalloutCTA;\n}\n\ntype MrlCalloutContent = Pick<\n\tMrlCalloutProps,\n\t'alignment' | 'description' | 'eyebrow' | 'image' | 'kind' | 'title'\n>;\n\n/**\n * MrlCallout component.\n *\n * @param props - The props.\n * @returns {React.ReactElement} The MrlCallout component.\n */\nexport const MrlCallout = (props: MrlCalloutProps): React.ReactElement => {\n\t// In some cases when `show` is false, the content is also null or empty.\n\t// At the same time callout shows fade-out animation and do not disappear immediately.\n\t// Saving last visible content to show it while animating on close.\n\tconst savedContent = useRef<MrlCalloutContent>();\n\tif (props.show) {\n\t\tsavedContent.current = {\n\t\t\talignment: props.alignment,\n\t\t\tdescription: props.description,\n\t\t\teyebrow: props.eyebrow,\n\t\t\timage: props.image,\n\t\t\tkind: props.kind,\n\t\t\ttitle: props.title\n\t\t};\n\t}\n\n\tconst {\n\t\tariaControls,\n\t\talignment = 'center',\n\t\tchildren,\n\t\tdescription,\n\t\tdisableClickOutside = true,\n\t\tdisableFocusTrap = true,\n\t\teyebrow,\n\t\thasCloseButton = true,\n\t\timage,\n\t\tkind = 'primary',\n\t\tonOpen,\n\t\tonClose,\n\t\tpoint = true,\n\t\tposition = 'bottom',\n\t\tprimaryCta,\n\t\tsecondaryCta,\n\t\tshow = true,\n\t\tspacing,\n\t\ttitle,\n\t\t...rest\n\t} = props.show ? props : { ...props, ...savedContent.current };\n\n\tif (React.isValidElement(children) && children.type === React.Fragment) {\n\t\tthrow new Error(\n\t\t\t'MrlCallout accepts a single child and does not accept a React.Fragment as a child.'\n\t\t);\n\t}\n\n\tconst calloutId = React.useMemo(() => getUniqueId('callout-append'), []);\n\tconst triggerRef = React.useRef<HTMLElement | null>(null);\n\n\tconst childElement = React.useMemo(() => {\n\t\treturn React.Children.map(children, (child) => {\n\t\t\treturn React.cloneElement(child, {\n\t\t\t\t...child.props,\n\t\t\t\t/** if the callout is tied to an interactive element we need to ensure that it has role=\"button\" */\n\t\t\t\t...(child.type !== 'button' && { role: 'button' }),\n\t\t\t\t'aria-controls': ariaControls,\n\t\t\t\t'aria-expanded': show,\n\t\t\t\tid: calloutId\n\t\t\t});\n\t\t});\n\t}, [calloutId, children, show, ariaControls]);\n\n\t// Setting trigger ref to the element with the calloutId (set above in the childElement useMemo)\n\t//\n\t// We are using querySelector to set the triggerRef instead of assigning a ref directly in childElement because\n\t// a child element may already have a ref assigned to it and we don't want to override it.\n\tReact.useEffect(() => {\n\t\ttriggerRef.current = document.querySelector(`#${calloutId}`) as HTMLElement;\n\t}, [calloutId]);\n\n\tconst popoverKind = kind === 'primary' ? 'inverse' : 'primary';\n\tconst primaryCtaKind = kind === 'primary' ? 'inverse' : 'secondary';\n\tconst secondaryCtaKind = kind === 'primary' ? 'ghost-inverse' : 'ghost';\n\n\treturn (\n\t\t<>\n\t\t\t{childElement}\n\t\t\t{triggerRef && (\n\t\t\t\t<MrlPopover\n\t\t\t\t\tactionState={{ actionType: 'click', isOpen: show }}\n\t\t\t\t\talignment={alignment}\n\t\t\t\t\tclassName={styles['MrlCallout']}\n\t\t\t\t\tdisableClickToOpen\n\t\t\t\t\tdisableClickOutside={disableClickOutside}\n\t\t\t\t\tdisableFocusTrap={disableFocusTrap}\n\t\t\t\t\thasCloseButton={hasCloseButton}\n\t\t\t\t\tkind={popoverKind}\n\t\t\t\t\tonClose={onClose}\n\t\t\t\t\tonOpen={onOpen}\n\t\t\t\t\tpoint={point}\n\t\t\t\t\tportalProps={{\n\t\t\t\t\t\tid: PORTAL_LAYERS.CALLOUT.name,\n\t\t\t\t\t\tlayer: PORTAL_LAYERS.CALLOUT\n\t\t\t\t\t}}\n\t\t\t\t\tposition={position}\n\t\t\t\t\tspacing={spacing}\n\t\t\t\t\ttriggerRef={triggerRef}\n\t\t\t\t\t{...rest}\n\t\t\t\t>\n\t\t\t\t\t<div className={styles['MrlCallout--content']}>\n\t\t\t\t\t\t{eyebrow && (\n\t\t\t\t\t\t\t<MrlText attrs={{ className: styles['MrlCallout--eyebrow'] }} text={eyebrow} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{title && (\n\t\t\t\t\t\t\t<MrlTextHeading className={styles['MrlCallout--title']} level=\"2\" text={title} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{description && (\n\t\t\t\t\t\t\t<div className={styles['MrlCallout--description']}>\n\t\t\t\t\t\t\t\t{typeof description === 'string' ? <MrlText text={description} /> : description}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{image && <div className={styles['MrlCallout--image']}>{image}</div>}\n\t\t\t\t\t\t{(primaryCta || secondaryCta) && (\n\t\t\t\t\t\t\t<div className={styles['MrlCallout--footer']}>\n\t\t\t\t\t\t\t\t{secondaryCta && (\n\t\t\t\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\t\t\t\tdata-qa={secondaryCta.dataQa}\n\t\t\t\t\t\t\t\t\t\tkind={secondaryCtaKind}\n\t\t\t\t\t\t\t\t\t\tonClick={secondaryCta.onClick}\n\t\t\t\t\t\t\t\t\t\ttext={secondaryCta.text}\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{primaryCta && (\n\t\t\t\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\t\t\t\tdata-qa={primaryCta.dataQa}\n\t\t\t\t\t\t\t\t\t\tkind={primaryCtaKind}\n\t\t\t\t\t\t\t\t\t\tonClick={primaryCta.onClick}\n\t\t\t\t\t\t\t\t\t\ttext={primaryCta.text}\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</MrlPopover>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["MrlCallout","props","savedContent","useRef","show","current","alignment","description","eyebrow","image","kind","title","_ref","_objectSpread","ariaControls","_ref$alignment","children","_ref$disableClickOuts","disableClickOutside","_ref$disableFocusTrap","disableFocusTrap","_ref$hasCloseButton","hasCloseButton","_ref$kind","onOpen","onClose","_ref$point","point","_ref$position","position","primaryCta","secondaryCta","_ref$show","spacing","rest","_objectWithoutProperties","_excluded","React","isValidElement","type","Fragment","Error","calloutId","useMemo","getUniqueId","triggerRef","childElement","Children","map","child","cloneElement","role","id","useEffect","document","querySelector","concat","popoverKind","primaryCtaKind","secondaryCtaKind","createElement","MrlPopover","_extends","actionState","actionType","isOpen","className","styles","disableClickToOpen","portalProps","PORTAL_LAYERS","CALLOUT","name","layer","MrlText","attrs","text","MrlTextHeading","level","MrlButton","dataQa","onClick","size"],"mappings":"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"}
+{"version":3,"file":"MrlCallout.js","sources":["../../../../../src/components/callout/MrlCallout/MrlCallout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MrlPopover, MrlPopoverProps } from '../../popover';\nimport { MrlText, MrlTextHeading } from '../../text';\nimport styles from './MrlCallout.module.scss';\nimport { MrlButton } from '../../button';\nimport { getUniqueId } from '../../../utils';\nimport { PORTAL_LAYERS } from '../../../utils/layers';\nimport { useRef } from 'react';\n\nexport type MrlCalloutPopoverProps = Omit<\n\tMrlPopoverProps,\n\t'children' | 'actionState' | 'isSubMenu' | 'triggerRef' | 'kind'\n>;\n\ninterface MrlCalloutCTA {\n\tonClick: () => void;\n\tdataQa?: string;\n\ttext: string;\n}\n\nexport type CalloutKind = 'primary' | 'secondary';\n\nexport interface MrlCalloutProps extends MrlCalloutPopoverProps {\n\t/** a unique id that binds the callout content and the trigger for assistive technologies */\n\tariaControls?: string;\n\tautoFocus?: boolean;\n\tchildren: React.ReactElement;\n\tdisableClickOutside?: boolean;\n\tdescription?: string | JSX.Element;\n\teyebrow?: string;\n\tid?: string;\n\timage?: JSX.Element;\n\tkind?: CalloutKind;\n\trenderWithPortal?: boolean;\n\tshow: boolean;\n\ttitle?: string;\n\tprimaryCta?: MrlCalloutCTA;\n\tsecondaryCta?: MrlCalloutCTA;\n}\n\ntype MrlCalloutContent = Pick<\n\tMrlCalloutProps,\n\t'alignment' | 'description' | 'eyebrow' | 'image' | 'kind' | 'title'\n>;\n\n/**\n * MrlCallout component.\n *\n * @param props - The props.\n * @returns {React.ReactElement} The MrlCallout component.\n */\nexport const MrlCallout = (props: MrlCalloutProps): React.ReactElement => {\n\t// In some cases when `show` is false, the content is also null or empty.\n\t// At the same time callout shows fade-out animation and do not disappear immediately.\n\t// Saving last visible content to show it while animating on close.\n\tconst savedContent = useRef<MrlCalloutContent>();\n\tif (props.show) {\n\t\tsavedContent.current = {\n\t\t\talignment: props.alignment,\n\t\t\tdescription: props.description,\n\t\t\teyebrow: props.eyebrow,\n\t\t\timage: props.image,\n\t\t\tkind: props.kind,\n\t\t\ttitle: props.title\n\t\t};\n\t}\n\n\tconst {\n\t\tariaControls,\n\t\talignment = 'center',\n\t\tchildren,\n\t\tdescription,\n\t\tdisableClickOutside = true,\n\t\tdisableFocusTrap = true,\n\t\teyebrow,\n\t\thasCloseButton = true,\n\t\timage,\n\t\tkind = 'primary',\n\t\tonOpen,\n\t\tonClose,\n\t\tpoint = true,\n\t\tposition = 'bottom',\n\t\tprimaryCta,\n\t\tsecondaryCta,\n\t\tshow = true,\n\t\tspacing,\n\t\ttitle,\n\t\t...rest\n\t} = props.show ? props : { ...props, ...savedContent.current };\n\n\tif (React.isValidElement(children) && children.type === React.Fragment) {\n\t\tthrow new Error(\n\t\t\t'MrlCallout accepts a single child and does not accept a React.Fragment as a child.'\n\t\t);\n\t}\n\n\tconst calloutId = React.useMemo(() => getUniqueId('callout-append'), []);\n\tconst triggerRef = React.useRef<HTMLElement | null>(null);\n\n\tconst childElement = React.useMemo(() => {\n\t\treturn React.Children.map(children, (child) => {\n\t\t\treturn React.cloneElement(child, {\n\t\t\t\t...child.props,\n\t\t\t\t/** if the callout is tied to an interactive element we need to ensure that it has role=\"button\" */\n\t\t\t\t...(child.type !== 'button' && { role: 'button' }),\n\t\t\t\t'aria-controls': ariaControls,\n\t\t\t\t'aria-expanded': show,\n\t\t\t\tid: calloutId\n\t\t\t});\n\t\t});\n\t}, [calloutId, children, show, ariaControls]);\n\n\t// Setting trigger ref to the element with the calloutId (set above in the childElement useMemo)\n\t//\n\t// We are using querySelector to set the triggerRef instead of assigning a ref directly in childElement because\n\t// a child element may already have a ref assigned to it and we don't want to override it.\n\tReact.useEffect(() => {\n\t\ttriggerRef.current = document.querySelector(`#${calloutId}`) as HTMLElement;\n\t}, [calloutId]);\n\n\tconst popoverKind = kind === 'primary' ? 'inverse' : 'primary';\n\tconst primaryCtaKind = kind === 'primary' ? 'inverse' : 'secondary';\n\tconst secondaryCtaKind = kind === 'primary' ? 'ghost-inverse' : 'ghost';\n\n\treturn (\n\t\t<>\n\t\t\t{childElement}\n\t\t\t{triggerRef && (\n\t\t\t\t<MrlPopover\n\t\t\t\t\tactionState={{ actionType: 'click', isOpen: show }}\n\t\t\t\t\talignment={alignment}\n\t\t\t\t\tclassName={styles['MrlCallout']}\n\t\t\t\t\tdisableClickToOpen\n\t\t\t\t\tdisableClickOutside={disableClickOutside}\n\t\t\t\t\tdisableFocusTrap={disableFocusTrap}\n\t\t\t\t\thasCloseButton={hasCloseButton}\n\t\t\t\t\tkind={popoverKind}\n\t\t\t\t\tonClose={onClose}\n\t\t\t\t\tonOpen={onOpen}\n\t\t\t\t\tpoint={point}\n\t\t\t\t\tportalProps={{\n\t\t\t\t\t\tid: PORTAL_LAYERS.CALLOUT.name,\n\t\t\t\t\t\tlayer: PORTAL_LAYERS.CALLOUT\n\t\t\t\t\t}}\n\t\t\t\t\tposition={position}\n\t\t\t\t\tspacing={spacing}\n\t\t\t\t\ttriggerRef={triggerRef}\n\t\t\t\t\t{...rest}\n\t\t\t\t>\n\t\t\t\t\t<div className={styles['MrlCallout--content']}>\n\t\t\t\t\t\t{eyebrow && (\n\t\t\t\t\t\t\t<MrlText attrs={{ className: styles['MrlCallout--eyebrow'] }} text={eyebrow} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{title && (\n\t\t\t\t\t\t\t<MrlTextHeading className={styles['MrlCallout--title']} level=\"2\" text={title} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{description && (\n\t\t\t\t\t\t\t<div className={styles['MrlCallout--description']}>\n\t\t\t\t\t\t\t\t{typeof description === 'string' ? <MrlText text={description} /> : description}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{image && <div className={styles['MrlCallout--image']}>{image}</div>}\n\t\t\t\t\t\t{(primaryCta || secondaryCta) && (\n\t\t\t\t\t\t\t<div className={styles['MrlCallout--footer']}>\n\t\t\t\t\t\t\t\t{secondaryCta && (\n\t\t\t\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\t\t\t\tdata-qa={secondaryCta.dataQa}\n\t\t\t\t\t\t\t\t\t\tkind={secondaryCtaKind}\n\t\t\t\t\t\t\t\t\t\tonClick={secondaryCta.onClick}\n\t\t\t\t\t\t\t\t\t\ttext={secondaryCta.text}\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{primaryCta && (\n\t\t\t\t\t\t\t\t\t<MrlButton\n\t\t\t\t\t\t\t\t\t\tdata-qa={primaryCta.dataQa}\n\t\t\t\t\t\t\t\t\t\tkind={primaryCtaKind}\n\t\t\t\t\t\t\t\t\t\tonClick={primaryCta.onClick}\n\t\t\t\t\t\t\t\t\t\ttext={primaryCta.text}\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</MrlPopover>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["MrlCallout","props","savedContent","useRef","show","current","alignment","description","eyebrow","image","kind","title","_ref","_objectSpread","ariaControls","_ref$alignment","children","_ref$disableClickOuts","disableClickOutside","_ref$disableFocusTrap","disableFocusTrap","_ref$hasCloseButton","hasCloseButton","_ref$kind","onOpen","onClose","_ref$point","point","_ref$position","position","primaryCta","secondaryCta","_ref$show","spacing","rest","_objectWithoutProperties","_excluded","React","isValidElement","type","Fragment","Error","calloutId","useMemo","getUniqueId","triggerRef","childElement","Children","map","child","cloneElement","role","id","useEffect","document","querySelector","concat","popoverKind","primaryCtaKind","secondaryCtaKind","createElement","MrlPopover","_extends","actionState","actionType","isOpen","className","styles","disableClickToOpen","portalProps","PORTAL_LAYERS","CALLOUT","name","layer","MrlText","attrs","text","MrlTextHeading","level","MrlButton","dataQa","onClick","size"],"mappings":"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"}

package/dist/esm/components/container/MrlContainer/MrlContainer.js

@@ -1,4 +1,4 @@
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import * as React from 'react';
 import classnames from 'classnames';
 import { defaults } from '../constants.js';
@@ -21,9 +21,12 @@ function MrlContainer(_ref) {
     _ref$kind = _ref.kind,
     kind = _ref$kind === void 0 ? defaults.kind : _ref$kind,
     remainingProps = _objectWithoutProperties(_ref, _excluded);
-  var allClasses = classnames(_defineProperty(_defineProperty(_defineProperty({
-    'mrl-container': true
-  }, styles.MrlContainer, true), styles["MrlContainer--".concat(kind)], kind !== defaults.kind), "MrlContainer--".concat(kind), kind !== defaults.kind), className);
+  var allClasses = classnames({
+    'mrl-container': true,
+    [styles.MrlContainer]: true,
+    [styles["MrlContainer--".concat(kind)]]: kind !== defaults.kind,
+    ["MrlContainer--".concat(kind)]: kind !== defaults.kind
+  }, className);
   return /*#__PURE__*/React.createElement("div", _extends({}, remainingProps, {
     className: allClasses
   }), kind === 'nested-options' ? /*#__PURE__*/React.createElement("div", {

package/dist/esm/components/container/MrlContainer/MrlContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlContainer.js","sources":["../../../../../src/components/container/MrlContainer/MrlContainer.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { defaults, Kind } from '../constants';\nimport { MrlComponentProps } from '../../../utils';\nimport styles from './MrlContainer.module.scss';\n\n// If we dont omit style from MrlComponentProps and re-add it in MrlContainerProps, we get an error.\nexport interface MrlContainerProps\n\textends Omit<MrlComponentProps, 'style'>,\n\t\tReact.ComponentProps<'div'> {\n\t/** Children to be rendered within the component */\n\tchildren: React.ReactNode;\n\tclassName?: string;\n\t/**\n\t * Defines which color scheme to used based on the background color of the container.\n\t * White/light backgrounds should use \"default\" and dark/saturated color backgrounds\n\t * should use \"inverse\".\n\t */\n\tkind?: Kind;\n}\n\n/**\n * Used to visually and group content and\n * provide structure in layouts.\n *\n * @param props - component props\n * @returns a MrlContainer React component.\n */\nexport function MrlContainer({\n\tchildren,\n\tclassName,\n\tkind = defaults.kind,\n\t...remainingProps\n}: MrlContainerProps): JSX.Element {\n\tconst allClasses = classnames(\n\t\t{\n\t\t\t'mrl-container': true,\n\t\t\t[styles.MrlContainer]: true,\n\t\t\t[styles[`MrlContainer--${kind}`]]: kind !== defaults.kind,\n\t\t\t[`MrlContainer--${kind}`]: kind !== defaults.kind\n\t\t},\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<div {...remainingProps} className={allClasses}>\n\t\t\t{kind === 'nested-options' ? (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classnames(\n\t\t\t\t\t\tstyles['MrlContainer--nested-options-container'],\n\t\t\t\t\t\t'MrlContainer--nested-options-container'\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={classnames(\n\t\t\t\t\t\t\tstyles['MrlContainer--nested-options-divider'],\n\t\t\t\t\t\t\t'MrlContainer--nested-options-divider'\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t\t<div>{children}</div>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\tchildren\n\t\t\t)}\n\t\t</div>\n\t);\n}\n"],"names":["MrlContainer","_ref","children","className","_ref$kind","kind","defaults","remainingProps","_objectWithoutProperties","_excluded","allClasses","classnames","_defineProperty","styles","concat","React","createElement","_extends"],"mappings":";;;;;;;;AAMA;;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,YAAYA,CAAAC,IAAA,EAKO;AAAA,EAAA,IAJlCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAAC,SAAA,GAAAH,IAAA,CACTI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,MAAA,GAAGE,QAAQ,CAACD,IAAI,GAAAD,SAAA;AACjBG,IAAAA,cAAc,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;EAEjB,IAAMC,UAAU,GAAGC,UAAU,CAAAC,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAA;AAE3B,IAAA,eAAe,EAAE;AAAI,GAAA,EACpBC,MAAM,CAACb,YAAY,EAAG,IAAI,CAAA,EAC1Ba,MAAM,CAAA,gBAAA,CAAAC,MAAA,CAAkBT,IAAI,CAAA,CAAG,EAAGA,IAAI,KAAKC,QAAQ,CAACD,IAAI,CAAA,EAAA,gBAAA,CAAAS,MAAA,CACvCT,IAAI,CAAA,EAAKA,IAAI,KAAKC,QAAQ,CAACD,IAAI,CAAA,EAElDF,SACD,CAAC;AAED,EAAA,oBACCY,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,KAASV,cAAc,EAAA;AAAEJ,IAAAA,SAAS,EAAEO;AAAW,GAAA,CAAA,EAC7CL,IAAI,KAAK,gBAAgB,gBACzBU,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACCb,SAAS,EAAEQ,UAAU,CACpBE,MAAM,CAAC,wCAAwC,CAAC,EAChD,wCACD;GAAE,eAEFE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACCb,SAAS,EAAEQ,UAAU,CACpBE,MAAM,CAAC,sCAAsC,CAAC,EAC9C,sCACD;GACA,CAAC,eACFE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA,IAAA,EAAMd,QAAc,CAChB,CAAC,GAENA,QAEG,CAAC;AAER;;;;"}
+{"version":3,"file":"MrlContainer.js","sources":["../../../../../src/components/container/MrlContainer/MrlContainer.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { defaults, Kind } from '../constants';\nimport { MrlComponentProps } from '../../../utils';\nimport styles from './MrlContainer.module.scss';\n\n// If we dont omit style from MrlComponentProps and re-add it in MrlContainerProps, we get an error.\nexport interface MrlContainerProps\n\textends Omit<MrlComponentProps, 'style'>,\n\t\tReact.ComponentProps<'div'> {\n\t/** Children to be rendered within the component */\n\tchildren: React.ReactNode;\n\tclassName?: string;\n\t/**\n\t * Defines which color scheme to used based on the background color of the container.\n\t * White/light backgrounds should use \"default\" and dark/saturated color backgrounds\n\t * should use \"inverse\".\n\t */\n\tkind?: Kind;\n}\n\n/**\n * Used to visually and group content and\n * provide structure in layouts.\n *\n * @param props - component props\n * @returns a MrlContainer React component.\n */\nexport function MrlContainer({\n\tchildren,\n\tclassName,\n\tkind = defaults.kind,\n\t...remainingProps\n}: MrlContainerProps): JSX.Element {\n\tconst allClasses = classnames(\n\t\t{\n\t\t\t'mrl-container': true,\n\t\t\t[styles.MrlContainer]: true,\n\t\t\t[styles[`MrlContainer--${kind}`]]: kind !== defaults.kind,\n\t\t\t[`MrlContainer--${kind}`]: kind !== defaults.kind\n\t\t},\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<div {...remainingProps} className={allClasses}>\n\t\t\t{kind === 'nested-options' ? (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classnames(\n\t\t\t\t\t\tstyles['MrlContainer--nested-options-container'],\n\t\t\t\t\t\t'MrlContainer--nested-options-container'\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={classnames(\n\t\t\t\t\t\t\tstyles['MrlContainer--nested-options-divider'],\n\t\t\t\t\t\t\t'MrlContainer--nested-options-divider'\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t\t<div>{children}</div>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\tchildren\n\t\t\t)}\n\t\t</div>\n\t);\n}\n"],"names":["MrlContainer","_ref","children","className","_ref$kind","kind","defaults","remainingProps","_objectWithoutProperties","_excluded","allClasses","classnames","styles","concat","React","createElement","_extends"],"mappings":";;;;;;;;AAMA;;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,YAAYA,CAAAC,IAAA,EAKO;AAAA,EAAA,IAJlCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAAC,SAAA,GAAAH,IAAA,CACTI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAA,MAAA,GAAGE,QAAQ,CAACD,IAAI,GAAAD,SAAA;AACjBG,IAAAA,cAAc,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA;EAEjB,IAAMC,UAAU,GAAGC,UAAU,CAC5B;AACC,IAAA,eAAe,EAAE,IAAI;AACrB,IAAA,CAACC,MAAM,CAACZ,YAAY,GAAG,IAAI;IAC3B,CAACY,MAAM,CAAA,gBAAA,CAAAC,MAAA,CAAkBR,IAAI,CAAA,CAAG,GAAGA,IAAI,KAAKC,QAAQ,CAACD,IAAI;AACzD,IAAA,CAAA,gBAAA,CAAAQ,MAAA,CAAkBR,IAAI,IAAKA,IAAI,KAAKC,QAAQ,CAACD;GAC7C,EACDF,SACD,CAAC;AAED,EAAA,oBACCW,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,KAAST,cAAc,EAAA;AAAEJ,IAAAA,SAAS,EAAEO;AAAW,GAAA,CAAA,EAC7CL,IAAI,KAAK,gBAAgB,gBACzBS,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACCZ,SAAS,EAAEQ,UAAU,CACpBC,MAAM,CAAC,wCAAwC,CAAC,EAChD,wCACD;GAAE,eAEFE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACCZ,SAAS,EAAEQ,UAAU,CACpBC,MAAM,CAAC,sCAAsC,CAAC,EAC9C,sCACD;GACA,CAAC,eACFE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA,IAAA,EAAMb,QAAc,CAChB,CAAC,GAENA,QAEG,CAAC;AAER;;;;"}

package/dist/esm/components/divider/MrlDivider/MrlDivider.js

@@ -1,4 +1,4 @@
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import classnames from 'classnames';
 import * as React from 'react';
 import { defaults } from '../constants.js';
@@ -29,14 +29,22 @@ function MrlDivider(_ref) {
     weight = _ref$weight === void 0 ? defaults.weight : _ref$weight,
     remainingProps = _objectWithoutProperties(_ref, _excluded);
   var hasDefinedLength = typeof length !== 'undefined' && length !== '';
-  delete attrs["class"];
+  delete attrs.class;
   delete attrs.className;
   var attributes = setAttributes(attrs);
   // apply classes in a logic order, not based on alphabetization
   /* eslint-disable sort-keys */
-  var allClasses = classnames(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
-    'mrl-divider': true
-  }, styles.MrlDivider, true), styles['MrlDivider--center'], hasDefinedLength), styles["MrlDivider--".concat(kind)], kind !== defaults.kind), styles["MrlDivider--".concat(orientation)], true), styles["MrlDivider--".concat(spacing)], orientation === 'horizontal' ? spacing !== defaults.spacing : spacing === 'none'), styles["MrlDivider--".concat(weight)], weight !== defaults.weight), className);
+  var allClasses = classnames({
+    'mrl-divider': true,
+    [styles.MrlDivider]: true,
+    [styles['MrlDivider--center']]: hasDefinedLength,
+    [styles["MrlDivider--".concat(kind)]]: kind !== defaults.kind,
+    // The implementation between the two different orientations is so different so
+    // we want to make sure we are always scoping our CSS instead of overwriting it
+    [styles["MrlDivider--".concat(orientation)]]: true,
+    [styles["MrlDivider--".concat(spacing)]]: orientation === 'horizontal' ? spacing !== defaults.spacing : spacing === 'none',
+    [styles["MrlDivider--".concat(weight)]]: weight !== defaults.weight
+  }, className);
   /* eslint-enable sort-keys */
 
   if (hasDefinedLength) {

package/dist/esm/components/divider/MrlDivider/MrlDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlDivider.js","sources":["../../../../../src/components/divider/MrlDivider/MrlDivider.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport * as React from 'react';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport { defaults, Kind, Orientation, Spacing, Weight } from '../constants';\nimport styles from './MrlDivider.module.scss';\n\ninterface MrlDividerProps {\n\t/**\n\t * Applies additional HTML attributes to the divider element.\n\t */\n\tattrs?: AttrsObject;\n\tclassName?: string;\n\t/**\n\t * Defines which color scheme to used based on the background color of the container.\n\t * White/light backgrounds should use \"default\" and dark/saturated color backgrounds\n\t * should use \"inverse\".\n\t */\n\tkind?: Kind;\n\t/**\n\t * Use to set a width/height of a divider to create an offset from surrounding content.\n\t * This is commonly found in toolbars. Value can be any valid CSS `width/height` value, such as\n\t * a CSS variable or rem value. Warning, vertical dividers may not work if set to a percentage,\n\t * due to browser limitations with calculating dynamic heights. You should not set the parent to\n\t * a static height to make this work as that poses accessibility issues.\n\t */\n\tlength?: string;\n\t/**\n\t * Determines the orientation of the divider based on the sibling elements' orientation.\n\t * Stacked elements should use \"horizontal\" and elements displayed in a row should use\n\t * \"vertical\". Note for the \"vertical\" orientation, only usage between a row of Icon Buttons\n\t * is currently supported.\n\t */\n\torientation?: Orientation;\n\t/**\n\t * Determines how much space to provide between the elements that the divider is separating.\n\t * This option only applies to horizontal orientation.\n\t */\n\tspacing?: Spacing;\n\n\t/**\n\t * Controls the thickness of the divider line. Use \"thin\" for a more subtle divider\n\t * appearance, or \"default\" for the standard divider thickness.\n\t */\n\tweight?: Weight;\n}\n\n/**\n * Used to visually and semantically separate two elements.\n * For visual separation only view this package's mixins\n *\n * @param props - component props\n * @returns a MrlDivider React component.\n */\nexport function MrlDivider({\n\tattrs = {},\n\tclassName = '',\n\tkind = defaults.kind,\n\tlength,\n\torientation = defaults.orientation,\n\tspacing = defaults.spacing,\n\tweight = defaults.weight,\n\t...remainingProps\n}: MrlDividerProps): JSX.Element {\n\tconst hasDefinedLength = typeof length !== 'undefined' && length !== '';\n\n\tdelete attrs.class;\n\tdelete attrs.className;\n\n\tconst attributes = setAttributes(attrs);\n\t// apply classes in a logic order, not based on alphabetization\n\t/* eslint-disable sort-keys */\n\tconst allClasses = classnames(\n\t\t{\n\t\t\t'mrl-divider': true,\n\t\t\t[styles.MrlDivider]: true,\n\t\t\t[styles['MrlDivider--center']]: hasDefinedLength,\n\t\t\t[styles[`MrlDivider--${kind}`]]: kind !== defaults.kind,\n\t\t\t// The implementation between the two different orientations is so different so\n\t\t\t// we want to make sure we are always scoping our CSS instead of overwriting it\n\t\t\t[styles[`MrlDivider--${orientation}`]]: true,\n\t\t\t[styles[`MrlDivider--${spacing}`]]:\n\t\t\t\torientation === 'horizontal' ? spacing !== defaults.spacing : spacing === 'none',\n\t\t\t[styles[`MrlDivider--${weight}`]]: weight !== defaults.weight\n\t\t},\n\t\tclassName\n\t);\n\t/* eslint-enable sort-keys */\n\n\tif (hasDefinedLength) {\n\t\tif (typeof attributes.style === 'undefined') {\n\t\t\tattributes.style = {};\n\t\t}\n\n\t\tif (orientation === 'vertical') {\n\t\t\tattributes.style.height = length;\n\t\t} else {\n\t\t\tattributes.style.width = length;\n\t\t}\n\t}\n\n\treturn (\n\t\t<div\n\t\t\trole=\"separator\"\n\t\t\taria-orientation={orientation}\n\t\t\taria-hidden=\"true\"\n\t\t\t{...attributes}\n\t\t\t{...remainingProps}\n\t\t\tclassName={allClasses}\n\t\t/>\n\t);\n}\n"],"names":["MrlDivider","_ref","_ref$attrs","attrs","_ref$className","className","_ref$kind","kind","defaults","length","_ref$orientation","orientation","_ref$spacing","spacing","_ref$weight","weight","remainingProps","_objectWithoutProperties","_excluded","hasDefinedLength","attributes","setAttributes","allClasses","classnames","_defineProperty","styles","concat","style","height","width","React","createElement","_extends","role"],"mappings":"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"}
+{"version":3,"file":"MrlDivider.js","sources":["../../../../../src/components/divider/MrlDivider/MrlDivider.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport * as React from 'react';\nimport { AttrsObject, setAttributes } from '../../../utils';\nimport { defaults, Kind, Orientation, Spacing, Weight } from '../constants';\nimport styles from './MrlDivider.module.scss';\n\ninterface MrlDividerProps {\n\t/**\n\t * Applies additional HTML attributes to the divider element.\n\t */\n\tattrs?: AttrsObject;\n\tclassName?: string;\n\t/**\n\t * Defines which color scheme to used based on the background color of the container.\n\t * White/light backgrounds should use \"default\" and dark/saturated color backgrounds\n\t * should use \"inverse\".\n\t */\n\tkind?: Kind;\n\t/**\n\t * Use to set a width/height of a divider to create an offset from surrounding content.\n\t * This is commonly found in toolbars. Value can be any valid CSS `width/height` value, such as\n\t * a CSS variable or rem value. Warning, vertical dividers may not work if set to a percentage,\n\t * due to browser limitations with calculating dynamic heights. You should not set the parent to\n\t * a static height to make this work as that poses accessibility issues.\n\t */\n\tlength?: string;\n\t/**\n\t * Determines the orientation of the divider based on the sibling elements' orientation.\n\t * Stacked elements should use \"horizontal\" and elements displayed in a row should use\n\t * \"vertical\". Note for the \"vertical\" orientation, only usage between a row of Icon Buttons\n\t * is currently supported.\n\t */\n\torientation?: Orientation;\n\t/**\n\t * Determines how much space to provide between the elements that the divider is separating.\n\t * This option only applies to horizontal orientation.\n\t */\n\tspacing?: Spacing;\n\n\t/**\n\t * Controls the thickness of the divider line. Use \"thin\" for a more subtle divider\n\t * appearance, or \"default\" for the standard divider thickness.\n\t */\n\tweight?: Weight;\n}\n\n/**\n * Used to visually and semantically separate two elements.\n * For visual separation only view this package's mixins\n *\n * @param props - component props\n * @returns a MrlDivider React component.\n */\nexport function MrlDivider({\n\tattrs = {},\n\tclassName = '',\n\tkind = defaults.kind,\n\tlength,\n\torientation = defaults.orientation,\n\tspacing = defaults.spacing,\n\tweight = defaults.weight,\n\t...remainingProps\n}: MrlDividerProps): JSX.Element {\n\tconst hasDefinedLength = typeof length !== 'undefined' && length !== '';\n\n\tdelete attrs.class;\n\tdelete attrs.className;\n\n\tconst attributes = setAttributes(attrs);\n\t// apply classes in a logic order, not based on alphabetization\n\t/* eslint-disable sort-keys */\n\tconst allClasses = classnames(\n\t\t{\n\t\t\t'mrl-divider': true,\n\t\t\t[styles.MrlDivider]: true,\n\t\t\t[styles['MrlDivider--center']]: hasDefinedLength,\n\t\t\t[styles[`MrlDivider--${kind}`]]: kind !== defaults.kind,\n\t\t\t// The implementation between the two different orientations is so different so\n\t\t\t// we want to make sure we are always scoping our CSS instead of overwriting it\n\t\t\t[styles[`MrlDivider--${orientation}`]]: true,\n\t\t\t[styles[`MrlDivider--${spacing}`]]:\n\t\t\t\torientation === 'horizontal' ? spacing !== defaults.spacing : spacing === 'none',\n\t\t\t[styles[`MrlDivider--${weight}`]]: weight !== defaults.weight\n\t\t},\n\t\tclassName\n\t);\n\t/* eslint-enable sort-keys */\n\n\tif (hasDefinedLength) {\n\t\tif (typeof attributes.style === 'undefined') {\n\t\t\tattributes.style = {};\n\t\t}\n\n\t\tif (orientation === 'vertical') {\n\t\t\tattributes.style.height = length;\n\t\t} else {\n\t\t\tattributes.style.width = length;\n\t\t}\n\t}\n\n\treturn (\n\t\t<div\n\t\t\trole=\"separator\"\n\t\t\taria-orientation={orientation}\n\t\t\taria-hidden=\"true\"\n\t\t\t{...attributes}\n\t\t\t{...remainingProps}\n\t\t\tclassName={allClasses}\n\t\t/>\n\t);\n}\n"],"names":["MrlDivider","_ref","_ref$attrs","attrs","_ref$className","className","_ref$kind","kind","defaults","length","_ref$orientation","orientation","_ref$spacing","spacing","_ref$weight","weight","remainingProps","_objectWithoutProperties","_excluded","hasDefinedLength","class","attributes","setAttributes","allClasses","classnames","styles","concat","style","height","width","React","createElement","_extends","role"],"mappings":"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"}

package/dist/esm/components/empty/default/MrlEmpty.js

@@ -14,7 +14,7 @@ var _excluded = ["graphic", "description", "action", "heading"];
  * @param MrlEmptyProps props
  * @returns MrlEmpty component
  */
-var MrlEmpty = function MrlEmpty(_ref) {
+var MrlEmpty = _ref => {
   var graphic = _ref.graphic,
     description = _ref.description,
     action = _ref.action,

package/dist/esm/components/empty/default/MrlEmpty.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlEmpty.js","sources":["../../../../../src/components/empty/default/MrlEmpty.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlCol, MrlGrid, MrlRow } from '../../grid';\nimport { MrlText, MrlTextHeading } from '../../text';\nimport styles from '../MrlEmpty.module.scss';\n\ninterface MrlEmptyProps {\n\t// icon or graphic\n\tgraphic?: JSX.Element;\n\t// heading\n\theading: string;\n\t// user friendl description\n\tdescription: string;\n\t// action you wish the user to take\n\taction?: JSX.Element;\n}\n\n/**\n * MrlEmpty for when there is no data to display for a single component.\n * @param MrlEmptyProps props\n * @returns MrlEmpty component\n */\nexport const MrlEmpty = ({\n\tgraphic,\n\tdescription,\n\taction,\n\theading,\n\t...rest\n}: MrlEmptyProps): JSX.Element => {\n\tconst classNames = classnames(styles['mrl-empty'], styles['mrl-empty-default']);\n\n\treturn (\n\t\t<MrlGrid className={classNames} {...rest}>\n\t\t\t{graphic && (\n\t\t\t\t<MrlRow align=\"center\" justify=\"center\">\n\t\t\t\t\t<MrlCol col={12}>{graphic}</MrlCol>\n\t\t\t\t</MrlRow>\n\t\t\t)}\n\t\t\t<MrlRow align=\"center\" justify=\"center\" className={styles['mrl-empty-text']}>\n\t\t\t\t<MrlCol col={12}>\n\t\t\t\t\t<MrlTextHeading level=\"4\" hierarchy=\"primary\" size=\"medium\" kind=\"title\">\n\t\t\t\t\t\t{heading}\n\t\t\t\t\t</MrlTextHeading>\n\t\t\t\t</MrlCol>\n\t\t\t\t<MrlCol col={12}>\n\t\t\t\t\t<MrlText size=\"xsmall\" attrs={{ className: styles['mrl-empty-color-text-secondary'] }}>\n\t\t\t\t\t\t{description}\n\t\t\t\t\t</MrlText>\n\t\t\t\t</MrlCol>\n\t\t\t</MrlRow>\n\t\t\t{action && (\n\t\t\t\t<MrlRow align=\"center\" justify=\"center\">\n\t\t\t\t\t<MrlCol col={12}>{action}</MrlCol>\n\t\t\t\t</MrlRow>\n\t\t\t)}\n\t\t</MrlGrid>\n\t);\n};\n"],"names":["MrlEmpty","_ref","graphic","description","action","heading","rest","_objectWithoutProperties","_excluded","classNames","classnames","styles","React","createElement","MrlGrid","_extends","className","MrlRow","align","justify","MrlCol","col","MrlTextHeading","level","hierarchy","size","kind","MrlText","attrs"],"mappings":";;;;;;;;;;;AAiBA;AACA;AACA;AACA;AACA;IACaA,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAMa;AAAA,EAAA,IALjCC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACNC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;AACJC,IAAAA,IAAI,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA,CAAA;AAEP,EAAA,IAAMC,UAAU,GAAGC,UAAU,CAACC,MAAM,CAAC,WAAW,CAAC,EAAEA,MAAM,CAAC,mBAAmB,CAAC,CAAC;AAE/E,EAAA,oBACCC,KAAA,CAAAC,aAAA,CAACC,OAAO,EAAAC,QAAA,CAAA;AAACC,IAAAA,SAAS,EAAEP;GAAW,EAAKH,IAAI,GACtCJ,OAAO,iBACPU,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC;AAAQ,GAAA,eACtCP,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;GAAG,EAAEnB,OAAgB,CAC3B,CACR,eACDU,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC,QAAQ;IAACH,SAAS,EAAEL,MAAM,CAAC,gBAAgB;AAAE,GAAA,eAC3EC,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;AAAG,GAAA,eACfT,KAAA,CAAAC,aAAA,CAACS,cAAc,EAAA;AAACC,IAAAA,KAAK,EAAC,GAAG;AAACC,IAAAA,SAAS,EAAC,SAAS;AAACC,IAAAA,IAAI,EAAC,QAAQ;AAACC,IAAAA,IAAI,EAAC;GAAO,EACtErB,OACc,CACT,CAAC,eACTO,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;AAAG,GAAA,eACfT,KAAA,CAAAC,aAAA,CAACc,OAAO,EAAA;AAACF,IAAAA,IAAI,EAAC,QAAQ;AAACG,IAAAA,KAAK,EAAE;MAAEZ,SAAS,EAAEL,MAAM,CAAC,gCAAgC;AAAE;GAAE,EACpFR,WACO,CACF,CACD,CAAC,EACRC,MAAM,iBACNQ,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC;AAAQ,GAAA,eACtCP,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;GAAG,EAAEjB,MAAe,CAC1B,CAED,CAAC;AAEZ;;;;"}
+{"version":3,"file":"MrlEmpty.js","sources":["../../../../../src/components/empty/default/MrlEmpty.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { MrlCol, MrlGrid, MrlRow } from '../../grid';\nimport { MrlText, MrlTextHeading } from '../../text';\nimport styles from '../MrlEmpty.module.scss';\n\ninterface MrlEmptyProps {\n\t// icon or graphic\n\tgraphic?: JSX.Element;\n\t// heading\n\theading: string;\n\t// user friendl description\n\tdescription: string;\n\t// action you wish the user to take\n\taction?: JSX.Element;\n}\n\n/**\n * MrlEmpty for when there is no data to display for a single component.\n * @param MrlEmptyProps props\n * @returns MrlEmpty component\n */\nexport const MrlEmpty = ({\n\tgraphic,\n\tdescription,\n\taction,\n\theading,\n\t...rest\n}: MrlEmptyProps): JSX.Element => {\n\tconst classNames = classnames(styles['mrl-empty'], styles['mrl-empty-default']);\n\n\treturn (\n\t\t<MrlGrid className={classNames} {...rest}>\n\t\t\t{graphic && (\n\t\t\t\t<MrlRow align=\"center\" justify=\"center\">\n\t\t\t\t\t<MrlCol col={12}>{graphic}</MrlCol>\n\t\t\t\t</MrlRow>\n\t\t\t)}\n\t\t\t<MrlRow align=\"center\" justify=\"center\" className={styles['mrl-empty-text']}>\n\t\t\t\t<MrlCol col={12}>\n\t\t\t\t\t<MrlTextHeading level=\"4\" hierarchy=\"primary\" size=\"medium\" kind=\"title\">\n\t\t\t\t\t\t{heading}\n\t\t\t\t\t</MrlTextHeading>\n\t\t\t\t</MrlCol>\n\t\t\t\t<MrlCol col={12}>\n\t\t\t\t\t<MrlText size=\"xsmall\" attrs={{ className: styles['mrl-empty-color-text-secondary'] }}>\n\t\t\t\t\t\t{description}\n\t\t\t\t\t</MrlText>\n\t\t\t\t</MrlCol>\n\t\t\t</MrlRow>\n\t\t\t{action && (\n\t\t\t\t<MrlRow align=\"center\" justify=\"center\">\n\t\t\t\t\t<MrlCol col={12}>{action}</MrlCol>\n\t\t\t\t</MrlRow>\n\t\t\t)}\n\t\t</MrlGrid>\n\t);\n};\n"],"names":["MrlEmpty","_ref","graphic","description","action","heading","rest","_objectWithoutProperties","_excluded","classNames","classnames","styles","React","createElement","MrlGrid","_extends","className","MrlRow","align","justify","MrlCol","col","MrlTextHeading","level","hierarchy","size","kind","MrlText","attrs"],"mappings":";;;;;;;;;;;AAiBA;AACA;AACA;AACA;AACA;AACO,IAAMA,QAAQ,GAAGC,IAAA,IAMU;AAAA,EAAA,IALjCC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACNC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;AACJC,IAAAA,IAAI,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA,CAAA;AAEP,EAAA,IAAMC,UAAU,GAAGC,UAAU,CAACC,MAAM,CAAC,WAAW,CAAC,EAAEA,MAAM,CAAC,mBAAmB,CAAC,CAAC;AAE/E,EAAA,oBACCC,KAAA,CAAAC,aAAA,CAACC,OAAO,EAAAC,QAAA,CAAA;AAACC,IAAAA,SAAS,EAAEP;GAAW,EAAKH,IAAI,GACtCJ,OAAO,iBACPU,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC;AAAQ,GAAA,eACtCP,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;GAAG,EAAEnB,OAAgB,CAC3B,CACR,eACDU,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC,QAAQ;IAACH,SAAS,EAAEL,MAAM,CAAC,gBAAgB;AAAE,GAAA,eAC3EC,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;AAAG,GAAA,eACfT,KAAA,CAAAC,aAAA,CAACS,cAAc,EAAA;AAACC,IAAAA,KAAK,EAAC,GAAG;AAACC,IAAAA,SAAS,EAAC,SAAS;AAACC,IAAAA,IAAI,EAAC,QAAQ;AAACC,IAAAA,IAAI,EAAC;GAAO,EACtErB,OACc,CACT,CAAC,eACTO,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;AAAG,GAAA,eACfT,KAAA,CAAAC,aAAA,CAACc,OAAO,EAAA;AAACF,IAAAA,IAAI,EAAC,QAAQ;AAACG,IAAAA,KAAK,EAAE;MAAEZ,SAAS,EAAEL,MAAM,CAAC,gCAAgC;AAAE;GAAE,EACpFR,WACO,CACF,CACD,CAAC,EACRC,MAAM,iBACNQ,KAAA,CAAAC,aAAA,CAACI,MAAM,EAAA;AAACC,IAAAA,KAAK,EAAC,QAAQ;AAACC,IAAAA,OAAO,EAAC;AAAQ,GAAA,eACtCP,KAAA,CAAAC,aAAA,CAACO,MAAM,EAAA;AAACC,IAAAA,GAAG,EAAE;GAAG,EAAEjB,MAAe,CAC1B,CAED,CAAC;AAEZ;;;;"}

package/dist/esm/components/empty/large/MrlEmptyLarge.js

@@ -14,7 +14,7 @@ var _excluded = ["graphic", "heading", "description", "action"];
  * @param MrlEmptyProps props
  * @returns MrlEmptyLarge
  */
-var MrlEmptyLarge = function MrlEmptyLarge(_ref) {
+var MrlEmptyLarge = _ref => {
   var graphic = _ref.graphic,
     heading = _ref.heading,
     description = _ref.description,