@strato-admin/core 0.1.1 → 0.3.0

package/dist/ra-core/src/inference/inferTypeFromValues.js

@@ -0,0 +1,141 @@
+import getValuesFromRecords from './getValuesFromRecords';
+import { isObject, valuesAreArray, valuesAreBoolean, valuesAreDate, valuesAreDateString, valuesAreHtml, valuesAreInteger, valuesAreNumeric, valuesAreObject, valuesAreString, valuesAreUrl, valuesAreImageUrl, valuesAreEmail, } from './assertions';
+import { pluralize } from 'inflection';
+export const InferenceTypes = [
+    'array',
+    'boolean',
+    'date',
+    'email',
+    'id',
+    'image',
+    'number',
+    'reference',
+    'referenceChild',
+    'referenceArray',
+    'referenceArrayChild',
+    'richText',
+    'string',
+    'url',
+    'object',
+];
+/**
+ * Guesses an element type based on an array of values
+ *
+ * @example
+ *     inferElementFromValues(
+ *         'address',
+ *         ['2 Baker Street', '1 Downing street'],
+ *     );
+ *     // { type: 'string', props: { source: 'address' } }
+ *
+ * @param {string} name Property name, e.g. 'date_of_birth'
+ * @param {any[]} values an array of values from which to determine the type, e.g. [12, 34.4, 43]
+ */
+export const inferTypeFromValues = (name, values = []) => {
+    if (name === 'id') {
+        return { type: 'id', props: { source: name } };
+    }
+    if (name.substr(name.length - 3) === '_id') {
+        return {
+            type: 'reference',
+            props: {
+                source: name,
+                reference: pluralize(name.substr(0, name.length - 3)),
+            },
+            children: { type: 'referenceChild' },
+        };
+    }
+    if (name.substr(name.length - 2) === 'Id') {
+        return {
+            type: 'reference',
+            props: {
+                source: name,
+                reference: pluralize(name.substr(0, name.length - 2)),
+            },
+            children: { type: 'referenceChild' },
+        };
+    }
+    if (name.substr(name.length - 4) === '_ids') {
+        return {
+            type: 'referenceArray',
+            props: {
+                source: name,
+                reference: pluralize(name.substr(0, name.length - 4)),
+            },
+            children: { type: 'referenceArrayChild' },
+        };
+    }
+    if (name.substr(name.length - 3) === 'Ids') {
+        return {
+            type: 'referenceArray',
+            props: {
+                source: name,
+                reference: pluralize(name.substr(0, name.length - 3)),
+            },
+            children: { type: 'referenceArrayChild' },
+        };
+    }
+    if (values.length === 0) {
+        if (name === 'email') {
+            return { type: 'email', props: { source: name } };
+        }
+        if (name === 'url') {
+            return { type: 'url', props: { source: name } };
+        }
+        // FIXME introspect further using name
+        return { type: 'string', props: { source: name } };
+    }
+    if (valuesAreArray(values)) {
+        if (isObject(values[0][0])) {
+            const leafValues = getValuesFromRecords(values.reduce((acc, vals) => acc.concat(vals), []));
+            // FIXME bad visual representation
+            return {
+                type: 'array',
+                props: { source: name },
+                children: Object.keys(leafValues).map(leafName => inferTypeFromValues(leafName, leafValues[leafName])),
+            };
+        }
+        // FIXME introspect further
+        return { type: 'string', props: { source: name } };
+    }
+    if (valuesAreBoolean(values)) {
+        return { type: 'boolean', props: { source: name } };
+    }
+    if (valuesAreDate(values)) {
+        return { type: 'date', props: { source: name } };
+    }
+    if (valuesAreString(values)) {
+        if (name === 'email' || valuesAreEmail(values)) {
+            return { type: 'email', props: { source: name } };
+        }
+        if (name === 'url' || valuesAreUrl(values)) {
+            if (valuesAreImageUrl(values)) {
+                return { type: 'image', props: { source: name } };
+            }
+            return { type: 'url', props: { source: name } };
+        }
+        if (valuesAreDateString(values)) {
+            return { type: 'date', props: { source: name } };
+        }
+        if (valuesAreHtml(values)) {
+            return { type: 'richText', props: { source: name } };
+        }
+        if (valuesAreInteger(values) || valuesAreNumeric(values)) {
+            return { type: 'number', props: { source: name } };
+        }
+        return { type: 'string', props: { source: name } };
+    }
+    if (valuesAreInteger(values) || valuesAreNumeric(values)) {
+        return { type: 'number', props: { source: name } };
+    }
+    if (valuesAreObject(values)) {
+        /// Arbitrarily, choose the first prop of the first object
+        const propName = Object.keys(values[0]).shift();
+        if (!propName) {
+            return { type: 'object', props: { source: name } };
+        }
+        const leafValues = values.map(v => v[propName]);
+        return inferTypeFromValues(`${name}.${propName}`, leafValues);
+    }
+    return { type: 'string', props: { source: name } };
+};

