@jobber/components 4.67.2-rm-investi.12 → 4.67.2

package/dist/Autocomplete/index.js

@@ -13,11 +13,11 @@ var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
 var Text = require('../Text-4a2bc89f.js');
 var Icon = require('../Icon-405a216c.js');
 var Heading = require('../Heading-0f4ecb0c.js');
-var useSafeLayoutEffect = require('../useSafeLayoutEffect-acf48897.js');
-var InputText = require('../InputText-d8f8fa30.js');
+var InputText = require('../InputText-f7c45ee5.js');
 require('../Typography-973b122e.js');
 require('@jobber/design');
-require('../FormField-4fbb40e0.js');
+require('../FormField-dfc061ca.js');
+require('uuid');
 require('react-hook-form');
 require('../Button-163a0641.js');
 require('react-router-dom');
@@ -125,7 +125,7 @@ function useRepositionMenu(attachTo, visible = false) {
             { name: "flip", options: { fallbackPlacements: ["top"] } },
         ],
     });
-    useSafeLayoutEffect.useSafeLayoutEffect(() => {
+    React.useLayoutEffect(() => {
         var _a;
         (_a = popper === null || popper === void 0 ? void 0 : popper.update) === null || _a === void 0 ? void 0 : _a.call(popper);
     }, [visible]);

package/dist/Card/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Card = require('../Card-77f411da.js');
+var Card = require('../Card-3178033c.js');
 require('react');
 require('classnames');
 require('../style-inject.es-9d2f5f4e.js');
@@ -12,11 +12,11 @@ require('../Button-163a0641.js');
 require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Menu-f1ec7cdf.js');
+require('../Menu-d7ea093c.js');
+require('uuid');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
 require('@jobber/hooks/useRefocusOnActivator');
-require('../useSafeLayoutEffect-acf48897.js');
 
 
 

package/dist/{Card-77f411da.js → Card-3178033c.js}

@@ -5,7 +5,7 @@ var classnames = require('classnames');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var Heading = require('./Heading-0f4ecb0c.js');
 var Button = require('./Button-163a0641.js');
-var Menu = require('./Menu-f1ec7cdf.js');
+var Menu = require('./Menu-d7ea093c.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/Chip/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Chip = require('../Chip-f0a38fb2.js');
+var Chip = require('../Chip-168acf3e.js');
 var tslib_es6 = require('../tslib.es6-5b8768b7.js');
 var React = require('react');
 var Icon = require('../Icon-405a216c.js');
@@ -12,12 +12,10 @@ require('../style-inject.es-9d2f5f4e.js');
 require('../Avatar-76a799fa.js');
 require('color');
 require('../Typography-973b122e.js');
-require('../Tooltip-1fea5901.js');
+require('../Tooltip-6b12f1c2.js');
 require('react-dom');
 require('framer-motion');
 require('react-popper');
-require('../ClientOnly-ed1c24c0.js');
-require('../useSafeLayoutEffect-acf48897.js');
 require('@jobber/design');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/dist/{Chip-f0a38fb2.js → Chip-168acf3e.js}

@@ -7,7 +7,7 @@ var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var Avatar = require('./Avatar-76a799fa.js');
 var Icon = require('./Icon-405a216c.js');
 var Typography = require('./Typography-973b122e.js');
-var Tooltip = require('./Tooltip-1fea5901.js');
+var Tooltip = require('./Tooltip-6b12f1c2.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/Chips/index.js

@@ -9,7 +9,7 @@ var useAssert = require('@jobber/hooks/useAssert');
 var Icon = require('../Icon-405a216c.js');
 var Avatar = require('../Avatar-76a799fa.js');
 var Typography = require('../Typography-973b122e.js');
-var Tooltip = require('../Tooltip-1fea5901.js');
+var Tooltip = require('../Tooltip-6b12f1c2.js');
 var uuid = require('uuid');
 var sortBy = require('lodash/sortBy');
 var useLiveAnnounce = require('@jobber/hooks/useLiveAnnounce');
@@ -22,8 +22,6 @@ require('@jobber/design');
 require('color');
 require('react-dom');
 require('framer-motion');
-require('../ClientOnly-ed1c24c0.js');
-require('../useSafeLayoutEffect-acf48897.js');
 require('react-router-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/dist/Combobox/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Combobox = require('../Combobox-37194fe2.js');
+var Combobox = require('../Combobox-8e18b6e5.js');
 require('react');
 require('classnames');
 require('react-dom');
@@ -18,14 +18,12 @@ require('@jobber/hooks/useRefocusOnActivator');
 require('@jobber/hooks/useFocusTrap');
 require('react-popper');
 require('@jobber/hooks/useOnKeyDown');
-require('../Chip-f0a38fb2.js');
+require('../Chip-168acf3e.js');
 require('@jobber/hooks/useInView');
 require('../Avatar-76a799fa.js');
 require('color');
-require('../Tooltip-1fea5901.js');
+require('../Tooltip-6b12f1c2.js');
 require('framer-motion');
-require('../ClientOnly-ed1c24c0.js');
-require('../useSafeLayoutEffect-acf48897.js');
 require('@jobber/hooks/useAssert');
 
 

package/dist/{Combobox-37194fe2.js → Combobox-8e18b6e5.js}

@@ -13,7 +13,7 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
 var useFocusTrap = require('@jobber/hooks/useFocusTrap');
 var reactPopper = require('react-popper');
 var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
-var Chip = require('./Chip-f0a38fb2.js');
+var Chip = require('./Chip-168acf3e.js');
 require('@jobber/design');
 var useAssert = require('@jobber/hooks/useAssert');
 
@@ -55,8 +55,8 @@ function ComboboxContentSearch(props) {
     }
 }
 
-var css_248z$4 = ".SgMzjOcdE-E- {\n  position: relative;\n  padding: calc(16px / 2) 0;\n  padding: var(--space-small) 0;\n}\n\n.TwoTCjgcssc- {\n  display: -ms-flexbox;\n  display: flex;\n  max-height: calc((16px / 2) * 33.33);\n  max-height: calc(calc(16px / 2) * 33.33);\n  max-height: calc(var(--space-small) * 33.33);\n  margin: 0;\n  padding: 0;\n  overflow: scroll;\n  list-style: none;\n  -ms-flex-direction: column;\n      flex-direction: column;\n  gap: calc(16px / 4);\n  gap: var(--space-smaller);\n}\n\n._8T5M7MGwCRE-,\n._4y5NXkNeIQM- {\n  padding: calc(16px / 2) calc(16px * 1);\n  padding: var(--space-small) var(--space-base);\n}\n\n.SgMzjOcdE-E-::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  right: 0;\n  bottom: calc(16px / 2);\n  bottom: var(--space-small);\n  left: 0;\n  height: calc(16px * 1);\n  height: var(--space-base);\n  background: linear-gradient(\n    180deg,\n    rgba(255, 255, 255, 0) 0%,\n    rgb(255, 255, 255) 100%\n  );\n  pointer-events: none;\n}\n\n.SgMzjOcdE-E-::before {\n  content: \"\";\n  display: block;\n  position: absolute;\n  top: calc(16px / 2);\n  top: var(--space-small);\n  right: 0;\n  left: 0;\n  height: calc(16px * 1);\n  height: var(--space-base);\n  background: linear-gradient(\n    to bottom,\n    rgba(255, 255, 255, 1),\n    rgba(255, 255, 255, 0)\n  );\n  pointer-events: none;\n}\n";
-var styles$4 = {"container":"SgMzjOcdE-E-","optionsList":"TwoTCjgcssc-","filterMessage":"_8T5M7MGwCRE-","emptyStateMessage":"_4y5NXkNeIQM-"};
+var css_248z$4 = ".SgMzjOcdE-E- {\n  position: relative;\n  padding: calc(16px / 2) 0;\n  padding: var(--space-small) 0;\n}\n\n.TwoTCjgcssc- {\n  display: -ms-flexbox;\n  display: flex;\n  max-height: calc((16px / 2) * 33.33);\n  max-height: calc(calc(16px / 2) * 33.33);\n  max-height: calc(var(--space-small) * 33.33);\n  margin: 0;\n  padding: 0;\n  overflow: scroll;\n  list-style: none;\n  -ms-flex-direction: column;\n      flex-direction: column;\n  gap: calc(16px / 4);\n  gap: var(--space-smaller);\n}\n\n._8T5M7MGwCRE-,\n._4y5NXkNeIQM- {\n  padding: calc(16px / 2) calc(16px * 1);\n  padding: var(--space-small) var(--space-base);\n}\n\n.SgMzjOcdE-E-::before,\n.SgMzjOcdE-E-::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  right: 0;\n  left: 0;\n  height: calc(16px * 1);\n  height: var(--space-base);\n  pointer-events: none;\n  transition: opacity 0.3s ease-in-out;\n}\n\n.SgMzjOcdE-E-::after {\n  bottom: calc(16px / 2);\n  bottom: var(--space-small);\n  background: linear-gradient(\n    180deg,\n    rgba(255, 255, 255, 0) 0%,\n    rgb(255, 255, 255) 100%\n  );\n}\n\n.SgMzjOcdE-E-::before {\n  top: calc(16px / 2);\n  top: var(--space-small);\n  background: linear-gradient(\n    to bottom,\n    rgba(255, 255, 255, 1),\n    rgba(255, 255, 255, 0)\n  );\n}\n\n.T6E3VwBGoQM-::before,\n._6HQzxMQkXnE-::before {\n  opacity: 0;\n}\n\n._5YsJZyMDkbA-::after,\n._6HQzxMQkXnE-::after {\n  opacity: 0;\n}\n";
+var styles$4 = {"container":"SgMzjOcdE-E-","optionsList":"TwoTCjgcssc-","filterMessage":"_8T5M7MGwCRE-","emptyStateMessage":"_4y5NXkNeIQM-","scrollTop":"T6E3VwBGoQM-","scrollNone":"_6HQzxMQkXnE-","scrollBottom":"_5YsJZyMDkbA-"};
 styleInject_es.styleInject(css_248z$4);
 
 var css_248z$3 = "._5QdRGmaNHvc- {\n  display: -ms-flexbox;\n  display: flex;\n  min-height: calc((calc(16px * 3) - calc(16px / 4)));\n  min-height: calc((var(--space-largest) - var(--space-smaller)));\n  box-sizing: border-box;\n  margin: 0 calc(16px / 2);\n  margin: 0 var(--space-small);\n  padding: calc(16px / 2);\n  padding: var(--space-small);\n  border-radius: calc(16px / 4);\n  border-radius: var(--radius-large);\n  color: rgb(1, 41, 57);\n  color: var(--color-heading);\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 200ms;\n  transition: all var(--timing-base);\n  -ms-flex-pack: justify;\n      justify-content: space-between;\n  -ms-flex-align: center;\n      align-items: center;\n}\n\n._5QdRGmaNHvc-:hover,\n._5QdRGmaNHvc-:focus-visible {\n  background-color: rgb(238, 240, 242);\n  background-color: var(--color-surface--background);\n}\n\n._5QdRGmaNHvc-:focus,\n._5QdRGmaNHvc-:focus-visible {\n  outline: none;\n}\n\n._5QdRGmaNHvc-:focus-visible {\n  box-shadow: 0px 0px 0px calc(16px / 8) rgba(255, 255, 255, 1),\n    0px 0px 0px calc(16px / 4) rgb(147, 161, 169);\n  box-shadow: var(--shadow-focus);\n}\n";
@@ -79,7 +79,39 @@ function ComboboxOption(props) {
 }
 
 function ComboboxContentList(props) {
-    return (React__default["default"].createElement("div", { className: styles$4.container },
+    const [listScrollState, setlistScrollState] = React.useState("");
+    React.useEffect(() => {
+        const handleScroll = () => {
+            if (props.optionsListRef.current) {
+                const { scrollTop, clientHeight, scrollHeight } = props.optionsListRef.current;
+                if (scrollHeight === clientHeight) {
+                    setlistScrollState("scrollNone");
+                }
+                else if (scrollTop === 0) {
+                    setlistScrollState("scrollTop");
+                }
+                else if (scrollTop + clientHeight === scrollHeight) {
+                    setlistScrollState("scrollBottom");
+                }
+                else {
+                    setlistScrollState("");
+                }
+            }
+        };
+        if (!props.showEmptyState && props.options.length === 0) {
+            handleScroll();
+        }
+        if (props.optionsListRef.current) {
+            props.optionsListRef.current.addEventListener("scroll", handleScroll);
+            handleScroll();
+        }
+        return () => {
+            if (props.optionsListRef.current) {
+                props.optionsListRef.current.removeEventListener("scroll", handleScroll);
+            }
+        };
+    }, [props.options]);
+    return (React__default["default"].createElement("div", { className: classnames__default["default"](styles$4.container, styles$4[listScrollState]) },
         !props.showEmptyState && props.options.length > 0 && (React__default["default"].createElement("ul", { className: styles$4.optionsList, role: "listbox", "aria-multiselectable": props.multiselect, ref: props.optionsListRef }, !props.showEmptyState &&
             props.options.map(option => {
                 return (React__default["default"].createElement(ComboboxOption, { key: option.id, id: option.id, label: option.label }));

package/dist/ConfirmationModal/index.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var ConfirmationModal = require('../ConfirmationModal-c7105cf2.js');
+var ConfirmationModal = require('../ConfirmationModal-0f85d96c.js');
 require('react');
 require('@jobber/hooks/useOnKeyDown');
-require('../Modal-dd931b54.js');
+require('../Modal-70daa0e2.js');
 require('react-dom');
 require('classnames');
 require('framer-motion');
@@ -19,11 +19,9 @@ require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
 require('../ButtonDismiss-2b98d075.js');
-require('../ClientOnly-ed1c24c0.js');
 require('../Content-2ca1ffe1.js');
-require('../Markdown-9a140a08.js');
-require('../tslib.es6-5b8768b7.js');
-require('markdown-to-jsx');
+require('../Markdown-96070121.js');
+require('react-markdown');
 require('../Text-4a2bc89f.js');
 require('../Emphasis-b2d1b3aa.js');
 

package/dist/{ConfirmationModal-c7105cf2.js → ConfirmationModal-0f85d96c.js}

@@ -2,9 +2,9 @@
 
 var React = require('react');
 var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
-var Modal = require('./Modal-dd931b54.js');
+var Modal = require('./Modal-70daa0e2.js');
 var Content = require('./Content-2ca1ffe1.js');
-var Markdown = require('./Markdown-9a140a08.js');
+var Markdown = require('./Markdown-96070121.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/DataDump/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var Card = require('../Card-77f411da.js');
+var Card = require('../Card-3178033c.js');
 var Content = require('../Content-2ca1ffe1.js');
 var Emphasis = require('../Emphasis-b2d1b3aa.js');
 require('classnames');
@@ -14,11 +14,11 @@ require('../Button-163a0641.js');
 require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Menu-f1ec7cdf.js');
+require('../Menu-d7ea093c.js');
+require('uuid');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
 require('@jobber/hooks/useRefocusOnActivator');
-require('../useSafeLayoutEffect-acf48897.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/DataList/components/DataListHeader/DataListHeaderCheckbox.d.ts

@@ -1,4 +1,5 @@
-import { ReactElement } from "react";
+/// <reference types="react" />
+import { ReactElement } from "react-markdown/lib/react-markdown";
 interface DataListHeaderCheckbox {
     readonly children: ReactElement;
 }

package/dist/DataList/index.js

@@ -11,7 +11,7 @@ var noop = require('lodash/noop');
 var design = require('@jobber/design');
 var framerMotion = require('framer-motion');
 var classnames = require('classnames');
-var Tooltip = require('../Tooltip-1fea5901.js');
+var Tooltip = require('../Tooltip-6b12f1c2.js');
 var Button = require('../Button-163a0641.js');
 var useInView = require('@jobber/hooks/useInView');
 var isEmpty = require('lodash/isEmpty');
@@ -25,23 +25,21 @@ var ReactDOM = require('react-dom');
 var Checkbox = require('../Checkbox-ad7ec2e7.js');
 var reactRouterDom = require('react-router-dom');
 var AnimatedSwitcher = require('../AnimatedSwitcher-d1e1ddcf.js');
-var Combobox = require('../Combobox-37194fe2.js');
-var Chip = require('../Chip-f0a38fb2.js');
+var Combobox = require('../Combobox-8e18b6e5.js');
+var Chip = require('../Chip-168acf3e.js');
 var Icon = require('../Icon-405a216c.js');
 var debounce = require('lodash/debounce');
-var InputText = require('../InputText-d8f8fa30.js');
+var InputText = require('../InputText-f7c45ee5.js');
 var Spinner = require('../Spinner-9d8fc7ff.js');
 var Typography = require('../Typography-973b122e.js');
 require('../Content-2ca1ffe1.js');
 require('react-popper');
-require('../ClientOnly-ed1c24c0.js');
-require('../useSafeLayoutEffect-acf48897.js');
 require('uuid');
 require('react-hook-form');
 require('@jobber/hooks/useAssert');
 require('../Avatar-76a799fa.js');
 require('color');
-require('../FormField-4fbb40e0.js');
+require('../FormField-dfc061ca.js');
 require('../InputValidation-179f0926.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/dist/DataTable/index.js

@@ -9,11 +9,12 @@ var jobberHooks = require('@jobber/hooks/useResizeObserver');
 var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
 var Glimmer = require('../Glimmer-cfa92a88.js');
 var tslib_es6 = require('../tslib.es6-5b8768b7.js');
-var Option = require('../Option-8d140127.js');
+var Option = require('../Option-469029b5.js');
 var Button = require('../Button-163a0641.js');
 var Text = require('../Text-4a2bc89f.js');
 require('../Content-2ca1ffe1.js');
-require('../FormField-4fbb40e0.js');
+require('../FormField-dfc061ca.js');
+require('uuid');
 require('react-hook-form');
 require('../Icon-405a216c.js');
 require('@jobber/design');

package/dist/FeatureSwitch/index.js

@@ -12,13 +12,12 @@ var Content = require('../Content-2ca1ffe1.js');
 var Switch = require('../Switch-b85272bf.js');
 var Button = require('../Button-163a0641.js');
 var Emphasis = require('../Emphasis-b2d1b3aa.js');
-var Markdown = require('../Markdown-9a140a08.js');
+var Markdown = require('../Markdown-96070121.js');
 require('../Typography-973b122e.js');
 require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../tslib.es6-5b8768b7.js');
-require('markdown-to-jsx');
+require('react-markdown');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/Flex/index.js

@@ -19,9 +19,7 @@ function Flex({ align = "center", children, direction = "row", gap = "base", tem
     return (React__default["default"].createElement("div", { className: classnames__default["default"](styles.flexible, {
             [styles[`${gap}Gap`]]: Boolean(gap),
             [styles[`${align}Align`]]: Boolean(align),
-        }), style: typeof document !== "undefined"
-            ? generateGridStylesFromTemplate(direction, template)
-            : {} }, children));
+        }), style: generateGridStylesFromTemplate(direction, template) }, children));
 }
 function generateGridStylesFromTemplate(direction, layoutTemplate) {
     const containerStyles = {};

package/dist/FormField/index.js

@@ -2,9 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var FormField = require('../FormField-4fbb40e0.js');
+var FormField = require('../FormField-dfc061ca.js');
 require('../tslib.es6-5b8768b7.js');
 require('react');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/{FormField-4fbb40e0.js → FormField-dfc061ca.js}

@@ -2,6 +2,7 @@
 
 var tslib_es6 = require('./tslib.es6-5b8768b7.js');
 var React = require('react');
+var uuid = require('uuid');
 var reactHookForm = require('react-hook-form');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var classnames = require('classnames');
@@ -121,6 +122,8 @@ function FormFieldPostFix({ variation }) {
     return (React__default["default"].createElement("span", { className: styles.postfix }, variation === "select" ? (React__default["default"].createElement(Icon.Icon, { name: "arrowDown" })) : (React__default["default"].createElement(Spinner.Spinner, { size: "small" }))));
 }
 
+// Added 13th statement to accommodate getErrorMessage function
+/*eslint max-statements: ["error", 13]*/
 function FormField(props) {
     var _a, _b;
     const { actionsRef, autocomplete = true, children, defaultValue, description, disabled, inputRef, inline, keyboard, max, maxLength, min, name, readonly, rows, loading, type = "text", validations, value, onChange, onEnter, onFocus, onBlur, onValidation, } = props;
@@ -128,7 +131,14 @@ function FormField(props) {
         ? reactHookForm.useFormContext()
         : // If there isn't a Form Context being provided, get a form for this field.
             reactHookForm.useForm({ mode: "onTouched" });
-    const { controlledName, identifier, descriptionIdentifier } = getNamesAndIds(name);
+    const [identifier] = React.useState(uuid.v1());
+    const [descriptionIdentifier] = React.useState(`descriptionUUID--${uuid.v1()}`);
+    /**
+     * Generate a name if one is not supplied, this is the name
+     * that will be used for react-hook-form and not neccessarily
+     * attached to the DOM
+     */
+    const [controlledName] = React.useState(name ? name : `generatedName--${identifier}`);
     React.useEffect(() => {
         if (value != undefined) {
             setValue(controlledName, value);
@@ -213,18 +223,5 @@ function setAutocomplete(autocompleteSetting) {
     }
     return autocompleteSetting;
 }
-const getNamesAndIds = (name) => {
-    const identifierId = React.useId();
-    const [identifier] = React.useState(identifierId);
-    const descriptionId = React.useId();
-    const [descriptionIdentifier] = React.useState(`descriptionUUID--${descriptionId}`);
-    /**
-     * Generate a name if one is not supplied, this is the name
-     * that will be used for react-hook-form and not neccessarily
-     * attached to the DOM
-     */
-    const [controlledName] = React.useState(name ? name : `generatedName--${identifier}`);
-    return { descriptionIdentifier, controlledName, identifier };
-};
 
 exports.FormField = FormField;

package/dist/FormatFile/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var FormatFile = require('../FormatFile-e91b5454.js');
+var FormatFile = require('../FormatFile-3b650d02.js');
 require('react');
 require('classnames');
 require('filesize');
@@ -12,23 +12,22 @@ require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
 require('../Typography-973b122e.js');
-require('../ConfirmationModal-c7105cf2.js');
+require('../ConfirmationModal-0f85d96c.js');
 require('@jobber/hooks/useOnKeyDown');
-require('../Modal-dd931b54.js');
+require('../Modal-70daa0e2.js');
 require('react-dom');
 require('framer-motion');
 require('@jobber/hooks/useRefocusOnActivator');
 require('@jobber/hooks/useFocusTrap');
 require('../Heading-0f4ecb0c.js');
 require('../ButtonDismiss-2b98d075.js');
-require('../ClientOnly-ed1c24c0.js');
 require('../Content-2ca1ffe1.js');
-require('../Markdown-9a140a08.js');
-require('../tslib.es6-5b8768b7.js');
-require('markdown-to-jsx');
+require('../Markdown-96070121.js');
+require('react-markdown');
 require('../Text-4a2bc89f.js');
 require('../Emphasis-b2d1b3aa.js');
 require('../Glimmer-cfa92a88.js');
+require('../tslib.es6-5b8768b7.js');
 require('../ProgressBar-b68edc8f.js');
 
 

package/dist/{FormatFile-e91b5454.js → FormatFile-3b650d02.js}

@@ -5,7 +5,7 @@ var classnames = require('classnames');
 var getHumanReadableFileSize = require('filesize');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var Button = require('./Button-163a0641.js');
-var ConfirmationModal = require('./ConfirmationModal-c7105cf2.js');
+var ConfirmationModal = require('./ConfirmationModal-0f85d96c.js');
 var Glimmer = require('./Glimmer-cfa92a88.js');
 var Icon = require('./Icon-405a216c.js');
 var Typography = require('./Typography-973b122e.js');

package/dist/Gallery/index.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var classnames = require('classnames');
 var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
-var LightBox = require('../LightBox-5ffee235.js');
-var FormatFile = require('../FormatFile-e91b5454.js');
+var LightBox = require('../LightBox-3f4dbc33.js');
+var FormatFile = require('../FormatFile-3b650d02.js');
 var Button = require('../Button-163a0641.js');
 require('framer-motion');
 require('react-dom');
@@ -14,20 +14,19 @@ require('lodash/debounce');
 require('@jobber/hooks/useRefocusOnActivator');
 require('@jobber/hooks/useOnKeyDown');
 require('@jobber/hooks/useFocusTrap');
-require('../ClientOnly-ed1c24c0.js');
 require('../ButtonDismiss-2b98d075.js');
 require('filesize');
-require('../ConfirmationModal-c7105cf2.js');
-require('../Modal-dd931b54.js');
+require('../ConfirmationModal-0f85d96c.js');
+require('../Modal-70daa0e2.js');
 require('../Heading-0f4ecb0c.js');
 require('../Typography-973b122e.js');
 require('../Content-2ca1ffe1.js');
-require('../Markdown-9a140a08.js');
-require('../tslib.es6-5b8768b7.js');
-require('markdown-to-jsx');
+require('../Markdown-96070121.js');
+require('react-markdown');
 require('../Text-4a2bc89f.js');
 require('../Emphasis-b2d1b3aa.js');
 require('../Glimmer-cfa92a88.js');
+require('../tslib.es6-5b8768b7.js');
 require('../Icon-405a216c.js');
 require('@jobber/design');
 require('../ProgressBar-b68edc8f.js');

package/dist/InputDate/index.js

@@ -4,9 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var omit = require('lodash/omit');
 var React = require('react');
-var FormField = require('../FormField-4fbb40e0.js');
+var FormField = require('../FormField-dfc061ca.js');
 var DatePicker = require('../DatePicker-c18f1739.js');
 require('../tslib.es6-5b8768b7.js');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/InputEmail/index.js

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var FormField = require('../FormField-4fbb40e0.js');
+var FormField = require('../FormField-dfc061ca.js');
 require('../tslib.es6-5b8768b7.js');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/InputNumber/index.js

@@ -2,10 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var InputNumber = require('../InputNumber-667f1330.js');
+var InputNumber = require('../InputNumber-d9ebabaa.js');
 require('react');
-require('../FormField-4fbb40e0.js');
+require('../FormField-dfc061ca.js');
 require('../tslib.es6-5b8768b7.js');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/{InputNumber-667f1330.js → InputNumber-d9ebabaa.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var FormField = require('./FormField-4fbb40e0.js');
+var FormField = require('./FormField-dfc061ca.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/InputPassword/index.js

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var FormField = require('../FormField-4fbb40e0.js');
+var FormField = require('../FormField-dfc061ca.js');
 require('../tslib.es6-5b8768b7.js');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/InputPhoneNumber/index.js

@@ -6,7 +6,8 @@ var tslib_es6 = require('../tslib.es6-5b8768b7.js');
 var React = require('react');
 var reactHookForm = require('react-hook-form');
 var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
-var FormField = require('../FormField-4fbb40e0.js');
+var FormField = require('../FormField-dfc061ca.js');
+require('uuid');
 require('classnames');
 require('../Button-163a0641.js');
 require('react-router-dom');

package/dist/InputText/index.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var InputText = require('../InputText-d8f8fa30.js');
+var InputText = require('../InputText-f7c45ee5.js');
 require('react');
-require('../useSafeLayoutEffect-acf48897.js');
-require('../FormField-4fbb40e0.js');
+require('../FormField-dfc061ca.js');
 require('../tslib.es6-5b8768b7.js');
+require('uuid');
 require('react-hook-form');
 require('../style-inject.es-9d2f5f4e.js');
 require('classnames');

package/dist/{InputText-d8f8fa30.js → InputText-f7c45ee5.js}

@@ -1,8 +1,7 @@
 'use strict';
 
 var React = require('react');
-var useSafeLayoutEffect = require('./useSafeLayoutEffect-acf48897.js');
-var FormField = require('./FormField-4fbb40e0.js');
+var FormField = require('./FormField-dfc061ca.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -35,7 +34,7 @@ function InputTextInternal(props, ref) {
             }
         },
     }));
-    useSafeLayoutEffect.useSafeLayoutEffect(() => {
+    React.useLayoutEffect(() => {
         if (inputRef && inputRef.current instanceof HTMLTextAreaElement) {
             resize(inputRef.current);
         }