@workday/canvas-kit-react 10.0.0-alpha.540-next.0 → 10.0.0-alpha.546-next.0

package/dist/commonjs/select/lib/hooks/useSelectModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectModel.d.ts","sourceRoot":"","sources":["../../../../../select/lib/hooks/useSelectModel.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYzB,CAAC"}

package/dist/commonjs/select/lib/hooks/useSelectModel.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectModel = void 0;
+const common_1 = require("@workday/canvas-kit-react/common");
+const combobox_1 = require("@workday/canvas-kit-react/combobox");
+/**
+ * `SelectModel` extends the {@link ComboboxModel}. Selecting items from
+ * the menu will dispatch an
+ * [input](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event) event on the
+ * input which should work with form libraries, automation and autofill.
+ *
+ * ```tsx
+ * const model = useSelectModel({items: ['Mobile', 'Phone', 'E-Mail']})
+ *
+ * <Select model={model}>
+ *   ...
+ * </Select>
+ * ```
+ */
+exports.useSelectModel = common_1.createModelHook({
+    defaultConfig: {
+        ...combobox_1.useComboboxModel.defaultConfig,
+        shouldVirtualize: false,
+    },
+    requiredConfig: {
+        ...combobox_1.useComboboxModel.requiredConfig,
+    },
+    contextOverride: combobox_1.useComboboxModel.Context,
+})(config => {
+    const model = combobox_1.useComboboxModel(config);
+    return model;
+});

package/dist/es6/collection/index.d.ts

@@ -15,6 +15,7 @@ export * from './lib/useGridModel';
 export * from './lib/useListActiveDescendant';
 export * from './lib/useListItemAllowChildStrings';
 export { ListBox, ListBoxProps } from './lib/ListBox';
+export { keyboardEventToCursorEvents } from './lib/keyUtils';
 export { singleSelectionManager, multiSelectionManager, isSelected, } from './lib/useSelectionListModel';
 export { wrappingNavigationManager, navigationManager } from './lib/useCursorListModel';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/collection/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../collection/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAE,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC1D,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,UAAU,GACX,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../collection/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAE,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC1D,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EAAC,2BAA2B,EAAC,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,UAAU,GACX,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,0BAA0B,CAAC"}

package/dist/es6/collection/index.js

@@ -15,5 +15,6 @@ export * from './lib/useGridModel';
 export * from './lib/useListActiveDescendant';
 export * from './lib/useListItemAllowChildStrings';
 export { ListBox } from './lib/ListBox';
+export { keyboardEventToCursorEvents } from './lib/keyUtils';
 export { singleSelectionManager, multiSelectionManager, isSelected, } from './lib/useSelectionListModel';
 export { wrappingNavigationManager, navigationManager } from './lib/useCursorListModel';

package/dist/es6/collection/lib/useBaseListModel.d.ts

