@ansible/ansible-ui-framework 0.0.259 → 0.0.260

package/mjs/components/Masonry.js

@@ -1,69 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Grid, GridItem, Stack } from '@patternfly/react-core';
-import useResizeObserver from '@react-hook/resize-observer';
-import { Children, useLayoutEffect, useMemo, useRef, useState, } from 'react';
-export function Masonry(props) {
-    const target = useRef(null);
-    const [columns, setColumns] = useState(1);
-    useResizeObserver(target, (entry) => {
-        setColumns(Math.min(props.maxColumns ?? 12, Math.max(Math.floor(entry.contentRect.width / props.minSize), 1)));
-    });
-    const [span, setSpan] = useState(12);
-    const [sizes, setSizes] = useState({});
-    useLayoutEffect(() => {
-        switch (columns) {
-            case 1:
-                setSpan(12);
-                break;
-            case 2:
-                setSpan(6);
-                break;
-            case 3:
-                setSpan(4);
-                break;
-            case 4:
-                setSpan(3);
-                break;
-            case 5:
-                setSpan(2);
-                break;
-            case 6:
-                setSpan(2);
-                break;
-            default:
-                setSpan(1);
-                break;
-        }
-    }, [columns]);
-    const realColumns = 12 / span;
-    const itemColumns = useMemo(() => {
-        const itemColumns = new Array(realColumns).fill(0).map(() => []);
-        const columnHeights = new Array(realColumns).fill(0);
-        Children.forEach(props.children, (child, index) => {
-            const smallest = Math.min(...columnHeights);
-            const columnIndex = columnHeights.findIndex((column) => column === smallest);
-            if (columnIndex !== undefined && columnIndex !== -1) {
-                itemColumns[columnIndex].push(_jsx(MasonryItem, { index: index, sizes: sizes, setSizes: setSizes, children: child }, index));
-                const height = sizes[index];
-                if (height !== undefined) {
-                    columnHeights[columnIndex] += height + 16;
-                }
-            }
-        });
-        return itemColumns;
-    }, [props.children, realColumns, sizes]);
-    return (_jsx("div", { ref: target, children: _jsx(Grid, { hasGutter: true, style: { maxWidth: realColumns * props.minSize }, children: itemColumns.map((column, index) => (_jsx(GridItem, { span: span, children: _jsx(Stack, { hasGutter: true, children: column }) }, index))) }) }));
-}
-function MasonryItem(props) {
-    const target = useRef(null);
-    useResizeObserver(target, (entry) => {
-        props.setSizes((sizes) => {
-            if (props.sizes[props.index] !== entry.contentRect.height) {
-                sizes = { ...sizes };
-                sizes[props.index] = entry.contentRect.height;
-            }
-            return sizes;
-        });
-    });
-    return _jsx("div", { ref: target, children: props.children });
-}

package/mjs/components/Scrollable.js

