@jobber/components 4.79.0 → 4.79.1-JOB-85851.2

package/dist/Tooltip/index.js

@@ -2,11 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Tooltip = require('../Tooltip-27771182.js');
+var Tooltip = require('../Tooltip-b9de6e57.js');
 require('react');
 require('classnames');
 require('react-dom');
 require('framer-motion');
+require('@jobber/hooks/useSafeLayoutEffect');
+require('@jobber/hooks/useIsMounted');
 require('../style-inject.es-9d2f5f4e.js');
 require('react-popper');
 

package/dist/{Tooltip-27771182.js → Tooltip-b9de6e57.js}

@@ -4,6 +4,8 @@ var React = require('react');
 var classnames = require('classnames');
 var ReactDOM = require('react-dom');
 var framerMotion = require('framer-motion');
+var useSafeLayoutEffect = require('@jobber/hooks/useSafeLayoutEffect');
+var useIsMounted = require('@jobber/hooks/useIsMounted');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var reactPopper = require('react-popper');
 
@@ -43,19 +45,20 @@ const variation = {
 };
 function Tooltip({ message, children }) {
     const [show, setShow] = React.useState(false);
+    const mounted = useIsMounted.useIsMounted();
     const { attributes, placement, shadowRef, styles: popperStyles, setArrowRef, setTooltipRef, } = useTooltipPositioning();
     initializeListeners();
     const toolTipClassNames = classnames__default["default"](styles.tooltipWrapper, placement === "bottom" && styles.below, placement === "top" && styles.above);
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement("span", { className: styles.shadowActivator, ref: shadowRef }),
         children,
-        React__default["default"].createElement(TooltipPortal, null, show && Boolean(message) && (React__default["default"].createElement("div", Object.assign({ className: toolTipClassNames, style: popperStyles.popper, ref: setTooltipRef, role: "tooltip" }, attributes.popper),
+        mounted.current ? (React__default["default"].createElement(TooltipPortal, null, show && Boolean(message) && (React__default["default"].createElement("div", Object.assign({ className: toolTipClassNames, style: popperStyles.popper, ref: setTooltipRef, role: "tooltip" }, attributes.popper),
             React__default["default"].createElement(framerMotion.motion.div, { className: styles.tooltip, variants: variation, initial: "startOrStop", animate: "done", exit: "startOrStop", transition: {
                     damping: 50,
                     stiffness: 500,
                 } },
                 React__default["default"].createElement("p", { className: styles.tooltipMessage }, message),
-                React__default["default"].createElement("div", { ref: setArrowRef, style: popperStyles.arrow, className: styles.arrow })))))));
+                React__default["default"].createElement("div", { ref: setArrowRef, style: popperStyles.arrow, className: styles.arrow })))))) : null));
     function initializeListeners() {
         const showTooltip = () => {
             setShow(true);
@@ -95,7 +98,7 @@ function Tooltip({ message, children }) {
                 activator.removeEventListener("blur", hideTooltip);
             }
         };
-        React.useLayoutEffect(() => {
+        useSafeLayoutEffect.useSafeLayoutEffect(() => {
             injectAttributes();
             addListeners();
             return () => {

package/dist/Typography/Typography.d.ts

@@ -31,7 +31,7 @@ interface TypographyProps {
     readonly align?: keyof typeof alignment;
     readonly fontFamily?: keyof typeof fontFamilies;
     readonly children: ReactNode;
-    numberOfLines?: number;
+    readonly numberOfLines?: number;
 }
 export type TypographyOptions = Omit<TypographyProps, "children">;
 export declare function Typography({ id, children, element: Tag, size, align, fontWeight, textCase, textColor, emphasisType, numberOfLines, fontFamily, }: TypographyProps): JSX.Element;

package/dist/Typography/css/TextColors.css.d.ts

@@ -12,6 +12,7 @@ declare const styles: {
   readonly "heading": string;
   readonly "text": string;
   readonly "textSecondary": string;
+  readonly "inactive": string;
   readonly "critical": string;
   readonly "warning": string;
   readonly "informative": string;

package/dist/Typography/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Typography = require('../Typography-c45bf216.js');
+var Typography = require('../Typography-e2a23b7e.js');
 require('react');
 require('classnames');
 require('../style-inject.es-9d2f5f4e.js');

package/dist/{Typography-c45bf216.js → Typography-e2a23b7e.js}

@@ -25,8 +25,8 @@ var css_248z$5 = ".xE6cC62h5G0- {\n  text-transform: uppercase;\n}\n\n.HlqJJ3Cl7
 var textCases = {"uppercase":"xE6cC62h5G0-","lowercase":"HlqJJ3Cl7dE-","capitalize":"Loe26JnDfco-"};
 styleInject_es.styleInject(css_248z$5);
 
-var css_248z$4 = ".pkqoq2KXY9w- {\n  color: rgb(1, 41, 57);\n  color: var(--color-blue);\n}\n\n.ftVHRSii3ro- {\n  color: rgb(181, 181, 181);\n  color: var(--color-grey);\n}\n\n.FQbGABZWVzA- {\n  color: rgb(66, 78, 86);\n  color: var(--color-greyBlue--dark);\n}\n\n.zQaB9J0-vrs- {\n  color: rgba(101, 120, 132, 1);\n  color: var(--color-greyBlue);\n}\n\n._4-xdzcqT-Us- {\n  color: rgb(125, 176, 14);\n  color: var(--color-green);\n}\n\n.Zp9E7ELPjPA- {\n  color: rgb(201, 66, 33);\n  color: var(--color-red);\n}\n\n.v-Fo4PwPxDI- {\n  color: rgb(221, 195, 15);\n  color: var(--color-yellow);\n}\n\n.YrGUIChAZC0- {\n  color: rgb(144, 127, 10);\n  color: var(--color-yellow--dark);\n}\n\n.r7JcIVoDcTY- {\n  color: rgb(60, 162, 224);\n  color: var(--color-lightBlue);\n}\n\n._6RXTyd198iM- {\n  color: rgba(255, 255, 255, 1);\n  color: var(--color-white);\n}\n\n.fLix4jA-RkU- {\n  color: rgb(1, 41, 57);\n  color: var(--color-heading);\n}\n\n._1g0uMAwFAsk- {\n  color: rgb(66, 78, 86);\n  color: var(--color-text);\n}\n\n.oXqFAHwT6y4- {\n  color: rgb(77, 105, 116);\n  color: var(--color-text--secondary);\n}\n\n.rWkzi9HFNDU- {\n  color: rgb(201, 66, 33);\n  color: var(--color-critical);\n}\n\n.PQLYQKGCmPI- {\n  color: rgb(144, 127, 10);\n  color: var(--color-warning--onSurface);\n}\n\n.L6bBDJrx-m0- {\n  color: rgb(39, 105, 146);\n  color: var(--color-informative--onSurface);\n}\n\n.bJDJJKvmT90- {\n  color: rgb(81, 114, 9);\n  color: var(--color-success--onSurface);\n}\n\n._3g4iYm8XwkM- {\n  color: rgb(181, 181, 181);\n  color: var(--color-disabled);\n}\n";
-var textColors = {"blue":"pkqoq2KXY9w-","grey":"ftVHRSii3ro-","greyBlueDark":"FQbGABZWVzA-","greyBlue":"zQaB9J0-vrs-","green":"_4-xdzcqT-Us-","red":"Zp9E7ELPjPA-","yellow":"v-Fo4PwPxDI-","yellowDark":"YrGUIChAZC0-","lightBlue":"r7JcIVoDcTY-","white":"_6RXTyd198iM-","heading":"fLix4jA-RkU-","text":"_1g0uMAwFAsk-","textSecondary":"oXqFAHwT6y4-","critical":"rWkzi9HFNDU-","warning":"PQLYQKGCmPI-","informative":"L6bBDJrx-m0-","success":"bJDJJKvmT90-","disabled":"_3g4iYm8XwkM-"};
+var css_248z$4 = ".pkqoq2KXY9w- {\n  color: rgb(1, 41, 57);\n  color: var(--color-blue);\n}\n\n.ftVHRSii3ro- {\n  color: rgb(181, 181, 181);\n  color: var(--color-grey);\n}\n\n.FQbGABZWVzA- {\n  color: rgb(66, 78, 86);\n  color: var(--color-greyBlue--dark);\n}\n\n.zQaB9J0-vrs- {\n  color: rgba(101, 120, 132, 1);\n  color: var(--color-greyBlue);\n}\n\n._4-xdzcqT-Us- {\n  color: rgb(125, 176, 14);\n  color: var(--color-green);\n}\n\n.Zp9E7ELPjPA- {\n  color: rgb(201, 66, 33);\n  color: var(--color-red);\n}\n\n.v-Fo4PwPxDI- {\n  color: rgb(221, 195, 15);\n  color: var(--color-yellow);\n}\n\n.YrGUIChAZC0- {\n  color: rgb(144, 127, 10);\n  color: var(--color-yellow--dark);\n}\n\n.r7JcIVoDcTY- {\n  color: rgb(60, 162, 224);\n  color: var(--color-lightBlue);\n}\n\n._6RXTyd198iM- {\n  color: rgba(255, 255, 255, 1);\n  color: var(--color-white);\n}\n\n.fLix4jA-RkU- {\n  color: rgb(1, 41, 57);\n  color: var(--color-heading);\n}\n\n._1g0uMAwFAsk- {\n  color: rgb(66, 78, 86);\n  color: var(--color-text);\n}\n\n.oXqFAHwT6y4- {\n  color: rgb(77, 105, 116);\n  color: var(--color-text--secondary);\n}\n\n.gPhKMwPfrsw- {\n  color: rgb(1, 27, 37);\n  color: var(--color-inactive--onSurface);\n}\n\n.rWkzi9HFNDU- {\n  color: rgb(128, 25, 0);\n  color: var(--color-critical--onSurface);\n}\n\n.PQLYQKGCmPI- {\n  color: rgb(144, 127, 10);\n  color: var(--color-warning--onSurface);\n}\n\n.L6bBDJrx-m0- {\n  color: rgb(39, 105, 146);\n  color: var(--color-informative--onSurface);\n}\n\n.bJDJJKvmT90- {\n  color: rgb(81, 114, 9);\n  color: var(--color-success--onSurface);\n}\n\n._3g4iYm8XwkM- {\n  color: rgb(181, 181, 181);\n  color: var(--color-disabled);\n}\n";
+var textColors = {"blue":"pkqoq2KXY9w-","grey":"ftVHRSii3ro-","greyBlueDark":"FQbGABZWVzA-","greyBlue":"zQaB9J0-vrs-","green":"_4-xdzcqT-Us-","red":"Zp9E7ELPjPA-","yellow":"v-Fo4PwPxDI-","yellowDark":"YrGUIChAZC0-","lightBlue":"r7JcIVoDcTY-","white":"_6RXTyd198iM-","heading":"fLix4jA-RkU-","text":"_1g0uMAwFAsk-","textSecondary":"oXqFAHwT6y4-","inactive":"gPhKMwPfrsw-","critical":"rWkzi9HFNDU-","warning":"PQLYQKGCmPI-","informative":"L6bBDJrx-m0-","success":"bJDJJKvmT90-","disabled":"_3g4iYm8XwkM-"};
 styleInject_es.styleInject(css_248z$4);
 
 var css_248z$3 = ".Jys1uy2pQXw- {\n  font-style: italic;\n}\n\n.kd2u0dL-if0- {\n  display: inline;\n  font-family: inherit;\n  font-style: normal;\n  font-weight: inherit;\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 84 8' fill='none' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 6.50004C14.6667 4.50004 49.3 0.900038 82.5 2.50004' stroke='%2384EA00' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E\");\n  background-position: center bottom;\n  background-repeat: no-repeat;\n  background-size: 100% 20%;\n}\n";

package/dist/useAtlantisConfig-ed0bee66.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var useSafeLayoutEffect = require('@jobber/hooks/useSafeLayoutEffect');
+var React = require('react');
+
+// For retheme purposes only.
+// This will be removed once the retheme is out of the experiment.
+function useAtlantisConfig() {
+    const [JOBBER_RETHEME, setJOBBER_RETHEME] = React.useState(false);
+    useSafeLayoutEffect.useSafeLayoutEffect(() => {
+        setJOBBER_RETHEME(document.body.classList.contains("jobber-retheme"));
+    }, []);
+    return { JOBBER_RETHEME };
+}
+
+exports.useAtlantisConfig = useAtlantisConfig;

package/dist/utils/useAtlantisConfig.d.ts

@@ -0,0 +1,3 @@
+export declare function useAtlantisConfig(): {
+    JOBBER_RETHEME: boolean;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "4.79.0",
+  "version": "4.79.1-JOB-85851.2+01528d89",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,9 +19,9 @@
     "dist/*"
   ],
   "dependencies": {
-    "@jobber/design": "^0.53.0",
-    "@jobber/formatters": "*",
-    "@jobber/hooks": "^2.8.2",
+    "@jobber/design": "^0.56.0",
+    "@jobber/formatters": "^0.2.2",
+    "@jobber/hooks": "^2.9.1",
     "@popperjs/core": "^2.0.6",
     "@std-proposal/temporal": "0.0.1",
     "@tanstack/react-table": "8.5.13",
@@ -30,8 +30,7 @@
     "@types/react-datepicker": "^4.8.0",
     "@types/react-router": "5.1.7",
     "@types/react-router-dom": "^5.3.3",
-    "@types/uuid": "^8.3.3",
-    "axios": "^0.21.2",
+    "axios": "^1.6.0",
     "classnames": "^2.3.2",
     "color": "^3.1.2",
     "filesize": "^6.1.0",
@@ -45,8 +44,7 @@
     "react-popper": "^2.2.5",
     "react-router-dom": "^5.3.4",
     "time-input-polyfill": "^1.0.7",
-    "ts-xor": "^1.0.8",
-    "uuid": "^8.3.2"
+    "ts-xor": "^1.0.8"
   },
   "devDependencies": {
     "@csstools/postcss-global-data": "^1.0.3",
@@ -59,7 +57,6 @@
     "@types/glob": "^7.1.1",
     "@types/react": "^18.0.28",
     "@types/react-dom": "^18.0.11",
-    "@types/uuid": "^8.3.3",
     "autoprefixer": "^9.5.1",
     "copyfiles": "^2.4.1",
     "glob": "^7.1.4",
@@ -72,8 +69,7 @@
     "rollup-plugin-multi-input": "^1.4.1",
     "rollup-plugin-postcss": "^4.0.2",
     "typed-css-modules": "^0.7.0",
-    "typescript": "^4.9.5",
-    "uuid": "^8.3.2"
+    "typescript": "^4.9.5"
   },
   "peerDependencies": {
     "react": "^18",
@@ -84,5 +80,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "01c73a7bc9171ba85c75f5f0f5046baf8469f35a"
+  "gitHead": "01528d8948aeb7aefdd1045fb1911b68eec74787"
 }

package/rollup.config.js

@@ -117,7 +117,6 @@ export default {
     "color",
     "framer-motion",
     "classnames",
-    "uuid",
     new RegExp("lodash/.*"),
     "@std-proposal/temporal",
     "@jobber/design",

package/dist/getAtlantisConfig-0f3e8af2.js

@@ -1,13 +0,0 @@
-'use strict';
-
-// For retheme purposes only.
-// This will be removed once the retheme is out of the experiment.
-function getAtlantisConfig() {
-    let JOBBER_RETHEME = false;
-    if (typeof window !== "undefined") {
-        JOBBER_RETHEME = document.body.classList.contains("jobber-retheme");
-    }
-    return { JOBBER_RETHEME };
-}
-
-exports.getAtlantisConfig = getAtlantisConfig;

package/dist/utils/getAtlantisConfig.d.ts

@@ -1,3 +0,0 @@
-export declare function getAtlantisConfig(): {
-    JOBBER_RETHEME: boolean;
-};