@elliemae/ds-controlled-form 2.3.0-alpha.6 → 2.3.0-next.0

package/cjs/controlled-toggle/styles.js

@@ -0,0 +1,172 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('styled-components');
+var styleHelpers = require('./utils/styleHelpers.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const StyledContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-v733m4-0"
+})(["display:inline-flex;width:fit-content;justify-content:center;align-items:center;height:", ";border-radius:", ";outline:none;position:relative;border:2px solid transparent;&:hover,&:focus-within{border:2px solid ", ";&:after{content:'';height:calc(100% + 4px);width:calc(100% + 4px);border:1px solid ", ";border-radius:20px;position:absolute;}}"], _ref => {
+  let {
+    size
+  } = _ref;
+  return styleHelpers.containerHeight[size];
+}, _ref2 => {
+  let {
+    size
+  } = _ref2;
+  return styleHelpers.borderRadius[size];
+}, _ref3 => {
+  let {
+    theme
+  } = _ref3;
+  return theme.colors.brand[300];
+}, _ref4 => {
+  let {
+    theme
+  } = _ref4;
+  return theme.colors.brand[600];
+});
+const StyledLabel = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-v733m4-1"
+})(["width:", ";height:", ";z-index:2;outline:none;border-radius:", ";"], _ref5 => {
+  let {
+    width,
+    size
+  } = _ref5;
+  return "calc(".concat(width, "px + ").concat(styleHelpers.margin[size], ")");
+}, _ref6 => {
+  let {
+    size
+  } = _ref6;
+  return styleHelpers.labelHeight[size];
+}, _ref7 => {
+  let {
+    size
+  } = _ref7;
+  return styleHelpers.labelHeight[size];
+});
+const StyledVisibleContent = /*#__PURE__*/styled__default["default"].label.withConfig({
+  componentId: "sc-v733m4-2"
+})(["display:flex;margin:0;padding:0;align-items:center;height:100%;flex-direction:", ";border-radius:", ";border:", ";transition:background-color 0.2s;background-color:", ";&:hover{cursor:", ";}"], _ref8 => {
+  let {
+    checked
+  } = _ref8;
+  return checked ? 'row-reverse' : 'row';
+}, _ref9 => {
+  let {
+    size
+  } = _ref9;
+  return "calc(".concat(styleHelpers.labelHeight[size], " - 4px)");
+}, _ref10 => {
+  let {
+    theme,
+    size,
+    checked,
+    disabled,
+    readOnly,
+    active
+  } = _ref10;
+  return size === 's' ? "1px solid ".concat(styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme)) : "\n    2px solid ".concat(styleHelpers.handleBorderColor(checked, disabled, readOnly, active, theme), "\n    ");
+}, _ref11 => {
+  let {
+    theme,
+    checked,
+    disabled,
+    readOnly,
+    active
+  } = _ref11;
+  return styleHelpers.handleBackgroundColor(checked, disabled, readOnly, active, theme);
+}, _ref12 => {
+  let {
+    disabled,
+    readOnly
+  } = _ref12;
+  return styleHelpers.handleCursors(disabled, readOnly);
+});
+const StyledCircle = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-v733m4-3"
+})(["height:", ";width:", ";border-radius:50%;background-color:", ";"], _ref13 => {
+  let {
+    size
+  } = _ref13;
+  return styleHelpers.circleValues[size];
+}, _ref14 => {
+  let {
+    size
+  } = _ref14;
+  return styleHelpers.circleValues[size];
+}, _ref15 => {
+  let {
+    theme,
+    readOnly
+  } = _ref15;
+  return readOnly ? theme.colors.neutral[100] : theme.colors.neutral['000'];
+});
+const StyledText = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-v733m4-4"
+})(["display:flex;flex-grow:1;line-height:1;margin-bottom:-0.12rem;align-items:center;justify-content:", ";font-size:", ";font-weight:", ";color:", ";", " ", ""], _ref16 => {
+  let {
+    isLongerTextRendering
+  } = _ref16;
+  return isLongerTextRendering ? 'flex-start' : 'center';
+}, _ref17 => {
+  let {
+    theme,
+    size
+  } = _ref17;
+  return styleHelpers.handleFontSize(size, theme);
+}, _ref18 => {
+  let {
+    theme
+  } = _ref18;
+  return theme.fontWeights.semibold;
+}, _ref19 => {
+  let {
+    theme,
+    disabled
+  } = _ref19;
+  return disabled ? '#5c6574' : theme.colors.neutral['000'];
+}, _ref20 => {
+  let {
+    isLongerTextRendering,
+    checked
+  } = _ref20;
+  return isLongerTextRendering && checked ? "margin-left: 6px;" : undefined;
+}, _ref21 => {
+  let {
+    isLongerTextRendering,
+    checked
+  } = _ref21;
+  return isLongerTextRendering && !checked ? "margin-left: 4px;" : undefined;
+});
+const StyledInput = /*#__PURE__*/styled__default["default"].input.withConfig({
+  componentId: "sc-v733m4-5"
+})(["position:absolute;opacity:0;z-index:20;height:100%;width:100%;cursor:pointer;"]);
+const SetLabelWidth = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-v733m4-6"
+})(["font-size:", ";font-weight:", ";width:auto;position:absolute;white-space:nowrap;visibility:hidden;"], _ref22 => {
+  let {
+    theme,
+    size
+  } = _ref22;
+  return styleHelpers.handleFontSize(size, theme);
+}, _ref23 => {
+  let {
+    theme
+  } = _ref23;
+  return theme.fontWeights.semibold;
+});
+
+exports.SetLabelWidth = SetLabelWidth;
+exports.StyledCircle = StyledCircle;
+exports.StyledContainer = StyledContainer;
+exports.StyledInput = StyledInput;
+exports.StyledLabel = StyledLabel;
+exports.StyledText = StyledText;
+exports.StyledVisibleContent = StyledVisibleContent;

