@jobber/components 4.85.4-CJS-to-ESM.1 → 4.85.4-CJS-to-ESM.4

package/dist/Combobox/components/ComboboxActivator/index.mjs

@@ -0,0 +1,21 @@
+export { C as ComboboxActivator } from '../../../ComboboxActivator-757941db.js';
+import 'react';
+import '../../../Button-9ae092b3.js';
+import 'classnames';
+import 'react-router-dom';
+import '../../../style-inject.es-a0e1a0ba.js';
+import '../../../Icon-22723fe6.js';
+import '@jobber/design';
+import '../../../Typography-7cc5daf5.js';
+import '../../../Chip-0e37aa92.js';
+import '@jobber/hooks/useInView';
+import '../../../Avatar-6ffee4bd.js';
+import 'color';
+import '../../../useChildComponent-13989d0a.js';
+import '../../../Tooltip-d1fc7e74.js';
+import 'react-dom';
+import 'framer-motion';
+import '@jobber/hooks/useSafeLayoutEffect';
+import 'react-popper';
+import '../../../tslib.es6-c563c1dd.js';
+import '../../../ComboboxProvider-32666af1.js';

package/dist/Combobox/components/ComboboxContent/ComboboxContentHeader/index.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxContentHeader = require('../../../../ComboboxContentHeader-ce3f10b6.js');
+require('react');
+require('../../../../Typography-c45bf216.js');
+require('classnames');
+require('../../../../style-inject.es-9d2f5f4e.js');
+require('../../../../Button-b73a5e01.js');
+require('react-router-dom');
+require('../../../../Icon-405a216c.js');
+require('@jobber/design');
+
+
+
+exports.ComboboxContentHeader = ComboboxContentHeader.ComboboxContentHeader;

package/dist/Combobox/components/ComboboxContent/ComboboxContentHeader/index.mjs

@@ -0,0 +1,9 @@
+export { C as ComboboxContentHeader } from '../../../../ComboboxContentHeader-97ea6800.js';
+import 'react';
+import '../../../../Typography-7cc5daf5.js';
+import 'classnames';
+import '../../../../style-inject.es-a0e1a0ba.js';
+import '../../../../Button-9ae092b3.js';
+import 'react-router-dom';
+import '../../../../Icon-22723fe6.js';
+import '@jobber/design';

package/dist/Combobox/components/ComboboxContent/ComboboxContentList/index.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxContentList = require('../../../../ComboboxContentList-b7108426.js');
+require('react');
+require('classnames');
+require('../../../../Text-259af966.js');
+require('../../../../Typography-c45bf216.js');
+require('../../../../style-inject.es-9d2f5f4e.js');
+require('../../../../Glimmer-84dee1ed.js');
+require('../../../../tslib.es6-754e2961.js');
+require('../../../../Content-e3f7b6fc.js');
+require('../../../../Spinner-9d8fc7ff.js');
+require('../../../../AnimatedPresence-20a02aaa.js');
+require('framer-motion');
+require('@jobber/design');
+require('../../../../ComboboxOption-16d1c772.js');
+require('../../../../Icon-405a216c.js');
+require('../../../../Flex-d490c4db.js');
+require('../../../../ComboboxProvider-dd21fe88.js');
+require('../../../../ComboboxLoadMore-a642edaa.js');
+require('@jobber/hooks/useInView');
+
+
+
+exports.ComboboxContentList = ComboboxContentList.ComboboxContentList;

package/dist/Combobox/components/ComboboxContent/ComboboxContentList/index.mjs

@@ -0,0 +1,19 @@
+export { C as ComboboxContentList } from '../../../../ComboboxContentList-7f7ef48c.js';
+import 'react';
+import 'classnames';
+import '../../../../Text-c9162504.js';
+import '../../../../Typography-7cc5daf5.js';
+import '../../../../style-inject.es-a0e1a0ba.js';
+import '../../../../Glimmer-aea7f8ae.js';
+import '../../../../tslib.es6-c563c1dd.js';
+import '../../../../Content-c4ea919f.js';
+import '../../../../Spinner-5d8359b8.js';
+import '../../../../AnimatedPresence-bbccdaf7.js';
+import 'framer-motion';
+import '@jobber/design';
+import '../../../../ComboboxOption-cf324e9d.js';
+import '../../../../Icon-22723fe6.js';
+import '../../../../Flex-d565495d.js';
+import '../../../../ComboboxProvider-32666af1.js';
+import '../../../../ComboboxLoadMore-21f09a37.js';
+import '@jobber/hooks/useInView';

