@mezzanine-ui/react 0.9.2 → 0.10.2

package/Form/FormMessage.d.ts

@@ -4,5 +4,5 @@ export declare type FormMessageProps = NativeElementPropsWithoutKeyAndRef<'span'
 /**
  * The react component for `mezzanine` form message.
  */
-declare const FormMessage: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "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" | "children" | "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"> & import("react").RefAttributes<HTMLSpanElement>>;
+declare const FormMessage: import("react").ForwardRefExoticComponent<FormMessageProps & import("react").RefAttributes<HTMLSpanElement>>;
 export default FormMessage;

package/Form/FormMessage.js

@@ -12,7 +12,7 @@ const FormMessage = forwardRef(function FormMessage(props, ref) {
     const { children, className, ...rest } = props;
     const { severity } = useContext(FormControlContext) || {};
     const icon = severity ? formMessageIcons[severity] : null;
-    return (jsxs("span", Object.assign({}, rest, { ref: ref, className: cx(formFieldClasses.message, className) }, { children: [icon && (jsx(Icon, { className: formFieldClasses.severityIcon, icon: icon }, void 0)), children] }), void 0));
+    return (jsxs("span", { ...rest, ref: ref, className: cx(formFieldClasses.message, className), children: [icon && (jsx(Icon, { className: formFieldClasses.severityIcon, icon: icon })), children] }));
 });
 var FormMessage$1 = FormMessage;
 

package/Form/useAutoCompleteValueControl.d.ts

@@ -1,23 +1,42 @@
 import { Dispatch, MouseEvent, SetStateAction } from 'react';
 import { SelectValue } from '../Select/typings';