package/cjs/controlled-toggle/utils/addTooltipOnReadOnly.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var dsTooltip = require('@elliemae/ds-tooltip');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+const addTooltipOnReadOnly = (Component, readOnly) => {
+  if (readOnly) return /*#__PURE__*/_jsx__default["default"](dsTooltip.DSTooltipV2, {
+    title: "Read Only",
+    offset: [0, 9],
+    triggerComponent: Component
+  });
+  return Component;
+};
+
+exports.addTooltipOnReadOnly = addTooltipOnReadOnly;

package/cjs/controlled-toggle/utils/styleHelpers.js

@@ -0,0 +1,103 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const circleValues = {
+  s: '14px',
+  m: '20px',
+  l: '28px'
+};
+const margin = {
+  s: '26px',
+  m: '34px',
+  l: '42px'
+};
+const containerHeight = {
+  s: '20px',
+  m: '28px',
+  l: '36px'
+};
+const labelHeight = {
+  s: '16px',
+  m: '24px',
+  l: '32px'
+};
+const borderRadius = {
+  s: '16px',
+  m: '20px',
+  l: '22px'
+};
+const handleFontSize = (size, _ref) => {
+  let {
+    fontSizes
+  } = _ref;
+
+  switch (size) {
+    case 's':
+      return fontSizes.microText[200];
+
+    case 'm':
+      return '15px';
+
+    case 'l':
+      return '20px';
+
+    default:
+      return '15px';
+  }
+};
+const handleBackgroundColor = (checked, disabled, readOnly, active, _ref2) => {
+  let {
+    colors
+  } = _ref2;
+
+  if (disabled) {
+    return colors.neutral[100];
+  } else if (readOnly) {
+    return colors.neutral[500];
+  } else if (!active && checked) {
+    return colors.brand[600];
+  } else if (!active && !checked) {
+    return colors.neutral[500];
+  } else if (active && checked) {
+    return colors.brand[700];
+  } else if (active && !checked) {
+    return colors.neutral[600];
+  }
+};
+const handleBorderColor = (checked, disabled, readOnly, active, _ref3) => {
+  let {
+    colors
+  } = _ref3;
+
+  if (disabled) {
+    return colors.neutral[100];
+  } else if (readOnly) {
+    return colors.neutral[500];
+  } else if (!active && checked) {
+    return colors.brand[700];
+  } else if (!active && !checked) {
+    return colors.neutral[500];
+  } else if (active && checked) {
+    return colors.brand[800];
+  } else if (active && !checked) {
+    return colors.neutral[700];
+  }
+};
+const handleCursors = (disabled, readOnly) => {
+  if (disabled) {
+    return 'not-allowed';
+  } else if (readOnly) {
+    return 'default';
+  } else return 'pointer';
+};
+
+exports.borderRadius = borderRadius;
+exports.circleValues = circleValues;
+exports.containerHeight = containerHeight;
+exports.handleBackgroundColor = handleBackgroundColor;
+exports.handleBorderColor = handleBorderColor;
+exports.handleCursors = handleCursors;
+exports.handleFontSize = handleFontSize;
+exports.labelHeight = labelHeight;
+exports.margin = margin;

package/cjs/index.js