package/dist/ra-core/src/inference/types.d.ts

@@ -0,0 +1,9 @@
+import { ComponentType } from 'react';
+export interface InferredType {
+    type?: ComponentType;
+    component?: ComponentType;
+    representation?: (props: any, children: any) => string;
+}
+export interface InferredTypeMap {
+    [key: string]: InferredType | undefined;
+}

package/dist/ra-core/src/inference/types.js

@@ -0,0 +1 @@
+export {};

package/dist/ra-core/src/notification/AddNotificationContext.d.ts

@@ -0,0 +1,2 @@
+import { NotificationPayload } from './types';
+export declare const AddNotificationContext: import("react").Context<(notification: NotificationPayload) => void>;

package/dist/ra-core/src/notification/AddNotificationContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const AddNotificationContext = createContext(() => { });

package/dist/ra-core/src/notification/CloseNotificationContext.d.ts

@@ -0,0 +1,2 @@
+export type CloseNotificationContextValue = () => void;
+export declare const CloseNotificationContext: import("react").Context<CloseNotificationContextValue | null>;

package/dist/ra-core/src/notification/CloseNotificationContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const CloseNotificationContext = createContext(null);

package/dist/ra-core/src/notification/NotificationContext.d.ts

@@ -0,0 +1,37 @@
+import { Dispatch, SetStateAction } from 'react';
+import { NotificationPayload } from './types';
+export type NotificationContextType = {
+    notifications: NotificationPayload[];
+    addNotification: (notification: NotificationPayload) => void;
+    takeNotification: () => NotificationPayload | void;
+    resetNotifications: () => void;
+    setNotifications: Dispatch<SetStateAction<NotificationPayload[]>>;
+};
+/**
+ * Context for the notification state and modifiers
+ *
+ * @example // display notifications
+ * import { useNotificationContext } from 'react-admin';
+ *
+ * const App = () => {
+ *    const { notifications } = useNotificationContext();
+ *    return (
+ *        <ul>
+ *            {notifications.map(({ message }) => (
+ *                <li key={index}>{ message }</li>
+ *            ))}
+ *        </ul>
+ *    );
+ * };
+ *
+ * @example // reset notifications
+ * import { useNotificationContext } from 'react-admin';
+ *
+ * const ResetNotificationsButton = () => {
+ *    const { resetNotifications } = useNotificationContext();
+ *    return (
+ *        <button onClick={() => resetNotifications()}>Reset notifications</button>
+ *    );
+ * };
+ */
+export declare const NotificationContext: import("react").Context<NotificationContextType>;

package/dist/ra-core/src/notification/NotificationContext.js