package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/index.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxContentSearch = require('../../../../ComboboxContentSearch-889f0525.js');
+require('react');
+require('../../../../Icon-405a216c.js');
+require('@jobber/design');
+require('../../../../style-inject.es-9d2f5f4e.js');
+
+
+
+exports.ComboboxContentSearch = ComboboxContentSearch.ComboboxContentSearch;

package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/index.mjs

@@ -0,0 +1,5 @@
+export { C as ComboboxContentSearch } from '../../../../ComboboxContentSearch-196e638a.js';
+import 'react';
+import '../../../../Icon-22723fe6.js';
+import '@jobber/design';
+import '../../../../style-inject.es-a0e1a0ba.js';

package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxLoadMore = require('../../../../ComboboxLoadMore-a642edaa.js');
+require('react');
+require('@jobber/hooks/useInView');
+require('../../../../style-inject.es-9d2f5f4e.js');
+
+
+
+exports.ComboboxLoadMore = ComboboxLoadMore.ComboboxLoadMore;

package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/index.mjs

@@ -0,0 +1,4 @@
+export { C as ComboboxLoadMore } from '../../../../ComboboxLoadMore-21f09a37.js';
+import 'react';
+import '@jobber/hooks/useInView';
+import '../../../../style-inject.es-a0e1a0ba.js';

package/dist/Combobox/components/ComboboxContent/index.js

@@ -0,0 +1,37 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxContent = require('../../../ComboboxContent-1faee40b.js');
+require('react');
+require('classnames');
+require('react-dom');
+require('../../../style-inject.es-9d2f5f4e.js');
+require('../../../ComboboxContentSearch-889f0525.js');
+require('../../../Icon-405a216c.js');
+require('@jobber/design');
+require('../../../ComboboxContentList-b7108426.js');
+require('../../../Text-259af966.js');
+require('../../../Typography-c45bf216.js');
+require('../../../Glimmer-84dee1ed.js');
+require('../../../tslib.es6-754e2961.js');
+require('../../../Content-e3f7b6fc.js');
+require('../../../Spinner-9d8fc7ff.js');
+require('../../../AnimatedPresence-20a02aaa.js');
+require('framer-motion');
+require('../../../ComboboxOption-16d1c772.js');
+require('../../../Flex-d490c4db.js');
+require('../../../ComboboxProvider-dd21fe88.js');
+require('../../../ComboboxLoadMore-a642edaa.js');
+require('@jobber/hooks/useInView');
+require('../../../ComboboxContentHeader-ce3f10b6.js');
+require('../../../Button-b73a5e01.js');
+require('react-router-dom');
+require('@jobber/hooks/useRefocusOnActivator');
+require('@jobber/hooks/useFocusTrap');
+require('react-popper');
+require('@jobber/hooks/useOnKeyDown');
+
+
+
+exports.ComboboxContent = ComboboxContent.ComboboxContent;

package/dist/Combobox/components/ComboboxContent/index.mjs

@@ -0,0 +1,29 @@
+export { C as ComboboxContent } from '../../../ComboboxContent-0e67a7f3.js';
+import 'react';
+import 'classnames';
+import 'react-dom';
+import '../../../style-inject.es-a0e1a0ba.js';
+import '../../../ComboboxContentSearch-196e638a.js';
+import '../../../Icon-22723fe6.js';
+import '@jobber/design';
+import '../../../ComboboxContentList-7f7ef48c.js';
+import '../../../Text-c9162504.js';
+import '../../../Typography-7cc5daf5.js';
+import '../../../Glimmer-aea7f8ae.js';
+import '../../../tslib.es6-c563c1dd.js';
+import '../../../Content-c4ea919f.js';
+import '../../../Spinner-5d8359b8.js';
+import '../../../AnimatedPresence-bbccdaf7.js';
+import 'framer-motion';
+import '../../../ComboboxOption-cf324e9d.js';
+import '../../../Flex-d565495d.js';
+import '../../../ComboboxProvider-32666af1.js';
+import '../../../ComboboxLoadMore-21f09a37.js';
+import '@jobber/hooks/useInView';
+import '../../../ComboboxContentHeader-97ea6800.js';
+import '../../../Button-9ae092b3.js';
+import 'react-router-dom';
+import '@jobber/hooks/useRefocusOnActivator';
+import '@jobber/hooks/useFocusTrap';
+import 'react-popper';
+import '@jobber/hooks/useOnKeyDown';

