@jobber/components 4.79.1 → 4.79.2-STCJS-to-.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "4.79.1",
+  "version": "4.79.2-STCJS-to-.2+561925cc",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,8 +19,8 @@
     "dist/*"
   ],
   "dependencies": {
-    "@jobber/design": "^0.53.0",
-    "@jobber/formatters": "*",
+    "@jobber/design": "^0.53.1-STCJS-to-.27+561925cc",
+    "@jobber/formatters": "^0.2.2",
     "@jobber/hooks": "^2.8.2",
     "@popperjs/core": "^2.0.6",
     "@std-proposal/temporal": "0.0.1",
@@ -30,7 +30,6 @@
     "@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",
     "classnames": "^2.3.2",
     "color": "^3.1.2",
@@ -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": "78a7f41466245e133f4966509bea0e4121c3e77c"
+  "gitHead": "561925cc726c68a73c445026bd0c777dd66f0edf"
 }

package/rollup.config.js

@@ -1,19 +1,13 @@
 /* eslint-disable import/no-default-export */
-import multiInput from "rollup-plugin-multi-input";
 import typescript from "@rollup/plugin-typescript";
 import postcss from "rollup-plugin-postcss";
-import commonjs from "@rollup/plugin-commonjs";
-import copy from "rollup-plugin-copy";
+import postcssImport from "postcss-import";
+import autoprefixer from "autoprefixer";
+import postcssPresetEnv from "postcss-preset-env";
 
 export default {
-  input: `src/*/index.{ts,tsx}`,
+  input: `src/index.tsx`,
   plugins: [
-    multiInput(),
-    typescript({
-      tsconfig: "./tsconfig.rollup.json",
-      declarationDir: "dist",
-      noEmitOnError: true,
-    }),
     postcss({
       modules: {
         generateScopedName: "[hash:base64]",
@@ -21,84 +15,28 @@ export default {
       },
       autoModules: false,
       plugins: [
-        require("postcss-import"),
-        require("autoprefixer"),
-        require("@csstools/postcss-global-data")({
-          files: [
-            require.resolve("@jobber/design/foundation.css"),
-            require.resolve("@jobber/design/src/responsiveBreakpoints.css"),
+        postcssImport({
+          path: [
+            "@jobber/design/foundation.css",
+            "@jobber/design/src/responsiveBreakpoints.css",
           ],
         }),
-        require("postcss-preset-env")({
+        autoprefixer,
+        postcssPresetEnv({
           stage: 1,
           preserve: true,
         }),
       ],
     }),
-    commonjs({
-      ignore: ["time-input-polyfill", "time-input-polyfill/supportsTime"],
-    }),
-    copy({
-      targets: [
-        { src: "src/Card/colors.css.d.ts", dest: "dist/Card" },
-        { src: "src/Content/Spacing.css.d.ts", dest: "dist/Content" },
-        { src: "src/Gallery/Gallery.css.d.ts", dest: "dist/Gallery" },
-        { src: "src/Grid/GridAlign.css.d.ts", dest: "dist/Grid" },
-        { src: "src/Modal/Sizes.css.d.ts", dest: "dist/Modal" },
-        { src: "src/ProgressBar/Sizes.css.d.ts", dest: "dist/ProgressBar" },
-        {
-          src: "src/Typography/css/Emphasis.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/FontFamilies.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/FontSizes.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/FontWeights.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/TextAlignment.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/TextCases.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/TextColors.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/Truncate.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        {
-          src: "src/Typography/css/Typography.css.d.ts",
-          dest: "dist/Typography/css",
-        },
-        { src: "src/Glimmer/style/Shape.css.d.ts", dest: "dist/Glimmer/style" },
-        { src: "src/Glimmer/style/Sizes.css.d.ts", dest: "dist/Glimmer/style" },
-        {
-          src: "src/Glimmer/style/Timing.css.d.ts",
-          dest: "dist/Glimmer/style",
-        },
-        {
-          src: "src/Combobox/components/ComboboxContent/ComboboxContentList/ComboboxContent.css.d.ts",
-          dest: "dist/Combobox/components/ComboboxContent/ComboboxContentList",
-        },
-      ],
+    typescript({
+      tsconfig: "./tsconfig.rollup.json",
+      noEmitOnError: true,
     }),
   ],
   output: [
     {
-      dir: "dist",
-      format: "cjs",
+      file: "dist/index.js",
+      format: "esm",
     },
   ],
   external: [
@@ -117,7 +55,6 @@ export default {
     "color",
     "framer-motion",
     "classnames",
-    "uuid",
     new RegExp("lodash/.*"),
     "@std-proposal/temporal",
     "@jobber/design",

package/dist/AnimatedPresence/index.js

@@ -1,12 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var AnimatedPresence = require('../AnimatedPresence-20a02aaa.js');
-require('react');
-require('framer-motion');
-require('@jobber/design');
-
-
-
-exports.AnimatedPresence = AnimatedPresence.AnimatedPresence;

package/dist/AnimatedPresence-20a02aaa.js

@@ -1,104 +0,0 @@
-'use strict';
-
-var React = require('react');
-var framerMotion = require('framer-motion');
-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);
-
-const TIMING_QUICK = toSeconds(design.tokens["timing-quick"]);
-const TIMING_BASE = toSeconds(design.tokens["timing-base"]);
-const baseTransition = {
-    visible: { opacity: 1 },
-    hidden: { opacity: 0 },
-};
-const fade = {
-    visible: { opacity: 1 },
-    hidden: { opacity: 0 },
-};
-const popIn = {
-    visible: Object.assign({ scale: 1 }, baseTransition.visible),
-    hidden: Object.assign({ scale: 0.95 }, baseTransition.hidden),
-};
-const fromTop = {
-    visible: Object.assign({ y: 0 }, baseTransition.visible),
-    hidden: Object.assign({ y: -design.tokens["space-base"] }, baseTransition.hidden),
-};
-const fromBottom = {
-    visible: Object.assign({ y: 0 }, baseTransition.visible),
-    hidden: Object.assign({ y: design.tokens["space-base"] }, baseTransition.hidden),
-};
-const fromLeft = {
-    visible: Object.assign({ x: 0 }, baseTransition.visible),
-    hidden: Object.assign({ x: -design.tokens["space-base"] }, baseTransition.hidden),
-};
-const fromRight = {
-    visible: Object.assign({ x: 0 }, baseTransition.visible),
-    hidden: Object.assign({ x: design.tokens["space-base"] }, baseTransition.hidden),
-};
-const fromLeftToRight = {
-    initial: Object.assign({ x: -design.tokens["space-base"] }, baseTransition.hidden),
-    visible: Object.assign({ x: 0 }, baseTransition.visible),
-    hidden: Object.assign({ x: design.tokens["space-base"] }, baseTransition.hidden),
-};
-const fromRightToLeft = {
-    initial: Object.assign({ x: design.tokens["space-base"] }, baseTransition.hidden),
-    visible: Object.assign({ x: 0 }, baseTransition.visible),
-    hidden: Object.assign({ x: -design.tokens["space-base"] }, baseTransition.hidden),
-};
-function toSeconds(ms) {
-    return ms / 1000;
-}
-
-function usePreviousValue(value) {
-    const [previousValue, setPreviousValue] = React.useState(value);
-    React.useEffect(() => {
-        setPreviousValue(value);
-    }, [value]);
-    return [previousValue, setPreviousValue];
-}
-
-const transitions = {
-    fromBottom,
-    fromTop,
-    fromLeft,
-    fromRight,
-    popIn,
-    fromLeftToRight,
-    fromRightToLeft,
-    fade,
-};
-function AnimatedPresence(props) {
-    const shouldReduceMotion = framerMotion.useReducedMotion();
-    if (shouldReduceMotion) {
-        return React__default["default"].createElement(React__default["default"].Fragment, null, props.children);
-    }
-    return React__default["default"].createElement(InternalAnimatedPresence, Object.assign({}, props));
-}
-function InternalAnimatedPresence({ transition = "fromTop", initial = false, children, }) {
-    const transitionVariation = transitions[transition];
-    const hasInitialTransition = "initial" in transitionVariation;
-    const childCount = React.Children.count(children);
-    // Set the initial value to 0 so it staggers the animation on mount when
-    // initial is true.
-    const [lastChildIndex, setLastChildIndex] = usePreviousValue(0);
-    // Whenever the children count changes, update the last index.
-    React.useEffect(() => {
-        setLastChildIndex(childCount - 1);
-    }, [childCount]);
-    return (React__default["default"].createElement(framerMotion.AnimatePresence, { initial: initial, mode: "popLayout" }, React.Children.map(children, (child, i) => child && (React__default["default"].createElement(framerMotion.motion.div, { layout: true, variants: transitionVariation, initial: hasInitialTransition ? "initial" : "hidden", animate: "visible", exit: "hidden", transition: {
-            duration: TIMING_BASE,
-            delay: generateDelayTime(i),
-        } }, child)))));
-    function generateDelayTime(index) {
-        // Don't add a delay if it's already rendered.
-        if (lastChildIndex > index)
-            return 0;
-        // Stagger the animation starting after the previous last child index.
-        return (index - lastChildIndex) * TIMING_QUICK;
-    }
-}
-
-exports.AnimatedPresence = AnimatedPresence;

package/dist/AnimatedSwitcher/index.js

@@ -1,13 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var AnimatedSwitcher = require('../AnimatedSwitcher-3d45ec5d.js');
-require('react');
-require('framer-motion');
-require('../Icon-405a216c.js');
-require('@jobber/design');
-
-
-
-exports.AnimatedSwitcher = AnimatedSwitcher.AnimatedSwitcher;

package/dist/AnimatedSwitcher-3d45ec5d.js

@@ -1,96 +0,0 @@
-'use strict';
-
-var React = require('react');
-var framerMotion = require('framer-motion');
-var Icon = require('./Icon-405a216c.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const DURATION_SIMPLE = 0.1;
-const DURATION_AVERAGE = 0.2;
-const FADE = {
-    visible: { opacity: 1 },
-    hidden: { opacity: 0 },
-};
-const SLIDE_IN_UP = {
-    visible: { y: 0, opacity: 1 },
-    hidden: { y: "10%", opacity: 0 },
-};
-const SLIDE_IN_DOWN = {
-    visible: { y: 0, opacity: 1 },
-    hidden: { y: "-10%", opacity: 0 },
-};
-const SPIN_COUNTER_CLOCK_WISE = {
-    visible: {
-        rotate: 0,
-        scale: 1,
-        transition: { duration: DURATION_AVERAGE, ease: "easeOut" },
-    },
-    hidden: {
-        rotate: 180,
-        scale: 0.6,
-        transition: { duration: DURATION_AVERAGE, ease: "easeIn" },
-    },
-};
-const SPIN_CLOCK_WISE = {
-    visible: {
-        rotate: 0,
-        scale: 1,
-        transition: { duration: DURATION_AVERAGE, ease: "easeOut" },
-    },
-    hidden: {
-        rotate: -180,
-        scale: 0.6,
-        transition: { duration: DURATION_AVERAGE, ease: "easeIn" },
-    },
-};
-
-function AnimatedSwitcher({ initialChild, switched, switchTo, type = "slideFromBottom", }) {
-    const [ref, setRef] = React.useState(null);
-    const isSwitchingBetweenIcons = initialChild.type === Icon.Icon && switchTo.type === Icon.Icon;
-    const { key, transition, child, duration } = getChildData();
-    return (React__default["default"].createElement(framerMotion.AnimatePresence, { mode: "wait", initial: false },
-        React__default["default"].createElement(framerMotion.motion.div, { ref: setRef, key: key, variants: transition, initial: "hidden", animate: "visible", exit: "hidden", transition: { duration }, style: { display: getDisplayValue() } }, child)));
-    function getDisplayValue() {
-        if (ref === null || ref === void 0 ? void 0 : ref.firstElementChild) {
-            return window.getComputedStyle(ref.firstElementChild).display;
-        }
-    }
-    function getChildData() {
-        let data = { key: `${initialChild.type}_1`, child: initialChild };
-        if (switched) {
-            data = { key: `${switchTo.type}_2`, child: switchTo };
-        }
-        return Object.assign(Object.assign({}, data), { transition: getTransitionType(), duration: getTransitionDuration() });
-    }
-    function getTransitionType() {
-        if (isSwitchingBetweenIcons) {
-            if (switched)
-                return SPIN_COUNTER_CLOCK_WISE;
-            return SPIN_CLOCK_WISE;
-        }
-        else if (type === "fade") {
-            return FADE;
-        }
-        else {
-            if (switched)
-                return SLIDE_IN_UP;
-            return SLIDE_IN_DOWN;
-        }
-    }
-    function getTransitionDuration() {
-        switch (type) {
-            case "fade":
-                return DURATION_AVERAGE;
-            default:
-                return DURATION_SIMPLE;
-        }
-    }
-}
-AnimatedSwitcher.Icon = function AnimatedSwitcherIcon({ switchToIcon, switched, initialIcon, }) {
-    return (React__default["default"].createElement(AnimatedSwitcher, { switched: switched, initialChild: React__default["default"].createElement(Icon.Icon, { name: initialIcon }), switchTo: React__default["default"].createElement(Icon.Icon, { name: switchToIcon }) }));
-};
-
-exports.AnimatedSwitcher = AnimatedSwitcher;

package/dist/Autocomplete/index.js

@@ -1,209 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib_es6 = require('../tslib.es6-754e2961.js');
-var React = require('react');
-var debounce = require('lodash/debounce');
-var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
-var classnames = require('classnames');
-var ReactDOM = require('react-dom');
-var reactPopper = require('react-popper');
-var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
-var Text = require('../Text-259af966.js');
-var Icon = require('../Icon-405a216c.js');
-var Heading = require('../Heading-1e8e4bd3.js');
-var InputText = require('../InputText-6e356985.js');
-require('../Typography-c45bf216.js');
-require('@jobber/design');
-require('../getAtlantisConfig-0f3e8af2.js');
-require('../FormField-b4e6c549.js');
-require('uuid');
-require('react-hook-form');
-require('@jobber/hooks/useShowClear');
-require('../Button-b73a5e01.js');
-require('react-router-dom');
-require('../InputValidation-05e839fa.js');
-require('framer-motion');
-require('../Spinner-9d8fc7ff.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
-var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
-
-var css_248z = ".v0Cys9vQ-NE- {\n  position: relative;\n  width: 100%;\n}\n\n.CX-N-e0e6og- {\n  display: none;\n  position: absolute;\n  z-index: calc(6 + 1001);\n  z-index: calc(var(--elevation-menu) + var(--elevation-modal));\n  width: 100%;\n  /* Unfortunately this is how we define our line item picker height in jobber online.\n  This is a concession to maintain visual parity. */\n  max-height: 300px;\n  box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n      rgba(0, 0, 0, 0.1),\n    0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n  box-shadow: var(--shadow-base);\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: calc(16px / 16) solid var(--color-color-border);\n  border: var(--border-base) solid var(--color-color-border);\n  border-radius: calc(16px / 8);\n  border-radius: var(--radius-base);\n  overflow: auto;\n  scroll-behavior: smooth;\n  background-color: rgba(255, 255, 255, 1);\n  background-color: var(--color-surface);\n}\n\n.CX-N-e0e6og- h5 {\n  padding: calc(16px / 2) 0 calc(16px / 4) calc(16px / 2);\n  padding: var(--space-small) 0 var(--space-smaller) var(--space-small);\n  border-bottom: calc(16px / 16) solid rgb(1, 41, 57);\n  border-bottom: var(--border-base) solid var(--color-border--section);\n}\n\n.CX-N-e0e6og-._4PlUaegVpkk- {\n  display: block;\n}\n\n.CX-N-e0e6og-._4PlUaegVpkk-:empty {\n  display: none;\n}\n\n.ucQtG0iwqbo- {\n  display: -ms-flexbox;\n  display: flex;\n  width: 100%;\n  -ms-flex-direction: row;\n      flex-direction: row;\n  -ms-flex-wrap: nowrap;\n      flex-wrap: nowrap;\n  -ms-flex-pack: start;\n      justify-content: flex-start;\n  -ms-flex-line-pack: stretch;\n      align-content: stretch;\n  -ms-flex-align: center;\n      align-items: center;\n  padding: calc(16px / 2);\n  padding: var(--space-small);\n  border: none;\n  text-align: left;\n  list-style: none;\n  background-color: transparent;\n  cursor: pointer;\n  transition: all 200ms;\n  transition: all var(--timing-base);\n}\n\n.ucQtG0iwqbo-:hover,\n.ucQtG0iwqbo-:focus,\n.ucQtG0iwqbo-.r8HS-ma79QE- {\n  background-color: rgb(244, 246, 250);\n  background-color: var(--color-surface--hover);\n  outline-color: rgb(147, 161, 169);\n  outline-color: var(--color-focus);\n}\n\n.ucQtG0iwqbo-.ydwLX44YFZc-:not(:last-child) {\n  border-bottom: calc(16px / 16) solid rgb(217, 223, 225);\n  border-bottom: var(--border-base) solid var(--color-border);\n}\n\n.CX-N-e0e6og-:hover .ucQtG0iwqbo-.r8HS-ma79QE-:not(:hover) {\n  background-color: transparent;\n  outline-color: transparent;\n}\n\n.v0Cys9vQ-NE- .PvUgNoAUG7A-:not(:first-child) {\n  padding-top: calc(16px / 2);\n  padding-top: var(--space-small);\n}\n\n.ucQtG0iwqbo- .DAOOFUZ1BRM- {\n  -ms-flex: 0 1 auto;\n      flex: 0 1 auto;\n  -ms-flex-item-align: auto;\n      align-self: auto;\n  width: calc(16px * 1.5);\n  width: var(--space-large);\n}\n\n.ucQtG0iwqbo- .cjKJFup6hGY- {\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  -ms-flex: 1 100%;\n      flex: 1 100%;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n}\n\n.ucQtG0iwqbo- .hG5zNBuI2wA- {\n  -ms-flex: 2;\n      flex: 2;\n}\n\n.ucQtG0iwqbo- ._3CwjFCbhqi4- {\n  -ms-flex: 1;\n      flex: 1;\n  -ms-flex-item-align: end;\n      align-self: flex-end;\n  text-align: right;\n}\n";
-var styles = {"autocomplete":"v0Cys9vQ-NE-","options":"CX-N-e0e6og-","visible":"_4PlUaegVpkk-","option":"ucQtG0iwqbo-","active":"r8HS-ma79QE-","separator":"ydwLX44YFZc-","heading":"PvUgNoAUG7A-","icon":"DAOOFUZ1BRM-","text":"cjKJFup6hGY-","label":"hG5zNBuI2wA-","details":"_3CwjFCbhqi4-"};
-styleInject_es.styleInject(css_248z);
-
-var IndexChange;
-(function (IndexChange) {
-    IndexChange[IndexChange["Previous"] = -1] = "Previous";
-    IndexChange[IndexChange["Next"] = 1] = "Next";
-})(IndexChange || (IndexChange = {}));
-function Menu({ visible, options, selectedOption, onOptionSelect, attachTo, }) {
-    const [highlightedIndex, setHighlightedIndex] = React.useState(0);
-    const { menuRef, setMenuRef, styles: popperStyles, attributes, targetWidth, } = useRepositionMenu(attachTo, visible);
-    const detectSeparatorCondition = (option) => option.description || option.details;
-    const detectGroups = (option) => option.options;
-    const addSeparators = options.some(detectSeparatorCondition);
-    const initialHighlight = options.some(detectGroups) ? 1 : 0;
-    setupKeyListeners();
-    React.useEffect(() => setHighlightedIndex(initialHighlight), [options]);
-    const menu = (React__default["default"].createElement("div", Object.assign({ className: classnames__default["default"](styles.options, { [styles.visible]: visible }), ref: setMenuRef, style: Object.assign(Object.assign({}, popperStyles.popper), { width: targetWidth }) }, attributes.popper), options.map((option, index) => {
-        const optionClass = classnames__default["default"](styles.option, {
-            [styles.active]: index === highlightedIndex,
-            [styles.separator]: addSeparators,
-        });
-        if (isGroup(option)) {
-            return (React__default["default"].createElement("div", { key: option.label, className: styles.heading },
-                React__default["default"].createElement(Heading.Heading, { level: 5 }, option.label)));
-        }
-        return (React__default["default"].createElement("button", { className: optionClass, key: option.value, onMouseDown: onOptionSelect.bind(undefined, option) },
-            React__default["default"].createElement("div", { className: styles.icon }, isOptionSelected(selectedOption, option) && (React__default["default"].createElement(Icon.Icon, { name: "checkmark", size: "small" }))),
-            React__default["default"].createElement("div", { className: styles.text },
-                React__default["default"].createElement("div", { className: styles.label },
-                    React__default["default"].createElement(Text.Text, null, option.label),
-                    option.description !== undefined && (React__default["default"].createElement(Text.Text, { variation: "subdued" }, option.description))),
-                option.details !== undefined && (React__default["default"].createElement("div", { className: styles.details },
-                    React__default["default"].createElement(Text.Text, null, option.details))))));
-    })));
-    return ReactDOM.createPortal(menu, document.body);
-    function setupKeyListeners() {
-        React.useEffect(() => {
-            var _a, _b;
-            (_b = (_a = menuRef === null || menuRef === void 0 ? void 0 : menuRef.children[highlightedIndex]) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
-                behavior: "smooth",
-                block: "nearest",
-                inline: "start",
-            });
-        }, [highlightedIndex]);
-        useOnKeyDown.useOnKeyDown((event) => {
-            const indexChange = arrowKeyPress(event, IndexChange.Next);
-            if (indexChange) {
-                setHighlightedIndex(Math.min(options.length - 1, highlightedIndex + indexChange));
-            }
-        }, "ArrowDown");
-        useOnKeyDown.useOnKeyDown((event) => {
-            const indexChange = arrowKeyPress(event, IndexChange.Previous);
-            if (indexChange) {
-                setHighlightedIndex(Math.max(0, highlightedIndex + indexChange));
-            }
-        }, "ArrowUp");
-        useOnKeyDown.useOnKeyDown((event) => {
-            if (!visible)
-                return;
-            if (isGroup(options[highlightedIndex]))
-                return;
-            event.preventDefault();
-            onOptionSelect(options[highlightedIndex]);
-        }, "Enter");
-    }
-    function arrowKeyPress(event, direction) {
-        if (!visible)
-            return;
-        event.preventDefault();
-        const requestedIndex = options[highlightedIndex + direction];
-        return requestedIndex && isGroup(requestedIndex)
-            ? direction + direction
-            : direction;
-    }
-}
-function isOptionSelected(selectedOption, option) {
-    return selectedOption && selectedOption.value === option.value;
-}
-function isGroup(option) {
-    if (option.options)
-        return true;
-    return false;
-}
-function useRepositionMenu(attachTo, visible = false) {
-    var _a;
-    const [menuRef, setMenuRef] = React.useState();
-    const popper = reactPopper.usePopper(attachTo.current, menuRef, {
-        modifiers: [
-            { name: "offset", options: { offset: [0, 8] } },
-            { name: "flip", options: { fallbackPlacements: ["top"] } },
-        ],
-    });
-    React.useLayoutEffect(() => {
-        var _a;
-        (_a = popper === null || popper === void 0 ? void 0 : popper.update) === null || _a === void 0 ? void 0 : _a.call(popper);
-    }, [visible]);
-    const targetWidth = (_a = attachTo.current) === null || _a === void 0 ? void 0 : _a.clientWidth;
-    return Object.assign(Object.assign({}, popper), { menuRef, setMenuRef, targetWidth });
-}
-
-// Max statements increased to make room for the debounce functions
-/* eslint max-statements: ["error", 14] */
-function AutocompleteInternal(_a, ref) {
-    var _b;
-    var { initialOptions = [], value, allowFreeForm = true, size = undefined, debounce: debounceRate = 300, onChange, getOptions, placeholder, onBlur, onFocus, validations } = _a, inputProps = tslib_es6.__rest(_a, ["initialOptions", "value", "allowFreeForm", "size", "debounce", "onChange", "getOptions", "placeholder", "onBlur", "onFocus", "validations"]);
-    const [options, setOptions] = React.useState(initialOptions);
-    const [menuVisible, setMenuVisible] = React.useState(false);
-    const [inputText, setInputText] = React.useState((_b = value === null || value === void 0 ? void 0 : value.label) !== null && _b !== void 0 ? _b : "");
-    const autocompleteRef = React.useRef(null);
-    const delayedSearch = debounce__default["default"](updateSearch, debounceRate);
-    React.useEffect(() => {
-        delayedSearch();
-        return delayedSearch.cancel;
-    }, [inputText]);
-    React.useEffect(() => {
-        var _a;
-        updateInput((_a = value === null || value === void 0 ? void 0 : value.label) !== null && _a !== void 0 ? _a : "");
-    }, [value]);
-    return (React__default["default"].createElement("div", { className: styles.autocomplete, ref: autocompleteRef },
-        React__default["default"].createElement(InputText.InputText, Object.assign({ ref: ref, autocomplete: false, size: size, value: inputText, onChange: handleInputChange, placeholder: placeholder, onFocus: handleInputFocus, onBlur: handleInputBlur, validations: validations }, inputProps)),
-        menuVisible && (React__default["default"].createElement(Menu, { attachTo: autocompleteRef, visible: menuVisible && options.length > 0, options: options, selectedOption: value, onOptionSelect: handleMenuChange }))));
-    function updateInput(newText) {
-        setInputText(newText);
-        if (newText === "") {
-            setOptions(mapToOptions(initialOptions));
-        }
-    }
-    function updateSearch() {
-        return tslib_es6.__awaiter(this, void 0, void 0, function* () {
-            const updatedOptions = yield getOptions(inputText);
-            const filteredOptions = updatedOptions.filter((option) => "options" in option && option.options ? option.options.length > 0 : true);
-            setOptions(mapToOptions(filteredOptions));
-        });
-    }
-    function handleMenuChange(chosenOption) {
-        onChange(chosenOption);
-        updateInput(chosenOption.label);
-        setMenuVisible(false);
-    }
-    function handleInputChange(newText) {
-        updateInput(newText);
-        if (allowFreeForm) {
-            onChange({ label: newText });
-        }
-    }
-    function handleInputBlur() {
-        setMenuVisible(false);
-        if (value == undefined || value.label !== inputText) {
-            setInputText("");
-            onChange(undefined);
-        }
-        onBlur && onBlur();
-    }
-    function handleInputFocus() {
-        setMenuVisible(true);
-        if (onFocus) {
-            onFocus();
-        }
-    }
-}
-function mapToOptions(items) {
-    return items.reduce(function (result, item) {
-        result = result.concat([item]);
-        if (item.options) {
-            result = result.concat(item.options);
-        }
-        return result;
-    }, []);
-}
-const Autocomplete = React.forwardRef(AutocompleteInternal);
-
-exports.Autocomplete = Autocomplete;

package/dist/Avatar/index.js

@@ -1,15 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var Avatar = require('../Avatar-76a799fa.js');
-require('react');
-require('classnames');
-require('../style-inject.es-9d2f5f4e.js');
-require('color');
-require('../Icon-405a216c.js');
-require('@jobber/design');
-
-
-
-exports.Avatar = Avatar.Avatar;