@muraldevkit/ui-toolkit 4.67.0 → 4.68.0-dev-5W5E.1

package/dist/types/components/breadcrumb/MrlBreadcrumbs/MrlBreadcrumbs.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { BreadcrumbItem } from '../MrlBreadcrumbItem';
+/**
+ * Props for the MrlBreadcrumbs component.
+ */
+export interface MrlBreadcrumbsProps extends React.ComponentPropsWithRef<'nav'> {
+    /**
+     * A string value used for data-qa attribute.
+     */
+    ['data-qa']?: string;
+    /**
+     * The aria-label of the nav element
+     */
+    ['aria-label']: string;
+    /**
+     * This prop accepts an array of objects, where each object represents a single breadcrumb item.
+     * It's used to define the structure, content, and behavior of the breadcrumbs displayed in the component.
+     * The `link` prop could be either the props of a react-router-dom link or a string. If a string is provided it will
+     * render a regular link.
+     */
+    items: BreadcrumbItem[];
+}
+/**
+ * MrlBreadcrumbs component.
+ * @param props The MrlBreadcrumbs component properties.
+ * @returns The MrlBreadcrumbs component.
+ */
+export declare function MrlBreadcrumbs(props: MrlBreadcrumbsProps): JSX.Element;

package/dist/types/components/breadcrumb/MrlBreadcrumbs/index.d.ts

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

package/dist/types/components/breadcrumb/index.d.ts

@@ -0,0 +1,3 @@
+export * from './MrlBreadcrumbItem';
+export * from './MrlBreadcrumbs';
+export * from './MrlBreadcrumbSeparator';

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

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { MrlSvgAnimateProps } from '../../svg/MrlSvgAnimate/MrlSvgAnimate';
+import { MrlIconButtonProps } from '../MrlIconButton/MrlIconButton';
+import './MrlAnimatedIconButton.scss';
+interface MrlAnimatedIconButtonProps extends Omit<MrlIconButtonProps, 'icon'> {
+    icon: MrlSvgAnimateProps;
+}
+export declare const MrlAnimatedIconButton: React.ForwardRefExoticComponent<Omit<MrlAnimatedIconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export {};

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

@@ -0,0 +1 @@
+export { MrlAnimatedIconButton } from './MrlAnimatedIconButton';

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

