@strato-admin/core 0.1.1 → 0.3.0

package/dist/ra-core/src/test-ui/BooleanInput.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useInput } from '../form/useInput';
+import { isRequired } from '../form/validation/validate';
+import { FieldTitle } from '../util/FieldTitle';
+export const BooleanInput = (props) => {
+    const { field } = useInput(props);
+    return (_jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: field.value, onChange: event => {
+                    field.onChange(event.target.checked);
+                } }), _jsx("span", { children: _jsx(FieldTitle, { label: props.label, source: props.source, resource: props.resource, isRequired: isRequired(props.validate) }) }), ' '] }));
+};

package/dist/ra-core/src/test-ui/Confirm.d.ts

@@ -0,0 +1,10 @@
+export declare const Confirm: ({ isOpen, content, onClose, onConfirm, title, translateOptions, titleTranslateOptions, contentTranslateOptions, }: {
+    isOpen: boolean;
+    title: string;
+    content: string;
+    onConfirm: () => void;
+    onClose: () => void;
+    translateOptions?: Record<string, any>;
+    titleTranslateOptions?: Record<string, any>;
+    contentTranslateOptions?: Record<string, any>;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/ra-core/src/test-ui/Confirm.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Translate } from '../i18n/Translate';
+export const Confirm = ({ isOpen, content, onClose, onConfirm, title, translateOptions = {}, titleTranslateOptions = translateOptions, contentTranslateOptions = translateOptions, }) => {
+    return isOpen ? (_jsx("div", { style: {
+            position: 'fixed',
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            backgroundColor: 'rgba(0, 0, 0, 0.3)',
+        }, children: _jsxs("div", { style: {
+                backgroundColor: 'rgba(0, 0, 0, 0.8)',
+                color: 'white',
+                padding: '1em',
+            }, children: [_jsx("p", { children: typeof title === 'string' ? (_jsx(Translate, { i18nKey: title, options: {
+                            _: title,
+                            ...titleTranslateOptions,
+                        } })) : (title) }), _jsx("p", { children: typeof content === 'string' ? (_jsx(Translate, { i18nKey: content, options: {
+                            _: content,
+                            ...contentTranslateOptions,
+                        } })) : (content) }), _jsxs("div", { style: { display: 'flex', gap: '1em' }, children: [_jsx("button", { onClick: onConfirm, type: "button", children: _jsx(Translate, { i18nKey: "strato.action.confirm", children: "Confirm" }) }), _jsx("button", { onClick: onClose, type: "button", children: _jsx(Translate, { i18nKey: "strato.action.cancel", children: "Cancel" }) })] })] }) })) : null;
+};

package/dist/ra-core/src/test-ui/CreateButton.d.ts

@@ -0,0 +1,3 @@
+export declare const CreateButton: (props: {
+    resource?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/test-ui/CreateButton.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LinkBase } from '../routing';
+import { useResourceContext } from '../core/useResourceContext';
+export const CreateButton = (props) => {
+    const resource = useResourceContext(props);
+    return (_jsx(LinkBase, { to: `/${resource}/create`, onClick: e => {
+            e.stopPropagation();
+        }, children: "Create" }));
+};

package/dist/ra-core/src/test-ui/DataTable.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { RaRecord } from '../types';
+import { DataTableBaseProps } from '../dataTable/DataTableBase';
+export declare const DataTable: {
+    (props: Omit<DataTableBaseProps, "hasBulkActions" | "empty" | "loading"> & {
+        hasBulkActions?: boolean;
+    }): import("react/jsx-runtime").JSX.Element;
+    Col: (props: {
+        children?: React.ReactNode;
+        render?: (record: RaRecord) => React.ReactNode;
+        field?: React.ElementType;
+        source?: string;
+        label?: React.ReactNode;
+    }) => import("react/jsx-runtime").JSX.Element | undefined;
+};

package/dist/ra-core/src/test-ui/DataTable.js

@@ -0,0 +1,88 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useNavigate } from '../routing';
+import { useResourceContext } from '../core/useResourceContext';
+import { useRecordContext } from '../controller/record/useRecordContext';
+import { RecordContextProvider } from '../controller/record/RecordContext';
+import { useListContext } from '../controller/list/useListContext';
+import { useFieldValue } from '../util/useFieldValue';
+import { useEvent } from '../util/useEvent';
+import { useGetPathForRecordCallback } from '../routing/useGetPathForRecordCallback';
+import { useDataTableSelectedIdsContext } from '../dataTable/DataTableSelectedIdsContext';
+import { useDataTableRenderContext, DataTableRenderContext, } from '../dataTable/DataTableRenderContext';
+import { useDataTableConfigContext } from '../dataTable/DataTableConfigContext';
+import { useDataTableCallbacksContext } from '../dataTable/DataTableCallbacksContext';
+import { DataTableBase } from '../dataTable/DataTableBase';
+const DataTableCol = (props) => {
+    const renderContext = useDataTableRenderContext();
+    switch (renderContext) {
+        case 'header':
+            return _jsx(DataTableHeadCell, { ...props });
+        case 'data':
+            return _jsx(DataTableCell, { ...props });
+    }
+};
+const DataTableHeadCell = (props) => {
+    return (_jsx("th", { children: props.label ?? (_jsxs(_Fragment, { children: [props.source?.substring(0, 1).toUpperCase(), props.source?.substring(1)] })) }));
+};
+const DataTableCell = (props) => {
+    const record = useRecordContext();
+    if (props.render) {
+        return _jsx("td", { children: props.render(record) });
+    }
+    if (props.children) {
+        return _jsx("td", { children: props.children });
+    }
+    if (props.field) {
+        return (_jsx("td", { children: React.createElement(props.field, { source: props.source }) }));
+    }
+    if (props.source) {
+        return (_jsx("td", { children: _jsx(DataTableCellValue, { source: props.source }) }));
+    }
+};
+const DataTableCellValue = (props) => {
+    const value = useFieldValue(props);
+    return _jsx(_Fragment, { children: value?.toString() });
+};
+const DataTableRow = (props) => {
+    const getPathForRecord = useGetPathForRecordCallback();
+    const navigate = useNavigate();
+    const record = useRecordContext(props);
+    if (!record) {
+        throw new Error('DataTableRow can only be used within a RecordContext or be passed a record prop');
+    }
+    const resource = useResourceContext(props);
+    if (!resource) {
+        throw new Error('DataTableRow can only be used within a ResourceContext or be passed a resource prop');
+    }
+    const { hasBulkActions = false } = useDataTableConfigContext();
+    const { handleToggleItem, rowClick } = useDataTableCallbacksContext();
+    const selectedIds = useDataTableSelectedIdsContext();
+    const handleClick = useEvent(async (event) => {
+        event.persist();
+        const temporaryLink = typeof rowClick === 'function'
+            ? rowClick(record.id, resource, record)
+            : rowClick;
+        const link = isPromise(temporaryLink)
+            ? await temporaryLink
+            : temporaryLink;
+        const path = await getPathForRecord({
+            record,
+            resource,
+            link,
+        });
+        if (path === false || path == null) {
+            return;
+        }
+        navigate(path, {
+            state: { _scrollToTop: true },
+        });
+    });
+    return (_jsxs("tr", { onClick: handleClick, children: [hasBulkActions && (_jsx(DataTableCol, { children: _jsx("input", { "aria-label": "Select this row", type: "checkbox", checked: selectedIds?.includes(record.id), onChange: event => handleToggleItem(record.id, event) }) })), props.children] }));
+};
+const isPromise = (value) => value && typeof value.then === 'function';
+export const DataTable = (props) => {
+    const { data } = useListContext();
+    return (_jsx(DataTableBase, { hasBulkActions: false, ...props, empty: null, loading: null, children: _jsxs("table", { border: 1, style: { width: '100%', borderCollapse: 'collapse' }, children: [_jsx(DataTableRenderContext.Provider, { value: "header", children: _jsx("thead", { children: _jsxs("tr", { children: [props.hasBulkActions ? _jsx("td", {}) : null, props.children] }) }) }), _jsx(DataTableRenderContext.Provider, { value: "data", children: _jsx("tbody", { children: data?.map(record => (_jsx(RecordContextProvider, { value: record, children: _jsx(DataTableRow, { children: props.children }) }, record.id))) }) })] }) }));
+};
+DataTable.Col = DataTableCol;

package/dist/ra-core/src/test-ui/DeleteButton.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { UseDeleteControllerParams } from '../controller/button/useDeleteController';
+export declare const DeleteButton: (props: UseDeleteControllerParams & {
+    label: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/test-ui/DeleteButton.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Translate } from '../i18n/Translate';
+import { useDeleteController, } from '../controller/button/useDeleteController';
+import { useRecordContext } from '../controller/record/useRecordContext';
+export const DeleteButton = (props) => {
+    const record = useRecordContext();
+    const controllerProps = useDeleteController({
+        record,
+        mutationMode: 'optimistic',
+        ...props,
+    });
+    return (_jsx("button", { type: "button", onClick: event => {
+            event.stopPropagation();
+            controllerProps.handleDelete();
+        }, children: typeof props.label !== 'string' ? (props.label) : (_jsx(Translate, { i18nKey: typeof props.label === 'string'
+                ? props.label
+                : "strato.action.delete', children: typeof props.label === 'string' ? props.label : 'Delete' })) }));
+};

package/dist/ra-core/src/test-ui/EditButton.d.ts

@@ -0,0 +1,5 @@
+import type { RaRecord } from '../types';
+export declare const EditButton: (props: {
+    record?: RaRecord;
+    resource?: string;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/ra-core/src/test-ui/EditButton.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LinkBase } from '../routing';
+import { useRecordContext } from '../controller/record/useRecordContext';
+import { useResourceContext } from '../core/useResourceContext';
+export const EditButton = (props) => {
+    const record = useRecordContext(props);
+    const resource = useResourceContext(props);
+    if (!record)
+        return null;
+    return (_jsx(LinkBase, { to: `/${resource}/${record.id}`, onClick: e => {
+            e.stopPropagation();
+        }, children: "Edit" }));
+};

package/dist/ra-core/src/test-ui/Layout.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const Layout: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/test-ui/Layout.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LinkBase } from '../routing';
+import { useResourceDefinitions } from '../core/useResourceDefinitions';
+import { useTranslate } from '../i18n/useTranslate';
+import { useRefresh } from '../dataProvider/useRefresh';
+import { Notification } from './Notification';
+export const Layout = ({ children }) => {
+    const resources = useResourceDefinitions();
+    const translate = useTranslate();
+    const refresh = useRefresh();
+    return (_jsxs("div", { style: { padding: '1em', border: '1px solid #ccc' }, children: [_jsx("header", { children: _jsxs("nav", { style: {
+                        display: 'flex',
+                        gap: '1em',
+                        listStyle: 'none',
+                        marginBlockStart: 0,
+                        marginBlockEnd: 0,
+                        paddingInlineStart: 0,
+                        justifyContent: 'space-between',
+                    }, children: [_jsx("ul", { style: {
+                                display: 'flex',
+                                gap: '1em',
+                                listStyle: 'none',
+                                marginBlockStart: 0,
+                                marginBlockEnd: 0,
+                                paddingInlineStart: 0,
+                            }, children: Object.values(resources).map(resource => resource.hasList ? (_jsx("li", { children: _jsx(LinkBase, { to: `/${resource.name}`, children: `${resource.name
+                                        .substring(0, 1)
+                                        .toUpperCase()}${resource.name.substring(1)}` }) }, resource.name)) : null) }), _jsx("div", { style: {
+                                display: 'flex',
+                                gap: '1em',
+                                listStyle: 'none',
+                                marginBlockStart: 0,
+                                marginBlockEnd: 0,
+                                paddingInlineStart: 0,
+                            }, children: _jsx("button", { onClick: () => refresh(), children: translate("strato.action.refresh') }) })] }) }), _jsx("hr", {}), _jsx("main", { children: children }), _jsx(Notification, {})] }));
+};

package/dist/ra-core/src/test-ui/Notification.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Provides a way to show a notification.
+ * @see useNotify
+ *
+ * @example <caption>Basic usage</caption>
+ * <Notification />
+ *
+ * @param props The component props
+ * @param {string} props.type The notification type. Defaults to 'info'.
+ * @param {number} props.autoHideDuration Duration in milliseconds to wait until hiding a given notification. Defaults to 4000.
+ * @param {boolean} props.multiLine Set it to `true` if the notification message should be shown in more than one line.
+ */
+export declare const Notification: () => import("react/jsx-runtime").JSX.Element | null;

package/dist/ra-core/src/test-ui/Notification.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useState, useEffect, useCallback } from 'react';
+import { useTranslate } from '../i18n/useTranslate';
+import { useNotificationContext } from '../notification/useNotificationContext';
+import { CloseNotificationContext } from '../notification/CloseNotificationContext';
+import undoableEventEmitter from '../dataProvider/undoableEventEmitter';
+import { useTakeUndoableMutation } from '../dataProvider/undo/useTakeUndoableMutation';
+/**
+ * Provides a way to show a notification.
+ * @see useNotify
+ *
+ * @example <caption>Basic usage</caption>
+ * <Notification />
+ *
+ * @param props The component props
+ * @param {string} props.type The notification type. Defaults to 'info'.
+ * @param {number} props.autoHideDuration Duration in milliseconds to wait until hiding a given notification. Defaults to 4000.
+ * @param {boolean} props.multiLine Set it to `true` if the notification message should be shown in more than one line.
+ */
+export const Notification = () => {
+    const { notifications, takeNotification } = useNotificationContext();
+    const takeMutation = useTakeUndoableMutation();
+    const [open, setOpen] = useState(false);
+    const [currentNotification, setCurrentNotification] = React.useState(undefined);
+    const translate = useTranslate();
+    useEffect(() => {
+        if (notifications.length && !currentNotification) {
+            // Set a new snack when we don't have an active one
+            const notification = takeNotification();
+            if (notification) {
+                setCurrentNotification(notification);
+                setOpen(true);
+            }
+        }
+        if (currentNotification) {
+            const beforeunload = (e) => {
+                e.preventDefault();
+                const confirmationMessage = '';
+                e.returnValue = confirmationMessage;
+                return confirmationMessage;
+            };
+            if (currentNotification?.notificationOptions?.undoable) {
+                window.addEventListener('beforeunload', beforeunload);
+                return () => {
+                    window.removeEventListener('beforeunload', beforeunload);
+                };
+            }
+        }
+    }, [notifications, currentNotification, open, takeNotification]);
+    const handleRequestClose = useCallback(() => {
+        setOpen(false);
+        setCurrentNotification(undefined);
+    }, [setOpen]);
+    const handleExited = useCallback(() => {
+        if (currentNotification &&
+            currentNotification.notificationOptions?.undoable) {
+            const mutation = takeMutation();
+            if (mutation) {
+                mutation({ isUndo: false });
+            }
+            else {
+                // FIXME kept for BC: remove in v6
+                undoableEventEmitter.emit('end', { isUndo: false });
+            }
+        }
+        setCurrentNotification(undefined);
+    }, [currentNotification, takeMutation]);
+    const handleUndo = useCallback(() => {
+        const mutation = takeMutation();
+        if (mutation) {
+            mutation({ isUndo: true });
+        }
+        else {
+            // FIXME kept for BC: remove in v6
+            undoableEventEmitter.emit('end', { isUndo: true });
+        }
+        setOpen(false);
+    }, [takeMutation]);
+    const { message, notificationOptions } = currentNotification || {};
+    const { messageArgs, undoable } = notificationOptions || {};
+    useEffect(() => {
+        if (!undoable)
+            return;
+        const timer = setTimeout(() => {
+            handleExited();
+        }, notificationOptions?.autoHideDuration || 4000);
+        return () => clearTimeout(timer);
+    }, [undoable, handleExited, notificationOptions]);
+    if (!currentNotification)
+        return null;
+    return (_jsx(CloseNotificationContext.Provider, { value: handleRequestClose, children: _jsxs("div", { className: "ra-notification", style: {
+                color: 'white',
+                position: 'fixed',
+                bottom: 16,
+                right: 16,
+                zIndex: 1400,
+                display: open ? 'flex' : 'none',
+                paddingLeft: '16px',
+                paddingRight: '16px',
+                borderRadius: '4px',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: '16px',
+                backgroundColor: 'rgba(0, 0, 0, 0.8)',
+            }, children: [_jsx("p", { children: message && typeof message === 'string'
+                        ? translate(message, messageArgs)
+                        : message }), _jsxs("div", { style: { display: 'flex', gap: '8px' }, children: [undoable ? (_jsx("button", { onClick: handleUndo, type: "button", children: translate("strato.action.undo') })) : null, _jsx("button", { onClick: handleExited, type: "button", children: translate("strato.action.close') })] })] }) }));
+};

package/dist/ra-core/src/test-ui/Pagination.d.ts

@@ -0,0 +1 @@
+export declare const Pagination: () => import("react/jsx-runtime").JSX.Element | null;

package/dist/ra-core/src/test-ui/Pagination.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Translate } from '../i18n/Translate';
+import { useTranslate } from '../i18n/useTranslate';
+import { useListContext } from '../controller/list/useListContext';
+export const Pagination = () => {
+    const { page, perPage, total, setPage } = useListContext();
+    const translate = useTranslate();
+    if (total === undefined) {
+        return null;
+    }
+    const nbPages = Math.ceil(total / perPage) || 1;
+    return (_jsxs("div", { style: { display: 'flex', justifyContent: 'space-between' }, children: [_jsx("div", { children: _jsx(Translate, { i18nKey: "strato.navigation.page_range_info", options: {
+                        offsetBegin: (page - 1) * perPage + 1,
+                        offsetEnd: Math.min(page * perPage, total),
+                        total,
+                    }, children: `${(page - 1) * perPage + 1}-${Math.min(page * perPage, total)} of ${total}` }) }), _jsxs("div", { style: {
+                    display: 'flex',
+                    gap: '0',
+                    alignItems: 'center',
+                    justifyContent: 'end',
+                }, children: [page > 1 && (_jsx("button", { onClick: () => setPage(page - 1), type: "button", children: _jsx(Translate, { i18nKey: "strato.navigation.previous", children: "Previous" }) })), Array.from({ length: nbPages }, (_, i) => i + 1).map(p => (_jsx("button", { onClick: () => {
+                            setPage(p);
+                        }, style: {
+                            fontWeight: p === page ? 'bold' : 'normal',
+                        }, "aria-label": translate("strato.navigation.page', {
+                            page: p,
+                        }), type: "button", children: p }, p))), page < nbPages && (_jsx("button", { onClick: () => setPage(page + 1), type: "button", children: _jsx(Translate, { i18nKey: "strato.navigation.next", children: "Next" }) }))] })] }));
+};

package/dist/ra-core/src/test-ui/PrevNextButtons.d.ts

@@ -0,0 +1,5 @@
+import type { RaRecord } from '../types';
+import { type UsePrevNextControllerProps } from '../controller/usePrevNextController';
+export declare const PrevNextButtons: <RecordType extends RaRecord = any>(props: PrevNextButtonProps<RecordType>) => import("react/jsx-runtime").JSX.Element | null;
+export interface PrevNextButtonProps<RecordType extends RaRecord = any> extends UsePrevNextControllerProps<RecordType> {
+}

package/dist/ra-core/src/test-ui/PrevNextButtons.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LinkBase } from '../routing';
+import { useTranslate } from '../i18n/useTranslate';
+import { usePrevNextController, } from '../controller/usePrevNextController';
+export const PrevNextButtons = (props) => {
+    const { hasPrev, hasNext, prevPath, nextPath, index, total, error, isPending, } = usePrevNextController(props);
+    const translate = useTranslate();
+    if (isPending) {
+        return _jsx("p", { children: "Loading..." });
+    }
+    if (error) {
+        return _jsx("p", { children: error.message });
+    }
+    if (!hasPrev && !hasNext) {
+        return null;
+    }
+    return (_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 8 }, children: [hasPrev && prevPath ? (_jsx(LinkBase, { to: prevPath, children: translate("strato.navigation.previous') })) : (_jsx("span", { style: { opacity: 0.5 }, children: translate("strato.navigation.previous') })), typeof index === 'number' && (_jsxs("span", { children: [index + 1, " / ", total] })), hasNext && nextPath ? (_jsx(LinkBase, { to: nextPath, children: translate("strato.navigation.next') })) : (_jsx("span", { style: { opacity: 0.5 }, children: translate("strato.navigation.next') }))] }));
+};

package/dist/ra-core/src/test-ui/ShowButton.d.ts

@@ -0,0 +1,5 @@
+import type { RaRecord } from '../types';
+export declare const ShowButton: (props: {
+    record?: RaRecord;
+    resource?: string;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/ra-core/src/test-ui/ShowButton.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LinkBase } from '../routing';
+import { useRecordContext } from '../controller/record/useRecordContext';
+import { useResourceContext } from '../core/useResourceContext';
+export const ShowButton = (props) => {
+    const record = useRecordContext(props);
+    const resource = useResourceContext(props);
+    if (!record)
+        return null;
+    return (_jsx(LinkBase, { to: `/${resource}/${record.id}/show`, onClick: e => {
+            e.stopPropagation();
+        }, children: "Show" }));
+};

package/dist/ra-core/src/test-ui/SimpleForm.d.ts

@@ -0,0 +1,2 @@
+import { FormProps } from '../form/Form';
+export declare const SimpleForm: ({ children, ...props }: FormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/test-ui/SimpleForm.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useFormContext } from 'react-hook-form';
+import { Translate } from '../i18n/Translate';
+import { Form } from '../form/Form';
+export const SimpleForm = ({ children, ...props }) => (_jsxs(Form, { ...props, children: [_jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: '1em' }, children: React.Children.map(children, child => (_jsx("div", { children: child }))) }), _jsx("div", { children: _jsx(SaveButton, {}) })] }));
+const SaveButton = () => {
+    const { formState } = useFormContext();
+    const { isSubmitting } = formState;
+    return (_jsx("button", { type: "submit", disabled: isSubmitting, children: _jsx(Translate, { i18nKey: "strato.action.save", children: "Save" }) }));
+};

package/dist/ra-core/src/test-ui/SimpleFormIterator.d.ts

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { type ReactNode } from 'react';
+import { type UseFieldArrayReturn } from 'react-hook-form';
+import type { RaRecord } from '../types';
+import { type ArrayInputContextValue } from '../controller/input/ArrayInputContext';
+export type DisableRemoveFunction = (record: RaRecord) => boolean;
+export declare const SimpleFormIteratorItem: React.ForwardRefExoticComponent<Partial<ArrayInputContextValue> & {
+    children?: ReactNode;
+    disabled?: boolean;
+    disableRemove?: boolean | DisableRemoveFunction;
+    disableReordering?: boolean;
+    getItemLabel?: boolean | GetItemLabelFunc;
+    index: number;
+    inline?: boolean;
+    record: RaRecord;
+    removeButton?: ReactNode;
+    reOrderButtons?: ReactNode;
+    resource?: string;
+    source?: string;
+} & React.RefAttributes<any>>;
+export declare const SimpleFormIterator: (props: SimpleFormIteratorProps) => import("react/jsx-runtime").JSX.Element | null;
+type GetItemLabelFunc = (index: number) => ReactNode;
+export interface SimpleFormIteratorProps extends Partial<UseFieldArrayReturn> {
+    addButton?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    readOnly?: boolean;
+    disabled?: boolean;
+    disableAdd?: boolean;
+    disableClear?: boolean;
+    disableRemove?: boolean | DisableRemoveFunction;
+    disableReordering?: boolean;
+    fullWidth?: boolean;
+    getItemLabel?: boolean | GetItemLabelFunc;
+    inline?: boolean;
+    meta?: {
+        error?: any;
+        submitFailed?: boolean;
+    };
+    record?: RaRecord;
+    removeButton?: ReactNode;
+    reOrderButtons?: ReactNode;
+    resource?: string;
+    source?: string;
+}
+export {};

package/dist/ra-core/src/test-ui/SimpleFormIterator.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useCallback, useState } from 'react';
+import { useTranslate } from '../i18n/useTranslate';
+import { Translate } from '../i18n/Translate';
+import { useFieldValue } from '../util/useFieldValue';
+import { useWrappedSource } from '../core/useWrappedSource';
+import { useArrayInput } from '../controller/input/useArrayInput';
+import { useSimpleFormIterator } from '../controller/input/useSimpleFormIterator';
+import { useSimpleFormIteratorItem } from '../controller/input/useSimpleFormIteratorItem';
+import { SimpleFormIteratorBase } from '../controller/input/SimpleFormIteratorBase';
+import { SimpleFormIteratorItemBase } from '../controller/input/SimpleFormIteratorItemBase';
+import { Confirm } from './Confirm';
+import { useGetArrayInputNewItemDefaults } from '../controller';
+import { useEvent } from '../util';
+const DefaultAddItemButton = (props) => {
+    const { add, source } = useSimpleFormIterator();
+    const { className, ...rest } = props;
+    return (_jsx("button", { type: "button", onClick: () => add(), className: [`button-add button-add-${source}`, className].join(' '), ...rest, children: _jsx(Translate, { i18nKey: "strato.action.add", children: "Add" }) }));
+};
+const DefaultRemoveItemButton = (props) => {
+    const { remove, index } = useSimpleFormIteratorItem();
+    const { source } = useSimpleFormIterator();
+    const { className, ...rest } = props;
+    return (_jsx("button", { type: "button", onClick: () => remove(), className: [
+            `button-remove button-remove-${source}-${index}`,
+            className,
+        ].join(' '), ...rest, children: _jsx(Translate, { i18nKey: "strato.action.remove", children: "Remove" }) }));
+};
+const DefaultReOrderButtons = ({ className }) => {
+    const { index, total, reOrder } = useSimpleFormIteratorItem();
+    const { source } = useSimpleFormIterator();
+    return (_jsxs("span", { className: [
+            `button-reorder button-reorder-${source}-${index}`,
+            className,
+        ].join(' '), children: [_jsx("button", { type: "button", onClick: () => reOrder(index - 1), disabled: index <= 0, children: _jsx(Translate, { i18nKey: "strato.action.move_up", children: "Move Up" }) }), _jsx("button", { type: "button", onClick: () => reOrder(index + 1), disabled: total == null || index >= total - 1, children: _jsx(Translate, { i18nKey: "strato.action.move_down", children: "Move Down" }) })] }));
+};
+export const SimpleFormIteratorItem = React.forwardRef(function SimpleFormIteratorItem(props, ref) {
+    const { children, disabled, disableReordering, disableRemove, getItemLabel, index, inline, record, removeButton = _jsx(DefaultRemoveItemButton, {}), reOrderButtons = _jsx(DefaultReOrderButtons, {}), } = props;
+    // Returns a boolean to indicate whether to disable the remove button for certain fields.
+    // If disableRemove is a function, then call the function with the current record to
+    // determining if the button should be disabled. Otherwise, use a boolean property that
+    // enables or disables the button for all of the fields.
+    const disableRemoveField = (record) => {
+        if (typeof disableRemove === 'boolean') {
+            return disableRemove;
+        }
+        return disableRemove && disableRemove(record);
+    };
+    const label = typeof getItemLabel === 'function' ? getItemLabel(index) : getItemLabel;
+    return (_jsx(SimpleFormIteratorItemBase, { ...props, children: _jsxs("li", { ref: ref, children: [_jsxs("div", { style: {
+                        display: 'flex',
+                        gap: '1rem',
+                        alignItems: 'center',
+                    }, children: [label != null && label !== false && _jsx("span", { children: label }), _jsx("div", { style: {
+                                display: 'flex',
+                                flexDirection: inline ? 'row' : 'column',
+                                gap: '1rem',
+                            }, children: children }), !disabled && (_jsxs("span", { children: [!disableReordering && reOrderButtons, !disableRemoveField(record) && removeButton] }))] }), _jsx("hr", {})] }) }));
+});
+export const SimpleFormIterator = (props) => {
+    const { addButton = _jsx(DefaultAddItemButton, {}), removeButton, reOrderButtons, children, className, resource, disabled, disableAdd = false, disableClear, disableRemove = false, disableReordering, inline, getItemLabel = false, fullWidth, } = props;
+    const finalSource = useWrappedSource('');
+    if (!finalSource) {
+        throw new Error('SimpleFormIterator can only be called within an iterator input like ArrayInput');
+    }
+    const [confirmIsOpen, setConfirmIsOpen] = useState(false);
+    const { fields, remove } = useArrayInput(props);
+    const translate = useTranslate();
+    const handleArrayClear = useCallback(() => {
+        remove();
+        setConfirmIsOpen(false);
+    }, [remove]);
+    const records = useFieldValue({ source: finalSource });
+    const getArrayInputNewItemDefaults = useGetArrayInputNewItemDefaults(fields);
+    const getItemDefaults = useEvent((item = undefined) => {
+        if (item != null)
+            return item;
+        return getArrayInputNewItemDefaults(children);
+    });
+    return fields ? (_jsx(SimpleFormIteratorBase, { getItemDefaults: getItemDefaults, ...props, children: _jsxs("div", { className: [
+                className,
+                fullWidth ? 'fullwidth' : '',
+                disabled ? 'disabled' : '',
+            ].join(' '), children: [_jsx("ul", { style: {
+                        listStyle: 'none',
+                        margin: 0,
+                        padding: 0,
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: '1rem',
+                        marginBottom: '1rem',
+                    }, children: fields.map((member, index) => (_jsx(React.Fragment, { children: _jsx(SimpleFormIteratorItem, { disabled: disabled, disableRemove: disableRemove, disableReordering: disableReordering, fields: fields, getItemLabel: getItemLabel, index: index, record: (records && records[index]) || {}, removeButton: removeButton, reOrderButtons: reOrderButtons, resource: resource, inline: inline, children: children }) }, member.id))) }), !disabled &&
+                    !(disableAdd && (disableClear || disableRemove)) && (_jsxs("div", { style: {
+                        display: 'flex',
+                        gap: '1rem',
+                        marginBottom: '1rem',
+                    }, children: [!disableAdd && _jsx("div", { children: addButton }), fields.length > 0 &&
+                            !disableClear &&
+                            !disableRemove && (_jsxs("div", { children: [_jsx(Confirm, { isOpen: confirmIsOpen, title: translate("strato.action.clear_array_input'), content: translate("strato.message.clear_array_input'), onConfirm: handleArrayClear, onClose: () => setConfirmIsOpen(false) }), _jsx("button", { type: "button", onClick: () => setConfirmIsOpen(true), children: _jsx(Translate, { i18nKey: "strato.action.clear_array_input", children: "Clear" }) })] }))] }))] }) })) : null;
+};