@jobber/components 2.86.0 → 2.86.2

package/dist/Gallery/index.js

@@ -2,94 +2,96 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var __chunk_1 = require('../chunk-b67af3cb.js');
+var tslib_es6 = require('../tslib.es6-5b50eb8e.js');
 var React = require('react');
-var React__default = _interopDefault(React);
-var __chunk_2 = require('../chunk-17e02351.js');
-var classnames = _interopDefault(require('classnames'));
-require('../Typography/index.js');
-require('../Text/index.js');
-require('@jobber/design');
-require('../Icon/index.js');
-require('../Heading/index.js');
-require('react-router-dom');
-var index$5 = require('../Button/index.js');
-require('framer-motion');
+var classnames = require('classnames');
+var styleInject_es = require('../style-inject.es-dcee06b6.js');
+var LightBox = require('../LightBox-b893b656.js');
+var FormatFile = require('../FormatFile-5391d4cf.js');
+var Button = require('../Button-5b2f1636.js');
+require('react-image-lightbox');
+require('react-image-lightbox/style.css');
+require('filesize');
+require('../ConfirmationModal-b7ef110f.js');
 require('@jobber/hooks');
-require('../ButtonDismiss/index.js');
+require('../Modal-aaaaf2df.js');
 require('react-dom');
-require('../Modal/index.js');
-require('../Content/index.js');
+require('framer-motion');
+require('../Typography-7e542a72.js');
+require('../ButtonDismiss-4cde8f7c.js');
+require('../Content-18de5fbb.js');
+require('../Markdown-69986c49.js');
 require('react-markdown');
-require('../Emphasis/index.js');
-require('../Markdown/index.js');
-require('../ConfirmationModal/index.js');
-require('filesize');
-var index$8 = require('../FormatFile/index.js');
-require('../ProgressBar/index.js');
-require('react-image-lightbox');
-var index$9 = require('../LightBox/index.js');
-require('react-image-lightbox/style.css');
+require('../Text-9bc093e9.js');
+require('../Emphasis-fd845639.js');
+require('../Heading-56750113.js');
+require('../Icon-d5ad1a6d.js');
+require('@jobber/design');
+require('../ProgressBar-e9a49129.js');
+require('react-router-dom');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
 var css = ".oLHYkzv718LqMvtqFZFcZ,\n._2JSG0uYj1HSXFads63nptQ {\n  display: -ms-flexbox;\n  display: flex;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n  grid-gap: var(--space-small);\n  grid-gap: var(--space-small);\n  gap: var(--space-small);\n}\n\n._2JSG0uYj1HSXFads63nptQ {\n  grid-gap: var(--space-base);\n  grid-gap: var(--space-base);\n  gap: var(--space-base);\n}\n\n._3LkQj1p9wvHbrfXfz2nUYp {\n  display: -ms-flexbox;\n  display: flex;\n}\n\n.FG8mZ6UcMPRsMC9HQinY2 {\n  width: 56px;\n  height: 56px;\n}\n\n._1cTzKosWc22qxWZSiI0CzZ {\n  width: 168px;\n  height: 168px;\n  box-shadow: var(--shadow-base);\n}\n";
 var styles = {"gallery":"oLHYkzv718LqMvtqFZFcZ","galleryLarge":"_2JSG0uYj1HSXFads63nptQ","showMoreButton":"_3LkQj1p9wvHbrfXfz2nUYp","baseShowMoreButton":"FG8mZ6UcMPRsMC9HQinY2","largeShowMoreButton":"_1cTzKosWc22qxWZSiI0CzZ"};