package/dist/Combobox/components/ComboboxOption/index.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxOption = require('../../../ComboboxOption-16d1c772.js');
+require('react');
+require('classnames');
+require('../../../Icon-405a216c.js');
+require('@jobber/design');
+require('../../../Flex-d490c4db.js');
+require('../../../style-inject.es-9d2f5f4e.js');
+require('../../../ComboboxProvider-dd21fe88.js');
+require('../../../tslib.es6-754e2961.js');
+
+
+
+exports.ComboboxOption = ComboboxOption.ComboboxOption;

package/dist/Combobox/components/ComboboxOption/index.mjs

@@ -0,0 +1,9 @@
+export { C as ComboboxOption } from '../../../ComboboxOption-cf324e9d.js';
+import 'react';
+import 'classnames';
+import '../../../Icon-22723fe6.js';
+import '@jobber/design';
+import '../../../Flex-d565495d.js';
+import '../../../style-inject.es-a0e1a0ba.js';
+import '../../../ComboboxProvider-32666af1.js';
+import '../../../tslib.es6-c563c1dd.js';

package/dist/Combobox/components/ComboboxTrigger/index.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ComboboxTrigger = require('../../../ComboboxTrigger-0c05930b.js');
+require('react');
+require('../../../Chip-36397442.js');
+require('classnames');
+require('@jobber/hooks/useInView');
+require('../../../style-inject.es-9d2f5f4e.js');
+require('../../../Avatar-76a799fa.js');
+require('color');
+require('../../../Icon-405a216c.js');
+require('@jobber/design');
+require('../../../useChildComponent-d661dbd6.js');
+require('../../../Typography-c45bf216.js');
+require('../../../Tooltip-ef3d6ef4.js');
+require('react-dom');
+require('framer-motion');
+require('@jobber/hooks/useSafeLayoutEffect');
+require('react-popper');
+require('../../../tslib.es6-754e2961.js');
+require('../../../ComboboxProvider-dd21fe88.js');
+
+
+
+exports.ComboboxTrigger = ComboboxTrigger.ComboboxTrigger;

package/dist/Combobox/components/ComboboxTrigger/index.mjs

@@ -0,0 +1,19 @@
+export { C as ComboboxTrigger } from '../../../ComboboxTrigger-b41954f5.js';
+import 'react';
+import '../../../Chip-0e37aa92.js';
+import 'classnames';
+import '@jobber/hooks/useInView';
+import '../../../style-inject.es-a0e1a0ba.js';
+import '../../../Avatar-6ffee4bd.js';
+import 'color';
+import '../../../Icon-22723fe6.js';
+import '@jobber/design';
+import '../../../useChildComponent-13989d0a.js';
+import '../../../Typography-7cc5daf5.js';
+import '../../../Tooltip-d1fc7e74.js';
+import 'react-dom';
+import 'framer-motion';
+import '@jobber/hooks/useSafeLayoutEffect';
+import 'react-popper';
+import '../../../tslib.es6-c563c1dd.js';
+import '../../../ComboboxProvider-32666af1.js';

package/dist/Combobox/index.js

