@strato-admin/cloudscape 0.1.0 → 0.3.0

package/dist/Admin.d.ts

@@ -1,7 +1,11 @@
-import { type CoreAdminProps, type AdminChildren } from '@strato-admin/core';
+import React from 'react';
+import { type CoreAdminProps, type AdminChildren } from '@strato-admin/ra-core';
+import { type AdminSettings } from '@strato-admin/core';
 export interface AdminProps extends CoreAdminProps {
     children?: AdminChildren;
     title?: string;
+    /** Declarative Admin-level defaults. Pass a <Settings> element. */
+    settings?: React.ReactElement<AdminSettings>;
 }
 /**
  * The root component of a Strato Admin application.
@@ -13,5 +17,5 @@ export interface AdminProps extends CoreAdminProps {
  *   <Resource name="posts" list={PostList} />
  * </Admin>
  */
-export declare const Admin: ({ children, title, layout: Layout, i18nProvider, store, ...props }: AdminProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Admin: ({ children, title, layout: Layout, ready, i18nProvider, store, settings, ...props }: AdminProps) => import("react/jsx-runtime").JSX.Element;
 export default Admin;

package/dist/Admin.js

@@ -1,29 +1,34 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useState, useEffect } from 'react';
-import { CoreAdmin, SchemaRegistryProvider, localStorageStore, useLocaleState, registerDefaultResourceComponents, registerFieldInputMapping, } from '@strato-admin/core';
+import { CoreAdmin, localStorageStore, useLocaleState, } from '@strato-admin/ra-core';
+import { SchemaRegistryProvider, registerDefaultResourceComponents, registerFieldInputMapping, SettingsContext, } from '@strato-admin/core';
 import { icuI18nProvider } from '@strato-admin/i18n';
 import englishMessages from '@strato-admin/language-en';
 import AppLayout from './layout/AppLayout';
+import Ready from './layout/Ready';
 import { List } from './list';
 import { Create } from './create';
 import { Edit } from './edit';
-import { Show } from './detail';
-import { TextField, NumberField, CurrencyField, ReferenceField } from './field';
-import { TextInput, NumberInput, ReferenceInput } from './input';
+import { Detail } from './detail';
+import { FRAMEWORK_DEFAULTS } from './defaults';
+import { TextField, NumberField, CurrencyField, ReferenceField, ArrayField, BooleanField } from './field';
+import { TextInput, NumberInput, ReferenceInput, ArrayInput, BooleanInput } from './input';
 import { I18nProvider, importMessages } from '@cloudscape-design/components/i18n';
-// Register Cloudscape themed components as defaults for ResourceSchema.
+// Register Cloudscape themed routing components as defaults for ResourceSchema.
 // This is done once, here, to avoid circular dependencies at the module level.
 registerDefaultResourceComponents({
     list: List,
     create: Create,
     edit: Edit,
-    show: Show,
+    show: Detail,
 });
 registerFieldInputMapping(new Map([
     [TextField, TextInput],
     [NumberField, NumberInput],
     [CurrencyField, NumberInput],
+    [BooleanField, BooleanInput],
     [ReferenceField, ReferenceInput],
+    [ArrayField, ArrayInput],
 ]));
 const defaultI18nProvider = icuI18nProvider(() => englishMessages);
 const defaultStore = localStorageStore();
