@integration-app/react 2.0.3 → 2.0.4-beta.0

package/dist/cjs/_modules/awesome-debounce-promise.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/_modules/react-use-promise.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/AdvancedOptions.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/Button/Button.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/Button/Button.module.css.cjs

@@ -1,7 +1,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/ComboBox.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/ActiveCategoryContent.cjs

@@ -2,19 +2,15 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var categoryContentMapping = require('./categoryContentMapping.cjs');
-require('../context/combobox-context.cjs');
 var comboboxDropdownContext = require('../context/combobox-dropdown-context.cjs');
-require('../context/combobox-dropdown-search.cjs');
-require('../context/combobox-dropdown-stack.cjs');
-require('@integration-app/sdk');
+var categoryContentMapping = require('./categoryContentMapping.cjs');
 
 function ActiveCategoryContent({
   onOptionSelect

package/dist/cjs/components/ComboBox/Dropdown/Categories/CustomValue.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/Formulas/DropdownPanelFormulaConfig.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -58,14 +58,18 @@ function DropdownPanelFormulaConfig({
 }) {
   const styles = formulaConfigRecipe();
   const formulas = index.getFormulas();
-  const { value, schema, variablesSchema } = comboboxContext.useComboBox();
+  const { value, schema, variablesSchema, scopedComboboxId } = comboboxContext.useComboBox();
   const { drillUp } = comboboxDropdownContext.useComboBoxDropdownContext();
   const [localValue, setLocalValue] = React.useState(value);
   React.useEffect(() => {
     setLocalValue(value);
   }, [JSON.stringify(value)]);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_LEFT, () => {
-    drillUp();
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_LEFT,
+    callback: () => {
+      drillUp();
+    }
   });
   const formula = sdk.getFormula(localValue);
   const formulaSpec = formula?.type && formulas[formula?.type];

package/dist/cjs/components/ComboBox/Dropdown/Categories/Formulas/index.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/Lookup.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -30,11 +30,12 @@ var Field = require('../../../DataBuilder/Field.cjs');
 var index = require('../../../DataBuilder/index.cjs');
 var Form = require('../../../DataBuilder/Form.cjs');
 var keyboardEvents = require('../../../../hooks/keyboard-events.cjs');
-require('../../context/combobox-context.cjs');
+var comboboxContext = require('../../context/combobox-context.cjs');
 var comboboxDropdownContext = require('../../context/combobox-dropdown-context.cjs');
 require('../../context/combobox-dropdown-search.cjs');
 require('../../context/combobox-dropdown-stack.cjs');
 var getLookupCollection = require('./getLookupCollection.cjs');
+var helpers = require('../../DropdownPopover/helpers.cjs');
 
 function LookupCategoryContent({
   onOptionSelect
@@ -75,10 +76,12 @@ const lookupConfigRecipe = sva.sva({
   }
 });
 function DataBuilderDrillDownLookup({ field, onChange }) {
+  helpers.useMountDropdownReposition();
   const { client } = integrationAppClientContext.useIntegrationAppClient();
   const { integrationId } = integrationAppIntegrationContext.useIntegrationAppIntegration();
   const { connectionId } = integrationAppConnectionContext.useIntegrationAppConnection();
   const { drillUp } = comboboxDropdownContext.useComboBoxDropdownContext();
+  const { scopedComboboxId } = comboboxContext.useComboBox();
   const lookupValue = field.value?.$lookup ?? {};
   const styles = lookupConfigRecipe();
   const [
@@ -92,8 +95,12 @@ function DataBuilderDrillDownLookup({ field, onChange }) {
     () => getLookupSchemas({ field, client, connectionId, integrationId }),
     [sdk.getReferenceCollectionPathForSchema(field.schema)]
   );
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_LEFT, () => {
-    drillUp();
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_LEFT,
+    callback: () => {
+      drillUp();
+    }
   });
   function handleLookupChange(value) {
     onChange?.({

package/dist/cjs/components/ComboBox/Dropdown/Categories/LookupOptions/ParametersPanel.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/LookupOptions/UiComponents.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/LookupOptions/index.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -228,16 +228,37 @@ function LookupOptionsList({
   onOptionSelect
 }) {
   const { isOptionSelected, drillUp } = comboboxDropdownContext.useComboBoxDropdownContext();
+  const { scopedComboboxId } = comboboxContext.useComboBox();
   const [currentOption, setCurrentOption] = React.useState(
     null
   );
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_DOWN, makePreviousOptionCurrent);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_UP, makeNextOptionCurrent);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_LEFT, () => {
-    drillUp();
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_DOWN,
+    callback: makePreviousOptionCurrent
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_UP,
+    callback: makeNextOptionCurrent
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_LEFT,
+    callback: () => {
+      drillUp();
+    }
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_RIGHT,
+    callback: handleKeyEnter
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_SELECT,
+    callback: handleKeyEnter
   });
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_RIGHT, handleKeyEnter);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_SELECT, handleKeyEnter);
   useDeepEffect.useDeepEffect(() => {
     if (!options?.length) {
       return;

package/dist/cjs/components/ComboBox/Dropdown/Categories/Options.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/Root.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -13,11 +13,7 @@ var types = require('../../types.cjs');
 var index = require('../../../DropdownUI/index.cjs');
 var OptionsList = require('../OptionsList.cjs');
 var index$1 = require('./LookupOptions/index.cjs');
-require('../../context/combobox-context.cjs');
 var comboboxDropdownContext = require('../../context/combobox-dropdown-context.cjs');
-require('../../context/combobox-dropdown-search.cjs');
-require('../../context/combobox-dropdown-stack.cjs');
-require('@integration-app/sdk');
 
 function RootCategoryContent({
   onOptionSelect

package/dist/cjs/components/ComboBox/Dropdown/Categories/Variables.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/Categories/getLookupCollection.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/DrillUpButton.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -10,12 +10,8 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-require('../context/combobox-context.cjs');
-var comboboxDropdownContext = require('../context/combobox-dropdown-context.cjs');
-require('../context/combobox-dropdown-search.cjs');
-require('../context/combobox-dropdown-stack.cjs');
-require('@integration-app/sdk');
 var index = require('../../DropdownUI/index.cjs');
+var comboboxDropdownContext = require('../context/combobox-dropdown-context.cjs');
 
 const DrillUpButton = React.forwardRef(({ onClick, ...props }, ref) => {
   const { drillUp, drillDownStackTop } = comboboxDropdownContext.useComboBoxDropdownContext();

package/dist/cjs/components/ComboBox/Dropdown/Dropdown.cjs

@@ -2,64 +2,50 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var Popper = require('../../ComboBoxElements/Popper.cjs');
-var index = require('../../DropdownUI/index.cjs');
-var useWindowEvent = require('../../../hooks/useWindowEvent.cjs');
+var index$1 = require('../../DropdownUI/index.cjs');
 var comboboxDropdownContext = require('../context/combobox-dropdown-context.cjs');
 var comboboxDropdownStack = require('../context/combobox-dropdown-stack.cjs');
 var SearchInput = require('./SearchInput.cjs');
 var ActiveCategoryContent = require('./ActiveCategoryContent.cjs');
 var DrillUpButton = require('./DrillUpButton.cjs');
+var index = require('../DropdownPopover/index.cjs');
 
-const Dropdown = React.forwardRef(
-  ({
-    referenceElement,
-    topDropdownPanelComponent,
-    autoFocusOnSearch,
-    onOptionSelect,
-    onClose
-  }, ref) => {
-    const { isClickInsideRefsAndChildren } = comboboxDropdownStack.useDropdownStackContext(
-      ref
-    );
-    useClick((event) => {
-      if (!isClickInsideRefsAndChildren(event)) {
-        onClose();
-      }
-    });
-    useWindowEvent.useWindowEvent("keydown", (e) => {
-      e.key === "Escape" && onClose();
-    });
-    const { availableCategories } = comboboxDropdownContext.useComboBoxDropdownContext();
-    if (availableCategories === null) {
-      return null;
-    }
-    if (availableCategories?.length < 1) {
-      return /* @__PURE__ */ jsxRuntime.jsx(comboboxDropdownStack.DropdownStackContextProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Popper.DropdownUIPopper, { referenceElement, children: /* @__PURE__ */ jsxRuntime.jsx(index.DropdownUI, { ref, children: /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownUI.List, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(index.DropdownUI.LoadingItem, {}),
-        /* @__PURE__ */ jsxRuntime.jsx(index.DropdownUI.LoadingItem, {}),
-        /* @__PURE__ */ jsxRuntime.jsx(index.DropdownUI.LoadingItem, {})
-      ] }) }) }) });
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(comboboxDropdownStack.DropdownStackContextProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Popper.DropdownUIPopper, { referenceElement, children: /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownUI, { ref, children: [
+function Dropdown({
+  topDropdownPanelComponent,
+  autoFocusOnSearch,
+  onOptionSelect,
+  children
+}) {
+  const { availableCategories } = comboboxDropdownContext.useComboBoxDropdownContext();
+  if (availableCategories === null) {
+    return children;
+  }
+  if (availableCategories?.length < 1) {
+    return /* @__PURE__ */ jsxRuntime.jsx(comboboxDropdownStack.DropdownStackContextProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownPopoverProvider, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(index.DropdownAnchor, { children }),
+      /* @__PURE__ */ jsxRuntime.jsx(index.DropdownPopoverContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(index$1.DropdownUI.List, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(index$1.DropdownUI.LoadingItem, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(index$1.DropdownUI.LoadingItem, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(index$1.DropdownUI.LoadingItem, {})
+      ] }) })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(comboboxDropdownStack.DropdownStackContextProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownPopoverProvider, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index.DropdownAnchor, { children }),
+    /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownPopoverContent, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(DrillUpButton.DrillUpButton, {}),
       topDropdownPanelComponent && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: topDropdownPanelComponent }),
       /* @__PURE__ */ jsxRuntime.jsx(SearchInput.SearchInput, { autoFocus: autoFocusOnSearch }),
       /* @__PURE__ */ jsxRuntime.jsx(ActiveCategoryContent.ActiveCategoryContent, { onOptionSelect })
-    ] }) }) });
-  }
-);
-function useClick(cb) {
-  useWindowEvent.useWindowEvent("mouseup", cb);
-  useWindowEvent.useWindowEvent("touchend", cb);
+    ] })
+  ] }) });
 }
 
 exports.Dropdown = Dropdown;