@@ -0,0 +1,45 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ControlledCheckbox = require('./controlled-checkbox/ControlledCheckbox.js');
+var ControlledDateRangePicker = require('./controlled-date-range-picker/ControlledDateRangePicker.js');
+var ControlledDateRangePickerDatatestid = require('./controlled-date-range-picker/ControlledDateRangePickerDatatestid.js');
+var ControlledDateRangePickerTypes = require('./controlled-date-range-picker/ControlledDateRangePickerTypes.js');
+var ControlledDateTimePicker = require('./controlled-date-time-picker/ControlledDateTimePicker.js');
+var ControlledDateTimePickerDatatestid = require('./controlled-date-time-picker/ControlledDateTimePickerDatatestid.js');
+var ControlledDateTimePickerTypes = require('./controlled-date-time-picker/ControlledDateTimePickerTypes.js');
+var stringHelpers = require('./controlled-date-time-picker/utils/stringHelpers.js');
+var dateTimeHelpers = require('./controlled-date-time-picker/utils/dateTimeHelpers.js');
+var dateHelpers = require('./controlled-date-time-picker/utils/dateHelpers.js');
+var timeHelpers = require('./controlled-date-time-picker/utils/timeHelpers.js');
+var ControlledToggle = require('./controlled-toggle/ControlledToggle.js');
+var Autocomplete = require('./controlled-autocomplete/Autocomplete.js');
+var ComboBox = require('./controlled-combobox/ComboBox.js');
+
+
+
+exports.DSControlledCheckbox = ControlledCheckbox.DSControlledCheckbox;
+exports.DSControlledCheckboxWithSchema = ControlledCheckbox.DSControlledCheckboxWithSchema;
+exports.DSControlledDateRangePicker = ControlledDateRangePicker.DSControlledDateRangePicker;
+exports.DSControlledDateRangePickerWithSchema = ControlledDateRangePicker.DSControlledDateRangePickerWithSchema;
+exports.ControlledDateRangePickerDatatestid = ControlledDateRangePickerDatatestid.ControlledDateRangePickerDatatestid;
+exports.CONTROLLED_DATE_RANGE_PICKER_TYPES = ControlledDateRangePickerTypes.CONTROLLED_DATE_RANGE_PICKER_TYPES;
+exports.DSControlledDateTimePicker = ControlledDateTimePicker.DSControlledDateTimePicker;
+exports.DSControlledDateTimePickerWithSchema = ControlledDateTimePicker.DSControlledDateTimePickerWithSchema;
+exports.ControlledDateTimePickerDatatestid = ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid;
+exports.CONTROLLED_DATE_TIME_PICKER_TYPES = ControlledDateTimePickerTypes.CONTROLLED_DATE_TIME_PICKER_TYPES;
+exports.deconstructValuesFromDateString = stringHelpers.deconstructValuesFromDateString;
+exports.prependStringWithPlaceHolders = stringHelpers.prependStringWithPlaceHolders;
+exports.getValidationDateTimeStringMetaInfo = dateTimeHelpers.getValidationDateTimeStringMetaInfo;
+exports.getDateStringFromDay = dateHelpers.getDateStringFromDay;
+exports.getDateValuesFromDate = dateHelpers.getDateValuesFromDate;
+exports.getDayFromDateString = dateHelpers.getDayFromDateString;
+exports.getValidationDateStringMetaInfo = dateHelpers.getValidationDateStringMetaInfo;
+exports.getValidationTimeStringMetaInfo = timeHelpers.getValidationTimeStringMetaInfo;
+exports.DSControlledToggle = ControlledToggle.DSControlledToggle;
+exports.DSControlledToggleWithSchema = ControlledToggle.DSControlledToggleWithSchema;
+exports.DSAutocomplete = Autocomplete.DSAutocomplete;
+exports.DSAutocompleteWithSchema = Autocomplete.DSAutocompleteWithSchema;
+exports.DSComboBox = ComboBox.DSComboBox;
+exports.DSComboBoxWithSchema = ComboBox.DSComboBoxWithSchema;

package/esm/controlled-autocomplete/Autocomplete.js

@@ -0,0 +1,24 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
+import { describe } from 'react-desc';
+import { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';
+import { useAutocomplete } from './config/useAutocomplete.js';
+import { Container } from './parts/container/Container.js';
+import { propTypes } from './propTypes.js';
+import { defaultProps, AutocompleteContext } from './AutocompleteCTX.js';
+
+var _Container;
+
+const DSAutocomplete = props => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
+  useValidateTypescriptPropTypes(propsWithDefault, propTypes);
+  const ctx = useAutocomplete(props);
+  return /*#__PURE__*/_jsx(AutocompleteContext.Provider, {
+    value: ctx
+  }, void 0, _Container || (_Container = /*#__PURE__*/_jsx(Container, {})));
+};
+
+const DSAutocompleteWithSchema = describe(DSAutocomplete);
+DSAutocompleteWithSchema.propTypes = propTypes;
+
+export { DSAutocomplete, DSAutocompleteWithSchema };

