@mezzanine-ui/react 1.0.0-beta.5 → 1.0.0-beta.7

package/Card/Card.d.ts

@@ -1,51 +0,0 @@
-import { ReactNode } from 'react';
-import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
-import { TypographyProps } from '../Typography';
-export interface CardProps extends Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'title' | 'children'> {
-    /**
-     * Card footer actions.
-     */
-    actions?: ReactNode;
-    /**
-     * Card cover.
-     */
-    cover?: ReactNode;
-    /**
-     * The container of the text content(title, subtitle and description).
-     */
-    contentProps?: Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'children'>;
-    /**
-     * Description under the subtitle. visible if value is not empty.
-     */
-    description?: string;
-    /**
-     * Description props
-     */
-    descriptionProps?: Omit<TypographyProps, 'children'>;
-    /**
-     * The container of the content and actions.
-     */
-    metaProps?: Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'children'>;
-    /**
-     * Subtitle under the title. visible if value is not empty.
-     */
-    subtitle?: ReactNode;
-    /**
-     * Subtitle props
-     */
-    subtitleProps?: Omit<TypographyProps, 'children'>;
-    /**
-     * Card title, visible if value is not empty.
-     */
-    title?: ReactNode;
-    /**
-     * Card title props
-     * @default 'variant: h3'
-     */
-    titleProps?: Omit<TypographyProps, 'children'>;
-}
-/**
- * The react component for `mezzanine` card.
- */
-declare const Card: import("react").ForwardRefExoticComponent<CardProps & import("react").RefAttributes<HTMLDivElement>>;
-export default Card;

package/Card/Card.js

@@ -1,20 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { cardClasses } from '@mezzanine-ui/core/card';
-import Typography from '../Typography/Typography.js';
-import cx from 'clsx';
-
-/**
- * The react component for `mezzanine` card.
- */
-const Card = forwardRef(function Card(props, ref) {
-    const { actions, className, contentProps, cover, description, descriptionProps, metaProps, subtitle, subtitleProps, title, titleProps, ...rest } = props;
-    const { variant = 'h3' } = titleProps || {};
-    const titleTypography = title ? (jsx(Typography, { variant: variant, ...titleProps, children: title })) : null;
-    const subtitleTypography = subtitle ? (jsx(Typography, { ...subtitleProps, children: subtitle })) : null;
-    const contentHeader = titleTypography || subtitleTypography ? (jsxs("div", { className: cardClasses.metaContentsHeader, children: [titleTypography, subtitleTypography] })) : null;
-    const descriptionTypography = description ? (jsx(Typography, { ...descriptionProps, children: description })) : null;
-    return (jsxs("div", { ref: ref, className: cx(cardClasses.host, className), ...rest, children: [cover, jsxs("div", { className: cardClasses.meta, ...metaProps, children: [jsxs("div", { className: cardClasses.metaContents, ...contentProps, children: [contentHeader, descriptionTypography] }), actions] })] }));
-});
-
-export { Card as default };

package/Card/CardActions.d.ts

@@ -1,34 +0,0 @@
-import { ReactNode } from 'react';
-import { ButtonProps } from '../Button';
-import { ConfirmActionsProps } from '../ConfirmActions';
-export interface CardActionsProps extends ConfirmActionsProps {
-    /**
-     * Content of cancel button. not render if value is empty.
-     */
-    cancelText?: string;
-    /**
-     * Content of confirm button. not render if value is empty.
-     */
-    confirmText?: string;
-    /**
-     * Click handler for cancel button.
-     */
-    onCancel?: ButtonProps['onClick'];
-    /**
-     * Click handler for confirm button.
-     */
-    onConfirm?: ButtonProps['onClick'];
-    /**
-     * Indicate whether confirm button loading and cancel button disabled.
-     */
-    loading?: boolean;
-    /**
-     * The action bottom on the left. not render if value is empty.
-     */
-    otherActions?: ReactNode;
-}
-/**
- * The react component for `mezzanine` cardActions.
- */
-declare const CardActions: import("react").ForwardRefExoticComponent<CardActionsProps & import("react").RefAttributes<HTMLDivElement>>;
-export default CardActions;

