@ansible/ansible-ui-framework 0.0.259 → 0.0.260

package/mjs/PageColumnModal.js

@@ -1,64 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, DataList, DataListCell, DataListCheck, DataListControl, DataListDragButton, DataListItem, DataListItemCells, DataListItemRow, Modal, ModalVariant, } from '@patternfly/react-core';
-import { useCallback, useEffect, useState } from 'react';
-export function useColumnModal(columns, t) {
-    t = t ? t : (t) => t;
-    const [columnModalOpen, setColumnModalOpen] = useState(false);
-    const openColumnModal = useCallback(() => {
-        setColumnModalOpen(true);
-    }, []);
-    const [managedColumns, setManagedColumns] = useState(() => columns);
-    useEffect(() => {
-        setManagedColumns((managedColumns) => managedColumns.map((managedColumn) => columns.find((column) => column.header === managedColumn.header) ?? managedColumn));
-    }, [columns]);
-    const onClose = useCallback(() => {
-        setColumnModalOpen(false);
-    }, []);
-    // const selectAllColumns = useCallback(() => {
-    //     setManagedColumns((managedColumns) => {
-    //         for (const column of managedColumns) {
-    //             column.enabled = true
-    //         }
-    //         return [...managedColumns]
-    //     })
-    // }, [])
-    const onDragFinish = useCallback((itemOrder) => {
-        setManagedColumns((managedColumns) => {
-            return itemOrder.map((header) => managedColumns.find((column) => column.header === header));
-        });
-    }, []);
-    const handleChange = useCallback((checked, event) => {
-        const columnHeader = event.target.name;
-        if (columnHeader) {
-            setManagedColumns((managedColumns) => {
-                for (const column of managedColumns) {
-                    if (column.header !== columnHeader)
-                        continue;
-                    column.enabled = checked;
-                }
-                return [...managedColumns];
-            });
-        }
-    }, []);
-    const columnModal = (_jsx(Modal, { variant: ModalVariant.medium, title: "Manage columns", 
-        // description={
-        //     <TextContent>
-        //         <Text component={TextVariants.p}>Selected categories will be displayed in the table.</Text>
-        //         <Button isInline onClick={selectAllColumns} variant="link">
-        //             Select all
-        //         </Button>
-        //     </TextContent>
-        // }
-        isOpen: columnModalOpen, onClose: onClose, actions: [
-            _jsx(Button, { variant: "primary", onClick: onClose, children: t('Close') }, "save"),
-            // <Button key="cancel" variant="link" onClick={onClose}>
-            //     Cancel
-            // </Button>,
-        ], children: _jsx(DataList, { "aria-label": "Table column management", id: "table-column-management", isCompact: true, onDragFinish: onDragFinish, itemOrder: managedColumns.map((column) => column.header), gridBreakpoint: "none", style: { borderTopWidth: 'thin' }, children: managedColumns.map((column) => {
-                // if (index === 0) return <Fragment />
-                return (_jsx(DataListItem, { id: column.header, "aria-labelledby": "table-column-management-item1", style: { borderBottomWidth: 'thin' }, children: _jsxs(DataListItemRow, { children: [_jsxs(DataListControl, { children: [_jsx(DataListDragButton, { "aria-label": "Reorder", "aria-labelledby": "table-column-management-item1", "aria-describedby": "Press space or enter to begin dragging, and use the arrow keys to navigate up or down. Press enter to confirm the drag, or any other key to cancel the drag operation.", "aria-pressed": "false" }), _jsx(DataListCheck, { "aria-labelledby": "table-column-management-item1", checked: column.enabled !== false, name: column.header, id: column.header, onChange: handleChange, otherControls: true })] }), _jsx(DataListItemCells, { dataListCells: [
-                                    _jsx(DataListCell, { id: "table-column-management-item1", children: _jsx("label", { htmlFor: column.header, children: column.header }) }, column.header),
-                                ] })] }) }, column.header));
-            }) }) }));
-    return { openColumnModal, columnModal, managedColumns };
-}

