@muraldevkit/ui-toolkit 4.68.0-dev-qt54.1 → 4.68.0

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

@@ -1,34 +0,0 @@
-export * from './avatar';
-export * from './badge';
-export * from './button';
-export * from './container';
-export * from './divider';
-export * from './error-boundary';
-export * from './focus-trap';
-export * from './form';
-export * from './grid';
-export * from './keystroke';
-export * from './layout';
-export * from './link';
-export * from './loader';
-export * from './menu';
-export * from './modal';
-export * from './notification';
-export * from './pagination';
-export * from './popover';
-export * from './svg';
-export * from './table';
-export * from './tabs';
-export * from './text';
-export * from './tooltip';
-export * from './portal';
-export * from './navigation-sidebar';
-export * from './skeleton';
-export * from './empty';
-export * from './live-region';
-export * from './callout';
-export * from './panel';
-export * from './rovingTabindex';
-export * from './toolbar';
-export * from './filter';
-export * from './breadcrumb';

package/dist/types/components/keystroke/MrlKeystroke/MrlKeystroke.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-export interface MrlKeystrokeProps extends React.ComponentPropsWithoutRef<'span'> {
-    /**
-     * Children to be rendered within the component.
-     */
-    children: React.ReactNode;
-}
-/**
- * MrlKeystroke Component
- *
- * Displays keyboard shortcuts and keystroke combinations in a visually consistent format.
- * Useful for showing users available keyboard shortcuts in tooltips, menus, help text, or command palettes.
- *
- * @param props - component props
- * @returns a MrlKeystroke React component
- */
-export declare function MrlKeystroke({ children, className, ...remainingProps }: MrlKeystrokeProps): React.JSX.Element;

package/dist/types/components/keystroke/MrlKeystroke/index.d.ts

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

package/dist/types/components/keystroke/MrlKeystrokes/MrlKeystrokes.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-export interface MrlKeystrokesProps extends React.ComponentPropsWithoutRef<'span'> {
-    /**
-     * Children to be rendered within the component.
-     */
-    children: React.ReactNode;
-}
-/**
- * MrlKeystrokes Component
- *
- * Wraps a group of MrlKeystroke components together with proper spacing.
- * Useful for displaying keyboard shortcut combinations.
- *
- * @param props - component props
- * @returns a MrlKeystrokes React component
- */
-export declare function MrlKeystrokes({ children, className, ...remainingProps }: MrlKeystrokesProps): React.JSX.Element;

package/dist/types/components/keystroke/MrlKeystrokes/index.d.ts

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

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

@@ -1,2 +0,0 @@
-export * from './MrlKeystroke';
-export * from './MrlKeystrokes';

package/dist/types/components/layout/MrlMain/MrlMain.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { LayoutComponent } from '../constants';
-/**
- * MrlMain React component.
- * @param props - component props
- * @returns a MrlMain React component.
- */
-export declare function MrlMain({ children, className, ...rest }: LayoutComponent): JSX.Element;

package/dist/types/components/layout/MrlMain/index.d.ts

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

package/dist/types/components/layout/MrlPage/MrlPage.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { LayoutComponent } from '../constants';
-type MrlPage = LayoutComponent;
-/**
- * MrlPage React component.
- * @param props - component props
- * @returns a MrlPage React component.
- */
-export declare function MrlPage({ children, className, ...rest }: MrlPage): JSX.Element;
-export {};

package/dist/types/components/layout/MrlPage/index.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { LayoutComponent } from '../constants';
-type MrlPage = LayoutComponent;
-/**
- * MrlPage Provider
- *
- * @param props - component props
- * @returns a MrlPage React component.
- */
-export declare function MrlPage({ ...rest }: MrlPage): JSX.Element;
-export {};

