react-admin-base-bootstrap 0.8.4 → 0.8.5

package/lib/esm/Components/BootstrapModal.d.ts

@@ -0,0 +1,2 @@
+import { ModalProps } from "reactstrap";
+export default function BootstrapModal(props: ModalProps): JSX.Element;

package/lib/esm/Components/BootstrapModal.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Modal } from "reactstrap";
+import { useBootstrapOptions } from "./BootstrapOptions";
+export default function BootstrapModal(props) {
+    const bsOptions = useBootstrapOptions();
+    return React.createElement(Modal, Object.assign({}, props, { toggle: bsOptions.noCloseModal ? undefined : props.toggle }));
+}

package/lib/esm/Components/BootstrapOptions.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+import BootstrapOptions from "./BootstrapOptions";
+interface BootstrapOptions {
+    noCloseModal: boolean;
+}
+interface BootstrapOptionsProviderProps extends BootstrapOptions {
+    children: ReactNode;
+}
+export declare function useBootstrapOptions(): BootstrapOptions;
+export default function BootstrapOptionsProvider({ children, noCloseModal }: BootstrapOptionsProviderProps): JSX.Element;
+export {};

package/lib/esm/Components/BootstrapOptions.js

@@ -0,0 +1,11 @@
+import React, { createContext, useContext, useMemo } from "react";
+const BootstrapOptionsContext = createContext({
+    noCloseModal: false
+});
+export function useBootstrapOptions() {
+    return useContext(BootstrapOptionsContext);
+}
+export default function BootstrapOptionsProvider({ children, noCloseModal }) {
+    const options = useMemo(() => ({ noCloseModal }), [noCloseModal]);
+    return React.createElement(BootstrapOptionsContext.Provider, { value: options }, children);
+}

package/lib/esm/Components/CRUD.js

@@ -22,9 +22,10 @@ import React, { useCallback, useContext, useRef, useState } from 'react';
 import { ValidatorProvider } from "react-admin-base";
 import { FormattedMessage } from 'react-intl';
 import { Navigate, Routes, useParams, Route } from 'react-router-dom';
-import { Alert, Button, Col, Form, Modal, ModalFooter, ModalHeader, Row } from "reactstrap";
+import { Alert, Button, Col, Form, ModalFooter, ModalHeader, Row } from "reactstrap";
 import LoadingButton from '../Components/LoadingButton';
 import BootstrapDataTable, { Actions } from './BootstrapDataTable';