@@ -63,7 +68,8 @@ const CloudscapeLayout = (props) => {
  *   <Resource name="posts" list={PostList} />
  * </Admin>
  */
-export const Admin = ({ children, title, layout: Layout = AppLayout, i18nProvider = defaultI18nProvider, store = defaultStore, ...props }) => {
-    return (_jsx(SchemaRegistryProvider, { children: _jsx(CoreAdmin, { ...props, layout: (layoutProps) => _jsx(CloudscapeLayout, { ...layoutProps, layout: Layout }), title: title, i18nProvider: i18nProvider, store: store, children: children }) }));
+export const Admin = ({ children, title, layout: Layout = AppLayout, ready = Ready, i18nProvider = defaultI18nProvider, store = defaultStore, settings, ...props }) => {
+    const mergedSettings = { ...FRAMEWORK_DEFAULTS, ...settings?.props };
+    return (_jsx(SettingsContext.Provider, { value: mergedSettings, children: _jsx(SchemaRegistryProvider, { children: _jsx(CoreAdmin, { ...props, layout: (layoutProps) => _jsx(CloudscapeLayout, { ...layoutProps, layout: Layout }), title: title, ready: ready, i18nProvider: i18nProvider, store: store, children: children }) }) }));
 };
 export default Admin;

package/dist/RecordLink.js

@@ -1,6 +1,7 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import Link from '@cloudscape-design/components/link';
-import { useCreatePath, useResourceContext, useRecordContext } from '@strato-admin/core';
+import { useResourceContext, useRecordContext } from '@strato-admin/ra-core';
+import { useCreatePath } from '@strato-admin/core';
 import { useNavigate } from 'react-router-dom';
 const RecordLinkImpl = ({ link, resource, children }) => {
     const contextResource = useResourceContext();
@@ -16,10 +17,10 @@ const RecordLinkImpl = ({ link, resource, children }) => {
         href = link(record, finalResource);
     }
     else if (link === true) {
-        href = createPath({ resource: finalResource, id: record.id, type: 'edit' });
+        href = createPath({ resource: finalResource, id: record.id, type: 'detail' });
     }
-    else if (link === 'edit' || link === 'show') {
-        href = createPath({ resource: finalResource, id: record.id, type: link });
+    else if (link === 'edit' || link === 'detail' || link === 'show') {
+        href = createPath({ resource: finalResource, id: record.id, type: link === 'show' ? 'detail' : link });
     }
     else if (typeof link === 'string') {
         href = link;

package/dist/Settings.d.ts

@@ -0,0 +1,17 @@
+import type { AdminSettings } from '@strato-admin/core';
+/**
+ * Declarative configuration for Admin-level defaults.
+ * Pass as the `settings` prop on <Admin>.
+ *
+ * @example
+ * <Admin
+ *   settings={<Settings listComponent={MyTable} deleteSuccessMessage="Deleted!" />}
+ *   dataProvider={myDataProvider}
+ * >
+ *   <Resource name="products" />
+ * </Admin>
+ */
+export declare const Settings: {
+    (_: AdminSettings): null;
+    displayName: string;
+};

package/dist/Settings.js

@@ -0,0 +1,14 @@
+/**
+ * Declarative configuration for Admin-level defaults.
+ * Pass as the `settings` prop on <Admin>.
+ *
+ * @example
+ * <Admin
+ *   settings={<Settings listComponent={MyTable} deleteSuccessMessage="Deleted!" />}
+ *   dataProvider={myDataProvider}
+ * >
+ *   <Resource name="products" />
+ * </Admin>
+ */
+export const Settings = (_) => null;
+Settings.displayName = 'Settings';

package/dist/button/BulkDeleteButton.d.ts

@@ -2,6 +2,9 @@ export interface BulkDeleteButtonProps {
     label?: string;
     variant?: 'primary' | 'normal' | 'link';
     mutationMode?: 'undoable' | 'optimistic' | 'pessimistic';
+    successMessage?: string;
+    dialogTitle?: string;
+    dialogDescription?: string;
 }
-export declare const BulkDeleteButton: ({ label, variant, mutationMode, }: BulkDeleteButtonProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const BulkDeleteButton: ({ label, variant, mutationMode, successMessage, dialogTitle, dialogDescription, }: BulkDeleteButtonProps) => import("react/jsx-runtime").JSX.Element | null;
 export default BulkDeleteButton;

package/dist/button/BulkDeleteButton.js

@@ -1,17 +1,49 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useBulkDeleteController, useTranslate, useListContext, useResourceDefinition } from '@strato-admin/core';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useBulkDeleteController, useTranslate, useListContext, useResourceDefinition } from '@strato-admin/ra-core';
+import { useSettingValue } from '@strato-admin/core';
+import Modal from '@cloudscape-design/components/modal';
+import Box from '@cloudscape-design/components/box';
+import SpaceBetween from '@cloudscape-design/components/space-between';
 import { Button } from './Button';
-export const BulkDeleteButton = ({ label, variant = 'normal', mutationMode = 'pessimistic', }) => {
+export const BulkDeleteButton = ({ label, variant = 'normal', mutationMode, successMessage, dialogTitle, dialogDescription, }) => {
     const translate = useTranslate();
     const { selectedIds } = useListContext();
     const { options } = useResourceDefinition();
+    const resolve = useSettingValue();
+    const rawDefault = resolve(undefined, 'bulkDeleteSuccessMessage');
+    const resolvedDefault = typeof rawDefault === 'function' ? rawDefault(selectedIds?.length ?? 0) : rawDefault;
     const { handleDelete, isPending, isLoading } = useBulkDeleteController({
-        mutationMode,
+        mutationMode: resolve(mutationMode, 'mutationMode'),
+        successMessage: successMessage ?? options?.bulkDeleteSuccessMessage ?? resolvedDefault,
     });
+    const [isOpen, setIsOpen] = useState(false);
     if (options?.canDelete === false) {
         return null;
     }
     const isBusy = isPending || isLoading;
-    return (_jsx(Button, { variant: variant, onClick: handleDelete, loading: isBusy, disabled: isBusy || !selectedIds || selectedIds.length === 0, children: label || translate('ra.action.delete', { _: 'Delete' }) }));
+    const handleConfirm = () => {
+        handleDelete();
+        setIsOpen(false);
+    };
+    const handleOpen = () => {
+        setIsOpen(true);
+    };
+    const handleClose = () => {
+        setIsOpen(false);
+    };
+    const defaultTitle = translate('strato.message.bulk_delete_title', {
+        smart_count: selectedIds?.length || 0,
+        _: `{smart_count, plural, one {Delete this item} other {Delete these # items}}`,
+    });
+    const defaultDescription = translate('strato.message.bulk_delete_content', {
+        smart_count: selectedIds?.length || 0,
+        _: `{
+      smart_count, plural,
+        one {Are you sure you want to delete this item?}
+        other {Are you sure you want to delete these # items?}
+      }`,
+    });
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: variant, onClick: handleOpen, loading: isBusy, disabled: isBusy || !selectedIds || selectedIds.length === 0, children: label || translate('strato.action.delete', { _: 'Delete' }) }), _jsx(Modal, { onDismiss: handleClose, visible: isOpen, closeAriaLabel: translate('strato.action.close', { _: 'Close' }), footer: _jsx(Box, { float: "right", children: _jsxs(SpaceBetween, { direction: "horizontal", size: "xs", children: [_jsx(Button, { variant: "link", onClick: handleClose, children: translate('strato.action.cancel', { _: 'Cancel' }) }), _jsx(Button, { variant: "primary", onClick: handleConfirm, loading: isBusy, "data-testid": "confirm-bulk-delete", children: translate('strato.action.confirm', { _: 'Confirm' }) })] }) }), header: dialogTitle || defaultTitle, children: dialogDescription || defaultDescription })] }));
 };
 export default BulkDeleteButton;