package/dist/types/components/layout/MrlSidebar/MrlSidebar.d.ts

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import { LayoutComponent, LayoutSection } from '../constants';
-export type MrlSidebarHookInfo = {
-    source: 'userInteraction' | 'imperativeHandler';
-};
-interface MrlSidebarHook {
-    hookClose?: (info: MrlSidebarHookInfo) => void;
-    hookOpen?: (info: MrlSidebarHookInfo) => void;
-}
-export interface MrlSidebarHandle {
-    close: () => void;
-    open: () => void;
-    toggle: () => void;
-}
-/**
- * MrlSidebar React component.
- * @param props - component props
- * @returns a MrlSidebar React component.
- */
-export declare const MrlSidebar: React.ForwardRefExoticComponent<LayoutComponent & LayoutSection & MrlSidebarHook & React.RefAttributes<MrlSidebarHandle>>;
-export {};

package/dist/types/components/layout/MrlSidebar/demo/MrlSidebarDemo.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-/**
- * MrlSidebar demo with the use of the forward ref to make open/close/toggle the sidebar
- * through buttons as children and outside of the sidebar.
- *
- * @returns a MrlSidebarDemo React component.
- */
-export declare const MrlSidebarDemo: () => JSX.Element;

package/dist/types/components/layout/MrlSidebar/index.d.ts

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

package/dist/types/components/layout/MrlTopbar/MrlTopbar.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { LayoutComponent, LayoutSection } from '../constants';
-type MrlTopbar = LayoutComponent & LayoutSection;
-/**
- * MrlTopbar React component.
- * @param props - component props
- * @returns a MrlTopbar React component.
- */
-export declare function MrlTopbar({ children, className, ...rest }: MrlTopbar): JSX.Element;
-export {};

package/dist/types/components/layout/MrlTopbar/index.d.ts

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

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

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-export interface LayoutComponent {
-    /**
-     * Children to be rendered within the component.
-     */
-    children: React.ReactNode;
-    className?: string;
-}
-export interface LayoutSection {
-    /**
-     * Label to apply to region of the page
-     */
-    ariaLabel: React.ReactNode;
-}
-export declare const TOPBAR_SELECTOR = "mrl-topbar";
-export declare const SIDEBAR_SELECTOR = "mrl-sidebar";

package/dist/types/components/layout/context/LayoutContext.d.ts

@@ -1,24 +0,0 @@
-import * as React from 'react';
-type LayoutContextType = {
-    isSidebarRendered: boolean;
-    isTopbarRendered: boolean;
-};
-type LayoutProviderProps = {
-    children: React.ReactNode;
-};
-/**
- * Provides layout-related context values to child components.
- *
- * @param {LayoutProviderProps} props - The props for the component.
- * @returns A React element that provides the layout context to children.
- */
-export declare function LayoutProvider({ children }: LayoutProviderProps): React.ReactElement;
-/**
- * Custom hook to access layout context values.
- * This hook ensures that the component using it is wrapped within a LayoutProvider.
- *
- * @throws Will throw an error if not used within a `LayoutProvider`.
- * @returns The layout context containing isSidebarRendered and isTopbarRendered.
- */
-export declare const useLayoutContext: () => LayoutContextType;
-export {};

package/dist/types/components/layout/error-page/MrlBrandColors/MrlBrandColors.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-export interface MrlBrandColorsProps {
-    /**
-     * Custom class name to be added to the component
-     */
-    className?: string;
-}
-/**
- * MrlBrandColors component
- * @param props - MrlBrandColors component props
- * @returns MrlBrandColors component
- */
-export declare const MrlBrandColors: ({ className, ...rest }: MrlBrandColorsProps) => JSX.Element;

package/dist/types/components/layout/error-page/MrlBrandColors/index.d.ts

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

package/dist/types/components/layout/error-page/MrlErrorPage/MrlErrorPage.d.ts

