@elliemae/ds-controlled-form 3.0.0-alpha.0 → 3.0.0-alpha.1

package/dist/cjs/controlled-date-time-picker/utils/dateTimeHelpers.js

@@ -2,8 +2,22 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __export = (target, all) => {
   for (var name in all)
@@ -32,9 +46,6 @@ __export(dateTimeHelpers_exports, {
 var React = __toESM(require("react"));
 var import_dateHelpers = require("./dateHelpers");
 var import_timeHelpers = require("./timeHelpers");
-const getValidationDateTimeStringMetaInfo = (dateString, timeString, validators) => ({
-  ...(0, import_dateHelpers.getValidationDateStringMetaInfo)(dateString, validators.getIsOutOfRangeDay, validators.getIsDisabledDay),
-  ...(0, import_timeHelpers.getValidationTimeStringMetaInfo)(timeString, validators.getIsDisabledTime)
-});
+const getValidationDateTimeStringMetaInfo = (dateString, timeString, validators) => __spreadValues(__spreadValues({}, (0, import_dateHelpers.getValidationDateStringMetaInfo)(dateString, validators.getIsOutOfRangeDay, validators.getIsDisabledDay)), (0, import_timeHelpers.getValidationTimeStringMetaInfo)(timeString, validators.getIsDisabledTime));
 module.exports = __toCommonJS(dateTimeHelpers_exports);
 //# sourceMappingURL=dateTimeHelpers.js.map

package/dist/cjs/controlled-date-time-picker/utils/dateTimeHelpers.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/controlled-date-time-picker/utils/dateTimeHelpers.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { getValidationDateStringMetaInfo } from './dateHelpers';\nimport { getValidationTimeStringMetaInfo } from './timeHelpers';\nimport type { internalInputsChangeMetaInfo } from '../index.d';\n\ninterface validatorsT {\n  getIsOutOfRangeDay: (day: string) => boolean;\n  getIsDisabledDay: (day: string) => boolean;\n  getIsDisabledTime: (val: string) => boolean;\n}\nexport const getValidationDateTimeStringMetaInfo = (\n  dateString: string,\n  timeString: string,\n  validators: validatorsT,\n): Partial<internalInputsChangeMetaInfo> => ({\n  ...getValidationDateStringMetaInfo(dateString, validators.getIsOutOfRangeDay, validators.getIsDisabledDay),\n  ...getValidationTimeStringMetaInfo(timeString, validators.getIsDisabledTime),\n});\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAgD;AAChD,yBAAgD;AAQzC,MAAM,sCAAsC,CACjD,YACA,YACA,eAC2C;AAAA,KACxC,wDAAgC,YAAY,WAAW,oBAAoB,WAAW;AAAA,KACtF,wDAAgC,YAAY,WAAW;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAgD;AAChD,yBAAgD;AAQzC,MAAM,sCAAsC,CACjD,YACA,YACA,eAC2C,kCACxC,wDAAgC,YAAY,WAAW,oBAAoB,WAAW,oBACtF,wDAAgC,YAAY,WAAW;",
   "names": []
 }

package/dist/cjs/controlled-toggle/ControlledToggle.js

@@ -2,8 +2,22 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __export = (target, all) => {
   for (var name in all)
@@ -82,11 +96,10 @@ const DSControlledToggle = ({
       onChange();
     }
   }, [disabled, onChange, readOnly]);
-  return (0, import_addTooltipOnReadOnly.addTooltipOnReadOnly)(/* @__PURE__ */ import_react.default.createElement(import_styles.StyledContainer, {
+  return (0, import_addTooltipOnReadOnly.addTooltipOnReadOnly)(/* @__PURE__ */ import_react.default.createElement(import_styles.StyledContainer, __spreadValues({
     size,
-    "data-testid": "ds-controlled-toggle",
-    ...containerProps
-  }, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledInput, {
+    "data-testid": "ds-controlled-toggle"
+  }, containerProps), /* @__PURE__ */ import_react.default.createElement(import_styles.StyledInput, {
     type: "checkbox",
     name,
     value,

package/dist/cjs/controlled-toggle/ControlledToggle.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/controlled-toggle/ControlledToggle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useState, useMemo, useRef, useEffect, useCallback } from 'react';\nimport { uid } from 'uid';\nimport { describe } from 'react-desc';\nimport { propTypes } from './propTypes';\nimport {\n  StyledContainer,\n  StyledInput,\n  StyledLabel,\n  StyledVisibleContent,\n  StyledCircle,\n  StyledText,\n  SetLabelWidth,\n} from './styles';\nimport { defaultProps } from './defaultProps';\nimport type { DSControlledTogglePropsT } from './index.d';\nimport { addTooltipOnReadOnly } from './utils/addTooltipOnReadOnly';\n\nconst DSControlledToggle = ({\n  labelOn,\n  labelOff,\n  name,\n  value,\n  checked,\n  onChange,\n  size,\n  readOnly,\n  active,\n  disabled,\n  containerProps,\n  id,\n}: DSControlledTogglePropsT): JSX.Element => {\n  const [isLongerTextRendering, setIsLongerTextRendering] = useState<boolean>(false);\n  const [width, setWidth] = useState<number>(0);\n  const labelTextRef = useRef<HTMLDivElement | null>(null);\n  const widthTextRef = useRef<HTMLDivElement | null>(null);\n\n  const longerText = useMemo(() => (labelOn.length > labelOff.length ? labelOn : labelOff), [labelOff, labelOn]);\n\n  const instanceUID = useMemo(() => uid(5), []);\n\n  useEffect(() => {\n    if (labelTextRef.current) {\n      setIsLongerTextRendering(labelTextRef.current.innerText === longerText);\n    }\n  }, [labelTextRef, longerText, checked]);\n\n  useEffect(() => {\n    if (widthTextRef.current) {\n      setWidth(widthTextRef.current.clientWidth);\n    }\n  }, [widthTextRef]);\n\n  const handleOnChange = useCallback(() => {\n    if (disabled || readOnly) return;\n    onChange();\n  }, [disabled, readOnly, onChange]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (disabled || readOnly) {\n        e.preventDefault();\n      }\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        onChange();\n      }\n    },\n    [disabled, onChange, readOnly],\n  );\n\n  return addTooltipOnReadOnly(\n    <StyledContainer size={size} data-testid=\"ds-controlled-toggle\" {...containerProps}>\n      <StyledInput\n        type=\"checkbox\"\n        name={name}\n        value={value}\n        checked={checked}\n        data-testid=\"ds-controlled-toggle-checkbox\"\n        id={id || instanceUID}\n        aria-disabled={disabled}\n        aria-checked={checked}\n        tabIndex={0}\n        onChange={handleOnChange}\n        onKeyDown={handleKeyDown}\n      />\n      <StyledLabel checked={checked} size={size} width={width}>\n        <StyledVisibleContent\n          checked={checked}\n          size={size}\n          readOnly={readOnly}\n          active={active}\n          disabled={disabled}\n          htmlFor={id ? undefined : instanceUID}\n          as={id ? 'p' : 'label'}\n        >\n          <StyledCircle checked={checked} size={size} readOnly={readOnly} disabled={disabled} />\n          <StyledText\n            ref={labelTextRef}\n            isLongerTextRendering={isLongerTextRendering}\n            checked={checked}\n            size={size}\n            disabled={disabled}\n          >\n            {checked ? labelOn : labelOff}\n          </StyledText>\n        </StyledVisibleContent>\n      </StyledLabel>\n      <SetLabelWidth size={size} ref={widthTextRef}>\n        {longerText}\n      </SetLabelWidth>\n    </StyledContainer>,\n    readOnly,\n  );\n};\n\nDSControlledToggle.defaultProps = defaultProps;\nDSControlledToggle.propTypes = propTypes;\nconst DSControlledToggleWithSchema = describe(DSControlledToggle);\nDSControlledToggleWithSchema.propTypes = propTypes;\n\nexport { DSControlledToggle, DSControlledToggleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyE;AACzE,iBAAoB;AACpB,wBAAyB;AACzB,uBAA0B;AAC1B,oBAQO;AACP,0BAA6B;AAE7B,kCAAqC;AAErC,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC2C;AAC3C,QAAM,CAAC,uBAAuB,4BAA4B,2BAAkB;AAC5E,QAAM,CAAC,OAAO,YAAY,2BAAiB;AAC3C,QAAM,eAAe,yBAA8B;AACnD,QAAM,eAAe,yBAA8B;AAEnD,QAAM,aAAa,0BAAQ,MAAO,QAAQ,SAAS,SAAS,SAAS,UAAU,UAAW,CAAC,UAAU;AAErG,QAAM,cAAc,0BAAQ,MAAM,oBAAI,IAAI;AAE1C,8BAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,+BAAyB,aAAa,QAAQ,cAAc;AAAA;AAAA,KAE7D,CAAC,cAAc,YAAY;AAE9B,8BAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,eAAS,aAAa,QAAQ;AAAA;AAAA,KAE/B,CAAC;AAEJ,QAAM,iBAAiB,8BAAY,MAAM;AACvC,QAAI,YAAY;AAAU;AAC1B;AAAA,KACC,CAAC,UAAU,UAAU;AAExB,QAAM,gBAAgB,8BACpB,CAAC,MAA2B;AAC1B,QAAI,YAAY,UAAU;AACxB,QAAE;AAAA;AAEJ,QAAI,EAAE,QAAQ,SAAS;AACrB,QAAE;AACF;AAAA;AAAA,KAGJ,CAAC,UAAU,UAAU;AAGvB,SAAO,sDACL,mDAAC,+BAAD;AAAA,IAAiB;AAAA,IAAY,eAAY;AAAA,OAA2B;AAAA,KAClE,mDAAC,2BAAD;AAAA,IACE,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAY;AAAA,IACZ,IAAI,MAAM;AAAA,IACV,iBAAe;AAAA,IACf,gBAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW;AAAA,MAEb,mDAAC,2BAAD;AAAA,IAAa;AAAA,IAAkB;AAAA,IAAY;AAAA,KACzC,mDAAC,oCAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS,KAAK,SAAY;AAAA,IAC1B,IAAI,KAAK,MAAM;AAAA,KAEf,mDAAC,4BAAD;AAAA,IAAc;AAAA,IAAkB;AAAA,IAAY;AAAA,IAAoB;AAAA,MAChE,mDAAC,0BAAD;AAAA,IACE,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KAEC,UAAU,UAAU,aAI3B,mDAAC,6BAAD;AAAA,IAAe;AAAA,IAAY,KAAK;AAAA,KAC7B,cAGL;AAAA;AAIJ,mBAAmB,eAAe;AAClC,mBAAmB,YAAY;AAC/B,MAAM,+BAA+B,gCAAS;AAC9C,6BAA6B,YAAY;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyE;AACzE,iBAAoB;AACpB,wBAAyB;AACzB,uBAA0B;AAC1B,oBAQO;AACP,0BAA6B;AAE7B,kCAAqC;AAErC,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC2C;AAC3C,QAAM,CAAC,uBAAuB,4BAA4B,2BAAkB;AAC5E,QAAM,CAAC,OAAO,YAAY,2BAAiB;AAC3C,QAAM,eAAe,yBAA8B;AACnD,QAAM,eAAe,yBAA8B;AAEnD,QAAM,aAAa,0BAAQ,MAAO,QAAQ,SAAS,SAAS,SAAS,UAAU,UAAW,CAAC,UAAU;AAErG,QAAM,cAAc,0BAAQ,MAAM,oBAAI,IAAI;AAE1C,8BAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,+BAAyB,aAAa,QAAQ,cAAc;AAAA;AAAA,KAE7D,CAAC,cAAc,YAAY;AAE9B,8BAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,eAAS,aAAa,QAAQ;AAAA;AAAA,KAE/B,CAAC;AAEJ,QAAM,iBAAiB,8BAAY,MAAM;AACvC,QAAI,YAAY;AAAU;AAC1B;AAAA,KACC,CAAC,UAAU,UAAU;AAExB,QAAM,gBAAgB,8BACpB,CAAC,MAA2B;AAC1B,QAAI,YAAY,UAAU;AACxB,QAAE;AAAA;AAEJ,QAAI,EAAE,QAAQ,SAAS;AACrB,QAAE;AACF;AAAA;AAAA,KAGJ,CAAC,UAAU,UAAU;AAGvB,SAAO,sDACL,mDAAC,+BAAD;AAAA,IAAiB;AAAA,IAAY,eAAY;AAAA,KAA2B,iBAClE,mDAAC,2BAAD;AAAA,IACE,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAY;AAAA,IACZ,IAAI,MAAM;AAAA,IACV,iBAAe;AAAA,IACf,gBAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW;AAAA,MAEb,mDAAC,2BAAD;AAAA,IAAa;AAAA,IAAkB;AAAA,IAAY;AAAA,KACzC,mDAAC,oCAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS,KAAK,SAAY;AAAA,IAC1B,IAAI,KAAK,MAAM;AAAA,KAEf,mDAAC,4BAAD;AAAA,IAAc;AAAA,IAAkB;AAAA,IAAY;AAAA,IAAoB;AAAA,MAChE,mDAAC,0BAAD;AAAA,IACE,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KAEC,UAAU,UAAU,aAI3B,mDAAC,6BAAD;AAAA,IAAe;AAAA,IAAY,KAAK;AAAA,KAC7B,cAGL;AAAA;AAIJ,mBAAmB,eAAe;AAClC,mBAAmB,YAAY;AAC/B,MAAM,+BAA+B,gCAAS;AAC9C,6BAA6B,YAAY;",
   "names": []
 }

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

@@ -1,3 +1,19 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 import * as React from "react";
 import { useMemo, useState, useRef, useCallback } from "react";
 import { useVirtual } from "react-virtual";
@@ -23,7 +39,7 @@ const useAutocomplete = (props) => {
     virtualListHelpers.scrollToIndex(options.findIndex((opt) => opt.dsId === dsId), opts);
   }, [options, virtualListHelpers]);
   const ctx = useMemo(() => ({
-    props: { ...propsWithDefaults },
+    props: __spreadValues({}, propsWithDefaults),
     virtualListHelpers,
     showPopover,
     referenceElement,

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-autocomplete/config/useAutocomplete.tsx"],
   "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 } from 'react';\nimport { useVirtual } from 'react-virtual';\nimport { useGetAutocompleteWithDefaultsProps } from './useGetPropsWithDefault';\nimport type { AutocompletePropsT, AutocompleteContextT } from '../index.d';\n\nexport const useAutocomplete = (props: Partial<AutocompletePropsT>): AutocompleteContextT => {\n  const [showPopover, setShowPopover] = useState<boolean>(false);\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n\n  const [focusOptionIdx, setCurrentOption] = useState<string>('');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n  const wrapperListRef = useRef<HTMLDivElement>(null);\n\n  const selectedOptionsRef = useRef<HTMLDivElement>(null);\n  const controlsWrapperRef = useRef<HTMLDivElement>(null);\n\n  const propsWithDefaults = useGetAutocompleteWithDefaultsProps(props);\n  const { options } = propsWithDefaults;\n\n  // ===========================================================================\n  // Virtualization setup\n  // ===========================================================================\n\n  const virtualListHelpers: ReturnType<typeof useVirtual> = useVirtual({\n    size: options.length,\n    parentRef: listRef,\n    overscan: 15,\n    paddingStart: 0,\n  });\n\n  // ===========================================================================\n  // Scroll into view function\n  // ===========================================================================\n  const scrollOptionIntoView = useCallback(\n    (dsId: string, opts = { align: 'center' }) => {\n      virtualListHelpers.scrollToIndex(\n        options.findIndex((opt) => opt.dsId === dsId),\n        opts,\n      );\n    },\n    [options, virtualListHelpers],\n  );\n\n  const ctx = useMemo(\n    () => ({\n      props: { ...propsWithDefaults },\n      virtualListHelpers,\n      showPopover,\n      referenceElement,\n      inputRef,\n      listRef,\n      focusOptionIdx,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      wrapperListRef,\n      setCurrentOption,\n      scrollOptionIntoView,\n      setReferenceElement,\n      setShowPopover,\n    }),\n    [\n      scrollOptionIntoView,\n      propsWithDefaults,\n      virtualListHelpers,\n      focusOptionIdx,\n      wrapperListRef,\n      showPopover,\n      referenceElement,\n      inputRef,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      listRef,\n    ],\n  );\n\n  return ctx;\n};\n"],
-  "mappings": "AAAA;ACIA;AACA;AACA;AAGO,MAAM,kBAAkB,CAAC,UAA6D;AAC3F,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AACxD,QAAM,CAAC,kBAAkB,uBAAuB,SAA6B;AAE7E,QAAM,CAAC,gBAAgB,oBAAoB,SAAiB;AAC5D,QAAM,WAAW,OAAyB;AAC1C,QAAM,UAAU,OAAuB;AACvC,QAAM,iBAAiB,OAAuB;AAE9C,QAAM,qBAAqB,OAAuB;AAClD,QAAM,qBAAqB,OAAuB;AAElD,QAAM,oBAAoB,oCAAoC;AAC9D,QAAM,EAAE,YAAY;AAMpB,QAAM,qBAAoD,WAAW;AAAA,IACnE,MAAM,QAAQ;AAAA,IACd,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc;AAAA;AAMhB,QAAM,uBAAuB,YAC3B,CAAC,MAAc,OAAO,EAAE,OAAO,eAAe;AAC5C,uBAAmB,cACjB,QAAQ,UAAU,CAAC,QAAQ,IAAI,SAAS,OACxC;AAAA,KAGJ,CAAC,SAAS;AAGZ,QAAM,MAAM,QACV,MAAO;AAAA,IACL,OAAO,KAAK;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;ACIA;AACA;AACA;AAGO,MAAM,kBAAkB,CAAC,UAA6D;AAC3F,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AACxD,QAAM,CAAC,kBAAkB,uBAAuB,SAA6B;AAE7E,QAAM,CAAC,gBAAgB,oBAAoB,SAAiB;AAC5D,QAAM,WAAW,OAAyB;AAC1C,QAAM,UAAU,OAAuB;AACvC,QAAM,iBAAiB,OAAuB;AAE9C,QAAM,qBAAqB,OAAuB;AAClD,QAAM,qBAAqB,OAAuB;AAElD,QAAM,oBAAoB,oCAAoC;AAC9D,QAAM,EAAE,YAAY;AAMpB,QAAM,qBAAoD,WAAW;AAAA,IACnE,MAAM,QAAQ;AAAA,IACd,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc;AAAA;AAMhB,QAAM,uBAAuB,YAC3B,CAAC,MAAc,OAAO,EAAE,OAAO,eAAe;AAC5C,uBAAmB,cACjB,QAAQ,UAAU,CAAC,QAAQ,IAAI,SAAS,OACxC;AAAA,KAGJ,CAAC,SAAS;AAGZ,QAAM,MAAM,QACV,MAAO;AAAA,IACL,OAAO,mBAAK;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO;AAAA;",
   "names": []
 }

package/dist/esm/controlled-autocomplete/parts/menu-list/useItemRenderer.js

@@ -1,3 +1,22 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import * as React from "react";
 import React2, { useMemo, useContext, useCallback } from "react";
 import { SingleMenuItem } from "@elliemae/ds-common/MenuItem";
@@ -34,8 +53,7 @@ const useItemRenderer = () => {
       innerRef: vItem.measureRef
     };
     if (option.type === "option") {
-      return /* @__PURE__ */ React2.createElement(SingleMenuItem, {
-        ...generalProps,
+      return /* @__PURE__ */ React2.createElement(SingleMenuItem, __spreadProps(__spreadValues({}, generalProps), {
         value: option.value,
         label: option.label,
         dataTestid: AutocompleteDataTestid.OPTION,
@@ -44,7 +62,7 @@ const useItemRenderer = () => {
         onMouseDown: handleOnMouseDown,
         isActive: option.dsId === focusOptionIdx,
         isSelected: isSelected(selectedValues, option)
-      });
+      }));
     }
     return /* @__PURE__ */ React2.createElement(React2.Fragment, null);
   }), [options, focusOptionIdx, selectedValues, inputRef, virtualItems]);

package/dist/esm/controlled-autocomplete/parts/menu-list/useItemRenderer.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-autocomplete/parts/menu-list/useItemRenderer.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react-hooks/exhaustive-deps */\nimport React, { useMemo, useContext, useCallback } from 'react';\nimport { VirtualItem } from 'react-virtual';\n\nimport { SingleMenuItem } from '@elliemae/ds-common/MenuItem';\nimport { AutocompleteContext } from '../../AutocompleteCTX';\nimport { isSelected } from '../../utils/listHelper';\nimport { AutocompleteDataTestid } from '../../AutocompleteDataTestids';\nimport { CBOptionT } from '../../index.d';\n\nconst useItemRenderer = (): React.ReactNode[] => {\n  const {\n    props: { options, onChange, selectedValues, onFilter },\n    inputRef,\n    setShowPopover,\n    focusOptionIdx,\n    virtualListHelpers,\n  } = useContext(AutocompleteContext);\n\n  const { virtualItems }: { virtualItems: VirtualItem[] } = virtualListHelpers;\n\n  const handleClick = useCallback(\n    (option: CBOptionT, e: Event) => {\n      if (inputRef.current) inputRef.current.value = option.label;\n      onFilter(option.label);\n      onChange(option.label);\n      setShowPopover(false);\n      inputRef.current?.focus();\n      e.stopPropagation();\n      e.preventDefault();\n    },\n    [onFilter, onChange, setShowPopover, inputRef],\n  );\n\n  const handleOnMouseDown = useCallback((e: React.MouseEvent<HTMLLIElement>) => {\n    e.preventDefault();\n  }, []);\n\n  const ItemRenderer = useMemo(\n    (): React.ReactNode[] =>\n      virtualItems.map((vItem) => {\n        const option = options[vItem.index];\n        const generalProps = {\n          wrapperStyles: { position: 'absolute', top: vItem.start, left: 0, width: '100%' },\n          key: `${option.dsId}`,\n          innerRef: vItem.measureRef,\n        };\n\n        if (option.type === 'option') {\n          return (\n            <SingleMenuItem\n              {...generalProps}\n              value={option.value}\n              label={option.label}\n              dataTestid={AutocompleteDataTestid.OPTION}\n              disabled={option.disabled}\n              onClick={(e: Event) => handleClick(option, e)}\n              onMouseDown={handleOnMouseDown}\n              isActive={option.dsId === focusOptionIdx}\n              isSelected={isSelected(selectedValues, option)}\n            />\n          );\n        }\n        return <></>;\n      }),\n    [options, focusOptionIdx, selectedValues, inputRef, virtualItems],\n  );\n\n  return ItemRenderer;\n};\n\nexport { useItemRenderer };\n"],
-  "mappings": "AAAA;ACCA;AAGA;AACA;AACA;AACA;AAGA,MAAM,kBAAkB,MAAyB;AAC/C,QAAM;AAAA,IACJ,OAAO,EAAE,SAAS,UAAU,gBAAgB;AAAA,IAC5C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,EAAE,iBAAkD;AAE1D,QAAM,cAAc,YAClB,CAAC,QAAmB,MAAa;AAC/B,QAAI,SAAS;AAAS,eAAS,QAAQ,QAAQ,OAAO;AACtD,aAAS,OAAO;AAChB,aAAS,OAAO;AAChB,mBAAe;AACf,aAAS,SAAS;AAClB,MAAE;AACF,MAAE;AAAA,KAEJ,CAAC,UAAU,UAAU,gBAAgB;AAGvC,QAAM,oBAAoB,YAAY,CAAC,MAAuC;AAC5E,MAAE;AAAA,KACD;AAEH,QAAM,eAAe,QACnB,MACE,aAAa,IAAI,CAAC,UAAU;AAC1B,UAAM,SAAS,QAAQ,MAAM;AAC7B,UAAM,eAAe;AAAA,MACnB,eAAe,EAAE,UAAU,YAAY,KAAK,MAAM,OAAO,MAAM,GAAG,OAAO;AAAA,MACzE,KAAK,GAAG,OAAO;AAAA,MACf,UAAU,MAAM;AAAA;AAGlB,QAAI,OAAO,SAAS,UAAU;AAC5B,aACE,qCAAC,gBAAD;AAAA,WACM;AAAA,QACJ,OAAO,OAAO;AAAA,QACd,OAAO,OAAO;AAAA,QACd,YAAY,uBAAuB;AAAA,QACnC,UAAU,OAAO;AAAA,QACjB,SAAS,CAAC,MAAa,YAAY,QAAQ;AAAA,QAC3C,aAAa;AAAA,QACb,UAAU,OAAO,SAAS;AAAA,QAC1B,YAAY,WAAW,gBAAgB;AAAA;AAAA;AAI7C,WAAO;AAAA,MAEX,CAAC,SAAS,gBAAgB,gBAAgB,UAAU;AAGtD,SAAO;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AAGA;AACA;AACA;AACA;AAGA,MAAM,kBAAkB,MAAyB;AAC/C,QAAM;AAAA,IACJ,OAAO,EAAE,SAAS,UAAU,gBAAgB;AAAA,IAC5C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,EAAE,iBAAkD;AAE1D,QAAM,cAAc,YAClB,CAAC,QAAmB,MAAa;AAC/B,QAAI,SAAS;AAAS,eAAS,QAAQ,QAAQ,OAAO;AACtD,aAAS,OAAO;AAChB,aAAS,OAAO;AAChB,mBAAe;AACf,aAAS,SAAS;AAClB,MAAE;AACF,MAAE;AAAA,KAEJ,CAAC,UAAU,UAAU,gBAAgB;AAGvC,QAAM,oBAAoB,YAAY,CAAC,MAAuC;AAC5E,MAAE;AAAA,KACD;AAEH,QAAM,eAAe,QACnB,MACE,aAAa,IAAI,CAAC,UAAU;AAC1B,UAAM,SAAS,QAAQ,MAAM;AAC7B,UAAM,eAAe;AAAA,MACnB,eAAe,EAAE,UAAU,YAAY,KAAK,MAAM,OAAO,MAAM,GAAG,OAAO;AAAA,MACzE,KAAK,GAAG,OAAO;AAAA,MACf,UAAU,MAAM;AAAA;AAGlB,QAAI,OAAO,SAAS,UAAU;AAC5B,aACE,qCAAC,gBAAD,iCACM,eADN;AAAA,QAEE,OAAO,OAAO;AAAA,QACd,OAAO,OAAO;AAAA,QACd,YAAY,uBAAuB;AAAA,QACnC,UAAU,OAAO;AAAA,QACjB,SAAS,CAAC,MAAa,YAAY,QAAQ;AAAA,QAC3C,aAAa;AAAA,QACb,UAAU,OAAO,SAAS;AAAA,QAC1B,YAAY,WAAW,gBAAgB;AAAA;AAAA;AAI7C,WAAO;AAAA,MAEX,CAAC,SAAS,gBAAgB,gBAAgB,UAAU;AAGtD,SAAO;AAAA;",
   "names": []
 }

package/dist/esm/controlled-checkbox/react-desc-prop-types.js

@@ -0,0 +1,36 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import * as React from "react";
+import { PropTypes, globalAttributesPropTypes } from "@elliemae/ds-props-helpers";
+const defaultProps = {
+  hasError: false,
+  tabIndex: void 0,
+  checked: false
+};
+const propTypes = __spreadProps(__spreadValues({}, globalAttributesPropTypes), {
+  label: PropTypes.string.description("Checkbox Label property. This label is also going to be used as an aria-label for screen readers."),
+  hasError: PropTypes.bool.description("Whether the checkbox has error or not."),
+  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description("Checkbox input ref.")
+});
+export {
+  defaultProps,
+  propTypes
+};
+//# sourceMappingURL=react-desc-prop-types.js.map

package/dist/esm/controlled-checkbox/react-desc-prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-checkbox/react-desc-prop-types.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { GlobalAttributesT, PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nexport declare namespace DSControlledCheckboxT {\n  export interface DefaultProps {\n    checked: boolean | 'mixed';\n    tabIndex?: number;\n    hasError?: boolean;\n    'data-testid'?: string;\n  }\n\n  export interface OptionalProps {\n    innerRef: React.RefObject<HTMLInputElement> | React.LegacyRef<HTMLInputElement>;\n  }\n\n  export interface LegacyAriaProps {\n    ariaControls: string;\n    ariaLabel: string;\n  }\n\n  export interface Props extends DefaultProps, OptionalProps, Omit<GlobalAttributesT, 'checked'>, LegacyAriaProps {}\n\n  export interface StyledCheckBoxT {\n    checked: boolean | 'mixed';\n    readOnly?: boolean;\n    hasError?: boolean;\n    disabled?: boolean;\n  }\n\n  export interface StyledLabelT {\n    disabled?: boolean;\n    readOnly?: boolean;\n    checked: boolean | 'mixed';\n  }\n}\n\nexport const defaultProps: Partial<DSControlledCheckboxT.Props> = {\n  hasError: false,\n  tabIndex: undefined,\n  checked: false,\n};\n\nexport const propTypes = {\n  ...globalAttributesPropTypes,\n  label: PropTypes.string.description(\n    'Checkbox Label property. This label is also going to be used as an aria-label for screen readers.',\n  ),\n  hasError: PropTypes.bool.description('Whether the checkbox has error or not.'),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Checkbox input ref.'),\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AAkCO,MAAM,eAAqD;AAAA,EAChE,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA;AAGJ,MAAM,YAAY,iCACpB,4BADoB;AAAA,EAEvB,OAAO,UAAU,OAAO,YACtB;AAAA,EAEF,UAAU,UAAU,KAAK,YAAY;AAAA,EACrC,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,SAAS,YAAY;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-combobox/ComboBox.js

@@ -1,22 +1,20 @@
 import * as React from "react";
 import React2 from "react";
-import { describe } from "react-desc";
-import { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-props-helpers";
+import { describe } from "@elliemae/ds-props-helpers";
 import { useComboBox } from "./config/useComboBox";
 import { Container } from "./parts/container";
-import { propTypes } from "./propTypes";
-import { ComboBoxContext, defaultProps } from "./ComboBoxCTX";
+import { ComboBoxContext } from "./ComboBoxCTX";
+import { ComboboxPropTypes } from "./react-desc-prop-types";
 const DSComboBox = (props) => {
-  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
-  useValidateTypescriptPropTypes(propsWithDefault, propTypes);
   const ctx = useComboBox(props);
   return /* @__PURE__ */ React2.createElement(ComboBoxContext.Provider, {
     value: ctx
   }, /* @__PURE__ */ React2.createElement(Container, null));
 };
-DSComboBox.propTypes = propTypes;
+DSComboBox.propTypes = ComboboxPropTypes;
 const DSComboBoxWithSchema = describe(DSComboBox);
-DSComboBoxWithSchema.propTypes = propTypes;
+DSComboBoxWithSchema.propTypes = ComboboxPropTypes;
+DSComboBoxWithSchema.propTypes = ComboboxPropTypes;
 export {
   DSComboBox,
   DSComboBox as DSComboBoxV3,

package/dist/esm/controlled-combobox/ComboBox.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-combobox/ComboBox.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from 'react-desc';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { useComboBox } from './config/useComboBox';\nimport { Container } from './parts/container';\nimport { propTypes } from './propTypes';\nimport { ComboBoxContext, defaultProps } from './ComboBoxCTX';\nimport type { ComboBoxPropsT } from './index.d';\n\nconst DSComboBox = (props: ComboBoxPropsT): JSX.Element => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, propTypes);\n  const ctx = useComboBox(props);\n  return (\n    <ComboBoxContext.Provider value={ctx}>\n      <Container />\n    </ComboBoxContext.Provider>\n  );\n};\nDSComboBox.propTypes = propTypes;\nconst DSComboBoxWithSchema = describe(DSComboBox);\nDSComboBoxWithSchema.propTypes = propTypes;\n\nexport { DSComboBox, DSComboBoxWithSchema, DSComboBox as DSComboBoxV3 };\n"],
-  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAM,aAAa,CAAC,UAAuC;AACzD,QAAM,mBAAmB,6BAA6B,OAAO;AAE7D,iCAA+B,kBAAkB;AACjD,QAAM,MAAM,YAAY;AACxB,SACE,qCAAC,gBAAgB,UAAjB;AAAA,IAA0B,OAAO;AAAA,KAC/B,qCAAC,WAAD;AAAA;AAIN,WAAW,YAAY;AACvB,MAAM,uBAAuB,SAAS;AACtC,qBAAqB,YAAY;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { WeakValidationMap } from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { useComboBox } from './config/useComboBox';\nimport { Container } from './parts/container';\nimport { ComboBoxContext } from './ComboBoxCTX';\nimport { DSComboboxT, ComboboxPropTypes } from './react-desc-prop-types';\n\nconst DSComboBox: React.ComponentType<DSComboboxT.Props> = (props) => {\n  const ctx = useComboBox(props);\n  return (\n    <ComboBoxContext.Provider value={ctx}>\n      <Container />\n    </ComboBoxContext.Provider>\n  );\n};\nDSComboBox.propTypes = ComboboxPropTypes as WeakValidationMap<unknown>;\nconst DSComboBoxWithSchema = describe(DSComboBox);\n\nDSComboBoxWithSchema.propTypes = ComboboxPropTypes as WeakValidationMap<unknown>;\n\nDSComboBoxWithSchema.propTypes = ComboboxPropTypes as WeakValidationMap<unknown>;\n\nexport { DSComboBox, DSComboBoxWithSchema, DSComboBox as DSComboBoxV3 };\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,aAAqD,CAAC,UAAU;AACpE,QAAM,MAAM,YAAY;AACxB,SACE,qCAAC,gBAAgB,UAAjB;AAAA,IAA0B,OAAO;AAAA,KAC/B,qCAAC,WAAD;AAAA;AAIN,WAAW,YAAY;AACvB,MAAM,uBAAuB,SAAS;AAEtC,qBAAqB,YAAY;AAEjC,qBAAqB,YAAY;",
   "names": []
 }

package/dist/esm/controlled-combobox/ComboBoxCTX.js

@@ -13,7 +13,7 @@ const defaultProps = {
   onClearAll: noop,
   onSelectAll: noop,
   onCreate: noop,
-  withToggle: false,
+  onBlur: noop,
   withoutPortal: true,
   zIndex: 10,
   onChange: noop,
@@ -31,15 +31,12 @@ const defaultContext = {
   setHasFocus: noop,
   pillGroupRef: createRef(),
   setReferenceElement: noop,
-  inputRef: createRef(),
   listRef: createRef(),
   wrapperListRef: createRef(),
   controlsWrapperRef: createRef(),
   selectedOptionsRef: createRef(),
   selectAllCheckboxRef: createRef(),
   toggleSelectionButtonRef: createRef(),
-  showSelectedValue: false,
-  setShowSelectedValue: noop,
   focusOptionIdx: "",
   setCurrentOption: noop,
   showSelectedOptions: false,

package/dist/esm/controlled-combobox/ComboBoxCTX.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-combobox/ComboBoxCTX.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext, createRef } from 'react';\nimport { noop } from 'lodash';\nimport { ComboBoxPropsT, ComboBoxContextT } from './index.d';\n// eslint-disable-next-line @typescript-eslint/no-empty-function\n\nexport const defaultProps: ComboBoxPropsT = {\n  placeholder: '',\n  options: [],\n  selectedValues: null,\n  hasError: false,\n  inline: false,\n  autoFocus: false,\n  startPlacementPreference: 'bottom-start',\n  placementOrderPreference: ['bottom-start', 'bottom-end'],\n  onClearAll: noop,\n  onSelectAll: noop,\n  onCreate: noop,\n  withToggle: false,\n  withoutPortal: true,\n  zIndex: 10,\n  onChange: noop,\n  onKeyDown: noop,\n  onFilter: noop,\n  onMenuOpen: noop,\n};\nconst defaultContext = {\n  props: defaultProps,\n  showPopover: false,\n  setShowPopover: noop,\n  scrollOptionIntoView: noop,\n  referenceElement: null,\n  hasFocus: false,\n  setHasFocus: noop,\n  pillGroupRef: createRef<HTMLDivElement>(),\n  setReferenceElement: noop,\n  inputRef: createRef<HTMLInputElement>(),\n  listRef: createRef<HTMLDivElement>(),\n  wrapperListRef: createRef<HTMLDivElement>(),\n  controlsWrapperRef: createRef<HTMLInputElement>(),\n  selectedOptionsRef: createRef<HTMLInputElement>(),\n  selectAllCheckboxRef: createRef<HTMLInputElement>(),\n  toggleSelectionButtonRef: createRef<HTMLButtonElement>(),\n  showSelectedValue: false,\n  setShowSelectedValue: noop,\n  focusOptionIdx: '',\n  setCurrentOption: noop,\n  showSelectedOptions: false,\n  setShowSelectedOptions: noop,\n};\n/** Context for cross component communication */\nexport const ComboBoxContext = createContext<ComboBoxContextT>(defaultContext);\n\nexport default ComboBoxContext;\n"],
-  "mappings": "AAAA;ACAA;AACA;AAIO,MAAM,eAA+B;AAAA,EAC1C,aAAa;AAAA,EACb,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,0BAA0B;AAAA,EAC1B,0BAA0B,CAAC,gBAAgB;AAAA,EAC3C,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA;AAEd,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,aAAa;AAAA,EACb,cAAc;AAAA,EACd,qBAAqB;AAAA,EACrB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,wBAAwB;AAAA;AAGnB,MAAM,kBAAkB,cAAgC;AAE/D,IAAO,sBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext, createRef } from 'react';\nimport { noop } from 'lodash';\nimport { DSComboboxT } from './react-desc-prop-types';\nimport { DSComboboxInternalsT } from './sharedTypes';\n// eslint-disable-next-line @typescript-eslint/no-empty-function\n\nexport const defaultProps = {\n  placeholder: '',\n  options: [],\n  selectedValues: null,\n  hasError: false,\n  inline: false,\n  autoFocus: false,\n  startPlacementPreference: 'bottom-start',\n  placementOrderPreference: ['bottom-start', 'bottom-end'],\n  onClearAll: noop,\n  onSelectAll: noop,\n  onCreate: noop,\n  onBlur: noop,\n  withoutPortal: true,\n  zIndex: 10,\n  onChange: noop,\n  onKeyDown: noop,\n  onFilter: noop,\n  onMenuOpen: noop,\n} as unknown as DSComboboxT.Props;\n\nconst defaultContext: DSComboboxInternalsT.ComboBoxContextT = {\n  props: defaultProps,\n  showPopover: false,\n  setShowPopover: noop,\n  scrollOptionIntoView: noop,\n  referenceElement: null,\n  hasFocus: false,\n  setHasFocus: noop,\n  pillGroupRef: createRef<HTMLDivElement>(),\n  setReferenceElement: noop,\n  listRef: createRef<HTMLDivElement>(),\n  wrapperListRef: createRef<HTMLDivElement>(),\n  controlsWrapperRef: createRef<HTMLInputElement>(),\n  selectedOptionsRef: createRef<HTMLInputElement>(),\n  selectAllCheckboxRef: createRef<HTMLInputElement>(),\n  toggleSelectionButtonRef: createRef<HTMLButtonElement>(),\n  focusOptionIdx: '',\n  setCurrentOption: noop,\n  showSelectedOptions: false,\n  setShowSelectedOptions: noop,\n};\n/** Context for cross component communication */\nexport const ComboBoxContext = createContext(defaultContext);\n\nexport default ComboBoxContext;\n"],
+  "mappings": "AAAA;ACAA;AACA;AAKO,MAAM,eAAe;AAAA,EAC1B,aAAa;AAAA,EACb,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,0BAA0B;AAAA,EAC1B,0BAA0B,CAAC,gBAAgB;AAAA,EAC3C,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA;AAGd,MAAM,iBAAwD;AAAA,EAC5D,OAAO;AAAA,EACP,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,aAAa;AAAA,EACb,cAAc;AAAA,EACd,qBAAqB;AAAA,EACrB,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,wBAAwB;AAAA;AAGnB,MAAM,kBAAkB,cAAc;AAE7C,IAAO,sBAAQ;",
   "names": []
 }

package/dist/esm/controlled-combobox/ComboboxDataTestids.js

@@ -8,7 +8,8 @@ const ComboboxDataTestid = {
   DROPDOWN: "combobox-dropdown-btn",
   OPTION: "combobox-option",
   SELECT_ALL_CHECKBOX: "combobox-select-all-checkbox",
-  SHOW_SELECTED_OPTIONS_TOGGLE: "combobox-selected-options-toggle"
+  SHOW_SELECTED_OPTIONS_TOGGLE: "combobox-selected-options-toggle",
+  ALLY_SELECTED_VALUES: "combobox-ally-selected-values"
 };
 export {
   ComboboxDataTestid

package/dist/esm/controlled-combobox/ComboboxDataTestids.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-combobox/ComboboxDataTestids.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const ComboboxDataTestid = {\n  INPUT: 'combobox-input',\n  LIST: 'combobox-menu-list',\n  SELECTED_VALUES: 'combobox-selected-values',\n  SELECT_ALL_BUTTON: 'combobox-all-btn',\n  CLEAR_ALL_BUTTON: 'combobox-clear-btn',\n  DROPDOWN: 'combobox-dropdown-btn',\n  OPTION: 'combobox-option',\n  SELECT_ALL_CHECKBOX: 'combobox-select-all-checkbox',\n  SHOW_SELECTED_OPTIONS_TOGGLE: 'combobox-selected-options-toggle',\n};\n"],
-  "mappings": "AAAA;ACAO,MAAM,qBAAqB;AAAA,EAChC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,qBAAqB;AAAA,EACrB,8BAA8B;AAAA;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const ComboboxDataTestid = {\n  INPUT: 'combobox-input',\n  LIST: 'combobox-menu-list',\n  SELECTED_VALUES: 'combobox-selected-values',\n  SELECT_ALL_BUTTON: 'combobox-all-btn',\n  CLEAR_ALL_BUTTON: 'combobox-clear-btn',\n  DROPDOWN: 'combobox-dropdown-btn',\n  OPTION: 'combobox-option',\n  SELECT_ALL_CHECKBOX: 'combobox-select-all-checkbox',\n  SHOW_SELECTED_OPTIONS_TOGGLE: 'combobox-selected-options-toggle',\n  ALLY_SELECTED_VALUES: 'combobox-ally-selected-values',\n};\n"],
+  "mappings": "AAAA;ACAO,MAAM,qBAAqB;AAAA,EAChC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,qBAAqB;AAAA,EACrB,8BAA8B;AAAA,EAC9B,sBAAsB;AAAA;",
   "names": []
 }

package/dist/esm/controlled-combobox/config/useComboBox.js

@@ -1,17 +1,40 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import * as React from "react";
 import { useMemo, useState, useRef, useCallback } from "react";
-import { noop } from "lodash";
-import { v4 as uuidv4 } from "uuid";
 import { useVirtual } from "react-virtual";
-import { useGetComboBoxWithDefaultsProps } from "./useGetPropsWithDefault";
+import { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-props-helpers";
+import { defaultProps } from "../ComboBoxCTX";
+import { ComboboxPropTypes } from "../react-desc-prop-types";
+import { useCorrectOptions } from "./useCorrectOptions";
 const useComboBox = (props) => {
+  const defaultPropsWithInnerRef = __spreadProps(__spreadValues({}, defaultProps), {
+    innerRef: useRef(null)
+  });
+  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultPropsWithInnerRef);
+  useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes);
   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);
@@ -19,60 +42,21 @@ const useComboBox = (props) => {
   const selectAllCheckboxRef = useRef(null);
   const toggleSelectionButtonRef = useRef(null);
   const pillGroupRef = useRef(null);
-  const propsWithDefaults = useGetComboBoxWithDefaultsProps(props);
-  const { options, selectedValues, onCreate } = propsWithDefaults;
-  const selectedValuesWithSections = useCallback(() => {
-    const multiSelectedValue = selectedValues;
-    const items = [];
-    options.forEach((option) => {
-      const isSelectedValue = multiSelectedValue.find((item) => item.dsId === option.dsId);
-      if (isSelectedValue) {
-        items.push(option);
-      }
-      if (option.type === "section") {
-        if (items[items.length - 1]?.type === "section") {
-          items[items.length - 1] = option;
-        } else {
-          items.push(option);
-        }
-      }
-    });
-    if (items[items.length - 1]?.type === "section") {
-      items.pop();
-    }
-    return items;
-  }, [options, selectedValues]);
-  const correctOptions = useMemo(() => {
-    if (showSelectedOptions && Array.isArray(selectedValues) && selectedValues.length > 0) {
-      return selectedValuesWithSections();
-    }
-    if (onCreate !== noop && inputRef.current && inputRef.current.value !== "") {
-      const creatableUuid = uuidv4();
-      const creatableItem = {
-        dsId: `creatable-${creatableUuid}`,
-        label: inputRef.current?.value,
-        type: "creatable"
-      };
-      return [creatableItem, ...options];
-    }
-    return options;
-  }, [options, onCreate, selectedValuesWithSections, selectedValues, showSelectedOptions]);
+  const correctOptions = useCorrectOptions(propsWithDefaults, showSelectedOptions);
   const virtualListHelpers = useVirtual({
     size: correctOptions.length,
     parentRef: listRef,
     overscan: 15,
     paddingStart: 0
   });
-  const scrollOptionIntoView = useCallback((dsId, opts = { align: "center" }) => {
-    virtualListHelpers.scrollToIndex(correctOptions.findIndex((opt) => opt.dsId === dsId), opts);
+  const scrollOptionIntoView = useCallback((dsId) => {
+    virtualListHelpers.scrollToIndex(correctOptions.findIndex((opt) => opt.dsId === dsId), { align: "center" });
   }, [correctOptions, virtualListHelpers]);
   const ctx = useMemo(() => ({
-    props: { ...propsWithDefaults, options: correctOptions },
+    props: __spreadProps(__spreadValues({}, propsWithDefaults), { options: correctOptions }),
     virtualListHelpers,
     showPopover,
     referenceElement,
-    inputRef,
-    showSelectedValue,
     listRef,
     focusOptionIdx,
     selectedOptionsRef,
@@ -87,7 +71,6 @@ const useComboBox = (props) => {
     setHasFocus,
     setCurrentOption,
     scrollOptionIntoView,
-    setShowSelectedValue,
     setReferenceElement,
     setShowPopover
   }), [
@@ -96,13 +79,11 @@ const useComboBox = (props) => {
     propsWithDefaults,
     virtualListHelpers,
     focusOptionIdx,
-    showSelectedValue,
     wrapperListRef,
     showSelectedOptions,
     showPopover,
     pillGroupRef,
     referenceElement,
-    inputRef,
     selectedOptionsRef,
     controlsWrapperRef,
     selectAllCheckboxRef,

package/dist/esm/controlled-combobox/config/useComboBox.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-combobox/config/useComboBox.tsx"],
-  "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 } from 'react';\nimport { noop } from 'lodash';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { useVirtual } from 'react-virtual';\nimport { useGetComboBoxWithDefaultsProps } from './useGetPropsWithDefault';\nimport type { ComboBoxPropsT, ComboBoxContextT, CBOptionT, CBItemCreatableOption } from '../index.d';\n\nexport const useComboBox = (props: Partial<ComboBoxPropsT>): ComboBoxContextT => {\n  const [showPopover, setShowPopover] = useState<boolean>(false);\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n  const [showSelectedValue, setShowSelectedValue] = useState<boolean>(false);\n  const [showSelectedOptions, setShowSelectedOptions] = useState<boolean>(false);\n\n  const [hasFocus, setHasFocus] = useState<boolean>(false);\n  const [focusOptionIdx, setCurrentOption] = useState<string>('');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n  const wrapperListRef = useRef<HTMLDivElement>(null);\n\n  const selectedOptionsRef = useRef<HTMLDivElement>(null);\n  const controlsWrapperRef = useRef<HTMLDivElement>(null);\n  const selectAllCheckboxRef = useRef<HTMLInputElement>(null);\n  const toggleSelectionButtonRef = useRef<HTMLButtonElement>(null);\n  const pillGroupRef = useRef<HTMLDivElement>(null);\n\n  const propsWithDefaults = useGetComboBoxWithDefaultsProps(props);\n  const { options, selectedValues, onCreate } = propsWithDefaults;\n\n  // ---------------------------------------------------------------------------\n  // Menu Options with/out selected filter\n  // ---------------------------------------------------------------------------\n\n  const selectedValuesWithSections = useCallback(() => {\n    const multiSelectedValue = selectedValues as CBOptionT[];\n    const items = [] as CBOptionT[];\n\n    options.forEach((option) => {\n      const isSelectedValue = multiSelectedValue.find((item) => item.dsId === option.dsId);\n      if (isSelectedValue) {\n        items.push(option);\n      }\n\n      if (option.type === 'section') {\n        if (items[items.length - 1]?.type === 'section') {\n          items[items.length - 1] = option;\n        } else {\n          items.push(option);\n        }\n      }\n    });\n    if (items[items.length - 1]?.type === 'section') {\n      items.pop();\n    }\n\n    return items;\n  }, [options, selectedValues]);\n\n  const correctOptions = useMemo(() => {\n    if (showSelectedOptions && Array.isArray(selectedValues) && selectedValues.length > 0) {\n      return selectedValuesWithSections();\n    }\n    if (onCreate !== noop && inputRef.current && inputRef.current.value !== '') {\n      const creatableUuid = uuidv4();\n      const creatableItem: CBItemCreatableOption = {\n        dsId: `creatable-${creatableUuid}`,\n        label: inputRef.current?.value,\n        type: 'creatable',\n      };\n      return [creatableItem, ...options];\n    }\n    return options;\n  }, [options, onCreate, selectedValuesWithSections, selectedValues, showSelectedOptions]);\n\n  // ===========================================================================\n  // Virtualization setup\n  // ===========================================================================\n\n  const virtualListHelpers: ReturnType<typeof useVirtual> = useVirtual({\n    size: correctOptions.length,\n    parentRef: listRef,\n    overscan: 15,\n    paddingStart: 0,\n  });\n\n  // ===========================================================================\n  // Scroll into view function\n  // ===========================================================================\n  const scrollOptionIntoView = useCallback(\n    (dsId: string, opts = { align: 'center' }) => {\n      virtualListHelpers.scrollToIndex(\n        correctOptions.findIndex((opt) => opt.dsId === dsId),\n        opts,\n      );\n    },\n    [correctOptions, virtualListHelpers],\n  );\n\n  const ctx = useMemo(\n    () => ({\n      props: { ...propsWithDefaults, options: correctOptions },\n      virtualListHelpers,\n      showPopover,\n      referenceElement,\n      inputRef,\n      showSelectedValue,\n      listRef,\n      focusOptionIdx,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      selectAllCheckboxRef,\n      toggleSelectionButtonRef,\n      hasFocus,\n      pillGroupRef,\n      showSelectedOptions,\n      wrapperListRef,\n      setShowSelectedOptions,\n      setHasFocus,\n      setCurrentOption,\n      scrollOptionIntoView,\n      setShowSelectedValue,\n      setReferenceElement,\n      setShowPopover,\n    }),\n    [\n      scrollOptionIntoView,\n      correctOptions,\n      propsWithDefaults,\n      virtualListHelpers,\n      focusOptionIdx,\n      showSelectedValue,\n      wrapperListRef,\n      showSelectedOptions,\n      showPopover,\n      pillGroupRef,\n      referenceElement,\n      inputRef,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      selectAllCheckboxRef,\n      toggleSelectionButtonRef,\n      hasFocus,\n      listRef,\n    ],\n  );\n\n  return ctx;\n};\n"],
-  "mappings": "AAAA;ACIA;AACA;AACA;AAEA;AACA;AAGO,MAAM,cAAc,CAAC,UAAqD;AAC/E,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AACxD,QAAM,CAAC,kBAAkB,uBAAuB,SAA6B;AAC7E,QAAM,CAAC,mBAAmB,wBAAwB,SAAkB;AACpE,QAAM,CAAC,qBAAqB,0BAA0B,SAAkB;AAExE,QAAM,CAAC,UAAU,eAAe,SAAkB;AAClD,QAAM,CAAC,gBAAgB,oBAAoB,SAAiB;AAC5D,QAAM,WAAW,OAAyB;AAC1C,QAAM,UAAU,OAAuB;AACvC,QAAM,iBAAiB,OAAuB;AAE9C,QAAM,qBAAqB,OAAuB;AAClD,QAAM,qBAAqB,OAAuB;AAClD,QAAM,uBAAuB,OAAyB;AACtD,QAAM,2BAA2B,OAA0B;AAC3D,QAAM,eAAe,OAAuB;AAE5C,QAAM,oBAAoB,gCAAgC;AAC1D,QAAM,EAAE,SAAS,gBAAgB,aAAa;AAM9C,QAAM,6BAA6B,YAAY,MAAM;AACnD,UAAM,qBAAqB;AAC3B,UAAM,QAAQ;AAEd,YAAQ,QAAQ,CAAC,WAAW;AAC1B,YAAM,kBAAkB,mBAAmB,KAAK,CAAC,SAAS,KAAK,SAAS,OAAO;AAC/E,UAAI,iBAAiB;AACnB,cAAM,KAAK;AAAA;AAGb,UAAI,OAAO,SAAS,WAAW;AAC7B,YAAI,MAAM,MAAM,SAAS,IAAI,SAAS,WAAW;AAC/C,gBAAM,MAAM,SAAS,KAAK;AAAA,eACrB;AACL,gBAAM,KAAK;AAAA;AAAA;AAAA;AAIjB,QAAI,MAAM,MAAM,SAAS,IAAI,SAAS,WAAW;AAC/C,YAAM;AAAA;AAGR,WAAO;AAAA,KACN,CAAC,SAAS;AAEb,QAAM,iBAAiB,QAAQ,MAAM;AACnC,QAAI,uBAAuB,MAAM,QAAQ,mBAAmB,eAAe,SAAS,GAAG;AACrF,aAAO;AAAA;AAET,QAAI,aAAa,QAAQ,SAAS,WAAW,SAAS,QAAQ,UAAU,IAAI;AAC1E,YAAM,gBAAgB;AACtB,YAAM,gBAAuC;AAAA,QAC3C,MAAM,aAAa;AAAA,QACnB,OAAO,SAAS,SAAS;AAAA,QACzB,MAAM;AAAA;AAER,aAAO,CAAC,eAAe,GAAG;AAAA;AAE5B,WAAO;AAAA,KACN,CAAC,SAAS,UAAU,4BAA4B,gBAAgB;AAMnE,QAAM,qBAAoD,WAAW;AAAA,IACnE,MAAM,eAAe;AAAA,IACrB,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc;AAAA;AAMhB,QAAM,uBAAuB,YAC3B,CAAC,MAAc,OAAO,EAAE,OAAO,eAAe;AAC5C,uBAAmB,cACjB,eAAe,UAAU,CAAC,QAAQ,IAAI,SAAS,OAC/C;AAAA,KAGJ,CAAC,gBAAgB;AAGnB,QAAM,MAAM,QACV,MAAO;AAAA,IACL,OAAO,KAAK,mBAAmB,SAAS;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO;AAAA;",
+  "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 } from 'react';\nimport { useVirtual } from 'react-virtual';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ComboBoxCTX';\nimport { DSComboboxT, ComboboxPropTypes } from '../react-desc-prop-types';\nimport { DSComboboxInternalsT } from '../sharedTypes';\nimport { useCorrectOptions } from './useCorrectOptions';\nexport const useComboBox = (props: DSComboboxT.Props): DSComboboxInternalsT.ComboBoxContextT => {\n  const defaultPropsWithInnerRef: DSComboboxT.Props = {\n    ...defaultProps,\n    innerRef: useRef(null),\n  };\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultPropsWithInnerRef);\n  useValidateTypescriptPropTypes(propsWithDefaults, ComboboxPropTypes);\n  const [showPopover, setShowPopover] = useState<boolean>(false);\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(null);\n  const [showSelectedOptions, setShowSelectedOptions] = useState<boolean>(false);\n\n  const [hasFocus, setHasFocus] = useState<boolean>(false);\n  const [focusOptionIdx, setCurrentOption] = useState<string>('');\n\n  const listRef = useRef<HTMLDivElement>(null);\n  const wrapperListRef = useRef<HTMLDivElement>(null);\n\n  const selectedOptionsRef = useRef<HTMLDivElement>(null);\n  const controlsWrapperRef = useRef<HTMLDivElement>(null);\n  const selectAllCheckboxRef = useRef<HTMLInputElement>(null);\n  const toggleSelectionButtonRef = useRef<HTMLButtonElement>(null);\n  const pillGroupRef = useRef<HTMLDivElement>(null);\n\n  // ---------------------------------------------------------------------------\n  // Menu Options with/out selected filter\n  // ---------------------------------------------------------------------------\n\n  const correctOptions = useCorrectOptions(propsWithDefaults, showSelectedOptions);\n  // ===========================================================================\n  // Virtualization setup\n  // ===========================================================================\n\n  const virtualListHelpers: ReturnType<typeof useVirtual> = useVirtual({\n    size: correctOptions.length,\n    parentRef: listRef,\n    overscan: 15,\n    paddingStart: 0,\n  });\n\n  // ===========================================================================\n  // Scroll into view function\n  // ===========================================================================\n  const scrollOptionIntoView = useCallback(\n    (dsId: string) => {\n      virtualListHelpers.scrollToIndex(\n        correctOptions.findIndex((opt) => opt.dsId === dsId),\n        { align: 'center' },\n      );\n    },\n    [correctOptions, virtualListHelpers],\n  );\n\n  const ctx = useMemo(\n    () => ({\n      props: { ...propsWithDefaults, options: correctOptions },\n      virtualListHelpers,\n      showPopover,\n      referenceElement,\n      listRef,\n      focusOptionIdx,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      selectAllCheckboxRef,\n      toggleSelectionButtonRef,\n      hasFocus,\n      pillGroupRef,\n      showSelectedOptions,\n      wrapperListRef,\n      setShowSelectedOptions,\n      setHasFocus,\n      setCurrentOption,\n      scrollOptionIntoView,\n      setReferenceElement,\n      setShowPopover,\n    }),\n    [\n      scrollOptionIntoView,\n      correctOptions,\n      propsWithDefaults,\n      virtualListHelpers,\n      focusOptionIdx,\n      wrapperListRef,\n      showSelectedOptions,\n      showPopover,\n      pillGroupRef,\n      referenceElement,\n      selectedOptionsRef,\n      controlsWrapperRef,\n      selectAllCheckboxRef,\n      toggleSelectionButtonRef,\n      hasFocus,\n      listRef,\n    ],\n  );\n\n  return ctx;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACIA;AACA;AACA;AACA;AACA;AAEA;AACO,MAAM,cAAc,CAAC,UAAoE;AAC9F,QAAM,2BAA8C,iCAC/C,eAD+C;AAAA,IAElD,UAAU,OAAO;AAAA;AAEnB,QAAM,oBAAoB,6BAA6B,OAAO;AAC9D,iCAA+B,mBAAmB;AAClD,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AACxD,QAAM,CAAC,kBAAkB,uBAAuB,SAA6B;AAC7E,QAAM,CAAC,qBAAqB,0BAA0B,SAAkB;AAExE,QAAM,CAAC,UAAU,eAAe,SAAkB;AAClD,QAAM,CAAC,gBAAgB,oBAAoB,SAAiB;AAE5D,QAAM,UAAU,OAAuB;AACvC,QAAM,iBAAiB,OAAuB;AAE9C,QAAM,qBAAqB,OAAuB;AAClD,QAAM,qBAAqB,OAAuB;AAClD,QAAM,uBAAuB,OAAyB;AACtD,QAAM,2BAA2B,OAA0B;AAC3D,QAAM,eAAe,OAAuB;AAM5C,QAAM,iBAAiB,kBAAkB,mBAAmB;AAK5D,QAAM,qBAAoD,WAAW;AAAA,IACnE,MAAM,eAAe;AAAA,IACrB,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc;AAAA;AAMhB,QAAM,uBAAuB,YAC3B,CAAC,SAAiB;AAChB,uBAAmB,cACjB,eAAe,UAAU,CAAC,QAAQ,IAAI,SAAS,OAC/C,EAAE,OAAO;AAAA,KAGb,CAAC,gBAAgB;AAGnB,QAAM,MAAM,QACV,MAAO;AAAA,IACL,OAAO,iCAAK,oBAAL,EAAwB,SAAS;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO;AAAA;",
   "names": []
 }

package/dist/esm/controlled-combobox/config/useCorrectOptions.js

@@ -0,0 +1,48 @@
+import * as React from "react";
+import { useMemo, useCallback } from "react";
+import { v4 as uuidv4 } from "uuid";
+import { noop } from "lodash";
+const useCorrectOptions = (propsWithDefaults, showSelectedOptions) => {
+  const { options, selectedValues, onCreate, innerRef } = propsWithDefaults;
+  const selectedValuesWithSections = useCallback(() => {
+    const multiSelectedValue = selectedValues;
+    const items = [];
+    options.forEach((option) => {
+      const isSelectedValue = multiSelectedValue.find((item) => item.dsId === option.dsId);
+      if (isSelectedValue) {
+        items.push(option);
+      }
+      if (option.type === "section") {
+        if (items[items.length - 1]?.type === "section") {
+          items[items.length - 1] = option;
+        } else {
+          items.push(option);
+        }
+      }
+    });
+    if (items[items.length - 1]?.type === "section") {
+      items.pop();
+    }
+    return items;
+  }, [options, selectedValues]);
+  const correctOptions = useMemo(() => {
+    if (showSelectedOptions && Array.isArray(selectedValues) && selectedValues.length > 0) {
+      return selectedValuesWithSections();
+    }
+    if (onCreate !== noop && innerRef.current && innerRef.current.value !== "" && options.findIndex((option) => option.type === "option" && option.label === innerRef?.current?.value) === -1) {
+      const creatableUuid = uuidv4();
+      const creatableItem = {
+        dsId: `creatable-${creatableUuid}`,
+        label: innerRef.current?.value,
+        type: "creatable"
+      };
+      return [creatableItem, ...options];
+    }
+    return options;
+  }, [options, onCreate, innerRef, selectedValuesWithSections, selectedValues, showSelectedOptions]);
+  return correctOptions;
+};
+export {
+  useCorrectOptions
+};
+//# sourceMappingURL=useCorrectOptions.js.map

package/dist/esm/controlled-combobox/config/useCorrectOptions.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-combobox/config/useCorrectOptions.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useCallback } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { noop } from 'lodash';\nimport { DSComboboxT } from '../react-desc-prop-types';\n\nconst useCorrectOptions = (propsWithDefaults: DSComboboxT.Props, showSelectedOptions: boolean) => {\n  const { options, selectedValues, onCreate, innerRef } = propsWithDefaults;\n\n  const selectedValuesWithSections = useCallback(() => {\n    const multiSelectedValue = selectedValues as DSComboboxT.OptionTypes[];\n    const items = [] as DSComboboxT.OptionTypes[];\n\n    options.forEach((option) => {\n      const isSelectedValue = multiSelectedValue.find((item) => item.dsId === option.dsId);\n      if (isSelectedValue) {\n        items.push(option);\n      }\n\n      if (option.type === 'section') {\n        if (items[items.length - 1]?.type === 'section') {\n          items[items.length - 1] = option;\n        } else {\n          items.push(option);\n        }\n      }\n    });\n    if (items[items.length - 1]?.type === 'section') {\n      items.pop();\n    }\n\n    return items;\n  }, [options, selectedValues]);\n\n  const correctOptions = useMemo(() => {\n    if (showSelectedOptions && Array.isArray(selectedValues) && selectedValues.length > 0) {\n      return selectedValuesWithSections();\n    }\n    if (\n      onCreate !== noop &&\n      innerRef.current &&\n      innerRef.current.value !== '' &&\n      options.findIndex((option) => option.type === 'option' && option.label === innerRef?.current?.value) === -1\n    ) {\n      const creatableUuid = uuidv4();\n      const creatableItem: DSComboboxT.ItemCreatableOption = {\n        dsId: `creatable-${creatableUuid}`,\n        label: innerRef.current?.value,\n        type: 'creatable',\n      };\n      return [creatableItem, ...options];\n    }\n    return options;\n  }, [options, onCreate, innerRef, selectedValuesWithSections, selectedValues, showSelectedOptions]);\n\n  return correctOptions;\n};\n\nexport { useCorrectOptions };\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAGA,MAAM,oBAAoB,CAAC,mBAAsC,wBAAiC;AAChG,QAAM,EAAE,SAAS,gBAAgB,UAAU,aAAa;AAExD,QAAM,6BAA6B,YAAY,MAAM;AACnD,UAAM,qBAAqB;AAC3B,UAAM,QAAQ;AAEd,YAAQ,QAAQ,CAAC,WAAW;AAC1B,YAAM,kBAAkB,mBAAmB,KAAK,CAAC,SAAS,KAAK,SAAS,OAAO;AAC/E,UAAI,iBAAiB;AACnB,cAAM,KAAK;AAAA;AAGb,UAAI,OAAO,SAAS,WAAW;AAC7B,YAAI,MAAM,MAAM,SAAS,IAAI,SAAS,WAAW;AAC/C,gBAAM,MAAM,SAAS,KAAK;AAAA,eACrB;AACL,gBAAM,KAAK;AAAA;AAAA;AAAA;AAIjB,QAAI,MAAM,MAAM,SAAS,IAAI,SAAS,WAAW;AAC/C,YAAM;AAAA;AAGR,WAAO;AAAA,KACN,CAAC,SAAS;AAEb,QAAM,iBAAiB,QAAQ,MAAM;AACnC,QAAI,uBAAuB,MAAM,QAAQ,mBAAmB,eAAe,SAAS,GAAG;AACrF,aAAO;AAAA;AAET,QACE,aAAa,QACb,SAAS,WACT,SAAS,QAAQ,UAAU,MAC3B,QAAQ,UAAU,CAAC,WAAW,OAAO,SAAS,YAAY,OAAO,UAAU,UAAU,SAAS,WAAW,IACzG;AACA,YAAM,gBAAgB;AACtB,YAAM,gBAAiD;AAAA,QACrD,MAAM,aAAa;AAAA,QACnB,OAAO,SAAS,SAAS;AAAA,QACzB,MAAM;AAAA;AAER,aAAO,CAAC,eAAe,GAAG;AAAA;AAE5B,WAAO;AAAA,KACN,CAAC,SAAS,UAAU,UAAU,4BAA4B,gBAAgB;AAE7E,SAAO;AAAA;",
+  "names": []
+}