@@ -0,0 +1,51 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Combobox = require('../Combobox-bf8c9ce6.js');
+var ComboboxProvider = require('../ComboboxProvider-dd21fe88.js');
+require('react');
+require('../ComboboxContent-1faee40b.js');
+require('classnames');
+require('react-dom');
+require('../style-inject.es-9d2f5f4e.js');
+require('../ComboboxContentSearch-889f0525.js');
+require('../Icon-405a216c.js');
+require('@jobber/design');
+require('../ComboboxContentList-b7108426.js');
+require('../Text-259af966.js');
+require('../Typography-c45bf216.js');
+require('../Glimmer-84dee1ed.js');
+require('../tslib.es6-754e2961.js');
+require('../Content-e3f7b6fc.js');
+require('../Spinner-9d8fc7ff.js');
+require('../AnimatedPresence-20a02aaa.js');
+require('framer-motion');
+require('../ComboboxOption-16d1c772.js');
+require('../Flex-d490c4db.js');
+require('../ComboboxLoadMore-a642edaa.js');
+require('@jobber/hooks/useInView');
+require('../ComboboxContentHeader-ce3f10b6.js');
+require('../Button-b73a5e01.js');
+require('react-router-dom');
+require('@jobber/hooks/useRefocusOnActivator');
+require('@jobber/hooks/useFocusTrap');
+require('react-popper');
+require('@jobber/hooks/useOnKeyDown');
+require('../ComboboxAction-22bd2e79.js');
+require('../ComboboxTrigger-0c05930b.js');
+require('../Chip-36397442.js');
+require('../Avatar-76a799fa.js');
+require('color');
+require('../useChildComponent-d661dbd6.js');
+require('../Tooltip-ef3d6ef4.js');
+require('@jobber/hooks/useSafeLayoutEffect');
+require('lodash/debounce');
+require('lodash/noop');
+require('../ComboboxActivator-afc63f51.js');
+require('@jobber/hooks/useAssert');
+
+
+
+exports.Combobox = Combobox.Combobox;
+exports.ComboboxContextProvider = ComboboxProvider.ComboboxContextProvider;

package/dist/Combobox/index.mjs

@@ -0,0 +1,42 @@
+export { C as Combobox } from '../Combobox-f781cae2.js';
+export { C as ComboboxContextProvider } from '../ComboboxProvider-32666af1.js';
+import 'react';
+import '../ComboboxContent-0e67a7f3.js';
+import 'classnames';
+import 'react-dom';
+import '../style-inject.es-a0e1a0ba.js';
+import '../ComboboxContentSearch-196e638a.js';
+import '../Icon-22723fe6.js';
+import '@jobber/design';
+import '../ComboboxContentList-7f7ef48c.js';
+import '../Text-c9162504.js';
+import '../Typography-7cc5daf5.js';
+import '../Glimmer-aea7f8ae.js';
+import '../tslib.es6-c563c1dd.js';
+import '../Content-c4ea919f.js';
+import '../Spinner-5d8359b8.js';
+import '../AnimatedPresence-bbccdaf7.js';
+import 'framer-motion';
+import '../ComboboxOption-cf324e9d.js';
+import '../Flex-d565495d.js';
+import '../ComboboxLoadMore-21f09a37.js';
+import '@jobber/hooks/useInView';
+import '../ComboboxContentHeader-97ea6800.js';
+import '../Button-9ae092b3.js';
+import 'react-router-dom';
+import '@jobber/hooks/useRefocusOnActivator';
+import '@jobber/hooks/useFocusTrap';
+import 'react-popper';
+import '@jobber/hooks/useOnKeyDown';
+import '../ComboboxAction-c21dc02b.js';
+import '../ComboboxTrigger-b41954f5.js';
+import '../Chip-0e37aa92.js';
+import '../Avatar-6ffee4bd.js';
+import 'color';
+import '../useChildComponent-13989d0a.js';
+import '../Tooltip-d1fc7e74.js';
+import '@jobber/hooks/useSafeLayoutEffect';
+import 'lodash/debounce';
+import 'lodash/noop';
+import '../ComboboxActivator-757941db.js';
+import '@jobber/hooks/useAssert';

package/dist/Combobox-bf8c9ce6.js