@@ -1,28 +0,0 @@
-import * as React from 'react';
-export interface MrlErrorPageProps extends React.ComponentProps<'div'> {
-    /**
-     * A string value used for data-qa attribute.
-     */
-    ['data-qa']?: string;
-    /**
-     * Children to be rendered within the main tag of the error page
-     */
-    children?: React.ReactNode;
-    /**
-     * Title of the error page
-     */
-    title: string;
-    /**
-     * Add custom components to the error page header
-     */
-    headerUtils?: React.ReactNode;
-}
-/**
- * MrlErrorPage component
- *
- * @param props - MrlErrorPage component props
- * @param props.children - Children to be rendered within the main tag of the error page
- * @param props.title - Title of the error page
- * @returns  MrlErrorPage component
- */
-export declare const MrlErrorPage: (props: MrlErrorPageProps) => JSX.Element;

package/dist/types/components/layout/error-page/MrlErrorPage/index.d.ts

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

package/dist/types/components/layout/error-page/index.d.ts

@@ -1,2 +0,0 @@
-export * from './MrlErrorPage';
-export * from './MrlBrandColors';

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

@@ -1,5 +0,0 @@
-export * from './MrlMain';
-export * from './MrlPage';
-export * from './MrlTopbar';
-export * from './MrlSidebar';
-export * from './error-page';

package/dist/types/components/layout/utils.d.ts

@@ -1,15 +0,0 @@
-/**
- * Returns true/false depending on if we are in a mobile view
- *
- * @param {string} breakpoint - The breakpoint value
- * @returns {boolean} Returns `true` if the breakpoint corresponds to a mobile size ('xs', 'sm', or 'md')
- */
-export declare const isMobile: (breakpoint: string) => boolean;
-/**
- * Returns true/false if the topbar is present within the given element
- *
- * @param element - The element to search for the topbar
- * @param selector - The selector to search for the topbar
- * @returns true/false if the topbar is present within the element
- */
-export declare const hasElement: (element: HTMLElement | null, selector: string) => boolean;

package/dist/types/components/link/MrlLink/MrlLink.d.ts

@@ -1,49 +0,0 @@
-import * as React from 'react';
-import { LinkColor, LinkKind, LinkSize, LinkTargetType } from '../constants';
-import { AttrsObject } from '../../../utils';
-export interface MrlLinkProptypes extends React.ComponentProps<'a'> {
-    /** The textual label describing the link's purpose */
-    text: string;
-    /** Specifies where to redirect the linked document */
-    href: string;
-    /** Specifies how to open the linked document */
-    target?: LinkTargetType;
-    /**
-     * Color scheme to use based on the link's container background
-     * - bold (default): a thicker underline to help a link stand out in a large amount of body copy
-     * - simple: a thinner underline to help address visual hierarchy issues when many links are in a list
-     */
-    kind?: LinkKind;
-    /**
-     * Color scheme to use based on the link's container background
-     * - default: most use cases
-     * - mono: use on colored/saturated backgrounds (e.g. warning notifications)
-     * - inverse: use on dark backgrounds
-     */
-    color?: LinkColor;
-    /**
-     * Allows developers to chose a specific font-size for the link. By default,
-     * it will inherit the font-size of its parent/surrounding text.
-     */
-    size?: LinkSize;
-    /**
-     * Applies additional HTML attributes to the nested anchor (`a`) element.
-     * Example: `attrs='{ "aria-label": "Special message for screen reader users" }'`
-     */
-    attrs?: AttrsObject;
-    /**
-     * classes to apply to the component
-     */
-    className?: string;
-    /**
-     * Custom on click listener
-     */
-    onClick?: (e: React.MouseEvent<HTMLElement>) => void | undefined;
-}
-/**
- * Renders a link component
- *
- * @param {MrlLinkProptypes} props the props for your MrlLink
- * @returns {React.ReactElement} an a element containing the text you pass
- */
-export declare const MrlLink: ({ target, className, color, kind, size, href, attrs, onClick, text, ...remainingProps }: MrlLinkProptypes) => React.ReactElement;

package/dist/types/components/link/MrlLink/index.d.ts

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

package/dist/types/components/link/MrlLinkButton/MrlLinkButton.d.ts