package/dist/button/Button.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 import { ButtonProps as CloudscapeButtonProps } from '@cloudscape-design/components/button';
-export interface ButtonProps extends CloudscapeButtonProps {
+export interface ButtonProps extends Pick<CloudscapeButtonProps, 'variant' | 'iconName' | 'iconSvg' | 'iconAlign' | 'iconAlt' | 'href' | 'target' | 'rel' | 'download' | 'onClick' | 'onFollow' | 'loading' | 'loadingText' | 'disabled' | 'disabledReason' | 'ariaLabel' | 'ariaDescribedby' | 'ariaExpanded' | 'ariaControls' | 'formAction' | 'form' | 'nativeButtonAttributes' | 'nativeAnchorAttributes' | 'wrapText' | 'fullWidth' | 'external'> {
     children: React.ReactNode;
 }
 export declare const Button: ({ children, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/button/CancelButton.d.ts

@@ -0,0 +1,6 @@
+import { ButtonProps } from './Button';
+export interface CancelButtonProps extends Omit<ButtonProps, 'children'> {
+    label?: string;
+}
+export declare const CancelButton: ({ label, variant, ...props }: CancelButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default CancelButton;

package/dist/button/CancelButton.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useTranslate } from '@strato-admin/ra-core';
+import { useNavigate } from 'react-router-dom';
+import { Button } from './Button';
+export const CancelButton = ({ label, variant = 'link', ...props }) => {
+    const translate = useTranslate();
+    const navigate = useNavigate();
+    return (_jsx(Button, { variant: variant, formAction: "none", onClick: () => navigate(-1), ...props, children: label || translate('strato.action.cancel', { _: 'Cancel' }) }));
+};
+export default CancelButton;

package/dist/button/CreateButton.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useResourceContext, useTranslate, useCreatePath, useResourceDefinitions } from '@strato-admin/core';
+import { useResourceContext, useTranslate, useResourceDefinitions } from '@strato-admin/ra-core';
+import { useCreatePath } from '@strato-admin/core';
 import { useNavigate } from 'react-router-dom';
 import { Button } from './Button';
 export const CreateButton = ({ label, variant = 'primary', ...props }) => {
@@ -12,13 +13,13 @@ export const CreateButton = ({ label, variant = 'primary', ...props }) => {
     if (!definition || !definition.hasCreate) {
         return null;
     }
-    const handleClick = () => {
-        const path = createPath({
-            resource,
-            type: 'create',
-        });
-        navigate(path);
+    const path = createPath({ resource, type: 'create' });
+    const handleClick = (e) => {
+        if (!e.detail.metaKey && !e.detail.ctrlKey && !e.detail.shiftKey && e.detail.button === 0) {
+            e.preventDefault();
+            navigate(path);
+        }
     };
-    return (_jsx(Button, { variant: variant, onClick: handleClick, iconName: "add-plus", ...props, children: label || translate('ra.action.create', { _: 'Create' }) }));
+    return (_jsx(Button, { variant: variant, href: path, onClick: handleClick, iconName: "add-plus", ...props, children: label || translate('strato.action.create', { _: 'Create' }) }));
 };
 export default CreateButton;

package/dist/button/DeleteButton.d.ts

@@ -0,0 +1,13 @@
+import { RaRecord } from '@strato-admin/ra-core';
+export interface DeleteButtonProps {
+    label?: string;
+    variant?: 'primary' | 'normal' | 'link';
+    mutationMode?: 'undoable' | 'optimistic' | 'pessimistic';
+    successMessage?: string;
+    dialogTitle?: string;
+    dialogDescription?: string;
+    record?: RaRecord;
+    redirect?: string;
+}
+export declare const DeleteButton: ({ label, variant, mutationMode, successMessage, dialogTitle, dialogDescription, record, redirect, }: DeleteButtonProps) => import("react/jsx-runtime").JSX.Element | null;
+export default DeleteButton;

package/dist/button/DeleteButton.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useDeleteController, useTranslate, useResourceDefinition } from '@strato-admin/ra-core';
+import { useSettingValue } from '@strato-admin/core';
+import Modal from '@cloudscape-design/components/modal';
+import Box from '@cloudscape-design/components/box';
+import SpaceBetween from '@cloudscape-design/components/space-between';
+import { Button } from './Button';
+export const DeleteButton = ({ label, variant = 'normal', mutationMode, successMessage, dialogTitle, dialogDescription, record, redirect, }) => {
+    const translate = useTranslate();
+    const { options } = useResourceDefinition();
+    const resolve = useSettingValue();
+    const { handleDelete, isPending, isLoading } = useDeleteController({
+        mutationMode: resolve(mutationMode, 'mutationMode'),
+        successMessage: successMessage ?? options?.deleteSuccessMessage ?? resolve(undefined, 'deleteSuccessMessage'),
+        record,
+        redirect,
+    });
+    const [isOpen, setIsOpen] = useState(false);
+    if (options?.canDelete === false) {
+        return null;
+    }
+    const isBusy = isPending || isLoading;
+    const handleConfirm = () => {
+        handleDelete();
+        setIsOpen(false);
+    };
+    const defaultTitle = translate('strato.message.delete_title', {
+        _: 'Delete this item',
+    });
+    const defaultDescription = translate('strato.message.delete_content', {
+        _: 'Are you sure you want to delete this item?',
+    });
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: variant, onClick: () => setIsOpen(true), loading: isBusy, disabled: isBusy, "data-testid": "delete-button", children: label || translate('strato.action.delete', { _: 'Delete' }) }), _jsx(Modal, { onDismiss: () => setIsOpen(false), visible: isOpen, closeAriaLabel: translate('strato.action.close', { _: 'Close' }), footer: _jsx(Box, { float: "right", children: _jsxs(SpaceBetween, { direction: "horizontal", size: "xs", children: [_jsx(Button, { variant: "link", onClick: () => setIsOpen(false), children: translate('strato.action.cancel', { _: 'Cancel' }) }), _jsx(Button, { variant: "primary", onClick: handleConfirm, loading: isBusy, "data-testid": "confirm-delete", children: translate('strato.action.confirm', { _: 'Confirm' }) })] }) }), header: dialogTitle || defaultTitle, children: dialogDescription || defaultDescription })] }));
+};
+export default DeleteButton;