-__chunk_2.styleInject(css);
+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 = __chunk_1.__read(React.useState(false), 2), lightboxOpen = _d[0], setLightboxOpen = _d[1];
-    var _e = __chunk_1.__read(React.useState(0), 2), lightboxIndex = _e[0], setLightboxIndex = _e[1];
-    var _f = __chunk_1.__read(React.useState(max ? false : true), 2), displayPastMax = _f[0], setDisplayPastMax = _f[1];
-    var visibleFiles = displayPastMax ? files : files.slice(0, max);
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("div", { className: size === "large" ? styles.galleryLarge : styles.gallery },
-            visibleFiles.map(function (file, index) {
-                return (React__default.createElement(index$8.FormatFile, { key: file.key, file: __chunk_1.__assign(__chunk_1.__assign({}, file), { src: function () { return Promise.resolve(file.src); } }), display: "compact", displaySize: size, onClick: function () {
-                        handleThumbnailClicked(index);
-                    }, onDelete: onDelete ? function () { return onDelete === null || onDelete === void 0 ? void 0 : onDelete(file); } : undefined }));
-            }),
-            max && files.length > max && !displayPastMax && (React__default.createElement("div", { className: classnames(styles.showMoreButton, styles[size + "ShowMoreButton"]) },
-                React__default.createElement(index$5.Button, { type: "tertiary", size: size, label: "+ " + (files.length - max), fullWidth: true, onClick: function () {
-                        setDisplayPastMax(true);
-                    } })))),
-        React__default.createElement(index$9.LightBox, { open: lightboxOpen, images: images, imageIndex: lightboxIndex, onRequestClose: handleLightboxClose })));
-    function handleThumbnailClicked(index) {
-        if (files[index].type.startsWith("image/")) {
-            handleLightboxOpen(index);
-        }
-        else {
-            window.open(files[index].src, "_blank");
-        }
-    }
-    function handleLightboxOpen(index) {
-        var fileToImageIndex = filesToImageIndex[index];
-        if (fileToImageIndex !== undefined) {
-            setLightboxIndex(fileToImageIndex);
-            setLightboxOpen(true);
-        }
-    }
-    function handleLightboxClose() {
-        setLightboxOpen(false);
-    }
-}
-function generateImagesArray(files) {
-    var images = [];
-    var filesToImageIndex = [];
-    var imageIndex = 0;
-    for (var 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);
-            imageIndex++;
-        }
-        else {
-            filesToImageIndex.push(undefined);
-        }
-    }
-    return { images: images, filesToImageIndex: filesToImageIndex };
+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);
+    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 () {
+                        handleThumbnailClicked(index);
+                    }, onDelete: onDelete ? function () { return 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 () {
+                        setDisplayPastMax(true);
+                    } })))),
+        React__default["default"].createElement(LightBox.LightBox, { open: lightboxOpen, images: images, imageIndex: lightboxIndex, onRequestClose: handleLightboxClose })));
+    function handleThumbnailClicked(index) {
+        if (files[index].type.startsWith("image/")) {
+            handleLightboxOpen(index);
+        }
+        else {
+            window.open(files[index].src, "_blank");
+        }
+    }
+    function handleLightboxOpen(index) {
+        var fileToImageIndex = filesToImageIndex[index];
+        if (fileToImageIndex !== undefined) {
+            setLightboxIndex(fileToImageIndex);
+            setLightboxOpen(true);
+        }
+    }
+    function handleLightboxClose() {
+        setLightboxOpen(false);
+    }
+}
+function generateImagesArray(files) {
+    var images = [];
+    var filesToImageIndex = [];
+    var imageIndex = 0;
+    for (var 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);
+            imageIndex++;
+        }
+        else {
+            filesToImageIndex.push(undefined);
+        }
+    }
+    return { images: images, filesToImageIndex: filesToImageIndex };
 }
 
 exports.Gallery = Gallery;

package/dist/Heading/Heading.d.ts

@@ -1,14 +1,14 @@
-import { ReactNode } from "react";
-import { TypographyOptions } from "../Typography";
-interface HeadingProps {
-    /**
-     * @default 5
-     */
-    readonly level: 1 | 2 | 3 | 4 | 5 | 6;
-    readonly children: ReactNode;
-}
-export interface LevelMap {
-    [level: string]: TypographyOptions;
-}
-export declare function Heading({ level, children }: HeadingProps): JSX.Element;
-export {};
+import { ReactNode } from "react";
+import { TypographyOptions } from "../Typography";
+interface HeadingProps {
+    /**
+     * @default 5
+     */
+    readonly level: 1 | 2 | 3 | 4 | 5 | 6;
+    readonly children: ReactNode;
+}
+export interface LevelMap {
+    [level: string]: TypographyOptions;
+}
+export declare function Heading({ level, children }: HeadingProps): JSX.Element;
+export {};