package/esm/controlled-autocomplete/AutocompleteCTX.js

@@ -0,0 +1,38 @@
+import { createContext, createRef } from 'react';
+import { noop } from 'lodash';
+
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+const defaultProps = {
+  placeholder: '',
+  options: [],
+  selectedValues: '',
+  hasError: false,
+  isLoading: false,
+  autoFocus: false,
+  startPlacementPreference: 'bottom-start',
+  placementOrderPreference: ['bottom-start', 'bottom-end'],
+  onChange: noop,
+  onKeyDown: noop,
+  onFilter: noop,
+  onMenuOpen: noop
+};
+const defaultContext = {
+  props: defaultProps,
+  showPopover: false,
+  setShowPopover: noop,
+  scrollOptionIntoView: noop,
+  referenceElement: null,
+  setReferenceElement: noop,
+  inputRef: /*#__PURE__*/createRef(),
+  listRef: /*#__PURE__*/createRef(),
+  wrapperListRef: /*#__PURE__*/createRef(),
+  controlsWrapperRef: /*#__PURE__*/createRef(),
+  selectedOptionsRef: /*#__PURE__*/createRef(),
+  focusOptionIdx: '',
+  setCurrentOption: noop
+};
+/** Context for cross component communication */
+
+const AutocompleteContext = /*#__PURE__*/createContext(defaultContext);
+
+export { AutocompleteContext, AutocompleteContext as default, defaultProps };

package/esm/controlled-autocomplete/AutocompleteDataTestids.js

@@ -0,0 +1,13 @@
+const AutocompleteDataTestid = {
+  INPUT: 'autocomplete-input',
+  LIST: 'autocomplete-menu-list',
+  SELECTED_VALUES: 'autocomplete-selected-values',
+  SELECT_ALL_BUTTON: 'autocomplete-all-btn',
+  CLEAR_ALL_BUTTON: 'autocomplete-clear-btn',
+  DROPDOWN: 'autocomplete-dropdown-btn',
+  OPTION: 'autocomplete-option',
+  SHOW_ALL_BUTTON: 'autocomplete-show-all-btn',
+  SHOW_SELECTED_OPTIONS_BUTTON: 'autocomplete-selected-options-btn'
+};
+
+export { AutocompleteDataTestid };

package/esm/controlled-autocomplete/config/constants.js

@@ -0,0 +1,10 @@
+const DATA_TESTID = {
+  COMBOBOX_MENU_LIST: 'autocomplete-menu-list',
+  COMBOBOX_CLEAR_BTN: 'autocomplete-clear-btn',
+  COMBOBOX_ALL_BTN: 'autocomplete-all-btn',
+  COMBOBOX_DROPDOWN_BTN: 'autocomplete-dropdown-btn',
+  COMBOBOX_OPTION: 'autocomplete-option',
+  COMBOBOX: 'autocomplete'
+};
+
+export { DATA_TESTID };

package/esm/controlled-autocomplete/config/useAutocomplete.js

@@ -0,0 +1,65 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { useState, useRef, useCallback, useMemo } from 'react';
+import { useVirtual } from 'react-virtual';
+import { useGetAutocompleteWithDefaultsProps } from './useGetPropsWithDefault.js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const useAutocomplete = props => {
+  const [showPopover, setShowPopover] = useState(false);
+  const [referenceElement, setReferenceElement] = useState(null);
+  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 propsWithDefaults = useGetAutocompleteWithDefaultsProps(props);
+  const {
+    options
+  } = propsWithDefaults; // ===========================================================================
+  // Virtualization setup
+  // ===========================================================================
+
+  const virtualListHelpers = useVirtual({
+    size: options.length,
+    parentRef: listRef,
+    overscan: 15,
+    paddingStart: 0
+  }); // ===========================================================================
+  // Scroll into view function
+  // ===========================================================================
+
+  const scrollOptionIntoView = useCallback(function (dsId) {
+    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+      align: 'center'
+    };
+    virtualListHelpers.scrollToIndex(options.findIndex(opt => opt.dsId === dsId), opts);
+  }, [options, virtualListHelpers]);
+  const ctx = useMemo(() => ({
+    props: _objectSpread({}, propsWithDefaults),
+    virtualListHelpers,
+    showPopover,
+    referenceElement,
+    inputRef,
+    listRef,
+    focusOptionIdx,
+    selectedOptionsRef,
+    controlsWrapperRef,
+    wrapperListRef,
+    setCurrentOption,
+    scrollOptionIntoView,
+    setReferenceElement,
+    setShowPopover
+  }), [scrollOptionIntoView, propsWithDefaults, virtualListHelpers, focusOptionIdx, wrapperListRef, showPopover, referenceElement, inputRef, selectedOptionsRef, controlsWrapperRef, listRef]);
+  return ctx;
+};
+
+export { useAutocomplete };

