@jobber/components 4.0.0 → 4.0.1-pre.4

package/dist/InputValidation/index.js

@@ -2,15 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var InputValidation = require('../InputValidation-06a8a7ba.js');
+var InputValidation = require('../InputValidation-97dd0dcf.js');
 require('react');
 require('framer-motion');
 require('../style-inject.es-dcee06b6.js');
-require('../Text-e012fb46.js');
-require('../Typography-fbe0ed6e.js');
-require('../tslib.es6-5b50eb8e.js');
+require('../Text-7ce00adb.js');
+require('../Typography-9262511f.js');
 require('classnames');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
 
 

package/dist/{InputValidation-06a8a7ba.js → InputValidation-97dd0dcf.js}

@@ -3,8 +3,8 @@
 var React = require('react');
 var framerMotion = require('framer-motion');
 var styleInject_es = require('./style-inject.es-dcee06b6.js');
-var Text = require('./Text-e012fb46.js');
-var Icon = require('./Icon-d5ad1a6d.js');
+var Text = require('./Text-7ce00adb.js');
+var Icon = require('./Icon-405a216c.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -14,17 +14,16 @@ var css = "._9gFxrZogiKbS3gPLv_I79 {\n  margin-top: var(--space-smaller);\n}\n\n
 var styles = {"hasValidationMessage":"_9gFxrZogiKbS3gPLv_I79","message":"_3QUt88pIWZatkYLVYFlRuL"};
 styleInject_es.styleInject(css);
 
-function InputValidation(_a) {
-    var message = _a.message;
-    var messages = [message];
-    var variants = {
+function InputValidation({ message }) {
+    const messages = [message];
+    const variants = {
         slideOut: { y: "5%", opacity: 0 },
         slideIn: { y: 0, opacity: 1 },
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null, messages && messages.length > 0 && (React__default["default"].createElement(framerMotion.AnimatePresence, { exitBeforeEnter: true }, messages.map(function (msg) { return (React__default["default"].createElement(framerMotion.motion.div, { key: "validation-" + msg, variants: variants, initial: "slideOut", animate: "slideIn", exit: "slideOut", transition: { duration: 0.2 } },
+    return (React__default["default"].createElement(React__default["default"].Fragment, null, messages && messages.length > 0 && (React__default["default"].createElement(framerMotion.AnimatePresence, { exitBeforeEnter: true }, messages.map(msg => (React__default["default"].createElement(framerMotion.motion.div, { key: `validation-${msg}`, variants: variants, initial: "slideOut", animate: "slideIn", exit: "slideOut", transition: { duration: 0.2 } },
         React__default["default"].createElement("div", { className: styles.message, "aria-live": "assertive", role: "alert", tabIndex: 0 },
             React__default["default"].createElement(Icon.Icon, { name: "alert", size: "small", color: "critical" }),
-            React__default["default"].createElement(Text.Text, { size: "small", variation: "error" }, msg)))); })))));
+            React__default["default"].createElement(Text.Text, { size: "small", variation: "error" }, msg)))))))));
 }
 
 exports.InputValidation = InputValidation;

package/dist/LightBox/index.js

@@ -2,21 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var LightBox = require('../LightBox-1ad62669.js');
-require('../tslib.es6-5b50eb8e.js');
+var LightBox = require('../LightBox-dd1afa97.js');
 require('react');
 require('framer-motion');
 require('react-dom');
 require('lodash/debounce');
 require('@jobber/hooks');
 require('../style-inject.es-dcee06b6.js');
-require('../ButtonDismiss-a9590195.js');
-require('../Button-cd30df0f.js');
+require('../ButtonDismiss-3fb1eaf9.js');
+require('../Button-16e043ec.js');
 require('classnames');
 require('react-router-dom');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Typography-fbe0ed6e.js');
+require('../Typography-9262511f.js');
 
 
 

package/dist/{LightBox-1ad62669.js → LightBox-dd1afa97.js}

@@ -1,14 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
 var React = require('react');
 var framerMotion = require('framer-motion');
 var ReactDOM = require('react-dom');
 var debounce = require('lodash/debounce');
 var jobberHooks = require('@jobber/hooks');
 var styleInject_es = require('./style-inject.es-dcee06b6.js');
-var ButtonDismiss = require('./ButtonDismiss-a9590195.js');
-var Button = require('./Button-cd30df0f.js');
+var ButtonDismiss = require('./ButtonDismiss-3fb1eaf9.js');
+var Button = require('./Button-16e043ec.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -20,12 +19,13 @@ var css = "._2qgU3ylcPWUJGRthB18cb,\n._27gh3HPkx5J1Ru4Tqp_1tF {\n  display: -ms-
 var styles = {"next":"_2qgU3ylcPWUJGRthB18cb","prev":"_27gh3HPkx5J1Ru4Tqp_1tF","lightboxWrapper":"_3FuSx2b8rfxjzTQKeVn6MW","toolbar":"_2gGRj41uQJhcl0zcSNgsOA","title":"oyIA3-aR1Fvwn0lpp1Mgx","imagesWrapper":"_1PPDSsP7v3FAZG3DA--Oq3","overlay":"_23IH8HE3ZATpurQqLyWj-l","image":"_2UNyNw_u8HDWIzzxcSLUU6"};
 styleInject_es.styleInject(css);
 
-var swipeConfidenceThreshold = 10000;
-var swipePower = function (offset, velocity) {
+/* eslint-disable max-statements */
+const swipeConfidenceThreshold = 10000;
+const swipePower = (offset, velocity) => {
     return Math.abs(offset) * velocity;
 };
-var variants = {
-    enter: function (direction) {
+const variants = {
+    enter: (direction) => {
         return {
             x: direction > 0 ? 1000 : -1000,
             opacity: 0,
@@ -36,7 +36,7 @@ var variants = {
         x: 0,
         opacity: 1,
     },
-    exit: function (direction) {
+    exit: (direction) => {
         return {
             zIndex: 0,
             x: direction < 0 ? 1000 : -1000,
@@ -44,21 +44,20 @@ var variants = {
         };
     },
 };
-var imageTransition = {
+const imageTransition = {
     x: { type: "spring", stiffness: 300, damping: 30 },
     opacity: { duration: 0.2 },
 };
 // A little bit more than the transition's duration
 // We're doing this to prevent a bug from framer-motion
 // https://github.com/framer/motion/issues/1769
-var debounceDuration = 250;
-function LightBox(_a) {
-    var open = _a.open, images = _a.images, _b = _a.imageIndex, imageIndex = _b === void 0 ? 0 : _b, onRequestClose = _a.onRequestClose;
-    var _c = tslib_es6.__read(React.useState(imageIndex), 2), currentImageIndex = _c[0], setCurrentImageIndex = _c[1];
-    var _d = tslib_es6.__read(React.useState(0), 2), direction = _d[0], setDirection = _d[1];
-    var lightboxRef = jobberHooks.useFocusTrap(open);
-    var debouncedHandleNext = debounce__default["default"](handleMoveNext, debounceDuration);
-    var debouncedHandlePrevious = debounce__default["default"](handleMovePrevious, debounceDuration);
+const debounceDuration = 250;
+function LightBox({ open, images, imageIndex = 0, onRequestClose, }) {
+    const [currentImageIndex, setCurrentImageIndex] = React.useState(imageIndex);
+    const [direction, setDirection] = React.useState(0);
+    const lightboxRef = jobberHooks.useFocusTrap(open);
+    const debouncedHandleNext = debounce__default["default"](handleMoveNext, debounceDuration);
+    const debouncedHandlePrevious = debounce__default["default"](handleMovePrevious, debounceDuration);
     jobberHooks.useRefocusOnActivator(open);
     jobberHooks.useOnKeyDown(handleRequestClose, "Escape");
     jobberHooks.useOnKeyDown(debouncedHandlePrevious, {
@@ -67,10 +66,10 @@ function LightBox(_a) {
     jobberHooks.useOnKeyDown(debouncedHandleNext, {
         key: "ArrowRight",
     });
-    React.useEffect(function () {
+    React.useEffect(() => {
         setCurrentImageIndex(imageIndex);
     }, [imageIndex, open]);
-    var template = (React__default["default"].createElement(React__default["default"].Fragment, null, open && (React__default["default"].createElement("div", { className: styles.lightboxWrapper, tabIndex: 0, "aria-label": "Lightbox", key: "Lightbox", ref: lightboxRef },
+    const template = (React__default["default"].createElement(React__default["default"].Fragment, null, open && (React__default["default"].createElement("div", { className: styles.lightboxWrapper, tabIndex: 0, "aria-label": "Lightbox", key: "Lightbox", ref: lightboxRef },
         React__default["default"].createElement("div", { className: styles.toolbar },
             React__default["default"].createElement("span", { className: styles.title }, images[currentImageIndex].title),
             React__default["default"].createElement(ButtonDismiss.ButtonDismiss, { ariaLabel: "Close", onClick: handleRequestClose })),
@@ -94,9 +93,8 @@ function LightBox(_a) {
     function handleRequestClose() {
         onRequestClose({ lastPosition: currentImageIndex });
     }
-    function handleOnDragEnd(event, _a) {
-        var offset = _a.offset, velocity = _a.velocity;
-        var swipe = swipePower(offset.x, velocity.x);
+    function handleOnDragEnd(event, { offset, velocity }) {
+        const swipe = swipePower(offset.x, velocity.x);
         if (swipe < -swipeConfidenceThreshold) {
             handleMoveNext();
         }
@@ -105,13 +103,11 @@ function LightBox(_a) {
         }
     }
 }
-function PreviousButton(_a) {
-    var onClick = _a.onClick;
+function PreviousButton({ onClick }) {
     return (React__default["default"].createElement("div", { className: styles.prev },
         React__default["default"].createElement(Button.Button, { size: "large", variation: "subtle", type: "secondary", icon: "arrowLeft", ariaLabel: "Previous image", onClick: onClick })));
 }
-function NextButton(_a) {
-    var onClick = _a.onClick;
+function NextButton({ onClick }) {
     return (React__default["default"].createElement("div", { className: styles.next },
         React__default["default"].createElement(Button.Button, { size: "large", variation: "subtle", type: "secondary", icon: "arrowRight", ariaLabel: "Next image", onClick: onClick })));
 }

package/dist/List/index.js

@@ -2,20 +2,19 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
 var React = require('react');
 var classnames = require('classnames');
 var lodash = require('lodash');
 var styleInject_es = require('../style-inject.es-dcee06b6.js');
-var Icon = require('../Icon-d5ad1a6d.js');
-var Text = require('../Text-e012fb46.js');
-var Heading = require('../Heading-a9a66964.js');
-var Typography = require('../Typography-fbe0ed6e.js');
-var Markdown = require('../Markdown-b53e0308.js');
-var Emphasis = require('../Emphasis-75a3f411.js');
+var Icon = require('../Icon-405a216c.js');
+var Text = require('../Text-7ce00adb.js');
+var Heading = require('../Heading-7b203f7f.js');
+var Typography = require('../Typography-9262511f.js');
+var Markdown = require('../Markdown-be2dcd0c.js');
+var Emphasis = require('../Emphasis-23dc2a0a.js');
 require('@jobber/design');
 require('react-markdown');
-require('../Content-18de5fbb.js');
+require('../Content-05df8f7f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -34,12 +33,11 @@ var css = "._2iTo0SHtApSj1Pz0jAi44D {\n  display: -ms-flexbox;\n  display: flex;
 var styles = {"action":"_2iTo0SHtApSj1Pz0jAi44D","hoverable":"_3fuo63dN8BYlteQspAWEB","icon":"_2Ba10JIy4V4gV8mql4xqHo","info":"_1vz3KPZUhpnltJyF8wN7V1","amount":"_1vkwx_Vuhn930_zHsgEmz3","isActive":"_2QvWobst7cPMHu3OkCl2SG","truncate":"d36Bq7j0EKz3c5tj7HrWN"};
 styleInject_es.styleInject(css);
 
-function ListItem(_a) {
-    var caption = _a.caption, content = _a.content, icon = _a.icon, iconColor = _a.iconColor, id = _a.id, isActive = _a.isActive, onClick = _a.onClick, title = _a.title, url = _a.url, value = _a.value;
-    var actionClasses = classnames__default["default"](styles.action, isActive && styles.isActive, (onClick || url) && styles.hoverable);
-    var Wrapper = url ? "a" : "button";
-    var buttonProps = tslib_es6.__assign({}, (Wrapper === "button" && { role: "button", type: "button" }));
-    return (React__default["default"].createElement(Wrapper, tslib_es6.__assign({ id: id.toString(), className: actionClasses, href: url, onClick: onClick }, buttonProps),
+function ListItem({ caption, content, icon, iconColor, id, isActive, onClick, title, url, value, }) {
+    const actionClasses = classnames__default["default"](styles.action, isActive && styles.isActive, (onClick || url) && styles.hoverable);
+    const Wrapper = url ? "a" : "button";
+    const buttonProps = Object.assign({}, (Wrapper === "button" && { role: "button", type: "button" }));
+    return (React__default["default"].createElement(Wrapper, Object.assign({ id: id.toString(), className: actionClasses, href: url, onClick: onClick }, buttonProps),
         icon && (React__default["default"].createElement("div", { className: styles.icon },
             React__default["default"].createElement(Icon.Icon, { name: icon, color: iconColor }))),
         React__default["default"].createElement("div", { className: styles.info },
@@ -51,12 +49,11 @@ function ListItem(_a) {
             React__default["default"].createElement(Text.Text, null,
                 React__default["default"].createElement(Emphasis.Emphasis, { variation: "bold" }, value))))));
 }
-function Description(_a) {
-    var content = _a.content;
+function Description({ content }) {
     if (content instanceof Array) {
-        return (React__default["default"].createElement(React__default["default"].Fragment, null, content.map(function (item, i) { return (React__default["default"].createElement(Text.Text, { key: i },
+        return (React__default["default"].createElement(React__default["default"].Fragment, null, content.map((item, i) => (React__default["default"].createElement(Text.Text, { key: i },
             React__default["default"].createElement("span", { className: styles.truncate },
-                React__default["default"].createElement(Markdown.Markdown, { content: item, basicUsage: true })))); })));
+                React__default["default"].createElement(Markdown.Markdown, { content: item, basicUsage: true })))))));
     }
     else {
         return (React__default["default"].createElement(Text.Text, null,
@@ -65,9 +62,8 @@ function Description(_a) {
     }
 }
 
-function List(_a) {
-    var items = _a.items;
-    var isSectioned = items.some(function (item) { return item.section; });
+function List({ items }) {
+    const isSectioned = items.some(item => item.section);
     if (isSectioned) {
         return React__default["default"].createElement(SectionedList, { items: items });
     }
@@ -75,20 +71,18 @@ function List(_a) {
         return React__default["default"].createElement(DisplayList, { items: items });
     }
 }
-function DisplayList(_a) {
-    var items = _a.items;
-    return (React__default["default"].createElement("ul", { className: styles$1.list }, items.map(function (item) { return (React__default["default"].createElement("li", { key: item.id, className: styles$1.item },
-        React__default["default"].createElement(ListItem, tslib_es6.__assign({}, item)))); })));
+function DisplayList({ items }) {
+    return (React__default["default"].createElement("ul", { className: styles$1.list }, items.map(item => (React__default["default"].createElement("li", { key: item.id, className: styles$1.item },
+        React__default["default"].createElement(ListItem, Object.assign({}, item)))))));
 }
-function SectionedList(_a) {
-    var items = _a.items;
-    var sectionedItems = lodash.groupBy(items, function (item) { return lodash.get(item, "section", "Other"); });
-    var sectionHeaderClassNames = classnames__default["default"](sectionStyles.sectionHeader);
-    return (React__default["default"].createElement("ul", { className: styles$1.list }, Object.keys(sectionedItems).map(function (sectionName) { return (React__default["default"].createElement("li", { key: sectionName, className: styles$1.section },
+function SectionedList({ items }) {
+    const sectionedItems = lodash.groupBy(items, item => lodash.get(item, "section", "Other"));
+    const sectionHeaderClassNames = classnames__default["default"](sectionStyles.sectionHeader);
+    return (React__default["default"].createElement("ul", { className: styles$1.list }, Object.keys(sectionedItems).map(sectionName => (React__default["default"].createElement("li", { key: sectionName, className: styles$1.section },
         React__default["default"].createElement("div", { className: sectionHeaderClassNames },
             React__default["default"].createElement(Typography.Typography, { element: "h4", fontWeight: "bold", size: "large" }, sectionName)),
-        React__default["default"].createElement("ul", { className: styles$1.list }, sectionedItems[sectionName].map(function (item) { return (React__default["default"].createElement("li", { key: item.id, className: styles$1.item },
-            React__default["default"].createElement(ListItem, tslib_es6.__assign({}, item)))); })))); })));
+        React__default["default"].createElement("ul", { className: styles$1.list }, sectionedItems[sectionName].map(item => (React__default["default"].createElement("li", { key: item.id, className: styles$1.item },
+            React__default["default"].createElement(ListItem, Object.assign({}, item)))))))))));
 }
 
 exports.List = List;

package/dist/Markdown/index.js

@@ -2,17 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Markdown = require('../Markdown-b53e0308.js');
-require('../tslib.es6-5b50eb8e.js');
+var Markdown = require('../Markdown-be2dcd0c.js');
 require('react');
 require('react-markdown');
-require('../Text-e012fb46.js');
-require('../Typography-fbe0ed6e.js');
+require('../Text-7ce00adb.js');
+require('../Typography-9262511f.js');
 require('classnames');
 require('../style-inject.es-dcee06b6.js');
-require('../Emphasis-75a3f411.js');
-require('../Heading-a9a66964.js');
-require('../Content-18de5fbb.js');
+require('../Emphasis-23dc2a0a.js');
+require('../Heading-7b203f7f.js');
+require('../Content-05df8f7f.js');
 
 
 

package/dist/{Markdown-b53e0308.js → Markdown-be2dcd0c.js}

@@ -1,21 +1,19 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
 var React = require('react');
 var ReactMarkdown = require('react-markdown');
-var Text = require('./Text-e012fb46.js');
-var Emphasis = require('./Emphasis-75a3f411.js');
-var Heading = require('./Heading-a9a66964.js');
-var Content = require('./Content-18de5fbb.js');
+var Text = require('./Text-7ce00adb.js');
+var Emphasis = require('./Emphasis-23dc2a0a.js');
+var Heading = require('./Heading-7b203f7f.js');
+var Content = require('./Content-05df8f7f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var ReactMarkdown__default = /*#__PURE__*/_interopDefaultLegacy(ReactMarkdown);
 
-function Markdown(_a) {
-    var content = _a.content, externalLink = _a.externalLink, basicUsage = _a.basicUsage;
-    var props = tslib_es6.__assign({}, (basicUsage && {
+function Markdown({ content, externalLink, basicUsage }) {
+    const props = Object.assign({}, (basicUsage && {
         disallowedElements: [
             "p",
             "h1",
@@ -32,9 +30,9 @@ function Markdown(_a) {
         ],
         unwrapDisallowed: true,
     }));
-    var Tag = basicUsage ? React__default["default"].Fragment : Content.Content;
+    const Tag = basicUsage ? React__default["default"].Fragment : Content.Content;
     return (React__default["default"].createElement(Tag, null,
-        React__default["default"].createElement(ReactMarkdown__default["default"], tslib_es6.__assign({}, props, { linkTarget: externalLink ? "_blank" : undefined, components: {
+        React__default["default"].createElement(ReactMarkdown__default["default"], Object.assign({}, props, { linkTarget: externalLink ? "_blank" : undefined, components: {
                 p: renderParagraph,
                 strong: renderStrong,
                 em: renderEmphasis,
@@ -45,21 +43,17 @@ function Markdown(_a) {
                 h5: renderHeading(5),
             } }), content)));
 }
-function renderParagraph(_a) {
-    var children = _a.children;
+function renderParagraph({ children }) {
     return React__default["default"].createElement(Text.Text, null, children);
 }
-function renderStrong(_a) {
-    var children = _a.children;
+function renderStrong({ children }) {
     return React__default["default"].createElement(Emphasis.Emphasis, { variation: "bold" }, children);
 }
-function renderEmphasis(_a) {
-    var children = _a.children;
+function renderEmphasis({ children }) {
     return React__default["default"].createElement(Emphasis.Emphasis, { variation: "italic" }, children);
 }
 function renderHeading(level) {
-    function buildHeading(_a) {
-        var children = _a.children;
+    function buildHeading({ children }) {
         return React__default["default"].createElement(Heading.Heading, { level: level }, children);
     }
     return buildHeading;

package/dist/Menu/index.js

@@ -2,19 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Menu = require('../Menu-826cfb89.js');
-require('../tslib.es6-5b50eb8e.js');
+var Menu = require('../Menu-d6a7d17b.js');
 require('react');
 require('uuid');
 require('classnames');
 require('framer-motion');
 require('@jobber/hooks');
 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('../Typography-9262511f.js');
 
 
 

package/dist/{Menu-826cfb89.js → Menu-d6a7d17b.js}

@@ -1,15 +1,14 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
 var React = require('react');
 var uuid = require('uuid');
 var classnames = require('classnames');
 var framerMotion = require('framer-motion');
 var jobberHooks = require('@jobber/hooks');
 var styleInject_es = require('./style-inject.es-dcee06b6.js');
-var Button = require('./Button-cd30df0f.js');
-var Typography = require('./Typography-fbe0ed6e.js');
-var Icon = require('./Icon-d5ad1a6d.js');
+var Button = require('./Button-16e043ec.js');
+var Typography = require('./Typography-9262511f.js');
+var Icon = require('./Icon-405a216c.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -20,37 +19,35 @@ var css = "._3dsZe-fIMb0ftQQAJf53tI * {\n  box-sizing: border-box;\n}\n\n._3dsZe
 var styles = {"wrapper":"_3dsZe-fIMb0ftQQAJf53tI","menu":"_15jh7FtEcALDetgrjoV8HG","above":"_2S3J3IQ4JcMgnYjzx3A9AA","below":"qgoF1WJ8Cu39FVc3p_c8w","left":"_2QwnAwwIXZuZReq2cUwEoX","right":"_2Bdz7gjSU8id-Og42er82U","section":"_1j-ztPLXQgH-5XOlXybf0-","sectionHeader":"ecEGgRDm96wrHymIDR1FM","action":"_1lmtkHVgn76IrVsqnqlOYh","icon":"QMbGAf7Vb6_SM8qOIvLMc","overlay":"_1DIimpm0iJewCr_4Ee8NTa","fullWidth":"qVvYE_6U6kPoQ4ms_2slA","screenReaderOnly":"_3Pk5uJMOz91YR7eDwLASEh"};
 styleInject_es.styleInject(css);
 
-var variation = {
+const variation = {
     overlayStartStop: { opacity: 0 },
-    startOrStop: function (position) {
-        var y = 10;
+    startOrStop: (position) => {
+        let y = 10;
         if (position === "below")
             y *= -1;
         if (window.innerWidth < 640)
             y = 150;
-        return { opacity: 0, y: y };
+        return { opacity: 0, y };
     },
     done: { opacity: 1, y: 0 },
 };
 // eslint-disable-next-line max-statements
-function Menu(_a) {
-    var _b;
-    var activator = _a.activator, items = _a.items;
-    var _c;
-    var _d = tslib_es6.__read(React.useState(false), 2), visible = _d[0], setVisible = _d[1];
-    var fullWidth = ((_c = activator === null || activator === void 0 ? void 0 : activator.props) === null || _c === void 0 ? void 0 : _c.fullWidth) || false;
-    var _e = tslib_es6.__read(React.useState({
+function Menu({ activator, items }) {
+    var _a;
+    const [visible, setVisible] = React.useState(false);
+    const fullWidth = ((_a = activator === null || activator === void 0 ? void 0 : activator.props) === null || _a === void 0 ? void 0 : _a.fullWidth) || false;
+    const [position, setPosition] = React.useState({
         vertical: "below",
         horizontal: "right",
-    }), 2), position = _e[0], setPosition = _e[1];
-    var wrapperRef = React.createRef();
-    var buttonID = uuid.v1();
-    var menuID = uuid.v1();
+    });
+    const wrapperRef = React.createRef();
+    const buttonID = uuid.v1();
+    const menuID = uuid.v1();
     jobberHooks.useOnKeyDown(handleKeyboardShortcut, ["Escape"]);
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (wrapperRef.current) {
-            var bounds = wrapperRef.current.getBoundingClientRect();
-            var newPosition = tslib_es6.__assign({}, position);
+            const bounds = wrapperRef.current.getBoundingClientRect();
+            const newPosition = Object.assign({}, position);
             if (bounds.top <= window.innerHeight / 2) {
                 newPosition.vertical = "below";
             }
@@ -69,10 +66,10 @@ function Menu(_a) {
     if (!activator) {
         activator = (React__default["default"].createElement(Button.Button, { fullWidth: true, label: "More Actions", icon: "more", type: "secondary" }));
     }
-    var menuClasses = classnames__default["default"](styles.menu, position.vertical === "above" && styles.above, position.vertical === "below" && styles.below, position.horizontal === "left" && styles.left, position.horizontal === "right" && styles.right);
-    var wrapperClasses = classnames__default["default"](styles.wrapper, (_b = {},
-        _b[styles.fullWidth] = fullWidth,
-        _b));
+    const menuClasses = classnames__default["default"](styles.menu, position.vertical === "above" && styles.above, position.vertical === "below" && styles.below, position.horizontal === "left" && styles.left, position.horizontal === "right" && styles.right);
+    const wrapperClasses = classnames__default["default"](styles.wrapper, {
+        [styles.fullWidth]: fullWidth,
+    });
     return (React__default["default"].createElement("div", { className: wrapperClasses, ref: wrapperRef },
         React__default["default"].cloneElement(activator, {
             onClick: toggle(activator.props.onClick),
@@ -89,11 +86,11 @@ function Menu(_a) {
             React__default["default"].createElement(framerMotion.motion.div, { className: menuClasses, role: "menu", "aria-labelledby": buttonID, id: menuID, onClick: hide, variants: variation, initial: "startOrStop", animate: "done", exit: "startOrStop", custom: position, transition: {
                     type: "tween",
                     duration: 0.25,
-                } }, items.map(function (item, key) { return (React__default["default"].createElement("div", { key: key, className: styles.section },
+                } }, items.map((item, key) => (React__default["default"].createElement("div", { key: key, className: styles.section },
                 item.header && React__default["default"].createElement(SectionHeader, { text: item.header }),
-                item.actions.map(function (action, index) { return (React__default["default"].createElement(Action, tslib_es6.__assign({ sectionLabel: item.header, key: action.label, shouldFocus: key === 0 && index === 0 }, action))); }))); })))))));
+                item.actions.map((action, index) => (React__default["default"].createElement(Action, Object.assign({ sectionLabel: item.header, key: action.label, shouldFocus: key === 0 && index === 0 }, action)))))))))))));
     function toggle(callbackPassthrough) {
-        return function (event) {
+        return (event) => {
             setVisible(!visible);
             callbackPassthrough && callbackPassthrough(event);
         };
@@ -102,7 +99,7 @@ function Menu(_a) {
         setVisible(false);
     }
     function handleKeyboardShortcut(event) {
-        var key = event.key;
+        const { key } = event;
         if (!visible)
             return;
         event.preventDefault();
@@ -110,15 +107,13 @@ function Menu(_a) {
         key === "Escape" && hide();
     }
 }
-function SectionHeader(_a) {
-    var text = _a.text;
+function SectionHeader({ text }) {
     return (React__default["default"].createElement("div", { className: styles.sectionHeader, "aria-hidden": true },
         React__default["default"].createElement(Typography.Typography, { element: "h6", size: "small", textCase: "uppercase", textColor: "textSecondary", fontWeight: "bold" }, text)));
 }
-function Action(_a) {
-    var label = _a.label, sectionLabel = _a.sectionLabel, icon = _a.icon, onClick = _a.onClick, _b = _a.shouldFocus, shouldFocus = _b === void 0 ? false : _b;
-    var actionButtonRef = React.useRef();
-    React.useEffect(function () {
+function Action({ label, sectionLabel, icon, onClick, shouldFocus = false, }) {
+    const actionButtonRef = React.useRef();
+    React.useEffect(() => {
         if (actionButtonRef.current && shouldFocus) {
             actionButtonRef.current.focus();
         }

package/dist/Modal/index.js

@@ -2,21 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Modal = require('../Modal-cc3bd7bf.js');
-require('../tslib.es6-5b50eb8e.js');
+var Modal = require('../Modal-757e83fd.js');
 require('react');
 require('react-dom');
 require('classnames');
 require('framer-motion');
 require('@jobber/hooks');
 require('../style-inject.es-dcee06b6.js');
-require('../Heading-a9a66964.js');
-require('../Typography-fbe0ed6e.js');
-require('../Button-cd30df0f.js');
+require('../Heading-7b203f7f.js');
+require('../Typography-9262511f.js');
+require('../Button-16e043ec.js');
 require('react-router-dom');
-require('../Icon-d5ad1a6d.js');
+require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../ButtonDismiss-a9590195.js');
+require('../ButtonDismiss-3fb1eaf9.js');