package/dist/Heading/index.d.ts

@@ -1 +1 @@
-export { Heading } from "./Heading";
+export { Heading } from "./Heading";

package/dist/Heading/index.js

@@ -2,59 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var __chunk_1 = require('../chunk-b67af3cb.js');
-var React = require('react');
-var React__default = _interopDefault(React);
-require('../chunk-17e02351.js');
+var Heading = require('../Heading-56750113.js');
+require('../tslib.es6-5b50eb8e.js');
+require('react');
+require('../Typography-7e542a72.js');
 require('classnames');
-var index = require('../Typography/index.js');
+require('../style-inject.es-dcee06b6.js');
+
 
-function Heading(_a) {
-    var _b = _a.level, level = _b === void 0 ? 5 : _b, children = _a.children;
-    var levelMap = {
-        1: {
-            element: "h1",
-            size: "jumbo",
-            textCase: "uppercase",
-            fontWeight: "black",
-            textColor: "heading",
-        },
-        2: {
-            element: "h2",
-            size: "largest",
-            textCase: "uppercase",
-            fontWeight: "black",
-            textColor: "heading",
-        },
-        3: {
-            element: "h3",
-            size: "larger",
-            fontWeight: "bold",
-            textColor: "heading",
-        },
-        4: {
-            element: "h4",
-            size: "large",
-            fontWeight: "bold",
-            textColor: "heading",
-        },
-        5: {
-            element: "h5",
-            size: "base",
-            fontWeight: "bold",
-            textColor: "heading",
-        },
-        6: {
-            element: "h6",
-            size: "small",
-            textCase: "uppercase",
-            fontWeight: "bold",
-            textColor: "heading",
-        },
-    };
-    return React__default.createElement(index.Typography, __chunk_1.__assign({}, levelMap[level]), children);
-}
 
-exports.Heading = Heading;
+exports.Heading = Heading.Heading;

package/dist/Heading-56750113.js

@@ -0,0 +1,57 @@
+'use strict';
+
+var tslib_es6 = require('./tslib.es6-5b50eb8e.js');
+var React = require('react');
+var Typography = require('./Typography-7e542a72.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 = {
+        1: {
+            element: "h1",
+            size: "jumbo",
+            textCase: "uppercase",
+            fontWeight: "black",
+            textColor: "heading",
+        },
+        2: {
+            element: "h2",
+            size: "largest",
+            textCase: "uppercase",
+            fontWeight: "black",
+            textColor: "heading",
+        },
+        3: {
+            element: "h3",
+            size: "larger",
+            fontWeight: "bold",
+            textColor: "heading",
+        },
+        4: {
+            element: "h4",
+            size: "large",
+            fontWeight: "bold",
+            textColor: "heading",
+        },
+        5: {
+            element: "h5",
+            size: "base",
+            fontWeight: "bold",
+            textColor: "heading",
+        },
+        6: {
+            element: "h6",
+            size: "small",
+            textCase: "uppercase",
+            fontWeight: "bold",
+            textColor: "heading",
+        },
+    };
+    return React__default["default"].createElement(Typography.Typography, tslib_es6.__assign({}, levelMap[level]), children);
+}
+
+exports.Heading = Heading;

package/dist/Icon/Icon.d.ts

@@ -1,22 +1,22 @@
-import { IconColorNames, IconNames, IconSizes } from "@jobber/design";
-export { IconColorNames, IconNames } from "@jobber/design";
-export interface IconProps {
-    /** The icon to show.  */
-    readonly name: IconNames;
-    /**
-     * Changes the size to small or large.
-     * @default base
-     */
-    readonly size?: IconSizes;
-    /**
-     * Determines the color of the icon. Some icons have a default system colour
-     * like quotes, jobs, and invoices. Others that doesn't have a system colour
-     * falls back to greyBlueDark.
-     */
-    readonly color?: IconColorNames;
-    /**
-     * Sets a custom color for the icon. Can be a rgb() or hex value.
-     */
-    readonly customColor?: string;
-}
-export declare function Icon({ name, color, customColor, size }: IconProps): JSX.Element;
+import { IconColorNames, IconNames, IconSizes } from "@jobber/design";
+export { IconColorNames, IconNames } from "@jobber/design";
+export interface IconProps {
+    /** The icon to show.  */
+    readonly name: IconNames;
+    /**
+     * Changes the size to small or large.
+     * @default base
+     */
+    readonly size?: IconSizes;
+    /**
+     * Determines the color of the icon. Some icons have a default system colour
+     * like quotes, jobs, and invoices. Others that doesn't have a system colour
+     * falls back to greyBlueDark.
+     */
+    readonly color?: IconColorNames;
+    /**
+     * Sets a custom color for the icon. Can be a rgb() or hex value.
+     */
+    readonly customColor?: string;
+}
+export declare function Icon({ name, color, customColor, size }: IconProps): JSX.Element;

