@jasperoosthoek/react-toolbox 0.6.0 → 0.6.2

package/dist/index.js.LICENSE.txt

@@ -4,6 +4,20 @@
 	http://jedwatson.github.io/classnames
 */
 
+/*!
+ * mime-db
+ * Copyright(c) 2014 Jonathan Ong
+ * Copyright(c) 2015-2022 Douglas Christopher Wilson
+ * MIT Licensed
+ */
+
+/*!
+ * mime-types
+ * Copyright(c) 2014 Jonathan Ong
+ * Copyright(c) 2015 Douglas Christopher Wilson
+ * MIT Licensed
+ */
+
 /**
  * @license React
  * react-jsx-runtime.production.js

package/dist/utils/utils.d.ts

@@ -1,3 +1,4 @@
+import { AxiosInstance } from 'axios';
 export declare const isEmpty: (value: unknown) => boolean;
 export declare const snakeToCamelCase: (str: string) => string;
 export declare const camelToSnakeCase: (str: string) => string;
@@ -5,3 +6,7 @@ export declare const pluralToSingle: (str: string) => string;
 export declare const arrayToObject: <T extends any[]>(array: T, byKey: string) => any;
 export declare const roundFixed: (str: string | number, decimals?: number) => string;
 export declare const round: (str: string | number, decimals?: number) => number;
+export type DownloadFileOptions = {
+    axios: AxiosInstance;
+};
+export declare const downloadFile: (url: string, filename: string, options: DownloadFileOptions) => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jasperoosthoek/react-toolbox",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "author": "jasperoosthoek",
   "license": "MIT",
   "repository": {
@@ -55,7 +55,7 @@
     "bootstrap": "^5.1.3",
     "moment": "^2.29.4",
     "react": "^19.0.0",
-    "react-bootstrap": "^2.7.4",
+    "react-bootstrap": "^2.10.9",
     "react-dnd": "^16.0.1",
     "react-dom": "^19.0.0",
     "react-icons": "^5.3.0",

package/src/components/tables/SearchBox.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent } from 'react';
+import React, { ChangeEvent, ReactNode } from 'react';
 import { InputGroup, Form, FormControlProps } from 'react-bootstrap';
 
 import { useLocalization } from '../../localization/LocalizationContext';
@@ -10,29 +10,47 @@ export type SearchBoxProps = {
   onChange: (value: string) => void;
   onClear?: () => void;
   onSearch?: () => void;
+  label?: ReactNode | string | number;
+  placeholder?: string | false;
 }
-export const SearchBox = ({ className='', value, onChange, onClear, onSearch }: SearchBoxProps) => {
+export const SearchBox = ({
+  className='',
+  value,
+  onChange,
+  onClear,
+  onSearch,
+  label,
+  placeholder, 
+}: SearchBoxProps) => {
   const { strings } = useLocalization();
 
-  return (<>
-    <InputGroup {...className ? { className } : {}}>
-      <Form.Control
-        value={value}
-        placeholder={strings.getString('search')}
-        onChange={(e: ChangeEvent<HTMLInputElement>) => onChange(e.target.value)}
-      />
-      {onClear &&
-        <UnCheckButton
-          variant="outline-secondary"
-          onClick={() => onClear()}
+  return (
+    <Form.Group>
+      {label && <Form.Label>{label}</Form.Label>}
+      
+      <InputGroup {...className ? { className } : {}}>
+        <Form.Control
+          value={value}
+          placeholder={
+            placeholder
+              ? placeholder
+              : placeholder !== false && strings.getString('search')
+          }
+          onChange={(e: ChangeEvent<HTMLInputElement>) => onChange(e.target.value)}
         />
-      }
-      {onSearch &&
-        <SearchButton
-          variant="outline-secondary"
-          onClick={() => onSearch()}
-        />
-      }
-    </InputGroup></>
+        {onClear &&
+          <UnCheckButton
+            variant="outline-secondary"
+            onClick={() => onClear()}
+          />
+        }
+        {onSearch &&
+          <SearchButton
+            variant="outline-secondary"
+            onClick={() => onSearch()}
+          />
+        }
+      </InputGroup>
+    </Form.Group>
   )
 }

package/src/utils/utils.ts

@@ -1,3 +1,4 @@
+import axios, { AxiosInstance } from 'axios';
 
 export const isEmpty = (value: unknown) =>
   value === undefined
@@ -40,3 +41,26 @@ export const arrayToObject = <T extends any[]>(array: T, byKey: string) => Objec
 
 export const roundFixed = (str: string | number, decimals?: number) => parseFloat(`${str}`).toFixed(decimals || 0);
 export const round = (str: string | number, decimals?: number) => parseFloat(parseFloat(`${str}`).toFixed(decimals || 0));
+
+export type DownloadFileOptions = {
+  axios: AxiosInstance;
+}
+export const downloadFile = (url: string, filename: string, options: DownloadFileOptions) => (
+  // https://gist.github.com/javilobo8/097c30a233786be52070986d8cdb1743
+  
+  (options.axios || axios.create())({
+    url,
+    method: 'GET',
+    responseType: 'blob',
+  }).then((response) => {
+    const url = window.URL.createObjectURL(new Blob([response.data]));
+    const link = document.createElement('a');
+    link.href = url;
+    link.setAttribute(
+      'download',
+      filename,
+    );
+    document.body.appendChild(link);
+    link.click();
+  })
+);