@jobber/components 4.90.1 → 4.90.3

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

@@ -0,0 +1,27 @@
+'use strict';
+
+var ComboboxActivator = require('../../../ComboboxActivator-B-hbPIvc.js');
+require('react');
+require('../../../Button-C6SHw1kI.js');
+require('classnames');
+require('react-router-dom');
+require('../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../../../Typography-WLLQxuNl.js');
+require('../../../Chip-DDl2lMHv.js');
+require('../../../useInView-DRRNAygj.js');
+require('../../../Avatar-NVE7Yqd4.js');
+require('color');
+require('../../../useChildComponent-Dv0rjZs2.js');
+require('../../../Tooltip-VHTRuZ4Y.js');
+require('react-dom');
+require('framer-motion');
+require('../../../useSafeLayoutEffect-87KYIon5.js');
+require('../../../useIsMounted-sw4iFcH2.js');
+require('react-popper');
+require('../../../tslib.es6-v7P0Y776.js');
+require('../../../ComboboxProvider-BfK8pUar.js');
+
+
+
+exports.ComboboxActivator = ComboboxActivator.ComboboxActivator;

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

@@ -0,0 +1,21 @@
+export { C as ComboboxActivator } from '../../../ComboboxActivator-GbDe5-gd.js';
+import 'react';
+import '../../../Button-Cfp4SFrN.js';
+import 'classnames';
+import 'react-router-dom';
+import '../../../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../../../Typography-D6YoQOGF.js';
+import '../../../Chip-DhTvoOnl.js';
+import '../../../useInView-D7JiU6w9.js';
+import '../../../Avatar-Q8rB73I2.js';
+import 'color';
+import '../../../useChildComponent-2LnkmIw0.js';
+import '../../../Tooltip-B2DBKrJM.js';
+import 'react-dom';
+import 'framer-motion';
+import '../../../useSafeLayoutEffect-IMNHxeSN.js';
+import '../../../useIsMounted-Ds9qZzhJ.js';
+import 'react-popper';
+import '../../../tslib.es6-CQnq_FvL.js';
+import '../../../ComboboxProvider-CnooL3he.js';

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

