@mezzanine-ui/react 0.13.9 → 0.13.11

package/Picker/useRangePickerValue.js

@@ -1,94 +1,94 @@
 import { usePickerValue } from './usePickerValue.js';
 import { useCalendarContext } from '../Calendar/CalendarContext.js';
 
-function useRangePickerValue({ format, formats, inputFromRef, inputToRef, value: valueProp, }) {
-    const { parse: parseFromConfig, valueLocale, isBefore, } = useCalendarContext();
-    function parse(val) {
-        return parseFromConfig(valueLocale, val, formats);
-    }
-    function sortValues(valueToSort) {
-        const [v1, v2] = valueToSort;
-        return isBefore(v1, v2) ? [v1, v2] : [v2, v1];
-    }
-    const { inputValue: inputFromValue, onBlur: onFromBlur, onChange: onFromChange, onInputChange: onInputFromChange, onKeyDown: onFromKeyDown, value: from, } = usePickerValue({
-        format,
-        formats,
-        value: valueProp === null || valueProp === void 0 ? void 0 : valueProp[0],
-        inputRef: inputFromRef,
-    });
-    const { inputValue: inputToValue, onBlur: onToBlur, onChange: onToChange, onInputChange: onInputToChange, onKeyDown: onToKeyDown, value: to, } = usePickerValue({
-        format,
-        formats,
-        value: valueProp === null || valueProp === void 0 ? void 0 : valueProp[1],
-        inputRef: inputToRef,
-    });
-    const value = [from, to];
-    const onChange = (target) => {
-        const [newFrom, newTo] = target || [];
-        if (newFrom && newTo) {
-            const sortedVal = sortValues([newFrom, newTo]);
-            onFromChange(sortedVal[0]);
-            onToChange(sortedVal[1]);
-            return sortedVal;
-        }
-        onFromChange(target === null || target === void 0 ? void 0 : target[0]);
-        onToChange(target === null || target === void 0 ? void 0 : target[1]);
-        return target;
-    };
-    const onOrderGuardedInputFromChange = (event) => {
-        onInputFromChange(event);
-        const currentVal = parse(event.target.value);
-        if (currentVal && to) {
-            if (isBefore(to, currentVal)) {
-                onToChange(undefined);
-            }
-        }
-    };
-    const onOrderGuardedInputToChange = (event) => {
-        onInputToChange(event);
-        const currentVal = parse(event.target.value);
-        if (currentVal && from) {
-            if (isBefore(currentVal, from)) {
-                onFromChange(undefined);
-            }
-        }
-    };
-    const guardValidValueOnFromKeyDown = (event) => {
-        var _a, _b;
-        onFromKeyDown(event);
-        if (event.key === 'Enter') {
-            if (from && !to) {
-                (_a = inputToRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }
-            else if (to && !from) {
-                (_b = inputFromRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-            }
-        }
-    };
-    const guardValidValueOnToKeyDown = (event) => {
-        var _a, _b;
-        onToKeyDown(event);
-        if (event.key === 'Enter') {
-            if (from && !to) {
-                (_a = inputToRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }
-            else if (to && !from) {
-                (_b = inputFromRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-            }
-        }
-    };
-    return {
-        inputFromValue,
-        inputToValue,
-        onChange,
-        onFromBlur,
-        onFromKeyDown: guardValidValueOnFromKeyDown,
-        onInputFromChange: onOrderGuardedInputFromChange,
-        onInputToChange: onOrderGuardedInputToChange,
-        onToBlur,
-        onToKeyDown: guardValidValueOnToKeyDown,
-        value,
-    };
+function useRangePickerValue({ format, formats, inputFromRef, inputToRef, value: valueProp, }) {
+    const { parse: parseFromConfig, valueLocale, isBefore, } = useCalendarContext();
+    function parse(val) {
+        return parseFromConfig(valueLocale, val, formats);
+    }
+    function sortValues(valueToSort) {
+        const [v1, v2] = valueToSort;
+        return isBefore(v1, v2) ? [v1, v2] : [v2, v1];
+    }
+    const { inputValue: inputFromValue, onBlur: onFromBlur, onChange: onFromChange, onInputChange: onInputFromChange, onKeyDown: onFromKeyDown, value: from, } = usePickerValue({
+        format,
+        formats,
+        value: valueProp === null || valueProp === void 0 ? void 0 : valueProp[0],
+        inputRef: inputFromRef,
+    });
+    const { inputValue: inputToValue, onBlur: onToBlur, onChange: onToChange, onInputChange: onInputToChange, onKeyDown: onToKeyDown, value: to, } = usePickerValue({
+        format,
+        formats,
+        value: valueProp === null || valueProp === void 0 ? void 0 : valueProp[1],
+        inputRef: inputToRef,
+    });
+    const value = [from, to];
+    const onChange = (target) => {
+        const [newFrom, newTo] = target || [];
+        if (newFrom && newTo) {
+            const sortedVal = sortValues([newFrom, newTo]);
+            onFromChange(sortedVal[0]);
+            onToChange(sortedVal[1]);
+            return sortedVal;
+        }
+        onFromChange(target === null || target === void 0 ? void 0 : target[0]);
+        onToChange(target === null || target === void 0 ? void 0 : target[1]);
+        return target;
+    };
+    const onOrderGuardedInputFromChange = (event) => {
+        onInputFromChange(event);
+        const currentVal = parse(event.target.value);
+        if (currentVal && to) {
+            if (isBefore(to, currentVal)) {
+                onToChange(undefined);
+            }
+        }
+    };
+    const onOrderGuardedInputToChange = (event) => {
+        onInputToChange(event);
+        const currentVal = parse(event.target.value);
+        if (currentVal && from) {
+            if (isBefore(currentVal, from)) {
+                onFromChange(undefined);
+            }
+        }
+    };
+    const guardValidValueOnFromKeyDown = (event) => {
+        var _a, _b;
+        onFromKeyDown(event);
+        if (event.key === 'Enter') {
+            if (from && !to) {
+                (_a = inputToRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+            else if (to && !from) {
+                (_b = inputFromRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+            }
+        }
+    };
+    const guardValidValueOnToKeyDown = (event) => {
+        var _a, _b;
+        onToKeyDown(event);
+        if (event.key === 'Enter') {
+            if (from && !to) {
+                (_a = inputToRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+            else if (to && !from) {
+                (_b = inputFromRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+            }
+        }
+    };
+    return {
+        inputFromValue,
+        inputToValue,
+        onChange,
+        onFromBlur,
+        onFromKeyDown: guardValidValueOnFromKeyDown,
+        onInputFromChange: onOrderGuardedInputFromChange,
+        onInputToChange: onOrderGuardedInputToChange,
+        onToBlur,
+        onToKeyDown: guardValidValueOnToKeyDown,
+        value,
+    };
 }
 
 export { useRangePickerValue };

package/Picker/useTabKeyClose.d.ts

@@ -1,2 +1,2 @@
-import { DependencyList, RefObject } from 'react';
-export declare function useTabKeyClose(onClose: VoidFunction, lastElementRefInFlow: RefObject<HTMLElement>, deps?: DependencyList): void;
+import { DependencyList, RefObject } from 'react';
+export declare function useTabKeyClose(onClose: VoidFunction, lastElementRefInFlow: RefObject<HTMLElement>, deps?: DependencyList): void;

package/Picker/useTabKeyClose.js

@@ -1,12 +1,12 @@
 import { useDocumentTabKeyDown } from '../hooks/useDocumentTabKeyDown.js';
 
-function useTabKeyClose(onClose, lastElementRefInFlow, deps) {
-    useDocumentTabKeyDown(() => () => {
-        const { activeElement } = document;
-        if (activeElement === lastElementRefInFlow.current) {
-            onClose();
-        }
-    }, deps);
+function useTabKeyClose(onClose, lastElementRefInFlow, deps) {
+    useDocumentTabKeyDown(() => () => {
+        const { activeElement } = document;
+        if (activeElement === lastElementRefInFlow.current) {
+            onClose();
+        }
+    }, deps);
 }
 
 export { useTabKeyClose };

package/Popconfirm/Popconfirm.d.ts

@@ -1,16 +1,16 @@
-import { ReactNode } from 'react';
-import { IconDefinition } from '@mezzanine-ui/icons';
-import { PopoverProps } from '../Popover';
-import { ConfirmActionsProps } from '../ConfirmActions';
-export interface PopconfirmProps extends PopoverProps, Pick<ConfirmActionsProps, 'cancelButtonProps' | 'cancelText' | 'confirmButtonProps' | 'confirmText' | 'onCancel' | 'onConfirm'> {
-    /**
-     * Customize the icon on the popconfirm
-     */
-    icon?: IconDefinition;
-    /**
-     * the title of the confirmation box
-     */
-    title?: ReactNode;
-}
-declare const Popconfirm: import("react").ForwardRefExoticComponent<PopconfirmProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Popconfirm;
+import { ReactNode } from 'react';
+import { IconDefinition } from '@mezzanine-ui/icons';
+import { PopoverProps } from '../Popover';
+import { ConfirmActionsProps } from '../ConfirmActions';
+export interface PopconfirmProps extends PopoverProps, Pick<ConfirmActionsProps, 'cancelButtonProps' | 'cancelText' | 'confirmButtonProps' | 'confirmText' | 'onCancel' | 'onConfirm'> {
+    /**
+     * Customize the icon on the popconfirm
+     */
+    icon?: IconDefinition;
+    /**
+     * the title of the confirmation box
+     */
+    title?: ReactNode;
+}
+declare const Popconfirm: import("react").ForwardRefExoticComponent<PopconfirmProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Popconfirm;

package/Popconfirm/Popconfirm.js

@@ -7,10 +7,10 @@ import Icon from '../Icon/Icon.js';
 import ConfirmActions from '../ConfirmActions/ConfirmActions.js';
 import cx from 'clsx';
 
-const Popconfirm = forwardRef(function Popconfirm(props, ref) {
-    const { className, container, cancelButtonProps, cancelText, confirmButtonProps, confirmText, icon = ExclamationCircleFilledIcon, onCancel, onConfirm, title, ...rest } = props;
-    return (jsx(Popover, { ...rest, ref: ref, className: cx(popConfirmClasses.host, className), title: (jsxs(Fragment, { children: [jsx(Icon, { className: popConfirmClasses.icon, icon: icon }), title] })), children: jsx(ConfirmActions, { cancelButtonProps: cancelButtonProps, cancelText: cancelText, confirmButtonProps: confirmButtonProps, confirmText: confirmText, onCancel: onCancel, onConfirm: onConfirm, size: "small" }) }));
-});
+const Popconfirm = forwardRef(function Popconfirm(props, ref) {
+    const { className, container, cancelButtonProps, cancelText, confirmButtonProps, confirmText, icon = ExclamationCircleFilledIcon, onCancel, onConfirm, title, ...rest } = props;
+    return (jsx(Popover, { ...rest, ref: ref, className: cx(popConfirmClasses.host, className), title: (jsxs(Fragment, { children: [jsx(Icon, { className: popConfirmClasses.icon, icon: icon }), title] })), children: jsx(ConfirmActions, { cancelButtonProps: cancelButtonProps, cancelText: cancelText, confirmButtonProps: confirmButtonProps, confirmText: confirmText, onCancel: onCancel, onConfirm: onConfirm, size: "small" }) }));
+});
 var Popconfirm$1 = Popconfirm;
 
 export { Popconfirm$1 as default };

package/Popconfirm/index.d.ts

@@ -1 +1 @@
-export { PopconfirmProps, default, } from './Popconfirm';
+export { PopconfirmProps, default, } from './Popconfirm';

package/Popover/Popover.d.ts

@@ -1,23 +1,23 @@
-import { ReactNode } from 'react';
-import { PopperProps } from '../Popper';
-import { ClickAwayEvent } from '../hooks/useClickAway';
-export interface PopoverProps extends Omit<PopperProps, 'title'> {
-    /**
-     * Whether to disable triggering onClose while clicked away.
-     * @default false
-     */
-    disableClickAway?: boolean;
-    /**
-     * The handler fired while clicked away.
-     */
-    onClose?: (event: ClickAwayEvent) => void;
-    /**
-     * the title of popover
-     */
-    title?: ReactNode;
-}
-/**
- * The react component for `mezzanine` popover.
- */
-declare const Popover: import("react").ForwardRefExoticComponent<PopoverProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Popover;
+import { ReactNode } from 'react';
+import { PopperProps } from '../Popper';
+import { ClickAwayEvent } from '../hooks/useClickAway';
+export interface PopoverProps extends Omit<PopperProps, 'title'> {
+    /**
+     * Whether to disable triggering onClose while clicked away.
+     * @default false
+     */
+    disableClickAway?: boolean;
+    /**
+     * The handler fired while clicked away.
+     */
+    onClose?: (event: ClickAwayEvent) => void;
+    /**
+     * the title of popover
+     */
+    title?: ReactNode;
+}
+/**
+ * The react component for `mezzanine` popover.
+ */
+declare const Popover: import("react").ForwardRefExoticComponent<PopoverProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Popover;

package/Popover/Popover.js

@@ -6,40 +6,40 @@ import { useComposeRefs } from '../hooks/useComposeRefs.js';
 import Popper from '../Popper/Popper.js';
 import cx from 'clsx';
 
-const offsetModifier = {
-    name: 'offset',
-    options: {
-        offset: [0, 8],
-    },
-};
-/**
- * The react component for `mezzanine` popover.
- */
-const Popover = forwardRef(function Popover(props, ref) {
-    const { children, className, disableClickAway = false, onClose, open, options = {}, title, ...rest } = props;
-    const { modifiers = [] } = options;
-    const popoverRef = useRef(null);
-    const composedRef = useComposeRefs([ref, popoverRef]);
-    useClickAway(() => {
-        if (!open || disableClickAway || !onClose) {
-            return;
-        }
-        return (event) => {
-            if (onClose) {
-                onClose(event);
-            }
-        };
-    }, popoverRef, [
-        open,
-        disableClickAway,
-        onClose,
-        popoverRef,
-    ]);
-    return (jsxs(Popper, { ...rest, ref: composedRef, className: cx(popoverClasses.host, className), open: open, options: {
-            ...options,
-            modifiers: [offsetModifier, ...modifiers],
-        }, children: [title && jsx("div", { className: popoverClasses.title, children: title }), children && jsx("div", { className: popoverClasses.content, children: children })] }));
-});
+const offsetModifier = {
+    name: 'offset',
+    options: {
+        offset: [0, 8],
+    },
+};
+/**
+ * The react component for `mezzanine` popover.
+ */
+const Popover = forwardRef(function Popover(props, ref) {
+    const { children, className, disableClickAway = false, onClose, open, options = {}, title, ...rest } = props;
+    const { modifiers = [] } = options;
+    const popoverRef = useRef(null);
+    const composedRef = useComposeRefs([ref, popoverRef]);
+    useClickAway(() => {
+        if (!open || disableClickAway || !onClose) {
+            return;
+        }
+        return (event) => {
+            if (onClose) {
+                onClose(event);
+            }
+        };
+    }, popoverRef, [
+        open,
+        disableClickAway,
+        onClose,
+        popoverRef,
+    ]);
+    return (jsxs(Popper, { ...rest, ref: composedRef, className: cx(popoverClasses.host, className), open: open, options: {
+            ...options,
+            modifiers: [offsetModifier, ...modifiers],
+        }, children: [title && jsx("div", { className: popoverClasses.title, children: title }), children && jsx("div", { className: popoverClasses.content, children: children })] }));
+});
 var Popover$1 = Popover;
 
 export { Popover$1 as default };

package/Popover/index.d.ts

@@ -1 +1 @@
-export { PopoverProps, default, } from './Popover';
+export { PopoverProps, default, } from './Popover';

package/Popper/Popper.d.ts

@@ -1,32 +1,32 @@
-import { Options as _PopperOptions } from '@popperjs/core';
-import { Ref } from 'react';
-import { Modifier, usePopper } from 'react-popper';
-import { ElementGetter } from '../utils/getElement';
-import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
-import { PortalProps } from '../Portal';
-export type { Placement as PopperPlacement, PositioningStrategy as PopperPositionStrategy, } from '@popperjs/core';
-export type PopperOptions<Modifiers> = Omit<Partial<_PopperOptions>, 'modifiers'> & {
-    modifiers?: ReadonlyArray<Modifier<Modifiers>>;
-};
-export type PopperController = ReturnType<typeof usePopper>;
-export interface PopperProps extends Pick<PortalProps, 'container' | 'disablePortal'>, NativeElementPropsWithoutKeyAndRef<'div'> {
-    /**
-     * The ref of trigger Element.
-     */
-    anchor?: ElementGetter;
-    /**
-     * Provide `controllerRef` if you need access to `usePopper` results.
-     */
-    controllerRef?: Ref<PopperController>;
-    /**
-     * The portal element will show if open=true
-     * @default false
-     */
-    open?: boolean;
-    /**
-     * The options of usePopper hook of react-popper.
-     */
-    options?: PopperOptions<any>;
-}
-declare const Popper: import("react").ForwardRefExoticComponent<PopperProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Popper;
+import { Options as _PopperOptions } from '@popperjs/core';
+import { Ref } from 'react';
+import { Modifier, usePopper } from 'react-popper';
+import { ElementGetter } from '../utils/getElement';
+import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
+import { PortalProps } from '../Portal';
+export type { Placement as PopperPlacement, PositioningStrategy as PopperPositionStrategy, } from '@popperjs/core';
+export type PopperOptions<Modifiers> = Omit<Partial<_PopperOptions>, 'modifiers'> & {
+    modifiers?: ReadonlyArray<Modifier<Modifiers>>;
+};
+export type PopperController = ReturnType<typeof usePopper>;
+export interface PopperProps extends Pick<PortalProps, 'container' | 'disablePortal'>, NativeElementPropsWithoutKeyAndRef<'div'> {
+    /**
+     * The ref of trigger Element.
+     */
+    anchor?: ElementGetter;
+    /**
+     * Provide `controllerRef` if you need access to `usePopper` results.
+     */
+    controllerRef?: Ref<PopperController>;
+    /**
+     * The portal element will show if open=true
+     * @default false
+     */
+    open?: boolean;
+    /**
+     * The options of usePopper hook of react-popper.
+     */
+    options?: PopperOptions<any>;
+}
+declare const Popper: import("react").ForwardRefExoticComponent<PopperProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Popper;

package/Popper/Popper.js

@@ -5,27 +5,27 @@ import { getElement } from '../utils/getElement.js';
 import { useComposeRefs } from '../hooks/useComposeRefs.js';
 import Portal from '../Portal/Portal.js';
 
-const Popper = forwardRef(function Popper(props, ref) {
-    const { anchor, children, container, controllerRef, disablePortal, open = false, options, style, ...rest } = props;
-    const [popperEl, setPopperEl] = useState(null);
-    const composedRef = useComposeRefs([ref, setPopperEl]);
-    const anchorEl = getElement(anchor);
-    const { attributes, forceUpdate, state, styles, update, } = usePopper(anchorEl, popperEl, options);
-    useImperativeHandle(controllerRef, () => ({
-        attributes,
-        forceUpdate,
-        state,
-        styles,
-        update,
-    }));
-    if (!open) {
-        return null;
-    }
-    return (jsx(Portal, { container: container, disablePortal: disablePortal, children: jsx("div", { ...rest, ref: composedRef, style: {
-                ...style,
-                ...styles.popper,
-            }, ...attributes.popper, children: children }) }));
-});
+const Popper = forwardRef(function Popper(props, ref) {
+    const { anchor, children, container, controllerRef, disablePortal, open = false, options, style, ...rest } = props;
+    const [popperEl, setPopperEl] = useState(null);
+    const composedRef = useComposeRefs([ref, setPopperEl]);
+    const anchorEl = getElement(anchor);
+    const { attributes, forceUpdate, state, styles, update, } = usePopper(anchorEl, popperEl, options);
+    useImperativeHandle(controllerRef, () => ({
+        attributes,
+        forceUpdate,
+        state,
+        styles,
+        update,
+    }));
+    if (!open) {
+        return null;
+    }
+    return (jsx(Portal, { container: container, disablePortal: disablePortal, children: jsx("div", { ...rest, ref: composedRef, style: {
+                ...style,
+                ...styles.popper,
+            }, ...attributes.popper, children: children }) }));
+});
 var Popper$1 = Popper;
 
 export { Popper$1 as default };

package/Popper/index.d.ts

@@ -1 +1 @@
-export { PopperPlacement, PopperPositionStrategy, PopperOptions, PopperController, PopperProps, default, } from './Popper';
+export { PopperPlacement, PopperPositionStrategy, PopperOptions, PopperController, PopperProps, default, } from './Popper';

package/Portal/Portal.d.ts

@@ -1,20 +1,20 @@
-import { FC, ReactNode } from 'react';
-import { ElementGetter } from '../utils/getElement';
-export interface PortalProps {
-    /**
-     * The element you want to portal.
-     */
-    children?: ReactNode;
-    /**
-     * The destination where to portal.
-     */
-    container?: ElementGetter;
-    /**
-     * Whether to disable portal.
-     * If true, it will be a normal component.
-     * @default false
-     */
-    disablePortal?: boolean;
-}
-declare const Portal: FC<PortalProps>;
-export default Portal;
+import { FC, ReactNode } from 'react';
+import { ElementGetter } from '../utils/getElement';
+export interface PortalProps {
+    /**
+     * The element you want to portal.
+     */
+    children?: ReactNode;
+    /**
+     * The destination where to portal.
+     */
+    container?: ElementGetter;
+    /**
+     * Whether to disable portal.
+     * If true, it will be a normal component.
+     * @default false
+     */
+    disablePortal?: boolean;
+}
+declare const Portal: FC<PortalProps>;
+export default Portal;

package/Portal/Portal.js

@@ -3,21 +3,21 @@ import { useState, useEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { getElement } from '../utils/getElement.js';
 
-const Portal = (props) => {
-    const { children, container, disablePortal = false, } = props;
-    const [portalElement, setPortalElement] = useState(() => (disablePortal
-        ? null
-        : getElement(container) || document.body));
-    useEffect(() => {
-        if (!disablePortal) {
-            setPortalElement(getElement(container) || document.body);
-        }
-    }, [container, disablePortal]);
-    if (disablePortal || !portalElement) {
-        return jsx(Fragment, { children: children });
-    }
-    return createPortal(children, portalElement);
-};
+const Portal = (props) => {
+    const { children, container, disablePortal = false, } = props;
+    const [portalElement, setPortalElement] = useState(() => (disablePortal
+        ? null
+        : getElement(container) || document.body));
+    useEffect(() => {
+        if (!disablePortal) {
+            setPortalElement(getElement(container) || document.body);
+        }
+    }, [container, disablePortal]);
+    if (disablePortal || !portalElement) {
+        return jsx(Fragment, { children: children });
+    }
+    return createPortal(children, portalElement);
+};
 var Portal$1 = Portal;
 
 export { Portal$1 as default };

package/Portal/index.d.ts

@@ -1 +1 @@
-export { PortalProps, default, } from './Portal';
+export { PortalProps, default, } from './Portal';