@@ -10,7 +10,7 @@ export interface Item<T> {
     /**
      * Used by components that allow jumping to an item based on typing
      */
-    textValue?: string;
+    textValue: string;
 }
 export declare const useBaseListModel: (<TT_Special_Generic>(config?: (Partial<{
     /** IDREF of the list. Children ids can be derived from this id */

package/dist/es6/collection/lib/useBaseListModel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useBaseListModel.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useBaseListModel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAA+B,OAAO,EAAC,MAAM,kCAAkC,CAAC;AAEvF,oBAAY,WAAW,GAAG,YAAY,GAAG,UAAU,CAAC;AAEpD,eAAO,MAAM,YAAY,SAAU,GAAG,KAAG,MAExC,CAAC;AAEF,eAAO,MAAM,mBAAmB,SAAU,GAAG,KAAG,MAE/C,CAAC;AAEF,MAAM,WAAW,IAAI,CAAC,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,CAAC,CAAC;IACT;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAmDD,eAAO,MAAM,gBAAgB;IAGzB,kEAAkE;;IAElE;;;;;;OAMG;kBACW,OAAO;IAErB;;;;OAIG;yBACkB,OAAO;IAE5B;;;OAGG;;IAEH;;;;;OAKG;;IAEH;;;;;OAKG;;;IAhDL;;;;OAIG;WACI,OAAO,EAAE;;;cA+GY,OAAO;mBAAa,MAAM;;;;;;;;;;;;;;;;eArB1B,KAAK,OAAO,CAAC,EAAE;;;YAoCf,MAAM;;;;;;;;;;;;;;;;eApCN,KAAK,OAAO,CAAC,EAAE;;;eAuDV,MAAM;;;;;;;;;;;;;;;;eAvDX,KAAK,OAAO,CAAC,EAAE;;;;cAqBf,OAAO;mBAAa,MAAM;;;;;;;;;;;;;;;;eArB1B,KAAK,OAAO,CAAC,EAAE;;;YAoCf,MAAM;;;;;;;;;;;;;;;;eApCN,KAAK,OAAO,CAAC,EAAE;;;eAuDV,MAAM;;;;;;;;;;;;;;;;eAvDX,KAAK,OAAO,CAAC,EAAE;;;;;;;;;;;;;;;;;;eAAf,KAAK,OAAO,CAAC,EAAE;;;QAiBzC;;;WAGG;2BACgB;YAAC,IAAI,EAAE,OAAO,CAAC;YAAC,SAAS,EAAE,MAAM,CAAA;SAAC;QAWrD;;;WAGG;;gBACuB,MAAM;;QAUhC;;;;;;;;WAQG;+BACoB;YAAC,KAAK,EAAE,MAAM,CAAA;SAAC;;kBAhIxB,OAAO;;IATrB,kEAAkE;;IAElE;;;;;;OAMG;kBACW,OAAO;IAErB;;;;OAIG;yBACkB,OAAO;IAE5B;;;OAGG;;IAEH;;;;;OAKG;;IAEH;;;;;OAKG;;;IAhDL;;;;OAIG;WACI,OAAO,EAAE;;;;;;;;;;;;;;;;WA0FY,KAAK,OAAO,CAAC,EAAE;;IAiBzC;;;OAGG;uBACgB;QAAC,IAAI,EAAE,OAAO,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAC;IAWrD;;;OAGG;;YACuB,MAAM;;IAUhC;;;;;;;;OAQG;2BACoB;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC;;;;;;;;;;;;;;;;;eAvDZ,KAAK,OAAO,CAAC,EAAE;;;QAiBzC;;;WAGG;2BACgB;YAAC,IAAI,EAAE,OAAO,CAAC;YAAC,SAAS,EAAE,MAAM,CAAA;SAAC;QAWrD;;;WAGG;;gBACuB,MAAM;;QAUhC;;;;;;;;WAQG;+BACoB;YAAC,KAAK,EAAE,MAAM,CAAA;SAAC;;kBAhIxB,OAAO;EAsIvB,CAAC"}
+{"version":3,"file":"useBaseListModel.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useBaseListModel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAA+B,OAAO,EAAC,MAAM,kCAAkC,CAAC;AAEvF,oBAAY,WAAW,GAAG,YAAY,GAAG,UAAU,CAAC;AAEpD,eAAO,MAAM,YAAY,SAAU,GAAG,KAAG,MAExC,CAAC;AAEF,eAAO,MAAM,mBAAmB,SAAU,GAAG,KAAG,MAE/C,CAAC;AAEF,MAAM,WAAW,IAAI,CAAC,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,CAAC,CAAC;IACT;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;CACnB;AAmDD,eAAO,MAAM,gBAAgB;IAGzB,kEAAkE;;IAElE;;;;;;OAMG;kBACW,OAAO;IAErB;;;;OAIG;yBACkB,OAAO;IAE5B;;;OAGG;;IAEH;;;;;OAKG;;IAEH;;;;;OAKG;;;IAhDL;;;;OAIG;WACI,OAAO,EAAE;;;cA+GY,OAAO;mBAAa,MAAM;;;;;;;;;;;;;;;;eArB1B,KAAK,OAAO,CAAC,EAAE;;;YAoCf,MAAM;;;;;;;;;;;;;;;;eApCN,KAAK,OAAO,CAAC,EAAE;;;eAuDV,MAAM;;;;;;;;;;;;;;;;eAvDX,KAAK,OAAO,CAAC,EAAE;;;;cAqBf,OAAO;mBAAa,MAAM;;;;;;;;;;;;;;;;eArB1B,KAAK,OAAO,CAAC,EAAE;;;YAoCf,MAAM;;;;;;;;;;;;;;;;eApCN,KAAK,OAAO,CAAC,EAAE;;;eAuDV,MAAM;;;;;;;;;;;;;;;;eAvDX,KAAK,OAAO,CAAC,EAAE;;;;;;;;;;;;;;;;;;eAAf,KAAK,OAAO,CAAC,EAAE;;;QAiBzC;;;WAGG;2BACgB;YAAC,IAAI,EAAE,OAAO,CAAC;YAAC,SAAS,EAAE,MAAM,CAAA;SAAC;QAWrD;;;WAGG;;gBACuB,MAAM;;QAUhC;;;;;;;;WAQG;+BACoB;YAAC,KAAK,EAAE,MAAM,CAAA;SAAC;;kBAhIxB,OAAO;;IATrB,kEAAkE;;IAElE;;;;;;OAMG;kBACW,OAAO;IAErB;;;;OAIG;yBACkB,OAAO;IAE5B;;;OAGG;;IAEH;;;;;OAKG;;IAEH;;;;;OAKG;;;IAhDL;;;;OAIG;WACI,OAAO,EAAE;;;;;;;;;;;;;;;;WA0FY,KAAK,OAAO,CAAC,EAAE;;IAiBzC;;;OAGG;uBACgB;QAAC,IAAI,EAAE,OAAO,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAC;IAWrD;;;OAGG;;YACuB,MAAM;;IAUhC;;;;;;;;OAQG;2BACoB;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC;;;;;;;;;;;;;;;;;eAvDZ,KAAK,OAAO,CAAC,EAAE;;;QAiBzC;;;WAGG;2BACgB;YAAC,IAAI,EAAE,OAAO,CAAC;YAAC,SAAS,EAAE,MAAM,CAAA;SAAC;QAWrD;;;WAGG;;gBACuB,MAAM;;QAUhC;;;;;;;;WAQG;+BACoB;YAAC,KAAK,EAAE,MAAM,CAAA;SAAC;;kBAhIxB,OAAO;EAsIvB,CAAC"}

package/dist/es6/collection/lib/useBaseListModel.js

@@ -5,7 +5,7 @@ export const defaultGetId = (item) => {
     return typeof item === 'string' ? item : item.id || '';
 };
 export const defaultGetTextValue = (item) => {
-    return typeof item === 'string' ? item : item.text || '';
+    return typeof item === 'string' ? item : item.text || item.id || '';
 };
 // interface Collection<T> {
 //   getKeys(): string[];
@@ -91,7 +91,7 @@ export const useBaseListModel = createModelHook({
     const getIdRef = React.useRef(defaultGetId);
     const getTextValueRef = React.useRef(defaultGetTextValue);
     const getId = config.getId || defaultGetId;
-    const getTextValue = config.getTextValue || defaultGetTextValue;
+    const getTextValue = config.getTextValue || config.getId || defaultGetTextValue;
     getIdRef.current = getId;
     getTextValueRef.current = getTextValue;
     const [orientation] = React.useState(config.orientation || 'vertical');

package/dist/es6/collection/lib/useListItemRegister.js

@@ -15,7 +15,7 @@ import { useListModel } from './useListModel';
  * ```
  */
 export const useListItemRegister = createElemPropsHook(useListModel)(({ state, events }, ref, elemProps = {}) => {
-    var _a, _b, _c;
+    var _a, _b;
     const [localId, setLocalId] = React.useState(elemProps['data-id'] || ((_a = elemProps.item) === null || _a === void 0 ? void 0 : _a.id) || '');
     const { localRef, elementRef } = useLocalRef(useForkRef(ref, (_b = elemProps.virtual) === null || _b === void 0 ? void 0 : _b.measureRef));
     // if the list is virtual, force the correct styling. Without this, weird things happen...
@@ -65,7 +65,7 @@ export const useListItemRegister = createElemPropsHook(useListModel)(({ state, e
         disabled: elemProps.disabled || state.nonInteractiveIds.includes(localId) ? true : undefined,
         item: null,
         virtual: null,
-        'aria-setsize': (_c = elemProps.virtual) === null || _c === void 0 ? void 0 : _c.size,
+        'aria-setsize': elemProps.virtual ? state.UNSTABLE_virtual.totalSize : undefined,
         'aria-posinset': elemProps.virtual ? elemProps.item.index + 1 : undefined,
         style,
         id: slugify(`${state.id}-${localId}`),

package/dist/es6/collection/lib/useListRenderItem.js

@@ -25,7 +25,7 @@ export function useListRenderItems(model, children) {
                         // about capital letters in attributes. React thinks this will be applied to the DOM
                         // element even though we remove it later...
                         virtual,
-                        key: item.id,
+                        key: item.id || item.index,
                         item,
                     });
                 }
@@ -35,7 +35,7 @@ export function useListRenderItems(model, children) {
                 const child = children(item.value, item.index);
                 if (React.isValidElement(child)) {
                     return React.cloneElement(child, {
-                        key: item.id,
+                        key: item.id || item.index,
                         item: item.value,
                     });
                 }

package/dist/es6/combobox/index.d.ts

@@ -2,8 +2,5 @@ export { Combobox } from './lib/Combobox';
 export { useComboboxCard } from './lib/ComboboxCard';
 export { useComboboxMenuItem } from './lib/ComboboxMenuItem';
 export { useComboboxMenuList } from './lib/ComboboxMenuList';
-export { useComboboxInput } from './lib/ComboboxInput';
-export { useComboboxLoader } from './lib/useComboboxLoader';
-export { useComboboxModel } from './lib/useComboboxModel';
-export { useComboboxInputOpenWithArrowKeys as useComboboxOpenWithArrowKeys } from './lib/useComboboxInputOpenWithArrowKeys';
+export { useComboboxLoader, useComboboxModel, useComboboxInputOpenWithArrowKeys, useComboboxKeyboardTypeAhead, useSetPopupWidth, useComboboxMoveCursorToSelected, useComboboxInput, useComboboxListKeyboardHandler, useComboboxResetCursorToSelected, } from './lib/hooks';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../combobox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAC,eAAe,EAAC,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAC,gBAAgB,EAAC,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAC,iBAAiB,EAAC,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAC,gBAAgB,EAAC,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAC,iCAAiC,IAAI,4BAA4B,EAAC,MAAM,yCAAyC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../combobox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAC,eAAe,EAAC,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,iCAAiC,EACjC,4BAA4B,EAC5B,gBAAgB,EAChB,+BAA+B,EAC/B,gBAAgB,EAChB,8BAA8B,EAC9B,gCAAgC,GACjC,MAAM,aAAa,CAAC"}

package/dist/es6/combobox/index.js

@@ -2,7 +2,4 @@ export { Combobox } from './lib/Combobox';
 export { useComboboxCard } from './lib/ComboboxCard';
 export { useComboboxMenuItem } from './lib/ComboboxMenuItem';
 export { useComboboxMenuList } from './lib/ComboboxMenuList';
-export { useComboboxInput } from './lib/ComboboxInput';
-export { useComboboxLoader } from './lib/useComboboxLoader';
-export { useComboboxModel } from './lib/useComboboxModel';
-export { useComboboxInputOpenWithArrowKeys as useComboboxOpenWithArrowKeys } from './lib/useComboboxInputOpenWithArrowKeys';
+export { useComboboxLoader, useComboboxModel, useComboboxInputOpenWithArrowKeys, useComboboxKeyboardTypeAhead, useSetPopupWidth, useComboboxMoveCursorToSelected, useComboboxInput, useComboboxListKeyboardHandler, useComboboxResetCursorToSelected, } from './lib/hooks';

package/dist/es6/combobox/lib/Combobox.d.ts

@@ -6,8 +6,8 @@ export interface ComboboxProps {
     children: React.ReactNode;
 }
 export declare const Combobox: import("@workday/canvas-kit-react/common").ComponentM<ComboboxProps & Partial<{
-    mode: "multiple" | "single";
     shouldVirtualize: boolean;
+    mode: "multiple" | "single";
     returnFocusRef: React.RefObject<any> | undefined;
     initialFocusRef: React.RefObject<any> | undefined;
     id: string;
@@ -1766,7 +1766,7 @@ export declare const Combobox: import("@workday/canvas-kit-react/common").Compon
         navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
         getId: (item: any) => string;
     }> & {
-        Popper: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../menu/lib/MenuPopper").MenuPopperProps, {
+        Popper: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../..").PopperProps & React.RefAttributes<HTMLDivElement>, {
             state: {
                 stackRef: React.RefObject<HTMLDivElement>;
                 targetRef: React.RefObject<HTMLButtonElement>;
@@ -1991,7 +1991,13 @@ export declare const Combobox: import("@workday/canvas-kit-react/common").Compon
             selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
             navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
             getId: (item: any) => string;
-        }>;
+        }> & {
+            Icon: import("@emotion/styled").StyledComponent<import("../..").SystemIconProps & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "as" | keyof import("../..").SystemIconProps> & {
+                ref?: React.Ref<HTMLSpanElement> | undefined;
+            } & {
+                theme?: import("@emotion/react").Theme | undefined;
+            }, {}, {}>;
+        };
         Card: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("./ComboboxCard").ComboboxCardProps, {
             state: {
                 stackRef: React.RefObject<HTMLDivElement>;

package/dist/es6/combobox/lib/Combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIjB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
+{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIjB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}

package/dist/es6/combobox/lib/Combobox.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createContainer } from '@workday/canvas-kit-react/common';
-import { useComboboxModel } from './useComboboxModel';
+import { useComboboxModel } from './hooks';
 import { ComboboxInput } from './ComboboxInput';
 import { ComboboxMenu } from './ComboboxMenu';
 export const Combobox = createContainer()({

package/dist/es6/combobox/lib/ComboboxCard.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { createElemPropsHook, createSubcomponent, } from '@workday/canvas-kit-react/common';
 import { Menu } from '@workday/canvas-kit-react/menu';
-import { useComboboxModel } from './useComboboxModel';
+import { useComboboxModel } from './hooks';
 /**
  * This hook sets the `minWidth` style attribute to match the width of the
  * {@link ComboboxInput Combobox.Input} component.

package/dist/es6/combobox/lib/ComboboxInput.d.ts

@@ -1,109 +1,4 @@
 import React from 'react';
-/**
- * Adds all attributes necessary to start with a {@link ComboboxInput Combobox.Input}. It opens the
- * menu with arrow keys, uses {@link useListActiveDescendant}, and handles keyboard arrows to
- * navigate items of the menu. You may also compose this hook to add more specific behaviors for
- * your {@link ComboboxInput Combobox.Input}.
- */
-export declare const useComboboxInput: import("@workday/canvas-kit-react/common").BehaviorHook<{
-    state: {
-        stackRef: React.RefObject<HTMLDivElement>;
-        targetRef: React.RefObject<HTMLButtonElement>;
-        initialFocusRef: React.RefObject<any> | undefined;
-        returnFocusRef: React.RefObject<any> | undefined;
-        placement: import("@popperjs/core").Placement;
-        id: string;
-        visibility: "hidden" | "visible";
-        selectedIds: string[] | "all";
-        unselectedIds: string[];
-        cursorId: string;
-        columnCount: number;
-        pageSizeRef: React.MutableRefObject<number>;
-        cursorIndexRef: {
-            readonly current: number;
-        };
-        UNSTABLE_virtual: {
-            virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
-            totalSize: number;
-            scrollToOffset: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
-            scrollToIndex: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
-            measure: () => void;
-        };
-        UNSTABLE_defaultItemHeight: number;
-        containerRef: React.RefObject<HTMLDivElement>;
-        orientation: "horizontal" | "vertical";
-        indexRef: React.MutableRefObject<number>;
-        nonInteractiveIds: string[];
-        isVirtualized: boolean;
-        items: import("@workday/canvas-kit-react/collection").Item<any>[];
-        mode: "multiple" | "single";
-        value: string | undefined;
-        inputRef: React.RefObject<HTMLInputElement>;
-        width: number;
-    };
-    events: {
-        setWidth(width: number): void;
-        updatePlacement(data: {
-            placement: import("@popperjs/core").Placement;
-        }): void;
-        show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
-        hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
-        select(data: {
-            id: string;
-        }): void;
-        selectAll(): void;
-        unselectAll(): void;
-        goTo(data: {
-            id: string;
-        }): void;
-        goToNext(): void;
-        goToPrevious(): void;
-        goToPreviousRow(): void;
-        goToNextRow(): void;
-        goToFirst(): void;
-        goToLast(): void;
-        goToFirstOfRow(): void;
-        goToLastOfRow(): void;
-        goToNextPage(): void;
-        goToPreviousPage(): void;
-        registerItem(data: {
-            item: any;
-            textValue: string;
-        }): void;
-        unregisterItem(data: {
-            id: string;
-        }): void;
-        updateItemHeight(data: {
-            value: number;
-        }): void;
-    };
-    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
-    navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
-    getId: (item: any) => string;
-}, {
-    readonly onKeyDown: (event: React.KeyboardEvent) => void;
-    readonly onBlur: (event: React.FocusEvent) => void;
-    readonly onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    readonly onClick: (event: React.MouseEvent) => void;
-    readonly value: string | undefined;
-    readonly role: "combobox";
-    readonly 'aria-haspopup': true;
-    readonly 'aria-expanded': boolean;
-    readonly 'aria-autocomplete': "list";
-    readonly 'aria-controls': `${string}-list`;
-    readonly id: string;
-    readonly ref: (instance: unknown) => void;
-} & {
-    onKeyDown(event: React.KeyboardEvent<Element>): void;
-} & {
-    'aria-activedescendant': string | undefined;
-} & {
-    onKeyDown(event: React.KeyboardEvent<Element>): void;
-} & {
-    ref: (instance: unknown) => void;
-    onClick: (event: React.MouseEvent<Element, MouseEvent>) => void;
-}>;
 export declare const ComboboxInput: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"input", import("@workday/canvas-kit-react/text-input").TextInputProps> & {
     ErrorType: typeof import("@workday/canvas-kit-react/common").ErrorType;
 }, import("@workday/canvas-kit-react/text-input").TextInputProps, {
@@ -136,7 +31,7 @@ export declare const ComboboxInput: import("@workday/canvas-kit-react/common").E
         indexRef: React.MutableRefObject<number>;
         nonInteractiveIds: string[];
         isVirtualized: boolean;
-        items: import("@workday/canvas-kit-react/collection").Item<any>[];
+        items: import("../..").Item<any>[];
         mode: "multiple" | "single";
         value: string | undefined;
         inputRef: React.RefObject<HTMLInputElement>;

package/dist/es6/combobox/lib/ComboboxInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxInput.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAoB1B;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA2BN,mBAAmB;6BAiBtB,gBAAgB;;8BAIf,gBAAgB;;;;;;;;;;;;;;;;;;EAmBpC,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAKxB,CAAC"}
+{"version":3,"file":"ComboboxInput.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAKxB,CAAC"}

package/dist/es6/combobox/lib/ComboboxInput.js

@@ -1,74 +1,7 @@
 import React from 'react';
-import { composeHooks, createElemPropsHook, createSubcomponent, dispatchInputEvent, useForkRef, } from '@workday/canvas-kit-react/common';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
 import { TextInput } from '@workday/canvas-kit-react/text-input';
-import { usePopupTarget } from '@workday/canvas-kit-react/popup';
-import { useListActiveDescendant, useListKeyboardHandler, } from '@workday/canvas-kit-react/collection';
-import { useComboboxModel } from './useComboboxModel';
-import { useComboboxInputOpenWithArrowKeys } from './useComboboxInputOpenWithArrowKeys';
-/**
- * Adds all attributes necessary to start with a {@link ComboboxInput Combobox.Input}. It opens the
- * menu with arrow keys, uses {@link useListActiveDescendant}, and handles keyboard arrows to
- * navigate items of the menu. You may also compose this hook to add more specific behaviors for
- * your {@link ComboboxInput Combobox.Input}.
- */
-export const useComboboxInput = composeHooks(createElemPropsHook(useComboboxModel)((model, ref) => {
-    const elementRef = useForkRef(ref, model.state.inputRef);
-    React.useEffect(() => {
-        var _a;
-        if (model.state.cursorId && model.state.visibility === 'visible') {
-            const item = model.navigation.getItem(model.state.cursorId, model);
-            if (model.state.isVirtualized && item) {
-                model.state.UNSTABLE_virtual.scrollToIndex(item.index);
-            }
-            else {
-                const listboxId = (_a = model.state.inputRef.current) === null || _a === void 0 ? void 0 : _a.getAttribute('aria-controls');
-                if (listboxId) {
-                    const menuItem = document.querySelector(`[id="${listboxId}"] [data-id="${model.state.cursorId}"]`);
-                    if (menuItem) {
-                        menuItem.scrollIntoView({ block: 'nearest' });
-                    }
-                }
-            }
-        }
-        // we only want to run this effect if the cursor changes and not any other time
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [model.state.cursorId]);
-    return {
-        onKeyDown(event) {
-            if (event.key === 'Escape') {
-                dispatchInputEvent(event.currentTarget, '');
-            }
-            if (event.key === 'Enter' && !event.metaKey && model.state.visibility === 'visible') {
-                const element = document.querySelector(`[data-id="${model.state.cursorId}"]`);
-                if (element && (element === null || element === void 0 ? void 0 : element.getAttribute('aria-disabled')) !== 'true') {
-                    model.events.select({ id: model.state.cursorId });
-                    if (model.state.mode === 'single') {
-                        model.events.hide(event);
-                    }
-                }
-                // We don't want to submit forms while the combobox is open
-                event.preventDefault();
-            }
-        },
-        onBlur(event) {
-            model.events.hide(event);
-        },
-        onChange: model.onChange,
-        onClick(event) {
-            if (model.state.visibility === 'hidden') {
-                model.events.setWidth(event.currentTarget.clientWidth);
-            }
-        },
-        value: model.state.value,
-        role: 'combobox',
-        'aria-haspopup': true,
-        'aria-expanded': model.state.visibility === 'visible',
-        'aria-autocomplete': 'list',
-        'aria-controls': `${model.state.id}-list`,
-        id: model.state.id,
-        ref: elementRef,
-    };
-}), useComboboxInputOpenWithArrowKeys, useListActiveDescendant, useListKeyboardHandler, usePopupTarget);
+import { useComboboxModel, useComboboxInput } from './hooks';
 export const ComboboxInput = createSubcomponent(TextInput)({
     modelHook: useComboboxModel,
     elemPropsHook: useComboboxInput,

package/dist/es6/combobox/lib/ComboboxMenu.d.ts

@@ -87,9 +87,9 @@ export declare const ComboboxMenu: import("@workday/canvas-kit-react/common").El
      * {@link ComboboxInput Combobox.Input}. It renders a `div` element that is portalled to the
      * `document.body` which is controlled by the {@link PopupStack}. The `PopupStack` is not part
      * of React. This means no extra props given to this component will be forwarded to the `div`
-     * element, but the `ref` will be forwarded.
+     * element, but the `ref` will be forwarded. Also fallback placements for the popper with be either `top` or `bottom`.
      */
-    Popper: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../menu/lib/MenuPopper").MenuPopperProps, {
+    Popper: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../..").PopperProps & React.RefAttributes<HTMLDivElement>, {
         state: {
             stackRef: React.RefObject<HTMLDivElement>;
             targetRef: React.RefObject<HTMLButtonElement>;
@@ -340,7 +340,13 @@ export declare const ComboboxMenu: import("@workday/canvas-kit-react/common").El
         selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
         navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
         getId: (item: any) => string;
-    }>;
+    }> & {
+        Icon: import("@emotion/styled").StyledComponent<import("../..").SystemIconProps & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "as" | keyof import("../..").SystemIconProps> & {
+            ref?: React.Ref<HTMLSpanElement> | undefined;
+        } & {
+            theme?: import("@emotion/react").Theme | undefined;
+        }, {}, {}>;
+    };
     /**
      * `Combobox.Menu.Card` is a non-semantic element used to give the dropdown menu its distinct visual
      * cue that the dropdown menu is floating above other content. `Combobox.Menu.Card` usually contains a

package/dist/es6/combobox/lib/ComboboxMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGrB;;;;;;OAMG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;OAoBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAML,CAAC"}
+{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGrB;;;;;;OAMG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;OAoBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAML,CAAC"}

package/dist/es6/combobox/lib/ComboboxMenu.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import { createSubcomponent } from '@workday/canvas-kit-react/common';
 import { Menu } from '@workday/canvas-kit-react/menu';
-import { useComboboxModel } from './useComboboxModel';
+import { useComboboxModel } from './hooks';
 import { ComboboxMenuList } from './ComboboxMenuList';
 import { ComboboxMenuItem } from './ComboboxMenuItem';
 import { ComboboxCard } from './ComboboxCard';
+import { ComboboxMenuPopper } from './ComboboxPopper';
 export const ComboboxMenu = createSubcomponent()({
     modelHook: useComboboxModel,
     subComponents: {
@@ -13,9 +14,9 @@ export const ComboboxMenu = createSubcomponent()({
          * {@link ComboboxInput Combobox.Input}. It renders a `div` element that is portalled to the
          * `document.body` which is controlled by the {@link PopupStack}. The `PopupStack` is not part
          * of React. This means no extra props given to this component will be forwarded to the `div`
-         * element, but the `ref` will be forwarded.
+         * element, but the `ref` will be forwarded. Also fallback placements for the popper with be either `top` or `bottom`.
          */
-        Popper: Menu.Popper,
+        Popper: ComboboxMenuPopper,
         /**
          * The combobox menu list follows the Collections API. A list can either contain static items or
          * a render prop and `items` to the model.

package/dist/es6/combobox/lib/ComboboxMenuItem.d.ts

@@ -174,5 +174,11 @@ export declare const ComboboxMenuItem: import("@workday/canvas-kit-react/common"
     selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
     navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
     getId: (item: any) => string;
-}>;
+}> & {
+    Icon: import("@emotion/styled").StyledComponent<import("@workday/canvas-kit-react/icon").SystemIconProps & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "as" | keyof import("@workday/canvas-kit-react/icon").SystemIconProps> & {
+        ref?: React.Ref<HTMLSpanElement> | undefined;
+    } & {
+        theme?: import("@emotion/react").Theme | undefined;
+    }, {}, {}>;
+};
 //# sourceMappingURL=ComboboxMenuItem.d.ts.map

package/dist/es6/combobox/lib/ComboboxMenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenuItem.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAgB1B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCAGA,gBAAgB,CAAC,WAAW,CAAC;;;;;;;;;;;;;;EA8B5D,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAW3B,CAAC"}
+{"version":3,"file":"ComboboxMenuItem.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAkB1B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCAIA,gBAAgB,CAAC,WAAW,CAAC;;;;;;;;;;;;;;EAyB5D,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAc3B,CAAC"}

package/dist/es6/combobox/lib/ComboboxMenuItem.js

@@ -1,9 +1,10 @@
 import React from 'react';
-import { composeHooks, createElemPropsHook, createSubcomponent, } from '@workday/canvas-kit-react/common';
+import { composeHooks, createElemPropsHook, createSubcomponent, styled, } from '@workday/canvas-kit-react/common';
 import { StyledMenuItem, useMenuModel } from '@workday/canvas-kit-react/menu';
+import { SystemIcon } from '@workday/canvas-kit-react/icon';
 import { useListItemAllowChildStrings, useListItemRegister, } from '@workday/canvas-kit-react/collection';
 import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
-import { useComboboxModel } from './useComboboxModel';
+import { useComboboxModel } from './hooks';
 /**
  * This hook sets up accessibility and behavior of a {@link ComboboxMenuItem Combobox.Menu.Item}
  * component. It prevents focus when clicking so the focus stays on the
@@ -11,13 +12,9 @@ import { useComboboxModel } from './useComboboxModel';
  * also prevents items with an `aria-disabled` attribute from being selected. A `focus` CSS class is
  * added when the item has "focus" (when the cursor is on the item).
  */
-export const useComboboxMenuItem = composeHooks(createElemPropsHook(useMenuModel)((model, _, elemProps = {}) => {
+export const useComboboxMenuItem = composeHooks(createElemPropsHook(useMenuModel)((model, ref, elemProps = {}) => {
     const id = elemProps['data-id'] || '';
     const onMouseDown = (event) => {
-        if (model.state.nonInteractiveIds.includes(id) ||
-            event.currentTarget.hasAttribute('aria-disabled')) {
-            return;
-        }
         if (event.currentTarget.getAttribute('aria-disabled') !== 'true') {
             model.events.select({ id });
             if (model.state.mode === 'single') {
@@ -38,6 +35,9 @@ export const useComboboxMenuItem = composeHooks(createElemPropsHook(useMenuModel
 export const ComboboxMenuItem = createSubcomponent('li')({
     modelHook: useComboboxModel,
     elemPropsHook: useComboboxMenuItem,
+    subComponents: {
+        Icon: styled(SystemIcon)({ alignSelf: 'start' }),
+    },
 })(({ children, ...elemProps }, Element) => {
     return (React.createElement(OverflowTooltip, { placement: "left" },
         React.createElement(StyledMenuItem, Object.assign({ minHeight: "xl", as: Element }, elemProps), children)));

package/dist/es6/combobox/lib/ComboboxMenuList.js

@@ -3,7 +3,7 @@ import { commonColors } from '@workday/canvas-kit-react/tokens';
 import { createElemPropsHook, createSubcomponent } from '@workday/canvas-kit-react/common';
 import { useMenuModel } from '@workday/canvas-kit-react/menu';
 import { ListBox } from '@workday/canvas-kit-react/collection';
-import { useComboboxModel } from './useComboboxModel';
+import { useComboboxModel } from './hooks';
 /**
  * The `listbox` uses `aria-labelledby` pointing to the {@link ComboboxInput Combobox.Input}. This
  * input should be labelled by a form field label for proper accessibility. Use {@link FormField} to