package/dist/Icon/index.d.ts

@@ -1 +1 @@
-export * from "./Icon";
+export * from "./Icon";

package/dist/Icon/index.js

@@ -2,41 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+var Icon = require('../Icon-d5ad1a6d.js');
+require('react');
+require('@jobber/design');
 
-var React = require('react');
-var React__default = _interopDefault(React);
-var design = require('@jobber/design');
 
-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,
-        color: getIconColor(name, color),
-        size: size,
-    }), svgClassNames = _c.svgClassNames, pathClassNames = _c.pathClassNames, paths = _c.paths, viewBox = _c.viewBox;
-    if (name === "truck") {
-        icon = getTruck(pathClassNames, customColor);
-    }
-    else {
-        icon = paths.map(function (path) { return (React__default.createElement("path", { key: path, className: pathClassNames, d: path, fill: customColor })); });
-    }
-    return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox, className: svgClassNames, "data-testid": name }, icon));
-}
-function getIconColor(name, color) {
-    if (name === "truck") {
-        return color || "green";
-    }
-    return color;
-}
-function getTruck(pathClassNames, customColor) {
-    return (React__default.createElement("g", { transform: "translate(233.000000, 0.000000)", className: pathClassNames },
-        React__default.createElement("path", { d: "M31.030303,124.121212 C31.030303,106.983796 44.9231903,93.0909091 62.0606061,93.0909091 L93.0909091,93.0909091 L93.0909091,279.272727 L62.0606061,279.272727 C44.9231903,279.272727 31.030303,265.37984 31.030303,248.242424 L31.030303,124.121212 Z M31.030303,744.727273 C31.030303,727.589236 44.9231903,713.69697 62.0606061,713.69697 L93.0909091,713.69697 L93.0909091,899.878788 L62.0606061,899.878788 C44.9231903,899.878788 31.030303,885.986521 31.030303,868.848485 L31.030303,744.727273 Z M62.0606061,961.939394 L496.484848,961.939394 L496.484848,992.969697 C496.484848,1010.10773 482.592582,1024 465.454545,1024 L93.0909091,1024 C75.9534933,1024 62.0606061,1010.10773 62.0606061,992.969697 L62.0606061,961.939394 Z M494.858861,713.715588 L463.834764,714.258618 L467.083636,900.412509 L498.107733,899.869479 C515.242667,899.571588 528.889794,885.437285 528.591903,868.302352 L526.425988,744.199758 C526.128097,727.064824 511.993794,713.417697 494.858861,713.715588 Z M496.484848,93.0909091 L465.454545,93.0909091 L465.454545,279.272727 L496.484848,279.272727 C513.622885,279.272727 527.515152,265.37984 527.515152,248.242424 L527.515152,124.121212 C527.515152,106.983796 513.622885,93.0909091 496.484848,93.0909091 Z", id: "Shape", fill: "#2B2B2B" }),
-        React__default.createElement("path", { d: "M124.121212,0 C89.8460703,0 62.0606061,27.7854642 62.0606061,62.0606061 L62.0606061,310.30303 L31.030303,310.30303 C13.8927321,310.30303 0,324.195297 0,341.333333 L62.0606061,341.333333 L62.0606061,992.969697 L496.484848,992.969697 L496.484848,341.333333 L558.545455,341.333333 C558.545455,324.195297 544.653188,310.30303 527.515152,310.30303 L496.484848,310.30303 L496.484848,62.0606061 C496.484848,27.7854642 468.700315,0 434.424242,0 L124.121212,0 Z", id: "Path", fill: customColor }),
-        React__default.createElement("path", { d: "M465.454545,589.575758 L93.0909091,589.575758 L93.0909091,713.69697 L124.121212,713.69697 C141.258628,713.69697 155.151515,727.589236 155.151515,744.727273 L155.151515,868.848485 C155.151515,885.986521 141.258628,899.878788 124.121212,899.878788 L93.0909091,899.878788 L93.0909091,961.939394 L465.454545,961.939394 L465.454545,899.878788 L434.424242,899.878788 C417.286206,899.878788 403.393939,885.986521 403.393939,868.848485 L403.393939,744.727273 C403.393939,727.589236 417.286206,713.69697 434.424242,713.69697 L465.454545,713.69697 L465.454545,589.575758 Z", id: "Path", fillOpacity: "0.35", fill: "#000000" }),
-        React__default.createElement("path", { d: "M93.0909091,62.0606061 C93.0909091,44.9231903 106.983796,31.030303 124.121212,31.030303 L434.424242,31.030303 C451.562279,31.030303 465.454545,44.9231903 465.454545,62.0606061 L465.454545,589.575758 L93.0909091,589.575758 L93.0909091,62.0606061 Z M93.0909091,713.69697 L124.121212,713.69697 C141.258628,713.69697 155.151515,727.589236 155.151515,744.727273 L155.151515,868.848485 C155.151515,885.986521 141.258628,899.878788 124.121212,899.878788 L93.0909091,899.878788 L93.0909091,713.69697 Z M434.424242,713.69697 C417.286206,713.69697 403.393939,727.589236 403.393939,744.727273 L403.393939,868.848485 C403.393939,885.986521 417.286206,899.878788 434.424242,899.878788 L465.454545,899.878788 L465.454545,713.69697 L434.424242,713.69697 Z", id: "Shape", fill: "#FFFFFF", opacity: "0.5" }),
-        React__default.createElement("path", { d: "M93.0909091,279.272727 C113.777881,268.929396 192.387879,248.242424 279.272727,248.242424 C366.157576,248.242424 444.766642,268.929396 465.454545,279.272727 L403.393939,372.363636 C393.051539,362.021236 341.333333,341.333333 279.272727,341.333333 C217.212121,341.333333 165.494846,362.021236 155.151515,372.363636 L93.0909091,279.272727 Z M155.151515,512 L155.151515,403.393939 L93.0909091,310.30303 L93.0909091,512 L155.151515,512 Z M403.393939,512 L403.393939,403.393939 L465.454545,310.30303 L465.454545,512 L403.393939,512 Z", id: "Shape", fill: "#2A2A2A" })));
-}
 