@@ -1,60 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import useResizeObserver from '@react-hook/resize-observer';
-import { useCallback, useEffect, useRef, useState } from 'react';
-export function Scrollable(props) {
-    const divEl = useRef(null);
-    const [topShadow, setTopShadow] = useState(0);
-    const [bottomShadow, setBottomShadow] = useState(0);
-    const update = useCallback(() => {
-        /* istanbul ignore else */
-        if (divEl.current) {
-            setTopShadow(Math.min(1, divEl.current.scrollTop / 8));
-            const scrollBottom = divEl.current.scrollHeight - divEl.current.scrollTop - divEl.current.clientHeight - 1;
-            setBottomShadow(Math.max(0, Math.min(1, scrollBottom / 8)));
-        }
-    }, []);
-    useEffect(() => update(), [update, props.children]);
-    useResizeObserver(divEl, () => {
-        update();
-    });
-    const shadowOpacityTop = 0.2 * topShadow;
-    const shadowOpacityBottom = 0.2 * bottomShadow;
-    // const [theme] = useTheme()
-    // if (theme === ThemeE.Dark) {
-    //     shadowOpacityTop *= 6
-    //     shadowOpacityBottom *= 6
-    // }
-    /* istanbul ignore next */
-    const borderTop = props.borderTop ? 'thin solid rgba(0, 0, 0, 0.12)' : '';
-    /* istanbul ignore next */
-    const borderBottom = props.borderBottom ? 'thin solid rgba(0, 0, 0, 0.12)' : '';
-    return (_jsxs("div", { style: {
-            ...props.style,
-            display: 'flex',
-            flexDirection: 'column',
-            flexGrow: 1,
-            overflowY: 'hidden',
-            position: 'relative',
-        }, children: [_jsx("div", { ref: divEl, style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    flexGrow: 1,
-                    overflowY: 'auto',
-                    borderTop,
-                    borderBottom,
-                }, onScroll: update, children: props.children }), 
-            /* istanbul ignore next */ shadowOpacityTop > 0 && (_jsx("div", { style: {
-                    position: 'absolute',
-                    top: 0,
-                    height: '10px',
-                    width: '100%',
-                    background: `linear-gradient(rgba(0,0,0,${shadowOpacityTop}), rgba(0,0,0,0))`,
-                } })), 
-            /* istanbul ignore next */ shadowOpacityBottom > 0 && (_jsx("div", { style: {
-                    position: 'absolute',
-                    bottom: 0,
-                    height: '10px',
-                    width: '100%',
-                    background: `linear-gradient(rgba(0,0,0,0), rgba(0,0,0,${shadowOpacityBottom}))`,
-                } }))] }));
-}

package/mjs/components/SingleSelect.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { FormGroup, Select } from '@patternfly/react-core';
-import { useCallback, useState } from 'react';
-import { useOpen } from './useOpen';
-export function SingleSelect(props) {
-    const { onChange } = props;
-    const [open, setOpen, onToggle] = useOpen(props);
-    const onSelect = useCallback((_e, v) => {
-        if (typeof v === 'string') {
-            onChange(v);
-        }
-        else {
-            onChange(v.toString());
-        }
-        setOpen(false);
-    }, [onChange, setOpen]);
-    const id = props.id ?? props.label.toLocaleLowerCase().split(' ').join('-');
-    return (_jsx(FormGroup, { label: props.label, fieldId: id, style: props.style, children: _jsx(Select, { id: id, selections: props.value, isOpen: open, onToggle: onToggle, onSelect: onSelect, children: props.children }) }));
-}
-export function SingleSelect2(props) {
-    const { onChange } = props;
-    const { id } = props;
-    const [open, setOpen] = useState(false);
-    const onToggle = useCallback(() => {
-        setOpen((open) => !open);
-    }, []);
-    const onSelect = useCallback((_e, v) => {
-        if (typeof v === 'string') {
-            onChange(v);
-        }
-        else {
-            onChange(v.toString());
-        }
-        setOpen(false);
-    }, [onChange]);
-    return (_jsx(Select, { id: id, selections: props.value, isOpen: open, onToggle: onToggle, onSelect: onSelect, children: props.children }));
-}

package/mjs/components/patternfly-colors.js

@@ -1,38 +0,0 @@
-export var PatternFlyColor;
-(function (PatternFlyColor) {
-    PatternFlyColor["Green"] = "green";
-    PatternFlyColor["Blue"] = "blue";
-    PatternFlyColor["Red"] = "red";
-    PatternFlyColor["Yellow"] = "yellow";
-    PatternFlyColor["Grey"] = "grey";
-})(PatternFlyColor || (PatternFlyColor = {}));
-export function getPatternflyColor(color) {
-    switch (color) {
-        case 'green':
-            return pfSuccess;
-        case 'red':
-            return pfDanger;
-        case 'yellow':
-            return pfWarning;
-        case 'blue':
-            return pfInfo;
-        case 'grey':
-            return pfDisabled;
-    }
-    return undefined;
-}
-export const pfSuccess = 'var(--pf-global--success-color--100)';
-export const pfDanger = 'var(--pf-global--danger-color--100)';
-export const pfWarning = 'var(--pf-global--warning-color--100)';
-export const pfInfo = 'var(--pf-global--info-color--100)';
-export const pfDisabled = 'var(--pf-global--disabled-color--100)';
-export var LabelColorE;
-(function (LabelColorE) {
-    LabelColorE["blue"] = "blue";
-    LabelColorE["cyan"] = "cyan";
-    LabelColorE["green"] = "green";
-    LabelColorE["orange"] = "orange";
-    LabelColorE["purple"] = "purple";
-    LabelColorE["red"] = "red";
-    LabelColorE["grey"] = "grey";
-})(LabelColorE || (LabelColorE = {}));