package/mjs/PageDataList.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, DataList, DataListAction, DataListCell, DataListCheck, DataListItem, DataListItemCells, DataListItemRow, DropdownPosition, EmptyState, EmptyStateBody, EmptyStateIcon, EmptyStateVariant, Title, } from '@patternfly/react-core';
-import { ExclamationCircleIcon, PlusCircleIcon } from '@patternfly/react-icons';
-import { Fragment } from 'react';
-import { Scrollable } from './components/Scrollable';
-import { PageBody } from './PageBody';
-import { PageHeader } from './PageHeader';
-import { PageLayout } from './PageLayout';
-import { PagePagination } from './PagePagination';
-import { useSettings } from './Settings';
-import { TypedActions, TypedActionType } from './TypedActions';
-export function DataListPage(props) {
-    return (_jsx(_Fragment, { children: _jsxs(PageLayout, { children: [_jsx(PageHeader, { ...props }), _jsx(PageBody, { children: _jsx(PageDataList, { ...props }) })] }) }));
-}
-export function PageDataList(props) {
-    const { pageItems, selectItem, unselectItem, isSelected, keyFn, toolbarActions, itemCount, perPage, 
-    // clearAllFilters,
-    filters, error, dataCells, } = props;
-    const showSelect = toolbarActions?.find((toolbarAction) => TypedActionType.bulk === toolbarAction.type) !==
-        undefined;
-    const settings = useSettings();
-    if (error) {
-        return (_jsx("div", { style: {
-                backgroundColor: settings.theme === 'dark' ? 'var(--pf-global--BackgroundColor--300)' : undefined,
-                height: '100%',
-            }, children: _jsxs(EmptyState, { variant: EmptyStateVariant.small, style: {
-                    paddingTop: 64,
-                }, children: [_jsx(EmptyStateIcon, { icon: ExclamationCircleIcon, color: "var(--pf-global--danger-color--100)" }), _jsx(Title, { headingLevel: "h2", size: "lg", children: props.errorStateTitle }), _jsx(EmptyStateBody, { children: error.message })] }) }));
-    }
-    if (itemCount === 0 && Object.keys(filters ?? {}).length === 0) {
-        return (_jsxs(EmptyState, { variant: EmptyStateVariant.large, style: { paddingTop: 64 }, children: [_jsx(EmptyStateIcon, { icon: PlusCircleIcon }), _jsx(Title, { headingLevel: "h4", size: "lg", children: props.emptyStateTitle }), props.emptyStateDescription && (_jsx(EmptyStateBody, { children: props.emptyStateDescription })), props.emptyStateButtonClick && (_jsx(Button, { variant: "primary", onClick: props.emptyStateButtonClick, children: props.emptyStateButtonText }))] }));
-    }
-    return (_jsxs(Fragment, { children: [_jsx(Scrollable, { children: _jsx(DataList, { "aria-label": "Simple data list example", children: pageItems?.map((item) => (_jsx(DataListItem, { "aria-labelledby": "simple-item1", children: _jsxs(DataListItemRow, { children: [showSelect && (_jsx(DataListCheck, { "aria-labelledby": "check-action-item1", name: "check-action-check1", isChecked: isSelected?.(item), onClick: () => {
-                                        if (isSelected?.(item)) {
-                                            selectItem?.(item);
-                                        }
-                                        else {
-                                            unselectItem?.(item);
-                                        }
-                                    } })), _jsx(DataListItemCells, { dataListCells: dataCells.map((dataCell, index) => (_jsx(DataListCell, { width: index === 0 ? 5 : 1, children: _jsx("span", { id: "simple-item1", children: dataCell(item) }) }, "primary content"))) }), props.actions && _jsx(DataListActions, { actions: props.actions })] }) }, keyFn(item)))) }) }), (!props.autoHidePagination || (itemCount ?? 0) > perPage) && _jsx(PagePagination, { ...props })] }));
-}
-function DataListActions(props) {
-    return (_jsx(DataListAction, { "aria-labelledby": "check-action-item1 check-action-action1", id: "check-action-action1", "aria-label": "Actions", isPlainButtonAction: true, style: { whiteSpace: 'nowrap' }, children: _jsx(TypedActions, { actions: props.actions, position: DropdownPosition.right }) }));
-}

package/mjs/PageDialog.js

@@ -1,12 +0,0 @@
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, useContext, useState } from 'react';
-export const DialogContext = createContext(undefined);
-export const SetDialogContext = createContext(() => null);
-const PageDialogContext = createContext([undefined, () => alert('Use PageDialogProvider')]);
-export function PageDialogProvider(props) {
-    const state = useState();
-    return (_jsxs(PageDialogContext.Provider, { value: state, children: [state[0] !== undefined && state[0], props.children] }));
-}
-export function usePageDialog() {
-    return useContext(PageDialogContext);
-}

package/mjs/PageForm.js