package/dist/cjs/components/ComboBox/Dropdown/Option.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/OptionsList.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -33,17 +33,37 @@ function OptionsList({
     optionsPayload,
     drillUp
   } = comboboxDropdownContext.useComboBoxDropdownContext();
+  const { value: parentInputValue, scopedComboboxId } = comboboxContext.useComboBox();
   const [currentOption, setCurrentOption] = React.useState(
     null
   );
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_DOWN, makePreviousOptionCurrent);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_UP, makeNextOptionCurrent);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_LEFT, () => {
-    drillUp();
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_DOWN,
+    callback: makePreviousOptionCurrent
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_UP,
+    callback: makeNextOptionCurrent
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_LEFT,
+    callback: () => {
+      drillUp();
+    }
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_RIGHT,
+    callback: handleKeyEnter
+  });
+  keyboardEvents.useKeyboardEventSubscribe({
+    scopedComboboxId,
+    event: keyboardEvents.EVENT_TYPE.OPTION_SELECT,
+    callback: handleKeyEnter
   });
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_RIGHT, handleKeyEnter);
-  keyboardEvents.useKeyboardEventSubscribe(keyboardEvents.EVENT_TYPE.OPTION_SELECT, handleKeyEnter);
-  const { value: parentInputValue } = comboboxContext.useComboBox();
   const [options = [], optionsError, optionsState] = optionsPayload;
   useDeepEffect.useDeepEffect(() => {
     if (!options?.length) {

package/dist/cjs/components/ComboBox/Dropdown/SearchInput.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 

package/dist/cjs/components/ComboBox/Dropdown/categoryContentMapping.cjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3
+ * v2.0.4-beta.0
  */
 'use client';
 
@@ -53,13 +53,7 @@ const renderCategories = {
     title: "Select Dynamically",
     hideSearchInput: true,
     hasConfigUI: true,
-    icon: svgIconType.SvgIconType.UDMEntity
-  },
-  [types.DropdownCategoryType.SELECT_FROM_COLLECTION_DYNAMICALLY]: {
-    title: "Select Dynamically",
-    hideSearchInput: true,
-    hasConfigUI: true,
-    icon: svgIconType.SvgIconType.UDMEntity
+    icon: svgIconType.SvgIconType.Search
   }
 };
 const CATEGORY_COMPONENTS = {
@@ -70,7 +64,6 @@ const CATEGORY_COMPONENTS = {
   [types.DropdownCategoryType.FORMULA_CONFIG]: DropdownPanelFormulaConfig.DropdownPanelFormulaConfig,
   [types.DropdownCategoryType.CUSTOM]: CustomValue.CustomValueCategoryContent,
   [types.DropdownCategoryType.SELECT_FROM_UDM_DYNAMICALLY]: Lookup.LookupCategoryContent,
-  [types.DropdownCategoryType.SELECT_FROM_COLLECTION_DYNAMICALLY]: Lookup.LookupCategoryContent,
   [types.DropdownCategoryType.LOOKUP_OPTIONS]: Root.RootCategoryContent
 };
 

package/dist/cjs/components/ComboBox/DropdownPopover/helpers.cjs

@@ -0,0 +1,22 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.4-beta.0
+ */
+'use client';
+
+'use strict';
+
+var React = require('react');
+require('../../../ui-kit/styled/popover.cjs');
+var popover = require('@ark-ui/react/popover');
+
+const useMountDropdownReposition = () => {
+  const context = popover.usePopoverContext();
+  React.useEffect(() => {
+    context.reposition();
+  }, [context.reposition]);
+};
+
+exports.useMountDropdownReposition = useMountDropdownReposition;

package/dist/cjs/components/ComboBox/DropdownPopover/index.cjs

@@ -0,0 +1,101 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.4-beta.0
+ */
+'use client';
+
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var react = require('@ark-ui/react');
+var popover = require('../../../ui-kit/styled/popover.cjs');
+var comboboxContext = require('../context/combobox-context.cjs');
+require('../context/combobox-dropdown-context.cjs');
+require('../context/combobox-dropdown-search.cjs');
+var comboboxDropdownStack = require('../context/combobox-dropdown-stack.cjs');
+require('@integration-app/sdk');
+var useWindowEvent = require('../../../hooks/useWindowEvent.cjs');
+var index = require('../../DropdownUI/index.cjs');
+var keyboardEvents = require('../../../hooks/keyboard-events.cjs');
+var constants = require('../../DropdownUI/constants.cjs');
+
+const GUTTER = 10;
+const POSITIONING = {
+  placement: "bottom-start",
+  gutter: GUTTER,
+  slide: true,
+  fitViewport: true
+};
+const isStorybook = Boolean(globalThis?.__STORYBOOK_PREVIEW__);
+const storybookPortalNode = "#storybook-root";
+function DropdownPopoverProvider({
+  children
+}) {
+  const { isDropdownOpen, closeDropdown } = comboboxContext.useComboBox();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    popover.Root,
+    {
+      open: isDropdownOpen,
+      onEscapeKeyDown: closeDropdown,
+      closeOnInteractOutside: false,
+      unmountOnExit: true,
+      lazyMount: true,
+      portalled: true,
+      autoFocus: false,
+      positioning: POSITIONING,
+      children
+    }
+  );
+}
+function DropdownPopoverContent({
+  children
+}) {
+  const containerRef = React.useRef(null);
+  React.useEffect(() => {
+    if (isStorybook) {
+      containerRef.current = document.querySelector(storybookPortalNode);
+    }
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(react.Portal, { container: containerRef, children: /* @__PURE__ */ jsxRuntime.jsx(popover.Positioner, { children: /* @__PURE__ */ jsxRuntime.jsx(DeferredContent, { children }) }) });
+}
+function DropdownAnchor({ children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(popover.Anchor, { display: "inline", children });
+}
+function DeferredContent({ children }) {
+  const id = React.useId();
+  const ref = React.useRef(null);
+  const { scopedComboboxId, closeDropdown } = comboboxContext.useComboBox();
+  keyboardEvents.useOptionListKeyNavDispatch(ref.current, scopedComboboxId);
+  const { isClickInsideRefsAndChildren } = comboboxDropdownStack.useDropdownStackContext(
+    ref
+  );
+  useClick((event) => {
+    if (!isClickInsideRefsAndChildren(event)) {
+      closeDropdown();
+    }
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    popover.Content,
+    {
+      ref,
+      "data-navigation-emitter-id": constants.DROPDOWN_NAVIGATOR_ID,
+      asChild: true,
+      "aria-labelledby": id,
+      children: /* @__PURE__ */ jsxRuntime.jsx(index.DropdownUI, { children: /* @__PURE__ */ jsxRuntime.jsxs(index.DropdownUI.Content, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(popover.Title, { srOnly: true, id, children: "Options menu" }),
+        children
+      ] }) })
+    }
+  );
+}
+function useClick(cb) {
+  useWindowEvent.useWindowEvent("mouseup", cb);
+  useWindowEvent.useWindowEvent("touchend", cb);
+}
+
+exports.DropdownAnchor = DropdownAnchor;
+exports.DropdownPopoverContent = DropdownPopoverContent;
+exports.DropdownPopoverProvider = DropdownPopoverProvider;