@@ -0,0 +1,105 @@
+import * as React from 'react';
+import { allowedButtonValues, MrlButtonKind, MrlButtonSize, ToggleAria, IconPosition } from '../constants';
+import { MrlTooltipAnchor, MrlTooltipPosition } from '../../';
+import { AttrsObject, MrlComponentProps } from '../../../utils';
+import './MrlButton.global.scss';
+export type MrlButtonState = (typeof allowedButtonValues.states)[number];
+export type ToggleStyle = (typeof allowedButtonValues.toggleStyles)[number];
+export interface TooltipConfig {
+    /**
+     * The text to display in the tooltip
+     */
+    text: string;
+    /**
+     * The position of the tooltip relative to the button
+     */
+    position?: MrlTooltipPosition;
+    /**
+     * The anchor of the tooltip relative to the button
+     */
+    anchor?: MrlTooltipAnchor;
+    /**
+     * The data-qa attribute for the tooltip
+     */
+    dataQa?: string;
+}
+export interface MrlButtonProps extends Omit<MrlComponentProps, 'style'>, React.ComponentProps<'button'> {
+    /**
+     * Applies additional HTML attributes to the button element.
+     *
+     * @deprecated
+     */
+    attrs?: AttrsObject;
+    /**
+     * Allow developers to add badge to buttons.
+     */
+    badge?: React.ReactElement;
+    /**
+     * @deprecated - Use state="disabled" or "selected-disabled" or "skeleton" instead.
+     * Allow developers to change the disabled state based on user interactions.
+     */
+    disabled?: boolean;
+    /**
+     * Allows developers the ability to disable built in event listeners so they can manage user
+     * interactions from the application.
+     */
+    disableEvents?: boolean;
+    /**
+     * Allow developers to add icon to buttons.
+     */
+    icon?: React.ReactElement;
+    /**
+     * Allows developers to right-align an icon within a button.
+     */
+    iconPos?: IconPosition;
+    /**
+     * Changes the visual emphasis of the button.
+     */
+    kind?: MrlButtonKind;
+    /**
+     * Displays a spinner in the button to indicate some action is in progress.
+     */
+    loading?: boolean;
+    /**
+     * Text for the spinner when the button is in a loading state.
+     */
+    loadingText?: string;
+    /**
+     * onClick event for the button.
+     */
+    onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /**
+     * Changes the size of the button so it can scale with its surrounding context.
+     */
+    size?: MrlButtonSize;
+    /**
+     * Changes the state of the button based on user permissions or actions.
+     */
+    state?: MrlButtonState;
+    /**
+     * The textual label describing the button's purpose/action.
+     * Icon buttons require a text label to ensure accessibility.
+     */
+    text: string;
+    /**
+     * Determines which aria setup to use for various toggle/selected styles.
+     * pressed - use for an traditional “toggle button”
+     * selected - use for tabs and custom select options
+     * expanded - use for menus, panels, and popovers
+     * checked - use for custom [radiobutton](https://www.w3.org/WAI/ARIA/apg/patterns/radiobutton/#wai-aria-roles-states-and-properties-16)
+     * 		or [checkbox](https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/#wai-aria-roles-states-and-properties-5) inputs
+     */
+    toggleAria?: ToggleAria;
+    /**
+     * Tooltip configuration for the button
+     */
+    tooltip?: TooltipConfig;
+    /**
+     * Selected state variant when the button is a Toggle Button. The visual styles
+     * are also impacted by the "kind" prop. Toggle buttons are only supported
+     * when "kind" is set to either "ghost" or "ghost-inverse". Setting this prop
+     * informs the component that this is a toggle button and to add that functionality
+     */
+    toggleStyle?: ToggleStyle;
+}
+export declare const MrlButton: React.ForwardRefExoticComponent<Omit<MrlButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

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

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

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

@@ -0,0 +1,112 @@
+import * as React from 'react';
+import { MrlButtonKind, MrlButtonSize, MrlGhostIconButtonSize, ToggleAria } from '../constants';
+import { AttrsObject, MrlComponentProps } from '../../../utils';
+import { MrlTooltipAnchor, MrlTooltipPosition, MrlTooltipVariant } from '../../tooltip/constants';
+import { MrlButtonState, ToggleStyle } from '../../';
+import './MrlIconButton.scss';
+export interface MrlIconButtonProps extends Omit<MrlComponentProps, 'style'>, React.ComponentProps<'button'> {
+    /**
+     * Applies additional HTML attributes to the button element.
+     * @deprecated
+     */
+    attrs?: AttrsObject;
+    /**
+     * Allow developers to add badge to buttons.
+     */
+    badge?: React.ReactElement;
+    /** Additional class to add to the button */
+    className?: string;
+    /**
+     * Allows developers the ability to disable built in event listeners so they can manage user
+     * interactions from the application.
+     */
+    disableEvents?: boolean;
+    /** Whether to disable the tooltip hover action that keeps it open */
+    disableTooltipHover?: boolean;
+    /**
+     * The icon that will be rendered.
+     */
+    icon: React.ReactElement;
+    /**
+     * Changes the visual emphasis of the button.
+     *
+     * Note: size="xsmall" should ONLY be used with a kind of `ghost` or `ghost-inverse`.
+     */
+    kind?: MrlButtonKind;
+    /**
+     * Displays a spinner in the button to indicate some action is in progress.
+     */
+    loading?: boolean;
+    /**
+     * Text for the spinner when the button is in a loading state.
+     */
+    loadingText?: string;
+    /**
+     * onClick event for the button.
+     */
+    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * onKeyDown event for the button.
+     */
+    onKeyUp?: (e: React.KeyboardEvent<HTMLButtonElement>) => void;
+    /**
+     * onMouseUp event for the button.
+     */
+    onMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * The placement of the tooltip in relation to the button.
+     */
+    position?: MrlTooltipPosition;
+    /**
+     * Changes the size of the button so it can scale with its surrounding context.
+     *
+     * Note: size="xsmall" should ONLY be used with a kind of `ghost` or `ghost-inverse`.
+     */
+    size?: MrlButtonSize | MrlGhostIconButtonSize;
+    /**
+     * Changes the state of the button based on user permissions or actions.
+     *
+     * Note: The Basic Button does not fully support state="disabled", use
+     * the 'disabled' prop instead. Since it does not support state="disabled",
+     * it also doesn't not support state="selected-disabled".
+     */
+    state?: MrlButtonState;
+    /**
+     * The textual label describing the button's purpose/action.
+     * Icon buttons require a text label to ensure accessibility.
+     */
+    text: string;
+    /**
+     * The arrow position of the tooltip in relation to the button.
+     */
+    tipAnchor?: MrlTooltipAnchor;
+    /**
+     * Determines which aria setup to use for various toggle/selected styles.
+     * pressed - use for an traditional “toggle button”
+     * selected - use for tabs and custom select options
+     * expanded - use for menus, panels, and popovers
+     * checked - use for custom [radiobutton](https://www.w3.org/WAI/ARIA/apg/patterns/radiobutton/#wai-aria-roles-states-and-properties-16)
+     * 		or [checkbox](https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/#wai-aria-roles-states-and-properties-5) inputs
+     */
+    toggleAria?: ToggleAria;
+    /**
+     * Selected state variant when the button is a Toggle Button. The visual styles
+     * are also impacted by the "kind" prop. Toggle buttons are only supported
+     * when "kind" is set to either "ghost" or "ghost-inverse". Setting this prop
+     * 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;
+    /**
+     * Controlled state that overrides the internal state management.
+     * When provided, this takes precedence over the `state` prop and allows
+     * the parent component to fully control the icon button's state.
+     */
+    controlledState?: MrlButtonState;
+}
+export declare const MrlIconButton: React.ForwardRefExoticComponent<Omit<MrlIconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

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

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