@@ -1,316 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ajvResolver } from '@hookform/resolvers/ajv';
-import { ActionGroup, Alert, Button, Checkbox, Flex, FlexItem, Form, FormGroup, FormSection, Grid, InputGroup, Menu, MenuItem, PageSection, Select, SelectGroup, SelectOption, SelectVariant, Slider, Switch, TextArea, TextInput, TextInputGroup, TextInputGroupMain, TextInputGroupUtilities, Tooltip, } from '@patternfly/react-core';
-import { CaretDownIcon, EyeIcon, EyeSlashIcon, SearchIcon } from '@patternfly/react-icons';
-import deepEqual from 'fast-deep-equal';
-import { Children, Fragment, isValidElement, useCallback, useContext, useState, } from 'react';
-import { FormProvider, useController, useForm, useFormContext, useFormState, } from 'react-hook-form';
-import { Collapse, PageHeader, useBreakpoint } from '.';
-import { Scrollable } from './components/Scrollable';
-import { SettingsContext } from './Settings';
-export function FormPage(props) {
-    // const methods = useForm<PartialDeep<T>>({
-    //     defaultValues: props.defaultValues,
-    //     resolver: ajvResolver(props.schema, { strict: false }),
-    // })
-    const children = Children.toArray(props.children);
-    const inputs = children.filter((child) => {
-        if (!isValidElement(child))
-            return false;
-        if (child.type === FormPageAlerts)
-            return false;
-        if (child.type === FormPageButtons)
-            return false;
-        return true;
-    });
-    const buttons = children.find((child) => {
-        if (!isValidElement(child))
-            return false;
-        if (child.type === FormPageButtons)
-            return true;
-        return false;
-    });
-    const [settings] = useContext(SettingsContext);
-    return (_jsxs(_Fragment, { children: [!props.hideHeader && _jsx(PageHeader, { ...props }), _jsxs(Form
-            // eslint-disable-next-line @typescript-eslint/no-misused-promises
-            , { 
-                // eslint-disable-next-line @typescript-eslint/no-misused-promises
-                onSubmit: props.form.handleSubmit(props.onSubmit), isHorizontal: props.isVertical ? false : settings.formLayout === 'horizontal', style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    flexGrow: 1,
-                    overflow: 'hidden',
-                }, children: [_jsx(Scrollable, { style: { height: '100%', flexGrow: 1 }, children: _jsx(PageSection, { padding: { default: props.noPadding ? 'noPadding' : 'padding' }, isWidthLimited: true, children: _jsx(FormSection, { children: inputs }) }) }), buttons] })] }));
-}
-export function FormPageAlerts() {
-    const { errors } = useFormState();
-    const isMd = useBreakpoint('md');
-    return (_jsx(Fragment, { children: errors && Object.keys(errors).length > 0 && (_jsx(Alert, { title: "Please fix validation errors.", isInline: true, style: { width: '100%', paddingLeft: isMd ? 190 : undefined }, variant: "danger" })) }));
-}
-export function FormPageButtons(props) {
-    const { errors } = useFormState();
-    return (_jsxs("div", { children: [_jsx(FormPageAlerts, {}), _jsx(PageSection, { isFilled: true, style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    maxHeight: '100%',
-                    borderTop: 'thin solid var(--pf-global--BorderColor--100)',
-                }, variant: "light", children: _jsxs(ActionGroup, { style: { marginTop: 0 }, children: [errors && Object.keys(errors).length > 0 ? (_jsx(Tooltip, { content: 'Please fix validation errors', children: _jsx(Button, { type: "submit", isAriaDisabled: true, children: props.submitText }) })) : (_jsx(Button, { type: "submit", children: props.submitText })), _jsx(Button, { type: "button", variant: "link", onClick: props.onCancel, children: props.cancelText })] }) })] }));
-}
-export function FormInputCheckbox(props) {
-    const { control } = useFormContext();
-    const { field } = useController({ control, name: props.name });
-    const id = props.name;
-    return (_jsx(Checkbox, { label: props.label, id: id, "aria-describedby": `${id}-helper`, description: props.description, body: field.value ? props.body : undefined, ...field, isChecked: !!field.value }));
-}
-export function FormTextInput(props) {
-    const { register, formState: { isSubmitting }, } = useFormContext();
-    const registration = register(props.name);
-    const { fieldState } = useController({ name: props.name });
-    const error = fieldState.error;
-    const id = props.id ?? props.name;
-    const [showSecret, setShowSecret] = useState(false);
-    return (_jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: error?.message ? 'error' : undefined, helperTextInvalid: error?.message, children: _jsxs(InputGroup, { children: [_jsx(TextInput, { id: id, type: props.secret && !showSecret ? 'password' : 'text', "aria-describedby": `${id}-form-group`, isRequired: props.required, validated: error?.message ? 'error' : undefined, autoFocus: props.autoFocus, placeholder: props.placeholder, ...registration, onChange: (v, e) => {
-                        void registration.onChange(e);
-                    }, 
-                    // innerRef={registration.ref}
-                    isReadOnly: isSubmitting }), props.secret && (_jsx(Button, { variant: "control", onClick: () => setShowSecret(!showSecret), "aria-label": "Options menu", isDisabled: isSubmitting, children: showSecret ? _jsx(EyeIcon, {}) : _jsx(EyeSlashIcon, {}) }))] }) }));
-}
-export function FormTextArea(props) {
-    const { register, formState: { isSubmitting }, } = useFormContext();
-    const registration = register(props.name);
-    const { fieldState } = useController({ name: props.name });
-    const error = fieldState.error;
-    const id = props.id ?? props.name;
-    return (_jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: error?.message ? 'error' : undefined, helperTextInvalid: error?.message, children: _jsx(TextArea, { id: id, type: props.secret ? 'password' : 'text', "aria-describedby": `${id}-form-group`, isRequired: props.required, validated: error?.message ? 'error' : undefined, autoFocus: props.autoFocus, placeholder: props.placeholder, ...registration, onChange: (v, e) => void registration.onChange(e), resizeOrientation: "vertical", isReadOnly: isSubmitting }) }));
-}
-export function FormNumberInput(props) {
-    const { formState: { isSubmitting }, } = useFormContext();
-    const { field, fieldState } = useController({ name: props.name });
-    const error = fieldState.error;
-    const id = props.id ?? props.name;
-    const max = props.max ?? 100;
-    const min = props.min ?? 1;
-    const value = Number(field.value);
-    return (_jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: error?.message ? 'error' : undefined, helperTextInvalid: error?.message, children: _jsxs(Flex, { alignItems: { default: 'alignItemsFlexStart' }, children: [_jsxs(Flex, { alignItems: { default: 'alignItemsFlexStart' }, spaceItems: { default: 'spaceItemsSm' }, children: [_jsx(FlexItem, { style: { paddingTop: 6, minWidth: 20, textAlign: 'right' }, children: Math.floor((max - min) * value + min) }), props.valueLabel && (_jsx(FlexItem, { style: { paddingTop: 6, minWidth: 40 }, children: props.valueLabel }))] }), _jsx(FlexItem, { grow: { default: 'grow' }, children: _jsx(Slider, { id: id, "aria-describedby": `${id}-form-group`, 
-                        // isRequired={props.required}
-                        // validated={error?.message ? 'error' : undefined}
-                        autoFocus: props.autoFocus, 
-                        // {...registration}
-                        value: (max - min) * value + min, onChange: (v) => field.onChange((v - min) / (max - min)), max: max, min: min, 
-                        // innerRef={registration.ref}
-                        isDisabled: isSubmitting, showBoundaries: false }) })] }) }));
-}
-export function FormBooleanInput(props) {
-    const { formState: { isSubmitting }, } = useFormContext();
-    const { field, fieldState } = useController({ name: props.name });
-    const error = fieldState.error;
-    const id = props.id ?? props.name;
-    return (_jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: error?.message ? 'error' : undefined, helperTextInvalid: error?.message, children: _jsx(Switch, { id: id, "aria-describedby": `${id}-form-group`, 
-            // isRequired={props.required}
-            // validated={error?.message ? 'error' : undefined}
-            autoFocus: props.autoFocus, 
-            // placeholder={props.placeholder}
-            // {...registration}
-            isChecked: typeof field.value === 'boolean' ? field.value : false, onChange: (e) => field.onChange(e), 
-            // innerRef={registration.ref}
-            isDisabled: isSubmitting }) }));
-}
-export function FormSelect(props) {
-    const { field, fieldState: { error: fieldError }, } = useController({ name: props.name });
-    const [open, setOpen] = useState(false);
-    const id = props.id ?? props.name;
-    const error = fieldError !== undefined && fieldError.message;
-    const { options } = props;
-    options.sort((l, r) => {
-        if ((l.group ?? '') < (r.group ?? ''))
-            return -1;
-        if ((l.group ?? '') > (r.group ?? ''))
-            return 1;
-        if (l.label < r.label)
-            return -1;
-        if (l.label > r.label)
-            return 1;
-        return 0;
-    });
-    const selectedIndex = options.findIndex((option) => deepEqual(option.value, field.value));
-    const groups = options.reduce((groups, option) => {
-        const group = option.group ?? '';
-        let optionsArray = groups[group];
-        if (!optionsArray) {
-            optionsArray = [];
-            groups[group] = optionsArray;
-        }
-        optionsArray.push(option);
-        return groups;
-    }, {});
-    const isGrouped = Object.keys(groups).length > 1 ||
-        (Object.keys(groups).length === 1 && Object.keys(groups)[0] !== '');
-    const onSelect = useCallback((_event, value) => {
-        if (typeof value !== 'string') {
-            value = value.toString();
-        }
-        const selectedIndex = Number(value);
-        const selected = options[selectedIndex].value;
-        field.onChange(selected);
-        setOpen(false);
-    }, [field, options]);
-    let index = 0;
-    return (_jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperTextInvalid: error, helperText: props.help, isRequired: props.required, validated: error ? 'error' : undefined, children: _jsx(Select, { id: id, variant: SelectVariant.single, "aria-describedby": `${id}-helper`, validated: error ? 'error' : undefined, ...field, isOpen: open, onToggle: () => setOpen(!open), selections: selectedIndex === -1 ? '' : selectedIndex.toString(), onSelect: onSelect, isCreatable: props.create, isInputFilterPersisted: props.create, placeholderText: props.placeholder, isGrouped: isGrouped, footer: props.footer?.label && (_jsx(Button, { variant: "link", isInline: true, onClick: () => {
-                    setOpen(false);
-                    props.footer?.click?.();
-                }, children: props.footer.label })), maxHeight: 280, children: !isGrouped
-                ? options.map((option, index) => (_jsx(SelectOption, { value: index.toString(), label: option.label, description: option.description, children: option.label }, index)))
-                : Object.keys(groups).map((group) => (_jsx(SelectGroup, { label: group, children: groups[group].map((option) => (_jsx(SelectOption, { value: (index++).toString(), label: option.label, description: option.description, children: option.label }, index))) }, group))) }) }));
-}
-export function FormSelectInput(props) {
-    const { control } = useFormContext();
-    const { field, fieldState: { error }, } = useController({ control, name: props.name });
-    const menuItems = Children.toArray(props.children)
-        .filter((child) => isValidElement(child) && child.type === SelectOption)
-        .map((child) => {
-        if (isValidElement(child) && child.type === SelectOption) {
-            return (_jsx(MenuItem, { children: child.props.children }, child.props.value));
-        }
-        return _jsx(_Fragment, {});
-    });
-    const [open, setOpen] = useState(false);
-    const id = props.name;
-    let errorMessage;
-    switch (error?.type) {
-        case 'required':
-            errorMessage = props.label + ' is required.';
-            break;
-        default:
-            errorMessage = error?.type;
-            break;
-    }
-    return (_jsx(FormGroup, { fieldId: id, label: props.label, helperTextInvalid: errorMessage, helperText: props.helperText, isRequired: props.required, validated: errorMessage ? 'error' : undefined, children: _jsxs(TextInputGroup, { children: [_jsx(TextInputGroupMain, { ...field }), _jsx(TextInputGroupUtilities, { children: _jsx(Button, { variant: "plain", onClick: () => setOpen(!open), "aria-label": "Options menu", children: _jsx(CaretDownIcon, {}) }) }), open && (_jsx(Menu, { style: { position: 'absolute', right: 0, top: 36, width: '100%' }, children: menuItems }))] }) }));
-}
-export function FormTextSelect(props) {
-    const { register, setValue, formState: { isSubmitting }, } = useFormContext();
-    const registration = register(props.name);
-    const { fieldState } = useController({ name: props.name });
-    const error = fieldState.error;
-    let id = props.id ?? props.name;
-    id = id.split('.').join('-');
-    return (_jsx(Fragment, { children: _jsx(FormGroup, { id: `${id}-form-group`, fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: error?.message ? 'error' : undefined, helperTextInvalid: error?.message, children: _jsxs(InputGroup, { children: [_jsx(TextInput, { id: id, type: props.secret ? 'password' : 'text', "aria-describedby": `${id}-form-group`, isRequired: props.required, validated: error?.message ? 'error' : undefined, autoFocus: props.autoFocus, placeholder: props.placeholder, ...registration, onChange: (v, e) => {
-                            void registration.onChange(e);
-                        }, 
-                        // innerRef={registration.ref}
-                        isReadOnly: isSubmitting }), _jsx(Button, { variant: "control", onClick: () => props.selectOpen?.((item) => {
-                            if (props.selectValue) {
-                                const value = props.selectValue(item);
-                                setValue(props.name, value, { shouldValidate: true });
-                            }
-                        }, props.selectTitle), "aria-label": "Options menu", isDisabled: isSubmitting, children: _jsx(SearchIcon, {}) })] }) }) }));
-}
-export function FormSchema(props) {
-    const { schema } = props;
-    const base = props.base ? props.base + '.' : '';
-    const p = [];
-    for (const propertyName in schema.properties) {
-        const property = schema.properties[propertyName];
-        switch (property) {
-            case true:
-            case false:
-                continue;
-        }
-        const title = typeof property.title === 'string' ? property.title : propertyName;
-        let placeholder = property.placeholder;
-        placeholder = typeof placeholder === 'string' ? placeholder : undefined;
-        const required = Array.isArray(schema.required) && schema.required.includes(propertyName);
-        switch (property.type) {
-            case 'string': {
-                switch (property.variant) {
-                    case 'select': {
-                        if ('options' in property) {
-                            const formSelectProps = property;
-                            p.push(_jsx(FormSelect, { name: base + propertyName, label: title, placeholder: placeholder, required: required, options: formSelectProps.options, footer: formSelectProps.footer }, base + propertyName));
-                        }
-                        else {
-                            p.push(_jsx(FormTextSelect, { name: base + propertyName, label: title, placeholder: placeholder, required: required, selectTitle: property.selectTitle, selectValue: property.selectValue, selectOpen: property.selectOpen }, base + propertyName));
-                        }
-                        break;
-                    }
-                    case 'textarea':
-                        p.push(_jsx(FormTextArea, { name: base + propertyName, label: title, placeholder: placeholder, required: required }, base + propertyName));
-                        break;
-                    case 'secret':
-                        p.push(_jsx(FormTextInput, { name: base + propertyName, label: title, placeholder: placeholder, required: required, secret: true }, base + propertyName));
-                        break;
-                    default:
-                        p.push(_jsx(FormTextInput, { name: base + propertyName, label: title, placeholder: placeholder, required: required }, base + propertyName));
-                        break;
-                }
-                break;
-            }
-            case 'number': {
-                p.push(_jsx(FormNumberInput, { name: base + propertyName, label: title, required: required, min: property.min, max: property.max, valueLabel: property.valueLabel }, base + propertyName));
-                break;
-            }
-            case 'boolean': {
-                p.push(_jsx(FormBooleanInput, { name: base + propertyName, label: title, required: required }, base + propertyName));
-                break;
-            }
-            case 'object': {
-                p.push(_jsx(FormSchema, { schema: property, base: base + propertyName }, propertyName));
-                break;
-            }
-        }
-    }
-    return _jsx(_Fragment, { children: p });
-}
-export function PageForm(props) {
-    const { schema, defaultValue } = props;
-    const form = useForm({
-        defaultValues: defaultValue ?? {},
-        resolver: schema
-            ? ajvResolver(schema, { strict: false, addFormats: true })
-            : undefined,
-    });
-    const { handleSubmit, setError: setFieldError } = form;
-    const [error, setError] = useState('');
-    const isMd = useBreakpoint('md');
-    const [settings] = useContext(SettingsContext);
-    const isHorizontal = props.isVertical ? false : settings.formLayout === 'horizontal';
-    const multipleColumns = props.singleColumn ? false : settings.formColumns === 'multiple';
-    const sm = multipleColumns ? (isHorizontal ? 12 : 12) : 12;
-    const md = multipleColumns ? (isHorizontal ? 12 : 6) : 12;
-    const lg = multipleColumns ? (isHorizontal ? 6 : 6) : 12;
-    const xl = multipleColumns ? (isHorizontal ? 6 : 6) : 12;
-    const xl2 = multipleColumns ? (isHorizontal ? 4 : 4) : 12;
-    const maxWidth = multipleColumns ? undefined : isHorizontal ? 960 : 800;
-    return (
-    // <PageBody>
-    _jsx(FormProvider, { ...form, children: _jsxs(Form
-        // eslint-disable-next-line @typescript-eslint/no-misused-promises
-        , { 
-            // eslint-disable-next-line @typescript-eslint/no-misused-promises
-            onSubmit: handleSubmit((data) => {
-                setError('');
-                return props.onSubmit(data, setError, setFieldError);
-            }), isHorizontal: isHorizontal, style: {
-                display: 'flex',
-                flexDirection: 'column',
-                flexGrow: 1,
-                overflow: props.disableScrolling ? undefined : 'hidden',
-                gap: 0,
-            }, children: [props.disableScrolling ? (_jsx(PageSection, { isFilled: true, 
-                    // padding={{ default: props.onCancel ? 'padding' : 'noPadding' }}
-                    variant: "light", style: { maxWidth }, children: _jsxs(Grid, { hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2, children: [props.schema && _jsx(FormSchema, { schema: props.schema }), props.children] }) })) : (_jsx(Scrollable, { style: { height: '100%', flexGrow: 1 }, children: _jsx(PageSection, { isFilled: true, 
-                        // padding={{ default: props.onCancel ? 'padding' : 'noPadding' }}
-                        variant: "light", style: { maxWidth }, children: _jsxs(Grid, { hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2, children: [props.schema && _jsx(FormSchema, { schema: props.schema }), props.children] }) }) })), _jsx(Collapse, { open: !!error, children: _jsx(Alert, { variant: "danger", title: error ?? '', isInline: true, style: { paddingLeft: isMd && props.onCancel ? 190 : undefined } }) }), props.onCancel ? (_jsx(PageSection, { isFilled: false, style: {
-                        borderTop: 'thin solid var(--pf-global--BorderColor--100)',
-                        backgroundColor: settings.theme === 'dark' ? 'var(--pf-global--BackgroundColor--400)' : undefined,
-                    }, variant: "light", children: _jsxs(ActionGroup, { style: { marginTop: 0 }, children: [_jsx(PageFormSubmitButton, { children: props.submitText }), props.onCancel && (_jsx(PageFormCancelButton, { onCancel: props.onCancel, children: props.cancelText }))] }) })) : (_jsx(PageFormSubmitButton, { style: { marginTop: 48 }, children: props.submitText }))] }) })
-    // </PageBody>
-    );
-}
-export function PageFormSubmitButton(props) {
-    const { isSubmitting, errors } = useFormState();
-    const hasErrors = errors && Object.keys(errors).length > 0;
-    return (_jsx(Tooltip, { content: "Please fix errors", trigger: hasErrors ? undefined : 'manual', children: _jsx(Button, { type: "submit", isDisabled: isSubmitting, isLoading: isSubmitting, isDanger: hasErrors, variant: hasErrors ? 'secondary' : undefined, style: props.style, children: props.children }) }));
-}
-export function PageFormCancelButton(props) {
-    return (_jsx(Button, { type: "button", variant: "link", onClick: props.onCancel, children: props.children }));
-}