package/dist/button/EditButton.d.ts

@@ -1,4 +1,4 @@
-import { RaRecord } from '@strato-admin/core';
+import { RaRecord } from '@strato-admin/ra-core';
 import { ButtonProps } from './Button';
 export interface EditButtonProps extends Omit<ButtonProps, 'children'> {
     label?: string;

package/dist/button/EditButton.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useResourceContext, useRecordContext, useTranslate, useCreatePath } from '@strato-admin/core';
+import { useResourceContext, useRecordContext, useTranslate } from '@strato-admin/ra-core';
+import { useCreatePath } from '@strato-admin/core';
 import { useNavigate } from 'react-router-dom';
 import { Button } from './Button';
-export const EditButton = ({ label, record: recordProp, variant = 'primary', ...props }) => {
+export const EditButton = ({ label, record: recordProp, variant = 'normal', ...props }) => {
     const resource = useResourceContext();
     const record = useRecordContext(recordProp);
     const translate = useTranslate();
@@ -11,14 +12,13 @@ export const EditButton = ({ label, record: recordProp, variant = 'primary', ...
     if (!record) {
         return null;
     }
-    const handleClick = () => {
-        const path = createPath({
-            resource,
-            id: record.id,
-            type: 'edit',
-        });
-        navigate(path);
+    const path = createPath({ resource, id: record.id, type: 'edit' });
+    const handleClick = (e) => {
+        if (!e.detail.metaKey && !e.detail.ctrlKey && !e.detail.shiftKey && e.detail.button === 0) {
+            e.preventDefault();
+            navigate(path);
+        }
     };
-    return (_jsx(Button, { variant: variant, onClick: handleClick, ...props, children: label || translate('ra.action.edit', { _: 'Edit' }) }));
+    return (_jsx(Button, { variant: variant, href: path, onClick: handleClick, iconName: "edit", ...props, children: label || translate('strato.action.edit', { _: 'Edit' }) }));
 };
 export default EditButton;

package/dist/button/SaveButton.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useTranslate } from '@strato-admin/core';
+import { useTranslate } from '@strato-admin/ra-core';
 import { Button } from './Button';
 export const SaveButton = ({ label, variant = 'primary', ...props }) => {
     const translate = useTranslate();
-    return (_jsx(Button, { variant: variant, formAction: "submit", nativeButtonAttributes: { type: 'submit' }, ...props, children: label || translate('ra.action.save', { _: 'Save' }) }));
+    return (_jsx(Button, { variant: variant, formAction: "submit", nativeButtonAttributes: { type: 'submit' }, ...props, children: label || translate('strato.action.save', { _: 'Save' }) }));
 };
 export default SaveButton;

package/dist/button/index.d.ts

@@ -1,5 +1,7 @@
 export * from './Button';
 export * from './EditButton';
 export * from './BulkDeleteButton';
+export * from './DeleteButton';
 export * from './SaveButton';
 export * from './CreateButton';
+export * from './CancelButton';

package/dist/button/index.js

@@ -1,5 +1,7 @@
 export * from './Button';
 export * from './EditButton';
 export * from './BulkDeleteButton';
+export * from './DeleteButton';
 export * from './SaveButton';
 export * from './CreateButton';
+export * from './CancelButton';

package/dist/collection-hooks/interfaces.d.ts

@@ -14,9 +14,13 @@ export interface CollectionPreferences {
     contentDensity?: 'comfortable' | 'compact';
 }
 export interface UseCollectionOptions<_T> {
-    filtering?: any;
-    pagination?: any;
-    sorting?: any;
+    /**
+     * Set to true when using a client-side data provider where the data array
+     * contains ALL records, not just the current page. The hook will slice the
+     * array for pagination instead of relying on the server.
+     * @default false
+     */
+    clientSidePagination?: boolean;
     preferences?: {
         pageSizeOptions?: ReadonlyArray<{
             value: number;

package/dist/collection-hooks/useCollection.d.ts

@@ -1,3 +1,3 @@
-import { RaRecord } from '@strato-admin/core';
+import { RaRecord } from '@strato-admin/ra-core';
 import { UseCollectionOptions, UseCollectionResult } from './interfaces';
 export declare function useCollection<T extends RaRecord>(options: UseCollectionOptions<T>): UseCollectionResult<T>;

package/dist/collection-hooks/useCollection.js

@@ -1,5 +1,5 @@
-import { useState, useMemo } from 'react';
-import { useListContext } from '@strato-admin/core';
+import { useState, useMemo, useEffect } from 'react';
+import { useListContext } from '@strato-admin/ra-core';
 export function useCollection(options) {
     const { data, // Array of the list records, e.g. [{ id: 123, title: 'hello world' }, { ... }
     total, // Total number of results for the current filters, excluding pagination. Useful to build the pagination controls, e.g. 23
@@ -22,11 +22,18 @@ export function useCollection(options) {
     const [wrapLines, setWrapLines] = useState(options.preferences?.wrapLines);
     const [stripedRows, setStripedRows] = useState(options.preferences?.stripedRows);
     const [visibleContent, setVisibleContent] = useState(options.preferences?.visibleContent ?? options.preferences?.visibleContentOptions?.map((o) => o.id));
-    const [contentDisplay, setContentDisplay] = useState(options.preferences?.contentDisplay ?? options.preferences?.contentDisplayOptions?.map((o) => ({ id: o.id, visible: true })));
-    useMemo(() => {
+    const [contentDisplay, setContentDisplay] = useState(options.preferences?.contentDisplay ??
+        options.preferences?.contentDisplayOptions?.map((o) => ({ id: o.id, visible: true })));
+    useEffect(() => {
         setVisibleContent(options.preferences?.visibleContent ?? options.preferences?.visibleContentOptions?.map((o) => o.id));
-        setContentDisplay(options.preferences?.contentDisplay ?? options.preferences?.contentDisplayOptions?.map((o) => ({ id: o.id, visible: true })));
-    }, [options.preferences?.visibleContent, options.preferences?.visibleContentOptions, options.preferences?.contentDisplay, options.preferences?.contentDisplayOptions]);
+        setContentDisplay(options.preferences?.contentDisplay ??
+            options.preferences?.contentDisplayOptions?.map((o) => ({ id: o.id, visible: true })));
+    }, [
+        options.preferences?.visibleContent,
+        options.preferences?.visibleContentOptions,
+        options.preferences?.contentDisplay,
+        options.preferences?.contentDisplayOptions,
+    ]);
     const selectedItems = (selectedIds || []).map((id) => {
         const item = data?.find((i) => i.id === id);
         if (item)
@@ -34,15 +41,13 @@ export function useCollection(options) {
         return { id };
     });
     const items = useMemo(() => {
-        // If it's a client-side list (data contains all records), we need to slice it for pagination.
-        // We detect this by checking if data.length equals total and if data.length is greater than perPage.
-        if (data && total === data.length && data.length > (perPage || 0)) {
+        if (options.clientSidePagination && data) {
             const p = page || 1;
             const pp = perPage || 25;
             return data.slice((p - 1) * pp, p * pp);
         }
         return data;
-    }, [data, total, page, perPage]);
+    }, [data, options.clientSidePagination, page, perPage]);
     return {
         items,
         collectionProps: {

package/dist/create/Create.d.ts

@@ -1,17 +1,15 @@
 import React from 'react';
-import { type RaRecord } from '@strato-admin/core';
-export interface CreateProps<RecordType extends RaRecord = RaRecord> {
+import { type RaRecord, type CreateBaseProps, Identifier } from '@strato-admin/ra-core';
+export interface CreateProps<RecordType extends Omit<RaRecord, 'id'> = any, ResultRecordType extends RaRecord = RecordType & {
+    id: Identifier;
+}, MutationOptionsError = Error> extends CreateBaseProps<RecordType, ResultRecordType, MutationOptionsError> {
     children?: React.ReactNode;
-    inputSchema?: React.ReactNode;
-    title?: React.ReactNode;
+    title?: React.ReactNode | ((record: Partial<RecordType>) => React.ReactNode);
+    description?: React.ReactNode | ((record: Partial<RecordType>) => React.ReactNode);
     actions?: React.ReactNode;
-    resource?: string;
-    record?: Partial<RecordType>;
-    redirect?: any;
-    transform?: any;
-    mutationOptions?: any;
     include?: string[];
     exclude?: string[];
+    saveButtonLabel?: string;
 }
 /**
  * A Create component that provides record context and a Cloudscape Container.
@@ -26,15 +24,9 @@ export interface CreateProps<RecordType extends RaRecord = RaRecord> {
  * @example
  * // Using InputSchema from context
  * <Create include={['name', 'price']} />
- *
- * @example
- * // Passing a custom input schema
- * <Create inputSchema={<InputSchema>...</InputSchema>}>
- *   <Form />
- * </Create>
  */
 export declare const Create: {
-    <RecordType extends RaRecord = RaRecord<import("@strato-admin/ra-core").Identifier>>({ children, inputSchema, title, actions, include, exclude, ...props }: CreateProps<RecordType>): import("react/jsx-runtime").JSX.Element;
-    Header: ({ title, actions, ...props }: import("./CreateHeader").CreateHeaderProps) => import("react/jsx-runtime").JSX.Element;
+    <RecordType extends RaRecord = RaRecord<Identifier>>({ children, title, actions, description, include, exclude, redirect, saveButtonLabel, ...props }: CreateProps<RecordType>): import("react/jsx-runtime").JSX.Element;
+    Header: ({ title, actions, description, counter, info, variant, headingTagOverride }: import("./CreateHeader").CreateHeaderProps) => import("react/jsx-runtime").JSX.Element;
 };
 export default Create;

package/dist/create/Create.js

@@ -1,11 +1,43 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { CreateBase, ResourceSchemaProvider } from '@strato-admin/core';
+import React from 'react';
+import { CreateBase, useTranslate } from '@strato-admin/ra-core';
+import { ResourceSchemaProvider, useResourceSchema, useConstructedPageTitle, useSettingValue, } from '@strato-admin/core';
 import Container from '@cloudscape-design/components/container';
 import { CreateHeader } from './CreateHeader';
 import Form from '../form/Form';
-const CreateUI = ({ children, resource, inputSchema, title, actions, include, exclude, }) => {
-    const finalChildren = children || _jsx(Form, { include: include, exclude: exclude });
-    return (_jsx(ResourceSchemaProvider, { resource: resource, inputSchema: inputSchema, children: _jsx(Container, { header: _jsx(CreateHeader, { title: title, actions: actions }), children: finalChildren }) }));
+const CreateUI = ({ children, title, actions, description, include, exclude, saveButtonLabel, }) => {
+    const { label, createTitle, createDescription } = useResourceSchema();
+    const translate = useTranslate();
+    const constructedTitle = useConstructedPageTitle('create', label);
+    const finalTitle = React.useMemo(() => {
+        if (typeof title === 'function')
+            return title({});
+        if (React.isValidElement(title))
+            return title;
+        if (title)
+            return translate(title);
+        if (React.isValidElement(createTitle))
+            return createTitle;
+        if (createTitle)
+            return translate(createTitle);
+        return constructedTitle;
+    }, [title, createTitle, translate, constructedTitle]);
+    const finalDescription = React.useMemo(() => {
+        if (typeof description === 'function')
+            return description({});
+        if (React.isValidElement(description))
+            return description;
+        if (description)
+            return translate(description);
+        if (React.isValidElement(createDescription))
+            return createDescription;
+        if (createDescription)
+            return translate(createDescription);
+        return undefined;
+    }, [description, createDescription, translate]);
+    const finalSaveButtonLabel = saveButtonLabel ? translate(saveButtonLabel) : translate('Create');
+    const finalChildren = children || _jsx(Form, { include: include, exclude: exclude, saveButtonLabel: finalSaveButtonLabel });
+    return (_jsx(Container, { header: _jsx(CreateHeader, { title: finalTitle, description: finalDescription, actions: actions }), children: finalChildren }));
 };
 /**
  * A Create component that provides record context and a Cloudscape Container.
@@ -20,15 +52,11 @@ const CreateUI = ({ children, resource, inputSchema, title, actions, include, ex
  * @example
  * // Using InputSchema from context
  * <Create include={['name', 'price']} />
- *
- * @example
- * // Passing a custom input schema
- * <Create inputSchema={<InputSchema>...</InputSchema>}>
- *   <Form />
- * </Create>
  */
-export const Create = ({ children, inputSchema, title, actions, include, exclude, ...props }) => {
-    return (_jsx(CreateBase, { ...props, children: _jsx(CreateUI, { resource: props.resource, title: title, actions: actions, include: include, exclude: exclude, inputSchema: inputSchema, children: children }) }));
+export const Create = ({ children, title, actions, description, include, exclude, redirect, saveButtonLabel, ...props }) => {
+    const resolve = useSettingValue();
+    const resolvedRedirect = redirect !== undefined ? redirect : resolve(undefined, 'createRedirect');
+    return (_jsx(CreateBase, { redirect: resolvedRedirect, ...props, children: _jsx(ResourceSchemaProvider, { resource: props.resource, children: _jsx(CreateUI, { title: title, actions: actions, description: description, include: include, exclude: exclude, saveButtonLabel: saveButtonLabel, children: children }) }) }));
 };
 Create.Header = CreateHeader;
 export default Create;

package/dist/create/CreateHeader.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { HeaderProps } from '@cloudscape-design/components/header';
-export interface CreateHeaderProps extends Omit<HeaderProps, 'children'> {
+export interface CreateHeaderProps extends Pick<HeaderProps, 'variant' | 'counter' | 'actions' | 'description' | 'info' | 'headingTagOverride'> {
     title?: React.ReactNode;
 }
-export declare const CreateHeader: ({ title, actions, ...props }: CreateHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CreateHeader: ({ title, actions, description, counter, info, variant, headingTagOverride }: CreateHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default CreateHeader;

package/dist/create/CreateHeader.js

@@ -1,9 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import Header from '@cloudscape-design/components/header';
-import SpaceBetween from '@cloudscape-design/components/space-between';
-import { useCreateContext, useTranslate } from '@strato-admin/core';
-export const CreateHeader = ({ title, actions, ...props }) => {
+import { useCreateContext, useTranslate } from '@strato-admin/ra-core';
+export const CreateHeader = ({ title, actions, description, counter, info, variant = 'h2', headingTagOverride }) => {
     const translate = useTranslate();
     const { defaultTitle } = useCreateContext();
     const headerTitle = React.useMemo(() => {
@@ -12,7 +11,7 @@ export const CreateHeader = ({ title, actions, ...props }) => {
         }
         return defaultTitle;
     }, [title, defaultTitle, translate]);
-    const headerActions = actions || (_jsx(SpaceBetween, { direction: "horizontal", size: "xs" }));
-    return (_jsx(Header, { variant: "h2", ...props, actions: headerActions, children: headerTitle }));
+    const headerActions = actions ?? null;
+    return (_jsx(Header, { variant: variant, actions: headerActions, description: description, counter: counter, info: info, headingTagOverride: headingTagOverride, children: headerTitle }));
 };
 export default CreateHeader;

package/dist/defaults.d.ts

@@ -0,0 +1,6 @@
+import type { AdminSettings } from '@strato-admin/core';
+/**
+ * The framework's last-resort default values for all Admin-level configurable settings.
+ * Override any of these via the `settings` prop on <Admin>.
+ */
+export declare const FRAMEWORK_DEFAULTS: AdminSettings;