package/mjs/components/useBreakPoint.js

@@ -1,118 +0,0 @@
-import xl2Breakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_2xl';
-import lgBreakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_lg';
-import mdBreakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_md';
-import smBreakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_sm';
-import xlBreakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_xl';
-import xsBreakpoint from '@patternfly/react-tokens/dist/esm/global_breakpoint_xs';
-import { useCallback, useEffect, useState } from 'react';
-const breakpoints = {
-    xs: Number(xsBreakpoint.value.replace('px', '')),
-    sm: Number(smBreakpoint.value.replace('px', '')),
-    md: Number(mdBreakpoint.value.replace('px', '')),
-    lg: Number(lgBreakpoint.value.replace('px', '')),
-    xl: Number(xlBreakpoint.value.replace('px', '')),
-    xxl: Number(xl2Breakpoint.value.replace('px', '')),
-};
-export function useWindowSize() {
-    const [windowSize, setWindowSize] = useState(() => {
-        if (window.innerWidth <= breakpoints.sm)
-            return 'xs';
-        else if (window.innerWidth <= breakpoints.md)
-            return 'sm';
-        else if (window.innerWidth <= breakpoints.lg)
-            return 'md';
-        else if (window.innerWidth <= breakpoints.xl)
-            return 'lg';
-        else if (window.innerWidth <= breakpoints.xxl)
-            return 'xl';
-        else
-            return 'xxl';
-    });
-    const handleResize = useCallback(() => {
-        if (window.innerWidth <= breakpoints.sm)
-            setWindowSize('xs');
-        else if (window.innerWidth <= breakpoints.md)
-            setWindowSize('sm');
-        else if (window.innerWidth <= breakpoints.lg)
-            setWindowSize('md');
-        else if (window.innerWidth <= breakpoints.xl)
-            setWindowSize('lg');
-        else if (window.innerWidth <= breakpoints.xxl)
-            setWindowSize('xl');
-        else
-            setWindowSize('xxl');
-    }, []);
-    useEffect(() => {
-        const handler = handleResize;
-        window.addEventListener('resize', handler);
-        return () => window.removeEventListener('resize', handler);
-    }, [handleResize]);
-    useEffect(() => handleResize(), [handleResize]);
-    return windowSize;
-}
-/** Returns true if the window size is equal to or larger than the indicated size. */
-export function useBreakpoint(size) {
-    const windowSize = useWindowSize();
-    switch (size) {
-        case 'xs':
-            return true;
-        case 'sm':
-            switch (windowSize) {
-                case 'sm':
-                case 'md':
-                case 'lg':
-                case 'xl':
-                case 'xxl':
-                    return true;
-                default:
-                    return false;
-            }
-        case 'md':
-            switch (windowSize) {
-                case 'md':
-                case 'lg':
-                case 'xl':
-                case 'xxl':
-                    return true;
-                default:
-                    return false;
-            }
-        case 'lg':
-            switch (windowSize) {
-                case 'lg':
-                case 'xl':
-                case 'xxl':
-                    return true;
-                default:
-                    return false;
-            }
-        case 'xl':
-            switch (windowSize) {
-                case 'xl':
-                case 'xxl':
-                    return true;
-                default:
-                    return false;
-            }
-        case 'xxl':
-            switch (windowSize) {
-                case 'xxl':
-                    return true;
-                default:
-                    return false;
-            }
-    }
-}
-export function useOrientation() {
-    const [orientation, setOrientation] = useState(() => window.innerWidth > window.innerHeight ? 'landscape' : 'portrait');
-    const handleResize = useCallback(() => {
-        setOrientation(window.innerWidth > window.innerHeight ? 'landscape' : 'portrait');
-    }, []);
-    useEffect(() => {
-        const handler = handleResize;
-        window.addEventListener('resize', handler);
-        return () => window.removeEventListener('resize', handler);
-    }, [handleResize]);
-    useEffect(() => handleResize(), [handleResize]);
-    return orientation;
-}