package/mjs/PageFramework.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { PageAlertToasterProvider } from './PageAlertToaster';
-import { PageDialogProvider } from './PageDialog';
-import { SettingsProvider } from './Settings';
-import { FrameworkTranslationsProvider } from './useFrameworkTranslations';
-export function PageFrameworkProvider(props) {
-    return (_jsx(FrameworkTranslationsProvider, { children: _jsx(SettingsProvider, { children: _jsx(PageDialogProvider, { children: _jsx(PageAlertToasterProvider, { children: props.children }) }) }) }));
-}

package/mjs/PageHeader.js

@@ -1,86 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Breadcrumb, BreadcrumbItem, Button, Flex, FlexItem, PageNavigation, PageSection, PageSectionVariants, Popover, Skeleton, Stack, StackItem, Text, Title, Truncate, } from '@patternfly/react-core';
-import { ExternalLinkAltIcon, OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
-import { Fragment } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { useBreakpoint } from './components/useBreakPoint';
-import { useSettings } from './Settings';
-function Breadcrumbs(props) {
-    const history = useNavigate();
-    if (!props.breadcrumbs)
-        return _jsx(Fragment, {});
-    return (_jsx(Breadcrumb, { style: props.style, children: props.breadcrumbs.map((breadcrumb) => {
-            if (!breadcrumb.label)
-                return _jsx(_Fragment, {});
-            return (_jsx(BreadcrumbItem, { id: breadcrumb.id, component: breadcrumb.component, onClick: breadcrumb.to ? () => breadcrumb.to && history(breadcrumb.to) : undefined, style: {
-                    color: breadcrumb.to ? 'var(--pf-c-breadcrumb__link--Color)' : undefined,
-                    cursor: breadcrumb.to ? 'pointer' : undefined,
-                }, isActive: breadcrumb.to === undefined, children: breadcrumb.label }, breadcrumb.id ?? breadcrumb.label));
-        }) }));
-}
-/**
- * PageHeader enables the responsive layout of the header.
- *
- * @param {Breadcrumb[]} breadcrumbs - The breadcrumbs for the page.
- * @param {string} title - The title of the page.
- * @param {string} titleHelpTitle - The title of help popover.
- * @param {ReactNode} titleHelp - The content for the help popover.
- * @param {string} description - The description of the page.
- * @param {ReactNode} controls - Support for extra page controls.
- * @param {ReactNode} headerActions - The actions for the page.
- *
- * @example
- * <Page>
- *   <PageLayout>
- *     <PageHeader
- *       breadcrumbs={[{ label: 'Home', to: '/home' }, { label: 'Page title' }]}
- *       title='Page title'
- *       description='Page description'
- *       headerActions={<PageActions actions={actions} />}
- *     />
- *     <PageBody />...</PageBody>
- *   </PageLayout>
- * <Page>
- */
-export function PageHeader(props) {
-    const { navigation, breadcrumbs, title, description, controls, headerActions: pageActions, } = props;
-    const lg = useBreakpoint('lg');
-    const xl = useBreakpoint('xl');
-    const xxl = useBreakpoint('xxl');
-    const isMdOrLarger = useBreakpoint('md');
-    // const isSmLarger = useBreakpoint('sm')
-    const settings = useSettings();
-    let { t } = props;
-    t = t ? t : (t) => t;
-    return (_jsxs(_Fragment, { children: [navigation && (_jsx(PageSection, { variant: PageSectionVariants.light, style: {
-                    paddingLeft: 0,
-                    paddingTop: 0,
-                    paddingBottom: 0,
-                    borderTop: settings.theme !== 'light' && settings.borders
-                        ? 'thin solid var(--pf-global--BorderColor--100)'
-                        : undefined,
-                    borderBottom: !props.disableBorderBottom && settings.borders
-                        ? 'thin solid var(--pf-global--BorderColor--100)'
-                        : undefined,
-                    backgroundColor: 'var(--pf-global--BackgroundColor--100)',
-                }, children: _jsx(Flex, { direction: { default: 'row' }, flexWrap: { default: 'nowrap' }, style: { maxWidth: '100%' }, children: _jsx(PageNavigation, { style: { paddingTop: 0, flexShrink: 1, flexGrow: 1 }, hasOverflowScroll: true, children: navigation }) }) })), (isMdOrLarger || !navigation) && (_jsx(PageSection, { variant: PageSectionVariants.light, style: {
-                    paddingTop: breadcrumbs ? (xl ? 16 : 12) : xl ? 16 : 12,
-                    paddingBottom: xl ? 20 : 12,
-                    borderTop: !navigation && settings.theme !== 'light' && settings.borders
-                        ? 'thin solid var(--pf-global--BorderColor--100)'
-                        : undefined,
-                    borderBottom: !props.disableBorderBottom && settings.borders
-                        ? 'thin solid var(--pf-global--BorderColor--100)'
-                        : undefined,
-                    backgroundColor: settings.theme === 'dark'
-                        ? xxl
-                            ? 'var(--pf-global--BackgroundColor--300)'
-                            : 'var(--pf-global--BackgroundColor--400)'
-                        : undefined,
-                }, children: _jsxs(Flex, { flexWrap: { default: 'nowrap' }, alignItems: { default: 'alignItemsStretch' }, children: [_jsxs(FlexItem, { grow: { default: 'grow' }, children: [breadcrumbs && (_jsx(Breadcrumbs, { breadcrumbs: breadcrumbs, style: { paddingBottom: lg ? 6 : 4 } })), title ? (props.titleHelp ? (_jsx(Popover, { headerContent: props.titleHelpTitle, bodyContent: _jsxs(Stack, { hasGutter: true, children: [typeof props.titleHelp === 'string' ? (_jsx(StackItem, { children: props.titleHelp })) : (props.titleHelp.map((help, index) => (_jsx(StackItem, { children: help }, index)))), props.titleDocLink && (_jsx(StackItem, { children: _jsx(Button, { icon: _jsx(ExternalLinkAltIcon, {}), variant: "link", onClick: () => window.open(props.titleDocLink, '_blank'), isInline: true, children: t('Documentation') }) }))] }), position: "bottom-start", removeFindDomNode: true, children: _jsxs(Title, { headingLevel: "h1", children: [title, _jsx(Button, { variant: "link", style: {
-                                                    padding: 0,
-                                                    marginTop: 1,
-                                                    marginLeft: 8,
-                                                    verticalAlign: 'top',
-                                                }, children: _jsx(OutlinedQuestionCircleIcon, {}) })] }) })) : (_jsx(Title, { headingLevel: "h1", children: title }))) : (_jsx(Title, { headingLevel: "h1", children: _jsx(Skeleton, { width: "160px" }) })), isMdOrLarger && description && (_jsx(Text, { component: "p", style: { paddingTop: xl ? 4 : 2, opacity: 0.8 }, children: typeof description === 'string' ? (_jsx(Truncate, { content: description })) : (_jsx(Stack, { children: description.map((d) => (_jsx(StackItem, { children: d }, d))) })) }))] }), title && (pageActions || controls) && (_jsxs(Flex, { direction: { default: 'column' }, spaceItems: { default: 'spaceItemsSm', xl: 'spaceItemsMd' }, justifyContent: { default: 'justifyContentCenter' }, children: [controls && _jsx(FlexItem, { grow: { default: 'grow' }, children: controls }), pageActions && _jsx(FlexItem, { children: pageActions })] }))] }) }))] }));
-}

package/mjs/PageLayout.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useTranslation } from 'react-i18next';
-import ErrorBoundary from './components/ErrorBoundary';
-/**
- * PageLayout enables the responsive layout of the page.
- *
- * @example
- * <Page>
- *   <PageLayout>
- *     <PageHeader />
- *     <PageBody />...</PageBody>
- *   </PageLayout>
- * <Page>
- */
-export function PageLayout(props) {
-    const { t } = useTranslation();
-    return (_jsx(ErrorBoundary, { message: t('Error'), children: _jsx("div", { style: {
-                display: 'flex',
-                flexDirection: 'column',
-                height: '100%',
-                maxHeight: '100%',
-            }, children: props.children }) }));
-}

package/mjs/PagePagination.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Pagination, PaginationVariant } from '@patternfly/react-core';
-import { useCallback } from 'react';
-import { useBreakpoint } from './components/useBreakPoint';
-import { useSettings } from './Settings';
-export function PagePagination(props) {
-    const { setPage, setPerPage } = props;
-    const onSetPage = useCallback((_event, page) => setPage(page), [setPage]);
-    const onPerPageSelect = useCallback((_event, perPage) => setPerPage(perPage), [setPerPage]);
-    const compact = !useBreakpoint('sm');
-    const settings = useSettings();
-    return (_jsx(Pagination, { variant: PaginationVariant.bottom, itemCount: props.itemCount, page: props.page, perPage: props.perPage, onSetPage: onSetPage, onPerPageSelect: onPerPageSelect, style: {
-            ...props.style,
-            borderTop: 'thin solid var(--pf-global--BorderColor--100)',
-            boxShadow: 'none',
-            zIndex: 301,
-            // marginTop: -1,
-            paddingTop: compact ? 6 : undefined,
-            paddingBottom: compact ? 6 : undefined,
-            backgroundColor: settings.theme === 'dark' ? 'var(--pf-global--BackgroundColor--300)' : undefined,
-        } }));
-}