@jobber/components 4.0.2 → 4.1.1

package/dist/Gallery/index.js

@@ -2,31 +2,30 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
 var React = require('react');
 var classnames = require('classnames');
 var styleInject_es = require('../style-inject.es-dcee06b6.js');
-var LightBox = require('../LightBox-1ad62669.js');
-var FormatFile = require('../FormatFile-18e8a54a.js');
-var Button = require('../Button-cd30df0f.js');
+var LightBox = require('../LightBox-dd1afa97.js');
+var FormatFile = require('../FormatFile-3512f838.js');
+var Button = require('../Button-16e043ec.js');
 require('framer-motion');
 require('react-dom');
 require('lodash/debounce');
 require('@jobber/hooks');
-require('../ButtonDismiss-a9590195.js');
+require('../ButtonDismiss-3fb1eaf9.js');
 require('filesize');
-require('../ConfirmationModal-e95f46d7.js');
-require('../Modal-cc3bd7bf.js');
-require('../Heading-a9a66964.js');
-require('../Typography-fbe0ed6e.js');
-require('../Content-18de5fbb.js');
-require('../Markdown-b53e0308.js');
+require('../ConfirmationModal-6a7beee2.js');
+require('../Modal-757e83fd.js');
+require('../Heading-7b203f7f.js');
+require('../Typography-9262511f.js');
+require('../Content-05df8f7f.js');
+require('../Markdown-be2dcd0c.js');
 require('react-markdown');