package/mjs/components/useOpen.js

@@ -1,16 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-export function useOpen(props) {
-    const [open, setOpenState] = useState(() => props.open ?? false);
-    useEffect(() => {
-        if (props.open !== undefined) {
-            setOpenState(props.open);
-        }
-    }, [props.open, setOpenState]);
-    const setOpen = useCallback((open) => {
-        props.setOpen ? props.setOpen(open) : setOpenState(open);
-    }, [props]);
-    const onToggle = useCallback(() => {
-        setOpen(!open);
-    }, [open, setOpen]);
-    return [open, setOpen, onToggle];
-}

package/mjs/components/useWindowLocation.js

@@ -1,48 +0,0 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-function useIsMounted() {
-    const [isMounted, setIsMounted] = useState(true);
-    useEffect(() => () => {
-        setIsMounted(false);
-    }, []);
-    return isMounted;
-}
-export function useWindowHistory() {
-    const isMounted = useIsMounted();
-    const [location, setLocation] = useState(isMounted ? window.location : undefined);
-    const setWindowLocation = useCallback(() => {
-        setLocation(window.location);
-    }, []);
-    useEffect(() => {
-        if (!isMounted)
-            return;
-        if (!location) {
-            setWindowLocation();
-        }
-        window.addEventListener('popstate', setWindowLocation);
-        return () => {
-            window.removeEventListener('popstate', setWindowLocation);
-        };
-    }, [isMounted, location, setWindowLocation]);
-    const push = useCallback((url) => {
-        window.history.replaceState(null, '', url);
-        setWindowLocation();
-    }, [setWindowLocation]);
-    const update = useCallback((url) => {
-        window.history.replaceState(null, '', url);
-        setWindowLocation();
-    }, [setWindowLocation]);
-    return { location, push, update };
-}
-export function useSearchParams() {
-    const history = useWindowHistory();
-    const pathname = history.location?.pathname || '/';
-    const searchParams = useMemo(() => new URLSearchParams(history.location?.search ?? '/'), [history.location?.search]);
-    const setSearchParams = useCallback((searchParams) => {
-        const newSearch = searchParams.toString();
-        if (newSearch)
-            history.update('?' + newSearch);
-        else
-            history.update(pathname); // retain the existing pathname
-    }, [history, pathname]);
-    return [searchParams, setSearchParams];
-}

package/mjs/index.js

@@ -1,24 +0,0 @@
-export * from './BulkActionDialog';
-export * from './components/BulkSelector';
-export * from './components/Collapse';
-export * from './components/Details';
-export * from './components/Help';
-export * from './components/patternfly-colors';
-export * from './components/useBreakPoint';
-export * from './PageBody';
-export * from './PageCells';
-export * from './PageDataList';
-export * from './PageDialog';
-export * from './PageForm';
-export * from './PageFramework';
-export * from './PageHeader';
-export * from './PageLayout';
-export * from './PageTable';
-export * from './PageTableCards';
-export * from './PageTabs';
-export * from './PageToolbar';
-export * from './TypedActions';
-export * from './useInMemoryView';
-export * from './useSelectDialog';
-export * from './useTableItems';
-export * from './utils/compare';

package/mjs/useFrameworkTranslations.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState } from 'react';
-const defaultTranslations = {
-    errorText: 'Error',
-    cancelText: 'Cancel',
-    closeText: 'Close',
-    confirmText: 'Confirm',
-    pendingText: 'Pending',
-    submitText: 'Submit',
-    submittingText: 'Submitting',
-    successText: 'Success',
-    processingText: 'Processing',
-    noItemsFound: 'No items found',
-};
-const FrameworkTranslationsContext = createContext([defaultTranslations, () => alert('Use FrameworkTranslationsProvider')]);
-export function FrameworkTranslationsProvider(props) {
-    const state = useState(defaultTranslations);
-    return (_jsx(FrameworkTranslationsContext.Provider, { value: state, children: props.children }));
-}
-export function useFrameworkTranslations() {
-    return useContext(FrameworkTranslationsContext);
-}