package/Card/CardActions.js

@@ -1,15 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { cardActionsClasses } from '@mezzanine-ui/core/card';
-import ConfirmActions from '../ConfirmActions/ConfirmActions.js';
-import cx from 'clsx';
-
-/**
- * The react component for `mezzanine` cardActions.
- */
-const CardActions = forwardRef(function CardActions(props, ref) {
-    const { cancelText, cancelButtonProps, className, confirmText, confirmButtonProps, hideCancelButton, hideConfirmButton, loading, onCancel, onConfirm, otherActions, ...rest } = props;
-    return (jsxs("div", { ref: ref, className: cx(cardActionsClasses.host, className), ...rest, children: [otherActions || jsx("div", {}), jsx(ConfirmActions, { cancelText: cancelText, confirmText: confirmText, cancelButtonProps: cancelButtonProps, confirmButtonProps: confirmButtonProps, hideCancelButton: hideCancelButton || !cancelText, hideConfirmButton: hideConfirmButton || !confirmText, loading: loading, onCancel: onCancel, onConfirm: onConfirm })] }));
-});
-
-export { CardActions as default };

package/ConfirmActions/ConfirmActions.d.ts

@@ -1,46 +0,0 @@
-import { ReactNode } from 'react';
-import { ButtonProps } from '../Button/Button';
-import { ButtonGroupProps } from '../Button/ButtonGroup';
-export interface ConfirmActionsProps extends Omit<ButtonGroupProps, 'children'> {
-    /**
-     * Other props of cancel button.
-     */
-    cancelButtonProps?: ButtonProps;
-    /**
-     * Content of cancel button.
-     */
-    cancelText?: ReactNode;
-    /**
-     * Other props of confirm button.
-     */
-    confirmButtonProps?: ButtonProps;
-    /**
-     * Content of confirm button.
-     */
-    confirmText?: ReactNode;
-    /**
-     * Whether to hide cancel button.
-     */
-    hideCancelButton?: boolean;
-    /**
-     * Whether to hide confirm button.
-     */
-    hideConfirmButton?: boolean;
-    /**
-     * Indicate whether confirm button loading and cancel button disabled.
-     */
-    loading?: boolean;
-    /**
-     * Click handler for cancel button.
-     */
-    onCancel?: ButtonProps['onClick'];
-    /**
-     * Click handler for confirm button.
-     */
-    onConfirm?: ButtonProps['onClick'];
-}
-/**
- * The react component for `mezzanine` confirm actions.
- */
-declare const ConfirmActions: import("react").ForwardRefExoticComponent<ConfirmActionsProps & import("react").RefAttributes<HTMLDivElement>>;
-export default ConfirmActions;

package/ConfirmActions/ConfirmActions.js

@@ -1,15 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import Button from '../Button/Button.js';
-import ButtonGroup from '../Button/ButtonGroup.js';
-
-/**
- * The react component for `mezzanine` confirm actions.
- */
-const ConfirmActions = forwardRef(function ConfirmActions(props, ref) {
-    const { cancelButtonProps, cancelText, confirmButtonProps, confirmText, hideCancelButton, hideConfirmButton, loading, onCancel, onConfirm, ...rest } = props;
-    const { disabled: cancelButtonDisabled = loading } = cancelButtonProps || {};
-    return (jsxs(ButtonGroup, { ...rest, ref: ref, children: [!hideCancelButton && (jsx(Button, { variant: "outlined", ...cancelButtonProps, disabled: cancelButtonDisabled, onClick: onCancel, children: cancelText })), !hideConfirmButton && (jsx(Button, { variant: "contained", ...confirmButtonProps, loading: loading, onClick: onConfirm, children: confirmText }))] }));
-});
-
-export { ConfirmActions as default };