package/esm/controlled-autocomplete/config/useGetPropsWithDefault.js

@@ -0,0 +1,7 @@
+import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';
+import { defaultProps } from '../AutocompleteCTX.js';
+
+// we have to merge the "default" nested default values with what the user gives us...
+const useGetAutocompleteWithDefaultsProps = props => useMemoMergePropsWithDefault(props, defaultProps);
+
+export { useGetAutocompleteWithDefaultsProps };

package/esm/controlled-autocomplete/index.d.js

@@ -0,0 +1 @@
+

package/esm/controlled-autocomplete/index.js

@@ -0,0 +1 @@
+export { DSAutocomplete, DSAutocompleteWithSchema } from './Autocomplete.js';

package/esm/controlled-autocomplete/parts/a11y-messages/MultiAllyMessages.js

@@ -0,0 +1,25 @@
+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 { AutocompleteContext } from '../../AutocompleteCTX.js';
+import { getSelectableOptions } from '../../utils/listHelper.js';
+import { StyledA11ySelectedValues } from './styled.js';
+
+const MultiAllyMessages = () => {
+  const {
+    props: {
+      options,
+      selectedValues
+    }
+  } = useContext(AutocompleteContext);
+  const selectableOptions = getSelectableOptions(options);
+  const multipleSelectedValues = selectedValues;
+  return /*#__PURE__*/_jsx(StyledA11ySelectedValues, {
+    "aria-live": "polite",
+    "aria-atomic": "false",
+    "aria-relevant": "additions text"
+  }, void 0, "Options selected: ".concat(multipleSelectedValues.map(item => item.label).join(', '), ". ").concat(multipleSelectedValues.length, " of ").concat(selectableOptions.length));
+};
+
+export { MultiAllyMessages };

package/esm/controlled-autocomplete/parts/a11y-messages/SingleAllyMessages.js

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

package/esm/controlled-autocomplete/parts/a11y-messages/index.js

@@ -0,0 +1,2 @@
+export { MultiAllyMessages } from './MultiAllyMessages.js';
+export { SingleAllyMessages } from './SingleAllyMessages.js';

package/esm/controlled-autocomplete/parts/a11y-messages/styled.js

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

package/esm/controlled-autocomplete/parts/container/Container.js

@@ -0,0 +1,55 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext, useCallback } from 'react';
+import { DSPopperJS } from '@elliemae/ds-popperjs';
+import { AutocompleteContext } from '../../AutocompleteCTX.js';
+import { StyledPopperWrapper, StyledContainerInline, StyledContainerWithPopper } from './styled.js';
+import { Controls } from '../controls/Controls.js';
+import { MenuList } from '../menu-list/MenuList.js';
+import { jsxs, Fragment } from 'react/jsx-runtime';
+
+var _Controls, _MenuList, _MenuList2;
+
+const Container = () => {
+  const {
+    props: {
+      inline,
+      startPlacementPreference,
+      placementOrderPreference
+    },
+    showPopover,
+    inputRef,
+    setReferenceElement,
+    setShowPopover,
+    referenceElement
+  } = useContext(AutocompleteContext);
+  const handleCloseMenu = useCallback(() => {
+    setShowPopover(false);
+    if (inputRef.current) inputRef.current.blur();
+  }, [inputRef, setShowPopover]);
+  const handleMouseDown = useCallback(e => {
+    e.preventDefault();
+  }, []);
+  const StyledContainer = inline ? StyledContainerInline : StyledContainerWithPopper;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs(StyledContainer, {
+      ref: setReferenceElement,
+      children: [_Controls || (_Controls = /*#__PURE__*/_jsx(Controls, {})), inline ? _MenuList || (_MenuList = /*#__PURE__*/_jsx(MenuList, {})) : null]
+    }), /*#__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, {}))))]
+  });
+};
+
+export { Container };

package/esm/controlled-autocomplete/parts/container/index.js

@@ -0,0 +1 @@
+export { Container } from './Container.js';

package/esm/controlled-autocomplete/parts/container/styled.js

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