-exports.Icon = Icon;
+exports.Icon = Icon.Icon;

package/dist/Icon-d5ad1a6d.js

@@ -0,0 +1,41 @@
+'use strict';
+
+var React = require('react');
+var design = require('@jobber/design');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+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,
+        color: getIconColor(name, color),
+        size: size,
+    }), svgClassNames = _c.svgClassNames, pathClassNames = _c.pathClassNames, paths = _c.paths, viewBox = _c.viewBox;
+    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 })); });
+    }
+    return (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox, className: svgClassNames, "data-testid": name }, icon));
+}
+function getIconColor(name, color) {
+    if (name === "truck") {
+        return color || "green";
+    }
+    return color;
+}
+function getTruck(pathClassNames, customColor) {
+    return (React__default["default"].createElement("g", { transform: "translate(233.000000, 0.000000)", className: pathClassNames },
+        React__default["default"].createElement("path", { d: "M31.030303,124.121212 C31.030303,106.983796 44.9231903,93.0909091 62.0606061,93.0909091 L93.0909091,93.0909091 L93.0909091,279.272727 L62.0606061,279.272727 C44.9231903,279.272727 31.030303,265.37984 31.030303,248.242424 L31.030303,124.121212 Z M31.030303,744.727273 C31.030303,727.589236 44.9231903,713.69697 62.0606061,713.69697 L93.0909091,713.69697 L93.0909091,899.878788 L62.0606061,899.878788 C44.9231903,899.878788 31.030303,885.986521 31.030303,868.848485 L31.030303,744.727273 Z M62.0606061,961.939394 L496.484848,961.939394 L496.484848,992.969697 C496.484848,1010.10773 482.592582,1024 465.454545,1024 L93.0909091,1024 C75.9534933,1024 62.0606061,1010.10773 62.0606061,992.969697 L62.0606061,961.939394 Z M494.858861,713.715588 L463.834764,714.258618 L467.083636,900.412509 L498.107733,899.869479 C515.242667,899.571588 528.889794,885.437285 528.591903,868.302352 L526.425988,744.199758 C526.128097,727.064824 511.993794,713.417697 494.858861,713.715588 Z M496.484848,93.0909091 L465.454545,93.0909091 L465.454545,279.272727 L496.484848,279.272727 C513.622885,279.272727 527.515152,265.37984 527.515152,248.242424 L527.515152,124.121212 C527.515152,106.983796 513.622885,93.0909091 496.484848,93.0909091 Z", id: "Shape", fill: "#2B2B2B" }),
+        React__default["default"].createElement("path", { d: "M124.121212,0 C89.8460703,0 62.0606061,27.7854642 62.0606061,62.0606061 L62.0606061,310.30303 L31.030303,310.30303 C13.8927321,310.30303 0,324.195297 0,341.333333 L62.0606061,341.333333 L62.0606061,992.969697 L496.484848,992.969697 L496.484848,341.333333 L558.545455,341.333333 C558.545455,324.195297 544.653188,310.30303 527.515152,310.30303 L496.484848,310.30303 L496.484848,62.0606061 C496.484848,27.7854642 468.700315,0 434.424242,0 L124.121212,0 Z", id: "Path", fill: customColor }),
+        React__default["default"].createElement("path", { d: "M465.454545,589.575758 L93.0909091,589.575758 L93.0909091,713.69697 L124.121212,713.69697 C141.258628,713.69697 155.151515,727.589236 155.151515,744.727273 L155.151515,868.848485 C155.151515,885.986521 141.258628,899.878788 124.121212,899.878788 L93.0909091,899.878788 L93.0909091,961.939394 L465.454545,961.939394 L465.454545,899.878788 L434.424242,899.878788 C417.286206,899.878788 403.393939,885.986521 403.393939,868.848485 L403.393939,744.727273 C403.393939,727.589236 417.286206,713.69697 434.424242,713.69697 L465.454545,713.69697 L465.454545,589.575758 Z", id: "Path", fillOpacity: "0.35", fill: "#000000" }),
+        React__default["default"].createElement("path", { d: "M93.0909091,62.0606061 C93.0909091,44.9231903 106.983796,31.030303 124.121212,31.030303 L434.424242,31.030303 C451.562279,31.030303 465.454545,44.9231903 465.454545,62.0606061 L465.454545,589.575758 L93.0909091,589.575758 L93.0909091,62.0606061 Z M93.0909091,713.69697 L124.121212,713.69697 C141.258628,713.69697 155.151515,727.589236 155.151515,744.727273 L155.151515,868.848485 C155.151515,885.986521 141.258628,899.878788 124.121212,899.878788 L93.0909091,899.878788 L93.0909091,713.69697 Z M434.424242,713.69697 C417.286206,713.69697 403.393939,727.589236 403.393939,744.727273 L403.393939,868.848485 C403.393939,885.986521 417.286206,899.878788 434.424242,899.878788 L465.454545,899.878788 L465.454545,713.69697 L434.424242,713.69697 Z", id: "Shape", fill: "#FFFFFF", opacity: "0.5" }),
+        React__default["default"].createElement("path", { d: "M93.0909091,279.272727 C113.777881,268.929396 192.387879,248.242424 279.272727,248.242424 C366.157576,248.242424 444.766642,268.929396 465.454545,279.272727 L403.393939,372.363636 C393.051539,362.021236 341.333333,341.333333 279.272727,341.333333 C217.212121,341.333333 165.494846,362.021236 155.151515,372.363636 L93.0909091,279.272727 Z M155.151515,512 L155.151515,403.393939 L93.0909091,310.30303 L93.0909091,512 L155.151515,512 Z M403.393939,512 L403.393939,403.393939 L465.454545,310.30303 L465.454545,512 L403.393939,512 Z", id: "Shape", fill: "#2A2A2A" })));
+}
+
+exports.Icon = Icon;