@@ -0,0 +1,35 @@
+import { createContext } from 'react';
+/**
+ * Context for the notification state and modifiers
+ *
+ * @example // display notifications
+ * import { useNotificationContext } from 'react-admin';
+ *
+ * const App = () => {
+ *    const { notifications } = useNotificationContext();
+ *    return (
+ *        <ul>
+ *            {notifications.map(({ message }) => (
+ *                <li key={index}>{ message }</li>
+ *            ))}
+ *        </ul>
+ *    );
+ * };
+ *
+ * @example // reset notifications
+ * import { useNotificationContext } from 'react-admin';
+ *
+ * const ResetNotificationsButton = () => {
+ *    const { resetNotifications } = useNotificationContext();
+ *    return (
+ *        <button onClick={() => resetNotifications()}>Reset notifications</button>
+ *    );
+ * };
+ */
+export const NotificationContext = createContext({
+    notifications: [],
+    addNotification: () => { },
+    takeNotification: () => { },
+    resetNotifications: () => { },
+    setNotifications: () => { },
+});

package/dist/ra-core/src/notification/NotificationContextProvider.d.ts

@@ -0,0 +1,3 @@
+export declare const NotificationContextProvider: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/notification/NotificationContextProvider.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState, useCallback, useMemo } from 'react';
+import { NotificationContext } from './NotificationContext';
+import { AddNotificationContext } from './AddNotificationContext';
+export const NotificationContextProvider = ({ children }) => {
+    const [notifications, setNotifications] = useState([]);
+    const addNotification = useCallback((notification) => {
+        setNotifications(notifications => [...notifications, notification]);
+    }, []);
+    const takeNotification = useCallback(() => {
+        if (notifications.length === 0)
+            return;
+        const [notification, ...rest] = notifications;
+        setNotifications(rest);
+        return notification;
+    }, [notifications]);
+    const resetNotifications = useCallback(() => {
+        setNotifications([]);
+    }, []);
+    const contextValue = useMemo(() => ({
+        notifications,
+        addNotification,
+        takeNotification,
+        resetNotifications,
+        setNotifications,
+    }), [notifications] // eslint-disable-line react-hooks/exhaustive-deps
+    );
+    // we separate the addNotification context to avoid rerendering all components
+    // that depend on useNotify when a notification is dispatched
+    return (_jsx(NotificationContext.Provider, { value: contextValue, children: _jsx(AddNotificationContext.Provider, { value: addNotification, children: children }) }));
+};

package/dist/ra-core/src/notification/index.d.ts

@@ -0,0 +1,9 @@
+export * from './AddNotificationContext';
+export * from './CloseNotificationContext';
+export * from './NotificationContext';
+export * from './NotificationContextProvider';
+export * from './types';
+export * from './useAddNotificationContext';
+export * from './useCloseNotification';
+export * from './useNotificationContext';
+export * from './useNotify';

package/dist/ra-core/src/notification/index.js

@@ -0,0 +1,9 @@
+export * from './AddNotificationContext';
+export * from './CloseNotificationContext';
+export * from './NotificationContext';
+export * from './NotificationContextProvider';
+export * from './types';
+export * from './useAddNotificationContext';
+export * from './useCloseNotification';
+export * from './useNotificationContext';
+export * from './useNotify';

package/dist/ra-core/src/notification/types.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+export type NotificationType = 'success' | 'info' | 'warning' | 'error';
+export interface NotificationOptions {
+    autoHideDuration?: number | null;
+    messageArgs?: any;
+    multiLine?: boolean;
+    undoable?: boolean;
+    [key: string]: any;
+}
+export interface NotificationPayload {
+    readonly message: string | ReactNode;
+    readonly type: NotificationType;
+    readonly notificationOptions?: NotificationOptions;
+}

package/dist/ra-core/src/notification/types.js

@@ -0,0 +1 @@
+export {};

package/dist/ra-core/src/notification/useAddNotificationContext.d.ts

@@ -0,0 +1 @@
+export declare const useAddNotificationContext: () => (notification: import("@strato-admin/core").NotificationPayload) => void;

package/dist/ra-core/src/notification/useAddNotificationContext.js