@@ -0,0 +1,128 @@
+'use strict';
+
+var React = require('react');
+var ComboboxContent = require('./ComboboxContent-1faee40b.js');
+var ComboboxAction = require('./ComboboxAction-22bd2e79.js');
+var ComboboxProvider = require('./ComboboxProvider-dd21fe88.js');
+var ComboboxTrigger = require('./ComboboxTrigger-0c05930b.js');
+var ComboboxOption = require('./ComboboxOption-16d1c772.js');
+var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
+var debounce = require('lodash/debounce');
+var noop = require('lodash/noop');
+var ComboboxActivator = require('./ComboboxActivator-afc63f51.js');
+var useAssert = require('@jobber/hooks/useAssert');
+
+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 noop__default = /*#__PURE__*/_interopDefaultLegacy(noop);
+
+var css_248z = ".W8qMZnORYxI- {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 6;\n  z-index: var(--elevation-menu);\n  background-color: transparent;\n}\n\n._-0dkolvLF-Y- {\n  display: inline-block;\n}\n";
+var styles = {"overlay":"W8qMZnORYxI-","wrapper":"_-0dkolvLF-Y-"};
+styleInject_es.styleInject(css_248z);
+
+function useMakeComboboxHandlers(setOpen, setSearchValue, selectedOptions, shouldScroll, selectedStateSetter, multiSelect, onClose, onSearch) {
+    const handleClose = React.useCallback(() => {
+        setOpen(false);
+        setSearchValue("");
+        onSearch && onSearch("");
+        onClose && onClose();
+        if (selectedOptions.length > 0) {
+            shouldScroll.current = true;
+        }
+    }, [setOpen, setSearchValue, onClose, onSearch, selectedOptions.length]);
+    const handleSelection = React.useCallback((selection) => {
+        if (multiSelect) {
+            handleMultiSelect(selectedStateSetter, selectedOptions, selection);
+        }
+        else {
+            handleSingleSelect(selectedStateSetter, selection);
+        }
+    }, [multiSelect, selectedStateSetter, selectedOptions]);
+    const handleSingleSelect = React.useCallback((selectCallback, selection) => {
+        selectCallback([selection]);
+        handleClose();
+    }, []);
+    return {
+        handleClose,
+        handleSelection,
+    };
+}
+function handleMultiSelect(selectCallback, selected, selection) {
+    if (selected.some(s => s.id === selection.id)) {
+        selectCallback(selected.filter(s => s.id !== selection.id));
+    }
+    else {
+        selectCallback([...selected, selection]);
+    }
+}
+
+function useCombobox(selected, onSelect, options, onClose, multiSelect, onSearch, debounceTime = 300) {
+    const wrapperRef = React.useRef(null);
+    const shouldScroll = React.useRef(false);
+    const [open, setOpen] = React.useState(false);
+    const [searchValue, setSearchValue] = React.useState("");
+    const searchCallback = React.useCallback(debounce__default["default"]((value) => onSearch === null || onSearch === void 0 ? void 0 : onSearch(value), debounceTime), [onSearch, debounceTime]);
+    const { handleClose, handleSelection } = useMakeComboboxHandlers(setOpen, setSearchValue, selected, shouldScroll, onSelect, multiSelect, onClose, onSearch);
+    const internalFilteredOptions = options.filter(option => option.label.toLowerCase().includes(searchValue.toLowerCase()));
+    return {
+        wrapperRef,
+        searchValue,
+        setSearchValue,
+        open,
+        setOpen,
+        selectedOptions: selected,
+        selectedStateSetter: onSelect,
+        shouldScroll,
+        handleClose,
+        handleSelection,
+        internalFilteredOptions,
+        handleSearchChange: onSearch ? searchCallback : noop__default["default"],
+    };
+}
+
+const COMBOBOX_TRIGGER_COUNT_ERROR_MESSAGE = "Combobox must have exactly one Trigger element";
+function useComboboxValidation(children) {
+    const optionElements = getCompoundComponents(ComboboxOption.ComboboxOption, children);
+    const actionElements = getCompoundComponents(ComboboxAction.ComboboxAction, children);
+    const activatorElements = getCompoundComponents(ComboboxActivator.ComboboxActivator, children);
+    const shouldThrowTriggerError = isInvalid(activatorElements);
+    useAssert.useAssert(shouldThrowTriggerError, COMBOBOX_TRIGGER_COUNT_ERROR_MESSAGE);
+    return {
+        optionElements,
+        triggerElement: activatorElements[0],
+        actionElements,
+    };
+}
+function isInvalid(activators) {
+    return activators.length > 1 ? true : false;
+}
+/**
+ * Return all instances child component that matches the `type` provided
+ */
+function getCompoundComponents(type, children) {
+    const childrenArray = React.Children.toArray(children);
+    const elements = childrenArray.filter((child) => React.isValidElement(child) && child.type === type);
+    return elements;
+}
+
+function Combobox(props) {
+    const { optionElements, triggerElement, actionElements } = useComboboxValidation(props.children);
+    const options = React.useMemo(() => (optionElements === null || optionElements === void 0 ? void 0 : optionElements.map(option => ({
+        id: option.props.id,
+        label: option.props.label,
+        prefix: option.props.prefix,
+    }))) || [], [optionElements]);
+    const { selectedOptions, selectedStateSetter, shouldScroll, wrapperRef, searchValue, setSearchValue, open, setOpen, handleClose, handleSelection, internalFilteredOptions, handleSearchChange, } = useCombobox(props.selected, props.onSelect, options, props.onClose, props.multiSelect, props.onSearch, props.onSearchDebounce);
+    return (React__default["default"].createElement(ComboboxProvider.ComboboxContextProvider, { selected: selectedOptions, selectionHandler: handleSelection, open: open, setOpen: setOpen, handleClose: handleClose, shouldScroll: shouldScroll, searchValue: searchValue },
+        React__default["default"].createElement("div", { ref: wrapperRef, className: styles.wrapper },
+            open && (React__default["default"].createElement("div", { className: styles.overlay, onClick: () => handleClose(), "data-testid": "ATL-Combobox-Overlay" })),
+            triggerElement || (React__default["default"].createElement(ComboboxTrigger.ComboboxTrigger, { label: props.label, selected: props.selected })),
+            React__default["default"].createElement(ComboboxContent.ComboboxContent, { multiselect: props.multiSelect, subjectNoun: props.subjectNoun, selected: selectedOptions, actionElements: actionElements, selectedStateSetter: selectedStateSetter, handleSelection: handleSelection, searchValue: searchValue, setSearchValue: setSearchValue, wrapperRef: wrapperRef, open: open, setOpen: setOpen, options: props.onSearch ? options : internalFilteredOptions, loading: props.loading, handleSearchChange: handleSearchChange, onLoadMore: props.onLoadMore }))));
+}
+Combobox.Activator = ComboboxActivator.ComboboxActivator;
+Combobox.Action = ComboboxAction.ComboboxAction;
+Combobox.Option = ComboboxOption.ComboboxOption;
+
+exports.Combobox = Combobox;

