@jobber/components 4.90.4 → 4.90.5

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

@@ -0,0 +1,8 @@
+export { C as ComboboxContentHeader } from '../../../../ComboboxContentHeader-BF43vAXl.js';
+import 'react';
+import '../../../../Typography-DscVWtp8.js';
+import 'classnames';
+import '../../../../Button-BH4Hhr2S.js';
+import 'react-router-dom';
+import '../../../../Icon-Dic5myD3.js';
+import '@jobber/design';

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

@@ -0,0 +1,24 @@
+'use strict';
+
+var ComboboxContentList = require('../../../../ComboboxContentList-DFv7m0NQ.js');
+require('react');
+require('classnames');
+require('../../../../Text-BKFV1Z0j.js');
+require('../../../../Typography-BiJhpsiL.js');
+require('../../../../Glimmer-CG9tFCHs.js');
+require('../../../../tslib.es6-BBH1pS30.js');
+require('../../../../Content-D5eJgx6J.js');
+require('../../../../Spinner-CjTb3xIl.js');
+require('../../../../AnimatedPresence-BWePg1sL.js');
+require('framer-motion');
+require('@jobber/design');
+require('../../../../ComboboxOption-DSzlMoup.js');
+require('../../../../Icon-C05AQvkv.js');
+require('../../../../Flex-Dh0WNozY.js');
+require('../../../../ComboboxProvider-ku2HdEkO.js');
+require('../../../../ComboboxLoadMore-CUK0n3WY.js');
+require('../../../../useInView-DGjydyXL.js');
+
+
+
+exports.ComboboxContentList = ComboboxContentList.ComboboxContentList;

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

@@ -0,0 +1,18 @@
+export { C as ComboboxContentList } from '../../../../ComboboxContentList-nxCsc_XU.js';
+import 'react';
+import 'classnames';
+import '../../../../Text-CfxmOdM-.js';
+import '../../../../Typography-DscVWtp8.js';
+import '../../../../Glimmer-IWgpoHGI.js';
+import '../../../../tslib.es6-5nrZ19JS.js';
+import '../../../../Content-CobtdYug.js';
+import '../../../../Spinner-DGO8_Jsa.js';
+import '../../../../AnimatedPresence-CzXm0q2a.js';
+import 'framer-motion';
+import '@jobber/design';
+import '../../../../ComboboxOption-BMg1O_Br.js';
+import '../../../../Icon-Dic5myD3.js';
+import '../../../../Flex-Bfl-vL64.js';
+import '../../../../ComboboxProvider-GdvooWYJ.js';
+import '../../../../ComboboxLoadMore-t_s_eVDp.js';
+import '../../../../useInView-CjeNEvX0.js';

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