@@ -0,0 +1,3 @@
+import { useContext } from 'react';
+import { AddNotificationContext } from './AddNotificationContext';
+export const useAddNotificationContext = () => useContext(AddNotificationContext);

package/dist/ra-core/src/notification/useCloseNotification.d.ts

@@ -0,0 +1 @@
+export declare const useCloseNotification: () => import("@strato-admin/core").CloseNotificationContextValue;

package/dist/ra-core/src/notification/useCloseNotification.js

@@ -0,0 +1,9 @@
+import { useContext } from 'react';
+import { CloseNotificationContext } from './CloseNotificationContext';
+export const useCloseNotification = () => {
+    const closeNotification = useContext(CloseNotificationContext);
+    if (!closeNotification) {
+        throw new Error('useCloseNotification must be used within a CloseNotificationContext.Provider');
+    }
+    return closeNotification;
+};

package/dist/ra-core/src/notification/useNotificationContext.d.ts

@@ -0,0 +1 @@
+export declare const useNotificationContext: () => import("@strato-admin/core").NotificationContextType;

package/dist/ra-core/src/notification/useNotificationContext.js

@@ -0,0 +1,3 @@
+import { useContext } from 'react';
+import { NotificationContext } from './NotificationContext';
+export const useNotificationContext = () => useContext(NotificationContext);

package/dist/ra-core/src/notification/useNotify.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { NotificationType, NotificationOptions } from './types';
+/**
+ * Hook for Notification Side Effect
+ *
+ * @example
+ *
+ * const notify = useNotify();
+ * // simple message (info level)
+ * notify('Level complete');
+ * // specify level
+ * notify('A problem occurred', { type: 'error' })
+ * // pass arguments to the translation function
+ * notify('Deleted %{count} elements', { type: 'info', messageArgs: { smart_count: 23 } })
+ * // show the action as undoable in the notification
+ * notify('Post renamed', { type: 'info', undoable: true })
+ */
+export declare const useNotify: () => (message: string | ReactNode, options?: NotificationOptions & {
+    type?: NotificationType;
+}) => void;

package/dist/ra-core/src/notification/useNotify.js

@@ -0,0 +1,28 @@
+import { useCallback } from 'react';
+import { useAddNotificationContext } from './useAddNotificationContext';
+/**
+ * Hook for Notification Side Effect
+ *
+ * @example
+ *
+ * const notify = useNotify();
+ * // simple message (info level)
+ * notify('Level complete');
+ * // specify level
+ * notify('A problem occurred', { type: 'error' })
+ * // pass arguments to the translation function
+ * notify('Deleted %{count} elements', { type: 'info', messageArgs: { smart_count: 23 } })
+ * // show the action as undoable in the notification
+ * notify('Post renamed', { type: 'info', undoable: true })
+ */
+export const useNotify = () => {
+    const addNotification = useAddNotificationContext();
+    return useCallback((message, options = {}) => {
+        const { type: messageType = 'info', ...notificationOptions } = options;
+        addNotification({
+            message,
+            type: messageType,
+            notificationOptions,
+        });
+    }, [addNotification]);
+};