-require('../Text-e012fb46.js');
-require('../Emphasis-75a3f411.js');
-require('../Icon-d5ad1a6d.js');
+require('../Text-7ce00adb.js');
+require('../Emphasis-23dc2a0a.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../ProgressBar-e9a49129.js');
+require('../ProgressBar-f028b159.js');
 require('react-router-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -38,22 +37,21 @@ var css = ".oLHYkzv718LqMvtqFZFcZ,\n._2JSG0uYj1HSXFads63nptQ {\n  display: -ms-f
 var styles = {"gallery":"oLHYkzv718LqMvtqFZFcZ","galleryLarge":"_2JSG0uYj1HSXFads63nptQ","showMoreButton":"_3LkQj1p9wvHbrfXfz2nUYp","baseShowMoreButton":"FG8mZ6UcMPRsMC9HQinY2","largeShowMoreButton":"_1cTzKosWc22qxWZSiI0CzZ"};
 styleInject_es.styleInject(css);
 
-function Gallery(_a) {
-    var files = _a.files, _b = _a.size, size = _b === void 0 ? "base" : _b, max = _a.max, onDelete = _a.onDelete;
-    var _c = generateImagesArray(files), images = _c.images, filesToImageIndex = _c.filesToImageIndex;
-    var _d = tslib_es6.__read(React.useState(false), 2), lightboxOpen = _d[0], setLightboxOpen = _d[1];
-    var _e = tslib_es6.__read(React.useState(0), 2), lightboxIndex = _e[0], setLightboxIndex = _e[1];
-    var _f = tslib_es6.__read(React.useState(max ? false : true), 2), displayPastMax = _f[0], setDisplayPastMax = _f[1];
-    var visibleFiles = displayPastMax ? files : files.slice(0, max);
+function Gallery({ files, size = "base", max, onDelete }) {
+    const { images, filesToImageIndex } = generateImagesArray(files);
+    const [lightboxOpen, setLightboxOpen] = React.useState(false);
+    const [lightboxIndex, setLightboxIndex] = React.useState(0);
+    const [displayPastMax, setDisplayPastMax] = React.useState(max ? false : true);
+    const visibleFiles = displayPastMax ? files : files.slice(0, max);
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement("div", { className: size === "large" ? styles.galleryLarge : styles.gallery },
-            visibleFiles.map(function (file, index) {
-                return (React__default["default"].createElement(FormatFile.FormatFile, { key: file.key, file: tslib_es6.__assign(tslib_es6.__assign({}, file), { src: function () { return Promise.resolve(file.src); } }), display: "compact", displaySize: size, onClick: function () {
+            visibleFiles.map((file, index) => {
+                return (React__default["default"].createElement(FormatFile.FormatFile, { key: file.key, file: Object.assign(Object.assign({}, file), { src: () => Promise.resolve(file.src) }), display: "compact", displaySize: size, onClick: () => {
                         handleThumbnailClicked(index);
-                    }, onDelete: onDelete ? function () { return onDelete === null || onDelete === void 0 ? void 0 : onDelete(file); } : undefined }));
+                    }, onDelete: onDelete ? () => onDelete === null || onDelete === void 0 ? void 0 : onDelete(file) : undefined }));
             }),
-            max && files.length > max && !displayPastMax && (React__default["default"].createElement("div", { className: classnames__default["default"](styles.showMoreButton, styles[size + "ShowMoreButton"]) },
-                React__default["default"].createElement(Button.Button, { type: "tertiary", size: size, label: "+ " + (files.length - max), fullWidth: true, onClick: function () {
+            max && files.length > max && !displayPastMax && (React__default["default"].createElement("div", { className: classnames__default["default"](styles.showMoreButton, styles[`${size}ShowMoreButton`]) },
+                React__default["default"].createElement(Button.Button, { type: "tertiary", size: size, label: `+ ${files.length - max}`, fullWidth: true, onClick: () => {
                         setDisplayPastMax(true);
                     } })))),
         React__default["default"].createElement(LightBox.LightBox, { open: lightboxOpen, images: images, imageIndex: lightboxIndex, onRequestClose: handleLightboxClose })));
@@ -66,7 +64,7 @@ function Gallery(_a) {
         }
     }
     function handleLightboxOpen(index) {
-        var fileToImageIndex = filesToImageIndex[index];
+        const fileToImageIndex = filesToImageIndex[index];
         if (fileToImageIndex !== undefined) {
             setLightboxIndex(fileToImageIndex);
             setLightboxOpen(true);
@@ -77,10 +75,10 @@ function Gallery(_a) {
     }
 }
 function generateImagesArray(files) {
-    var images = [];
-    var filesToImageIndex = [];
-    var imageIndex = 0;
-    for (var i = 0; i < files.length; i++) {
+    const images = [];
+    const filesToImageIndex = [];
+    let imageIndex = 0;
+    for (let i = 0; i < files.length; i++) {
         if (files[i].type.startsWith("image/")) {
             images.push({ title: files[i].name, url: files[i].src });
             filesToImageIndex.push(imageIndex);
@@ -90,7 +88,7 @@ function generateImagesArray(files) {
             filesToImageIndex.push(undefined);
         }
     }
-    return { images: images, filesToImageIndex: filesToImageIndex };
+    return { images, filesToImageIndex };
 }
 
 exports.Gallery = Gallery;

package/dist/Heading/index.js

@@ -2,10 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Heading = require('../Heading-a9a66964.js');
-require('../tslib.es6-5b50eb8e.js');
+var Heading = require('../Heading-7b203f7f.js');
 require('react');
-require('../Typography-fbe0ed6e.js');
+require('../Typography-9262511f.js');
 require('classnames');
 require('../style-inject.es-dcee06b6.js');
 

package/dist/{Heading-a9a66964.js → Heading-7b203f7f.js}

@@ -1,16 +1,14 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
 var React = require('react');
-var Typography = require('./Typography-fbe0ed6e.js');
+var Typography = require('./Typography-9262511f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function Heading(_a) {
-    var _b = _a.level, level = _b === void 0 ? 5 : _b, children = _a.children;
-    var levelMap = {
+function Heading({ level = 5, children }) {
+    const levelMap = {
         1: {
             element: "h1",
             size: "jumbo",
@@ -49,7 +47,7 @@ function Heading(_a) {
             textColor: "heading",
         },
     };
-    return React__default["default"].createElement(Typography.Typography, tslib_es6.__assign({}, levelMap[level]), children);
+    return React__default["default"].createElement(Typography.Typography, Object.assign({}, levelMap[level]), children);
 }
 
 exports.Heading = Heading;

package/dist/Icon/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Icon = require('../Icon-d5ad1a6d.js');
+var Icon = require('../Icon-405a216c.js');
 require('react');
 require('@jobber/design');
 

package/dist/{Icon-d5ad1a6d.js → Icon-405a216c.js}

@@ -7,19 +7,18 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function Icon(_a) {
-    var name = _a.name, color = _a.color, customColor = _a.customColor, _b = _a.size, size = _b === void 0 ? "base" : _b;
-    var icon;
-    var _c = design.getIcon({
-        name: name,
+function Icon({ name, color, customColor, size = "base" }) {
+    let icon;
+    const { svgClassNames, pathClassNames, paths, viewBox } = design.getIcon({
+        name,
         color: getIconColor(name, color),
-        size: size,
-    }), svgClassNames = _c.svgClassNames, pathClassNames = _c.pathClassNames, paths = _c.paths, viewBox = _c.viewBox;
+        size,
+    });
     if (name === "truck") {
         icon = getTruck(pathClassNames, customColor);
     }
     else {
-        icon = paths.map(function (path) { return (React__default["default"].createElement("path", { key: path, className: pathClassNames, d: path, fill: customColor })); });
+        icon = paths.map((path) => (React__default["default"].createElement("path", { key: path, className: pathClassNames, d: path, fill: customColor })));
     }
     return (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox, className: svgClassNames, "data-testid": name }, icon));
 }

package/dist/InlineLabel/InlineLabel.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from "react";
-export declare type InlineLabelColors = "greyBlue" | "red" | "orange" | "green" | "blue" | "yellow" | "lime" | "purple" | "pink" | "teal" | "yellowGreen" | "blueDark" | "lightBlue" | "indigo";
+export type InlineLabelColors = "greyBlue" | "red" | "orange" | "green" | "blue" | "yellow" | "lime" | "purple" | "pink" | "teal" | "yellowGreen" | "blueDark" | "lightBlue" | "indigo";
 interface InlineLabelProps {
     /**
      * The size of the label

package/dist/InlineLabel/index.js

@@ -5,8 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var classnames = require('classnames');
 var styleInject_es = require('../style-inject.es-dcee06b6.js');
-var Typography = require('../Typography-fbe0ed6e.js');
-require('../tslib.es6-5b50eb8e.js');
+var Typography = require('../Typography-9262511f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -17,10 +16,9 @@ var css = "._2CX7X_wH5lb0fioNTuYTB3 {\n  display: -ms-inline-flexbox;\n  display
 var styles = {"inlineLabel":"_2CX7X_wH5lb0fioNTuYTB3","base":"hIEzl9j3x8azFGCx53-RF","large":"_2FEAdHSbQ1julTQlXKcU9G","larger":"y2IZqgoDbEVd68JUw74_V","greyBlue":"_3ayhjHoV55pJnCyceIIodY","red":"_1NRX5K08cyefHFTjmEY7JC","orange":"_2WqpAFlUhWh2Wycr-r2uMn","green":"EM3QGMlc1v7pjfVBR2j82","blue":"LuBWHY5BJNh4RnEPozKgA","navy":"_36P3W4wMGeF6ObMYI87q2b","yellow":"z7yJ1rNuOTksBtZ0cr3ys","lime":"_2jRJWXkl2av1GzSTdc4GS","purple":"_2DSYzUVBgtIaB1xsMr7rVj","pink":"_27cvq6AfdeOP6SUuX5Ex_T","teal":"eImPpTsVAb13A3dFkEkBc","yellowGreen":"_1AcWxzfWcjE71_gRrEo-J_","blueDark":"J21zEr7ZIvGwt6R5-MZQ7","lightBlue":"_27HNFihCeydE5HUcbCskQ4","indigo":"_3_dDXhHTqG9pa_au-60pWR"};
 styleInject_es.styleInject(css);
 
-function InlineLabel(_a) {
-    var _b = _a.size, size = _b === void 0 ? "base" : _b, _c = _a.color, color = _c === void 0 ? "greyBlue" : _c, children = _a.children;
-    var className = classnames__default["default"](styles.inlineLabel, styles[size], styles[color]);
-    var sizeMapper = {
+function InlineLabel({ size = "base", color = "greyBlue", children, }) {
+    const className = classnames__default["default"](styles.inlineLabel, styles[size], styles[color]);
+    const sizeMapper = {
         base: "small",
         large: "large",
         larger: "large",

package/dist/InputAvatar/index.js

@@ -2,22 +2,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
+var tslib_es6 = require('../tslib.es6-efe27175.js');
 var React = require('react');
 var styleInject_es = require('../style-inject.es-dcee06b6.js');
-var Avatar = require('../Avatar-cfd04e86.js');
-var InputFile = require('../InputFile-e108a7f8.js');
-var ProgressBar = require('../ProgressBar-e9a49129.js');
-var Button = require('../Button-cd30df0f.js');
+var Avatar = require('../Avatar-89cfd0a6.js');
+var InputFile = require('../InputFile-5e0ed2b5.js');
+var ProgressBar = require('../ProgressBar-f028b159.js');
+var Button = require('../Button-16e043ec.js');
 require('classnames');
 require('color');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
 require('react-dropzone');
 require('axios');
 require('uuid');
-require('../Content-18de5fbb.js');
-require('../Typography-fbe0ed6e.js');
+require('../Content-05df8f7f.js');
+require('../Typography-9262511f.js');
 require('react-router-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -29,11 +29,11 @@ var styles = {"inputAvatar":"_1e1D2becaB2vzZJ8QkTQFY","preview":"TQgDlkCH4_o4LkH
 styleInject_es.styleInject(css);
 
 function InputAvatar(_a) {
-    var getUploadParams = _a.getUploadParams, onUploadComplete = _a.onUploadComplete, onChange = _a.onChange, avatarProps = tslib_es6.__rest(_a, ["getUploadParams", "onUploadComplete", "onChange"]);
-    var _b = tslib_es6.__read(React.useState(1), 2), progress = _b[0], setProgress = _b[1];
+    var { getUploadParams, onUploadComplete, onChange } = _a, avatarProps = tslib_es6.__rest(_a, ["getUploadParams", "onUploadComplete", "onChange"]);
+    const [progress, setProgress] = React.useState(1);
     return (React__default["default"].createElement("div", { className: styles.inputAvatar },
         React__default["default"].createElement("div", { className: styles.preview },
-            React__default["default"].createElement(Avatar.Avatar, tslib_es6.__assign({ size: "large" }, avatarProps)),
+            React__default["default"].createElement(Avatar.Avatar, Object.assign({ size: "large" }, avatarProps)),
             progress < 1 && (React__default["default"].createElement(Overlay, null,
                 React__default["default"].createElement(Centered, null,
                     React__default["default"].createElement(ProgressBar.ProgressBar, { size: "small", currentStep: progress * 100, totalSteps: 100 }))))),
@@ -48,11 +48,8 @@ function InputAvatar(_a) {
         handleUpload(newFile);
     }
     function handleUpload(newFile) {
-        return tslib_es6.__awaiter(this, void 0, void 0, function () {
-            return tslib_es6.__generator(this, function (_a) {
-                setProgress(newFile.progress);
-                return [2 /*return*/];
-            });
+        return tslib_es6.__awaiter(this, void 0, void 0, function* () {
+            setProgress(newFile.progress);
         });
     }
     function clearAvatar() {
@@ -60,12 +57,10 @@ function InputAvatar(_a) {
         setProgress(1);
     }
 }
-function Overlay(_a) {
-    var children = _a.children;
+function Overlay({ children }) {
     return React__default["default"].createElement("div", { className: styles.overlay }, children);
 }
-function Centered(_a) {
-    var children = _a.children;
+function Centered({ children }) {
     // Note: this HIGHLY experimental Centered component is applying margin.
     return React__default["default"].createElement("div", { className: styles.centered }, children);
 }

package/dist/InputDate/index.js

@@ -2,24 +2,24 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
 var lodash = require('lodash');
 var React = require('react');
-var FormField = require('../FormField-ac310b6f.js');
-var DatePicker = require('../DatePicker-7c67e8d2.js');
+var FormField = require('../FormField-79a0a375.js');
+var DatePicker = require('../DatePicker-0696b0f0.js');
+require('../tslib.es6-efe27175.js');
 require('uuid');
 require('react-hook-form');
 require('../style-inject.es-dcee06b6.js');
 require('classnames');
-require('../Button-cd30df0f.js');
+require('../Button-16e043ec.js');
 require('react-router-dom');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Typography-fbe0ed6e.js');
-require('../Text-e012fb46.js');
-require('../InputValidation-06a8a7ba.js');
+require('../Typography-9262511f.js');
+require('../Text-7ce00adb.js');
+require('../InputValidation-97dd0dcf.js');
 require('framer-motion');
-require('../Spinner-e4e9c8eb.js');
+require('../Spinner-ae4c8a85.js');
 require('react-datepicker');
 require('@jobber/hooks');
 
@@ -28,17 +28,17 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 function InputDate(inputProps) {
-    return (React__default["default"].createElement(DatePicker.DatePicker, { selected: inputProps.value, onChange: inputProps.onChange, disabled: inputProps.disabled, readonly: inputProps.readonly, fullWidth: !inputProps.inline, minDate: inputProps.minDate, maxDate: inputProps.maxDate, smartAutofocus: false, activator: function (activatorProps) {
-            var onChange = activatorProps.onChange, onClick = activatorProps.onClick, value = activatorProps.value;
-            var newActivatorProps = lodash.omit(activatorProps, ["activator"]);
-            var suffix = tslib_es6.__assign({ icon: "calendar" }, (onClick && {
+    return (React__default["default"].createElement(DatePicker.DatePicker, { selected: inputProps.value, onChange: inputProps.onChange, disabled: inputProps.disabled, readonly: inputProps.readonly, fullWidth: !inputProps.inline, minDate: inputProps.minDate, maxDate: inputProps.maxDate, smartAutofocus: false, activator: activatorProps => {
+            const { onChange, onClick, value } = activatorProps;
+            const newActivatorProps = lodash.omit(activatorProps, ["activator"]);
+            const suffix = Object.assign({ icon: "calendar" }, (onClick && {
                 onClick: onClick,
                 ariaLabel: "Show calendar",
             }));
-            return (React__default["default"].createElement(FormField.FormField, tslib_es6.__assign({}, newActivatorProps, inputProps, { value: value, onChange: function (_, event) { return onChange && onChange(event); }, onBlur: function () {
+            return (React__default["default"].createElement(FormField.FormField, Object.assign({}, newActivatorProps, inputProps, { value: value, onChange: (_, event) => onChange && onChange(event), onBlur: () => {
                     inputProps.onBlur && inputProps.onBlur();
                     activatorProps.onBlur && activatorProps.onBlur();
-                }, onFocus: function () {
+                }, onFocus: () => {
                     inputProps.onFocus && inputProps.onFocus();
                     activatorProps.onFocus && activatorProps.onFocus();
                 }, suffix: suffix })));

package/dist/InputEmail/InputEmail.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { CommonFormFieldProps, FormFieldProps } from "../FormField";
-declare type InputEmailProps = CommonFormFieldProps & Pick<FormFieldProps, "maxLength" | "readonly" | "validations" | "defaultValue">;
+type InputEmailProps = CommonFormFieldProps & Pick<FormFieldProps, "maxLength" | "readonly" | "validations" | "defaultValue">;
 export declare const validationMessage = "Please enter a valid email";
 export declare function InputEmail(props: InputEmailProps): JSX.Element;
 export {};

package/dist/InputEmail/index.js

@@ -2,33 +2,33 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
 var React = require('react');
-var FormField = require('../FormField-ac310b6f.js');
+var FormField = require('../FormField-79a0a375.js');
+require('../tslib.es6-efe27175.js');
 require('uuid');
 require('react-hook-form');
 require('../style-inject.es-dcee06b6.js');
 require('classnames');
-require('../Button-cd30df0f.js');
+require('../Button-16e043ec.js');
 require('react-router-dom');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Typography-fbe0ed6e.js');
-require('../Text-e012fb46.js');
-require('../InputValidation-06a8a7ba.js');
+require('../Typography-9262511f.js');
+require('../Text-7ce00adb.js');
+require('../InputValidation-97dd0dcf.js');
 require('framer-motion');
-require('../Spinner-e4e9c8eb.js');
+require('../Spinner-ae4c8a85.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var validationMessage = "Please enter a valid email";
+const validationMessage = "Please enter a valid email";
 function InputEmail(props) {
-    var validations = props.validations;
-    return (React__default["default"].createElement(FormField.FormField, tslib_es6.__assign({}, props, { type: "email", validations: tslib_es6.__assign(tslib_es6.__assign({}, validations), { validate: checkForValidEmail }) })));
+    const { validations } = props;
+    return (React__default["default"].createElement(FormField.FormField, Object.assign({}, props, { type: "email", validations: Object.assign(Object.assign({}, validations), { validate: checkForValidEmail }) })));
     function checkForValidEmail(value) {
-        var emailRegex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        const emailRegex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
         if (!value) {
             return true;
         }

package/dist/InputFile/index.js

@@ -2,20 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var InputFile = require('../InputFile-e108a7f8.js');
-require('../tslib.es6-5b50eb8e.js');
+var InputFile = require('../InputFile-5e0ed2b5.js');
+require('../tslib.es6-efe27175.js');
 require('react');
 require('classnames');
 require('react-dropzone');
 require('axios');
 require('uuid');
 require('../style-inject.es-dcee06b6.js');
-require('../Button-cd30df0f.js');
+require('../Button-16e043ec.js');
 require('react-router-dom');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Typography-fbe0ed6e.js');
-require('../Content-18de5fbb.js');
+require('../Typography-9262511f.js');
+require('../Content-05df8f7f.js');
 
 
 

package/dist/{InputFile-e108a7f8.js → InputFile-5e0ed2b5.js}

@@ -1,15 +1,15 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
+var tslib_es6 = require('./tslib.es6-efe27175.js');
 var React = require('react');
 var classnames = require('classnames');
 var reactDropzone = require('react-dropzone');
 var axios = require('axios');
 var uuid = require('uuid');
 var styleInject_es = require('./style-inject.es-dcee06b6.js');
-var Button = require('./Button-cd30df0f.js');
-var Content = require('./Content-18de5fbb.js');
-var Typography = require('./Typography-fbe0ed6e.js');
+var Button = require('./Button-16e043ec.js');
+var Content = require('./Content-05df8f7f.js');
+var Typography = require('./Typography-9262511f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -21,10 +21,8 @@ var css = "._2CgKZHQp30gXtQyW8h2Ex_ {\n  font-size: 0;\n  line-height: 0;\n  -we
 var styles = {"dropZoneBase":"_2CgKZHQp30gXtQyW8h2Ex_","dropZone":"_3nre5MPe67v_oDs44x2IDC","active":"_1wLTm5Es7oqZzzwFiOySeN"};
 styleInject_es.styleInject(css);
 
-function InputFile(_a) {
-    var _b;
-    var _c = _a.variation, variation = _c === void 0 ? "dropzone" : _c, _d = _a.size, size = _d === void 0 ? "base" : _d, providedButtonLabel = _a.buttonLabel, _e = _a.allowMultiple, allowMultiple = _e === void 0 ? false : _e, _f = _a.allowedTypes, allowedTypes = _f === void 0 ? "all" : _f, getUploadParams = _a.getUploadParams, onUploadStart = _a.onUploadStart, onUploadProgress = _a.onUploadProgress, onUploadComplete = _a.onUploadComplete;
-    var options = {
+function InputFile({ variation = "dropzone", size = "base", buttonLabel: providedButtonLabel, allowMultiple = false, allowedTypes = "all", getUploadParams, onUploadStart, onUploadProgress, onUploadComplete, }) {
+    const options = {
         multiple: allowMultiple,
         onDrop: React.useCallback(handleDrop, []),
     };
@@ -34,66 +32,54 @@ function InputFile(_a) {
     else if (allowedTypes === "basicImages") {
         options.accept = "image/png, image/jpg, image/jpeg";
     }
-    var _g = reactDropzone.useDropzone(options), getRootProps = _g.getRootProps, getInputProps = _g.getInputProps, isDragActive = _g.isDragActive;
-    var _h = getLabels(providedButtonLabel, allowMultiple, allowedTypes), buttonLabel = _h.buttonLabel, hintText = _h.hintText;
-    var dropZone = classnames__default["default"](styles.dropZoneBase, (_b = {},
-        _b[styles.dropZone] = variation === "dropzone",
-        _b[styles.active] = isDragActive,
-        _b));
-    return (React__default["default"].createElement("div", tslib_es6.__assign({}, getRootProps({ className: dropZone }), { tabIndex: variation === "button" ? -1 : 0 }),
-        React__default["default"].createElement("input", tslib_es6.__assign({}, getInputProps())),
+    const { getRootProps, getInputProps, isDragActive } = reactDropzone.useDropzone(options);
+    const { buttonLabel, hintText } = getLabels(providedButtonLabel, allowMultiple, allowedTypes);
+    const dropZone = classnames__default["default"](styles.dropZoneBase, {
+        [styles.dropZone]: variation === "dropzone",
+        [styles.active]: isDragActive,
+    });
+    return (React__default["default"].createElement("div", Object.assign({}, getRootProps({ className: dropZone }), { tabIndex: variation === "button" ? -1 : 0 }),
+        React__default["default"].createElement("input", Object.assign({}, getInputProps())),
         variation === "dropzone" && (React__default["default"].createElement(Content.Content, { spacing: "small" },
             React__default["default"].createElement(Button.Button, { label: buttonLabel, size: "small", type: "secondary" }),
             size === "base" && (React__default["default"].createElement(Typography.Typography, { size: "small", textColor: "textSecondary" }, hintText)))),
         variation === "button" && (React__default["default"].createElement(Button.Button, { label: buttonLabel, size: size, type: "secondary", fullWidth: true }))));
     function handleDrop(acceptedFiles) {
-        acceptedFiles.forEach(function (file) {
+        acceptedFiles.forEach(file => {
             uploadFile(file);
         });
     }
     function uploadFile(file) {
-        return tslib_es6.__awaiter(this, void 0, void 0, function () {
-            var _a, url, _b, key, _c, fields, _d, httpMethod, fileUpload, handleUploadProgress, handleUploadComplete, axiosConfig;
-            return tslib_es6.__generator(this, function (_e) {
-                switch (_e.label) {
-                    case 0: return [4 /*yield*/, getUploadParams(file)];
-                    case 1:
-                        _a = _e.sent(), url = _a.url, _b = _a.key, key = _b === void 0 ? uuid.v1() : _b, _c = _a.fields, fields = _c === void 0 ? {} : _c, _d = _a.httpMethod, httpMethod = _d === void 0 ? "POST" : _d;
-                        fileUpload = getFileUpload(file, key);
-                        onUploadStart && onUploadStart(tslib_es6.__assign({}, fileUpload));
-                        handleUploadProgress = function (progressEvent) {
-                            onUploadProgress &&
-                                onUploadProgress(tslib_es6.__assign(tslib_es6.__assign({}, fileUpload), { progress: progressEvent.loaded / progressEvent.total }));
-                        };
-                        handleUploadComplete = function () {
-                            onUploadComplete === null || onUploadComplete === void 0 ? void 0 : onUploadComplete(tslib_es6.__assign(tslib_es6.__assign({}, fileUpload), { progress: 1 }));
-                        };
-                        axiosConfig = createAxiosConfig({
-                            url: url,
-                            httpMethod: httpMethod,
-                            fields: fields,
-                            file: file,
-                            handleUploadProgress: handleUploadProgress,
-                        });
-                        axios__default["default"].request(axiosConfig).then(handleUploadComplete);
-                        return [2 /*return*/];
-                }
+        return tslib_es6.__awaiter(this, void 0, void 0, function* () {
+            const { url, key = uuid.v1(), fields = {}, httpMethod = "POST", } = yield getUploadParams(file);
+            const fileUpload = getFileUpload(file, key);
+            onUploadStart && onUploadStart(Object.assign({}, fileUpload));
+            const handleUploadProgress = (progressEvent) => {
+                onUploadProgress &&
+                    onUploadProgress(Object.assign(Object.assign({}, fileUpload), { progress: progressEvent.loaded / progressEvent.total }));
+            };
+            const handleUploadComplete = () => {
+                onUploadComplete === null || onUploadComplete === void 0 ? void 0 : onUploadComplete(Object.assign(Object.assign({}, fileUpload), { progress: 1 }));
+            };
+            const axiosConfig = createAxiosConfig({
+                url,
+                httpMethod,
+                fields,
+                file,
+                handleUploadProgress,
             });
+            axios__default["default"].request(axiosConfig).then(handleUploadComplete);
         });
     }
 }
-function createAxiosConfig(_a) {
-    var url = _a.url, _b = _a.httpMethod, httpMethod = _b === void 0 ? "POST" : _b, _c = _a.fields, fields = _c === void 0 ? {} : _c, file = _a.file, handleUploadProgress = _a.handleUploadProgress;
-    var data;
-    var headers;
+function createAxiosConfig({ url, httpMethod = "POST", fields = {}, file, handleUploadProgress, }) {
+    let data;
+    let headers;
     if (httpMethod === "POST") {
-        var formData_1 = new FormData();
-        Object.entries(fields).forEach(function (_a) {
-            var _b = tslib_es6.__read(_a, 2), field = _b[0], value = _b[1];
-            return formData_1.append(field, value);
-        });
-        formData_1.append("file", file);
-        data = formData_1;
+        const formData = new FormData();
+        Object.entries(fields).forEach(([field, value]) => formData.append(field, value));
+        formData.append("file", file);
+        data = formData;
         headers = { "X-Requested-With": "XMLHttpRequest" };
     }
     else {
@@ -109,8 +95,8 @@ function createAxiosConfig(_a) {
     };
 }
 function getLabels(providedButtonLabel, multiple, allowedTypes) {
-    var buttonLabel = multiple ? "Upload Files" : "Upload File";
-    var hintText = multiple
+    let buttonLabel = multiple ? "Upload Files" : "Upload File";
+    let hintText = multiple
         ? "or drag files here to upload"
         : "or drag a file here to upload";
     if (allowedTypes === "images" || allowedTypes === "basicImages") {
@@ -121,7 +107,7 @@ function getLabels(providedButtonLabel, multiple, allowedTypes) {
     }
     if (providedButtonLabel)
         buttonLabel = providedButtonLabel;
-    return { buttonLabel: buttonLabel, hintText: hintText };
+    return { buttonLabel, hintText };
 }
 function getFileUpload(file, key) {
     return {
@@ -133,9 +119,9 @@ function getFileUpload(file, key) {
         src: getSrc,
     };
     function getSrc() {
-        var promise = new Promise(function (resolve, reject) {
-            var reader = new FileReader();
-            reader.onload = function (event) {
+        const promise = new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = event => {
                 if (event.target &&
                     event.target.result &&
                     typeof event.target.result === "string") {
@@ -159,8 +145,8 @@ function getFileUpload(file, key) {
  * @returns FileUpload[] updated set of files.
  */
 function updateFiles(updatedFile, files) {
-    var newFiles = tslib_es6.__spread(files);
-    var index = files.findIndex(function (file) { return file.key === updatedFile.key; });
+    const newFiles = [...files];
+    const index = files.findIndex(file => file.key === updatedFile.key);
     if (index !== -1) {
         newFiles[index] = updatedFile;
     }