package/dist/types/components/button/MrlProcessingButton/MrlProcessingButton.d.ts

@@ -0,0 +1,51 @@
+import * as React from 'react';
+import { MrlButtonProps } from '../MrlButton';
+import { DSIconType } from '../../svg';
+import { DataQa } from '../../../utils/dataQa';
+export declare const DEFAULT_RESET_TIME = 4000;
+export declare const DEFAULT_FEEDBACK_TIME = 500;
+export type PossibleState = 'normal' | 'processing' | 'success' | 'error';
+export type MrlProcessingButtonConfig = {
+    normal: {
+        text: string;
+        icon?: DSIconType;
+    };
+    processing: {
+        action: () => Promise<void>;
+        /**
+         * The minimum time to show the processing state before executing the action.
+         * This provides visual feedback to users that their action was registered.
+         */
+        feedbackTime?: number;
+        text?: string;
+    };
+    success?: {
+        text: string;
+        icon?: DSIconType;
+    };
+    error?: {
+        text: string;
+        icon?: DSIconType;
+    };
+};
+export interface MrlProcessingButtonProps extends Omit<MrlButtonProps, 'ref' | 'text'>, DataQa {
+    /**
+     * The configuration for the processing button.
+     */
+    processingButtonConfig: MrlProcessingButtonConfig;
+    /**
+     * The time to wait before resetting the button to the normal state.
+     */
+    resetTime?: number;
+}
+/**
+ * A specialized button component that provides visual feedback during processing operations.
+ *
+ * The MrlProcessingButton extends the standard MrlButton with additional processing state
+ * management and user feedback capabilities. It automatically handles the transition between
+ * normal, loading, and completion states to provide clear visual feedback to users.
+ *
+ * @param props - The component props extending MrlButtonProps with additional processing capabilities
+ * @returns a MrlProcessingButton React component
+ */
+export declare function MrlProcessingButton(props: MrlProcessingButtonProps): React.JSX.Element;