@@ -1,54 +0,0 @@
-import * as React from 'react';
-import { MrlButtonSize, IconPosition } from '../../button/constants';
-import { LinkTargetType, MrlLinkButtonKind } from '../constants';
-import { TooltipConfig } from '../../';
-import { MrlComponentProps } from '../../../utils';
-import './MrlLinkButton.global.scss';
-export interface MrlLinkButtonProps extends Omit<MrlComponentProps, 'style'>, React.ComponentProps<'a'> {
-    /** Specifies where to redirect the linked document */
-    href: string;
-    /** Specifies how to open the linked document */
-    target?: LinkTargetType;
-    /**
-     * 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?: MrlLinkButtonKind;
-    /**
-     * 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<HTMLAnchorElement>) => void;
-    /**
-     * Changes the size of the button so it can scale with its surrounding context.
-     */
-    size?: MrlButtonSize;
-    /**
-     * The textual label describing the button's purpose/action.
-     * Icon buttons require a text label to ensure accessibility.
-     */
-    text: string;
-    /**
-     * Tooltip configuration for the button
-     */
-    tooltip?: TooltipConfig;
-}
-/**
- * Warning: use this component with care. Our links generally do not look like buttons.
- * If this interaction does not navigate the user - use `MrlButton`.
- */
-export declare const MrlLinkButton: React.ForwardRefExoticComponent<Omit<MrlLinkButtonProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;

package/dist/types/components/link/MrlLinkButton/index.d.ts

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

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

@@ -1,24 +0,0 @@
-export declare const allowedValues: {
-    colors: readonly ["default", "mono", "inverse"];
-    kind: readonly ["bold", "simple"];
-    linkButtonKind: readonly ["secondary", "primary", "inverse"];
-    sizes: readonly ["default", "large", "medium", "small", "xsmall"];
-    targets: readonly ["_blank", "_parent", "_top", "_self"];
-};
-export type LinkColor = (typeof allowedValues.colors)[number];
-export type LinkKind = (typeof allowedValues.kind)[number];
-export type LinkSize = (typeof allowedValues.sizes)[number];
-export type LinkTargetType = (typeof allowedValues.targets)[number];
-export type MrlLinkButtonKind = (typeof allowedValues.linkButtonKind)[number];
-export interface LinkDefaults {
-    color: LinkColor;
-    kind: LinkKind;
-    linkButtonKind: MrlLinkButtonKind;
-    size: LinkSize;
-    target: LinkTargetType;
-}
-/**
- * Default values for props on the Link component;
- * Shared between the component and Storybook
- */
-export declare const defaults: LinkDefaults;

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

@@ -1,2 +0,0 @@
-export * from './MrlLink';
-export * from './MrlLinkButton';

package/dist/types/components/live-region/MrlLiveRegion/MrlLiveRegion.d.ts

@@ -1,19 +0,0 @@
-import * as React from 'react';
-type AriaRelevant = 'additions' | 'all' | 'removals' | 'text' | 'additions text' | undefined;
-export interface MrlLiveRegionProps extends React.HTMLAttributes<HTMLParagraphElement> {
-    ariaAtomic?: boolean;
-    ariaLive: 'polite' | 'assertive' | 'off';
-    ariaRelevant?: AriaRelevant;
-    id?: string;
-    shouldClearContent?: boolean;
-    srContent: string;
-    visible?: boolean;
-}
-/**
- * Live region component to render an HTML live region with the provided content.
- *
- * @param props - The live region component props.
- * @returns The live region component.
- */
-export declare const MrlLiveRegion: ({ ariaAtomic, ariaLive, ariaRelevant, id, srContent, visible, shouldClearContent, ...props }: MrlLiveRegionProps) => React.ReactElement;
-export {};

package/dist/types/components/live-region/MrlLiveRegion/index.d.ts

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

package/dist/types/components/live-region/demo/LiveRegionDemo.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-/**
- * Demo of a live region
- *
- * @returns {Element} The Live Region Demo
- */
-export declare const LiveRegionDemo: () => JSX.Element;

package/dist/types/components/live-region/index.d.ts

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

