@muraldevkit/ui-toolkit 2.25.0 → 2.27.0

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

@@ -5,5 +5,5 @@ import './MrlAnimatedIconButton.scss';
 interface MrlAnimatedIconButtonProps extends Omit<MrlIconButtonProps, 'icon'> {
     icon: MrlSvgAnimateProps;
 }
-export declare const MrlAnimatedIconButton: React.ForwardRefExoticComponent<Pick<MrlAnimatedIconButtonProps, "form" | "slot" | "style" | "title" | "text" | "dir" | "name" | "children" | "disabled" | "id" | "defaultValue" | "state" | "kind" | "size" | "attrs" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "type" | "key" | "value" | "client" | "icon" | "badge" | "disableEvents" | "loading" | "loadingText" | "position" | "tipAnchor" | "toggleAria" | "toggleStyle" | "wrapperClassName" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const MrlAnimatedIconButton: React.ForwardRefExoticComponent<Pick<MrlAnimatedIconButtonProps, "form" | "slot" | "style" | "title" | "text" | "dir" | "name" | "children" | "disabled" | "id" | "defaultValue" | "state" | "kind" | "size" | "attrs" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "type" | "key" | "value" | "client" | "icon" | "badge" | "disableEvents" | "loading" | "loadingText" | "position" | "tipAnchor" | "toggleAria" | "toggleStyle" | "tooltipKind" | "wrapperClassName" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;
 export {};

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { MrlButtonKind, MrlButtonSize, MrlButtonState, MrlGhostIconButtonSize, ToggleAria, ToggleStyle } from '../constants';
 import { AttrsObject, MrlComponentProps } from '../../../utils';
-import { MrlTooltipAnchor, MrlTooltipPosition } from '../../tooltip/constants';
+import { MrlTooltipAnchor, MrlTooltipPosition, MrlTooltipVariant } from '../../tooltip/constants';
 import { MrlDeviceClient } from '../../../contexts';
 import './MrlIconButton.scss';
 export interface MrlIconButtonProps extends Omit<MrlComponentProps, 'style'>, React.ComponentProps<'button'> {
@@ -86,9 +86,11 @@ export interface MrlIconButtonProps extends Omit<MrlComponentProps, 'style'>, Re
      * informs the component that this is a toggle button and to add that functionality
      */
     toggleStyle?: ToggleStyle;
+    /** tooltip varient kind */
+    tooltipKind?: MrlTooltipVariant;
     /**
      * An optional class name to add to the tooltip wrapper.
      */
     wrapperClassName?: string;
 }
-export declare const MrlIconButton: React.ForwardRefExoticComponent<Pick<MrlIconButtonProps, "form" | "slot" | "style" | "title" | "text" | "dir" | "name" | "children" | "disabled" | "id" | "defaultValue" | "state" | "kind" | "size" | "attrs" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "type" | "key" | "value" | "client" | "icon" | "badge" | "disableEvents" | "loading" | "loadingText" | "position" | "tipAnchor" | "toggleAria" | "toggleStyle" | "wrapperClassName" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const MrlIconButton: React.ForwardRefExoticComponent<Pick<MrlIconButtonProps, "form" | "slot" | "style" | "title" | "text" | "dir" | "name" | "children" | "disabled" | "id" | "defaultValue" | "state" | "kind" | "size" | "attrs" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "type" | "key" | "value" | "client" | "icon" | "badge" | "disableEvents" | "loading" | "loadingText" | "position" | "tipAnchor" | "toggleAria" | "toggleStyle" | "tooltipKind" | "wrapperClassName" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/index.d.ts

@@ -11,6 +11,7 @@ export * from './loader';
 export * from './menu';
 export * from './modal';
 export * from './notification';
+export * from './popover';
 export * from './svg';
 export * from './table';
 export * from './text';

package/dist/components/menu/MrlMenu/MrlMenu.d.ts

@@ -1,10 +1,5 @@
 import React, { RefObject } from 'react';