package/ConfirmActions/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from './ConfirmActions';
-export type { ConfirmActionsProps } from './ConfirmActions';

package/ConfirmActions/index.js

@@ -1 +0,0 @@
-export { default } from './ConfirmActions.js';

package/Popconfirm/Popconfirm.d.ts

@@ -1,16 +0,0 @@
-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

@@ -1,15 +0,0 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { ExclamationCircleFilledIcon } from '@mezzanine-ui/icons';
-import { popConfirmClasses } from '@mezzanine-ui/core/popconfirm';
-import Popover from '../Popover/Popover.js';
-import ConfirmActions from '../ConfirmActions/ConfirmActions.js';
-import Icon from '../Icon/Icon.js';
-import cx from 'clsx';
-
-const Popconfirm = forwardRef(function Popconfirm(props, ref) {
-    const { className, 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" }) }));
-});
-
-export { Popconfirm as default };

package/Popconfirm/index.d.ts

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

package/Popconfirm/index.js

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

package/Popover/Popover.d.ts

@@ -1,23 +0,0 @@
-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

@@ -1,35 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useRef } from 'react';
-import { popoverClasses } from '@mezzanine-ui/core/popover';
-import { offset } from '@floating-ui/react-dom';
-import { useClickAway } from '../hooks/useClickAway.js';
-import { useComposeRefs } from '../hooks/useComposeRefs.js';
-import Popper from '../Popper/Popper.js';
-import cx from 'clsx';
-
-const offsetMiddleware = offset({ mainAxis: 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 { middleware = [] } = 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,
-            middleware: [offsetMiddleware, ...middleware],
-        }, children: [title && jsx("div", { className: popoverClasses.title, children: title }), children && jsx("div", { className: popoverClasses.content, children: children })] }));
-});
-
-export { Popover as default };

package/Popover/index.d.ts

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

package/Popover/index.js

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

package/Select/Option.d.ts

@@ -1,18 +0,0 @@
-import { MenuItemProps } from '../Menu';
-export interface OptionProps extends Omit<MenuItemProps, 'children' | 'role'> {
-    /**
-     * option children (often means the option name)
-     */
-    children: string;
-    /**
-     * The role of menu item.
-     * @default 'option'
-     */
-    role?: string;
-    /**
-     * The value of option
-     */
-    value: string;
-}
-declare const Option: import("react").ForwardRefExoticComponent<OptionProps & import("react").RefAttributes<HTMLLIElement>>;
-export default Option;

package/Select/Option.js

@@ -1,45 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { SelectControlContext } from './SelectControlContext.js';
-import MenuItem from '../Menu/MenuItem.js';
-
-const Option = forwardRef(function Option(props, ref) {
-    const { active: activeProp, children, role = 'option', value, ...rest } = props;
-    const selectControl = useContext(SelectControlContext);
-    const { onChange, value: selectedValue } = selectControl || {};
-    const getActive = () => {
-        if (activeProp) {
-            return activeProp;
-        }
-        if (selectedValue) {
-            if (Array.isArray(selectedValue)) {
-                return selectedValue.find((sv) => sv.id === value);
-            }
-            return selectedValue.id === value;
-        }
-        return false;
-    };
-    const active = Boolean(getActive());
-    const onSelect = () => {
-        if (typeof onChange === 'function' && value) {
-            onChange({
-                id: value,
-                name: children,
-            });
-        }
-    };
-    const onKeyDown = (evt) => {
-        switch (evt.code) {
-            case 'Enter':
-                onSelect();
-                break;
-        }
-    };
-    return (jsx(MenuItem, { ...rest, ref: ref, active: active, "aria-selected": active, id: value, onClick: (evt) => {
-            evt.stopPropagation();
-            onSelect();
-        }, onKeyDown: onKeyDown, role: role, tabIndex: 0, children: children }));
-});
-
-export { Option as default };

package/Select/TreeSelect.d.ts