package/dist/types/components/button/MrlProcessingButton/actions.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Copies text to the clipboard using the browser's clipboard API
+ * @param text - The text to copy to clipboard
+ * @param processing_time - The time to wait before copying the text to the clipboard
+ * @returns Promise that resolves when text is copied
+ */
+export declare function copyToClipboard(text: string, processing_time?: number): Promise<void>;
+/**
+ * Actions for the MrlProcessingButton
+ */
+export declare const MRL_PROCESSING_BUTTON_ACTIONS: {
+    copyToClipboard: typeof copyToClipboard;
+};

package/dist/types/components/button/MrlProcessingButton/index.d.ts

@@ -0,0 +1,2 @@
+export * from './MrlProcessingButton';
+export * from './actions';

package/dist/types/components/button/constants.d.ts

@@ -0,0 +1,33 @@
+import { MrlButtonState } from './MrlButton';
+export declare const allowedButtonValues: {
+    iconPositions: readonly ["before", "after"];
+    kinds: readonly ["secondary", "primary", "ghost", "inverse", "ghost-inverse", "primary-native", "secondary-native"];
+    sizes: readonly ["xsmall", "small", "medium", "large"];
+    states: readonly ["default", "disabled", "selected", "selected-disabled", "skeleton"];
+    toggleAriaTypes: readonly ["expanded", "pressed", "selected", "checked"];
+    toggleStyles: readonly ["default", "secondary"];
+    types: readonly ["button", "reset", "submit"];
+};
+export type MrlButtonType = (typeof allowedButtonValues.types)[number];
+export type MrlButtonKind = (typeof allowedButtonValues.kinds)[number];
+export type MrlButtonSize = (typeof allowedButtonValues.sizes)[number];
+export type ToggleAria = (typeof allowedButtonValues.toggleAriaTypes)[number];
+export type IconPosition = (typeof allowedButtonValues.iconPositions)[number];
+export type MrlGhostIconButtonSize = (typeof allowedButtonValues.sizes)[number] | 'xsmall';
+export interface ButtonDefaults {
+    attrs: {
+        [key: string]: unknown;
+    };
+    disabled: boolean;
+    iconPos: IconPosition;
+    kind: MrlButtonKind;
+    size: MrlButtonSize;
+    state: MrlButtonState;
+    text: string;
+    toggleAria: ToggleAria;
+}
+/**
+ * Default values for props on the Button component;
+ * Shared between the component and Storybook
+ */
+export declare const buttonDefaults: ButtonDefaults;

package/dist/types/components/button/helpers.d.ts

@@ -0,0 +1,40 @@
+import { MrlButtonState, ToggleStyle } from './MrlButton';
+import { MrlButtonKind, MrlGhostIconButtonSize } from './constants';
+import { SpinnerComponent } from '../loader/constants';
+/**
+ * Determines what loader should be displayed in which types of buttons.
+ *
+ * @private
+ * @param {MrlButtonKind} [buttonKind] - the kind of the current button.
+ * @param {MrlGhostIconButtonSize} [buttonSize] - the size of the current button.
+ * @returns {SpinnerComponent} - an MrlSpinner element themed to the button.
+ */
+export declare const _spinnerProps: (buttonKind: MrlButtonKind, buttonSize: MrlGhostIconButtonSize) => SpinnerComponent;
+/**
+ * Determines if the button is disabled since multiple states represent disabled
+ *
+ * @private
+ * @param {MrlButtonState} [currentState] - the value of this.state from the component.
+ * @param {boolean} [isLoading] - if the button is loading
+ * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.
+ * 		This is used for @Watch statements where this.state is not consistent.
+ * @returns {boolean} - if the button is disabled
+ */
+export declare const _isDisabled: (currentState: MrlButtonState, isLoading: boolean, enforcedState?: MrlButtonState) => boolean;
+/**
+ * Determines if the button is selected since multiple states represent selected
+ *
+ * @private
+ * @param {MrlButtonState} [currentState] - the value of this.state from the component.
+ * @param {MrlButtonState} [enforcedState] - optionally pass in a state to check against.
+ * 		This is used for @Watch statements where this.state is not consistent.
+ * @returns {boolean} - if the button is disabled
+ */
+export declare const _isSelected: (currentState: MrlButtonState, enforcedState?: MrlButtonState) => boolean;
+/**
+ * MrlIconButton and MrlAnimatedIconButton could behave as a toggle button if toggleStyle is 'default' or 'secondary'
+ *
+ * @param {ToggleStyle} toggleStyle type of toggle
+ * @returns {boolean} returns boolean if it's togglable
+ */
+export declare const _isToggleButton: (toggleStyle: ToggleStyle) => boolean;

