@muraldevkit/ui-toolkit 1.13.3 → 1.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/button/MrlAnimatedIconButton/MrlAnimatedIconButton.d.ts +1 -1
- package/dist/components/button/MrlButton/MrlButton.d.ts +1 -1
- package/dist/components/button/MrlIconButton/MrlIconButton.d.ts +1 -1
- package/dist/components/form/MrlSelect/select.d.ts +1 -1
- package/dist/components/form/MrlSelectItem/index.d.ts +5 -1
- package/dist/components/form/MrlSelectMenu/index.d.ts +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/modal/MrlModal/index.d.ts +1 -1
- package/dist/components/notification/MrlBlockNotification/index.d.ts +66 -0
- package/dist/components/notification/constants.d.ts +36 -0
- package/dist/components/notification/index.d.ts +1 -0
- package/dist/components/svg/MrlSvg/MrlSvg.d.ts +1 -1
- package/dist/components/tooltip/MrlTooltip/MrlTooltip.d.ts +1 -1
- package/dist/components/tooltip/MrlTooltipContent/MrlTooltipContent.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/styles/MrlBlockNotification/global.scss +24 -0
- package/dist/styles/MrlBlockNotification/mixins.scss +48 -0
- package/dist/styles/MrlBlockNotification/module.scss +78 -0
- package/dist/styles/MrlBlockNotification/variables.scss +37 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/noop/index.d.ts +7 -0
- package/dist/utils/setAttributes/setAttributes.d.ts +3 -3
- package/package.json +1 -1
|
@@ -5,5 +5,5 @@ import './MrlAnimatedIconButton.scss';
|
|
|
5
5
|
interface MrlAnimatedIconButtonProps extends Omit<MrlIconButtonProps, 'icon'> {
|
|
6
6
|
icon: MrlSvgAnimateProps;
|
|
7
7
|
}
|
|
8
|
-
export declare const MrlAnimatedIconButton: React.ForwardRefExoticComponent<Pick<MrlAnimatedIconButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "
|
|
8
|
+
export declare const MrlAnimatedIconButton: React.ForwardRefExoticComponent<Pick<MrlAnimatedIconButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "slot" | "dir" | "role" | "name" | "id" | "lang" | "type" | "tabIndex" | "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" | "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" | "key" | "value" | "state" | "position" | "kind" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "disabled" | "badge" | "disableEvents" | "icon" | "toggleAria" | "toggleStyle" | "tipAnchor" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;
|
|
9
9
|
export {};
|
|
@@ -71,5 +71,5 @@ interface MrlButtonProps extends Omit<MrlComponentProps, 'style'>, React.Compone
|
|
|
71
71
|
*/
|
|
72
72
|
toggleStyle?: ToggleStyle;
|
|
73
73
|
}
|
|
74
|
-
export declare const MrlButton: React.ForwardRefExoticComponent<Pick<MrlButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "
|
|
74
|
+
export declare const MrlButton: React.ForwardRefExoticComponent<Pick<MrlButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "slot" | "dir" | "role" | "name" | "id" | "lang" | "type" | "tabIndex" | "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" | "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" | "key" | "value" | "state" | "kind" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "disabled" | "badge" | "disableEvents" | "icon" | "toggleAria" | "toggleStyle" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "iconPos"> & React.RefAttributes<HTMLButtonElement>>;
|
|
75
75
|
export {};
|
|
@@ -71,4 +71,4 @@ export interface MrlIconButtonProps extends Omit<MrlComponentProps, 'style'>, Re
|
|
|
71
71
|
*/
|
|
72
72
|
toggleStyle?: ToggleStyle;
|
|
73
73
|
}
|
|
74
|
-
export declare const MrlIconButton: React.ForwardRefExoticComponent<Pick<MrlIconButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "
|
|
74
|
+
export declare const MrlIconButton: React.ForwardRefExoticComponent<Pick<MrlIconButtonProps, "className" | "color" | "size" | "attrs" | "onClick" | "text" | "form" | "style" | "title" | "children" | "slot" | "dir" | "role" | "name" | "id" | "lang" | "type" | "tabIndex" | "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" | "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" | "key" | "value" | "state" | "position" | "kind" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "disabled" | "badge" | "disableEvents" | "icon" | "toggleAria" | "toggleStyle" | "tipAnchor" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -30,7 +30,7 @@ export interface MrlSelectProptypes extends React.HTMLAttributes<HTMLDivElement>
|
|
|
30
30
|
* Otherwise, the value object needs to be stringified to not receive `"[Object object]"`.
|
|
31
31
|
* Example: `attrs='{ "tabindex": "1" }'`
|
|
32
32
|
*/
|
|
33
|
-
attrs?: AttrsObject
|
|
33
|
+
attrs?: AttrsObject;
|
|
34
34
|
/**
|
|
35
35
|
* menu - list of options for the user to chose from; expects an `MrlSelectMenu` component
|
|
36
36
|
*/
|
|
@@ -18,6 +18,10 @@ export interface MrlSelectItemProptypes extends React.HTMLAttributes<HTMLDivElem
|
|
|
18
18
|
* Example: `attrs='{ "aria-disabled": "true" }'`
|
|
19
19
|
*/
|
|
20
20
|
attrs?: AttrsObject;
|
|
21
|
+
/**
|
|
22
|
+
* Set the item to disabled, this will prevent click and enter events.
|
|
23
|
+
*/
|
|
24
|
+
isDisabled?: boolean;
|
|
21
25
|
/**
|
|
22
26
|
* content for the item
|
|
23
27
|
*/
|
|
@@ -29,4 +33,4 @@ export interface MrlSelectItemProptypes extends React.HTMLAttributes<HTMLDivElem
|
|
|
29
33
|
* @param {MrlSelectItemProptypes} props the props for your MrlLink
|
|
30
34
|
* @returns {React.ReactElement} an a element containing the text you pass
|
|
31
35
|
*/
|
|
32
|
-
export declare const MrlSelectItem: ({ attrs, children, index, value, ...theRest }: MrlSelectItemProptypes) => React.ReactElement;
|
|
36
|
+
export declare const MrlSelectItem: ({ attrs, children, index, value, isDisabled, ...theRest }: MrlSelectItemProptypes) => React.ReactElement;
|
|
@@ -24,7 +24,7 @@ export interface MrlSelectMenuProptypes extends React.HTMLAttributes<HTMLDivElem
|
|
|
24
24
|
* Otherwise, the value object needs to be stringified to not receive `"[Object object]"`.
|
|
25
25
|
* Example: `attrs='{ "tabindex": "0" }'`
|
|
26
26
|
*/
|
|
27
|
-
attrs?: AttrsObject
|
|
27
|
+
attrs?: AttrsObject;
|
|
28
28
|
/**
|
|
29
29
|
* menu - list of options for the user to chose from; expects an `MrlSelectMenu` component
|
|
30
30
|
*/
|
|
@@ -24,7 +24,7 @@ interface ModalProps extends MrlComponentProps {
|
|
|
24
24
|
* @param {ModalSize} props.size - The size of the modal container. Defaults to 'defaults.size'
|
|
25
25
|
* @param {ModalState} props.state - Current state of the modal. Defaults to 'close'
|
|
26
26
|
* @param {Function} props.hookClose - Callback function to be run when the modal closes
|
|
27
|
-
* @param {AttrsObject
|
|
27
|
+
* @param {AttrsObject} props.attrs - Additional HTML attributes to be passed in
|
|
28
28
|
* @param {React.ReactElement} props.children - Children to be rendered within the modal. The first child is used as the trigger.
|
|
29
29
|
* @returns {React.ReactElement} an instance of the MrlModal
|
|
30
30
|
*/
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { AttrsObject } from '../../../utils';
|
|
3
|
+
import { NotificationKind, NotificationIconConfig, NotificationState, NotificationLevel } from '../constants';
|
|
4
|
+
import './styles.global.scss';
|
|
5
|
+
export interface MrlBlockNotificationProps {
|
|
6
|
+
/**
|
|
7
|
+
* Adds CTA button to the notification
|
|
8
|
+
*/
|
|
9
|
+
cta?: React.ReactElement;
|
|
10
|
+
/**
|
|
11
|
+
* The kind of notification to display.
|
|
12
|
+
*
|
|
13
|
+
* Examples: warning, error, info, success
|
|
14
|
+
*/
|
|
15
|
+
kind?: NotificationKind;
|
|
16
|
+
/**
|
|
17
|
+
* Configuration of an icon. Either an icon or a configuration for an icon can be used.
|
|
18
|
+
*/
|
|
19
|
+
iconConfig?: Record<string, unknown> | string | NotificationIconConfig;
|
|
20
|
+
/**
|
|
21
|
+
* Sets header text for notification
|
|
22
|
+
*/
|
|
23
|
+
heading?: string;
|
|
24
|
+
/**
|
|
25
|
+
* Adds a close button to notificaiton if true
|
|
26
|
+
*/
|
|
27
|
+
dismissible?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Sets the primary content for the notification
|
|
30
|
+
*/
|
|
31
|
+
message: React.ReactNode;
|
|
32
|
+
/**
|
|
33
|
+
* Open/Close state of the notification
|
|
34
|
+
*/
|
|
35
|
+
state?: NotificationState;
|
|
36
|
+
/**
|
|
37
|
+
* Open notification callback
|
|
38
|
+
*
|
|
39
|
+
* @returns {void}
|
|
40
|
+
*/
|
|
41
|
+
hookOpen?: () => void;
|
|
42
|
+
/**
|
|
43
|
+
* Close notification callback
|
|
44
|
+
*
|
|
45
|
+
* @returns {void}
|
|
46
|
+
*/
|
|
47
|
+
hookClose?: () => void;
|
|
48
|
+
/**
|
|
49
|
+
* Sets the header level
|
|
50
|
+
* Example output: h1, h2, h3, h4
|
|
51
|
+
*/
|
|
52
|
+
level?: NotificationLevel;
|
|
53
|
+
/**
|
|
54
|
+
* Attributes that are applied to the component during the initial render.
|
|
55
|
+
*
|
|
56
|
+
* Example usage: html attributes, custom data attributes (data-qa), aria
|
|
57
|
+
*/
|
|
58
|
+
attrs?: AttrsObject;
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Block Notification Component
|
|
62
|
+
*
|
|
63
|
+
* @param props - Component props
|
|
64
|
+
* @returns {Element} Block Notification
|
|
65
|
+
*/
|
|
66
|
+
export declare const MrlBlockNotification: React.FC<MrlBlockNotificationProps>;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
export declare const allowedValues: {
|
|
2
|
+
kinds: readonly ["info", "success", "warning", "error", "private", "general"];
|
|
3
|
+
levels: readonly ["2", "3", "4", "5", "6"];
|
|
4
|
+
scopes: readonly ["page", "component"];
|
|
5
|
+
states: readonly ["open", "close"];
|
|
6
|
+
};
|
|
7
|
+
export type NotificationKind = (typeof allowedValues.kinds)[number];
|
|
8
|
+
export type NotificationScope = (typeof allowedValues.scopes)[number];
|
|
9
|
+
export type NotificationState = (typeof allowedValues.states)[number];
|
|
10
|
+
export type NotificationLevel = (typeof allowedValues.levels)[number];
|
|
11
|
+
export interface NotificationDefaults {
|
|
12
|
+
dismissible: boolean;
|
|
13
|
+
kind: NotificationKind;
|
|
14
|
+
level: NotificationLevel;
|
|
15
|
+
scope: NotificationScope;
|
|
16
|
+
state: NotificationState;
|
|
17
|
+
}
|
|
18
|
+
export interface NotificationIconConfig {
|
|
19
|
+
/**
|
|
20
|
+
* SVG object from @muraldevkit/ds-icons;
|
|
21
|
+
* for pre-defined kinds, the design system handles this information out of the box
|
|
22
|
+
* but a developer can still overwrite the theme if needed.
|
|
23
|
+
*/
|
|
24
|
+
svg?: Record<string, unknown>;
|
|
25
|
+
/** icon theme if you're not using the default */
|
|
26
|
+
theme?: string;
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Default values for props on the Notification component;
|
|
30
|
+
* Shared between the component and Storybook
|
|
31
|
+
*/
|
|
32
|
+
export declare const defaults: NotificationDefaults;
|
|
33
|
+
/**
|
|
34
|
+
* Default transition duration for the notification transitions
|
|
35
|
+
*/
|
|
36
|
+
export declare const TransitionDuration = 333;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MrlBlockNotification';
|
|
@@ -15,7 +15,7 @@ export interface SvgPropTypes extends Omit<MrlComponentProps, 'style'>, React.Co
|
|
|
15
15
|
*/
|
|
16
16
|
style?: Record<string, unknown>;
|
|
17
17
|
/** The SVG object to parse into an HTML SVG element */
|
|
18
|
-
svg: Record<string, unknown
|
|
18
|
+
svg: Record<string, unknown>;
|
|
19
19
|
/** The theme associated to an SVG Component */
|
|
20
20
|
theme?: string;
|
|
21
21
|
}
|
|
@@ -9,7 +9,7 @@ interface MrlTooltipProps {
|
|
|
9
9
|
*
|
|
10
10
|
* Example usage: html attributes, custom data attributes (data-qa), aria
|
|
11
11
|
*/
|
|
12
|
-
attrs?: AttrsObject
|
|
12
|
+
attrs?: AttrsObject;
|
|
13
13
|
/**
|
|
14
14
|
* Children to be rendered within the tooltip. The first child is used as the trigger.
|
|
15
15
|
*
|
|
@@ -14,7 +14,7 @@ interface MrlTooltipContentProps {
|
|
|
14
14
|
*
|
|
15
15
|
* Example usage: html attributes, custom data attributes (data-qa), aria
|
|
16
16
|
*/
|
|
17
|
-
attrs: AttrsObject
|
|
17
|
+
attrs: AttrsObject;
|
|
18
18
|
/** The id of the tooltip used for aria-describedby in the parent component */
|
|
19
19
|
id: string;
|
|
20
20
|
/** The placement of the tooltip in relation to its trigger */
|