@@ -1,67 +0,0 @@
-import { SelectInputSize } from '@mezzanine-ui/core/select';
-import { FormElementFocusHandlers } from '../Form';
-import { MenuProps } from '../Menu';
-import { PickRenameMulti } from '../utils/general';
-import { InputTriggerPopperProps } from '../_internal/InputTriggerPopper';
-import { SelectTriggerProps, SelectTriggerInputProps } from './SelectTrigger';
-import { SelectValue, TreeSelectOption } from './typings';
-import { TreeProps } from '../Tree';
-export interface TreeSelectProps extends Omit<SelectTriggerProps, 'active' | 'onBlur' | 'onChange' | 'onClear' | 'onClick' | 'onFocus' | 'onKeyDown' | 'readOnly' | 'searchInputProps'>, FormElementFocusHandlers, Pick<TreeProps, 'defaultExpandAll' | 'disabledValues' | 'expandControllerRef' | 'onExpand'>, PickRenameMulti<Pick<MenuProps, 'itemsInView' | 'maxHeight' | 'role' | 'size'>, {
-    maxHeight: 'menuMaxHeight';
-    role: 'menuRole';
-    size: 'menuSize';
-}>, PickRenameMulti<Pick<InputTriggerPopperProps, 'options'>, {
-    options: 'popperOptions';
-}> {
-    /**
-     * The width of options panel will be calculated based on the depth of your options.
-     * If you know how many layers in your object, pass it via this prop will have better performance.
-     */
-    depth?: number;
-    /**
-     * The other native props for input element.
-     */
-    inputProps?: Omit<SelectTriggerInputProps, 'onBlur' | 'onChange' | 'onFocus' | 'placeholder' | 'role' | 'value' | `aria-${'expanded'}`>;
-    /**
-     * Other props you may provide to `Menu`.
-     */
-    menuProps?: Omit<MenuProps, 'itemsInView' | 'maxHeight' | 'role' | 'size'>;
-    /**
-     * The change event handler of input element.
-     */
-    onChange?(newOptions: SelectValue[]): any;
-    /**
-     * The nested options for `TreeSelect`
-     */
-    options: TreeSelectOption[];
-    /**
-     * select input placeholder
-     */
-    placeholder?: string;
-    /**
-     * Whether the selection is required.
-     * @default false
-     */
-    required?: boolean;
-    /**
-     * If true, the panel will have its min-width be same as the trigger width.
-     * @default false
-     */
-    sameWidth?: InputTriggerPopperProps['sameWidth'];
-    /**
-     * The size of input.
-     * @default 'medium'
-     */
-    size?: SelectInputSize;
-    /**
-     * Other props you may provide to `Tree`
-     */
-    treeProps?: Omit<TreeProps, 'defaultExpandAll' | 'disabledValues' | 'expandControllerRef' | 'expandedValues' | 'nodes' | 'onExpand' | 'onSelect' | 'selectMethod' | 'selectable' | 'values'>;
-    /**
-     * The value of selection.
-     * @default undefined
-     */
-    value?: SelectValue[];
-}
-declare const TreeSelect: import("react").ForwardRefExoticComponent<Omit<TreeSelectProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-export default TreeSelect;

package/Select/TreeSelect.js