-export interface UseAutoCompleteValueControl {
-    defaultValue?: string;
+export interface UseAutoCompleteBaseValueControl {
     disabledOptionsFilter: boolean;
-    onChange?(newOption: string): any;
+    onChange?(newOptions: SelectValue[] | SelectValue | null): any;
     onClear?(e: MouseEvent<Element>): void;
     onClose?(): void;
-    options: string[];
-    value?: string;
+    onSearch?(input: string): any;
+    options: SelectValue[];
 }
-export interface AutoCompleteValueControl {
+export declare type UseAutoCompleteMultipleValueControl = UseAutoCompleteBaseValueControl & {
+    defaultValue?: SelectValue[];
+    mode: 'multiple';
+    onChange?(newOptions: SelectValue[]): any;
+    value?: SelectValue[];
+};
+export declare type UseAutoCompleteSingleValueControl = UseAutoCompleteBaseValueControl & {
+    defaultValue?: SelectValue;
+    mode: 'single';
+    onChange?(newOption: SelectValue | null): any;
+    value?: SelectValue | null;
+};
+export declare type UseAutoCompleteValueControl = UseAutoCompleteMultipleValueControl | UseAutoCompleteSingleValueControl;
+export interface AutoCompleteBaseValueControl {
     focused: boolean;
-    onChange: (v: SelectValue | null) => SelectValue[];
     onClear(e: MouseEvent<Element>): void;
     onFocus: (f: boolean) => void;
-    options: string[];
+    options: SelectValue[];
     searchText: string;
+    selectedOptions: SelectValue[];
     setSearchText: Dispatch<SetStateAction<string>>;
-    setValue: (text: string) => void;
-    value: SelectValue | null;
+    unselectedOptions: SelectValue[];
 }
-export declare function useAutoCompleteValueControl(props: UseAutoCompleteValueControl): AutoCompleteValueControl;
+export declare type AutoCompleteMultipleValueControl = AutoCompleteBaseValueControl & {
+    onChange: (v: SelectValue | null) => SelectValue[];
+    value: SelectValue[];
+};
+export declare type AutoCompleteSingleValueControl = AutoCompleteBaseValueControl & {
+    onChange: (v: SelectValue | null) => SelectValue | null;
+    value: SelectValue | null;
+};
+export declare const useAutoCompleteValueControl: (props: UseAutoCompleteValueControl) => AutoCompleteMultipleValueControl | AutoCompleteSingleValueControl;

package/Form/useAutoCompleteValueControl.js

@@ -1,62 +1,102 @@
 import { useState, useCallback } from 'react';
+import compact from 'lodash/compact';
+import isEqual from 'lodash/isEqual';
+import differenceBy from 'lodash/differenceBy';
 import { useControlValueState } from './useControlValueState.js';
 
-const equalityFn = (a, b) => a === b;
-function useAutoCompleteValueControl(props) {
-    const { defaultValue = '', disabledOptionsFilter, onChange, onClear: onClearProp, onClose, options: optionsProp, value: valueProp, } = props;
+const equalityFn = (a, b) => isEqual(a, b);
+function useAutoCompleteBaseValueControl(props) {
+    const { defaultValue, disabledOptionsFilter, mode, onChange, onClear: onClearProp, onClose, onSearch, options: optionsProp, value: valueProp, } = props;
     const [value, setValue] = useControlValueState({
-        defaultValue,
+        defaultValue: defaultValue || (mode === 'multiple' ? [] : null),
         equalityFn,
         value: valueProp,
     });
     const [searchText, setSearchText] = useState('');
     const [focused, setFocused] = useState(false);
-    const onChangeValue = useCallback((text) => {
-        setValue(text);
-        onChange === null || onChange === void 0 ? void 0 : onChange(text);
-    }, [setValue, onChange]);
     const onFocus = useCallback((focus) => {
         setFocused(focus);
-        /** sync current value */
-        if (!focus) {
-            onChange === null || onChange === void 0 ? void 0 : onChange(value);
-        }
-    }, [
-        value,
-        onChange,
-    ]);
-    const getCurrentInputValue = () => (value ? {
-        id: value,
-        name: value,
-    } : null);
+    }, []);
     const options = disabledOptionsFilter
         ? optionsProp
-        : optionsProp.filter((option) => ~option.search(searchText));
+        : optionsProp.filter((option) => !!option.name.includes(searchText));
+    const selectedOptions = mode === 'multiple'
+        ? value : compact([value]);
+    const unselectedOptions = differenceBy(options, selectedOptions, 'id');
     return {
         focused,
         onChange: (chooseOption) => {
-            if (!chooseOption)
-                return [];
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-            setValue(chooseOption.name);
-            onChange === null || onChange === void 0 ? void 0 : onChange(chooseOption.name);
-            return [chooseOption];
+            var _a;
+            if (!chooseOption) {
+                if (mode === 'multiple') {
+                    return [];
+                }
+                return null;
+            }
+            let newValue = mode === 'multiple' ? [] : null;
+            switch (mode) {
+                case 'multiple': {
+                    const existedValueIdx = ((_a = value) !== null && _a !== void 0 ? _a : []).findIndex((v) => v.id === chooseOption.id);
+                    if (~existedValueIdx) {
+                        newValue = [
+                            ...value.slice(0, existedValueIdx),
+                            ...value.slice(existedValueIdx + 1),
+                        ];
+                    }
+                    else {
+                        newValue = [
+                            ...value,
+                            chooseOption,
+                        ];
+                    }
+                    if (typeof onChange === 'function')
+                        onChange(newValue);
+                    break;
+                }
+                default: {
+                    newValue = chooseOption;
+                    if (typeof onClose === 'function')
+                        onClose();
+                    if (typeof onChange === 'function')
+                        onChange(newValue);
+                    break;
+                }
+            }
+            setValue(newValue);
+            return newValue;
         },
         onClear: (e) => {
             e.stopPropagation();
-            setValue('');
+            if (mode === 'multiple') {
+                setValue([]);
+                onChange === null || onChange === void 0 ? void 0 : onChange([]);
+            }
+            else {
+                setValue(null);
+                onChange === null || onChange === void 0 ? void 0 : onChange(null);
+            }
             setSearchText('');
             if (typeof onClearProp === 'function') {
                 onClearProp(e);
             }
+            if (typeof onSearch === 'function') {
+                onSearch('');
+            }
         },
         onFocus,
         options,
         searchText,
+        selectedOptions,
         setSearchText,
-        setValue: onChangeValue,
-        value: getCurrentInputValue(),
+        unselectedOptions,
+        value,
     };
-}
+}
+const useAutoCompleteValueControl = (props) => {
+    if (props.mode === 'multiple') {
+        return useAutoCompleteBaseValueControl(props);
+    }
+    return useAutoCompleteBaseValueControl(props);
+};
 
 export { useAutoCompleteValueControl };

package/Form/useInputWithTagsModeValue.js