package/dist/InlineLabel/InlineLabel.d.ts

@@ -1,17 +1,17 @@
-import { ReactNode } from "react";
-export declare type InlineLabelColors = "greyBlue" | "red" | "orange" | "green" | "blue" | "yellow" | "lime" | "purple" | "pink" | "teal" | "yellowGreen" | "blueDark" | "lightBlue" | "indigo";
-interface InlineLabelProps {
-    /**
-     * The size of the label
-     * @default base
-     */
-    size?: "base" | "large" | "larger";
-    /**
-     * The color of the label
-     * @default "greyBlue"
-     */
-    color?: InlineLabelColors;
-    children: ReactNode;
-}
-export declare function InlineLabel({ size, color, children, }: InlineLabelProps): JSX.Element;
-export {};
+import { ReactNode } from "react";
+export declare type InlineLabelColors = "greyBlue" | "red" | "orange" | "green" | "blue" | "yellow" | "lime" | "purple" | "pink" | "teal" | "yellowGreen" | "blueDark" | "lightBlue" | "indigo";
+interface InlineLabelProps {
+    /**
+     * The size of the label
+     * @default base
+     */
+    size?: "base" | "large" | "larger";
+    /**
+     * The color of the label
+     * @default "greyBlue"
+     */
+    color?: InlineLabelColors;
+    children: ReactNode;
+}
+export declare function InlineLabel({ size, color, children, }: InlineLabelProps): JSX.Element;
+export {};