package/mjs/useInMemoryView.js

@@ -1,60 +0,0 @@
-import getValue from 'get-value';
-import { useEffect, useMemo } from 'react';
-import { useFiltered, usePaged, useSelectedInMemory, useSorted } from './useTableItems';
-import { useView } from './useView';
-import { compareUnknowns } from './utils/compare';
-export function useInMemoryView(options) {
-    const { items, keyFn, tableColumns, toolbarFilters, disableQueryString } = options;
-    const view = useView({
-        sort: tableColumns && tableColumns.length ? tableColumns[0].sort : undefined,
-    }, disableQueryString);
-    const { page, perPage, sort, sortDirection, filters } = view;
-    const sorted = useSorted(items ?? []);
-    const { setSort } = sorted;
-    useEffect(() => setSort({
-        id: sort,
-        sortFn: (l, r) => {
-            const lv = getValue(l, sort);
-            const rv = getValue(r, sort);
-            return compareUnknowns(lv, rv);
-        },
-        direction: sortDirection,
-    }), [sort, sortDirection, setSort]);
-    const filtered = useFiltered(sorted.sorted, keyFn);
-    const { setFilterFn } = filtered;
-    useEffect(() => {
-        if (Object.keys(filters).length === 0) {
-            setFilterFn(undefined);
-        }
-        else {
-            setFilterFn((item) => {
-                for (const key in filters) {
-                    const toolbarFilter = toolbarFilters?.find((filter) => filter.key === key);
-                    if (toolbarFilter) {
-                        const value = getValue(item, toolbarFilter.query);
-                        if (typeof value === 'string') {
-                            for (const filterValue of filters[key]) {
-                                if (value.toLowerCase().includes(filterValue.toLowerCase()))
-                                    return true;
-                            }
-                        }
-                    }
-                }
-                return false;
-            });
-        }
-    }, [filters, setFilterFn, toolbarFilters]);
-    const paged = usePaged(filtered.filtered);
-    const { setPage, setPerPage } = paged;
-    useEffect(() => setPage(page), [page, paged, setPage]);
-    useEffect(() => setPerPage(perPage), [perPage, paged, setPerPage]);
-    const selection = useSelectedInMemory(items ?? [], keyFn);
-    return useMemo(() => {
-        return {
-            itemCount: items ? filtered.filtered.length : 0,
-            pageItems: items ? paged.paged : undefined,
-            ...view,
-            ...selection,
-        };
-    }, [filtered.filtered.length, items, paged.paged, selection, view]);
-}

package/mjs/useSelectDialog.js

