@elliemae/ds-form-combobox 3.52.0-rc.5 → 3.52.0-rc.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -84,7 +84,7 @@ const useComboBox = (props) => {
84
84
  const [focusOptionIdx, setFocusOptionIdx] = (0, import_react.useState)("");
85
85
  (0, import_react.useEffect)(() => {
86
86
  if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {
87
- const focusedValue = (0, import_listHelper.getFirstOption)(correctOptions, selectedValues);
87
+ const focusedValue = (0, import_listHelper.getFirstOption)(correctOptions);
88
88
  setFocusOptionIdx(focusedValue);
89
89
  scrollOptionIntoView(focusedValue, { align: "center" });
90
90
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/useComboBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useMemo, useState, useRef, useCallback, useEffect } from 'react';\nimport { uid } from 'uid';\nimport { type DSFastListT } from '@elliemae/ds-fast-list';\n\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ComboBoxCTX.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { ComboboxPropTypes } from '../react-desc-prop-types.js';\nimport type { DSComboboxInternalsT } from '../sharedTypes.js';\nimport { DSComboBoxName } from '../theming.js';\nimport { getFirstOption, isSelectedValueEmpty } from '../utils/listHelper.js';\nimport { useCorrectOptions } from './useCorrectOptions.js';\nimport { useOptionsPerSection } from './useOptionsPerSection.js';\n\nexport const useComboBox = (props: DSComboboxT.Props): DSComboboxInternalsT.ComboBoxContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSComboboxT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes, DSComboBoxName);\n const [showPopover, setShowPopover] = useState<boolean>(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n const internalRef = useRef<HTMLInputElement>(null);\n const wrapperListRef = useRef<HTMLDivElement>(null);\n\n const selectedOptionsRef = useRef<HTMLDivElement>(null);\n const controlsWrapperRef = useRef<HTMLDivElement>(null);\n const pillGroupRef = useRef<HTMLDivElement>(null);\n\n const { id, selectedValues, isMenuOpen, onMenuChange, applyAriaDisabled } = propsWithDefaults;\n\n const instanceUid = useMemo(() => id || uid(5), [id]);\n\n const menuState = useMemo(() => {\n if (isMenuOpen !== undefined) return isMenuOpen;\n return showPopover;\n }, [showPopover, isMenuOpen]);\n\n // ---------------------------------------------------------------------------\n // Options with creatable option + filtered by selected\n // ---------------------------------------------------------------------------\n\n const correctOptions = useCorrectOptions(propsWithDefaults, inputValue);\n\n const optionsPerSection = useOptionsPerSection(correctOptions);\n\n const actionRef: DSComboboxT.ActionRefVirtualized = {\n scrollTo: () => {},\n };\n\n const listRef = useRef<DSComboboxT.ActionRefVirtualized>(actionRef);\n\n // ===========================================================================\n // Scroll into view function\n // ===========================================================================\n const scrollOptionIntoView = useCallback(\n (dsId: string, opts: DSFastListT.ScrollToOptions = { align: 'center' } as DSFastListT.ScrollToOptions) => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n requestAnimationFrame(() => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n });\n },\n [correctOptions],\n );\n\n // ===========================================================================\n // Init focused option when opening the menu list\n // ===========================================================================\n\n const [focusOptionIdx, setFocusOptionIdx] = useState<string>('');\n\n useEffect(() => {\n if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n }\n }, [correctOptions, inputValue, propsWithDefaults.forceFocusFirstOptionOnType, scrollOptionIntoView, selectedValues]);\n\n const setMenuState = useCallback(\n (\n newState: boolean,\n reason: string,\n e?: React.KeyboardEvent | React.MouseEvent | React.ChangeEvent<HTMLInputElement>,\n ) => {\n if (applyAriaDisabled) return;\n if (onMenuChange !== undefined) onMenuChange(newState, reason, e);\n setShowPopover(newState);\n if (!inputValue && newState && !focusOptionIdx && !isSelectedValueEmpty(selectedValues)) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n } else {\n setFocusOptionIdx('');\n }\n },\n [applyAriaDisabled, onMenuChange, inputValue, focusOptionIdx, selectedValues, correctOptions, scrollOptionIntoView],\n );\n\n // We need to force the auto focus for the inline since we dont control the floating wrapper.\n useEffect(() => {\n if (propsWithDefaults.inline) {\n setMenuState(true, 'inline');\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const shouldPreventContextMenuOpening = propsWithDefaults.readOnly && !propsWithDefaults.isMenuOpenableWithReadOnly;\n\n const ctx = useMemo(\n () => ({\n props: { ...propsWithDefaults },\n menuState,\n referenceElement,\n listRef,\n focusOptionIdx,\n selectedOptionsRef,\n controlsWrapperRef,\n inputValue,\n setInputValue,\n setMenuState,\n hasFocus,\n pillGroupRef,\n wrapperListRef,\n setHasFocus,\n setFocusOptionIdx,\n scrollOptionIntoView,\n setReferenceElement,\n setShowPopover,\n internalRef,\n correctOptions,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n }),\n [\n scrollOptionIntoView,\n setMenuState,\n correctOptions,\n hasFocus,\n propsWithDefaults,\n inputValue,\n focusOptionIdx,\n wrapperListRef,\n menuState,\n pillGroupRef,\n referenceElement,\n selectedOptionsRef,\n controlsWrapperRef,\n listRef,\n internalRef,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n ],\n );\n\n return ctx;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useMemo, useState, useRef, useCallback, useEffect } from 'react';\nimport { uid } from 'uid';\nimport { type DSFastListT } from '@elliemae/ds-fast-list';\n\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ComboBoxCTX.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { ComboboxPropTypes } from '../react-desc-prop-types.js';\nimport type { DSComboboxInternalsT } from '../sharedTypes.js';\nimport { DSComboBoxName } from '../theming.js';\nimport { getFirstOption, isSelectedValueEmpty } from '../utils/listHelper.js';\nimport { useCorrectOptions } from './useCorrectOptions.js';\nimport { useOptionsPerSection } from './useOptionsPerSection.js';\n\nexport const useComboBox = (props: DSComboboxT.Props): DSComboboxInternalsT.ComboBoxContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSComboboxT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes, DSComboBoxName);\n const [showPopover, setShowPopover] = useState<boolean>(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n const internalRef = useRef<HTMLInputElement>(null);\n const wrapperListRef = useRef<HTMLDivElement>(null);\n\n const selectedOptionsRef = useRef<HTMLDivElement>(null);\n const controlsWrapperRef = useRef<HTMLDivElement>(null);\n const pillGroupRef = useRef<HTMLDivElement>(null);\n\n const { id, selectedValues, isMenuOpen, onMenuChange, applyAriaDisabled } = propsWithDefaults;\n\n const instanceUid = useMemo(() => id || uid(5), [id]);\n\n const menuState = useMemo(() => {\n if (isMenuOpen !== undefined) return isMenuOpen;\n return showPopover;\n }, [showPopover, isMenuOpen]);\n\n // ---------------------------------------------------------------------------\n // Options with creatable option + filtered by selected\n // ---------------------------------------------------------------------------\n\n const correctOptions = useCorrectOptions(propsWithDefaults, inputValue);\n\n const optionsPerSection = useOptionsPerSection(correctOptions);\n\n const actionRef: DSComboboxT.ActionRefVirtualized = {\n scrollTo: () => {},\n };\n\n const listRef = useRef<DSComboboxT.ActionRefVirtualized>(actionRef);\n\n // ===========================================================================\n // Scroll into view function\n // ===========================================================================\n const scrollOptionIntoView = useCallback(\n (dsId: string, opts: DSFastListT.ScrollToOptions = { align: 'center' } as DSFastListT.ScrollToOptions) => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n requestAnimationFrame(() => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n });\n },\n [correctOptions],\n );\n\n // ===========================================================================\n // Init focused option when opening the menu list\n // ===========================================================================\n\n const [focusOptionIdx, setFocusOptionIdx] = useState<string>('');\n\n useEffect(() => {\n if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {\n const focusedValue = getFirstOption(correctOptions);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n }\n }, [correctOptions, inputValue, propsWithDefaults.forceFocusFirstOptionOnType, scrollOptionIntoView, selectedValues]);\n\n const setMenuState = useCallback(\n (\n newState: boolean,\n reason: string,\n e?: React.KeyboardEvent | React.MouseEvent | React.ChangeEvent<HTMLInputElement>,\n ) => {\n if (applyAriaDisabled) return;\n if (onMenuChange !== undefined) onMenuChange(newState, reason, e);\n setShowPopover(newState);\n if (!inputValue && newState && !focusOptionIdx && !isSelectedValueEmpty(selectedValues)) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n } else {\n setFocusOptionIdx('');\n }\n },\n [applyAriaDisabled, onMenuChange, inputValue, focusOptionIdx, selectedValues, correctOptions, scrollOptionIntoView],\n );\n\n // We need to force the auto focus for the inline since we dont control the floating wrapper.\n useEffect(() => {\n if (propsWithDefaults.inline) {\n setMenuState(true, 'inline');\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const shouldPreventContextMenuOpening = propsWithDefaults.readOnly && !propsWithDefaults.isMenuOpenableWithReadOnly;\n\n const ctx = useMemo(\n () => ({\n props: { ...propsWithDefaults },\n menuState,\n referenceElement,\n listRef,\n focusOptionIdx,\n selectedOptionsRef,\n controlsWrapperRef,\n inputValue,\n setInputValue,\n setMenuState,\n hasFocus,\n pillGroupRef,\n wrapperListRef,\n setHasFocus,\n setFocusOptionIdx,\n scrollOptionIntoView,\n setReferenceElement,\n setShowPopover,\n internalRef,\n correctOptions,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n }),\n [\n scrollOptionIntoView,\n setMenuState,\n correctOptions,\n hasFocus,\n propsWithDefaults,\n inputValue,\n focusOptionIdx,\n wrapperListRef,\n menuState,\n pillGroupRef,\n referenceElement,\n selectedOptionsRef,\n controlsWrapperRef,\n listRef,\n internalRef,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n ],\n );\n\n return ctx;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -84,7 +84,6 @@ const getFirstOption = (options, selectedValues) => {
84
84
  const lastValue = getLastValueSelected(selectedValues);
85
85
  if (lastValue) return lastValue.dsId;
86
86
  }
87
- console.log(options, "options");
88
87
  for (let i = 0; i < options.length; i += 1)
89
88
  if (!["section", "separator"].includes(options[i].type) && !options[i].disabled) {
90
89
  return options[i].dsId;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/utils/listHelper.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-params */\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { MENU_OPTION_TYPES } from '../constants.js';\nexport const getSelectableOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && !option.disabled);\n\nexport const getOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION);\n\nexport const isSelectedValueEmpty = (value: DSComboboxT.SelectedOptionsT): boolean =>\n Array.isArray(value) ? value.length === 0 : !value;\n\nexport const isSelectedValueMultiple = (value: DSComboboxT.SelectedOptionsT): boolean => Array.isArray(value);\n\nexport const isSelected = (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption): boolean => {\n if (isSelectedValueMultiple(value)) {\n const multiValue = value as DSComboboxT.ItemOption[];\n return multiValue.some((item) => item?.value === activeOption?.value);\n }\n const singleValue = value as DSComboboxT.ItemOption;\n return singleValue?.value === activeOption.value;\n};\n\nexport function isArrayOfItems(value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption[] {\n return Array.isArray(value) && value.length > 0;\n}\n\nexport const isItem = (value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption =>\n !Array.isArray(value) && value !== null && typeof value === 'object';\n\nexport const findInCircularList = (\n list: DSComboboxT.OptionTypes[],\n from: number,\n criteria: (item: DSComboboxT.OptionTypes) => boolean,\n step = 1,\n): number => {\n if (list.length === 0) return from;\n\n let i = (from + step + list.length) % list.length;\n let iterations = 0;\n\n while (iterations < list.length) {\n if (criteria(list[i])) return i;\n\n i = (i + step + list.length) % list.length;\n iterations += 1;\n }\n\n return from; // Return the original index if no match is found\n};\nexport const getLastValueSelected = (selectedValues: DSComboboxT.SelectedOptionsT) => {\n if (Array.isArray(selectedValues)) {\n return selectedValues[selectedValues.length - 1];\n }\n return selectedValues;\n};\n\nexport const getFirstOption = (\n options: DSComboboxT.OptionTypes[],\n selectedValues?: DSComboboxT.SelectedOptionsT,\n): string => {\n if (selectedValues) {\n const lastValue = getLastValueSelected(selectedValues);\n if (lastValue) return lastValue.dsId;\n }\n console.log(options, 'options');\n for (let i = 0; i < options.length; i += 1)\n if (!['section', 'separator'].includes(options[i].type) && !options[i].disabled) {\n return options[i].dsId;\n }\n // list of disabled item results return ''\n return '';\n};\n\nexport const getSuggestedValueOnChange = (\n selectedOption: DSComboboxT.ItemOption,\n selectedValues: DSComboboxT.SelectedOptionsT,\n isNonClearable?: boolean,\n) => {\n if (Array.isArray(selectedValues)) {\n const isFound = selectedValues.find((item) => item.type === 'option' && item.value === selectedOption.value);\n if (isFound) {\n if (isNonClearable) return selectedValues;\n return selectedValues.filter((item) => item.type === 'option' && item.value !== selectedOption.value);\n }\n return [...selectedValues, selectedOption];\n }\n if (selectedValues && selectedValues.dsId === selectedOption.dsId) {\n if (isNonClearable) return selectedOption;\n return null;\n }\n return selectedOption;\n};\n\nexport const filterOptions = (inputValue: string, options: DSComboboxT.OptionTypes[]) => {\n if (!inputValue) return options;\n return options.filter(\n (option) =>\n option.type === MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()),\n );\n};\n\nexport const getFilteredOptionsSelected = (\n filteredOption: DSComboboxT.OptionTypes[],\n selectedValues: DSComboboxT.ItemOption[],\n) => filteredOption.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option));\n\nexport const scrollIfNeeded = (\n elem: HTMLElement,\n options = { behavior: 'smooth', block: 'end', inline: 'nearest' } as ScrollIntoViewOptions | undefined,\n) => {\n const bounding = elem.getBoundingClientRect();\n if (\n !(\n bounding.top >= 0 &&\n bounding.left >= 0 &&\n bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\n bounding.right <= (window.innerWidth || document.documentElement.clientWidth)\n )\n )\n elem.scrollIntoView(options);\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-params */\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { MENU_OPTION_TYPES } from '../constants.js';\nexport const getSelectableOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && !option.disabled);\n\nexport const getOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION);\n\nexport const isSelectedValueEmpty = (value: DSComboboxT.SelectedOptionsT): boolean =>\n Array.isArray(value) ? value.length === 0 : !value;\n\nexport const isSelectedValueMultiple = (value: DSComboboxT.SelectedOptionsT): boolean => Array.isArray(value);\n\nexport const isSelected = (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption): boolean => {\n if (isSelectedValueMultiple(value)) {\n const multiValue = value as DSComboboxT.ItemOption[];\n return multiValue.some((item) => item?.value === activeOption?.value);\n }\n const singleValue = value as DSComboboxT.ItemOption;\n return singleValue?.value === activeOption.value;\n};\n\nexport function isArrayOfItems(value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption[] {\n return Array.isArray(value) && value.length > 0;\n}\n\nexport const isItem = (value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption =>\n !Array.isArray(value) && value !== null && typeof value === 'object';\n\nexport const findInCircularList = (\n list: DSComboboxT.OptionTypes[],\n from: number,\n criteria: (item: DSComboboxT.OptionTypes) => boolean,\n step = 1,\n): number => {\n if (list.length === 0) return from;\n\n let i = (from + step + list.length) % list.length;\n let iterations = 0;\n\n while (iterations < list.length) {\n if (criteria(list[i])) return i;\n\n i = (i + step + list.length) % list.length;\n iterations += 1;\n }\n\n return from; // Return the original index if no match is found\n};\nexport const getLastValueSelected = (selectedValues: DSComboboxT.SelectedOptionsT) => {\n if (Array.isArray(selectedValues)) {\n return selectedValues[selectedValues.length - 1];\n }\n return selectedValues;\n};\n\nexport const getFirstOption = (\n options: DSComboboxT.OptionTypes[],\n selectedValues?: DSComboboxT.SelectedOptionsT,\n): string => {\n if (selectedValues) {\n const lastValue = getLastValueSelected(selectedValues);\n if (lastValue) return lastValue.dsId;\n }\n for (let i = 0; i < options.length; i += 1)\n if (!['section', 'separator'].includes(options[i].type) && !options[i].disabled) {\n return options[i].dsId;\n }\n // list of disabled item results return ''\n return '';\n};\n\nexport const getSuggestedValueOnChange = (\n selectedOption: DSComboboxT.ItemOption,\n selectedValues: DSComboboxT.SelectedOptionsT,\n isNonClearable?: boolean,\n) => {\n if (Array.isArray(selectedValues)) {\n const isFound = selectedValues.find((item) => item.type === 'option' && item.value === selectedOption.value);\n if (isFound) {\n if (isNonClearable) return selectedValues;\n return selectedValues.filter((item) => item.type === 'option' && item.value !== selectedOption.value);\n }\n return [...selectedValues, selectedOption];\n }\n if (selectedValues && selectedValues.dsId === selectedOption.dsId) {\n if (isNonClearable) return selectedOption;\n return null;\n }\n return selectedOption;\n};\n\nexport const filterOptions = (inputValue: string, options: DSComboboxT.OptionTypes[]) => {\n if (!inputValue) return options;\n return options.filter(\n (option) =>\n option.type === MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()),\n );\n};\n\nexport const getFilteredOptionsSelected = (\n filteredOption: DSComboboxT.OptionTypes[],\n selectedValues: DSComboboxT.ItemOption[],\n) => filteredOption.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option));\n\nexport const scrollIfNeeded = (\n elem: HTMLElement,\n options = { behavior: 'smooth', block: 'end', inline: 'nearest' } as ScrollIntoViewOptions | undefined,\n) => {\n const bounding = elem.getBoundingClientRect();\n if (\n !(\n bounding.top >= 0 &&\n bounding.left >= 0 &&\n bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\n bounding.right <= (window.innerWidth || document.documentElement.clientWidth)\n )\n )\n elem.scrollIntoView(options);\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -51,7 +51,7 @@ const useComboBox = (props) => {
51
51
  const [focusOptionIdx, setFocusOptionIdx] = useState("");
52
52
  useEffect(() => {
53
53
  if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {
54
- const focusedValue = getFirstOption(correctOptions, selectedValues);
54
+ const focusedValue = getFirstOption(correctOptions);
55
55
  setFocusOptionIdx(focusedValue);
56
56
  scrollOptionIntoView(focusedValue, { align: "center" });
57
57
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useComboBox.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useMemo, useState, useRef, useCallback, useEffect } from 'react';\nimport { uid } from 'uid';\nimport { type DSFastListT } from '@elliemae/ds-fast-list';\n\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ComboBoxCTX.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { ComboboxPropTypes } from '../react-desc-prop-types.js';\nimport type { DSComboboxInternalsT } from '../sharedTypes.js';\nimport { DSComboBoxName } from '../theming.js';\nimport { getFirstOption, isSelectedValueEmpty } from '../utils/listHelper.js';\nimport { useCorrectOptions } from './useCorrectOptions.js';\nimport { useOptionsPerSection } from './useOptionsPerSection.js';\n\nexport const useComboBox = (props: DSComboboxT.Props): DSComboboxInternalsT.ComboBoxContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSComboboxT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes, DSComboBoxName);\n const [showPopover, setShowPopover] = useState<boolean>(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n const internalRef = useRef<HTMLInputElement>(null);\n const wrapperListRef = useRef<HTMLDivElement>(null);\n\n const selectedOptionsRef = useRef<HTMLDivElement>(null);\n const controlsWrapperRef = useRef<HTMLDivElement>(null);\n const pillGroupRef = useRef<HTMLDivElement>(null);\n\n const { id, selectedValues, isMenuOpen, onMenuChange, applyAriaDisabled } = propsWithDefaults;\n\n const instanceUid = useMemo(() => id || uid(5), [id]);\n\n const menuState = useMemo(() => {\n if (isMenuOpen !== undefined) return isMenuOpen;\n return showPopover;\n }, [showPopover, isMenuOpen]);\n\n // ---------------------------------------------------------------------------\n // Options with creatable option + filtered by selected\n // ---------------------------------------------------------------------------\n\n const correctOptions = useCorrectOptions(propsWithDefaults, inputValue);\n\n const optionsPerSection = useOptionsPerSection(correctOptions);\n\n const actionRef: DSComboboxT.ActionRefVirtualized = {\n scrollTo: () => {},\n };\n\n const listRef = useRef<DSComboboxT.ActionRefVirtualized>(actionRef);\n\n // ===========================================================================\n // Scroll into view function\n // ===========================================================================\n const scrollOptionIntoView = useCallback(\n (dsId: string, opts: DSFastListT.ScrollToOptions = { align: 'center' } as DSFastListT.ScrollToOptions) => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n requestAnimationFrame(() => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n });\n },\n [correctOptions],\n );\n\n // ===========================================================================\n // Init focused option when opening the menu list\n // ===========================================================================\n\n const [focusOptionIdx, setFocusOptionIdx] = useState<string>('');\n\n useEffect(() => {\n if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n }\n }, [correctOptions, inputValue, propsWithDefaults.forceFocusFirstOptionOnType, scrollOptionIntoView, selectedValues]);\n\n const setMenuState = useCallback(\n (\n newState: boolean,\n reason: string,\n e?: React.KeyboardEvent | React.MouseEvent | React.ChangeEvent<HTMLInputElement>,\n ) => {\n if (applyAriaDisabled) return;\n if (onMenuChange !== undefined) onMenuChange(newState, reason, e);\n setShowPopover(newState);\n if (!inputValue && newState && !focusOptionIdx && !isSelectedValueEmpty(selectedValues)) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n } else {\n setFocusOptionIdx('');\n }\n },\n [applyAriaDisabled, onMenuChange, inputValue, focusOptionIdx, selectedValues, correctOptions, scrollOptionIntoView],\n );\n\n // We need to force the auto focus for the inline since we dont control the floating wrapper.\n useEffect(() => {\n if (propsWithDefaults.inline) {\n setMenuState(true, 'inline');\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const shouldPreventContextMenuOpening = propsWithDefaults.readOnly && !propsWithDefaults.isMenuOpenableWithReadOnly;\n\n const ctx = useMemo(\n () => ({\n props: { ...propsWithDefaults },\n menuState,\n referenceElement,\n listRef,\n focusOptionIdx,\n selectedOptionsRef,\n controlsWrapperRef,\n inputValue,\n setInputValue,\n setMenuState,\n hasFocus,\n pillGroupRef,\n wrapperListRef,\n setHasFocus,\n setFocusOptionIdx,\n scrollOptionIntoView,\n setReferenceElement,\n setShowPopover,\n internalRef,\n correctOptions,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n }),\n [\n scrollOptionIntoView,\n setMenuState,\n correctOptions,\n hasFocus,\n propsWithDefaults,\n inputValue,\n focusOptionIdx,\n wrapperListRef,\n menuState,\n pillGroupRef,\n referenceElement,\n selectedOptionsRef,\n controlsWrapperRef,\n listRef,\n internalRef,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n ],\n );\n\n return ctx;\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useMemo, useState, useRef, useCallback, useEffect } from 'react';\nimport { uid } from 'uid';\nimport { type DSFastListT } from '@elliemae/ds-fast-list';\n\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ComboBoxCTX.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { ComboboxPropTypes } from '../react-desc-prop-types.js';\nimport type { DSComboboxInternalsT } from '../sharedTypes.js';\nimport { DSComboBoxName } from '../theming.js';\nimport { getFirstOption, isSelectedValueEmpty } from '../utils/listHelper.js';\nimport { useCorrectOptions } from './useCorrectOptions.js';\nimport { useOptionsPerSection } from './useOptionsPerSection.js';\n\nexport const useComboBox = (props: DSComboboxT.Props): DSComboboxInternalsT.ComboBoxContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSComboboxT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes, DSComboBoxName);\n const [showPopover, setShowPopover] = useState<boolean>(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n const internalRef = useRef<HTMLInputElement>(null);\n const wrapperListRef = useRef<HTMLDivElement>(null);\n\n const selectedOptionsRef = useRef<HTMLDivElement>(null);\n const controlsWrapperRef = useRef<HTMLDivElement>(null);\n const pillGroupRef = useRef<HTMLDivElement>(null);\n\n const { id, selectedValues, isMenuOpen, onMenuChange, applyAriaDisabled } = propsWithDefaults;\n\n const instanceUid = useMemo(() => id || uid(5), [id]);\n\n const menuState = useMemo(() => {\n if (isMenuOpen !== undefined) return isMenuOpen;\n return showPopover;\n }, [showPopover, isMenuOpen]);\n\n // ---------------------------------------------------------------------------\n // Options with creatable option + filtered by selected\n // ---------------------------------------------------------------------------\n\n const correctOptions = useCorrectOptions(propsWithDefaults, inputValue);\n\n const optionsPerSection = useOptionsPerSection(correctOptions);\n\n const actionRef: DSComboboxT.ActionRefVirtualized = {\n scrollTo: () => {},\n };\n\n const listRef = useRef<DSComboboxT.ActionRefVirtualized>(actionRef);\n\n // ===========================================================================\n // Scroll into view function\n // ===========================================================================\n const scrollOptionIntoView = useCallback(\n (dsId: string, opts: DSFastListT.ScrollToOptions = { align: 'center' } as DSFastListT.ScrollToOptions) => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n requestAnimationFrame(() => {\n listRef.current.scrollTo(\n correctOptions.findIndex((opt) => opt.dsId === dsId),\n opts,\n );\n });\n },\n [correctOptions],\n );\n\n // ===========================================================================\n // Init focused option when opening the menu list\n // ===========================================================================\n\n const [focusOptionIdx, setFocusOptionIdx] = useState<string>('');\n\n useEffect(() => {\n if (inputValue && propsWithDefaults.forceFocusFirstOptionOnType) {\n const focusedValue = getFirstOption(correctOptions);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n }\n }, [correctOptions, inputValue, propsWithDefaults.forceFocusFirstOptionOnType, scrollOptionIntoView, selectedValues]);\n\n const setMenuState = useCallback(\n (\n newState: boolean,\n reason: string,\n e?: React.KeyboardEvent | React.MouseEvent | React.ChangeEvent<HTMLInputElement>,\n ) => {\n if (applyAriaDisabled) return;\n if (onMenuChange !== undefined) onMenuChange(newState, reason, e);\n setShowPopover(newState);\n if (!inputValue && newState && !focusOptionIdx && !isSelectedValueEmpty(selectedValues)) {\n const focusedValue = getFirstOption(correctOptions, selectedValues);\n setFocusOptionIdx(focusedValue);\n scrollOptionIntoView(focusedValue, { align: 'center' });\n } else {\n setFocusOptionIdx('');\n }\n },\n [applyAriaDisabled, onMenuChange, inputValue, focusOptionIdx, selectedValues, correctOptions, scrollOptionIntoView],\n );\n\n // We need to force the auto focus for the inline since we dont control the floating wrapper.\n useEffect(() => {\n if (propsWithDefaults.inline) {\n setMenuState(true, 'inline');\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const shouldPreventContextMenuOpening = propsWithDefaults.readOnly && !propsWithDefaults.isMenuOpenableWithReadOnly;\n\n const ctx = useMemo(\n () => ({\n props: { ...propsWithDefaults },\n menuState,\n referenceElement,\n listRef,\n focusOptionIdx,\n selectedOptionsRef,\n controlsWrapperRef,\n inputValue,\n setInputValue,\n setMenuState,\n hasFocus,\n pillGroupRef,\n wrapperListRef,\n setHasFocus,\n setFocusOptionIdx,\n scrollOptionIntoView,\n setReferenceElement,\n setShowPopover,\n internalRef,\n correctOptions,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n }),\n [\n scrollOptionIntoView,\n setMenuState,\n correctOptions,\n hasFocus,\n propsWithDefaults,\n inputValue,\n focusOptionIdx,\n wrapperListRef,\n menuState,\n pillGroupRef,\n referenceElement,\n selectedOptionsRef,\n controlsWrapperRef,\n listRef,\n internalRef,\n instanceUid,\n optionsPerSection,\n shouldPreventContextMenuOpening,\n ],\n );\n\n return ctx;\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -38,7 +38,6 @@ const getFirstOption = (options, selectedValues) => {
38
38
  const lastValue = getLastValueSelected(selectedValues);
39
39
  if (lastValue) return lastValue.dsId;
40
40
  }
41
- console.log(options, "options");
42
41
  for (let i = 0; i < options.length; i += 1)
43
42
  if (!["section", "separator"].includes(options[i].type) && !options[i].disabled) {
44
43
  return options[i].dsId;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/listHelper.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { MENU_OPTION_TYPES } from '../constants.js';\nexport const getSelectableOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && !option.disabled);\n\nexport const getOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION);\n\nexport const isSelectedValueEmpty = (value: DSComboboxT.SelectedOptionsT): boolean =>\n Array.isArray(value) ? value.length === 0 : !value;\n\nexport const isSelectedValueMultiple = (value: DSComboboxT.SelectedOptionsT): boolean => Array.isArray(value);\n\nexport const isSelected = (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption): boolean => {\n if (isSelectedValueMultiple(value)) {\n const multiValue = value as DSComboboxT.ItemOption[];\n return multiValue.some((item) => item?.value === activeOption?.value);\n }\n const singleValue = value as DSComboboxT.ItemOption;\n return singleValue?.value === activeOption.value;\n};\n\nexport function isArrayOfItems(value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption[] {\n return Array.isArray(value) && value.length > 0;\n}\n\nexport const isItem = (value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption =>\n !Array.isArray(value) && value !== null && typeof value === 'object';\n\nexport const findInCircularList = (\n list: DSComboboxT.OptionTypes[],\n from: number,\n criteria: (item: DSComboboxT.OptionTypes) => boolean,\n step = 1,\n): number => {\n if (list.length === 0) return from;\n\n let i = (from + step + list.length) % list.length;\n let iterations = 0;\n\n while (iterations < list.length) {\n if (criteria(list[i])) return i;\n\n i = (i + step + list.length) % list.length;\n iterations += 1;\n }\n\n return from; // Return the original index if no match is found\n};\nexport const getLastValueSelected = (selectedValues: DSComboboxT.SelectedOptionsT) => {\n if (Array.isArray(selectedValues)) {\n return selectedValues[selectedValues.length - 1];\n }\n return selectedValues;\n};\n\nexport const getFirstOption = (\n options: DSComboboxT.OptionTypes[],\n selectedValues?: DSComboboxT.SelectedOptionsT,\n): string => {\n if (selectedValues) {\n const lastValue = getLastValueSelected(selectedValues);\n if (lastValue) return lastValue.dsId;\n }\n console.log(options, 'options');\n for (let i = 0; i < options.length; i += 1)\n if (!['section', 'separator'].includes(options[i].type) && !options[i].disabled) {\n return options[i].dsId;\n }\n // list of disabled item results return ''\n return '';\n};\n\nexport const getSuggestedValueOnChange = (\n selectedOption: DSComboboxT.ItemOption,\n selectedValues: DSComboboxT.SelectedOptionsT,\n isNonClearable?: boolean,\n) => {\n if (Array.isArray(selectedValues)) {\n const isFound = selectedValues.find((item) => item.type === 'option' && item.value === selectedOption.value);\n if (isFound) {\n if (isNonClearable) return selectedValues;\n return selectedValues.filter((item) => item.type === 'option' && item.value !== selectedOption.value);\n }\n return [...selectedValues, selectedOption];\n }\n if (selectedValues && selectedValues.dsId === selectedOption.dsId) {\n if (isNonClearable) return selectedOption;\n return null;\n }\n return selectedOption;\n};\n\nexport const filterOptions = (inputValue: string, options: DSComboboxT.OptionTypes[]) => {\n if (!inputValue) return options;\n return options.filter(\n (option) =>\n option.type === MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()),\n );\n};\n\nexport const getFilteredOptionsSelected = (\n filteredOption: DSComboboxT.OptionTypes[],\n selectedValues: DSComboboxT.ItemOption[],\n) => filteredOption.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option));\n\nexport const scrollIfNeeded = (\n elem: HTMLElement,\n options = { behavior: 'smooth', block: 'end', inline: 'nearest' } as ScrollIntoViewOptions | undefined,\n) => {\n const bounding = elem.getBoundingClientRect();\n if (\n !(\n bounding.top >= 0 &&\n bounding.left >= 0 &&\n bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\n bounding.right <= (window.innerWidth || document.documentElement.clientWidth)\n )\n )\n elem.scrollIntoView(options);\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { MENU_OPTION_TYPES } from '../constants.js';\nexport const getSelectableOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && !option.disabled);\n\nexport const getOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n options.filter((option) => option.type === MENU_OPTION_TYPES.OPTION);\n\nexport const isSelectedValueEmpty = (value: DSComboboxT.SelectedOptionsT): boolean =>\n Array.isArray(value) ? value.length === 0 : !value;\n\nexport const isSelectedValueMultiple = (value: DSComboboxT.SelectedOptionsT): boolean => Array.isArray(value);\n\nexport const isSelected = (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption): boolean => {\n if (isSelectedValueMultiple(value)) {\n const multiValue = value as DSComboboxT.ItemOption[];\n return multiValue.some((item) => item?.value === activeOption?.value);\n }\n const singleValue = value as DSComboboxT.ItemOption;\n return singleValue?.value === activeOption.value;\n};\n\nexport function isArrayOfItems(value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption[] {\n return Array.isArray(value) && value.length > 0;\n}\n\nexport const isItem = (value: DSComboboxT.SelectedOptionsT): value is DSComboboxT.ItemOption =>\n !Array.isArray(value) && value !== null && typeof value === 'object';\n\nexport const findInCircularList = (\n list: DSComboboxT.OptionTypes[],\n from: number,\n criteria: (item: DSComboboxT.OptionTypes) => boolean,\n step = 1,\n): number => {\n if (list.length === 0) return from;\n\n let i = (from + step + list.length) % list.length;\n let iterations = 0;\n\n while (iterations < list.length) {\n if (criteria(list[i])) return i;\n\n i = (i + step + list.length) % list.length;\n iterations += 1;\n }\n\n return from; // Return the original index if no match is found\n};\nexport const getLastValueSelected = (selectedValues: DSComboboxT.SelectedOptionsT) => {\n if (Array.isArray(selectedValues)) {\n return selectedValues[selectedValues.length - 1];\n }\n return selectedValues;\n};\n\nexport const getFirstOption = (\n options: DSComboboxT.OptionTypes[],\n selectedValues?: DSComboboxT.SelectedOptionsT,\n): string => {\n if (selectedValues) {\n const lastValue = getLastValueSelected(selectedValues);\n if (lastValue) return lastValue.dsId;\n }\n for (let i = 0; i < options.length; i += 1)\n if (!['section', 'separator'].includes(options[i].type) && !options[i].disabled) {\n return options[i].dsId;\n }\n // list of disabled item results return ''\n return '';\n};\n\nexport const getSuggestedValueOnChange = (\n selectedOption: DSComboboxT.ItemOption,\n selectedValues: DSComboboxT.SelectedOptionsT,\n isNonClearable?: boolean,\n) => {\n if (Array.isArray(selectedValues)) {\n const isFound = selectedValues.find((item) => item.type === 'option' && item.value === selectedOption.value);\n if (isFound) {\n if (isNonClearable) return selectedValues;\n return selectedValues.filter((item) => item.type === 'option' && item.value !== selectedOption.value);\n }\n return [...selectedValues, selectedOption];\n }\n if (selectedValues && selectedValues.dsId === selectedOption.dsId) {\n if (isNonClearable) return selectedOption;\n return null;\n }\n return selectedOption;\n};\n\nexport const filterOptions = (inputValue: string, options: DSComboboxT.OptionTypes[]) => {\n if (!inputValue) return options;\n return options.filter(\n (option) =>\n option.type === MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()),\n );\n};\n\nexport const getFilteredOptionsSelected = (\n filteredOption: DSComboboxT.OptionTypes[],\n selectedValues: DSComboboxT.ItemOption[],\n) => filteredOption.filter((option) => option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option));\n\nexport const scrollIfNeeded = (\n elem: HTMLElement,\n options = { behavior: 'smooth', block: 'end', inline: 'nearest' } as ScrollIntoViewOptions | undefined,\n) => {\n const bounding = elem.getBoundingClientRect();\n if (\n !(\n bounding.top >= 0 &&\n bounding.left >= 0 &&\n bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\n bounding.right <= (window.innerWidth || document.documentElement.clientWidth)\n )\n )\n elem.scrollIntoView(options);\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-form-combobox",
3
- "version": "3.52.0-rc.5",
3
+ "version": "3.52.0-rc.6",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Combobox",
6
6
  "files": [
@@ -38,18 +38,18 @@
38
38
  "dependencies": {
39
39
  "react-virtual": "~2.10.4",
40
40
  "uid": "~2.0.1",
41
- "@elliemae/ds-button-v2": "3.52.0-rc.5",
42
- "@elliemae/ds-circular-progress-indicator": "3.52.0-rc.5",
43
- "@elliemae/ds-fast-list": "3.52.0-rc.5",
44
- "@elliemae/ds-floating-context": "3.52.0-rc.5",
45
- "@elliemae/ds-grid": "3.52.0-rc.5",
46
- "@elliemae/ds-menu-items": "3.52.0-rc.5",
47
- "@elliemae/ds-form-checkbox": "3.52.0-rc.5",
48
- "@elliemae/ds-icons": "3.52.0-rc.5",
49
- "@elliemae/ds-pills-v2": "3.52.0-rc.5",
50
- "@elliemae/ds-system": "3.52.0-rc.5",
51
- "@elliemae/ds-props-helpers": "3.52.0-rc.5",
52
- "@elliemae/ds-truncated-tooltip-text": "3.52.0-rc.5"
41
+ "@elliemae/ds-button-v2": "3.52.0-rc.6",
42
+ "@elliemae/ds-circular-progress-indicator": "3.52.0-rc.6",
43
+ "@elliemae/ds-fast-list": "3.52.0-rc.6",
44
+ "@elliemae/ds-floating-context": "3.52.0-rc.6",
45
+ "@elliemae/ds-form-checkbox": "3.52.0-rc.6",
46
+ "@elliemae/ds-grid": "3.52.0-rc.6",
47
+ "@elliemae/ds-menu-items": "3.52.0-rc.6",
48
+ "@elliemae/ds-pills-v2": "3.52.0-rc.6",
49
+ "@elliemae/ds-icons": "3.52.0-rc.6",
50
+ "@elliemae/ds-props-helpers": "3.52.0-rc.6",
51
+ "@elliemae/ds-system": "3.52.0-rc.6",
52
+ "@elliemae/ds-truncated-tooltip-text": "3.52.0-rc.6"
53
53
  },
54
54
  "devDependencies": {
55
55
  "@elliemae/pui-cli": "9.0.0-next.55",
@@ -57,8 +57,8 @@
57
57
  "jest": "~29.7.0",
58
58
  "styled-components": "~5.3.9",
59
59
  "styled-system": "^5.1.5",
60
- "@elliemae/ds-form-helpers-mask-hooks": "3.52.0-rc.5",
61
- "@elliemae/ds-monorepo-devops": "3.52.0-rc.5"
60
+ "@elliemae/ds-form-helpers-mask-hooks": "3.52.0-rc.6",
61
+ "@elliemae/ds-monorepo-devops": "3.52.0-rc.6"
62
62
  },
63
63
  "peerDependencies": {
64
64
  "@elliemae/pui-theme": "~2.11.0",