+import BootstrapModal from './BootstrapModal';
 export function ModalEntityEditor({ entity, title, size, url, onReload, disabled, children }) {
     const [, , save, loading] = entity;
     const [open, setOpen] = useState(true);
@@ -59,7 +60,7 @@ export function ModalEntityEditor({ entity, title, size, url, onReload, disabled
     }, [save, saved, error, onReload, url]);
     return React.createElement(React.Fragment, null,
         (saved || !open) && url && React.createElement(Navigate, { to: url, replace: true }),
-        React.createElement(Modal, { isOpen: true, size: size, toggle: () => url ? setOpen(false) : onReload(null), fade: false },
+        React.createElement(BootstrapModal, { isOpen: true, size: size, toggle: () => url ? setOpen(false) : onReload(null), fade: false },
             title && React.createElement(ModalHeader, { toggle: () => url ? setOpen(false) : onReload(null) },
                 React.createElement("b", null, title)),
             React.createElement(ValidatorProvider, null,
@@ -103,5 +104,5 @@ export default function CRUD(props) {
         React.createElement(Routes, null,
             !noAdd && React.createElement(Route, { path: "create", element: React.createElement(ComponentWrapper, Object.assign({ Component: Component, url: url, onReload: reload }, (defaultParams || {}))) }),
             React.createElement(Route, { path: ":id/edit", element: React.createElement(ComponentWrapper, Object.assign({ Component: Component, url: url, onReload: reload }, (defaultParams || {}))) })),
-        React.createElement(BootstrapDataTable, Object.assign({ innerRef: ref, add: (!noAdd && "create") || undefined }, props, { url: apiUrl || url })));
+        React.createElement(BootstrapDataTable, Object.assign({ innerRef: ref, add: (!noAdd && "create") || undefined }, props, { url: apiUrl || url }), props.children));
 }

package/lib/esm/Components/FilePickerCore.js

@@ -6,7 +6,8 @@ import { FormattedMessage } from "react-intl";
 import DragAndDropArrow from './DragAndDropArrow';
 const photo_ext = ["png", "jpg", "jpeg", "svg"];
 function is_photo(name) {
-    return photo_ext.indexOf(name.split('.')[1]) !== -1;
+    const sp = (name || '').split('.');
+    return photo_ext.indexOf((sp[sp.length - 1] || '').toLowerCase()) !== -1;
 }
 function is_absolute(url) {
     if (url.indexOf("blob:") === 0)
@@ -25,7 +26,7 @@ export function Relative({ children }) {
     });
 }
 export function Preview({ value }) {
-    const name = value.$name;
+    const name = value.$name || value.name;
     const src = value.$blob_url || value.$src;
     if (is_photo(name)) {
         return React.createElement("div", { className: "mt-2" },

package/lib/esm/Components/GoToTop.js

@@ -10,7 +10,7 @@ export default class GoToTop extends React.Component {
         window.scrollTo(0, 0);
     }
     handleScroll(e) {
-        var newShow = window.scrollY > 100;
+        const newShow = window.scrollY > 100;
         if (newShow !== this.state.show) {
             this.setState({ show: newShow });
         }

package/lib/esm/index.d.ts

@@ -21,4 +21,6 @@ import StepList, { StepItem } from './Components/StepList';
 import PasswordInput from './Components/PasswordInput';
 import DefaultValidatorOptions from './Components/DefaultValidatorOptions';
 import DragAndDropArrow from './Components/DragAndDropArrow';
-export { ThemeProvider, useTheme, useAllThemes, useIsMobile, useMenuState, DefaultValidatorOptions, PasswordInput, StepList, StepItem, TopProgressBar, CRUD, ModalEntityEditor, CRUDActions, Relative, ApiSelect, Preview, ExcelExportButton, ExternalLoginButton, SingleFilePicker, MultiFilePicker, ImagePicker, BootstrapTable, EntityEditor, GoToTop, Validator, ValueValidator, ValidationErrors, LoadingButton, BootstrapDataTable, IdColumn, Column, ActionsColumn, Actions, useDataTableContext, RowRenderer, LanguageProvider, useLanguage, LanguageSwitcher, ErrorBoundary, CheckBox, DragAndDropArrow };
+import BootstrapOptionsProvider, { useBootstrapOptions } from './Components/BootstrapOptions';
+import BootstrapModal from './Components/BootstrapModal';
+export { ThemeProvider, useTheme, useAllThemes, useIsMobile, useMenuState, DefaultValidatorOptions, PasswordInput, StepList, StepItem, TopProgressBar, CRUD, ModalEntityEditor, CRUDActions, Relative, ApiSelect, Preview, ExcelExportButton, ExternalLoginButton, SingleFilePicker, MultiFilePicker, ImagePicker, BootstrapTable, EntityEditor, GoToTop, Validator, ValueValidator, ValidationErrors, LoadingButton, BootstrapDataTable, IdColumn, Column, ActionsColumn, Actions, useDataTableContext, RowRenderer, LanguageProvider, useLanguage, LanguageSwitcher, ErrorBoundary, CheckBox, DragAndDropArrow, useBootstrapOptions, BootstrapOptionsProvider, BootstrapModal };

package/lib/esm/index.js

@@ -21,4 +21,6 @@ import StepList, { StepItem } from './Components/StepList';
 import PasswordInput from './Components/PasswordInput';
 import DefaultValidatorOptions from './Components/DefaultValidatorOptions';
 import DragAndDropArrow from './Components/DragAndDropArrow';
-export { ThemeProvider, useTheme, useAllThemes, useIsMobile, useMenuState, DefaultValidatorOptions, PasswordInput, StepList, StepItem, TopProgressBar, CRUD, ModalEntityEditor, CRUDActions, Relative, ApiSelect, Preview, ExcelExportButton, ExternalLoginButton, SingleFilePicker, MultiFilePicker, ImagePicker, BootstrapTable, EntityEditor, GoToTop, Validator, ValueValidator, ValidationErrors, LoadingButton, BootstrapDataTable, IdColumn, Column, ActionsColumn, Actions, useDataTableContext, RowRenderer, LanguageProvider, useLanguage, LanguageSwitcher, ErrorBoundary, CheckBox, DragAndDropArrow };
+import BootstrapOptionsProvider, { useBootstrapOptions } from './Components/BootstrapOptions';
+import BootstrapModal from './Components/BootstrapModal';
+export { ThemeProvider, useTheme, useAllThemes, useIsMobile, useMenuState, DefaultValidatorOptions, PasswordInput, StepList, StepItem, TopProgressBar, CRUD, ModalEntityEditor, CRUDActions, Relative, ApiSelect, Preview, ExcelExportButton, ExternalLoginButton, SingleFilePicker, MultiFilePicker, ImagePicker, BootstrapTable, EntityEditor, GoToTop, Validator, ValueValidator, ValidationErrors, LoadingButton, BootstrapDataTable, IdColumn, Column, ActionsColumn, Actions, useDataTableContext, RowRenderer, LanguageProvider, useLanguage, LanguageSwitcher, ErrorBoundary, CheckBox, DragAndDropArrow, useBootstrapOptions, BootstrapOptionsProvider, BootstrapModal };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-admin-base-bootstrap",
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",

package/src/Components/BootstrapModal.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+import {Modal, ModalProps} from "reactstrap";
+import { useBootstrapOptions } from "./BootstrapOptions";
+
+export default function BootstrapModal(props: ModalProps) {
+    const bsOptions = useBootstrapOptions();
+
+    return <Modal {...props} toggle={bsOptions.noCloseModal ? undefined : props.toggle} />;
+}

package/src/Components/BootstrapOptions.tsx

@@ -0,0 +1,25 @@
+import React, {createContext, ReactNode, useContext, useMemo} from "react";
+import BootstrapOptions from "./BootstrapOptions";
+
+interface BootstrapOptions {
+    noCloseModal: boolean;
+}
+
+interface BootstrapOptionsProviderProps extends BootstrapOptions {
+    children: ReactNode;
+}
+
+const BootstrapOptionsContext = createContext<BootstrapOptions>({
+    noCloseModal: false
+});
+
+export function useBootstrapOptions() {
+    return useContext(BootstrapOptionsContext);
+}
+
+export default function BootstrapOptionsProvider({children,noCloseModal}: BootstrapOptionsProviderProps) {
+    const options = useMemo(() => ({noCloseModal}), [noCloseModal]);
+    return <BootstrapOptionsContext.Provider value={options}>
+        { children }
+    </BootstrapOptionsContext.Provider>;
+}

package/src/Components/CRUD.tsx

@@ -5,6 +5,8 @@ import { Navigate, Routes, useParams, Route } from 'react-router-dom';
 import { Alert, Button, Col, Form, Modal, ModalFooter, ModalHeader, Row } from "reactstrap";
 import LoadingButton from '../Components/LoadingButton';
 import BootstrapDataTable, { Actions, BootstrapTableProps } from './BootstrapDataTable';
+import BootstrapModal from './BootstrapModal';
+import {useBootstrapOptions} from "./BootstrapOptions";
 
 type ModalEntityEditorParams = {
     entity: any;
@@ -57,7 +59,7 @@ export function ModalEntityEditor({ entity, title, size, url, onReload, disabled
 
     return <>
         { (saved || !open) && url && <Navigate to={url} replace />}
-        <Modal isOpen size={size} toggle={() => url ? setOpen(false) : onReload(null)} fade={false}>
+        <BootstrapModal isOpen size={size} toggle={() => url ? setOpen(false) : onReload(null)} fade={false}>
             { title && <ModalHeader toggle={() => url ? setOpen(false) : onReload(null)}>
                 <b>{ title }</b>
             </ModalHeader> }
@@ -83,7 +85,7 @@ export function ModalEntityEditor({ entity, title, size, url, onReload, disabled
                     </ModalFooter>
                 </Form>
             </ValidatorProvider>
-        </Modal>
+        </BootstrapModal>
     </>;
 }
 
@@ -130,6 +132,8 @@ export default function CRUD(props: CRUDProps) {
           { !noAdd && <Route path="create" element={<ComponentWrapper Component={Component} url={url} onReload={reload} {...(defaultParams || {})} />} /> }
           <Route path=":id/edit" element={<ComponentWrapper Component={Component} url={url} onReload={reload} {...(defaultParams || {})} />} />
         </Routes>
-        <BootstrapDataTable innerRef={ref} add={(!noAdd && "create") || undefined} {...props} url={apiUrl || url} />
+        <BootstrapDataTable innerRef={ref} add={(!noAdd && "create") || undefined} {...props} url={apiUrl || url}>
+            {props.children}
+        </BootstrapDataTable>
     </UrlContext.Provider>;
 }

package/src/Components/EntityEditor.tsx

@@ -4,7 +4,6 @@ import { FormattedMessage } from "react-intl";
 import { Alert, Form } from 'reactstrap';
 import LoadingButton from "../Components/LoadingButton";
 import { ValidationErrors } from './Validator';
-import { Navigate } from 'react-router-dom';
 
 type EntityEditorParams = {
     entity: any;

package/src/Components/FilePickerCore.tsx

@@ -9,7 +9,8 @@ import DragAndDropArrow from './DragAndDropArrow';
 const photo_ext = ["png", "jpg", "jpeg", "svg"];
 
 function is_photo(name) {
-  return photo_ext.indexOf(name.split('.')[1]) !== -1;
+    const sp = (name || '').split('.');
+    return photo_ext.indexOf((sp[sp.length - 1] || '').toLowerCase()) !== -1;
 }
 
 function is_absolute(url) {
@@ -39,7 +40,7 @@ export function Relative({ children }: RelativeProps) {
 }
 
 export function Preview({ value }) {
-    const name = value.$name;
+    const name = value.$name || value.name;
     const src = value.$blob_url || value.$src;
 
     if (is_photo(name)) {

package/src/Components/GoToTop.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import {FormattedMessage} from "react-intl";
 
 export default class GoToTop extends React.Component {
-
     state = {show: false};
 
     scrollTop(e) {
@@ -12,7 +11,7 @@ export default class GoToTop extends React.Component {
     }
 
     handleScroll(e) {
-        var newShow = window.scrollY > 100;
+        const newShow = window.scrollY > 100;
         if (newShow !== this.state.show) {
             this.setState({show: newShow});
         }

package/src/Components/ThemeProvider.tsx

@@ -1,5 +1,5 @@
 import React, { createContext, Dispatch, useContext, useEffect, useMemo, useReducer, useRef } from "react";
-import { useApp, useLocalStorage } from "react-admin-base";
+import { useLocalStorage } from "react-admin-base";
 
 const ThemeContext = createContext(null as any);
 const AllThemesContext = createContext(null as any);

package/src/index.ts

@@ -22,6 +22,8 @@ import StepList, { StepItem } from './Components/StepList';
 import PasswordInput from './Components/PasswordInput';
 import DefaultValidatorOptions from './Components/DefaultValidatorOptions';
 import DragAndDropArrow from './Components/DragAndDropArrow';
+import BootstrapOptionsProvider, { useBootstrapOptions } from './Components/BootstrapOptions';
+import BootstrapModal from './Components/BootstrapModal';
 
 export {
     ThemeProvider, useTheme, useAllThemes,
@@ -49,5 +51,8 @@ export {
     LanguageProvider, useLanguage, LanguageSwitcher,
     ErrorBoundary,
     CheckBox,
-    DragAndDropArrow
+    DragAndDropArrow,
+    useBootstrapOptions,
+    BootstrapOptionsProvider,
+    BootstrapModal
 };