@@ -0,0 +1,14 @@
+'use strict';
+
+var ComboboxContentHeader = require('../../../../ComboboxContentHeader-CXeTEKPJ.js');
+require('react');
+require('../../../../Typography-WLLQxuNl.js');
+require('classnames');
+require('../../../../Button-C6SHw1kI.js');
+require('react-router-dom');
+require('../../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+
+
+
+exports.ComboboxContentHeader = ComboboxContentHeader.ComboboxContentHeader;

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

@@ -0,0 +1,8 @@
+export { C as ComboboxContentHeader } from '../../../../ComboboxContentHeader-R33IqVfI.js';
+import 'react';
+import '../../../../Typography-D6YoQOGF.js';
+import 'classnames';
+import '../../../../Button-Cfp4SFrN.js';
+import 'react-router-dom';
+import '../../../../Icon-Cprfa6DH.js';
+import '@jobber/design';

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

@@ -0,0 +1,24 @@
+'use strict';
+
+var ComboboxContentList = require('../../../../ComboboxContentList-QdY3v22O.js');
+require('react');
+require('classnames');
+require('../../../../Text-Bopx9dUr.js');
+require('../../../../Typography-WLLQxuNl.js');
+require('../../../../Glimmer-CnsLTogn.js');
+require('../../../../tslib.es6-v7P0Y776.js');
+require('../../../../Content-BfbXarkv.js');
+require('../../../../Spinner-L0bWOO6S.js');
+require('../../../../AnimatedPresence-CNNu0y2V.js');
+require('framer-motion');
+require('@jobber/design');
+require('../../../../ComboboxOption-CEM44lR4.js');
+require('../../../../Icon-DN6zZdoZ.js');
+require('../../../../Flex-mRkBGC1G.js');
+require('../../../../ComboboxProvider-BfK8pUar.js');
+require('../../../../ComboboxLoadMore-CTue6Ccg.js');
+require('../../../../useInView-DRRNAygj.js');
+
+
+
+exports.ComboboxContentList = ComboboxContentList.ComboboxContentList;

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

@@ -0,0 +1,18 @@
+export { C as ComboboxContentList } from '../../../../ComboboxContentList-BcRD6OP7.js';
+import 'react';
+import 'classnames';
+import '../../../../Text-DALHhxHl.js';
+import '../../../../Typography-D6YoQOGF.js';
+import '../../../../Glimmer-CVTrhX52.js';
+import '../../../../tslib.es6-CQnq_FvL.js';
+import '../../../../Content-DcpJaJjo.js';
+import '../../../../Spinner-gZOK7Pbk.js';
+import '../../../../AnimatedPresence-Cp8tOatE.js';
+import 'framer-motion';
+import '@jobber/design';
+import '../../../../ComboboxOption-BQAcmD8S.js';
+import '../../../../Icon-Cprfa6DH.js';
+import '../../../../Flex-CloUiW2f.js';
+import '../../../../ComboboxProvider-CnooL3he.js';
+import '../../../../ComboboxLoadMore-Dwov5fXg.js';
+import '../../../../useInView-D7JiU6w9.js';

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

@@ -0,0 +1,10 @@
+'use strict';
+
+var ComboboxContentSearch = require('../../../../ComboboxContentSearch-BYHUi0_0.js');
+require('react');
+require('../../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+
+
+
+exports.ComboboxContentSearch = ComboboxContentSearch.ComboboxContentSearch;

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

@@ -0,0 +1,4 @@
+export { C as ComboboxContentSearch } from '../../../../ComboboxContentSearch-BQoi8eST.js';
+import 'react';
+import '../../../../Icon-Cprfa6DH.js';
+import '@jobber/design';

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

@@ -0,0 +1,9 @@
+'use strict';
+
+var ComboboxLoadMore = require('../../../../ComboboxLoadMore-CTue6Ccg.js');
+require('react');
+require('../../../../useInView-DRRNAygj.js');
+
+
+
+exports.ComboboxLoadMore = ComboboxLoadMore.ComboboxLoadMore;

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

@@ -0,0 +1,3 @@
+export { C as ComboboxLoadMore } from '../../../../ComboboxLoadMore-Dwov5fXg.js';
+import 'react';
+import '../../../../useInView-D7JiU6w9.js';

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

@@ -0,0 +1,34 @@
+'use strict';
+
+var ComboboxContent = require('../../../ComboboxContent-PbGOqYiy.js');
+require('react');
+require('classnames');
+require('react-dom');
+require('../../../ComboboxContentSearch-BYHUi0_0.js');
+require('../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../../../ComboboxContentList-QdY3v22O.js');
+require('../../../Text-Bopx9dUr.js');
+require('../../../Typography-WLLQxuNl.js');
+require('../../../Glimmer-CnsLTogn.js');
+require('../../../tslib.es6-v7P0Y776.js');
+require('../../../Content-BfbXarkv.js');
+require('../../../Spinner-L0bWOO6S.js');
+require('../../../AnimatedPresence-CNNu0y2V.js');
+require('framer-motion');
+require('../../../ComboboxOption-CEM44lR4.js');
+require('../../../Flex-mRkBGC1G.js');
+require('../../../ComboboxProvider-BfK8pUar.js');
+require('../../../ComboboxLoadMore-CTue6Ccg.js');
+require('../../../useInView-DRRNAygj.js');
+require('../../../ComboboxContentHeader-CXeTEKPJ.js');
+require('../../../Button-C6SHw1kI.js');
+require('react-router-dom');
+require('../../../useRefocusOnActivator-DhXYZbJ2.js');
+require('../../../useFocusTrap-DDVdHPLP.js');
+require('react-popper');
+require('../../../useOnKeyDown-ClBoAl9o.js');
+
+
+
+exports.ComboboxContent = ComboboxContent.ComboboxContent;

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

@@ -0,0 +1,28 @@
+export { C as ComboboxContent } from '../../../ComboboxContent-Y7XnpDxG.js';
+import 'react';
+import 'classnames';
+import 'react-dom';
+import '../../../ComboboxContentSearch-BQoi8eST.js';
+import '../../../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../../../ComboboxContentList-BcRD6OP7.js';
+import '../../../Text-DALHhxHl.js';
+import '../../../Typography-D6YoQOGF.js';
+import '../../../Glimmer-CVTrhX52.js';
+import '../../../tslib.es6-CQnq_FvL.js';
+import '../../../Content-DcpJaJjo.js';
+import '../../../Spinner-gZOK7Pbk.js';
+import '../../../AnimatedPresence-Cp8tOatE.js';
+import 'framer-motion';
+import '../../../ComboboxOption-BQAcmD8S.js';
+import '../../../Flex-CloUiW2f.js';
+import '../../../ComboboxProvider-CnooL3he.js';
+import '../../../ComboboxLoadMore-Dwov5fXg.js';
+import '../../../useInView-D7JiU6w9.js';
+import '../../../ComboboxContentHeader-R33IqVfI.js';
+import '../../../Button-Cfp4SFrN.js';
+import 'react-router-dom';
+import '../../../useRefocusOnActivator-JhjmSWbr.js';
+import '../../../useFocusTrap-J4nqJhkL.js';
+import 'react-popper';
+import '../../../useOnKeyDown-BBUzTpsM.js';

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

@@ -0,0 +1,14 @@
+'use strict';
+
+var ComboboxOption = require('../../../ComboboxOption-CEM44lR4.js');
+require('react');
+require('classnames');
+require('../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../../../Flex-mRkBGC1G.js');
+require('../../../ComboboxProvider-BfK8pUar.js');
+require('../../../tslib.es6-v7P0Y776.js');
+
+
+
+exports.ComboboxOption = ComboboxOption.ComboboxOption;

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

@@ -0,0 +1,8 @@
+export { C as ComboboxOption } from '../../../ComboboxOption-BQAcmD8S.js';
+import 'react';
+import 'classnames';
+import '../../../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../../../Flex-CloUiW2f.js';
+import '../../../ComboboxProvider-CnooL3he.js';
+import '../../../tslib.es6-CQnq_FvL.js';

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

@@ -0,0 +1,25 @@
+'use strict';
+
+var ComboboxTrigger = require('../../../ComboboxTrigger-BPoUI5Eo.js');
+require('react');
+require('../../../Chip-DDl2lMHv.js');
+require('classnames');
+require('../../../useInView-DRRNAygj.js');
+require('../../../Avatar-NVE7Yqd4.js');
+require('color');
+require('../../../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../../../useChildComponent-Dv0rjZs2.js');
+require('../../../Typography-WLLQxuNl.js');
+require('../../../Tooltip-VHTRuZ4Y.js');
+require('react-dom');
+require('framer-motion');
+require('../../../useSafeLayoutEffect-87KYIon5.js');
+require('../../../useIsMounted-sw4iFcH2.js');
+require('react-popper');
+require('../../../tslib.es6-v7P0Y776.js');
+require('../../../ComboboxProvider-BfK8pUar.js');
+
+
+
+exports.ComboboxTrigger = ComboboxTrigger.ComboboxTrigger;

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

@@ -0,0 +1,19 @@
+export { C as ComboboxTrigger } from '../../../ComboboxTrigger-CUU6Np4P.js';
+import 'react';
+import '../../../Chip-DhTvoOnl.js';
+import 'classnames';
+import '../../../useInView-D7JiU6w9.js';
+import '../../../Avatar-Q8rB73I2.js';
+import 'color';
+import '../../../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../../../useChildComponent-2LnkmIw0.js';
+import '../../../Typography-D6YoQOGF.js';
+import '../../../Tooltip-B2DBKrJM.js';
+import 'react-dom';
+import 'framer-motion';
+import '../../../useSafeLayoutEffect-IMNHxeSN.js';
+import '../../../useIsMounted-Ds9qZzhJ.js';
+import 'react-popper';
+import '../../../tslib.es6-CQnq_FvL.js';
+import '../../../ComboboxProvider-CnooL3he.js';

package/dist/Combobox/index.cjs

@@ -0,0 +1,53 @@
+'use strict';
+
+var Combobox = require('../Combobox-DL8grBGD.js');
+var ComboboxProvider = require('../ComboboxProvider-BfK8pUar.js');
+require('react');
+require('../ComboboxContent-PbGOqYiy.js');
+require('classnames');
+require('react-dom');
+require('../ComboboxContentSearch-BYHUi0_0.js');
+require('../Icon-DN6zZdoZ.js');
+require('@jobber/design');
+require('../ComboboxContentList-QdY3v22O.js');
+require('../Text-Bopx9dUr.js');
+require('../Typography-WLLQxuNl.js');
+require('../Glimmer-CnsLTogn.js');
+require('../tslib.es6-v7P0Y776.js');
+require('../Content-BfbXarkv.js');
+require('../Spinner-L0bWOO6S.js');
+require('../AnimatedPresence-CNNu0y2V.js');
+require('framer-motion');
+require('../ComboboxOption-CEM44lR4.js');
+require('../Flex-mRkBGC1G.js');
+require('../ComboboxLoadMore-CTue6Ccg.js');
+require('../useInView-DRRNAygj.js');
+require('../ComboboxContentHeader-CXeTEKPJ.js');
+require('../Button-C6SHw1kI.js');
+require('react-router-dom');
+require('../useRefocusOnActivator-DhXYZbJ2.js');
+require('../useFocusTrap-DDVdHPLP.js');
+require('react-popper');
+require('../useOnKeyDown-ClBoAl9o.js');
+require('../ComboboxAction-BrphUdTc.js');
+require('../ComboboxTrigger-BPoUI5Eo.js');
+require('../Chip-DDl2lMHv.js');
+require('../Avatar-NVE7Yqd4.js');
+require('color');
+require('../useChildComponent-Dv0rjZs2.js');
+require('../Tooltip-VHTRuZ4Y.js');
+require('../useSafeLayoutEffect-87KYIon5.js');
+require('../useIsMounted-sw4iFcH2.js');
+require('../debounce-DNEaQL1N.js');
+require('../_commonjsHelpers-vq2WA-uE.js');
+require('../isObjectLike-BLBufvwS.js');
+require('../isSymbol-MYvz4htB.js');
+require('../noop-C8qh6oDm.js');
+require('../ComboboxActivator-B-hbPIvc.js');
+require('../useAssert--FSFxEub.js');
+require('../_polyfill-node.process-mCRQTL4d.js');
+
+
+
+exports.Combobox = Combobox.Combobox;
+exports.ComboboxContextProvider = ComboboxProvider.ComboboxContextProvider;

package/dist/Combobox/index.mjs

@@ -0,0 +1,46 @@
+export { C as Combobox } from '../Combobox-DkiMKBIq.js';
+export { C as ComboboxContextProvider } from '../ComboboxProvider-CnooL3he.js';
+import 'react';
+import '../ComboboxContent-Y7XnpDxG.js';
+import 'classnames';
+import 'react-dom';
+import '../ComboboxContentSearch-BQoi8eST.js';
+import '../Icon-Cprfa6DH.js';
+import '@jobber/design';
+import '../ComboboxContentList-BcRD6OP7.js';
+import '../Text-DALHhxHl.js';
+import '../Typography-D6YoQOGF.js';
+import '../Glimmer-CVTrhX52.js';
+import '../tslib.es6-CQnq_FvL.js';
+import '../Content-DcpJaJjo.js';
+import '../Spinner-gZOK7Pbk.js';
+import '../AnimatedPresence-Cp8tOatE.js';
+import 'framer-motion';
+import '../ComboboxOption-BQAcmD8S.js';
+import '../Flex-CloUiW2f.js';
+import '../ComboboxLoadMore-Dwov5fXg.js';
+import '../useInView-D7JiU6w9.js';
+import '../ComboboxContentHeader-R33IqVfI.js';
+import '../Button-Cfp4SFrN.js';
+import 'react-router-dom';
+import '../useRefocusOnActivator-JhjmSWbr.js';
+import '../useFocusTrap-J4nqJhkL.js';
+import 'react-popper';
+import '../useOnKeyDown-BBUzTpsM.js';
+import '../ComboboxAction-BZcUzPiS.js';
+import '../ComboboxTrigger-CUU6Np4P.js';
+import '../Chip-DhTvoOnl.js';
+import '../Avatar-Q8rB73I2.js';
+import 'color';
+import '../useChildComponent-2LnkmIw0.js';
+import '../Tooltip-B2DBKrJM.js';
+import '../useSafeLayoutEffect-IMNHxeSN.js';
+import '../useIsMounted-Ds9qZzhJ.js';
+import '../debounce-DgeBwtKp.js';
+import '../_commonjsHelpers-COf7qtKz.js';
+import '../isObjectLike-CqUyaiWM.js';
+import '../isSymbol-_Iyy_jRJ.js';
+import '../noop-CNfu_5-L.js';
+import '../ComboboxActivator-GbDe5-gd.js';
+import '../useAssert-BRTg70rg.js';
+import '../_polyfill-node.process-e5fcXoUk.js';

package/dist/Combobox-DL8grBGD.js

@@ -0,0 +1,119 @@
+'use strict';
+
+var React = require('react');
+var ComboboxContent = require('./ComboboxContent-PbGOqYiy.js');
+var ComboboxAction = require('./ComboboxAction-BrphUdTc.js');
+var ComboboxProvider = require('./ComboboxProvider-BfK8pUar.js');
+var ComboboxTrigger = require('./ComboboxTrigger-BPoUI5Eo.js');
+var ComboboxOption = require('./ComboboxOption-CEM44lR4.js');
+var debounce = require('./debounce-DNEaQL1N.js');
+var noop = require('./noop-C8qh6oDm.js');
+var ComboboxActivator = require('./ComboboxActivator-B-hbPIvc.js');
+var useAssert = require('./useAssert--FSFxEub.js');
+
+var styles = {"overlay":"W8qMZnORYxI-","wrapper":"_-0dkolvLF-Y-"};
+
+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.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.noop,
+    };
+}
+
+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_2(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.createElement(ComboboxProvider.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.ComboboxTrigger, { label: props.label, selected: props.selected })),
+            React.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-DkiMKBIq.js