@@ -0,0 +1,10 @@
+'use strict';
+
+var ComboboxContentSearch = require('../../../../ComboboxContentSearch-C2RHQNXR.js');
+require('react');
+require('../../../../Icon-C05AQvkv.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-DX-BiYTa.js';
+import 'react';
+import '../../../../Icon-Dic5myD3.js';
+import '@jobber/design';

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

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

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

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

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

@@ -0,0 +1,34 @@
+'use strict';
+
+var ComboboxContent = require('../../../ComboboxContent-miRfjhNV.js');
+require('react');
+require('classnames');
+require('react-dom');
+require('../../../ComboboxContentSearch-C2RHQNXR.js');
+require('../../../Icon-C05AQvkv.js');
+require('@jobber/design');
+require('../../../ComboboxContentList-DFv7m0NQ.js');
+require('../../../Text-BKFV1Z0j.js');
+require('../../../Typography-BiJhpsiL.js');
+require('../../../Glimmer-CG9tFCHs.js');
+require('../../../tslib.es6-BBH1pS30.js');
+require('../../../Content-D5eJgx6J.js');
+require('../../../Spinner-CjTb3xIl.js');
+require('../../../AnimatedPresence-BWePg1sL.js');
+require('framer-motion');
+require('../../../ComboboxOption-DSzlMoup.js');
+require('../../../Flex-Dh0WNozY.js');
+require('../../../ComboboxProvider-ku2HdEkO.js');
+require('../../../ComboboxLoadMore-CUK0n3WY.js');
+require('../../../useInView-DGjydyXL.js');
+require('../../../ComboboxContentHeader-Cirx9k9L.js');
+require('../../../Button-BPYGeGx2.js');
+require('react-router-dom');
+require('../../../useRefocusOnActivator-BnM3unqN.js');
+require('../../../useFocusTrap-B-xOQ79p.js');
+require('react-popper');
+require('../../../useOnKeyDown-W2x-4HSi.js');
+
+
+
+exports.ComboboxContent = ComboboxContent.ComboboxContent;

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

@@ -0,0 +1,28 @@
+export { C as ComboboxContent } from '../../../ComboboxContent-u1C3PXKH.js';
+import 'react';
+import 'classnames';
+import 'react-dom';
+import '../../../ComboboxContentSearch-DX-BiYTa.js';
+import '../../../Icon-Dic5myD3.js';
+import '@jobber/design';
+import '../../../ComboboxContentList-nxCsc_XU.js';
+import '../../../Text-CfxmOdM-.js';
+import '../../../Typography-DscVWtp8.js';
+import '../../../Glimmer-IWgpoHGI.js';
+import '../../../tslib.es6-5nrZ19JS.js';
+import '../../../Content-CobtdYug.js';
+import '../../../Spinner-DGO8_Jsa.js';
+import '../../../AnimatedPresence-CzXm0q2a.js';
+import 'framer-motion';
+import '../../../ComboboxOption-BMg1O_Br.js';
+import '../../../Flex-Bfl-vL64.js';
+import '../../../ComboboxProvider-GdvooWYJ.js';
+import '../../../ComboboxLoadMore-t_s_eVDp.js';
+import '../../../useInView-CjeNEvX0.js';
+import '../../../ComboboxContentHeader-BF43vAXl.js';
+import '../../../Button-BH4Hhr2S.js';
+import 'react-router-dom';
+import '../../../useRefocusOnActivator-BAub7L-i.js';
+import '../../../useFocusTrap-D0gOZaSx.js';
+import 'react-popper';
+import '../../../useOnKeyDown-07RktdgP.js';

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

@@ -0,0 +1,14 @@
+'use strict';
+
+var ComboboxOption = require('../../../ComboboxOption-DSzlMoup.js');
+require('react');
+require('classnames');
+require('../../../Icon-C05AQvkv.js');
+require('@jobber/design');
+require('../../../Flex-Dh0WNozY.js');
+require('../../../ComboboxProvider-ku2HdEkO.js');
+require('../../../tslib.es6-BBH1pS30.js');
+
+
+
+exports.ComboboxOption = ComboboxOption.ComboboxOption;

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

@@ -0,0 +1,8 @@
+export { C as ComboboxOption } from '../../../ComboboxOption-BMg1O_Br.js';
+import 'react';
+import 'classnames';
+import '../../../Icon-Dic5myD3.js';
+import '@jobber/design';
+import '../../../Flex-Bfl-vL64.js';
+import '../../../ComboboxProvider-GdvooWYJ.js';
+import '../../../tslib.es6-5nrZ19JS.js';

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

@@ -0,0 +1,25 @@
+'use strict';
+
+var ComboboxTrigger = require('../../../ComboboxTrigger-1KuifQvl.js');
+require('react');
+require('../../../Chip-Br7-JkgN.js');
+require('classnames');
+require('../../../useInView-DGjydyXL.js');
+require('../../../Avatar-DTFS2kFm.js');
+require('color');
+require('../../../Icon-C05AQvkv.js');
+require('@jobber/design');
+require('../../../useChildComponent-D7PbyArU.js');
+require('../../../Typography-BiJhpsiL.js');
+require('../../../Tooltip-PbQMMMXT.js');
+require('react-dom');
+require('framer-motion');
+require('../../../useSafeLayoutEffect-juh5vdFE.js');
+require('../../../useIsMounted-DfJrPzyU.js');
+require('react-popper');
+require('../../../tslib.es6-BBH1pS30.js');
+require('../../../ComboboxProvider-ku2HdEkO.js');
+
+
+
+exports.ComboboxTrigger = ComboboxTrigger.ComboboxTrigger;

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

@@ -0,0 +1,19 @@
+export { C as ComboboxTrigger } from '../../../ComboboxTrigger-CvcB6ptJ.js';
+import 'react';
+import '../../../Chip-CGMUQ-V-.js';
+import 'classnames';
+import '../../../useInView-CjeNEvX0.js';
+import '../../../Avatar-BPd8t6BU.js';
+import 'color';
+import '../../../Icon-Dic5myD3.js';
+import '@jobber/design';
+import '../../../useChildComponent-CwlKwCml.js';
+import '../../../Typography-DscVWtp8.js';
+import '../../../Tooltip-BrnUcSMD.js';
+import 'react-dom';
+import 'framer-motion';
+import '../../../useSafeLayoutEffect-BW_VIS6-.js';
+import '../../../useIsMounted-BxDu0lnY.js';
+import 'react-popper';
+import '../../../tslib.es6-5nrZ19JS.js';
+import '../../../ComboboxProvider-GdvooWYJ.js';

package/dist/Combobox/index.cjs

@@ -0,0 +1,53 @@
+'use strict';
+
+var Combobox = require('../Combobox-DxPzrwcK.js');
+var ComboboxProvider = require('../ComboboxProvider-ku2HdEkO.js');
+require('react');
+require('../ComboboxContent-miRfjhNV.js');
+require('classnames');
+require('react-dom');
+require('../ComboboxContentSearch-C2RHQNXR.js');
+require('../Icon-C05AQvkv.js');
+require('@jobber/design');
+require('../ComboboxContentList-DFv7m0NQ.js');
+require('../Text-BKFV1Z0j.js');
+require('../Typography-BiJhpsiL.js');
+require('../Glimmer-CG9tFCHs.js');
+require('../tslib.es6-BBH1pS30.js');
+require('../Content-D5eJgx6J.js');
+require('../Spinner-CjTb3xIl.js');
+require('../AnimatedPresence-BWePg1sL.js');
+require('framer-motion');
+require('../ComboboxOption-DSzlMoup.js');
+require('../Flex-Dh0WNozY.js');
+require('../ComboboxLoadMore-CUK0n3WY.js');
+require('../useInView-DGjydyXL.js');
+require('../ComboboxContentHeader-Cirx9k9L.js');
+require('../Button-BPYGeGx2.js');
+require('react-router-dom');
+require('../useRefocusOnActivator-BnM3unqN.js');
+require('../useFocusTrap-B-xOQ79p.js');
+require('react-popper');
+require('../useOnKeyDown-W2x-4HSi.js');
+require('../ComboboxAction-Ct0ao84E.js');
+require('../ComboboxTrigger-1KuifQvl.js');
+require('../Chip-Br7-JkgN.js');
+require('../Avatar-DTFS2kFm.js');
+require('color');
+require('../useChildComponent-D7PbyArU.js');
+require('../Tooltip-PbQMMMXT.js');
+require('../useSafeLayoutEffect-juh5vdFE.js');
+require('../useIsMounted-DfJrPzyU.js');
+require('../debounce-DtVkjvKH.js');
+require('../_commonjsHelpers-BHq9dk6I.js');
+require('../isObjectLike-zrq0mtNG.js');
+require('../isSymbol-B7o505jx.js');
+require('../noop-mF8IIYWw.js');
+require('../ComboboxActivator-uU5VaZqF.js');
+require('../useAssert-BTe43jaI.js');
+require('../_polyfill-node.process-7AsFqJce.js');
+
+
+
+exports.Combobox = Combobox.Combobox;
+exports.ComboboxContextProvider = ComboboxProvider.ComboboxContextProvider;

package/dist/Combobox/index.mjs

@@ -0,0 +1,46 @@
+export { C as Combobox } from '../Combobox-D0Qo3yYu.js';
+export { C as ComboboxContextProvider } from '../ComboboxProvider-GdvooWYJ.js';
+import 'react';
+import '../ComboboxContent-u1C3PXKH.js';
+import 'classnames';
+import 'react-dom';
+import '../ComboboxContentSearch-DX-BiYTa.js';
+import '../Icon-Dic5myD3.js';
+import '@jobber/design';
+import '../ComboboxContentList-nxCsc_XU.js';
+import '../Text-CfxmOdM-.js';
+import '../Typography-DscVWtp8.js';
+import '../Glimmer-IWgpoHGI.js';
+import '../tslib.es6-5nrZ19JS.js';
+import '../Content-CobtdYug.js';
+import '../Spinner-DGO8_Jsa.js';
+import '../AnimatedPresence-CzXm0q2a.js';
+import 'framer-motion';
+import '../ComboboxOption-BMg1O_Br.js';
+import '../Flex-Bfl-vL64.js';
+import '../ComboboxLoadMore-t_s_eVDp.js';
+import '../useInView-CjeNEvX0.js';
+import '../ComboboxContentHeader-BF43vAXl.js';
+import '../Button-BH4Hhr2S.js';
+import 'react-router-dom';
+import '../useRefocusOnActivator-BAub7L-i.js';
+import '../useFocusTrap-D0gOZaSx.js';
+import 'react-popper';
+import '../useOnKeyDown-07RktdgP.js';
+import '../ComboboxAction-I7TT2mVE.js';
+import '../ComboboxTrigger-CvcB6ptJ.js';
+import '../Chip-CGMUQ-V-.js';
+import '../Avatar-BPd8t6BU.js';
+import 'color';
+import '../useChildComponent-CwlKwCml.js';
+import '../Tooltip-BrnUcSMD.js';
+import '../useSafeLayoutEffect-BW_VIS6-.js';
+import '../useIsMounted-BxDu0lnY.js';
+import '../debounce-DHeCta_M.js';
+import '../_commonjsHelpers-Dw5gAsMR.js';
+import '../isObjectLike-53d8VfgU.js';
+import '../isSymbol-Co3-vUC1.js';
+import '../noop-B8ZS2J9q.js';
+import '../ComboboxActivator-BOGk012k.js';
+import '../useAssert-CSmf3rDf.js';
+import '../_polyfill-node.process-B3Zw2Wh0.js';

package/dist/Combobox-D0Qo3yYu.js

@@ -0,0 +1,117 @@
+import React, { useCallback, useRef, useState, Children, isValidElement, useMemo } from 'react';
+import { C as ComboboxContent } from './ComboboxContent-u1C3PXKH.js';
+import { C as ComboboxAction } from './ComboboxAction-I7TT2mVE.js';
+import { C as ComboboxContextProvider } from './ComboboxProvider-GdvooWYJ.js';
+import { C as ComboboxTrigger } from './ComboboxTrigger-CvcB6ptJ.js';
+import { C as ComboboxOption } from './ComboboxOption-BMg1O_Br.js';
+import { d as debounce } from './debounce-DHeCta_M.js';
+import { n as noop } from './noop-B8ZS2J9q.js';
+import { C as ComboboxActivator } from './ComboboxActivator-BOGk012k.js';
+import { u as useAssert_2 } from './useAssert-CSmf3rDf.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/Combobox-DxPzrwcK.js

@@ -0,0 +1,119 @@
+'use strict';
+
+var React = require('react');
+var ComboboxContent = require('./ComboboxContent-miRfjhNV.js');
+var ComboboxAction = require('./ComboboxAction-Ct0ao84E.js');
+var ComboboxProvider = require('./ComboboxProvider-ku2HdEkO.js');
+var ComboboxTrigger = require('./ComboboxTrigger-1KuifQvl.js');
+var ComboboxOption = require('./ComboboxOption-DSzlMoup.js');
+var debounce = require('./debounce-DtVkjvKH.js');
+var noop = require('./noop-mF8IIYWw.js');
+var ComboboxActivator = require('./ComboboxActivator-uU5VaZqF.js');
+var useAssert = require('./useAssert-BTe43jaI.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/ComboboxAction-Ct0ao84E.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var React = require('react');
+var Typography = require('./Typography-BiJhpsiL.js');
+var ComboboxProvider = require('./ComboboxProvider-ku2HdEkO.js');
+
+var styles = {"actionContainer":"Ow9wSNnGP-g-","actionButton":"ncp0nKHQ7d8-"};
+
+function ComboboxAction(props) {
+    const { searchValue } = React.useContext(ComboboxProvider.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.Typography, { element: "span", size: "base", textColor: "green", fontWeight: "semiBold" }, computedLabel))));
+}
+
+exports.ComboboxAction = ComboboxAction;

package/dist/ComboboxAction-I7TT2mVE.js

@@ -0,0 +1,22 @@
+import React, { useContext } from 'react';
+import { T as Typography } from './Typography-DscVWtp8.js';
+import { a as ComboboxContext } from './ComboboxProvider-GdvooWYJ.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 };

package/dist/ComboboxActivator-BOGk012k.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { B as Button } from './Button-BH4Hhr2S.js';
+import { C as Chip } from './Chip-CGMUQ-V-.js';
+import './tslib.es6-5nrZ19JS.js';
+import '@jobber/design';
+import { a as ComboboxContext } from './ComboboxProvider-GdvooWYJ.js';
+
+function ComboboxActivator(props) {
+    const { handleClose, open, setOpen } = React.useContext(ComboboxContext);
+    if (props.children.type === Button || props.children.type === Chip) {
+        return React.cloneElement(props.children, {
+            role: "combobox",
+            onClick: () => {
+                if (open) {
+                    handleClose();
+                }
+                else {
+                    setOpen(true);
+                }
+            },
+        });
+    }
+    return props.children;
+}
+
+export { ComboboxActivator as C };