-import { MenuPosition, VerticalAlign, HorizontalAlign } from '../constants';
-export type ActionType = 'ArrowUp' | 'ArrowDown' | 'ArrowRight' | 'Enter' | 'Escape' | ' ' | 'click' | null;
-export interface MrlMenuState {
-    actionType: ActionType;
-    isOpen: boolean;
-}
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../constants';
 export interface MrlMenuProps {
     /** Children to be rendered within the menu component*/
     children: React.ReactNode;
@@ -19,12 +14,12 @@ export interface MrlMenuProps {
      */
     isSubMenu?: boolean;
     /**
-     * Kind of menu
+     * spacing of menu
      * - compact has less padding
      *
      * @default 'default'
      */
-    kind?: 'default' | 'compact';
+    spacing?: 'default' | 'compact';
     /**
      * Offset of the menu from the trigger element in pixels
      *
@@ -36,13 +31,13 @@ export interface MrlMenuProps {
      *
      * @default 'bottom'
      */
-    menuPosition?: MenuPosition;
+    position?: MenuPosition;
     /**
      * Set initial state of menu
      *
      * @default { actionType: null, isOpen: false }
      */
-    menuState?: MrlMenuState;
+    actionState?: ActionState;
     /**
      * Reference to the DOM element that triggers this menu.
      */
@@ -74,4 +69,4 @@ export interface MrlMenuProps {
  * @param {MrlMenuProps} props - The props for the MrlMenu component
  * @returns {Element} - rendered MrlMenu component
  */
-export declare function MrlMenu({ children, id, isSubMenu, kind, menuOffset, menuPosition, menuState, verticalAlign, horizontalAlign, onClose, triggerRef }: MrlMenuProps): JSX.Element;
+export declare function MrlMenu({ children, id, isSubMenu, spacing, menuOffset, position, actionState, verticalAlign, horizontalAlign, onClose, triggerRef }: MrlMenuProps): JSX.Element;

package/dist/components/menu/MrlMenu/utilities.d.ts

@@ -35,3 +35,9 @@ export declare const calculateLeftPosition: (overlapsRight: boolean, overlapsLef
  * @returns The top position of the menu
  */
 export declare const calculateTopPosition: (overlapsRight: boolean, overlapsLeft: boolean, triggerRef: React.RefObject<HTMLElement>, menuRect: DOMRect, parentMenu: HTMLElement, triggerRect: DOMRect) => string;
+/**
+ * Prevent default on event
+ *
+ * @param e - The event
+ */
+export declare const preventDefault: (e: React.MouseEvent | React.KeyboardEvent | MouseEvent | KeyboardEvent) => void;

package/dist/components/menu/constants.d.ts

@@ -2,3 +2,8 @@ export type MenuPosition = 'bottom' | 'left' | 'right' | 'top' | 'below';
 export type HorizontalAlign = 'left' | 'right' | 'center';
 export type VerticalAlign = 'top' | 'bottom' | 'center';
 export type MenuIgnore = 'ignore';
+export type ActionType = 'ArrowUp' | 'ArrowDown' | 'ArrowRight' | 'Enter' | 'Escape' | ' ' | 'click' | null;
+export interface ActionState {
+    actionType: ActionType;
+    isOpen: boolean;
+}

package/dist/components/menu/demo/MenuWithLink.d.ts

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-import { MrlMenuState } from '..';
-import { MenuPosition, VerticalAlign, HorizontalAlign } from '../constants';
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../constants';
 interface MenuWithLinkProps {
     menuAlign?: MenuPosition;
     kind?: 'default' | 'compact';
     verticalAlign?: VerticalAlign;
     horizontalAlign?: HorizontalAlign;
-    menuState?: MrlMenuState;
+    menuState?: ActionState;
     onClose?: () => void;
     triggerAlignment?: 'left' | 'right' | 'center';
 }
@@ -16,5 +15,5 @@ interface MenuWithLinkProps {
  * @param {MenuWithLinkProps} props - The props for the menu with trigger
  * @returns {Element} The menu with trigger demo
  */
-export declare const MenuWithLink: ({ menuAlign, verticalAlign, horizontalAlign, kind, menuState, onClose, triggerAlignment }: MenuWithLinkProps) => JSX.Element;
+export declare const MenuWithLink: ({ menuAlign, verticalAlign, horizontalAlign, menuState, onClose, triggerAlignment }: MenuWithLinkProps) => JSX.Element;
 export {};

package/dist/components/menu/demo/MenuWithPopover.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../constants';
+interface MenuWithPopoverProps {
+    position?: MenuPosition;
+    spacing?: 'default' | 'compact';
+    verticalAlign?: VerticalAlign;
+    horizontalAlign?: HorizontalAlign;
+    actionState?: ActionState;
+    onClose?: () => void;
+    triggerAlignment?: 'left' | 'right' | 'center';
+}
+/**
+ * Demo of a menu with a trigger for stories and testing
+ *
+ * @param {MenuWithPopoverProps} props - The props for the menu with trigger
+ * @returns {Element} The menu with trigger demo
+ */
+export declare const MenuWithPopover: ({ position, verticalAlign, horizontalAlign, spacing, actionState, onClose, triggerAlignment }: MenuWithPopoverProps) => JSX.Element;
+export {};

package/dist/components/menu/demo/MenuWithSubmenu.d.ts

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-import { MrlMenuState } from '../';
-import { MenuPosition, VerticalAlign, HorizontalAlign } from '../constants';
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../constants';
 interface MenuWithSubmenuProps {
-    menuAlign?: MenuPosition;
-    kind?: 'default' | 'compact';
+    position?: MenuPosition;
+    spacing?: 'default' | 'compact';
     verticalAlign?: VerticalAlign;
     horizontalAlign?: HorizontalAlign;
-    menuState?: MrlMenuState;
+    actionState?: ActionState;
     onClose?: () => void;
     triggerAlignment?: 'left' | 'right' | 'center';
 }
@@ -16,5 +15,5 @@ interface MenuWithSubmenuProps {
  * @param {MenuWithSubmenuProps} props - The props for the menu with trigger
  * @returns {Element} The menu with trigger demo
  */
-export declare const MenuWithSubmenu: ({ menuAlign, verticalAlign, horizontalAlign, kind, menuState, onClose, triggerAlignment }: MenuWithSubmenuProps) => JSX.Element;
+export declare const MenuWithSubmenu: ({ position, verticalAlign, horizontalAlign, spacing, actionState, onClose, triggerAlignment }: MenuWithSubmenuProps) => JSX.Element;
 export {};

package/dist/components/menu/demo/MenuWithTrigger.d.ts

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-import { MrlMenuState } from '../';
-import { MenuPosition, VerticalAlign, HorizontalAlign } from '../constants';
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../constants';
 interface MenuWithTriggerProps {
-    menuAlign?: MenuPosition;
-    kind?: 'default' | 'compact';
+    position?: MenuPosition;
+    spacing?: 'default' | 'compact';
     verticalAlign?: VerticalAlign;
     horizontalAlign?: HorizontalAlign;
-    menuState?: MrlMenuState;
+    actionState?: ActionState;
     onClose?: () => void;
     triggerAlignment?: 'left' | 'right' | 'center';
 }
@@ -16,5 +15,5 @@ interface MenuWithTriggerProps {
  * @param {MenuWithTriggerProps} props - The props for the menu with trigger
  * @returns {Element} The menu with trigger demo
  */
-export declare const MenuWithTrigger: ({ menuAlign, verticalAlign, horizontalAlign, kind, menuState, onClose, triggerAlignment }: MenuWithTriggerProps) => JSX.Element;
+export declare const MenuWithTrigger: ({ position, verticalAlign, horizontalAlign, spacing, actionState, onClose, triggerAlignment }: MenuWithTriggerProps) => JSX.Element;
 export {};

package/dist/components/menu/hooks/useBrowserEdgeScroll.d.ts

@@ -0,0 +1,20 @@
+import { MenuPosition } from '../constants';
+interface ElementScrollStyles {
+    isScrolling: boolean;
+    styles: AdjustedElementStyle;
+}
+interface AdjustedElementStyle {
+    maxHeight: string;
+}
+/**
+ * useBrowserEdgeScroll hook
+ *
+ * This hook will calculate if an element's top or bottom edge bleed over the viewport edge
+ * and will provide a max height value for the element to allow it to scroll instead of bleed over
+ *
+ * @param elementRef - reference to the DOM element that is the menu
+ * @param elementAlign - the alignment of the menu
+ * @returns AdjustedElementStyle - returns the new updated style for scrolling the menu
+ */
+export declare const useBrowserEdgeScroll: (elementRef: React.RefObject<HTMLElement>, elementAlign?: MenuPosition) => ElementScrollStyles;
+export {};

package/dist/components/modal/MrlModal/MrlModal.d.ts

@@ -4,6 +4,10 @@ import { ModalSize, ModalState } from '../constants';
 import { MrlDeviceClient } from '../../../contexts/MrlDeviceProvider';
 import './MrlModal.global.scss';
 interface ModalProps extends MrlComponentProps {
+    /**
+     * Aria label for the modal
+     */
+    ariaLabel?: string;
     /**
      * Content of the modal
      */
@@ -47,5 +51,5 @@ interface ModalProps extends MrlComponentProps {
  * @param {React.ReactElement} props.children - Children to be rendered within the modal. The first child is used as the trigger.
  * @returns {React.ReactElement} an instance of the MrlModal
  */
-export declare const MrlModal: ({ children, className, client, closable, loading, size, state, hookClose, attrs }: ModalProps) => ReactElement;
+export declare const MrlModal: ({ ariaLabel, children, className, client, closable, loading, size, state, hookClose, attrs }: ModalProps) => ReactElement;
 export {};

package/dist/components/popover/MrlPopover/MrlPopover.d.ts

@@ -0,0 +1,79 @@
+import React, { RefObject } from 'react';
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../../menu/constants';
+export interface MrlPopoverProps {
+    /** Label for the popover */
+    ariaLabel?: string;
+    /** ID of element to associate a label */
+    ariaLabelledBy?: string;
+    /** Children to be rendered within the menu component*/
+    children: React.ReactNode;
+    /** If the popover should have a close button */
+    hasCloseButton?: boolean;
+    /** If the popover should close when clicking outside of the menu */
+    disableClickOutside?: boolean;
+    /**
+     * spacing of menu
+     * - 'default' has 16px padding
+     * - 'compact' has 12px padding
+     */
+    spacing?: 'default' | 'compact';
+    /** Unique identifier for the menu */
+    id?: string;
+    /** If the menu is a submenu */
+    isSubMenu?: boolean;
+    /**
+     * Horizontal and vertical alignment of the menu relative to the trigger element
+     *
+     * @default 'bottom'
+     */
+    position?: MenuPosition;
+    /**
+     * Set initial state of menu
+     *
+     * @default { actionType: null, isOpen: false }
+     */
+    actionState?: ActionState;
+    /**
+     * Reference to the DOM element that triggers this menu.
+     */
+    triggerRef?: RefObject<HTMLButtonElement>;
+    /**
+     * Vertical alignment of the menu relative to the trigger element
+     *
+     * @default 'center'
+     */
+    verticalAlign?: VerticalAlign;
+    /**
+     * Horizontal alignment of the menu relative to the trigger element
+     *
+     * @default 'left'
+     */
+    horizontalAlign?: HorizontalAlign;
+    /**
+     * If the menu should be rendered with the inverse theme
+     *
+     * @default 'primary'
+     */
+    kind?: 'primary' | 'inverse';
+    /**
+     * If the menu should have a pointer element
+     *
+     * @default false
+     */
+    point?: boolean;
+    /**
+     * Callback to be called when the menu is closed
+     *
+     * @param type - type of close event
+     */
+    onClose?: (type?: string) => void;
+}
+/**
+ * MrlPopover
+ *
+ * Renders a popover component with alignment relative to a trigger element
+ *
+ * @param {MrlPopoverProps} props - The props for the MrlPopover component
+ * @returns {Element} - rendered MrlPopover component
+ */
+export declare function MrlPopover({ ariaLabel, ariaLabelledBy, children, disableClickOutside, hasCloseButton, spacing, id, isSubMenu, actionState, position, verticalAlign, horizontalAlign, point, kind, onClose, triggerRef, ...rest }: MrlPopoverProps): JSX.Element;

package/dist/components/popover/MrlPopover/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlPopover';

package/dist/components/popover/demo/PopoverWithTrigger.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { MenuPosition, VerticalAlign, HorizontalAlign, ActionState } from '../../menu/constants';
+interface PopoverWithTriggerProps {
+    hasCloseButton?: boolean;
+    menuAlign?: MenuPosition;
+    spacing?: 'default' | 'compact';
+    verticalAlign?: VerticalAlign;
+    horizontalAlign?: HorizontalAlign;
+    actionState?: ActionState;
+    onClose?: () => void;
+    triggerAlignment?: 'left' | 'right' | 'center';
+    kind?: 'inverse' | 'primary';
+    point?: boolean;
+}
+/**
+ * Demo of a menu with a trigger for stories and testing
+ *
+ * @param {PopoverWithTriggerProps} props - The props for the menu with trigger
+ * @returns {Element} The menu with trigger demo
+ */
+export declare const PopoverWithTrigger: ({ menuAlign, verticalAlign, horizontalAlign, actionState, onClose, triggerAlignment, spacing, kind, point, hasCloseButton }: PopoverWithTriggerProps) => JSX.Element;
+export {};

package/dist/components/popover/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlPopover';

package/dist/components/tooltip/MrlTooltip/MrlTooltip.d.ts

@@ -1,6 +1,6 @@
 import React, { ReactElement } from 'react';
 import { AttrsObject } from '../../../utils';
-import { MrlTooltipAnchor, MrlTooltipPosition } from '../constants';
+import { MrlTooltipAnchor, MrlTooltipPosition, MrlTooltipVariant } from '../constants';
 interface MrlTooltipProps {
     /** The arrow position of the tooltip in relation to its trigger's content */
     anchor?: MrlTooltipAnchor;
@@ -17,6 +17,8 @@ interface MrlTooltipProps {
      * are passed in the component will not have event handling for the additional child elements.
      */
     children: React.ReactElement;
+    /** The kind of tooltip to be rendered */
+    kind?: MrlTooltipVariant;
     /** The placement of the tooltip in relation to its trigger */
     position?: MrlTooltipPosition;
     /** The textual label of tooltip */

package/dist/components/tooltip/MrlTooltipContent/MrlTooltipContent.d.ts

@@ -1,6 +1,6 @@
 import { ReactElement } from 'react';
 import { AttrsObject } from '../../../utils';
-import { MrlTooltipAnchor, MrlTooltipPosition } from '../constants';
+import { MrlTooltipAnchor, MrlTooltipPosition, MrlTooltipVariant } from '../constants';
 import './MrlTooltipContent.global.scss';
 interface MrlTooltipContentProps {
     /**
@@ -15,6 +15,8 @@ interface MrlTooltipContentProps {
      * Example usage: html attributes, custom data attributes (data-qa), aria
      */
     attrs: AttrsObject;
+    /** The kind of tooltip to be rendered */
+    kind: MrlTooltipVariant;
     /** The id of the tooltip used for aria-describedby in the parent component */
     id: string;
     /** The placement of the tooltip in relation to its trigger */

package/dist/components/tooltip/constants.d.ts

@@ -8,9 +8,9 @@ export declare const allowedMrlTooltipValues: {
     positions: readonly ["top", "bottom", "left", "right"];
     state: readonly ["show", "hide"];
 };
-export type MrlTooltipPosition = typeof allowedMrlTooltipValues.positions[number];
-export type MrlTooltipAnchor = typeof allowedMrlTooltipValues.anchors[number];
-export type MrlTooltipState = typeof allowedMrlTooltipValues.state[number];
+export type MrlTooltipPosition = (typeof allowedMrlTooltipValues.positions)[number];
+export type MrlTooltipAnchor = (typeof allowedMrlTooltipValues.anchors)[number];
+export type MrlTooltipState = (typeof allowedMrlTooltipValues.state)[number];
 export interface MrlTooltipDefaults {
     anchor: MrlTooltipAnchor;
     attrs: AttrsObject;
@@ -22,3 +22,4 @@ export interface MrlTooltipDefaults {
  * Shared between the component and Storybook
  */
 export declare const MrlTooltipDefaults: MrlTooltipDefaults;
+export type MrlTooltipVariant = 'default' | 'inverse';

package/dist/hooks/useClickOutside/index.d.ts

@@ -4,5 +4,6 @@ import { RefObject } from 'react';
  *
  * @param menuRef - Reference to the DOM element that caused this menu to be shown.
  * @param onOutsideClick - Function to call when a click is detected outside the menuRef element
+ * @param disabled - If the hook should be disabled
  */
-export declare const useClickOutside: (menuRef: RefObject<HTMLElement>, onOutsideClick: () => void) => void;
+export declare const useClickOutside: (menuRef: RefObject<HTMLElement>, onOutsideClick: () => void, disabled?: boolean) => void;