@elliemae/ds-form 1.60.0 → 2.0.0-alpha.12

package/esm/ComboBox/v3/config/useComboBox.js

@@ -1,63 +1,75 @@
-import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
-import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import 'core-js/modules/esnext.async-iterator.find.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import { useState, useRef, useCallback, useMemo } from 'react';
 import { useVirtual } from 'react-virtual';
 import { useGetComboBoxWithDefaultsProps } from './useGetPropsWithDefault.js';
-import '@elliemae/ds-props-helpers';
-import '../ComboBoxCTX.js';
 
-var useComboBox = function useComboBox(props) {
-  var _inputRef$current;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      showPopover = _useState2[0],
-      setShowPopover = _useState2[1];
-
-  var _useState3 = useState(),
-      _useState4 = _slicedToArray(_useState3, 2),
-      referenceElement = _useState4[0],
-      setReferenceElement = _useState4[1];
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const useComboBox = props => {
+  const [showPopover, setShowPopover] = useState(false);
+  const [referenceElement, setReferenceElement] = useState(null);
+  const [showSelectedValue, setShowSelectedValue] = useState(false);
+  const [showSelectedOptions, setShowSelectedOptions] = useState(false);
+  const [hasFocus, setHasFocus] = useState(false);
+  const [focusOptionIdx, setCurrentOption] = useState('');
+  const inputRef = useRef(null);
+  const listRef = useRef(null);
+  const wrapperListRef = useRef(null);
+  const selectedOptionsRef = useRef(null);
+  const controlsWrapperRef = useRef(null);
+  const pillGroupRef = useRef(null);
+  const propsWithDefaults = useGetComboBoxWithDefaultsProps(props);
+  const {
+    options,
+    selectedValues
+  } = propsWithDefaults; // ---------------------------------------------------------------------------
+  // Menu Options with/out selected filter
+  // ---------------------------------------------------------------------------
 
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      showSelectedValue = _useState6[0],
-      setShowSelectedValue = _useState6[1];
+  const selectedValuesWithSections = useCallback(() => {
+    var _items2;
 
-  var _useState7 = useState(false),
-      _useState8 = _slicedToArray(_useState7, 2),
-      hasFocus = _useState8[0],
-      setHasFocus = _useState8[1];
+    const multiSelectedValue = selectedValues;
+    const items = [];
+    options.forEach(option => {
+      const isSelectedValue = multiSelectedValue.find(item => item.dsId === option.dsId);
 
-  var _useState9 = useState(''),
-      _useState10 = _slicedToArray(_useState9, 2),
-      focusOptionIdx = _useState10[0],
-      setCurrentOption = _useState10[1];
+      if (isSelectedValue) {
+        items.push(option);
+      }
 
-  var inputRef = useRef();
-  var listRef = useRef();
-  var selectedOptionsRef = useRef();
-  var controlsWrapperRef = useRef();
-  var propsWithDefaults = useGetComboBoxWithDefaultsProps(props);
-  var options = propsWithDefaults.options; // ---------------------------------------------------------------------------
-  // Focusing first option when dropdown opens or input changes
-  // ---------------------------------------------------------------------------
+      if (option.type === 'section') {
+        var _items;
 
-  useEffect(function () {
-    if (showPopover) {
-      for (var i = 0; i < options.length; i += 1) {
-        if (!['section', 'separator'].includes(options[i].type)) {
-          setCurrentOption(options[i].dsId);
-          break;
+        if (((_items = items[items.length - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'section') {
+          items[items.length - 1] = option;
+        } else {
+          items.push(option);
         }
       }
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
+    });
+
+    if (((_items2 = items[items.length - 1]) === null || _items2 === void 0 ? void 0 : _items2.type) === 'section') {
+      items.pop();
+    }
 
-  }, [showPopover, (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value]); // ===========================================================================
+    return items;
+  }, [options, selectedValues]);
+  const correctOptions = useMemo(() => showSelectedOptions && Array.isArray(selectedValues) && selectedValues.length > 0 ? selectedValuesWithSections() : options, [options, selectedValuesWithSections, selectedValues, showSelectedOptions]); // ===========================================================================
   // Virtualization setup
   // ===========================================================================
 
-  var virtualListHelpers = useVirtual({
-    size: propsWithDefaults.options.length,
+  const virtualListHelpers = useVirtual({
+    size: correctOptions.length,
     parentRef: listRef,
     overscan: 15,
     paddingStart: 0
@@ -65,37 +77,38 @@ var useComboBox = function useComboBox(props) {
   // Scroll into view function
   // ===========================================================================
 
-  var scrollOptionIntoView = useCallback(function (dsId) {
-    var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+  const scrollOptionIntoView = useCallback(function (dsId) {
+    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
       align: 'center'
     };
-    virtualListHelpers.scrollToIndex(propsWithDefaults.options.findIndex(function (opt) {
-      return opt.dsId === dsId;
-    }), opts);
-  }, [propsWithDefaults.options, virtualListHelpers]);
-  var ctx = useMemo(function () {
-    return {
-      props: propsWithDefaults,
-      virtualListHelpers: virtualListHelpers,
-      showPopover: showPopover,
-      referenceElement: referenceElement,
-      inputRef: inputRef,
-      showSelectedValue: showSelectedValue,
-      listRef: listRef,
-      focusOptionIdx: focusOptionIdx,
-      selectedOptionsRef: selectedOptionsRef,
-      controlsWrapperRef: controlsWrapperRef,
-      hasFocus: hasFocus,
-      setHasFocus: setHasFocus,
-      setCurrentOption: setCurrentOption,
-      scrollOptionIntoView: scrollOptionIntoView,
-      setShowSelectedValue: setShowSelectedValue,
-      setReferenceElement: setReferenceElement,
-      setShowPopover: setShowPopover
-    };
-  }, [scrollOptionIntoView, propsWithDefaults, virtualListHelpers, focusOptionIdx, showSelectedValue, showPopover, referenceElement, inputRef, selectedOptionsRef, controlsWrapperRef, hasFocus, listRef]);
+    virtualListHelpers.scrollToIndex(correctOptions.findIndex(opt => opt.dsId === dsId), opts);
+  }, [correctOptions, virtualListHelpers]);
+  const ctx = useMemo(() => ({
+    props: _objectSpread(_objectSpread({}, propsWithDefaults), {}, {
+      options: correctOptions
+    }),
+    virtualListHelpers,
+    showPopover,
+    referenceElement,
+    inputRef,
+    showSelectedValue,
+    listRef,
+    focusOptionIdx,
+    selectedOptionsRef,
+    controlsWrapperRef,
+    hasFocus,
+    pillGroupRef,
+    showSelectedOptions,
+    wrapperListRef,
+    setShowSelectedOptions,
+    setHasFocus,
+    setCurrentOption,
+    scrollOptionIntoView,
+    setShowSelectedValue,
+    setReferenceElement,
+    setShowPopover
+  }), [scrollOptionIntoView, correctOptions, propsWithDefaults, virtualListHelpers, focusOptionIdx, showSelectedValue, wrapperListRef, showSelectedOptions, showPopover, pillGroupRef, referenceElement, inputRef, selectedOptionsRef, controlsWrapperRef, hasFocus, listRef]);
   return ctx;
 };
 
 export { useComboBox };
-//# sourceMappingURL=useComboBox.js.map

package/esm/ComboBox/v3/config/useGetPropsWithDefault.js

@@ -1,11 +1,7 @@
 import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';
 import { defaultProps } from '../ComboBoxCTX.js';
-import 'react';
 
 // we have to merge the "default" nested default values with what the user gives us...
-var useGetComboBoxWithDefaultsProps = function useGetComboBoxWithDefaultsProps(props) {
-  return useMemoMergePropsWithDefault(props, defaultProps);
-};
+const useGetComboBoxWithDefaultsProps = props => useMemoMergePropsWithDefault(props, defaultProps);
 
 export { useGetComboBoxWithDefaultsProps };
-//# sourceMappingURL=useGetPropsWithDefault.js.map

package/esm/ComboBox/v3/index.d.js

@@ -1,2 +1 @@
 
-//# sourceMappingURL=index.d.js.map

package/esm/ComboBox/v3/index.js

@@ -1,48 +1 @@
 export { DSComboBox, DSComboBoxWithSchema } from './ComboBox.js';
-import 'react';
-import 'react-desc';
-import '@elliemae/ds-props-helpers';
-import './config/useComboBox.js';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import 'react-virtual';
-import './config/useGetPropsWithDefault.js';
-import './ComboBoxCTX.js';
-import './parts/container/Container.js';
-import '@elliemae/ds-popperjs';
-import './parts/container/styled.js';
-import 'styled-components';
-import './parts/controls/Controls.js';
-import './parts/dropdown-indicator/DropdownIndicator.js';
-import '@elliemae/ds-icons/ChevronSmallDown';
-import './parts/dropdown-indicator/styled.js';
-import '@elliemae/ds-button';
-import './ComboboxDataTestids.js';
-import './parts/controls/styled.js';
-import '@elliemae/ds-grid';
-import './parts/multi-selected-values-container/MultiSelectedValuesContainer.js';
-import '@elliemae/ds-pills';
-import './parts/multi-selected-values-container/useGroupPills.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import './utils/hooks/useOnElementResize.js';
-import './parts/a11y-messages/MultiAllyMessages.js';
-import './utils/listHelper.js';
-import './parts/a11y-messages/styled.js';
-import './parts/controls-input/ControlsInput.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import './parts/controls-input/styled.js';
-import './utils/hooks/useKeyboardNavigation.js';
-import './parts/controls-input/useControlsInput.js';
-import './parts/single-selected-value-container/SingleSelectedValueContainer.js';
-import './parts/single-selected-value-container/styled.js';
-import './parts/menu-list/MenuList.js';
-import './parts/menu-list/styled.js';
-import './parts/header-list/HeaderList.js';
-import './parts/header-list/styled.js';
-import '@elliemae/ds-separator';
-import './parts/empty-state/index.js';
-import './parts/empty-state/styled.js';
-import './parts/menu-list/useMenuList.js';
-import '@babel/runtime/helpers/esm/extends';
-import '@elliemae/ds-form';
-import './propTypes.js';
-//# sourceMappingURL=index.js.map

package/esm/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js

@@ -1,25 +1,25 @@
-import React, { useContext } from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import { useContext } from 'react';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
 import { getSelectableOptions } from '../../utils/listHelper.js';
 import { StyledA11ySelectedValues } from './styled.js';
-import 'styled-components';
 
-var MultiAllyMessages = function MultiAllyMessages() {
-  var _useContext = useContext(ComboBoxContext),
-      _useContext$props = _useContext.props,
-      options = _useContext$props.options,
-      selectedValues = _useContext$props.selectedValues;
-
-  var selectableOptions = getSelectableOptions(options);
-  var multipleSelectedValues = selectedValues;
-  return /*#__PURE__*/React.createElement(StyledA11ySelectedValues, {
+const MultiAllyMessages = () => {
+  const {
+    props: {
+      options,
+      selectedValues
+    }
+  } = useContext(ComboBoxContext);
+  const selectableOptions = getSelectableOptions(options);
+  const multipleSelectedValues = selectedValues;
+  return /*#__PURE__*/_jsx(StyledA11ySelectedValues, {
     "aria-live": "polite",
     "aria-atomic": "false",
     "aria-relevant": "additions text"
-  }, "Options selected: ".concat(multipleSelectedValues.map(function (item) {
-    return item.label;
-  }).join(', '), ". ").concat(multipleSelectedValues.length, " of ").concat(selectableOptions.length));
+  }, void 0, "Options selected: ".concat(multipleSelectedValues.map(item => item.label).join(', '), ". ").concat(multipleSelectedValues.length, " of ").concat(selectableOptions.length));
 };
 
 export { MultiAllyMessages };
-//# sourceMappingURL=MultiAllyMessages.js.map

package/esm/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js

@@ -1,19 +1,20 @@
-import React, { useContext } from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext } from 'react';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
 import { StyledA11ySelectedValues } from './styled.js';
-import 'styled-components';
 
-var SingleAllyMessages = function SingleAllyMessages() {
-  var _useContext = useContext(ComboBoxContext),
-      selectedValues = _useContext.props.selectedValues;
-
-  var singleSelectedValue = selectedValues;
-  return /*#__PURE__*/React.createElement(StyledA11ySelectedValues, {
+const SingleAllyMessages = () => {
+  const {
+    props: {
+      selectedValues
+    }
+  } = useContext(ComboBoxContext);
+  const singleSelectedValue = selectedValues;
+  return /*#__PURE__*/_jsx(StyledA11ySelectedValues, {
     "aria-live": "polite",
     "aria-atomic": "false",
     "aria-relevant": "additions text"
-  }, "Option selected: ".concat(singleSelectedValue.label, "."));
+  }, void 0, "Option selected: ".concat(singleSelectedValue.label, "."));
 };
 
 export { SingleAllyMessages };
-//# sourceMappingURL=SingleAllyMessages.js.map

package/esm/ComboBox/v3/parts/a11y-messages/index.js

@@ -1,8 +1,2 @@
 export { MultiAllyMessages } from './MultiAllyMessages.js';
 export { SingleAllyMessages } from './SingleAllyMessages.js';
-import 'react';
-import '../../ComboBoxCTX.js';
-import '../../utils/listHelper.js';
-import './styled.js';
-import 'styled-components';
-//# sourceMappingURL=index.js.map

package/esm/ComboBox/v3/parts/a11y-messages/styled.js

@@ -1,8 +1,7 @@
 import styled from 'styled-components';
 
-var StyledA11ySelectedValues = /*#__PURE__*/styled.span.withConfig({
+const StyledA11ySelectedValues = /*#__PURE__*/styled.span.withConfig({
   componentId: "sc-4xp40i-0"
 })(["width:1px;height:1px;position:absolute;clip:rect(1px,1px,1px,1px);"]);
 
 export { StyledA11ySelectedValues };
-//# sourceMappingURL=styled.js.map

package/esm/ComboBox/v3/parts/container/Container.js

@@ -1,78 +1,59 @@
-import React, { useContext, useCallback } from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext, useCallback } from 'react';
 import { DSPopperJS } from '@elliemae/ds-popperjs';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
 import { StyledPopperWrapper, StyledContainerInline, StyledContainerWithPopper } from './styled.js';
 import { Controls } from '../controls/Controls.js';
 import { MenuList } from '../menu-list/MenuList.js';
-import 'styled-components';
-import '../dropdown-indicator/DropdownIndicator.js';
-import '@elliemae/ds-icons/ChevronSmallDown';
-import '../dropdown-indicator/styled.js';
-import '@elliemae/ds-button';
-import '../../ComboboxDataTestids.js';
-import '../controls/styled.js';
-import '@elliemae/ds-grid';
-import '../multi-selected-values-container/MultiSelectedValuesContainer.js';
-import '@elliemae/ds-pills';
-import '../multi-selected-values-container/useGroupPills.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import '../../utils/hooks/useOnElementResize.js';
-import '../a11y-messages/MultiAllyMessages.js';
-import '../../utils/listHelper.js';
-import '../a11y-messages/styled.js';
-import '../controls-input/ControlsInput.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import '../controls-input/styled.js';
-import '../../utils/hooks/useKeyboardNavigation.js';
-import '../controls-input/useControlsInput.js';
-import '../single-selected-value-container/SingleSelectedValueContainer.js';
-import '../single-selected-value-container/styled.js';
-import '../menu-list/styled.js';
-import '../header-list/HeaderList.js';
-import '../header-list/styled.js';
-import '@elliemae/ds-separator';
-import '../empty-state/index.js';
-import '../empty-state/styled.js';
-import '../menu-list/useMenuList.js';
-import '@babel/runtime/helpers/esm/extends';
-import '@elliemae/ds-form';
+import { jsxs, Fragment } from 'react/jsx-runtime';
 
-/* eslint-disable complexity */
+var _Controls, _MenuList, _MenuList2;
 
-var Container = function Container() {
-  var _useContext = useContext(ComboBoxContext),
-      inline = _useContext.props.inline,
-      showPopover = _useContext.showPopover,
-      inputRef = _useContext.inputRef,
-      setReferenceElement = _useContext.setReferenceElement,
-      setShowPopover = _useContext.setShowPopover,
-      referenceElement = _useContext.referenceElement;
-
-  var handleCloseMenu = useCallback(function () {
+const Container = () => {
+  const {
+    props: {
+      inline,
+      startPlacementPreference,
+      placementOrderPreference
+    },
+    showPopover,
+    inputRef,
+    setReferenceElement,
+    setShowPopover,
+    referenceElement
+  } = useContext(ComboBoxContext);
+  const handleCloseMenu = useCallback(() => {
     setShowPopover(false);
-    inputRef.current.blur();
+    if (inputRef.current) inputRef.current.blur();
   }, [inputRef, setShowPopover]);
-  var handleMouseDown = useCallback(function (e) {
+  const handleMouseDown = useCallback(e => {
     e.preventDefault();
   }, []);
-  var StyledContainer = inline ? StyledContainerInline : StyledContainerWithPopper;
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(StyledContainer, {
-    ref: setReferenceElement
-  }, /*#__PURE__*/React.createElement(Controls, null), inline ? /*#__PURE__*/React.createElement(MenuList, null) : null), !inline ? /*#__PURE__*/React.createElement(DSPopperJS, {
-    customOffset: [0, 5],
-    closeContextMenu: handleCloseMenu,
-    referenceElement: referenceElement,
-    showPopover: showPopover,
-    withoutPortal: true,
-    withoutArrow: true,
-    withoutAnimation: true,
-    zIndex: 10
-  }, /*#__PURE__*/React.createElement(StyledPopperWrapper, {
-    tabIndex: -1,
-    onMouseDown: handleMouseDown
-  }, /*#__PURE__*/React.createElement(MenuList, null))) : null);
+  const handleOnClickContainer = useCallback(() => {
+    setShowPopover(!showPopover);
+  }, [setShowPopover, showPopover]);
+  const StyledContainer = inline ? StyledContainerInline : StyledContainerWithPopper;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs(StyledContainer, {
+      ref: setReferenceElement,
+      onClick: handleOnClickContainer,
+      children: [_Controls || (_Controls = /*#__PURE__*/_jsx(Controls, {})), inline ? _MenuList || (_MenuList = /*#__PURE__*/_jsx(MenuList, {})) : null]
+    }), !inline ? /*#__PURE__*/_jsx(DSPopperJS, {
+      customOffset: [0, 5],
+      closeContextMenu: handleCloseMenu,
+      referenceElement: referenceElement,
+      showPopover: showPopover,
+      startPlacementPreference: startPlacementPreference,
+      placementOrderPreference: placementOrderPreference,
+      withoutPortal: true,
+      withoutArrow: true,
+      withoutAnimation: true,
+      zIndex: 10
+    }, void 0, /*#__PURE__*/_jsx(StyledPopperWrapper, {
+      tabIndex: -1,
+      onMouseDown: handleMouseDown
+    }, void 0, _MenuList2 || (_MenuList2 = /*#__PURE__*/_jsx(MenuList, {})))) : null]
+  });
 };
 
 export { Container };
-//# sourceMappingURL=Container.js.map

package/esm/ComboBox/v3/parts/container/index.js

@@ -1,41 +1 @@
 export { Container } from './Container.js';
-import 'react';
-import '@elliemae/ds-popperjs';
-import '../../ComboBoxCTX.js';
-import './styled.js';
-import 'styled-components';
-import '../controls/Controls.js';
-import '../dropdown-indicator/DropdownIndicator.js';
-import '@elliemae/ds-icons/ChevronSmallDown';
-import '../dropdown-indicator/styled.js';
-import '@elliemae/ds-button';
-import '../../ComboboxDataTestids.js';
-import '../controls/styled.js';
-import '@elliemae/ds-grid';
-import '../multi-selected-values-container/MultiSelectedValuesContainer.js';
-import '@elliemae/ds-pills';
-import '../multi-selected-values-container/useGroupPills.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import '../../utils/hooks/useOnElementResize.js';
-import '../a11y-messages/MultiAllyMessages.js';
-import '../../utils/listHelper.js';
-import '../a11y-messages/styled.js';
-import '../controls-input/ControlsInput.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import '../controls-input/styled.js';
-import '../../utils/hooks/useKeyboardNavigation.js';
-import '../controls-input/useControlsInput.js';
-import '../single-selected-value-container/SingleSelectedValueContainer.js';
-import '../single-selected-value-container/styled.js';
-import '../menu-list/MenuList.js';
-import '../menu-list/styled.js';
-import '../header-list/HeaderList.js';
-import '../header-list/styled.js';
-import '@elliemae/ds-separator';
-import '../empty-state/index.js';
-import '../empty-state/styled.js';
-import '../menu-list/useMenuList.js';
-import '@babel/runtime/helpers/esm/extends';
-import '@elliemae/ds-form';
-//# sourceMappingURL=index.js.map

package/esm/ComboBox/v3/parts/container/styled.js

@@ -1,14 +1,13 @@
 import styled from 'styled-components';
 
-var StyledContainerWithPopper = /*#__PURE__*/styled.div.withConfig({
+const StyledContainerWithPopper = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-17wftik-0"
 })(["width:100%;height:28px;position:relative;"]);
-var StyledContainerInline = /*#__PURE__*/styled.div.withConfig({
+const StyledContainerInline = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-17wftik-1"
 })(["width:100%;position:relative;"]);
-var StyledPopperWrapper = /*#__PURE__*/styled.div.withConfig({
+const StyledPopperWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-17wftik-2"
 })(["background:#fff;overflow:auto;position:relative;"]);
 
 export { StyledContainerInline, StyledContainerWithPopper, StyledPopperWrapper };
-//# sourceMappingURL=styled.js.map