package/dist/ra-core/src/preferences/PreferenceKeyContext.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export declare const PreferenceKeyContext: React.Context<string | null>;
+export declare const PreferenceKeyContextProvider: ({ value, children, }: {
+    value?: string | null;
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const usePreferenceKey: () => string | null;

package/dist/ra-core/src/preferences/PreferenceKeyContext.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+export const PreferenceKeyContext = createContext('');
+export const PreferenceKeyContextProvider = ({ value = '', children, }) => (_jsx(PreferenceKeyContext.Provider, { value: value, children: children }));
+export const usePreferenceKey = () => {
+    return useContext(PreferenceKeyContext);
+};

package/dist/ra-core/src/preferences/PreferencesEditorContext.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export declare const PreferencesEditorContext: React.Context<PreferencesEditorContextValue | undefined>;
+export type PreferencesEditorContextValue = {
+    editor: React.ReactNode;
+    setEditor: React.Dispatch<React.SetStateAction<React.ReactNode>>;
+    preferenceKey: string | null;
+    setPreferenceKey: React.Dispatch<React.SetStateAction<string | null>>;
+    title: string | null;
+    titleOptions?: any;
+    setTitle: (title: string, titleOptions?: any) => void;
+    isEnabled: boolean;
+    enable: () => void;
+    disable: () => void;
+    path: string | null;
+    setPath: (path: string) => void;
+};

package/dist/ra-core/src/preferences/PreferencesEditorContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const PreferencesEditorContext = createContext(undefined);

package/dist/ra-core/src/preferences/PreferencesEditorContextProvider.d.ts

@@ -0,0 +1,3 @@
+export declare const PreferencesEditorContextProvider: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/ra-core/src/preferences/PreferencesEditorContextProvider.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useMemo, useState } from 'react';
+import { PreferencesEditorContext, } from './PreferencesEditorContext';
+export const PreferencesEditorContextProvider = ({ children }) => {
+    const [isEnabled, setIsEnabled] = useState(false);
+    const [editor, setEditor] = useState(null);
+    const [preferenceKey, setPreferenceKey] = useState(null);
+    const [path, setPath] = useState(null);
+    const [title, setTitleString] = useState(null);
+    const [titleOptions, setTitleOptions] = useState();
+    const enable = useCallback(() => setIsEnabled(true), []);
+    const disable = useCallback(() => {
+        setIsEnabled(false);
+        setEditor(null);
+    }, []);
+    const setTitle = useCallback((title, titleOptions) => {
+        setTitleString(title);
+        setTitleOptions(titleOptions);
+    }, []);
+    const context = useMemo(() => {
+        return {
+            editor,
+            setEditor,
+            preferenceKey,
+            setPreferenceKey,
+            title,
+            titleOptions,
+            setTitle,
+            isEnabled,
+            disable,
+            enable,
+            path,
+            setPath,
+        };
+    }, [
+        disable,
+        enable,
+        editor,
+        preferenceKey,
+        isEnabled,
+        path,
+        setPath,
+        title,
+        titleOptions,
+        setTitle,
+    ]);
+    return (_jsx(PreferencesEditorContext.Provider, { value: context, children: children }));
+};

package/dist/ra-core/src/preferences/index.d.ts

@@ -0,0 +1,7 @@
+export * from './PreferencesEditorContext';
+export * from './PreferencesEditorContextProvider';
+export * from './usePreference';
+export * from './usePreferencesEditor';
+export * from './usePreferenceInput';
+export * from './useSetInspectorTitle';
+export * from './PreferenceKeyContext';

package/dist/ra-core/src/preferences/index.js

@@ -0,0 +1,7 @@
+export * from './PreferencesEditorContext';
+export * from './PreferencesEditorContextProvider';
+export * from './usePreference';
+export * from './usePreferencesEditor';
+export * from './usePreferenceInput';
+export * from './useSetInspectorTitle';
+export * from './PreferenceKeyContext';

package/dist/ra-core/src/preferences/usePreference.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Get a preference value from the store
+ *
+ * Relies on the store, using a key namespaced with the preference key from the PreferenceKeyContext
+ * @example
+ *
+ * // when used inside a PreferenceKeyContext of value 'my-app'
+ * const [theme, setTheme] = usePreference('theme', 'light');
+ * // this is equivalent to
+ * const [theme, setTheme] = useStore('my-app.theme', 'light');
+ */
+declare function usePreference<T>(key: string, defaultValue: T): [T, (value: T | ((value: T) => void), defaultValue?: T) => void];
+declare function usePreference<T = undefined>(key: string, defaultValue?: T | undefined): [T | undefined, (value: T | ((value: T) => void), defaultValue?: T) => void];
+declare function usePreference(): [
+    unknown,
+    (value: unknown | ((value: unknown) => void), defaultValue?: unknown) => void
+];
+export { usePreference };

package/dist/ra-core/src/preferences/usePreference.js

@@ -0,0 +1,10 @@
+import { useStore } from '../store/useStore';
+import { usePreferenceKey } from './PreferenceKeyContext';
+function usePreference(key = '', defaultValue = undefined) {
+    const preferenceKey = usePreferenceKey();
+    if (!preferenceKey) {
+        throw new Error("usePreference cannot be used outside of a Configurable component. Did you forget to wrap your component with <Configurable>? If you don't want to use Configurable, you can use the useStore hook instead.");
+    }
+    return useStore(preferenceKey && key ? `${preferenceKey}.${key}` : preferenceKey ?? key, defaultValue);
+}
+export { usePreference };

package/dist/ra-core/src/preferences/usePreferenceInput.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Get the props for a preference input that changes the value on blur
+ *
+ * Relies on `usePreference`, so it's using the PreferenceKeyContext
+ *
+ * @example
+ * const FontSizePreferenceInput = () => {
+ *     const field = usePreferenceInput('ui.font.size', 10);
+ *     return (
+ *         <div>
+ *             <label for="font-size">Font size</label>
+ *             <input id="font-size" {...field} />
+ *         </div>
+ *     );
+ * }
+ */
+export declare const usePreferenceInput: (key: string, defaultValue?: any) => {
+    value: any;
+    onChange: (event: any) => void;
+    onBlur: () => void;
+    onKeyDown: (event: any) => void;
+};

package/dist/ra-core/src/preferences/usePreferenceInput.js

@@ -0,0 +1,43 @@
+import { useState, useEffect } from 'react';
+import { usePreference } from './usePreference';
+/**
+ * Get the props for a preference input that changes the value on blur
+ *
+ * Relies on `usePreference`, so it's using the PreferenceKeyContext
+ *
+ * @example
+ * const FontSizePreferenceInput = () => {
+ *     const field = usePreferenceInput('ui.font.size', 10);
+ *     return (
+ *         <div>
+ *             <label for="font-size">Font size</label>
+ *             <input id="font-size" {...field} />
+ *         </div>
+ *     );
+ * }
+ */
+export const usePreferenceInput = (key, defaultValue) => {
+    const [valueFromStore, setValueFromStore] = usePreference(key, defaultValue);
+    const [value, setValue] = useState(valueFromStore);
+    useEffect(() => {
+        setValue(valueFromStore || defaultValue);
+    }, [valueFromStore, defaultValue]);
+    const onChange = event => {
+        setValue(event.target.value === '' ? defaultValue : event.target.value);
+    };
+    const onBlur = () => {
+        setValueFromStore(value);
+    };
+    const onKeyDown = event => {
+        if (event.key === 'Enter') {
+            setValueFromStore(value);
+            const form = event.target.form;
+            if (form) {
+                const index = [...form].indexOf(event.target);
+                form.elements[index + 1]?.focus();
+            }
+            event.preventDefault();
+        }
+    };
+    return { value, onChange, onBlur, onKeyDown };
+};

package/dist/ra-core/src/preferences/usePreferencesEditor.d.ts

@@ -0,0 +1,2 @@
+import { PreferencesEditorContextValue } from './PreferencesEditorContext';
+export declare const usePreferencesEditor: () => PreferencesEditorContextValue;

package/dist/ra-core/src/preferences/usePreferencesEditor.js

@@ -0,0 +1,9 @@
+import { useContext } from 'react';
+import { PreferencesEditorContext, } from './PreferencesEditorContext';
+export const usePreferencesEditor = () => {
+    const context = useContext(PreferencesEditorContext);
+    if (!context) {
+        throw new Error('usePreferencesEditor must be used within a PreferencesEditorContextProvider');
+    }
+    return context;
+};

package/dist/ra-core/src/preferences/useSetInspectorTitle.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Set inspector title on mount
+ *
+ * @example
+ * useSetInspectorTitle('Datagrid');
+ */
+export declare const useSetInspectorTitle: (title: string, options?: any) => void;