@@ -0,0 +1,117 @@
+import React, { useCallback, useRef, useState, Children, isValidElement, useMemo } from 'react';
+import { C as ComboboxContent } from './ComboboxContent-Y7XnpDxG.js';
+import { C as ComboboxAction } from './ComboboxAction-BZcUzPiS.js';
+import { C as ComboboxContextProvider } from './ComboboxProvider-CnooL3he.js';
+import { C as ComboboxTrigger } from './ComboboxTrigger-CUU6Np4P.js';
+import { C as ComboboxOption } from './ComboboxOption-BQAcmD8S.js';
+import { d as debounce } from './debounce-DgeBwtKp.js';
+import { n as noop } from './noop-CNfu_5-L.js';
+import { C as ComboboxActivator } from './ComboboxActivator-GbDe5-gd.js';
+import { u as useAssert_2 } from './useAssert-BRTg70rg.js';
+
+var styles = {"overlay":"W8qMZnORYxI-","wrapper":"_-0dkolvLF-Y-"};
+
+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_2(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 };

package/dist/ComboboxAction-BZcUzPiS.js

@@ -0,0 +1,22 @@
+import React, { useContext } from 'react';
+import { T as Typography } from './Typography-D6YoQOGF.js';
+import { a as ComboboxContext } from './ComboboxProvider-CnooL3he.js';
+
+var styles = {"actionContainer":"Ow9wSNnGP-g-","actionButton":"ncp0nKHQ7d8-"};
+
+function ComboboxAction(props) {
+    const { searchValue } = useContext(ComboboxContext);
+    if (props.visible) {
+        const isVisible = typeof props.visible === "function" && !props.visible({ searchValue });
+        if (isVisible || !props.visible) {
+            return null;
+        }
+    }
+    const options = { searchValue };
+    const computedLabel = typeof props.label === "string" ? props.label : props.label(options);
+    return (React.createElement("div", { className: styles.actionContainer },
+        React.createElement("button", { className: styles.actionButton, onClick: e => props.onClick(e, options), type: "button" },
+            React.createElement(Typography, { element: "span", size: "base", textColor: "green", fontWeight: "semiBold" }, computedLabel))));
+}
+
+export { ComboboxAction as C };