package/dist/Combobox-f781cae2.js

@@ -0,0 +1,120 @@
+import React, { useCallback, useRef, useState, Children, isValidElement, useMemo } from 'react';
+import { C as ComboboxContent } from './ComboboxContent-0e67a7f3.js';
+import { C as ComboboxAction } from './ComboboxAction-c21dc02b.js';
+import { C as ComboboxContextProvider } from './ComboboxProvider-32666af1.js';
+import { C as ComboboxTrigger } from './ComboboxTrigger-b41954f5.js';
+import { C as ComboboxOption } from './ComboboxOption-cf324e9d.js';
+import { s as styleInject } from './style-inject.es-a0e1a0ba.js';
+import debounce from 'lodash/debounce';
+import noop from 'lodash/noop';
+import { C as ComboboxActivator } from './ComboboxActivator-757941db.js';
+import { useAssert } from '@jobber/hooks/useAssert';
+
+var css_248z = ".W8qMZnORYxI- {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 6;\n  z-index: var(--elevation-menu);\n  background-color: transparent;\n}\n\n._-0dkolvLF-Y- {\n  display: inline-block;\n}\n";
+var styles = {"overlay":"W8qMZnORYxI-","wrapper":"_-0dkolvLF-Y-"};
+styleInject(css_248z);
+
+function useMakeComboboxHandlers(setOpen, setSearchValue, selectedOptions, shouldScroll, selectedStateSetter, multiSelect, onClose, onSearch) {
+    const handleClose = useCallback(() => {
+        setOpen(false);
+        setSearchValue("");
+        onSearch && onSearch("");
+        onClose && onClose();
+        if (selectedOptions.length > 0) {
+            shouldScroll.current = true;
+        }
+    }, [setOpen, setSearchValue, onClose, onSearch, selectedOptions.length]);
+    const handleSelection = useCallback((selection) => {
+        if (multiSelect) {
+            handleMultiSelect(selectedStateSetter, selectedOptions, selection);
+        }
+        else {
+            handleSingleSelect(selectedStateSetter, selection);
+        }
+    }, [multiSelect, selectedStateSetter, selectedOptions]);
+    const handleSingleSelect = useCallback((selectCallback, selection) => {
+        selectCallback([selection]);
+        handleClose();
+    }, []);
+    return {
+        handleClose,
+        handleSelection,
+    };
+}
+function handleMultiSelect(selectCallback, selected, selection) {
+    if (selected.some(s => s.id === selection.id)) {
+        selectCallback(selected.filter(s => s.id !== selection.id));
+    }
+    else {
+        selectCallback([...selected, selection]);
+    }
+}
+
+function useCombobox(selected, onSelect, options, onClose, multiSelect, onSearch, debounceTime = 300) {
+    const wrapperRef = useRef(null);
+    const shouldScroll = useRef(false);
+    const [open, setOpen] = useState(false);
+    const [searchValue, setSearchValue] = useState("");
+    const searchCallback = useCallback(debounce((value) => onSearch === null || onSearch === void 0 ? void 0 : onSearch(value), debounceTime), [onSearch, debounceTime]);
+    const { handleClose, handleSelection } = useMakeComboboxHandlers(setOpen, setSearchValue, selected, shouldScroll, onSelect, multiSelect, onClose, onSearch);
+    const internalFilteredOptions = options.filter(option => option.label.toLowerCase().includes(searchValue.toLowerCase()));
+    return {
+        wrapperRef,
+        searchValue,
+        setSearchValue,
+        open,
+        setOpen,
+        selectedOptions: selected,
+        selectedStateSetter: onSelect,
+        shouldScroll,
+        handleClose,
+        handleSelection,
+        internalFilteredOptions,
+        handleSearchChange: onSearch ? searchCallback : noop,
+    };
+}
+
+const COMBOBOX_TRIGGER_COUNT_ERROR_MESSAGE = "Combobox must have exactly one Trigger element";
+function useComboboxValidation(children) {
+    const optionElements = getCompoundComponents(ComboboxOption, children);
+    const actionElements = getCompoundComponents(ComboboxAction, children);
+    const activatorElements = getCompoundComponents(ComboboxActivator, children);
+    const shouldThrowTriggerError = isInvalid(activatorElements);
+    useAssert(shouldThrowTriggerError, COMBOBOX_TRIGGER_COUNT_ERROR_MESSAGE);
+    return {
+        optionElements,
+        triggerElement: activatorElements[0],
+        actionElements,
+    };
+}
+function isInvalid(activators) {
+    return activators.length > 1 ? true : false;
+}
+/**
+ * Return all instances child component that matches the `type` provided
+ */
+function getCompoundComponents(type, children) {
+    const childrenArray = Children.toArray(children);
+    const elements = childrenArray.filter((child) => isValidElement(child) && child.type === type);
+    return elements;
+}
+
+function Combobox(props) {
+    const { optionElements, triggerElement, actionElements } = useComboboxValidation(props.children);
+    const options = useMemo(() => (optionElements === null || optionElements === void 0 ? void 0 : optionElements.map(option => ({
+        id: option.props.id,
+        label: option.props.label,
+        prefix: option.props.prefix,
+    }))) || [], [optionElements]);
+    const { selectedOptions, selectedStateSetter, shouldScroll, wrapperRef, searchValue, setSearchValue, open, setOpen, handleClose, handleSelection, internalFilteredOptions, handleSearchChange, } = useCombobox(props.selected, props.onSelect, options, props.onClose, props.multiSelect, props.onSearch, props.onSearchDebounce);
+    return (React.createElement(ComboboxContextProvider, { selected: selectedOptions, selectionHandler: handleSelection, open: open, setOpen: setOpen, handleClose: handleClose, shouldScroll: shouldScroll, searchValue: searchValue },
+        React.createElement("div", { ref: wrapperRef, className: styles.wrapper },
+            open && (React.createElement("div", { className: styles.overlay, onClick: () => handleClose(), "data-testid": "ATL-Combobox-Overlay" })),
+            triggerElement || (React.createElement(ComboboxTrigger, { label: props.label, selected: props.selected })),
+            React.createElement(ComboboxContent, { multiselect: props.multiSelect, subjectNoun: props.subjectNoun, selected: selectedOptions, actionElements: actionElements, selectedStateSetter: selectedStateSetter, handleSelection: handleSelection, searchValue: searchValue, setSearchValue: setSearchValue, wrapperRef: wrapperRef, open: open, setOpen: setOpen, options: props.onSearch ? options : internalFilteredOptions, loading: props.loading, handleSearchChange: handleSearchChange, onLoadMore: props.onLoadMore }))));
+}
+Combobox.Activator = ComboboxActivator;
+Combobox.Action = ComboboxAction;
+Combobox.Option = ComboboxOption;
+
+export { Combobox as C };