package/dist/InlineLabel/index.d.ts

@@ -1 +1 @@
-export { InlineLabel, InlineLabelColors } from "./InlineLabel";
+export { InlineLabel, InlineLabelColors } from "./InlineLabel";

package/dist/InlineLabel/index.js

@@ -2,29 +2,31 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-require('../chunk-b67af3cb.js');
 var React = require('react');
-var React__default = _interopDefault(React);
-var __chunk_2 = require('../chunk-17e02351.js');
-var classnames = _interopDefault(require('classnames'));
-var index = require('../Typography/index.js');
+var classnames = require('classnames');
+var styleInject_es = require('../style-inject.es-dcee06b6.js');
+var Typography = require('../Typography-7e542a72.js');
+require('../tslib.es6-5b50eb8e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
 var css = "._2CX7X_wH5lb0fioNTuYTB3 {\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  border-radius: var(--radius-large);\n}\n\n.hIEzl9j3x8azFGCx53-RF {\n  padding: var(--space-smaller) var(--space-small);\n}\n\n._2FEAdHSbQ1julTQlXKcU9G {\n  padding: var(--space-smaller) calc(var(--space-base) - var(--space-smallest));\n}\n\n.y2IZqgoDbEVd68JUw74_V {\n  padding: var(--space-small) var(--space-base);\n}\n\n._3ayhjHoV55pJnCyceIIodY {\n  color: var(--color-greyBlue--dark);\n  background-color: var(--color-greyBlue--lightest);\n}\n\n._1NRX5K08cyefHFTjmEY7JC {\n  color: var(--color-red--dark);\n  background-color: var(--color-red--lightest);\n}\n\n._2WqpAFlUhWh2Wycr-r2uMn {\n  color: var(--color-orange--dark);\n  background-color: var(--color-orange--lightest);\n}\n\n.EM3QGMlc1v7pjfVBR2j82 {\n  color: var(--color-green--dark);\n  background-color: var(--color-green--lightest);\n}\n\n.LuBWHY5BJNh4RnEPozKgA {\n  color: var(--color-blue--dark);\n  background-color: var(--color-blue--lightest);\n}\n\n._36P3W4wMGeF6ObMYI87q2b {\n  color: var(--color-navy--dark);\n  background-color: var(--color-navy--lightest);\n}\n\n.z7yJ1rNuOTksBtZ0cr3ys {\n  color: var(--color-yellow--dark);\n  background-color: var(--color-yellow--lightest);\n}\n\n._2jRJWXkl2av1GzSTdc4GS {\n  color: var(--color-lime--dark);\n  background-color: var(--color-lime--lightest);\n}\n\n._2DSYzUVBgtIaB1xsMr7rVj {\n  color: var(--color-purple--dark);\n  background-color: var(--color-purple--lightest);\n}\n\n._27cvq6AfdeOP6SUuX5Ex_T {\n  color: var(--color-pink--dark);\n  background-color: var(--color-pink--lightest);\n}\n\n.eImPpTsVAb13A3dFkEkBc {\n  color: var(--color-teal--dark);\n  background-color: var(--color-teal--lightest);\n}\n\n._1AcWxzfWcjE71_gRrEo-J_ {\n  color: var(--color-yellowGreen--dark);\n  background-color: var(--color-yellowGreen--lightest);\n}\n\n.J21zEr7ZIvGwt6R5-MZQ7 {\n  color: var(--color-white);\n  background-color: var(--color-blue--light);\n}\n\n._27HNFihCeydE5HUcbCskQ4 {\n  color: var(--color-lightBlue--dark);\n  background-color: var(--color-lightBlue--lightest);\n}\n\n._3_dDXhHTqG9pa_au-60pWR {\n  color: var(--color-indigo--dark);\n  background-color: var(--color-indigo--lightest);\n}\n";
 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"};
-__chunk_2.styleInject(css);
+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(styles.inlineLabel, styles[size], styles[color]);
-    var sizeMapper = {
-        base: "small",
-        large: "base",
-        larger: "large",
-    };
-    return (React__default.createElement("span", { className: className },
-        React__default.createElement(index.Typography, { element: "span", size: sizeMapper[size], textCase: "uppercase" }, children)));
+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 = {
+        base: "small",
+        large: "base",
+        larger: "large",
+    };
+    return (React__default["default"].createElement("span", { className: className },
+        React__default["default"].createElement(Typography.Typography, { element: "span", size: sizeMapper[size], textCase: "uppercase" }, children)));
 }
 
 exports.InlineLabel = InlineLabel;