@@ -1,198 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext, useMemo, useRef, useState } from 'react';
-import { selectClasses } from '@mezzanine-ui/core/select';
-import { useComposeRefs } from '../hooks/useComposeRefs.js';
-import { useClickAway } from '../hooks/useClickAway.js';
-import SelectTrigger from './SelectTrigger.js';
-import { useIsomorphicLayoutEffect } from '../hooks/useIsomorphicLayoutEffect.js';
-import { FormControlContext } from '../Form/FormControlContext.js';
-import { traverseTree } from '../Tree/traverseTree.js';
-import InputTriggerPopper from '../_internal/InputTriggerPopper/InputTriggerPopper.js';
-import Menu from '../Menu/Menu.js';
-import Tree from '../Tree/Tree.js';
-import { toggleValue } from '../Tree/toggleValue.js';
-import cx from 'clsx';
-
-const TreeSelect = forwardRef((props, ref) => {
-    const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
-    const { className, clearable = false, defaultExpandAll, depth, disabled = disabledFromFormControl || false, disabledValues, error = severity === 'error' || false, expandControllerRef, fullWidth = fullWidthFromFormControl || false, inputProps, inputRef, itemsInView = 4, menuMaxHeight, menuProps, menuRole = 'listbox', menuSize, mode = 'single', onBlur, onChange: onChangeProp, onExpand: onExpandProp, onFocus, options, placeholder = '', popperOptions, prefix, renderValue, required = requiredFromFormControl || false, sameWidth = false, size, suffixActionIcon, treeProps, value: valueProp, } = props;
-    const { className: treeClassName, ...restTreeProps } = treeProps || {};
-    const { width, border, ...restStyle } = (menuProps === null || menuProps === void 0 ? void 0 : menuProps.style) || {};
-    const multiple = mode === 'multiple';
-    /** Compute panel width */
-    const panelWidth = useMemo(() => {
-        if (width) {
-            return;
-        }
-        const base = multiple ? 224 : 208;
-        const indent = 16;
-        function getWidth(resultDepth) {
-            return (resultDepth - 1) * indent + base;
-        }
-        if (depth) {
-            return getWidth(depth);
-        }
-        function maxDepth(object, counter = 1) {
-            if (object.siblings) {
-                return Math.max(...object.siblings.map((sibling) => maxDepth(sibling, counter + 1)));
-            }
-            return counter;
-        }
-        const computedMaxDepth = options.reduce((acc, current) => {
-            const currentDepth = maxDepth(current);
-            return currentDepth > acc ? currentDepth : acc;
-        }, 0);
-        return getWidth(computedMaxDepth);
-    }, [depth, multiple, options, width]);
-    /** Popper positioning */
-    const nodeRef = useRef(null);
-    const controlRef = useRef(null);
-    const popperRef = useRef(null);
-    const composedRef = useComposeRefs([ref, controlRef]);
-    /** Make popper positioning dynamically by computing styles every time value prop changes */
-    const controllerRef = useRef(null);
-    useIsomorphicLayoutEffect(() => {
-        var _a, _b;
-        (_b = (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.forceUpdate) === null || _b === void 0 ? void 0 : _b.call(_a);
-    }, [valueProp]);
-    /** Open control */
-    const [open, toggleOpen] = useState(false);
-    const onOpen = () => {
-        onFocus === null || onFocus === void 0 ? void 0 : onFocus();
-        toggleOpen(true);
-    };
-    const onClose = () => {
-        onBlur === null || onBlur === void 0 ? void 0 : onBlur();
-        toggleOpen(false);
-    };
-    const onToggleOpen = () => {
-        if (open) {
-            onClose();
-        }
-        else {
-            onOpen();
-        }
-    };
-    const onTextFieldClick = disabled
-        ? undefined
-        : () => {
-            onToggleOpen();
-        };
-    const onTextFieldKeydown = disabled
-        ? undefined
-        : (event) => {
-            switch (event.code) {
-                case 'Enter':
-                    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                    onTextFieldClick();
-                    break;
-                case 'ArrowUp':
-                case 'ArrowRight':
-                case 'ArrowLeft':
-                case 'ArrowDown': {
-                    if (!open) {
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        onTextFieldClick();
-                    }
-                    break;
-                }
-                case 'Tab': {
-                    if (open) {
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        onTextFieldClick();
-                    }
-                    break;
-                }
-            }
-        };
-    useClickAway(() => {
-        if (!open)
-            return;
-        return (event) => {
-            var _a;
-            if (!((_a = popperRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))) {
-                onClose();
-            }
-        };
-    }, controlRef, [open, toggleOpen]);
-    /** Trigger input props */
-    const resolvedInputProps = {
-        ...inputProps,
-        'aria-expanded': open,
-        placeholder,
-        role: 'combobox',
-    };
-    /** Tags close handler */
-    const onTagClose = onChangeProp && valueProp
-        ? (target) => {
-            onChangeProp(valueProp.filter((v) => v.id !== target.id));
-        }
-        : undefined;
-    /** Clear method */
-    const onClear = clearable && onChangeProp
-        ? () => {
-            onChangeProp([]);
-        }
-        : undefined;
-    /** Map options to tree nodes */
-    function mapOptionToNode(option) {
-        var _a;
-        return {
-            label: option.name,
-            value: option.id,
-            dynamicNodesFetching: option.dynamicChildrenFetching,
-            nodes: (_a = option.siblings) === null || _a === void 0 ? void 0 : _a.map((sibling) => mapOptionToNode(sibling)),
-        };
-    }
-    function flattenOptions(targets) {
-        const optionsMap = {};
-        function mapOptionsToSelectValue(optionsToMap) {
-            optionsToMap.forEach((optionToMap) => {
-                optionsMap[optionToMap.id] = {
-                    id: optionToMap.id,
-                    name: optionToMap.name,
-                };
-                if (optionToMap.siblings) {
-                    mapOptionsToSelectValue(optionToMap.siblings);
-                }
-            });
-        }
-        mapOptionsToSelectValue(targets);
-        return optionsMap;
-    }
-    const optionMap = flattenOptions(options);
-    const nodes = options.map((option) => mapOptionToNode(option));
-    /** Map selected values */
-    const selectedValues = valueProp === null || valueProp === void 0 ? void 0 : valueProp.map((v) => mapOptionToNode(v).value);
-    const onSelect = onChangeProp
-        ? (values) => {
-            const selectValues = values.map((currentValue) => optionMap[currentValue]);
-            onChangeProp(selectValues);
-        }
-        : undefined;
-    /** Controlled expanded value to avoid expanded values cleanup after panel toggled */
-    const [expandedValues, setExpandedValues] = useState(() => {
-        const currentExpandedValues = [];
-        if (defaultExpandAll) {
-            traverseTree(nodes, (node) => {
-                if (node.nodes) {
-                    currentExpandedValues.push(node.value);
-                }
-            });
-        }
-        return currentExpandedValues;
-    });
-    const onExpand = (value) => {
-        const newExpandedValues = toggleValue(value, expandedValues);
-        setExpandedValues(newExpandedValues);
-        onExpandProp === null || onExpandProp === void 0 ? void 0 : onExpandProp(value);
-    };
-    return (jsxs("div", { ref: nodeRef, className: selectClasses.treeSelect, children: [jsx(SelectTrigger, { ref: composedRef, active: open, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, mode: mode, onClear: onClear, onClick: onTextFieldClick, onKeyDown: onTextFieldKeydown, onTagClose: onTagClose, prefix: prefix, readOnly: true, renderValue: renderValue, required: required, size: size, suffixActionIcon: suffixActionIcon, value: valueProp }), jsx(InputTriggerPopper, { ref: popperRef, anchor: controlRef, className: selectClasses.popper, controllerRef: controllerRef, open: open, options: popperOptions, sameWidth: sameWidth, children: jsx(Menu, { itemsInView: itemsInView, maxHeight: menuMaxHeight, role: menuRole, size: menuSize, style: {
-                        ...restStyle,
-                        border: border || 0,
-                        width: width || `${panelWidth}px`,
-                    }, children: jsx(Tree, { ...restTreeProps, ref: ref, className: cx(selectClasses.tree, treeClassName), disabledValues: disabledValues, expandControllerRef: expandControllerRef, expandedValues: expandedValues, multiple: multiple, nodes: nodes, onExpand: onExpand, onSelect: onSelect, selectMethod: "target", selectable: true, values: selectedValues }) }) })] }));
-});
-
-export { TreeSelect as default };