package/dist/types/components/button/index.d.ts

@@ -0,0 +1,4 @@
+export * from './MrlAnimatedIconButton';
+export * from './MrlButton';
+export * from './MrlIconButton';
+export * from './MrlProcessingButton';

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

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { MrlPopoverProps } from '../../popover';
+export type MrlCalloutPopoverProps = Omit<MrlPopoverProps, 'children' | 'actionState' | 'isSubMenu' | 'triggerRef' | 'kind'>;
+interface MrlCalloutCTA {
+    onClick: () => void;
+    dataQa?: string;
+    text: string;
+}
+export type CalloutKind = 'primary' | 'secondary';
+export interface MrlCalloutProps extends MrlCalloutPopoverProps {
+    /** a unique id that binds the callout content and the trigger for assistive technologies */
+    ariaControls?: string;
+    autoFocus?: boolean;
+    children: React.ReactElement;
+    disableClickOutside?: boolean;
+    description?: string | JSX.Element;
+    eyebrow?: string;
+    id?: string;
+    image?: JSX.Element;
+    kind?: CalloutKind;
+    renderWithPortal?: boolean;
+    show: boolean;
+    title?: string;
+    primaryCta?: MrlCalloutCTA;
+    secondaryCta?: MrlCalloutCTA;
+}
+/**
+ * MrlCallout component.
+ *
+ * @param props - The props.
+ * @returns {React.ReactElement} The MrlCallout component.
+ */
+export declare const MrlCallout: (props: MrlCalloutProps) => React.ReactElement;
+export {};

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

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

package/dist/types/components/callout/index.d.ts

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

package/dist/types/components/container/MrlContainer/MrlContainer.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { Kind } from '../constants';
+import { MrlComponentProps } from '../../../utils';
+export interface MrlContainerProps extends Omit<MrlComponentProps, 'style'>, React.ComponentProps<'div'> {
+    /** Children to be rendered within the component */
+    children: React.ReactNode;
+    className?: string;
+    /**
+     * Defines which color scheme to used based on the background color of the container.
+     * White/light backgrounds should use "default" and dark/saturated color backgrounds
+     * should use "inverse".
+     */
+    kind?: Kind;
+}
+/**
+ * Used to visually and group content and
+ * provide structure in layouts.
+ *
+ * @param props - component props
+ * @returns a MrlContainer React component.
+ */
+export declare function MrlContainer({ children, className, kind, ...remainingProps }: MrlContainerProps): JSX.Element;

package/dist/types/components/container/MrlContainer/index.d.ts

@@ -0,0 +1 @@
+export { MrlContainer } from './MrlContainer';

package/dist/types/components/container/constants.d.ts

@@ -0,0 +1,12 @@
+export declare const allowedValues: {
+    kinds: readonly ["default", "helper", "nested", "nested-options"];
+};
+export type Kind = (typeof allowedValues.kinds)[number];
+export interface ContainerDefaults {
+    kind: Kind;
+}
+/**
+ * Default values for props on the MrlContainer component;
+ * Shared between the component and Storybook
+ */
+export declare const defaults: ContainerDefaults;

package/dist/types/components/container/index.d.ts

@@ -0,0 +1 @@
+export { MrlContainer } from './MrlContainer';

package/dist/types/components/divider/MrlDivider/MrlDivider.d.ts

