react-admin-base-bootstrap 0.9.22 → 0.9.24

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

@@ -16,6 +16,7 @@ export interface ApiSelectProps<Option = any> {
     staticOptions?: any[];
     sortable?: boolean;
     onAddOrEdit?: (item: any) => void;
+    free?: boolean;
     getNewOptionData?: (name: string, elem: React.ReactNode) => any | null;
 }
 export default function ApiSelect<Option = any>(props: ApiSelectProps<Option>): import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/esm/Components/ApiSelect.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import React, { Fragment, useCallback, useMemo, useState } from 'react';
-import { RefreshScope, useFetch, useRefresh } from 'react-admin-base';
+import { RefreshScope, useFetch, useFreeFetch, useRefresh } from 'react-admin-base';
 import { FormattedMessage, useIntl } from 'react-intl';
 import Select, { components } from "react-select";
 import CreatableSelect from 'react-select/creatable';
@@ -35,6 +35,8 @@ function EditOrAddIndicator(props) {
             e.stopPropagation();
             e.preventDefault();
             props.selectProps.onAddOrEdit();
+        }, onTouchEnd: e => {
+            props.selectProps.onAddOrEdit();
         }, children: _jsx("i", { className: "fas " + (props.hasValue && !isMulti ? 'fa-pencil-alt' : 'fa-plus') }) })));
 }
 function IndicatorsContainer(props) {
@@ -64,13 +66,13 @@ const SortableMultiValueRemove = (props) => {
 };
 const SortableComponents = { Option, SingleValue, MultiValue: SortableMultiValue, IndicatorsContainer, MultiValueRemove: SortableMultiValueRemove };
 export default function ApiSelect(props) {
-    const { disabled, url, getOptionLabel, sortable, getOptionValue, idKey, nameKey, filter, group, onCreateOption, getNewOptionData, isMulti, onChange, value, placeholder, staticOptions } = props;
+    const { disabled, url, getOptionLabel, sortable, free, getOptionValue, idKey, nameKey, filter, group, onCreateOption, getNewOptionData, isMulti, onChange, value, placeholder, staticOptions } = props;
     const intl = useIntl();
     const [search, setSearch] = useState('');
     const params = useMemo(() => ({ query: search }), [search]);
     const [isMenuOpen, setIsMenuOpen] = useState(false);
     const [hasMenuOpen, setHasMenuOpen] = useState(false);
-    const [data, loading, error, update] = useFetch((isMenuOpen && url) || false, params);
+    const [data, loading, error, update] = (free ? useFreeFetch : useFetch)((isMenuOpen && url) || false, params);
     const [creating, setCreating] = useState(false);
     let options = staticOptions || (data && data.data) || data;
     if (group) {

package/package.json

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

package/src/Components/ApiSelect.tsx

@@ -1,7 +1,7 @@
 /** @jsxImportSource @emotion/react */
 import { css } from "@emotion/react"
-import React, {Fragment, useCallback, useMemo, useState} from 'react';
-import {RefreshScope, useFetch, useRefresh} from 'react-admin-base';
+import React, {Fragment, useCallback, useMemo, useRef, useState} from 'react';
+import {RefreshScope, useFetch, useFreeFetch, useRefresh} from 'react-admin-base';
 import { FormattedMessage, useIntl } from 'react-intl';
 import Select, { components } from "react-select";
 import CreatableSelect from 'react-select/creatable';
@@ -42,6 +42,7 @@ function MultiValue(props) {
 
 function EditOrAddIndicator(props) {
     const { className, cx, getStyles, innerProps, isMulti } = props;
+
     return (
       <div
         {...innerProps}
@@ -58,6 +59,9 @@ function EditOrAddIndicator(props) {
             e.preventDefault();
             props.selectProps.onAddOrEdit();
         }}
+        onTouchEnd={e => {
+          props.selectProps.onAddOrEdit();
+        }}
       >
           <i className={"fas " + (props.hasValue && !isMulti ? 'fa-pencil-alt' : 'fa-plus')} />
       </div>);
@@ -137,18 +141,19 @@ export interface ApiSelectProps<Option = any> {
     staticOptions?: any[];
     sortable?: boolean;
     onAddOrEdit?: (item: any) => void;
+    free?: boolean;
     getNewOptionData?: (name: string, elem: React.ReactNode) => any|null;
 }
 
 
 export default function ApiSelect<Option = any>(props: ApiSelectProps<Option>) {
-    const { disabled, url, getOptionLabel, sortable, getOptionValue, idKey, nameKey, filter, group, onCreateOption, getNewOptionData, isMulti, onChange, value, placeholder, staticOptions } = props;
+    const { disabled, url, getOptionLabel, sortable, free, getOptionValue, idKey, nameKey, filter, group, onCreateOption, getNewOptionData, isMulti, onChange, value, placeholder, staticOptions } = props;
     const intl = useIntl();
     const [ search, setSearch ] = useState('');
     const params = useMemo(() => ({ query: search }), [search]);
     const [ isMenuOpen, setIsMenuOpen ] = useState(false);
     const [ hasMenuOpen, setHasMenuOpen ] = useState(false);
-    const [ data, loading, error, update ] = useFetch((isMenuOpen && url) || false, params);
+    const [ data, loading, error, update ] = (free ? useFreeFetch : useFetch)((isMenuOpen && url) || false, params);
     const [ creating, setCreating ] = useState(false);
 
     let options = staticOptions || (data && data.data) || data;