@@ -1,49 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Modal, ModalBoxBody, ModalVariant, Skeleton, Split, SplitItem, } from '@patternfly/react-core';
-import { useCallback, useEffect, useState } from 'react';
-import { Collapse } from './components/Collapse';
-import { usePageDialog } from './PageDialog';
-import { PageTable } from './PageTable';
-export function useSelectDialog(options) {
-    const { view, tableColumns, toolbarFilters, confirm, cancel, selected } = options;
-    const [title, setTitle] = useState('');
-    const [onSelect, setOnSelect] = useState();
-    const openSetting = useCallback((onSelect, title) => {
-        setTitle(title ?? '');
-        setOnSelect(() => onSelect);
-    }, []);
-    const [_, setDialog] = usePageDialog();
-    useEffect(() => {
-        if (onSelect !== undefined) {
-            setDialog(_jsx(SelectDialog, { title: title, open: true, setOpen: () => setOnSelect(undefined), onSelect: onSelect, view: view, tableColumns: tableColumns, toolbarFilters: toolbarFilters, confirm: confirm, cancel: cancel, selected: selected, keyFn: view.keyFn }));
-        }
-        else {
-            setDialog(undefined);
-            view.unselectAll();
-        }
-    }, [cancel, confirm, onSelect, selected, setDialog, tableColumns, title, toolbarFilters, view]);
-    return openSetting;
-}
-export function SelectDialog(props) {
-    const { title, open, setOpen, onSelect, view, tableColumns, toolbarFilters, confirm, cancel, selected, } = props;
-    const onClose = () => setOpen(false);
-    return (_jsxs(Modal, { title: title, isOpen: open, onClose: onClose, variant: ModalVariant.medium, tabIndex: 0, actions: [
-            _jsx(Button, { variant: "primary", onClick: () => {
-                    if (view.selectedItems.length > 0) {
-                        onSelect(view.selectedItems[0]);
-                    }
-                    onClose();
-                }, isAriaDisabled: view.selectedItems.length === 0, children: confirm }, "confirm"),
-            _jsx(Button, { variant: "link", onClick: onClose, children: cancel }, "cancel"),
-        ], hasNoBodyWrapper: true, children: [_jsx(ModalBoxBody, { style: { overflow: 'hidden' }, children: _jsxs(Split, { hasGutter: true, children: [_jsx(SplitItem, { style: { opacity: view.selectedItems.length === 0 ? 0 : undefined }, children: selected }), _jsxs("b", { children: [view.selectedItems.map((item) => {
-                                    if (tableColumns && tableColumns.length > 0) {
-                                        return _jsx("span", { children: tableColumns[0].cell(item) }, props.keyFn(item));
-                                    }
-                                    return _jsx(_Fragment, {});
-                                }), _jsx(_Fragment, {})] })] }) }), _jsx(Collapse, { open: view.itemCount === undefined, children: _jsx(Skeleton, { height: "80px" }) }), _jsx(Collapse, { open: view.itemCount !== undefined, children: _jsx("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'column',
-                        maxHeight: 400,
-                        overflow: 'hidden',
-                    }, children: _jsx(PageTable, { tableColumns: tableColumns, toolbarFilters: toolbarFilters, emptyStateTitle: "No organizations found", errorStateTitle: "Error loading organizations", ...view, onSelect: () => null }) }) })] }));
-}

package/mjs/useSelectMultipleDialog.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Button, Modal, ModalVariant } from '@patternfly/react-core';
-import { useCallback } from 'react';
-import { usePageDialog } from './PageDialog';
-import { PageTable } from './PageTable';
-import { useFrameworkTranslations } from './useFrameworkTranslations';
-export function SelectMultipleDialog(props) {
-    const { title, view, tableColumns, toolbarFilters, confirmText, cancelText, onSelect } = props;
-    const [_, setDialog] = usePageDialog();
-    const onClose = useCallback(() => setDialog(undefined), [setDialog]);
-    const [translations] = useFrameworkTranslations();
-    return (_jsx(Modal, { title: title, isOpen: true, onClose: onClose, variant: ModalVariant.medium, tabIndex: 0, actions: [
-            _jsx(Button, { variant: "primary", onClick: () => {
-                    onClose();
-                    onSelect(view.selectedItems);
-                }, isAriaDisabled: view.selectedItems.length === 0, children: confirmText ?? translations.confirmText }, "confirm"),
-            _jsx(Button, { variant: "link", onClick: onClose, children: cancelText ?? translations.cancelText }, "cancel"),
-        ], hasNoBodyWrapper: true, children: _jsx("div", { style: {
-                display: 'flex',
-                flexDirection: 'column',
-                maxHeight: 500,
-                overflow: 'hidden',
-            }, children: _jsx(PageTable, { tableColumns: tableColumns, toolbarFilters: toolbarFilters, ...view, emptyStateTitle: props.emptyStateTitle ?? translations.noItemsFound, errorStateTitle: props.errorStateTitle ?? translations.errorText, showSelect: true }) }) }));
-}
-export function useSelectMultipleDialog() {
-    const [_, setDialog] = usePageDialog();
-    const openSelectMultipleDialog = useCallback((props) => setDialog(_jsx(SelectMultipleDialog, { ...props })), [setDialog]);
-    return openSelectMultipleDialog;
-}