package/dist/InputAvatar/InputAvatar.d.ts

@@ -1,22 +1,22 @@
-import { AvatarProps } from "../Avatar";
-import { FileUpload, UploadParams } from "../InputFile";
-interface InputAvatarProps extends Omit<AvatarProps, "size"> {
-    /**
-     * A callback that receives a file object and returns a `UploadParams` needed
-     * to upload the file.
-     *
-     * More info is available at:
-     * https://atlantis.getjobber.com/components/input-file#getuploadparams
-     */
-    getUploadParams(file: File): UploadParams | Promise<UploadParams>;
-    /**
-     * Triggered when an image is changed.
-     */
-    onChange?(file?: FileUpload): void;
-    /**
-     * Triggered when an image upload has completed.
-     */
-    onUploadComplete?(file?: FileUpload): void;
-}
-export declare function InputAvatar({ getUploadParams, onUploadComplete, onChange, ...avatarProps }: InputAvatarProps): JSX.Element;
-export {};
+import { AvatarProps } from "../Avatar";
+import { FileUpload, UploadParams } from "../InputFile";
+interface InputAvatarProps extends Omit<AvatarProps, "size"> {
+    /**
+     * A callback that receives a file object and returns a `UploadParams` needed
+     * to upload the file.
+     *
+     * More info is available at:
+     * https://atlantis.getjobber.com/components/input-file#getuploadparams
+     */
+    getUploadParams(file: File): UploadParams | Promise<UploadParams>;
+    /**
+     * Triggered when an image is changed.
+     */
+    onChange?(file?: FileUpload): void;
+    /**
+     * Triggered when an image upload has completed.
+     */
+    onUploadComplete?(file?: FileUpload): void;
+}
+export declare function InputAvatar({ getUploadParams, onUploadComplete, onChange, ...avatarProps }: InputAvatarProps): JSX.Element;
+export {};

package/dist/InputAvatar/index.d.ts

@@ -1 +1 @@
-export { InputAvatar } from "./InputAvatar";
+export { InputAvatar } from "./InputAvatar";