package/dist/types/components/loader/MrlProgressBar/MrlProgressBar.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { ProgressBarComponent } from '../constants';
-import '../../../styles/shared/a11y-helpers/a11y.global.scss';
-/**
- * MrlProgressBar React component.
- *
- * @param props - component props
- * @returns a MrlProgressBar React component.
- */
-export declare function MrlProgressBar({ children, className, indeterminate, name, percent, showText, text, time, ...rest }: ProgressBarComponent): JSX.Element;

package/dist/types/components/loader/MrlProgressBar/index.d.ts

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

package/dist/types/components/loader/MrlSpinner/MrlSpinner.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { SpinnerComponent } from '../constants';
-import '../../../styles/shared/a11y-helpers/a11y.global.scss';
-/**
- * MrlSpinner React component.
- *
- * @param props - component props
- * @returns a MrlSpinner React component.
- */
-export declare function MrlSpinner({ className, logo, kind, role, size, text, ...rest }: SpinnerComponent): JSX.Element;

package/dist/types/components/loader/MrlSpinner/index.d.ts

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

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

@@ -1,88 +0,0 @@
-/// <reference types="react" />
-type CreateArrayWithLengthX<LENGTH extends number, ACC extends unknown[] = []> = ACC['length'] extends LENGTH ? ACC : CreateArrayWithLengthX<LENGTH, [...ACC, 1]>;
-type NumericRange<START_ARR extends number[], END extends number, ACC extends number = never> = START_ARR['length'] extends END ? ACC | END : NumericRange<[...START_ARR, 1], END, ACC | START_ARR['length']>;
-export type ProgressRange = NumericRange<CreateArrayWithLengthX<0>, 100>;
-/**
- * Default values for props on the MrlProgressBar component;
- * Shared between the component and Storybook
- */
-export declare const progressBarDefaults: ProgressBarComponent;
-export interface ProgressBarComponent {
-    /**
-     * Custom content that lives below the progress bar.
-     *
-     * Note: This should be limited to descriptive text regarding
-     * what is in progress.
-     */
-    children?: React.ReactNode;
-    /**
-     * Custom class to be applied to the component.
-     */
-    className?: string;
-    /**
-     * Display an infinite loading indicator until completion
-     *
-     * Note: do not use with `time`.
-     */
-    indeterminate?: boolean;
-    /**
-     * Name of the progress bar (applied via aria-label)
-     */
-    name: string;
-    /**
-     * The percent complete.
-     *
-     * Note: This should be a whole number between 0 and 100.
-     */
-    percent?: ProgressRange;
-    /**
-     * Display the percent complete text
-     */
-    showText?: boolean;
-    /**
-     * Custom text to use under the progress bar.
-     */
-    text?: string;
-    /**
-     * The length of time to reach 100% in milliseconds.
-     *
-     * Note: do not use with `indeterminate`.
-     */
-    time?: number;
-}
-export type SpinnerSize = 'large' | 'medium' | 'small' | 'xsmall';
-export type SpinnerStyle = 'default' | 'inverse';
-/**
- * Default values for props on the MrlSpinner component;
- * Shared between the component and Storybook
- */
-export declare const spinnerDefaults: SpinnerComponent;
-export interface SpinnerComponent {
-    /**
-     * Custom class to be applied to the component.
-     */
-    className?: string;
-    /**
-     * Display the Mural logo under the spinner.
-     */
-    logo?: boolean;
-    /**
-     * Style of the spinner.
-     */
-    kind?: SpinnerStyle;
-    /**
-     * The role of the spinner.
-     *
-     * Note: Use with care. This prop has accessibility implications.
-     */
-    role?: string;
-    /**
-     * Size of the spinner.
-     */
-    size?: SpinnerSize;
-    /**
-     * Hidden text label while loading
-     */
-    text?: string;
-}
-export {};

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

@@ -1,3 +0,0 @@
-export * from './MrlProgressBar';
-export * from './MrlSpinner';
-export * from './constants';