@@ -0,0 +1,50 @@
+/// <reference types="react" />
+import { AttrsObject } from '../../../utils';
+import { Kind, Orientation, Spacing, Weight } from '../constants';
+interface MrlDividerProps {
+    /**
+     * Applies additional HTML attributes to the divider element.
+     */
+    attrs?: AttrsObject;
+    className?: string;
+    /**
+     * Defines which color scheme to used based on the background color of the container.
+     * White/light backgrounds should use "default" and dark/saturated color backgrounds
+     * should use "inverse".
+     */
+    kind?: Kind;
+    /**
+     * Use to set a width/height of a divider to create an offset from surrounding content.
+     * This is commonly found in toolbars. Value can be any valid CSS `width/height` value, such as
+     * a CSS variable or rem value. Warning, vertical dividers may not work if set to a percentage,
+     * due to browser limitations with calculating dynamic heights. You should not set the parent to
+     * a static height to make this work as that poses accessibility issues.
+     */
+    length?: string;
+    /**
+     * Determines the orientation of the divider based on the sibling elements' orientation.
+     * Stacked elements should use "horizontal" and elements displayed in a row should use
+     * "vertical". Note for the "vertical" orientation, only usage between a row of Icon Buttons
+     * is currently supported.
+     */
+    orientation?: Orientation;
+    /**
+     * Determines how much space to provide between the elements that the divider is separating.
+     * This option only applies to horizontal orientation.
+     */
+    spacing?: Spacing;
+    /**
+     * Controls the thickness of the divider line. Use "thin" for a more subtle divider
+     * appearance, or "default" for the standard divider thickness.
+     */
+    weight?: Weight;
+}
+/**
+ * Used to visually and semantically separate two elements.
+ * For visual separation only view this package's mixins
+ *
+ * @param props - component props
+ * @returns a MrlDivider React component.
+ */
+export declare function MrlDivider({ attrs, className, kind, length, orientation, spacing, weight, ...remainingProps }: MrlDividerProps): JSX.Element;
+export {};

package/dist/types/components/divider/MrlDivider/index.d.ts

@@ -0,0 +1 @@
+export { MrlDivider } from './MrlDivider';

package/dist/types/components/divider/constants.d.ts

@@ -0,0 +1,21 @@
+export declare const allowedValues: {
+    kinds: readonly ["default", "inverse"];
+    orientations: readonly ["horizontal", "vertical"];
+    spacings: readonly ["none", "small", "medium", "large", "xlarge"];
+    weight: readonly ["thin", "default"];
+};
+export type Kind = (typeof allowedValues.kinds)[number];
+export type Orientation = (typeof allowedValues.orientations)[number];
+export type Spacing = (typeof allowedValues.spacings)[number];
+export type Weight = (typeof allowedValues.weight)[number];
+export interface DividerDefaults {
+    kind: Kind;
+    orientation: Orientation;
+    spacing: Spacing;
+    weight: Weight;
+}
+/**
+ * Default values for props on the Divider component;
+ * Shared between the component and Storybook
+ */
+export declare const defaults: DividerDefaults;

package/dist/types/components/divider/index.d.ts

@@ -0,0 +1 @@
+export { MrlDivider } from './MrlDivider';

package/dist/types/components/empty/default/MrlEmpty.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+interface MrlEmptyProps {
+    graphic?: JSX.Element;
+    heading: string;
+    description: string;
+    action?: JSX.Element;
+}
+/**
+ * MrlEmpty for when there is no data to display for a single component.
+ * @param MrlEmptyProps props
+ * @returns MrlEmpty component
+ */
+export declare const MrlEmpty: ({ graphic, description, action, heading, ...rest }: MrlEmptyProps) => JSX.Element;
+export {};

package/dist/types/components/empty/default/index.d.ts

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

package/dist/types/components/empty/index.d.ts

@@ -0,0 +1,2 @@
+export * from './default';
+export * from './large';

package/dist/types/components/empty/large/MrlEmptyLarge.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+interface MrlEmptyLargeProps {
+    graphic?: JSX.Element;
+    heading: string;
+    description: string;
+    action?: JSX.Element;
+}
+/**
+ * MrlEmptyLarge for when there is no data to display for an entire page.
+ * @param MrlEmptyProps props
+ * @returns MrlEmptyLarge
+ */
+export declare const MrlEmptyLarge: ({ graphic, heading, description, action, ...rest }: MrlEmptyLargeProps) => JSX.Element;
+export {};

package/dist/types/components/empty/large/index.d.ts

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