@@ -56,7 +56,8 @@ function useInputWithTagsModeValue(props) {
         if (!canActive)
             return;
         const element = ref.current;
-        if (element && (element === null || element === void 0 ? void 0 : element.value) &&
+        if (element &&
+            (element === null || element === void 0 ? void 0 : element.value) &&
             (e.key === 'Enter' || e.code === 'Enter') &&
             !e.nativeEvent.isComposing &&
             !tagsWillOverflow()) {

package/Form/useSelectValueControl.d.ts

@@ -30,4 +30,4 @@ export declare type SelectSingleValueControl = SelectBaseValueControl & {
     value: SelectValue | null;
 };
 export declare type SelectValueControl = SelectMultipleValueControl | SelectSingleValueControl;
-export declare const useSelectValueControl: (props: UseSelectValueControl) => SelectValueControl;
+export declare const useSelectValueControl: (props: UseSelectValueControl) => SelectMultipleValueControl | SelectSingleValueControl;

package/Icon/Icon.d.ts

@@ -20,6 +20,10 @@ export interface IconProps extends NativeElementPropsWithoutKeyAndRef<'i'> {
      * @default false
      */
     spin?: boolean;
+    /**
+     * Icon accessible title
+     */
+    title?: string;
 }
 /**
  * The react component for `mezzanine` icon.

package/Icon/Icon.js

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { toIconCssVars, iconClasses } from '@mezzanine-ui/core/icon';
 import cx from 'clsx';
@@ -7,7 +7,7 @@ import cx from 'clsx';
  * The react component for `mezzanine` icon.
  */
 const Icon = forwardRef(function Icon(props, ref) {
-    const { className, color, icon, size, spin = false, style: styleProp, ...rest } = props;
+    const { className, color, icon, size, spin = false, style: styleProp, title, ...rest } = props;
     const { definition } = icon;
     const cssVars = toIconCssVars({ color, size });
     const style = {
@@ -15,11 +15,11 @@ const Icon = forwardRef(function Icon(props, ref) {
         ...cssVars,
         ...styleProp,
     };
-    return (jsx("i", Object.assign({}, rest, { ref: ref, "aria-hidden": true, className: cx(iconClasses.host, {
+    return (jsx("i", { ...rest, ref: ref, className: cx(iconClasses.host, {
             [iconClasses.color]: color,
             [iconClasses.spin]: spin,
             [iconClasses.size]: size,
-        }, className), "data-icon-name": icon.name, style: style }, { children: jsx("svg", Object.assign({}, definition.svg, { focusable: false }, { children: jsx("path", Object.assign({}, definition.path), void 0) }), void 0) }), void 0));
+        }, className), "data-icon-name": icon.name, style: style, children: jsxs("svg", { ...definition.svg, focusable: false, children: [title || definition.title ? (jsx("title", { children: title || definition.title })) : null, jsx("path", { ...definition.path })] }) }));
 });
 var Icon$1 = Icon;
 

package/Input/Input.d.ts

@@ -3,7 +3,7 @@ import { InputSize } from '@mezzanine-ui/core/input';
 import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
 import type { TagsType } from '../Form/useInputWithTagsModeValue';
 import { TextFieldProps } from '../TextField';
-export interface InputProps extends Omit<TextFieldProps, 'active' | 'children' | 'onClear' | 'onKeyDown'> {
+export interface InputProps extends Omit<TextFieldProps, 'active' | 'children' | 'onClear' | 'onKeyDown' | 'suffixActionIcon'> {
     /**
      * The default value of input.
      */

package/Input/Input.js

@@ -5,6 +5,7 @@ import { selectClasses } from '@mezzanine-ui/core/select';
 import { useComposeRefs } from '../hooks/useComposeRefs.js';
 import { useInputWithClearControlValue } from '../Form/useInputWithClearControlValue.js';
 import { useInputWithTagsModeValue } from '../Form/useInputWithTagsModeValue.js';
+import { MezzanineConfig } from '../Provider/context.js';
 import TextField from '../TextField/TextField.js';
 import Tag from '../Tag/Tag.js';
 import { FormControlContext } from '../Form/FormControlContext.js';
@@ -14,8 +15,9 @@ import cx from 'clsx';
  * The react component for `mezzanine` input.
  */
 const Input = forwardRef(function Input(props, ref) {
+    const { size: globalSize, } = useContext(MezzanineConfig);
     const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
-    const { className, clearable = false, defaultValue, disabled = disabledFromFormControl || false, error = severity === 'error' || false, fullWidth = fullWidthFromFormControl || false, inputProps, inputRef: inputRefProp, mode = 'default', onChange: onChangeProp, placeholder, prefix, readOnly = false, required = requiredFromFormControl || false, size = 'medium', suffix, tagsProps, value: valueProp, } = props;
+    const { className, clearable = false, defaultValue, disabled = disabledFromFormControl || false, error = severity === 'error' || false, fullWidth = fullWidthFromFormControl || false, inputProps, inputRef: inputRefProp, mode = 'default', onChange: onChangeProp, placeholder, prefix, readOnly = false, required = requiredFromFormControl || false, size = globalSize, suffix, tagsProps, value: valueProp, } = props;
     const { initialTagsValue, inputPosition = 'bottom', maxTagsLength, onTagsChange, } = tagsProps || {};
     const tagsMode = mode === 'tags';
     const inputRef = useRef(null);
@@ -41,11 +43,10 @@ const Input = forwardRef(function Input(props, ref) {
         : inputProps === null || inputProps === void 0 ? void 0 : inputProps.maxLength);
     const active = !!value;
     const mountInput = !tagsMode || !tagsReachedMax;
-    return (jsxs(TextField, Object.assign({ ref: ref, active: active, className: cx(inputClasses.host, tagsMode && inputClasses.tagsMode, inputPosition === 'top' && inputClasses.tagsModeInputOnTop, className), clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, onClear: tagsMode ? tagsModeOnClear : onClear, prefix: mountInput ? prefix : undefined, suffix: mountInput ? suffix : undefined, size: size }, { children: [tagsMode && (jsx("div", Object.assign({ className: selectClasses.triggerTags }, { children: tags.map((tag) => (jsx(Tag, Object.assign({ closable: true, disabled: disabled, size: size, onClose: (e) => {
+    return (jsxs(TextField, { ref: ref, active: active, className: cx(inputClasses.host, tagsMode && inputClasses.tagsMode, inputPosition === 'top' && inputClasses.tagsModeInputOnTop, className), clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, onClear: tagsMode ? tagsModeOnClear : onClear, prefix: mountInput ? prefix : undefined, suffix: mountInput ? suffix : undefined, size: size, children: [tagsMode && (jsx("div", { className: selectClasses.triggerTags, children: tags.map((tag) => (jsx(Tag, { closable: true, disabled: disabled, size: size, onClose: (e) => {
                         e.stopPropagation();
                         tagsModeOnRemove(tag);
-                    } }, { children: tag }), tag))) }), void 0)),
-            mountInput && (jsx("input", Object.assign({}, inputProps, { "aria-disabled": disabled, "aria-multiline": false, "aria-readonly": readOnly, "aria-required": required, disabled: disabled, maxLength: maxLength(), onChange: tagsMode ? tagsModeOnChange : onChange, onKeyDown: tagsMode ? onKeyDown : inputProps === null || inputProps === void 0 ? void 0 : inputProps.onKeyDown, placeholder: placeholder, readOnly: readOnly, ref: composedInputRef, required: required, value: tagsMode ? undefined : value }), void 0))] }), void 0));
+                    }, children: tag }, tag))) })), mountInput && (jsx("input", { ...inputProps, "aria-disabled": disabled, "aria-multiline": false, "aria-readonly": readOnly, "aria-required": required, disabled: disabled, maxLength: maxLength(), onChange: tagsMode ? tagsModeOnChange : onChange, onKeyDown: tagsMode ? onKeyDown : inputProps === null || inputProps === void 0 ? void 0 : inputProps.onKeyDown, placeholder: placeholder, readOnly: readOnly, ref: composedInputRef, required: required, value: tagsMode ? undefined : value }))] }));
 });
 var Input$1 = Input;
 

package/Loading/Loading.js

@@ -13,14 +13,13 @@ const Loading = forwardRef(function Loading(props, ref) {
     const { className: iconClassName, color: iconColor, ...iconPropsRest } = iconProps;
     const isNestedPattern = typeof children !== 'undefined';
     const composedHostRef = useComposeRefs([ref, hostRef]);
-    const spinElement = loading ? (jsxs("div", Object.assign({ ref: isNestedPattern ? null : ref, className: cx(iconClasses.spin, {
+    const spinElement = loading ? (jsxs("div", { ref: isNestedPattern ? null : ref, className: cx(iconClasses.spin, {
             [iconClasses.stretch]: stretch,
-        }) }, { children: [jsx(Icon, Object.assign({}, iconPropsRest, { className: cx(iconClasses.icon, iconClassName), color: iconColor || 'primary', icon: SpinnerIcon, spin: true }), void 0),
-            tip ? (jsx("span", Object.assign({ className: cx(iconClasses.tip, tipClassName) }, { children: tip }), void 0)) : null] }), void 0)) : null;
+        }), children: [jsx(Icon, { ...iconPropsRest, className: cx(iconClasses.icon, iconClassName), color: iconColor || 'primary', icon: SpinnerIcon, spin: true }), tip ? (jsx("span", { className: cx(iconClasses.tip, tipClassName), children: tip })) : null] })) : null;
     if (isNestedPattern) {
-        return (jsxs("div", Object.assign({ ref: composedHostRef, className: cx(iconClasses.host, {
+        return (jsxs("div", { ref: composedHostRef, className: cx(iconClasses.host, {
                 [iconClasses.stretch]: stretch,
-            }, className) }, { children: [jsx(Overlay, Object.assign({}, overlayProps, { container: hostRef, onSurface: true, open: loading }, { children: spinElement }), void 0), children] }), void 0));
+            }, className), children: [jsx(Overlay, { ...overlayProps, container: hostRef, onSurface: true, open: loading, children: spinElement }), children] }));
     }
     return spinElement;
 });

package/Menu/Menu.js

@@ -1,13 +1,15 @@
 import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
+import { forwardRef, useContext } from 'react';
 import { toMenuCssVars, menuClasses } from '@mezzanine-ui/core/menu';
+import { MezzanineConfig } from '../Provider/context.js';
 import cx from 'clsx';
 
 /**
  * The react component for `mezzanine` menu.
  */
 const Menu = forwardRef(function Menu(props, ref) {
-    const { children, className, itemsInView = 4, maxHeight, role = 'menu', size = 'medium', style: styleProp, ...rest } = props;
+    const { size: globalSize, } = useContext(MezzanineConfig);
+    const { children, className, itemsInView = 4, maxHeight, role = 'menu', size = globalSize, style: styleProp, ...rest } = props;
     const cssVars = toMenuCssVars({
         itemsInView,
         maxHeight,
@@ -16,7 +18,7 @@ const Menu = forwardRef(function Menu(props, ref) {
         ...cssVars,
         ...styleProp,
     };
-    return (jsx("ul", Object.assign({}, rest, { ref: ref, className: cx(menuClasses.host, menuClasses.size(size), className), role: role, style: style }, { children: children }), void 0));
+    return (jsx("ul", { ...rest, ref: ref, className: cx(menuClasses.host, menuClasses.size(size), className), role: role, style: style, children: children }));
 });
 var Menu$1 = Menu;
 

package/Menu/MenuDivider.d.ts

@@ -4,5 +4,5 @@ export declare type MenuDividerProps = NativeElementPropsWithoutKeyAndRef<'hr'>;
 /**
  * The react component for `mezzanine` menu divider.
  */
-declare const MenuDivider: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "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" | "children" | "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"> & import("react").RefAttributes<HTMLHRElement>>;
+declare const MenuDivider: import("react").ForwardRefExoticComponent<MenuDividerProps & import("react").RefAttributes<HTMLHRElement>>;
 export default MenuDivider;

package/Menu/MenuDivider.js

@@ -8,7 +8,7 @@ import cx from 'clsx';
  */
 const MenuDivider = forwardRef(function MenuDivider(props, ref) {
     const { className, ...rest } = props;
-    return (jsx("hr", Object.assign({}, rest, { ref: ref, className: cx(menuDividerClasses.host, className) }), void 0));
+    return (jsx("hr", { ...rest, ref: ref, className: cx(menuDividerClasses.host, className) }));
 });
 var MenuDivider$1 = MenuDivider;
 

package/Menu/MenuItem.js

@@ -12,15 +12,14 @@ const MenuItem = forwardRef(function MenuItem(props, ref) {
     const { active = false, children, className, disabled = false, onClick, onKeyDown = () => { }, role = 'menuitem', ...rest } = props;
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-    jsxs("li", Object.assign({}, rest, { ref: ref, "aria-disabled": disabled, className: cx(menuItemClasses.host, {
+    jsxs("li", { ...rest, ref: ref, "aria-disabled": disabled, className: cx(menuItemClasses.host, {
             [menuItemClasses.active]: active,
             [menuItemClasses.disabled]: disabled,
         }, className), onClick: (event) => {
             if (!disabled && onClick) {
                 onClick(event);
             }
-        }, onKeyDown: onKeyDown, role: role }, { children: [jsx("div", Object.assign({ className: menuItemClasses.label }, { children: children }), void 0),
-            active && jsx(Icon, { className: menuItemClasses.activeIcon, icon: CheckIcon }, void 0)] }), void 0));
+        }, onKeyDown: onKeyDown, role: role, children: [jsx("div", { className: menuItemClasses.label, children: children }), active && jsx(Icon, { className: menuItemClasses.activeIcon, icon: CheckIcon })] }));
 });
 var MenuItem$1 = MenuItem;
 

package/Menu/MenuItemGroup.js

@@ -8,8 +8,7 @@ import cx from 'clsx';
  */
 const MenuItemGroup = forwardRef(function MenuItemGroup(props, ref) {
     const { children, className, label, ...rest } = props;
-    return (jsxs("li", Object.assign({ ref: ref }, rest, { className: cx(menuItemGroupClasses.host, className) }, { children: [jsx("span", Object.assign({ className: menuItemGroupClasses.label }, { children: label }), void 0),
-            jsx("ul", Object.assign({ className: menuItemGroupClasses.items }, { children: children }), void 0)] }), void 0));
+    return (jsxs("li", { ref: ref, ...rest, className: cx(menuItemGroupClasses.host, className), children: [jsx("span", { className: menuItemGroupClasses.label, children: label }), jsx("ul", { className: menuItemGroupClasses.items, children: children })] }));
 });
 var MenuItemGroup$1 = MenuItemGroup;
 

package/Message/Message.js

@@ -32,12 +32,11 @@ const Message = ((props) => {
         if (reference)
             Message.remove(reference);
     };
-    return (jsx(SlideFade, Object.assign({ in: open, appear: true, onExited: onExited }, restTransitionProps, { children: jsxs("div", Object.assign({ className: cx(messageClasses.host, severity ? messageClasses.severity(severity) : '') }, { children: [icon ? (jsx(Icon, { className: messageClasses.icon, icon: icon }, void 0)) : null,
-                jsx("span", Object.assign({ className: messageClasses.content }, { children: children }), void 0)] }), void 0) }), void 0));
+    return (jsx(SlideFade, { in: open, appear: true, onExited: onExited, ...restTransitionProps, children: jsxs("div", { className: cx(messageClasses.host, severity ? messageClasses.severity(severity) : ''), children: [icon ? (jsx(Icon, { className: messageClasses.icon, icon: icon })) : null, jsx("span", { className: messageClasses.content, children: children })] }) }));
 });
 const { add, config, destroy, remove, } = createNotifier({
     duration: 3000,
-    render: (message) => jsx(Message, Object.assign({}, message), void 0),
+    render: (message) => jsx(Message, { ...message }),
     setRoot: (root) => {
         root.setAttribute('class', messageClasses.root);
     },

package/Modal/Modal.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { modalClasses } from '@mezzanine-ui/core/modal';
 import { TimesIcon } from '@mezzanine-ui/icons';
-import { forwardRef } from 'react';
+import { forwardRef, useMemo } from 'react';
 import { ModalControlContext } from './ModalControl.js';
 import useModalContainer from './useModalContainer.js';
 import Icon from '../Icon/Icon.js';
@@ -12,15 +12,15 @@ import cx from 'clsx';
  */
 const Modal = forwardRef(function Modal(props, ref) {
     const { children, className, container, disableCloseOnBackdropClick = false, disableCloseOnEscapeKeyDown = false, disablePortal = false, fullScreen = false, hideBackdrop = false, hideCloseIcon = false, invisibleBackdrop = false, loading = false, onBackdropClick, onClose, open, severity = 'info', size = 'medium', ...rest } = props;
-    const modalControl = {
+    const modalControl = useMemo(() => ({
         loading,
         severity,
-    };
+    }), [loading, severity]);
     const { Container: ModalContainer } = useModalContainer();
-    return (jsx(ModalControlContext.Provider, Object.assign({ value: modalControl }, { children: jsx(ModalContainer, Object.assign({ className: modalClasses.overlay, container: container, direction: "down", disableCloseOnBackdropClick: disableCloseOnBackdropClick, disableCloseOnEscapeKeyDown: disableCloseOnEscapeKeyDown, disablePortal: disablePortal, hideBackdrop: hideBackdrop, invisibleBackdrop: invisibleBackdrop, onBackdropClick: onBackdropClick, onClose: onClose, open: open, ref: ref }, { children: jsxs("div", Object.assign({}, rest, { className: cx(modalClasses.host, modalClasses.severity(severity), modalClasses.size(size), {
+    return (jsx(ModalControlContext.Provider, { value: modalControl, children: jsx(ModalContainer, { className: modalClasses.overlay, container: container, direction: "down", disableCloseOnBackdropClick: disableCloseOnBackdropClick, disableCloseOnEscapeKeyDown: disableCloseOnEscapeKeyDown, disablePortal: disablePortal, hideBackdrop: hideBackdrop, invisibleBackdrop: invisibleBackdrop, onBackdropClick: onBackdropClick, onClose: onClose, open: open, ref: ref, children: jsxs("div", { ...rest, className: cx(modalClasses.host, modalClasses.severity(severity), modalClasses.size(size), {
                     [modalClasses.fullScreen]: fullScreen,
                     [modalClasses.withCloseIcon]: !hideCloseIcon,
-                }, className), role: "dialog" }, { children: [children, !hideCloseIcon && (jsx(Icon, { className: modalClasses.closeIcon, icon: TimesIcon, onClick: onClose }, void 0))] }), void 0) }), void 0) }), void 0));
+                }, className), role: "dialog", children: [children, !hideCloseIcon && (jsx(Icon, { className: modalClasses.closeIcon, icon: TimesIcon, onClick: onClose }))] }) }) }));
 });
 var Modal$1 = Modal;
 

package/Modal/ModalActions.js

@@ -12,7 +12,7 @@ const ModalActions = forwardRef(function ModalActions(props, ref) {
     const { cancelButtonProps, cancelText, children, confirmButtonProps, confirmText, hideCancelButton, hideConfirmButton, onCancel, onConfirm, ...rest } = props;
     const { loading, severity, } = useContext(ModalControlContext);
     const danger = severity === 'error';
-    return (jsxs(ModalFooter, Object.assign({}, rest, { ref: ref }, { children: [children, jsx(ConfirmActions, { cancelButtonProps: cancelButtonProps, cancelText: cancelText, className: modalClasses.actions, confirmButtonProps: confirmButtonProps, confirmText: confirmText, danger: danger, hideCancelButton: hideCancelButton, hideConfirmButton: hideConfirmButton, loading: loading, onCancel: onCancel, onConfirm: onConfirm }, void 0)] }), void 0));
+    return (jsxs(ModalFooter, { ...rest, ref: ref, children: [children, jsx(ConfirmActions, { cancelButtonProps: cancelButtonProps, cancelText: cancelText, className: modalClasses.actions, confirmButtonProps: confirmButtonProps, confirmText: confirmText, danger: danger, hideCancelButton: hideCancelButton, hideConfirmButton: hideConfirmButton, loading: loading, onCancel: onCancel, onConfirm: onConfirm })] }));
 });
 var ModalActions$1 = ModalActions;
 

package/Modal/ModalBody.d.ts

@@ -4,5 +4,5 @@ export declare type ModalBodyProps = NativeElementPropsWithoutKeyAndRef<'div'>;
 /**
  * The react component for `mezzanine` modal body.
  */
-declare const ModalBody: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "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" | "children" | "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"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ModalBody: import("react").ForwardRefExoticComponent<ModalBodyProps & import("react").RefAttributes<HTMLDivElement>>;
 export default ModalBody;

package/Modal/ModalBody.js

@@ -8,7 +8,7 @@ import cx from 'clsx';
  */
 const ModalBody = forwardRef(function ModalBody(props, ref) {
     const { children, className, ...rest } = props;
-    return (jsx("div", Object.assign({}, rest, { ref: ref, className: cx(modalClasses.body, className) }, { children: children }), void 0));
+    return (jsx("div", { ...rest, ref: ref, className: cx(modalClasses.body, className), children: children }));
 });
 var ModalBody$1 = ModalBody;
 

package/Modal/ModalFooter.d.ts

@@ -4,5 +4,5 @@ export declare type ModalFooterProps = NativeElementPropsWithoutKeyAndRef<'div'>
 /**
  * The react component for `mezzanine` modal footer.
  */
-declare const ModalFooter: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "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" | "children" | "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"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ModalFooter: import("react").ForwardRefExoticComponent<ModalFooterProps & import("react").RefAttributes<HTMLDivElement>>;
 export default ModalFooter;

package/Modal/ModalFooter.js

@@ -8,7 +8,7 @@ import cx from 'clsx';
  */
 const ModalFooter = forwardRef(function ModalFooter(props, ref) {
     const { children, className, ...rest } = props;
-    return (jsx("div", Object.assign({}, rest, { ref: ref, className: cx(modalClasses.footer, className) }, { children: children }), void 0));
+    return (jsx("div", { ...rest, ref: ref, className: cx(modalClasses.footer, className), children: children }));
 });
 var ModalFooter$1 = ModalFooter;
 

package/Modal/ModalHeader.js

@@ -11,10 +11,9 @@ import cx from 'clsx';
 const ModalHeader = forwardRef(function ModalHeader(props, ref) {
     const { children, className, showSeverityIcon = false, titleLarge = false, ...rest } = props;
     const { severity } = useContext(ModalControlContext);
-    return (jsxs("div", Object.assign({}, rest, { ref: ref, className: cx(modalClasses.header, className) }, { children: [showSeverityIcon && (jsx(Icon, { className: modalClasses.severityIcon, icon: modalSeverityIcons[severity] }, void 0)),
-            jsx("h3", Object.assign({ className: cx(modalClasses.title, {
+    return (jsxs("div", { ...rest, ref: ref, className: cx(modalClasses.header, className), children: [showSeverityIcon && (jsx(Icon, { className: modalClasses.severityIcon, icon: modalSeverityIcons[severity] })), jsx("h3", { className: cx(modalClasses.title, {
                     [modalClasses.titleLarge]: titleLarge,
-                }), title: typeof children === 'string' ? children : undefined }, { children: children }), void 0)] }), void 0));
+                }), title: typeof children === 'string' ? children : undefined, children: children })] }));
 });
 var ModalHeader$1 = ModalHeader;
 

package/Modal/useModalContainer.js

@@ -15,7 +15,7 @@ const defaultOptions = {
 };
 const ModalContainer = forwardRef((props, ref) => {
     const { className = defaultOptions.className, children, container, direction = defaultOptions.direction, disableCloseOnBackdropClick = defaultOptions.disableCloseOnBackdropClick, disableCloseOnEscapeKeyDown = defaultOptions.disableCloseOnEscapeKeyDown, disablePortal = defaultOptions.disablePortal, hideBackdrop = defaultOptions.hideBackdrop, invisibleBackdrop = defaultOptions.invisibleBackdrop, onBackdropClick, onClose, open = defaultOptions.open, } = props;
-    return (jsx(SlideFadeOverlay, Object.assign({ className: className, container: container, direction: direction, disableCloseOnBackdropClick: disableCloseOnBackdropClick, disableCloseOnEscapeKeyDown: disableCloseOnEscapeKeyDown, disablePortal: disablePortal, hideBackdrop: hideBackdrop, invisibleBackdrop: invisibleBackdrop, onBackdropClick: onBackdropClick, onClose: onClose, open: open, ref: ref }, { children: children }), void 0));
+    return (jsx(SlideFadeOverlay, { className: className, container: container, direction: direction, disableCloseOnBackdropClick: disableCloseOnBackdropClick, disableCloseOnEscapeKeyDown: disableCloseOnEscapeKeyDown, disablePortal: disablePortal, hideBackdrop: hideBackdrop, invisibleBackdrop: invisibleBackdrop, onBackdropClick: onBackdropClick, onClose: onClose, open: open, ref: ref, children: children }));
 });
 function useModalContainer() {
     return {

package/Navigation/Navigation.js

@@ -40,9 +40,9 @@ const Navigation = forwardRef((props, ref) => {
             }
         }
     });
-    return (jsx("ul", Object.assign({}, rest, { ref: ref, className: cx(navigationClasses.host, navigationClasses[orientation], className) }, { children: jsx(NavigationContext.Provider, Object.assign({ value: {
+    return (jsx("ul", { ...rest, ref: ref, className: cx(navigationClasses.host, navigationClasses[orientation], className), children: jsx(NavigationContext.Provider, { value: {
                 orientation,
-            } }, { children: ItemChildren }), void 0) }), void 0));
+            }, children: ItemChildren }) }));
 });
 var Navigation$1 = Navigation;